/* Destemido — base styles. Most layout lives inline in index.html. */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:#0B0B0A}

a{color:#ECE8E1}
a:hover{color:#FFFFFF}

input,select,button{font:inherit}

html{scroll-behavior:smooth}

img,video{max-width:100%}
.signup button[disabled]{opacity:.6;cursor:wait}
.form-error{margin:0;font-size:14px;color:#F2B8A0}
:focus-visible{outline:2px solid #ECE8E1;outline-offset:3px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}

[hidden]{display:none !important}
.modal{color:#ECE8E1;font-family:"Inter",system-ui,sans-serif;line-height:1.6;position:fixed;inset:0;z-index:50;background:rgba(6,6,5,.8);display:flex;align-items:center;justify-content:center;padding:16px}
body.modal-open{overflow:hidden}

section{scroll-margin-top:80px}



/* ---- finishing ---- */
.site-nav a{position:relative}
.site-nav a::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:1px;background:#ECE8E1;transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.site-nav a:hover::after,.site-nav a:focus-visible::after{transform:scaleX(1)}
.site-nav a[aria-current="page"]{border-bottom:0 !important}
.site-nav a[aria-current="page"]::after{transform:scaleX(1)}
a{transition:color .25s ease}
button,a[style*="background: #ECE8E1"]{transition:background-color .25s ease,color .25s ease,border-color .25s ease}
button[type="submit"]:hover,a[style*="background: #ECE8E1"]:hover{background-color:#FFFFFF !important}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;border-color:#ECE8E1 !important}
input::placeholder,textarea::placeholder{color:#8A857D}
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23ECE8E1' stroke-width='1.5'/></svg>");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px !important}
@media (prefers-reduced-motion: reduce){.site-nav a::after{transition:none}}
::selection{background:#ECE8E1;color:#0B0B0A}

@media (max-width: 760px){.creds span{border-right:0 !important;padding:0 !important}}

/* ---- video embeds ---- */
.video-frame{position:relative;width:100%;aspect-ratio:16/9;background:#141312;border:1px solid #2A2826}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (max-width: 640px){.site-nav .nav-trailer{display:none !important}}

/* ================= motion (active only on html.motion) ================= */
:root{--ease-out:cubic-bezier(.16,1,.3,1);--ease-io:cubic-bezier(.76,0,.24,1)}

/* loader */
.loader{display:none}
html.motion .loader{display:flex;position:fixed;inset:0;z-index:100;background:#0B0B0A;color:#ECE8E1;flex-direction:column;align-items:center;justify-content:center;gap:18px;
  transition:transform 1s var(--ease-io),opacity .45s ease,visibility 0s linear 1s;animation:loader-failsafe .5s ease 5s forwards}
.loader-word{display:flex;font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(30px,6vw,64px);letter-spacing:.32em;padding-left:.32em}
.loader-word span{display:inline-block;opacity:0;transform:translateY(.45em);filter:blur(6px);animation:loader-letter .9s var(--ease-out) forwards;animation-delay:calc(var(--i) * 70ms + 150ms)}
.loader-sub{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(16px,2vw,20px);color:#A39E95;opacity:0;animation:loader-fade .9s ease .85s forwards}
.loader-line{width:120px;height:1px;background:#2A2826;overflow:hidden}
.loader-line::after{content:"";display:block;height:100%;background:#ECE8E1;transform:scaleX(0);transform-origin:left;animation:loader-line 1.5s var(--ease-io) .3s forwards}
/* later pages in a visit: plain fade, no wordmark */
html.motion.intro-seen .loader > *{display:none}
html.motion .loader.done{animation:none}
html.motion:not(.intro-seen) .loader.done{transform:translateY(-100%);visibility:hidden}
html.motion.intro-seen .loader.done{opacity:0;visibility:hidden;transition:opacity .45s ease,visibility 0s linear .45s}
html.motion .loader.gone{display:none}
html.motion .loader.leaving{display:flex;animation:none;transform:none;visibility:visible;opacity:0;transition:opacity .4s ease}
html.motion .loader.leaving > *{display:none}
html.motion .loader.leaving.on{opacity:1}
@keyframes loader-letter{to{opacity:1;transform:none;filter:none}}
@keyframes loader-fade{to{opacity:1}}
@keyframes loader-line{to{transform:scaleX(1)}}
@keyframes loader-failsafe{to{opacity:0;visibility:hidden}}
html.motion body:has(.loader:not(.done):not(.gone)){overflow:hidden}

/* hero entrance */
html.motion .hero-img{scale:1.14;transition:scale 2.8s var(--ease-out);will-change:translate,scale}
html.motion.hero-in .hero-img{scale:1.06}
html.motion [data-hero]{opacity:0;transform:translateY(26px);transition:opacity 1.1s var(--ease-out),transform 1.3s var(--ease-out),background-color .25s ease;transition-delay:var(--d,0ms)}
html.motion.hero-in [data-hero]{opacity:1;transform:none}

/* scroll reveals */
html.motion [data-reveal]{opacity:0;transform:translateY(32px);transition:opacity 1.1s var(--ease-out),transform 1.3s var(--ease-out),filter 1.2s var(--ease-out),clip-path 1.4s var(--ease-out),background-color .25s ease;transition-delay:var(--d,0ms)}
html.motion [data-reveal="title"]{filter:blur(8px);transform:translateY(40px)}
html.motion [data-reveal="img"]{transform:translateY(48px);clip-path:inset(14% 0 0 0)}
html.motion [data-reveal].in{opacity:1;transform:none;filter:none;clip-path:inset(0 0 0 0)}

/* header */
.site-header{transition:transform .5s var(--ease-out),box-shadow .4s ease,background-color .4s ease}
.site-header.is-scrolled{box-shadow:0 10px 30px -12px rgba(0,0,0,.6)}
.site-header.is-hidden{transform:translateY(-100%)}
.scroll-progress{position:absolute;left:0;right:0;bottom:-1px;height:1px;background:#ECE8E1;transform:scaleX(0);transform-origin:left;opacity:.7;pointer-events:none}

@media (prefers-reduced-motion: reduce){
  .loader,.scroll-progress{display:none !important}
  [data-reveal],[data-hero]{opacity:1 !important;transform:none !important;filter:none !important;clip-path:none !important}
  .hero-img{scale:1 !important;translate:none !important}
  .site-header{transition:none}
}

/* ---- in-hero trailer player ---- */
.hero-player{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:72px 24px 40px;background:rgba(6,6,5,.9);
  opacity:0;transition:opacity .6s cubic-bezier(.16,1,.3,1)}
.hero-player.is-open{opacity:1}
.hero-player-frame{position:relative;aspect-ratio:16/9;background:#000;box-shadow:0 30px 80px -20px rgba(0,0,0,.8);transform:scale(.96);transition:transform .8s cubic-bezier(.16,1,.3,1)}
.hero-player.is-open .hero-player-frame{transform:none}
.hero-player-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.hero-player-close{position:absolute;top:16px;right:clamp(12px,3vw,40px);min-height:44px;padding:0 14px;display:inline-flex;align-items:center;gap:10px;background:transparent;border:1px solid #6F6A63;color:#ECE8E1;font-size:12px;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;transition:border-color .25s ease,background-color .25s ease}
.hero-player-close:hover{border-color:#ECE8E1;background:rgba(236,232,225,.08)}
section.is-playing [data-hero]{opacity:0 !important;transition:opacity .4s ease !important;pointer-events:none}
@media (prefers-reduced-motion: reduce){.hero-player,.hero-player-frame{transition:none}}
.btn-outline{transition:border-color .25s ease,background-color .25s ease}
.btn-outline:hover{border-color:#ECE8E1 !important;background-color:rgba(236,232,225,.08)}

/* ================= storytelling ================= */
.chapter{position:relative;overflow:hidden;min-height:clamp(440px,82vh,880px);padding:clamp(96px,12vw,160px) 24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;isolation:isolate}
.chapter-num{position:absolute;z-index:-1;top:50%;left:50%;transform:translate(-50%,-50%);font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(200px,38vw,560px);line-height:1;letter-spacing:.02em;color:transparent;-webkit-text-stroke:1px #2A2826;white-space:nowrap;pointer-events:none;user-select:none}
.chapter-kicker{margin:0;font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:#A39E95}
.chapter-title{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-style:italic;font-size:clamp(46px,7.4vw,108px);line-height:1;letter-spacing:.01em;color:#ECE8E1}
.chapter-rule{display:block;width:64px;height:1px;background:#6F6A63;margin:6px 0}
.chapter-line{margin:0;max-width:560px;text-wrap:balance;font-size:clamp(16px,1.5vw,19px);line-height:1.7;color:#C9C4BB}

/* quotes read like subtitles */
main blockquote{text-wrap:balance}
.w{display:inline-block;white-space:pre}

/* chapter tracker */
.chapter-hud{position:fixed;left:clamp(16px,3vw,40px);bottom:clamp(16px,3vw,32px);z-index:30;display:flex;align-items:baseline;gap:14px;padding:10px 16px;background:rgba(11,11,10,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid #2A2826;color:#ECE8E1;font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .5s ease,transform .6s cubic-bezier(.16,1,.3,1)}
.chapter-hud.is-on{opacity:1;transform:none}
.chapter-hud b{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:20px;letter-spacing:.06em;text-transform:none}
.chapter-hud em{font-style:normal;color:#A39E95}
.chapter-hud .hud-bar{position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:#ECE8E1;transform:scaleX(0);transform-origin:left}
body.modal-open .chapter-hud{opacity:0}

/* scroll cue */
.scroll-cue{position:absolute;right:clamp(20px,4vw,56px);bottom:clamp(32px,4vw,56px);z-index:2;display:flex;flex-direction:column;align-items:center;gap:12px;color:#D8D3CB;text-decoration:none;font-size:11px;letter-spacing:.28em;text-transform:uppercase;writing-mode:vertical-rl}
.scroll-cue i{display:block;width:1px;height:64px;background:linear-gradient(#ECE8E1,#ECE8E1) no-repeat top/1px 0%,rgba(236,232,225,.25);animation:cue 2.2s cubic-bezier(.76,0,.24,1) infinite}
@keyframes cue{0%{background-size:1px 0%;background-position:top}50%{background-size:1px 100%;background-position:top}50.01%{background-position:bottom}100%{background-size:1px 0%;background-position:bottom}}
section.is-playing .scroll-cue{opacity:0;pointer-events:none}
@media (max-width:640px){.scroll-cue{display:none}.chapter-hud{left:50%;transform:translate(-50%,12px);white-space:nowrap}.chapter-hud.is-on{transform:translate(-50%,0)}}

/* motion variants */
html.motion [data-reveal="rule"]{transform:scaleX(0);opacity:1;transition:transform 1.4s var(--ease-io)}
html.motion [data-reveal="rule"].in{transform:scaleX(1)}
html.motion [data-reveal="num"]{opacity:0;transform:translate(-50%,-44%);transition:opacity 2.4s ease,transform 2.4s var(--ease-out)}
html.motion [data-reveal="num"].in{opacity:1;transform:translate(-50%,-50%)}
html.motion [data-reveal="quote"]{opacity:1;transform:none}
html.motion [data-reveal="quote"] .w{opacity:0;transform:translateY(.35em);filter:blur(4px);transition:opacity .9s var(--ease-out),transform 1s var(--ease-out),filter .9s var(--ease-out);transition-delay:calc(var(--d,0ms) + var(--wi) * 55ms)}
html.motion [data-reveal="quote"].in .w{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion: reduce){.scroll-cue i{animation:none;background-size:1px 100%}.chapter-hud{transition:none}[data-reveal="quote"] .w{opacity:1 !important;transform:none !important;filter:none !important}}

/* ================= mobile ================= */
html,body{overflow-x:clip;max-width:100%}
img,iframe,video{max-width:100%}
.nav-toggle{display:none}
.mobile-menu{display:none}
@media (max-width: 760px){
  .site-header{flex-wrap:nowrap !important;padding:10px 16px !important;gap:12px !important;min-height:60px}
  .site-header > a:first-child{font-size:18px !important;letter-spacing:.28em !important}
  .site-nav{display:none !important}
  .nav-toggle{display:inline-flex;align-items:center;gap:12px;min-height:44px;padding:0 4px 0 12px;background:transparent;border:0;color:#ECE8E1;font:inherit;font-size:11px;letter-spacing:.24em;text-transform:uppercase;cursor:pointer}
  .nav-toggle i{position:relative;display:block;width:22px;height:9px}
  .nav-toggle i::before,.nav-toggle i::after{content:"";position:absolute;left:0;right:0;height:1px;background:#ECE8E1;transition:transform .45s cubic-bezier(.76,0,.24,1),top .45s cubic-bezier(.76,0,.24,1)}
  .nav-toggle i::before{top:0}.nav-toggle i::after{top:8px}
  .nav-toggle[aria-expanded="true"] i::before{top:4px;transform:rotate(45deg)}
  .nav-toggle[aria-expanded="true"] i::after{top:4px;transform:rotate(-45deg)}
  .mobile-menu{position:fixed;inset:0;z-index:45;display:flex;flex-direction:column;justify-content:space-between;padding:96px 24px max(32px,env(safe-area-inset-bottom));background:#0B0B0A;color:#ECE8E1;opacity:0;visibility:hidden;transition:opacity .45s ease,visibility 0s linear .45s}
  .mobile-menu.is-open{opacity:1;visibility:visible;transition:opacity .45s ease}
  .mobile-menu ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
  .mobile-menu li{border-top:1px solid #2A2826;opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--i) * 60ms + 80ms)}
  .mobile-menu li:last-child{border-bottom:1px solid #2A2826}
  .mobile-menu.is-open li{opacity:1;transform:none}
  .mobile-menu a{display:flex;align-items:baseline;gap:16px;padding:18px 0;color:#ECE8E1;text-decoration:none;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(28px,8.5vw,40px);line-height:1.1}
  .mobile-menu a small{font-family:"Inter",system-ui,sans-serif;font-size:11px;letter-spacing:.2em;color:#A39E95;min-width:22px}
  .mobile-menu .menu-foot{display:flex;flex-direction:column;gap:6px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#A39E95}
  .mobile-menu .menu-foot a{all:unset;cursor:pointer;color:#C9C4BB}
  body.menu-open{overflow:hidden}
  body.menu-open .site-header{transform:none !important;z-index:46 !important;background:#0B0B0A !important;box-shadow:none}
  body.menu-open .chapter-hud{opacity:0}
}
@media (max-width: 640px){
  section#top > div[style*="max-width: 1100px"]{gap:12px !important}
  .chapter{min-height:clamp(380px,72vh,640px);padding:80px 20px}
  .chapter-title{font-size:clamp(40px,12vw,56px)}
  .chapter-num{font-size:clamp(160px,52vw,260px)}
  .creds{flex-direction:column;align-items:center}
  .modal > div{max-height:calc(100dvh - 32px);overflow-y:auto}
  .chapter-hud{bottom:max(14px,env(safe-area-inset-bottom));padding:8px 14px;gap:10px;font-size:10px;max-width:calc(100vw - 32px)}
  .chapter-hud span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .chapter-hud b{font-size:17px}
  .hero-player{padding:64px 12px 24px}
  section#top h1{font-size:clamp(40px,13.5vw,64px) !important;letter-spacing:.05em !important}
  .hero-player-close{top:10px;right:10px}
}
@media (max-width: 760px) and (prefers-reduced-motion: reduce){.mobile-menu,.mobile-menu li{transition:none}}
.hero-player-unmute{position:absolute;left:50%;bottom:clamp(16px,4vw,48px);transform:translateX(-50%);min-height:44px;padding:0 18px;display:inline-flex;align-items:center;gap:10px;background:#ECE8E1;color:#0B0B0A;border:0;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;box-shadow:0 10px 30px -10px rgba(0,0,0,.7)}
.hero-player-unmute:hover{background:#FFFFFF}