/* Revision 06: complete the light hero between mobile and desktop breakpoints.
   Scope is strictly 600–899 CSS px and hero-only; copy and other sections unchanged. */
@media(min-width:600px) and (max-width:899px){
 .hero{padding:14px 0 28px;background:#f8f8f6;color:#474c41;font-family:'Montserrat Hero',Arial,sans-serif}
 .hero:before,.hero:after,.hero-art-surface,.hero-portrait-frame{display:none}
 .hero-inner{width:100%;max-width:480px;gap:0;margin-inline:auto}
 .hero-copy{display:contents}
 .mobile-hero-brand{display:block;order:-1;margin:0 auto 21px}
 .mobile-hero-brand img{display:block;width:112px;height:24px;filter:brightness(0)}
 .mobile-line{display:block}
 .hero .event-strip{order:0;display:grid;grid-template-columns:145px 1fr;align-items:start;gap:17px;margin:0 30px;padding:0;border:0;line-height:1.14;font-family:inherit;color:#474c41}
 .hero .event-when{grid-column:1;grid-row:1;display:block;font-size:12.5px;font-weight:700;line-height:1.2;text-align:left;padding:0 0 0 31px;letter-spacing:-.25px;white-space:nowrap}
 .hero .event-when>span{font-size:12px;line-height:1.2;font-weight:400;margin-top:0;letter-spacing:-.2px}
 .hero .event-when>span:before{display:none}
 .hero .event-type{grid-column:2;grid-row:1;font-weight:400;font-size:11.8px;line-height:1.2;letter-spacing:-.2px;padding:0 0 0 33px;white-space:nowrap;border:0}
 .hero .event-type:before{content:'';position:absolute;left:-15px;top:0;width:1px;height:28px;background:#8e9189}
 .hero .event-icon{display:block;color:#505646;left:0;top:0;width:22px;height:22px;stroke-width:2}
 .hero .event-type .event-icon{width:25px;height:25px}
 .hero h1{order:1;font-family:inherit;font-size:49px;font-weight:800;line-height:1.04;letter-spacing:-2px;color:#504094;margin:21px 18px 6px;transform:scaleX(.955);text-shadow:none;text-align:center;white-space:nowrap}
 .hero h1 em{display:inline;padding:0;color:inherit;font-style:normal}
 .hero h1 em:after,.hero-subtitle:after{display:none}
 .hero .hero-subtitle{order:2;font-family:inherit;font-size:23.4px;font-weight:500;line-height:1.13;letter-spacing:-.55px;text-shadow:none;color:#474c41;text-align:center;margin:0 22px 11px;max-width:none;padding:0;background:none;border:0}
 .hero .hero-lead{order:3;width:auto;max-width:none;margin:0 28px;padding:13px 10px 15px;background:#e5def7;border:0;border-radius:14px;box-shadow:none;color:#47474b;font-size:14px;font-weight:400;line-height:1.28;letter-spacing:-.17px;text-shadow:none;text-align:center}
 .hero .hero-lead strong{font-weight:700;color:inherit;text-shadow:none}
 .hero .hero-question{order:4;max-width:none;margin:13px 28px 0;padding:0;font-size:13.2px;font-weight:400;line-height:1.23;letter-spacing:-.22px;color:#47474b;text-shadow:none;background:none;border:0;text-align:center;position:relative;z-index:1}
 .hero .hero-question strong{display:block;max-width:none;font-family:inherit;font-size:16.8px;font-weight:700;font-style:normal;line-height:1.125;letter-spacing:-.18px;color:#444a40;margin:0 auto 8px}
 .hero .hero-question:before{content:'';position:absolute;z-index:-1;inset:-8px -28px -14px;background:url('assets/mobile-approved-scene.avif') center 54.647%/100% auto no-repeat;mask-image:linear-gradient(90deg,#000 0%,#000 4%,transparent 11%,transparent 90%,#000 97%,#000 100%);pointer-events:none}
 .hero .hero-question strong+br{display:none}
 .mobile-planet-art{display:block;order:5;width:100%;aspect-ratio:851/402;margin:3px 0 0;flex-shrink:0;background-image:url('assets/mobile-approved-scene.avif');background-repeat:no-repeat;background-size:100% auto;background-position:center 75.726%;mask-image:linear-gradient(transparent,#000 13px,#000);pointer-events:none}
 .hero .section-action{order:6;margin:-1px 34px 17px;text-align:center;z-index:2}
 .hero .section-action:before{content:'';position:absolute;z-index:-1;left:-34px;right:-34px;top:0;height:84px;background:url('assets/mobile-approved-scene.avif') center 90%/100% auto no-repeat;mask-image:linear-gradient(90deg,#000 0%,#000 8%,transparent 9%,transparent 91%,#000 92%,#000 100%);pointer-events:none}
 .hero .cta{display:flex;min-width:0;width:100%;max-width:none;min-height:64px;padding:8px 18px;gap:0;border:0;border-radius:20px;background:linear-gradient(110deg,#5744a4,#41327f 52%,#51469d);box-shadow:0 4px 0 #302062,0 13px 25px rgba(70,49,124,.13);color:#fff;font-family:inherit;font-size:19px;font-weight:700;line-height:1.25;letter-spacing:.15px;transition:transform .18s,box-shadow .18s,filter .18s}
 .hero .cta>span{display:none}
 .hero .cta:hover{background:linear-gradient(110deg,#5a46aa,#4b3d91 50%,#5a4ca9);box-shadow:0 5px 0 #302062,0 15px 25px rgba(70,49,124,.16);transform:translateY(-1px)}
 .hero .cta:active,.hero .cta.is-pressed{transform:translateY(3px);box-shadow:0 1px 0 #302062,0 6px 15px rgba(70,49,124,.13);filter:brightness(.96)}
 .hero .cta:focus-visible{outline-color:#504094;outline-offset:8px}
 .hero .hero-gift{order:7;display:block;margin:0;padding:0 28px;background:none;border:0;border-radius:0;color:#2c2e41}
 .hero-gift>img{display:none}
 .hero .gift-content{display:block}
 .hero .gift-label{position:relative;display:flex;align-items:center;min-height:32px;margin:0 0 7px;padding-left:45px;color:#2c2e41;font-family:inherit;font-size:13.9px;font-weight:700;line-height:1.23;letter-spacing:-.4px;text-transform:none;white-space:nowrap}
 .hero .gift-label:before{content:'';position:absolute;left:5px;top:0;width:32px;height:32px;background-image:url('assets/mobile-approved-scene.avif');background-size:393px auto;background-repeat:no-repeat;background-position:-34px -770px}
 .hero .gift-name{max-width:none;margin:0;padding:10px 13px 13px;background:#e5def7;border-radius:15px;color:#47474b;text-align:center;font-family:inherit;font-size:14px;font-weight:400;line-height:1.3;letter-spacing:-.25px}
 .hero .timer{justify-content:center;margin-top:13px;color:#47474b}
 .hero .timer-label{font-family:inherit}
 .hero .timer-cell{background:#e5def7;color:#504094;border-color:#d2c7ef}

 /* The approved mobile hierarchy, sized for an intermediate browser panel. */
 .hero{padding:18px 0 26px}
 .hero-inner{width:100%;max-width:480px}
 .hero .mobile-hero-brand{margin-bottom:17px}
 .hero .mobile-hero-brand img{width:134px;height:auto}
 .hero .event-strip{grid-template-columns:165px 1fr;margin-inline:24px;gap:18px}
 .hero .event-when{font-size:14px;line-height:1.2}
 .hero .event-when>span{font-size:13.5px}
 .hero .event-type{font-size:13.5px;line-height:1.2}
 .hero .event-type:before{left:-11px;height:32px}
 .hero h1{font-size:56px;line-height:1.05;margin:18px 18px 6px;letter-spacing:-2.3px}
 .hero .hero-subtitle{font-size:26px;line-height:1.13;margin:0 20px 13px;letter-spacing:-.6px}
 .hero .hero-lead{margin-inline:24px;padding:13px 10px 15px;font-size:16px;line-height:1.28;letter-spacing:-.2px}
 .hero .hero-question{margin:13px 24px 0;font-size:16px;line-height:1.25;letter-spacing:-.2px}
 .hero .hero-question strong{font-size:18px;line-height:1.2;margin-bottom:8px}
 .hero .hero-question strong .mobile-line:last-of-type{display:none}
 .hero .hero-question:before{inset:-8px -24px -14px}
 .hero .mobile-planet-art{margin-top:3px;aspect-ratio:851/402;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(transparent,#000 13px,#000 calc(100% - 13px),transparent);mask-composite:intersect}
 .hero .hero-question:before{mask-image:linear-gradient(90deg,transparent 0%,#000 6%,transparent 14%,transparent 87%,#000 95%,transparent 100%)}
 .hero .section-action:before{mask-image:linear-gradient(90deg,transparent 0%,#000 6%,transparent 12%,transparent 88%,#000 94%,transparent 100%)}
 .hero .section-action{margin:-1px 34px 18px}
 .hero .cta{font-size:20px;min-height:66px}
 .hero .hero-gift{padding-inline:24px}
 .hero .gift-label{font-size:16px;letter-spacing:-.3px}
 .hero .gift-name{font-size:16px;line-height:1.35}
}
@media(min-width:600px) and (max-width:899px) and (max-height:800px){
 .hero{padding-top:13px}
 .hero .mobile-hero-brand{margin-bottom:13px}
 .hero h1{font-size:52px;margin-top:14px}
 .hero .hero-subtitle{font-size:24px;margin-bottom:10px}
 .hero .hero-lead{font-size:16px;padding-block:10px}
 .hero .hero-question{margin-top:10px}
 .hero .hero-question strong{font-size:17px;margin-bottom:6px}
 .hero .mobile-planet-art{width:400px;max-width:100%;align-self:center;height:166px;aspect-ratio:auto;background-size:100% auto;background-position:center 73.25%}
 .hero .section-action{margin-bottom:17px}
 .hero .hero-question:before,.hero .section-action:before{display:none}
}
@media(min-width:600px) and (max-width:899px) and (prefers-reduced-motion:reduce){
 .hero .cta{transition:none}.hero .cta:hover{transform:none}
}
