/* Opaque brand shapes and a more expressive product/companion hierarchy. */
.hero-product-names{position:absolute;left:1%;top:4%;z-index:6;display:flex;align-items:flex-start;flex-direction:column;gap:8px;pointer-events:none}
.hero-product-names span{display:block;background:var(--orange);color:var(--cream);font-weight:900;border-radius:999px;box-shadow:3px 5px 0 var(--deep);white-space:nowrap;animation:name-float 7s ease-in-out infinite}
.hero-brand-pill{font-size:50px;line-height:1;padding:15px 30px;letter-spacing:-.04em;rotate:-7deg}
.hero-system-pill{font-size:28px;padding:14px 25px;rotate:-4deg;margin-left:-25px;animation-delay:-3s!important}
.hero-sticker{font-size:14px;padding:13px 18px;border-radius:20px;box-shadow:3px 4px 0 var(--deep)}
.hero-kel-speech{font-size:13px;padding:12px 17px;box-shadow:2px 3px 0 var(--purple);border:0}
@keyframes name-float{0%,100%{translate:0 0}50%{translate:0 -9px}}
@media(min-width:901px){
 .hero-rings{left:33%}
 .hero-art .parallax{left:-34%;right:0}
 .hero-art .hero-kel{--kel-base:clamp(230px,21vw,305px);width:calc(var(--kel-base)*3);max-width:none;left:17%;right:auto;bottom:-185px;z-index:4}
 .hero-art .hero-kel img{width:100%;max-width:none}
 .hero-sticker{left:-14%;bottom:11%;z-index:3}
 .hero-kel-speech{right:0;bottom:7%;z-index:7;animation-duration:6s}
 .hero-art .spark-one{right:38%;top:13%}.hero-art .spark-two{left:-4%;bottom:30%}
}
@media(min-width:901px) and (max-width:1180px){.hero-art .hero-kel{--kel-base:245px;left:7%;bottom:-165px}.hero-brand-pill{font-size:44px}.hero-system-pill{font-size:23px}.hero-kel-speech{right:-4%;bottom:8%}}
/* Two opposing corners echo the supplied reference; tips point into the pill. */
.feature-tag:before,.feature-tag:after,.feature-tag:nth-of-type(even):before{display:block;content:'';width:47px;height:47px;mask:url('assets/inward-burst.svg') center/contain no-repeat;background:var(--orange);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s;transform:none}
.feature-tag:before,.feature-tag:nth-of-type(even):before{left:-37px;right:auto;top:-37px;bottom:auto}
.feature-tag:after{right:-37px;left:auto;bottom:-37px;top:auto;transform:rotate(180deg)}
.feature-tag:hover:before,.feature-tag:focus-visible:before,.feature-tag[aria-pressed=true]:before,.feature-tag:nth-of-type(even):hover:before,.feature-tag:nth-of-type(even):focus-visible:before{opacity:1;visibility:visible;transform:none}
.feature-tag:hover:after,.feature-tag:focus-visible:after,.feature-tag[aria-pressed=true]:after{opacity:1;visibility:visible;transform:rotate(180deg)}
.feature-tag{transform-origin:left center}
.tag-dock,.tag-feedback,.tag-material{transform-origin:right center}
.feature-tag:hover,.feature-tag:focus-visible,.feature-tag[aria-pressed=true]{scale:1.7;z-index:12}
.feature-tag span{box-shadow:3px 5px 0 var(--purple)}
.feature-tag[aria-pressed=true] span{box-shadow:3px 5px 0 var(--purple)}
.arch-rings i{background:var(--deep);opacity:1}.arch-rings i:nth-child(2){background:var(--purple)}.arch-rings i:nth-child(3){background:var(--lavender)}
.breathing-rings i:first-child,.hero-rings i:first-child{background:var(--lavender);opacity:1}
.breathing-rings i:nth-child(2){background:var(--purple)}.breathing-rings i:nth-child(3){background:var(--deep)}.breathing-rings i:nth-child(4){background:var(--purple)}
.anatomy-badge,.symptom,.app-bubble,.app-screen,.app-screen:hover{box-shadow:3px 5px 0 var(--purple)}
.hero-product,.product-main{filter:none}.product-stage[data-active=uv] .product-main{filter:none}
.navigation{background:var(--cream);backdrop-filter:none}
/* The supplied halftone image is used at full opacity. */
.film-section{background:var(--lavender) url('assets/film-pattern.png') center/cover no-repeat}
.film-heading{align-items:flex-start;max-width:1020px}
.film-label{transform:none;margin:0;align-self:flex-start;background:var(--orange);color:var(--cream);border:0;box-shadow:3px 4px 0 var(--deep)}
.film-kel-speech{position:absolute;right:calc(10% + var(--kel-width)*.88);bottom:calc(100% + 21px);z-index:5;white-space:nowrap;background:var(--cream);color:var(--deep);border:2px solid var(--deep);border-radius:999px;font-size:17px;font-weight:900;line-height:1.4;padding:14px 22px;box-shadow:3px 4px 0 var(--purple);rotate:-4deg}
.film-kel-speech:after{content:'';position:absolute;right:-9px;bottom:11px;width:14px;height:14px;background:var(--cream);border-right:2px solid var(--deep);border-top:2px solid var(--deep);rotate:45deg;border-radius:0 5px 0 0}
.film-note{display:table;margin:24px auto 0;padding:8px 16px;background:var(--cream);border-radius:999px}
@media(max-width:900px){.hero-brand-pill{font-size:39px}.hero-system-pill{font-size:23px;padding:13px 20px}.hero-product-names{top:2%;left:0}.hero-kel-speech{bottom:30%;right:0}.hero-sticker{font-size:13px}.film-kel-speech{font-size:15px;padding:12px 16px}}
@media(max-width:650px){.hero-product-names{top:0;left:3%;gap:6px}.hero-brand-pill{font-size:36px;padding:12px 24px}.hero-system-pill{font-size:21px;padding:12px 18px;margin-left:-15px}.hero-kel-speech{bottom:27%;font-size:12px;padding:10px 13px}.hero-sticker{font-size:12px;padding:12px 15px;bottom:12%}.hero-product{top:51%;height:325px}.film-kel-speech{right:calc(8% + var(--kel-width)*.76);bottom:calc(100% + 10px);font-size:11px;white-space:normal;width:145px;padding:10px 12px}.film-heading{margin-bottom:70px}.film-label{font-size:11px}.feature-tag{font-size:14px}.tag-feedback,.tag-dock,.tag-material{font-size:12px}.feature-tag span{padding:8px 10px}.feature-tag:hover,.feature-tag:focus-visible,.feature-tag[aria-pressed=true]{scale:1.7}}
@media(prefers-reduced-motion:reduce){.hero-product-names span{animation:none}.feature-tag:before,.feature-tag:after{transition:none}}
/* Warm shadows are the only translucent decorative colors. */
:root{--capsule-shadow:rgba(119,106,81,.26)}
.hero-product-names span,.hero-sticker,.kel-speech,.hero-kel-speech,.feature-tag span,.feature-tag[aria-pressed=true] span,.symptom,.symptom:hover,.symptom.selected,.anatomy-badge,.app-bubble,.app-screen figcaption,.film-label,.film-kel-speech,.presale-art>p{box-shadow:3px 5px 0 var(--capsule-shadow)}
.price-button:hover{box-shadow:0 8px 0 var(--capsule-shadow)}
.breathing-rings i:first-child,.hero-rings i:first-child{background:#eee8f6;opacity:1}
.breathing-rings i:nth-child(2){background:var(--lavender);opacity:1}
.breathing-rings i:nth-child(3){background:var(--purple);opacity:1}
.breathing-rings i:nth-child(4){background:var(--deep);opacity:1}
.film-section{background-size:auto 100%;background-position:center;background-repeat:repeat-x}
.hero-product-names{z-index:1;left:-12%}
.hero-art .parallax{z-index:2;pointer-events:none}
@media(min-width:901px){.hero-art .hero-kel{width:calc(var(--kel-base)*2.25);left:37%;bottom:-160px}.hero-kel-speech{bottom:4%;right:-1%}}
@media(min-width:901px) and (max-width:1180px){.hero-art .hero-kel{left:31%;bottom:-140px}}
@media(max-width:900px){.hero-product-names{left:-9%}}
@media(max-width:650px){.hero-product-names{left:0}.hero-system-pill{font-size:19px}}

.hero-system-pill{translate:-10px 0}.presale-orbit{background:var(--purple)}
/* Film-only typography and complete capsule speech bubble. */
.film-heading{max-width:none;margin-left:0;margin-right:0}
.film-heading .eyebrow{margin-bottom:24px}
.film-heading h2{font-size:clamp(34px,3.8vw,58px);line-height:1.36;display:inline-block;background:#fff;border-radius:999px;padding:10px 28px;margin-left:-28px}
.film-kel-speech:after{content:none;display:none}
@media(max-width:650px){.film-heading{flex-wrap:wrap;gap:16px}.film-heading h2{font-size:33px;padding:10px 18px;margin-left:0}.film-label{margin-left:auto}}
