/* The Home and its navigation cover share the same destination palette. */
:root{--home-base:#242522;--home-background:radial-gradient(ellipse at 72% 38%,#343f43 0%,#292e2e 32%,#242522 69%);--marketing-surface:#171f29;--supply-surface:#172c38;--home-paper:#f3f1ea}
body[data-world=landing]{--bg:var(--home-base);--ink:#f3f1e9;--muted:#c6c8c1;--accent:#ff885b;background:var(--home-base)}
body[data-world=landing] .header{height:84px;border:0;background:transparent}
body[data-world=landing] .header nav [data-go]{display:none}
body[data-world=landing] .signature-home{height:calc(100svh - 84px);min-height:710px;max-height:none;padding:40px var(--pad) 0;display:block;isolation:isolate;background:var(--home-background);overflow:visible}
.signature-home:before{background:var(--preview-color,var(--marketing-surface));z-index:1;opacity:0;transition:opacity .35s}
body[data-world=landing] .signature-home:has(.mk:hover),body[data-world=landing] .signature-home:has(.mk:focus-visible){--preview-color:var(--marketing-surface)}
body[data-world=landing] .signature-home:has(.sc:hover),body[data-world=landing] .signature-home:has(.sc:focus-visible){--preview-color:var(--supply-surface)}
body[data-world=landing] .signature-home:has(.world-choice:focus-visible):before{opacity:.5}
@media(hover:hover){body[data-world=landing] .signature-home:has(.world-choice:hover):before{opacity:.5}}
.signature-home .home-story{position:relative;z-index:3;width:58%;pointer-events:none}
.signature-home .home-kicker{font-size:10px;letter-spacing:.24em;color:#e4e6df;line-height:1.7}
body[data-world=landing] .signature-home h1{font:800 clamp(68px,6.8vw,126px)/.95 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:-.025em;white-space:normal;margin:20px 0 24px;transform:translate3d(0,calc(var(--home-drift)*-15px),0);max-width:none}
.signature-home h1>span{display:block;white-space:nowrap}
.signature-home .home-title-accent{color:#afcce4}
.signature-home h1 b{color:#ff885b;font-weight:inherit}
.signature-home .home-intro{font-size:clamp(16px,1.5vw,24px);line-height:1.5;max-width:510px;width:83%;margin:0;letter-spacing:-.025em}
.signature-home .home-flow{display:flex;align-items:center;gap:22px;max-width:500px;width:82%;font-size:clamp(13px,1.15vw,18px);margin-top:38px}
.signature-home .home-flow i{flex:1;height:1px;background:#f3f1e96b;position:relative;transform:scaleX(calc(1 - var(--home-drift)*.12));transform-origin:left}
.signature-home .home-flow i:after{content:'';position:absolute;right:0;top:-5px;width:11px;height:11px;border:1px solid #f3f1e9;border-radius:50%;background:#2b3335}
.signature-home .landing-portrait{inset:-50px 0 155px 42%;z-index:2;overflow:hidden}
body[data-world=landing] .signature-home .portrait{height:110%;width:auto;max-width:none;left:auto;right:2%;bottom:-8%;transform:none;filter:none;object-fit:contain}
.signature-home .home-signature{position:absolute;right:var(--pad);bottom:174px;z-index:3;font-size:10px;margin:0;color:#e1e3dd}
body[data-world=landing] .signature-home .landing-bottom{position:absolute;bottom:0;left:0;right:0;z-index:4;margin:0;padding:30px var(--pad) 36px;height:155px;min-height:0;background:linear-gradient(100deg,#242522ed,#252a2be8);border:0;border-radius:50% 50% 0 0 / 15px 15px 0 0}
.signature-home .world-choices{display:grid;grid-template-columns:1fr 1fr;gap:8vw;width:100%}
.signature-home .world-choice{min-width:0;background:transparent!important;padding:0 0 14px;display:grid;grid-template-columns:1fr auto;gap:9px 20px;color:#f3f1e9;border-bottom:1px solid #e2e4d48a;position:relative;transition:color .25s,transform .25s}
.signature-home .world-choice.sc:before{content:'';position:absolute;left:-4vw;top:0;bottom:0;width:1px;background:#f3f1e940}
.signature-home .world-choice small{font-size:12px;color:#e2e3dc;grid-column:1}
.signature-home .world-choice strong{font-size:clamp(27px,3.2vw,52px);font-weight:600;letter-spacing:-.045em;line-height:1.05}
.signature-home .world-choice.mk strong{color:#ff885b}
.signature-home .world-choice.sc strong{color:#afcce4}
.signature-home .world-choice>span{grid-column:2;grid-row:1 / 3;align-self:center;font-size:32px}
.signature-home .world-choice:hover{transform:translateY(-3px);color:#fff}
body[data-world=landing] .home-connection{color:#242522;padding:45px var(--pad) 46px;background:none}
body[data-world=landing] .home-connection .eyebrow{color:#505952;font-size:10px;letter-spacing:.18em}
body[data-world=landing] .home-connection h2{font-size:clamp(40px,4.9vw,78px);margin:22px 0 30px}
body[data-world=landing] .home-connection h2 em{color:#475e6c}
body[data-world=landing] .home-thread i{background:#667c86}
body[data-world=landing] .home-connection-bottom p{color:#4a504b}
body[data-world=landing] .home-connection .editorial-link{border-color:#66776e;color:#242522}
body[data-world=landing] .home-connection .editorial-link:hover{color:#bf4e2b}
body[data-world=landing] .footer{background:var(--home-paper);color:#515952;border-top:1px solid #24252220;padding-block:24px}
@media(min-width:651px) and (max-width:1000px){body[data-world=landing] .signature-home{min-height:710px}.signature-home .home-story{width:62%}body[data-world=landing] .signature-home h1{font-size:7.5vw}.signature-home .home-intro{font-size:17px;max-width:360px}.signature-home .home-flow{max-width:350px;gap:14px}.signature-home .landing-portrait{left:46%}body[data-world=landing] .signature-home .portrait{height:95%;right:-12%;bottom:-5%}}
@media(max-width:650px){
 body[data-world=landing] .header{height:72px}.header .wordmark span{display:none}
 body[data-world=landing] .signature-home{height:calc(100svh - 72px);min-height:715px;padding:26px var(--pad) 0;background:radial-gradient(ellipse at 80% 57%,#343f43,#242522 75%)}
 .signature-home .home-story{width:100%}.signature-home .home-kicker{font-size:8px;letter-spacing:.12em}
 body[data-world=landing] .signature-home h1{font-size:clamp(36px,10.8vw,72px);line-height:.97;margin:18px 0 22px;transform:translate3d(0,calc(var(--home-drift)*-10px),0)}
 .signature-home .home-intro{width:55%;font-size:15px;line-height:1.5;letter-spacing:-.025em;margin-top:24px}
 .signature-home .home-flow{width:55%;font-size:10px;gap:9px;margin-top:24px;flex-wrap:wrap}.signature-home .home-flow i{min-width:5px}.signature-home .home-flow i:after{width:6px;height:6px;top:-2.5px}
 .signature-home .landing-portrait{inset:180px 0 136px 34%}
 body[data-world=landing] .signature-home .portrait{height:104%;right:-21%;bottom:-6%;transform:none;left:auto;filter:none}
 .signature-home .home-signature{font-size:8px;bottom:143px;right:var(--pad);max-width:55%;text-align:right}
 body[data-world=landing] .signature-home .landing-bottom{height:130px;min-height:0;padding:24px var(--pad) 30px;align-items:center}
 .signature-home .world-choices{gap:22px}.signature-home .world-choice{gap:8px 8px;padding-bottom:12px}.signature-home .world-choice small{font-size:10px;min-height:28px;line-height:1.4}.signature-home .world-choice strong{font-size:clamp(20px,5.5vw,30px);white-space:nowrap}.signature-home .world-choice>span{font-size:21px;grid-row:2}.signature-home .world-choice.sc:before{left:-11px}
 body[data-world=landing] .home-connection{padding:35px var(--pad) 38px}body[data-world=landing] .home-connection h2{font-size:clamp(37px,9.8vw,58px);line-height:1.04}body[data-world=landing] .home-connection .eyebrow{font-size:9px}
}
@media(prefers-reduced-motion:reduce){body[data-world=landing] .home-connection{background:var(--home-paper)}body[data-world=landing] .signature-home h1{transform:none}.signature-home:before,.signature-home .world-choice{transition:none}}
/* Content stays concealed until the character has covered the previous world. */
body.route-covered .header,body.route-covered #main{visibility:hidden}
body.route-arriving .header{animation:arrival .55s both}
body.route-arriving .home-kicker{animation:arrival .65s .08s both}
body.route-arriving .signature-home h1{animation:arrival .8s .16s both}
body.route-arriving .home-intro{animation:arrival .8s .24s both}
body.route-arriving .home-flow{animation:arrival .8s .32s both}
body.route-arriving .landing-portrait{animation:portrait-arrival .95s .1s both}
body.route-arriving .home-signature{animation:arrival .7s .35s both}
body.route-arriving .landing-bottom{animation:arrival .85s .4s both}
body.route-arriving .home-connection,body.route-arriving .footer{animation:arrival .8s .45s both}
body.route-arriving .world-intro{animation:arrival .8s .12s both}
@keyframes arrival{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
@keyframes portrait-arrival{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}
@media(prefers-reduced-motion:reduce){body.route-arriving *{animation:none!important;translate:none!important}}

html[lang=es] body[data-world=landing] .signature-home h1{font-size:clamp(58px,6.2vw,116px)}
@media(min-width:651px) and (max-width:1000px){html[lang=es] body[data-world=landing] .signature-home h1{font-size:6.4vw}}
@media(max-width:650px){html[lang=es] body[data-world=landing] .signature-home h1{font-size:clamp(30px,9.7vw,62px)}}
/* On short displays, use space efficiently without cutting the portrait loose. */
@media(min-width:1001px) and (max-height:850px){body[data-world=landing] .signature-home{min-height:650px;padding-top:24px}body[data-world=landing] .signature-home h1{font-size:clamp(66px,6.3vw,100px);margin-block:16px 20px}.signature-home .home-flow{margin-top:24px}}

@media(max-width:650px){.signature-home .world-choice strong{grid-column:1 / -1;font-size:clamp(18px,5.5vw,30px)}.signature-home .world-choice>span{grid-column:2;grid-row:1;align-self:start;font-size:18px}.signature-home .world-choice small{grid-column:1;min-width:0}}

/* Actual photographic depth, shared with the curtain that returns Home. */
:root{--home-background:url('assets/home-atmosphere.webp') center / cover no-repeat #242522}
body[data-world=landing] .signature-home{background:none}
.signature-home:after{content:'';position:absolute;inset:-84px 0 0;z-index:0;background:var(--home-background);pointer-events:none}
body[data-world=landing] .header{background:transparent}
@media(max-width:650px){.signature-home:after{top:-72px;background-position:right center}}
.returning-home .transition-surface{background:var(--home-background);background-size:100vw 100dvh;background-position:center bottom;background-repeat:repeat-y}
@media(max-width:650px){.returning-home .transition-surface{background-size:auto 100dvh;background-position:right bottom}}
body:not([data-world=landing]):before{background:linear-gradient(#24252200,#24252200 55%,#242522),var(--home-background);background-size:auto,100vw 100dvh}

/* Ground the approved portrait in the route band rather than exposing its cut edge. */
.signature-home .landing-portrait{
 transform:translateY(24px);
 -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 32px),transparent 100%);
 mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 32px),transparent 100%);
}
.signature-home .landing-portrait:before{
 content:'';position:absolute;inset:12% -10% 0 0;z-index:0;pointer-events:none;
 background:radial-gradient(ellipse at 63% 76%,rgb(22 29 32 / .25),transparent 68%);
}
body[data-world=landing] .signature-home .portrait{
 /* Keep the received photograph and its colors intact; add only the existing shadow. */
 filter:drop-shadow(-8px 12px 22px rgb(9 18 23 / .25));
}
body[data-world=landing] .signature-home .landing-bottom{
 background:linear-gradient(100deg,#242522,#252a2b);
 box-shadow:0 -12px 24px -16px rgb(9 18 23 / .32);
}
@media(max-width:650px){
 .signature-home .landing-portrait{inset:0 0 110px;transform:none}
 body[data-world=landing] .signature-home .portrait{
  height:min(calc(130% - 268px),140vw);
  left:77%;right:auto;bottom:-66px;transform:translateX(-47%);
  filter:drop-shadow(-5px 9px 15px rgb(9 18 23 / .22));
 }
 .signature-home:after{background-position:97% center}
 .returning-home .transition-surface{background-position:97% bottom}
}
