/* Mobile16: mobile-first chapters; the desktop intro inherits revision15 untouched */
:root{--red:#b91b35;--pink:#f8d5dc;--green:#303c20;--cream:#f1efda;--lime:#e4ebaf;--rose-ink:#4c1322}
.discovery{display:flex;flex-direction:column;position:relative;isolation:isolate;min-height:0;height:auto;max-height:none;padding:32px 0 32px;gap:0;background:var(--red);color:var(--pink);overflow:hidden}
.discovery h2{order:0;z-index:3;position:relative;grid-area:auto;transform:translateY(.17em);font:700 21vw/.87 'Roboto Narrow',Roboto,sans-serif;letter-spacing:-.035em;text-align:left;white-space:normal;width:auto;max-width:10ch;align-self:auto;margin:0 20px}
.object{order:1;grid-area:auto;position:relative;z-index:1;display:block;width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:1700/1558;margin:0;overflow:hidden;align-self:auto;background:#c08a87}
.object img{display:block;width:100%;height:auto;object-fit:contain}
.object:after{content:'';position:absolute;inset:60% 0 0;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(63,12,28,.57))}
.object figcaption{position:absolute;left:12px;right:12px;top:auto;bottom:24px;z-index:2;color:var(--pink);font:700 clamp(32px,10.5vw,58px)/.95 Roboto,sans-serif;letter-spacing:-.03em;text-align:center;white-space:nowrap;max-width:none;transform:none}
.discovery-copy{order:2;grid-area:auto;align-self:auto;margin:28px 20px 0;max-width:none;z-index:2}
.reconnect{font-size:20px;line-height:1.36;letter-spacing:-.015em;max-width:31ch;margin:0}
.kit-count{font-size:13px;line-height:1.5;max-width:31ch;margin:21px 0 0}

/* Three independent mobile treatments of MAREA */
:root[data-marea="2"] .discovery{padding-top:0}
:root[data-marea="2"] .discovery h2{position:absolute;left:18px;right:18px;top:25px;margin:0;max-width:none;font-size:12.7vw;line-height:.95;transform:none;white-space:nowrap;text-align:center}
:root[data-marea="2"] .object:before{content:'';position:absolute;z-index:1;inset:0 0 62%;background:linear-gradient(180deg,rgba(65,15,28,.72),rgba(65,15,28,.1),transparent)}
:root[data-marea="2"] .object figcaption{bottom:28px;font-size:10.8vw}
:root[data-marea="2"] .discovery-copy{margin-top:30px}
:root[data-marea="2"] .reconnect{font-size:23px;line-height:1.25}
:root[data-marea="3"] .discovery{padding-top:34px}
:root[data-marea="3"] .discovery h2{font-size:23.2vw;max-width:10ch;margin-bottom:10px;transform:none}
:root[data-marea="3"] .object{width:86%;align-self:flex-end;overflow:visible}
:root[data-marea="3"] .object:after{inset:50% 0 0}
:root[data-marea="3"] .object figcaption{left:-34px;right:15px;bottom:17px;text-align:left;font-size:14vw;line-height:.9;white-space:normal}
:root[data-marea="3"] .object figcaption span{display:block}
:root[data-marea="3"] .discovery-copy{margin-top:32px}

/* The common form has generous controls; no geometry is tied to the lid fold */
.signup{position:relative;isolation:isolate;color:var(--cream);background:#bc8887;overflow:hidden;min-height:0}
.box-photo{position:absolute;inset:0;margin:0;z-index:-2}
.box-photo img{position:absolute;display:block;max-width:none;height:800px;width:auto;left:50%;top:-135px;transform:translateX(-50%)}
.signup-body{position:relative;min-width:0;padding:300px 20px 30px}
.signup h2{font:700 clamp(26px,8.5vw,48px)/1.04 'Roboto Narrow',Roboto,sans-serif;letter-spacing:-.03em;white-space:nowrap;text-align:center;margin:0;color:inherit}
.signup-form{margin:64px auto 0;min-width:0}
.signup-form:focus{outline:none}
.signup form{display:grid;grid-template-columns:minmax(0,1fr) 100px;gap:12px 8px;margin:0}
.signup .email-group{grid-column:1;grid-row:1;position:relative;min-width:0}
.signup .email-group>label{position:absolute;left:13px;top:7px;margin:0;font-size:10px;line-height:1.2;color:inherit;font-weight:600}
.signup .email-group input{display:block;width:100%;height:56px;padding:18px 12px 0;border:1px solid currentColor;background:rgba(24,12,20,.16);color:inherit;font-size:16px;caret-color:currentColor}
.signup .email-group input::placeholder{color:inherit;opacity:1}
.signup .email-group input:hover{background:rgba(24,12,20,.25)}
.signup .email-group input[aria-invalid=true]{outline:2px solid currentColor;outline-offset:2px}
.signup .consent-group{grid-column:1/-1;grid-row:2;margin:0;color:#301720}
.signup .consent{display:flex;align-items:flex-start;gap:10px;min-height:44px;font-size:12px;line-height:1.45}
.signup .consent input{width:22px;height:22px;flex:none;appearance:none;position:relative;color:inherit;border:1px solid currentColor;background:transparent;margin:2px 0 0}
.signup .consent input:checked{background:currentColor}
.signup .consent input:checked:after{content:'';position:absolute;left:6px;top:2px;width:7px;height:12px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.signup .submit{grid-column:2;grid-row:1;width:100%;height:56px;margin:0;padding:0 12px;gap:6px;font-size:13px;font-weight:600;background:var(--lime);color:#26301d}
.signup .submit [data-submit-label]{min-width:0;line-height:1.1;text-align:left;white-space:normal}
.signup .submit svg{width:18px;height:18px;flex:none}
.signup .field-error{font-size:12px;line-height:1.4;min-height:0;margin:6px 0 0;color:inherit}
.signup .field-error:empty,.signup .feedback:empty{display:none}
.signup .email-group .field-error{background:var(--pink);color:var(--rose-ink);padding:5px 7px}
.signup .feedback{grid-column:1/-1;grid-row:3;font-size:12px;line-height:1.45;min-height:0;margin:0;color:#301720}
:root[data-cierre="1"] .signup{min-height:560px}

/* 2: a compact photographic opening followed by a proper mobile form */
:root[data-cierre="2"] .signup{display:grid;grid-template-columns:1fr;background:var(--pink);color:var(--rose-ink)}
:root[data-cierre="2"] .box-photo{position:relative;grid-column:1;grid-row:1;z-index:auto;height:260px}
:root[data-cierre="2"] .box-photo img{inset:0;transform:none;width:100%;height:100%;object-fit:cover;object-position:50% 55%}
:root[data-cierre="2"] .signup-body{display:contents;padding:0}
:root[data-cierre="2"] .signup h2{grid-column:1;grid-row:2;text-align:left;white-space:normal;font-size:14.5vw;line-height:.94;padding:28px 20px 0;margin:0;max-width:12ch}
:root[data-cierre="2"] .signup-form{grid-column:1;grid-row:3;margin:24px 20px 32px;max-width:none}
:root[data-cierre="2"] .signup form,:root[data-cierre="3"] .signup form{display:flex;flex-direction:column;gap:15px}
:root[data-cierre="2"] .signup .email-group,:root[data-cierre="3"] .signup .email-group{width:100%}
:root[data-cierre="2"] .signup .email-group>label,:root[data-cierre="3"] .signup .email-group>label{position:static;font-size:13px;line-height:1.3;margin:0 0 8px}
:root[data-cierre="2"] .signup .email-group input,:root[data-cierre="3"] .signup .email-group input{padding:0 14px;background:transparent}
:root[data-cierre="2"] .signup .consent-group,:root[data-cierre="3"] .signup .consent-group{color:inherit;width:100%}
:root[data-cierre="2"] .signup .submit{font-size:16px;padding:0 18px;background:var(--red);color:var(--pink)}

/* 3: a photographic campaign ending with full-width, stacked controls */
:root[data-cierre="3"] .signup{min-height:640px}
:root[data-cierre="3"] .box-photo img{height:820px;top:-110px}
:root[data-cierre="3"] .signup:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(35,12,24,.57),rgba(35,12,24,.14) 40%,rgba(35,12,24,.12) 47%,rgba(35,12,24,.83) 100%)}
:root[data-cierre="3"] .signup-body{padding:28px 20px 32px}
:root[data-cierre="3"] .signup h2{font-size:16vw;line-height:.91;text-align:left;white-space:normal;max-width:12ch}
:root[data-cierre="3"] .signup-form{margin:200px auto 0}
:root[data-cierre="3"] .signup .submit{font-size:16px;padding:0 18px}
:root[data-cierre="3"] .signup .feedback{color:inherit}

/* Mobile-only hero layouts: preserve every desktop intro rule from revision15 */
@media(max-width:760px){
 .intro{height:100svh;min-height:0;max-height:none;padding:22px 22px calc(20px + env(safe-area-inset-bottom));display:block}
 .intro-top{display:contents}
 .intro .brand{display:block;padding:0;min-height:0;position:relative;z-index:2;width:max-content}
 .intro .brand img{width:122px}
 .intro h1{position:absolute;top:15svh;left:22px;right:auto;font-size:clamp(62px,21vw,96px);line-height:.87;letter-spacing:-.03em;margin:0;max-width:none;width:max-content;text-align:left}
 .launch-link{position:absolute;left:22px;right:82px;bottom:calc(20px + env(safe-area-inset-bottom));width:auto;max-width:none;min-height:56px;margin:0;padding:15px 16px;font-size:13px;gap:10px}
 .motion{right:22px;bottom:calc(26px + env(safe-area-inset-bottom));width:44px;height:44px;z-index:5;touch-action:manipulation}
 .film{pointer-events:none}
 .film picture,.film picture img,.film video{object-position:50% 50%}
 .film:after{background:linear-gradient(180deg,rgba(20,32,12,.62),rgba(20,32,12,.42) 30%,rgba(20,32,12,.09) 64%,rgba(20,32,12,.6))}
 :root[data-hero="2"] .intro h1{top:17svh;left:22px;right:22px;width:auto;font-size:16.4vw;line-height:1}
 :root[data-hero="2"] .break-one{display:none}
 :root[data-hero="2"] .intro h1 .creating{display:inline-block;font-size:26vw;line-height:.88;letter-spacing:-.04em}
 :root[data-hero="2"] .film:after{background:linear-gradient(180deg,rgba(20,32,12,.68),rgba(20,32,12,.5) 30%,rgba(20,32,12,.03) 57%,rgba(20,32,12,.57))}
 :root[data-hero="3"] .intro{background:var(--green)}
 :root[data-hero="3"] .intro h1{top:100px;left:22px;right:22px;width:auto;font-size:15.5vw;line-height:.92}
 :root[data-hero="3"] .break-one{display:none}
 :root[data-hero="3"] .film{inset:235px 0 94px;background:#56653b}
 :root[data-hero="3"] .film video,:root[data-hero="3"] .film picture img{object-position:50% 63%}
 :root[data-hero="3"] .film:after{background:linear-gradient(180deg,rgba(20,32,12,.05),rgba(20,32,12,.08))}
 @media(max-height:700px){
  .intro h1{font-size:19vw;top:15svh}
  :root[data-hero="2"] .intro h1{top:15svh;font-size:15vw}
  :root[data-hero="2"] .intro h1 .creating{font-size:24vw}
  :root[data-hero="3"] .intro h1{top:83px;font-size:14vw}
  :root[data-hero="3"] .film{top:200px;bottom:94px}
 }
 @media(max-height:500px){
  .intro .brand img{width:100px}
  .intro h1{font-size:12.5vw;top:85px}
  :root[data-hero="2"] .intro h1{font-size:10vw;top:80px}
  :root[data-hero="2"] .intro h1 .creating{font-size:15vw}
  :root[data-hero="3"] .intro h1{font-size:9vw;top:75px}
  :root[data-hero="3"] .film{top:150px}
 }
}
@media(min-width:500px) and (max-width:760px){
 .discovery h2{font-size:17vw;max-width:10ch}
 :root[data-marea="2"] .discovery h2{font-size:12.7vw}
 .signup h2{font-size:7.5vw}
 :root[data-cierre="2"] .signup h2,:root[data-cierre="3"] .signup h2{font-size:10vw}
 .signup-body{padding-left:35px;padding-right:35px}
 :root[data-cierre="1"] .signup-form{max-width:500px}
}

/* Desktop: one corrected MAREA, three concise photographic endings */
@media(min-width:761px){
 .discovery,:root[data-marea="2"] .discovery,:root[data-marea="3"] .discovery{display:grid;grid-template-columns:minmax(175px,1fr) minmax(0,860px) minmax(175px,1fr);grid-template-rows:auto auto;align-content:start;gap:0 24px;min-height:0;height:auto;padding:48px 4.45% 52px;overflow:hidden}
 .discovery h2,:root[data-marea="2"] .discovery h2,:root[data-marea="3"] .discovery h2{position:relative;top:auto;left:auto;right:auto;grid-column:1/-1;grid-row:1;font-size:clamp(112px,12.8vw,210px);line-height:.98;letter-spacing:-.035em;text-align:center;white-space:nowrap;transform:translateY(.18em);margin:0 -8px;max-width:none;order:0}
 .object,:root[data-marea="3"] .object{grid-column:2;grid-row:2;width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:1700/1558;margin:0;order:0;align-self:start;overflow:hidden}
 :root[data-marea="2"] .object:before{display:none}
 .object:after,:root[data-marea="3"] .object:after{inset:45% 0 0;background:linear-gradient(180deg,transparent,rgba(57,9,24,.58))}
 .object figcaption,:root[data-marea="2"] .object figcaption,:root[data-marea="3"] .object figcaption{left:15px;right:15px;top:auto;bottom:40px;font-size:clamp(42px,5.55vw,90px);line-height:.95;text-align:center;white-space:nowrap;transform:none}
 .object figcaption span,:root[data-marea="3"] .object figcaption span{display:inline}
 .discovery-copy,:root[data-marea="2"] .discovery-copy,:root[data-marea="3"] .discovery-copy{grid-column:1;grid-row:2;align-self:center;margin:-42px 0 0;max-width:220px;order:0}
 .reconnect,:root[data-marea="2"] .reconnect{font-size:20px;line-height:1.35;letter-spacing:-.012em}
 .kit-count{font-size:13px;line-height:1.55;max-width:25ch;margin:24px 0 0}
 .signup{min-height:0;color:var(--cream)}
 .box-photo,:root[data-cierre="2"] .box-photo{position:absolute;inset:0;height:auto;width:auto;z-index:-2;margin:0}
 .box-photo img,:root[data-cierre="2"] .box-photo img,:root[data-cierre="3"] .box-photo img{position:static;transform:none;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 62%}
 .signup-body{padding:350px 4.45% 60px;min-height:780px}
 .signup h2{font-size:clamp(50px,4.6vw,80px);white-space:nowrap;line-height:1.04;max-width:none;text-align:center;padding:0;margin:0}
 .signup-form{max-width:900px;margin:135px auto 0}
 .signup form{grid-template-columns:minmax(0,1fr) 170px;gap:10px 16px}
 .signup .email-group>label{position:static;margin:0 0 8px;font-size:13px;line-height:1.25}
 .signup .email-group input{padding:0 15px}
 .signup .submit{align-self:start;margin-top:24px;font-size:16px;padding:0 18px}
 .signup .submit svg{width:24px;height:24px}
 .signup .consent-group{color:inherit}
 .signup .consent{font-size:13px;line-height:1.45}
 .signup .feedback{font-size:13px;color:inherit}
 :root[data-cierre="1"] .signup{min-height:780px}
 :root[data-cierre="2"] .signup{display:block;color:var(--cream);background:#bc8887}
 :root[data-cierre="2"] .signup:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(30,12,23,.65),transparent 60%),linear-gradient(0deg,rgba(30,12,23,.85),rgba(30,12,23,.14) 36%,transparent 58%)}
 :root[data-cierre="2"] .signup-body{display:flex;flex-direction:column;min-height:660px;padding:44px 4.45% 36px}
 :root[data-cierre="2"] .signup h2{font-size:clamp(64px,6.7vw,96px);line-height:.92;text-align:left;white-space:normal;max-width:9ch;padding:0}
 :root[data-cierre="2"] .signup-form{width:100%;max-width:none;margin:40px 0 0;margin-top:auto}
 :root[data-cierre="2"] .signup form{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) 180px;gap:12px 28px;align-items:start}
 :root[data-cierre="2"] .signup .email-group{grid-column:1;grid-row:1}
 :root[data-cierre="2"] .signup .consent-group{grid-column:2;grid-row:1;padding-top:3px;color:inherit}
 :root[data-cierre="2"] .signup .submit{grid-column:3;grid-row:1;margin-top:24px;background:var(--lime);color:#26301d}
 :root[data-cierre="2"] .signup .feedback{grid-column:1/-1;grid-row:2}
 :root[data-cierre="3"] .signup{min-height:720px}
 :root[data-cierre="3"] .box-photo img{object-position:50% 55%}
 :root[data-cierre="3"] .signup:after{background:linear-gradient(180deg,rgba(35,12,24,.35),rgba(35,12,24,.04) 33%,rgba(35,12,24,.12) 46%,rgba(35,12,24,.78) 100%)}
 :root[data-cierre="3"] .signup-body{min-height:720px;padding:48px 4.45% 44px}
 :root[data-cierre="3"] .signup h2{font-size:clamp(60px,6.1vw,96px);line-height:1.04;text-align:center;white-space:nowrap;max-width:none}
 :root[data-cierre="3"] .signup-form{width:100%;max-width:600px;margin:235px auto 0}
 :root[data-cierre="3"] .signup form{gap:15px}
 :root[data-cierre="3"] .signup .submit{margin:0}
}
@media(min-width:761px) and (max-width:1100px){
 .discovery,:root[data-marea="2"] .discovery,:root[data-marea="3"] .discovery{grid-template-columns:minmax(140px,1fr) minmax(0,2.8fr) minmax(140px,1fr);gap:0 18px;padding-left:30px;padding-right:30px}
 .discovery h2,:root[data-marea="2"] .discovery h2,:root[data-marea="3"] .discovery h2{font-size:12.5vw}
 .reconnect,:root[data-marea="2"] .reconnect{font-size:17px}
 .kit-count{font-size:12px}
 .object figcaption,:root[data-marea="2"] .object figcaption,:root[data-marea="3"] .object figcaption{font-size:3.8vw;bottom:22px}
 .signup-body{padding-top:320px;min-height:740px}
 :root[data-cierre="1"] .signup-body{padding-top:400px}
 :root[data-cierre="1"] .signup-form{width:60vw;max-width:none;margin-top:30px}
 :root[data-cierre="1"] .signup .email-group>label{position:absolute;left:13px;top:7px;font-size:10px;margin:0;line-height:1.2}
 :root[data-cierre="1"] .signup .email-group input{height:56px;padding:18px 12px 0}
 :root[data-cierre="1"] .signup .submit{height:56px;margin-top:0}
 .signup-form{max-width:660px;margin-top:135px}
 :root[data-cierre="2"] .signup h2{font-size:8vw}
 :root[data-cierre="2"] .signup form{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 135px;gap:15px}
 :root[data-cierre="2"] .signup .consent{font-size:12px}
 :root[data-cierre="3"] .signup-form{margin-top:235px}
}
:root[data-solo="inicio"] .discovery,:root[data-solo="inicio"] .signup,:root[data-solo="marea"] .intro,:root[data-solo="marea"] .signup,:root[data-solo="cierre"] .intro,:root[data-solo="cierre"] .discovery{display:none}
:root[data-solo="marea"] body{background:var(--red)}
:root[data-solo="cierre"][data-cierre="2"] body{background:var(--pink)}
@media(max-width:950px) and (max-height:500px) and (pointer:coarse){
 .intro{height:100svh;min-height:0;max-height:none;padding:20px;display:block}
 .intro-top{display:contents}
 .intro .brand{display:block;position:relative;padding:0;min-height:0;width:max-content}
 .intro .brand img{width:100px}
 .intro h1{position:absolute;top:30px;left:auto;right:24px;font-size:min(16vh,9vw);line-height:.86;max-width:none;margin:0;width:max-content;text-align:left}
 .launch-link{position:absolute;left:20px;right:auto;bottom:18px;min-height:52px;width:300px;max-width:calc(100% - 100px);margin:0;font-size:13px}
 .motion{position:absolute;right:22px;bottom:22px;width:44px;height:44px;z-index:5}
 :root[data-hero="2"] .intro h1{top:42px;right:22px;left:auto;width:55%;font-size:min(15vh,8vw)}
 :root[data-hero="2"] .intro h1 .creating{font-size:min(23vh,13vw)}
 :root[data-hero="3"] .intro h1{top:85px;left:20px;right:auto;width:42%;font-size:min(14vh,7vw)}
 :root[data-hero="3"] .film{inset:0 0 0 45%}
}
@media(prefers-reduced-motion:reduce){.film video.user-played{visibility:visible}}
