html{scroll-behavior:smooth}
body{margin:0;background:#0A0908}
*{box-sizing:border-box}
@keyframes anlRise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.anl-grain{position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNDAiIGhlaWdodD0iMTQwIj48ZmlsdGVyIGlkPSJuIj48ZmVUdXJidWxlbmNlIGJhc2VGcmVxdWVuY3k9IjAuODUiIG51bU9jdGF2ZXM9IjMiLz48L2ZpbHRlcj48cmVjdCB3aWR0aD0iMTQwIiBoZWlnaHQ9IjE0MCIgZmlsdGVyPSJ1cmwoI24pIi8+PC9zdmc+")}
.anl-z img{transition:transform .68s cubic-bezier(.22,1,.36,1)}
.anl-z:hover img{transform:scale(1.035)}

main{background:#0A0908;color:#D8D2C8;font-family:'Golos Text',sans-serif;min-height:100vh;display:flex;align-items:flex-start}
.nav{position:sticky;top:0;align-self:flex-start;flex:0 0 88px;height:100svh;max-height:100vh;min-height:0;z-index:70;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;overflow:hidden;border-right:1px solid rgba(216,210,200,.14);background:#0A0908}
.nav-brand{flex:0 0 auto;font-family:Prata,serif;font-size:15px;letter-spacing:.2em;color:#F7F4EF;text-decoration:none;border:0;writing-mode:vertical-rl;transform:rotate(180deg);padding-bottom:.2em}
.nav-links{flex:0 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(8px,1.6vh,18px);min-height:0}
.nav-num{font-size:11px;letter-spacing:.18em;color:#5C564F;text-decoration:none;border:0;transition:color .25s}
.nav-num.on{color:#E0AE60}
.nav-num:hover{color:#E0AE60}
.nav-num.on:hover{color:#F7F4EF}
.nav-book{flex:0 0 auto;writing-mode:vertical-rl;transform:rotate(180deg);font-size:10px;text-transform:uppercase;letter-spacing:.28em;color:#5C564F;text-decoration:none;border:0;transition:color .25s}
.nav-book:hover{color:#E0AE60}
.content{flex:1 1 auto;min-width:0}
.pad-x{padding-left:clamp(20px,4vw,64px);padding-right:clamp(20px,4vw,64px)}
.wrap{max-width:1680px;margin:0 auto}
.label{font-size:11px;text-transform:uppercase;letter-spacing:.34em;color:#8A837A}
.label .n{color:#E0AE60}

.hero{position:relative;height:92vh;min-height:560px;z-index:2}
.hero-media{position:absolute;inset:0;overflow:hidden}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,9,8,.96) 0%,rgba(10,9,8,.42) 46%,rgba(10,9,8,.3) 78%,rgba(10,9,8,.78) 100%)}
.hero-top{position:absolute;left:0;right:0;top:32px;z-index:2;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:11px;text-transform:uppercase;letter-spacing:.34em;color:#F7F4EF;text-shadow:0 1px 12px rgba(10,9,8,.7)}
.hero-top a{color:inherit;text-decoration:none;transition:color .25s}
.hero-top a:hover{color:#E0AE60}
.hero-title{position:absolute;left:clamp(20px,4vw,64px);right:clamp(20px,4vw,64px);bottom:0;transform:translateY(38%);animation:anlRise 1.1s cubic-bezier(.22,1,.36,1) both}
h1{font-family:Prata,serif;font-weight:400;font-size:clamp(56px,11vw,190px);line-height:.86;letter-spacing:-.035em;color:#F7F4EF;margin:0}
h1 .ind{display:inline-block;padding-left:.34em}

.facts-sec{padding-top:clamp(120px,15vw,240px)}
.facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(216,210,200,.32);border-bottom:1px solid rgba(216,210,200,.14)}
.fact{padding:26px 24px;border-right:1px solid rgba(216,210,200,.14)}
.fact:first-child{padding-left:0}
.fact:last-child{padding-right:0;border-right:0}
.fact-l{font-size:10px;text-transform:uppercase;letter-spacing:.28em;color:#5C564F}
.fact-v{font-family:Prata,serif;font-size:26px;color:#F7F4EF;margin-top:10px}
.fact-v .n{color:#E0AE60}
.story{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);margin-top:clamp(48px,7vw,96px)}
.story-h{font-family:Prata,serif;font-size:clamp(24px,2.5vw,40px);line-height:1.16;letter-spacing:-.02em;color:#F7F4EF;margin:0;max-width:20ch;text-wrap:balance}
.story-p{font-size:16px;line-height:1.62;color:#8A837A;max-width:60ch;margin:26px 0 0}

.frames{padding-top:clamp(72px,11vw,150px)}
.f1{position:relative;padding-left:clamp(20px,4vw,64px)}
.f1-img{width:82%;aspect-ratio:16/9;overflow:hidden;background:#121110}
.f1-num{position:absolute;right:clamp(20px,4vw,64px);bottom:22px;font-family:Prata,serif;font-size:clamp(56px,8vw,132px);line-height:1;color:rgba(247,244,239,.16)}
.f2{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr) minmax(0,2fr);align-items:end;gap:clamp(8px,1.1vw,18px);margin-top:clamp(-40px,-3vw,-16px);padding-left:clamp(20px,4vw,64px);position:relative;z-index:2}
.f2 .a{aspect-ratio:3/4;overflow:hidden;background:#121110;transform:translateY(clamp(24px,4vw,72px))}
.f2 .b{aspect-ratio:4/5;overflow:hidden;background:#121110}
.f2 .v{writing-mode:vertical-rl;font-size:10px;text-transform:uppercase;letter-spacing:.34em;color:#5C564F;padding-bottom:8px}
.f4{margin-top:clamp(72px,10vw,150px);width:100%;aspect-ratio:21/9;overflow:hidden;background:#121110}
.frames img{width:100%;height:100%;object-fit:cover;display:block}

.end{background:#F7F4EF;color:#2A2724;margin-top:clamp(72px,11vw,160px)}
.end-inner{padding-top:clamp(72px,11vw,160px);padding-bottom:clamp(72px,11vw,160px);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,6vw,96px);align-items:end}
blockquote{margin:0;position:relative;padding-left:clamp(28px,3vw,48px)}
blockquote::before{content:"«";position:absolute;left:0;top:-.08em;font-family:Prata,serif;font-size:clamp(70px,8vw,140px);line-height:.8;color:#E0AE60;opacity:.85}
.quote-label{font-size:11px;text-transform:uppercase;letter-spacing:.34em;color:#8A837A;margin-bottom:22px}
.quote{font-family:Prata,serif;font-style:italic;font-size:clamp(30px,3.8vw,62px);line-height:1.1;letter-spacing:-.02em;color:#0A0908;margin:0;max-width:18ch;text-wrap:balance}
.quote-by{margin-top:24px;font-size:11px;text-transform:uppercase;letter-spacing:.22em;color:#5C564F;display:flex;align-items:center;gap:14px}
.quote-by::before{content:"";width:28px;height:1px;background:#E0AE60}
.contact{padding-top:0}
.contact p{font-size:15px;line-height:1.6;color:#5C564F;margin:0}
.btn-dark{margin-top:24px;display:inline-flex;align-items:center;background:#0A0908;color:#F7F4EF;text-decoration:none;border:0;font-family:inherit;font-size:13px;text-transform:uppercase;letter-spacing:.22em;padding:19px 40px;cursor:pointer;transition:background .25s}
.btn-dark:hover{background:#1C1A18}
.btn-light{background:#F7F4EF;color:#0A0908;text-decoration:none;border:0;font-family:inherit;font-size:13px;text-transform:uppercase;letter-spacing:.22em;padding:19px 40px;cursor:pointer;transition:background .25s}

.next{padding-top:clamp(72px,11vw,150px)}
.next a{display:flex;justify-content:space-between;align-items:baseline;gap:24px;flex-wrap:wrap;text-decoration:none;border-top:1px solid rgba(216,210,200,.32);border-bottom:1px solid rgba(216,210,200,.14);padding:30px 0;color:#F7F4EF;transition:color .25s}
.next a:hover{color:#E0AE60}
.next .t{font-family:Prata,serif;font-size:clamp(26px,3vw,44px);letter-spacing:-.02em}
.next .s{font-size:11px;text-transform:uppercase;letter-spacing:.22em;color:#5C564F}

.footer{padding:56px clamp(20px,4vw,64px) 40px;display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.footer-big{font-family:Prata,serif;font-size:clamp(36px,6.5vw,104px);line-height:.88;letter-spacing:-.035em;color:#F7F4EF}
.footer-meta{font-size:12px;color:#5C564F;text-align:right;line-height:1.7}

.popup{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}
.popup[hidden]{display:none}
.popup-back{position:absolute;inset:0;background:rgba(10,9,8,.78);backdrop-filter:blur(6px)}
.popup-card{position:relative;background:#F7F4EF;color:#2A2724;max-width:520px;width:100%;padding:44px 40px 40px;animation:anlRise .5s cubic-bezier(.22,1,.36,1) both}
.popup-card .label{color:#8A837A}
.popup-title{font-family:Prata,serif;font-size:clamp(26px,3vw,38px);line-height:1.08;letter-spacing:-.025em;color:#0A0908;margin:18px 0 0}
.popup-text{font-size:15px;line-height:1.6;color:#5C564F;margin:16px 0 28px}
.popup-card .btn-light{background:#0A0908;color:#F7F4EF}
.popup-card .btn-light:hover{background:#1C1A18}
.popup-x{position:absolute;top:12px;right:14px;background:none;border:0;font-size:28px;line-height:1;color:#5C564F;cursor:pointer;padding:6px}

@media (max-width:760px){
  main{flex-direction:column}
  .nav{position:sticky;top:0;flex:0 0 auto;width:100%;height:auto;max-height:none;flex-direction:row;padding:14px 20px;border-right:0;border-bottom:1px solid rgba(216,210,200,.14)}
  .nav-brand,.nav-book{writing-mode:horizontal-tb;transform:none;padding:0}
  .nav-links{flex-direction:row;gap:14px}
  .nav-book{display:none}
  .content{width:100%}
  .hero{height:78svh;min-height:480px}
  .hero-top{flex-direction:column;gap:6px}
  h1{font-size:clamp(48px,15vw,72px)}
  .hero-title{transform:translateY(30%)}
  .facts-sec{padding-top:80px}
  .facts{grid-template-columns:1fr 1fr}
  .fact{padding:18px 16px 18px 0;border-right:0;border-bottom:1px solid rgba(216,210,200,.14)}
  .fact:nth-child(odd){border-right:1px solid rgba(216,210,200,.14);padding-right:16px}
  .fact:nth-child(even){padding-left:16px}
  .fact:nth-last-child(-n+2){border-bottom:0}
  .story,.end-inner{grid-template-columns:1fr}
  .f1{padding:0}
  .f1-img{width:100%}
  .f2{grid-template-columns:1fr;padding:0 20px;margin-top:12px;gap:12px}
  .f2 .a{transform:none}
  .f2 .v{display:none}
  .f4{aspect-ratio:16/10}
  .footer-meta{text-align:left}
}