:root{
  --ink:#090806;
  --ink-2:#100e0b;
  --surface:#15110e;
  --surface-2:#1c1712;
  --ivory:#efe5d5;
  --muted:#b9aa96;
  --gold:#a97846;
  --gold-light:#c49a68;
  --gold-dim:#6f4d2e;
  --line:rgba(196,154,104,.24);
  --line-soft:rgba(196,154,104,.11);
  --green:#91a15d;
  --green-soft:rgba(145,161,93,.16);
  --max:1180px;
  --serif:Georgia,"Times New Roman",serif;
  --sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{
  margin:0;
  color:var(--ivory);
  background:
    radial-gradient(circle at 50% -18rem,rgba(169,120,70,.16),transparent 40rem),
    linear-gradient(180deg,#090806 0%,#0d0b09 45%,#090806 100%);
  font-family:var(--sans);
  line-height:1.65;
  overflow-x:hidden;
}
body::before,body::after{
  content:"";position:fixed;top:7vh;bottom:7vh;width:1px;z-index:1;pointer-events:none;opacity:.45;
  background:linear-gradient(transparent,var(--gold-dim) 18%,var(--gold-light) 50%,var(--gold-dim) 82%,transparent)
}
body::before{left:22px} body::after{right:22px}
body.project-page::before,body.project-page::after{
  background:linear-gradient(transparent,rgba(111,77,46,.35) 15%,rgba(145,161,93,.7) 50%,rgba(111,77,46,.35) 85%,transparent)
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}
::selection{background:var(--gold);color:var(--ink)}

.skip-link{position:fixed;left:1rem;top:-5rem;z-index:999;padding:.7rem 1rem;background:var(--ivory);color:var(--ink)}
.skip-link:focus{top:1rem}

#splash{
  position:fixed;inset:0;z-index:100;display:grid;place-items:center;
  background:radial-gradient(circle at 50% 45%,rgba(169,120,70,.18),transparent 30rem),#080705;
  transition:opacity 1s ease,visibility 1s ease
}
#splash.hide{opacity:0;visibility:hidden;pointer-events:none}
.splash-inner{text-align:center;padding:2rem}
.splash-mark{font:500 clamp(3.3rem,9vw,7.5rem)/.92 var(--serif);letter-spacing:-.06em}
.splash-mark span{color:var(--gold-light);font-style:italic}
.splash-tag{margin-top:1.25rem;color:var(--muted);text-transform:uppercase;letter-spacing:.28em;font-size:0.875rem}
.splash-enter{margin-top:2.1rem;border:0;color:var(--gold-light);background:transparent;text-transform:uppercase;letter-spacing:.24em;font-size:0.875rem;cursor:pointer;padding:.8rem 1.2rem}
.splash-enter::after{content:"";display:block;width:0;height:1px;background:var(--gold-light);margin:.45rem auto 0;transition:width .35s ease}
.splash-enter:hover::after,.splash-enter:focus-visible::after{width:100%}

.site-nav{position:sticky;top:0;z-index:40;backdrop-filter:blur(18px);background:linear-gradient(180deg,rgba(9,8,6,.92),rgba(9,8,6,.62));border-bottom:1px solid rgba(196,154,104,.08)}
.nav-inner{max-width:var(--max);margin:auto;padding:.95rem 2.2rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.brand{display:flex;align-items:baseline;gap:.45rem;font:500 1.35rem var(--serif);letter-spacing:-.03em}
.brand em{color:var(--gold-light);font-size:0.875rem;font-weight:400;letter-spacing:.12em;text-transform:uppercase;font-family:var(--sans)}
.nav-links{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap}
.nav-links a{color:var(--muted);font-size:0.875rem;text-transform:uppercase;letter-spacing:.16em;transition:color .2s ease}
.nav-links a:hover,.nav-links a:focus-visible{color:var(--gold-light)}
.nav-toggle{display:none;border:0;background:transparent;color:var(--ivory);letter-spacing:.14em;text-transform:uppercase;font-size:0.875rem;padding:.5rem;cursor:pointer}

main{position:relative;z-index:2}
.section{max-width:var(--max);margin:0 auto;padding:clamp(5rem,9vw,8.5rem) 2.2rem;position:relative}
.section.rule::before{content:"";position:absolute;left:8%;right:8%;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent)}
.kicker{color:var(--gold-light);text-transform:uppercase;letter-spacing:.22em;font-size:0.875rem;margin-bottom:1.1rem}
.project-page .kicker{color:#b7c47d}
.display{font:500 clamp(3.1rem,7vw,6.9rem)/.96 var(--serif);letter-spacing:-.055em;margin:.1rem 0 1.4rem}
.display em{color:var(--gold-light);font-style:italic}
.section-title{margin:0 0 1rem;font:500 clamp(2.45rem,5vw,4.8rem)/1 var(--serif);letter-spacing:-.045em}
.lede{font:italic 1.18rem/1.72 var(--serif);color:#dbcdb9;max-width:45rem}
.copy{max-width:44rem;color:var(--muted);font-size:clamp(.98rem,1.3vw,1.08rem)}
.copy strong{color:var(--ivory);font-weight:500}
.actions{display:flex;gap:.9rem;flex-wrap:wrap;margin-top:2rem}
.btn{display:inline-flex;align-items:center;gap:.7rem;min-height:44px;padding:.8rem 1.05rem;border:1px solid var(--line);color:var(--ivory);text-transform:uppercase;letter-spacing:.14em;font-size:0.875rem;transition:.25s ease}
.btn.primary{background:linear-gradient(135deg,var(--gold),var(--gold-dim));border-color:transparent;color:#0b0907;font-weight:700}
.btn:hover,.btn:focus-visible{transform:translateY(-2px);border-color:var(--gold-light);box-shadow:0 12px 35px rgba(0,0,0,.25)}
.btn.green{border-color:rgba(145,161,93,.45);color:#dbe4bc;background:linear-gradient(135deg,rgba(145,161,93,.16),rgba(145,161,93,.04))}

.hero{min-height:88vh;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(3rem,7vw,7rem);align-items:center;padding-top:5.5rem}
.hero .statement{max-width:680px}
.hero-copy{max-width:38rem;color:var(--muted);font-size:clamp(1rem,1.55vw,1.18rem)}
.hero-signature{position:relative;min-height:530px;display:grid;place-items:center;isolation:isolate}
.hero-signature::before,.hero-signature::after{content:"";position:absolute;border-radius:50%;border:1px solid var(--line);z-index:-1}
.hero-signature::before{width:min(88%,490px);aspect-ratio:1;transform:rotate(15deg)}
.hero-signature::after{width:min(66%,360px);aspect-ratio:1;border-color:rgba(196,154,104,.12);transform:rotate(-12deg)}
.monogram{font:italic 500 clamp(6.5rem,16vw,13rem)/.75 var(--serif);letter-spacing:-.1em;color:var(--ivory);text-shadow:0 28px 75px rgba(0,0,0,.45)}
.monogram span{color:var(--gold-light)}
.monogram-note{position:absolute;bottom:12%;right:10%;max-width:13rem;color:var(--muted);font-size:0.875rem;letter-spacing:.08em}

.worlds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line-soft);margin-top:3rem;border:1px solid var(--line-soft)}
.world{position:relative;min-height:250px;padding:2rem;background:linear-gradient(145deg,rgba(21,17,14,.97),rgba(10,9,7,.98));overflow:hidden;transition:background .3s ease}
.world::after{content:"";position:absolute;inset:auto -20% -55% auto;width:65%;aspect-ratio:1;border:1px solid rgba(196,154,104,.10);border-radius:50%;transition:transform .4s ease}
.world:hover::after{transform:translate(-8%,-8%) scale(1.06)}
.world-index{color:var(--gold-light);font:500 .72rem var(--serif)}
.world h3{font:500 clamp(1.9rem,3vw,3rem)/1.05 var(--serif);margin:2.3rem 0 .75rem}
.world p{max-width:28rem;color:var(--muted);margin:0}
.world-link{display:inline-block;margin-top:1.4rem;color:var(--gold-light);font-size:0.875rem;letter-spacing:.16em;text-transform:uppercase}
.world.cl{background:radial-gradient(circle at 85% 20%,rgba(145,161,93,.10),transparent 38%),linear-gradient(145deg,rgba(21,17,14,.97),rgba(8,9,6,.99))}
.world.cl .world-link{color:#b7c47d}

.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(3rem,7vw,7rem);align-items:start}
.sticky-copy{position:sticky;top:7rem}
.tracklist{margin-top:2.4rem;border-top:1px solid var(--line)}
.track{display:grid;grid-template-columns:2.3rem 1fr auto;gap:1rem;align-items:center;padding:.9rem 0;border-bottom:1px solid var(--line-soft)}
.track-no{color:var(--gold-light);font:500 .78rem var(--serif)}
.track-title{font-family:var(--serif);font-size:1.03rem}
.track-time{color:var(--muted);font-size:0.875rem}
.release-links{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:2.2rem;background:var(--line-soft);border:1px solid var(--line-soft)}
.release-link{padding:1.25rem;background:var(--surface);transition:background .2s ease}
.release-link:hover{background:var(--surface-2)}
.release-link small{display:block;color:var(--gold-light);text-transform:uppercase;letter-spacing:.15em;font-size:0.875rem}
.release-link b{display:block;margin:.4rem 0 0;font:500 1.05rem var(--serif)}

.writing-panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(3rem,7vw,7rem);align-items:center}
.book-object{aspect-ratio:2/3;max-width:340px;margin:auto;display:flex;flex-direction:column;justify-content:space-between;padding:2rem;color:#1c130c;background:radial-gradient(circle at 45% 28%,#ddc198,transparent 24%),linear-gradient(160deg,#b38352,#75502f 72%);box-shadow:0 32px 90px rgba(0,0,0,.45);transform:rotate(-1deg)}
.book-object small{letter-spacing:.18em;text-transform:uppercase;font-size:0.875rem}
.book-object strong{font:500 2.8rem/1 var(--serif)}
.book-object span{font-size:0.875rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase}

.project-feature{padding-top:0;max-width:1320px}
.project-visual{position:relative;overflow:hidden;background:#050605;box-shadow:0 34px 110px rgba(0,0,0,.42)}
.project-visual img{width:100%;aspect-ratio:1.72;object-fit:cover;filter:saturate(.9) contrast(1.03);transition:transform 1.2s ease}
.project-visual:hover img{transform:scale(1.015)}
.project-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(4,5,3,.92) 100%);pointer-events:none}
.project-caption{position:absolute;left:clamp(1.4rem,4vw,3.2rem);right:clamp(1.4rem,4vw,3.2rem);bottom:clamp(1.2rem,3vw,2.6rem);z-index:2;display:flex;justify-content:space-between;align-items:end;gap:2rem}
.project-caption h2{font:500 clamp(2.8rem,7vw,6.2rem)/.9 var(--serif);letter-spacing:-.06em;margin:0}
.project-caption p{max-width:31rem;margin:0;color:#d8d9c7}
.project-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(145,161,93,.16);border:1px solid rgba(145,161,93,.16)}
.project-meta div{padding:1.2rem 1.4rem;background:#0b0c09}
.project-meta small{color:#aab77a;text-transform:uppercase;letter-spacing:.15em;font-size:0.875rem}
.project-meta strong{display:block;margin-top:.25rem;font:500 1rem var(--serif)}

.process-line{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin-top:3rem;background:var(--line-soft);border:1px solid var(--line-soft)}
.process-step{padding:1.5rem 1.15rem;background:var(--surface);min-height:150px}
.process-step b{display:block;color:var(--gold-light);font:500 1.05rem var(--serif);margin-bottom:.7rem}
.process-step span{color:var(--muted);font-size:0.875rem}
.process-arrow{display:none}

.identity{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,8vw,8rem)}
.identity-map{display:grid;gap:.2rem}
.identity-line{display:grid;grid-template-columns:8rem 1fr;gap:1rem;padding:1.15rem 0;border-bottom:1px solid var(--line-soft)}
.identity-line b{font:500 1.15rem var(--serif)}
.identity-line span{color:var(--muted)}

.end{text-align:center;padding-bottom:9rem}
.end .display{max-width:900px;margin:0 auto 1.5rem}
.end p{color:var(--muted);max-width:650px;margin:0 auto}

/* Compleated Loyalty */
.project-hero{padding-top:4rem;max-width:1320px}
.project-hero-media{position:relative;min-height:min(74vh,760px);overflow:hidden;background:#060706}
.project-hero-media img{width:100%;height:100%;min-height:min(74vh,760px);object-fit:cover}
.project-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,6,4,.08),rgba(5,6,4,.10) 42%,rgba(5,6,4,.94) 100%)}
.project-hero-copy{position:absolute;z-index:2;left:clamp(1.5rem,5vw,4rem);right:clamp(1.5rem,5vw,4rem);bottom:clamp(1.5rem,5vw,4rem);display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:end}
.project-hero-copy h1{font:500 clamp(3.4rem,8vw,7.2rem)/.88 var(--serif);letter-spacing:-.065em;margin:0}
.project-hero-copy .summary{max-width:34rem;color:#d8d9c7;font-size:1.04rem}
.project-hero-copy .summary strong{color:#eff0df;font-weight:500}
.project-stripe{height:3px;background:linear-gradient(90deg,var(--gold),#889850 45%,#bec789 60%,transparent)}

.project-intro{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(3rem,8vw,8rem)}
.project-number{font:italic 500 clamp(5rem,12vw,10rem)/.8 var(--serif);color:rgba(145,161,93,.18)}
.pill-row{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.6rem}
.pill{border:1px solid rgba(145,161,93,.25);color:#c9d2a5;padding:.38rem .62rem;border-radius:999px;font-size:0.875rem;letter-spacing:.12em;text-transform:uppercase}

.gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;margin-top:3rem}
.gallery figure{margin:0;position:relative;background:#090a08;border:1px solid rgba(145,161,93,.12);overflow:hidden;cursor:zoom-in}
.gallery figure:nth-child(1){grid-column:span 5}
.gallery figure:nth-child(2){grid-column:span 7}
.gallery figure:nth-child(3){grid-column:span 7}
.gallery figure:nth-child(4){grid-column:span 5}
.gallery figure:nth-child(5){grid-column:span 6}
.gallery figure:nth-child(6){grid-column:span 6}
.gallery img{width:100%;height:100%;min-height:360px;object-fit:contain;background:#060706;transition:transform .5s ease,filter .5s ease}
.gallery figure:hover img{transform:scale(1.012);filter:brightness(1.05)}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:3rem 1.1rem 1rem;background:linear-gradient(transparent,rgba(5,6,4,.94));font-size:0.875rem;color:#d8d9c7;pointer-events:none}
.gallery figcaption strong{display:block;color:#eff0df;font:500 1rem var(--serif)}
.status{display:inline-block;margin-top:.35rem;color:#b5c17a;font-size:0.875rem;letter-spacing:.13em;text-transform:uppercase}

.system-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(145,161,93,.13);border:1px solid rgba(145,161,93,.13);margin-top:2.7rem}
.system-card{min-height:245px;padding:1.7rem;background:linear-gradient(145deg,#11120e,#090a08)}
.system-card small{color:#aab77a;letter-spacing:.17em;text-transform:uppercase;font-size:0.875rem}
.system-card h3{font:500 1.55rem var(--serif);margin:1.25rem 0 .75rem}
.system-card p{color:var(--muted);margin:0;font-size:0.88rem}
.doctrine{margin:4rem 0 0;padding:2.4rem;border-left:1px solid #91a15d;background:linear-gradient(90deg,rgba(145,161,93,.09),transparent)}
.doctrine-line{font:italic 500 clamp(1.65rem,3.8vw,3.1rem)/1.35 var(--serif);letter-spacing:-.025em;color:#e5e8d2}
.doctrine-note{margin-top:1rem;color:var(--muted);max-width:48rem}

.process-visual{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,5rem);align-items:center;margin-top:3rem}
.process-visual img{width:100%;background:#050605;border:1px solid rgba(145,161,93,.12)}
.process-notes{display:grid;gap:1rem}
.process-note{padding:1.15rem 0;border-bottom:1px solid rgba(145,161,93,.12)}
.process-note b{font:500 1.05rem var(--serif);color:#e3e6cf}
.process-note p{margin:.35rem 0 0;color:var(--muted);font-size:0.875rem}

.asset-status{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(145,161,93,.13);border:1px solid rgba(145,161,93,.13);margin-top:2rem}
.asset-status div{padding:1.25rem;background:#0d0e0b}
.asset-status strong{display:block;font:500 1rem var(--serif);margin-bottom:.3rem}
.asset-status span{color:var(--muted);font-size:0.875rem}
.asset-status .ok{color:#becb86}
.asset-status .review{color:#c8aa75}

.image-dialog{width:min(94vw,1500px);max-height:92vh;padding:0;border:1px solid rgba(145,161,93,.26);background:#050605;color:var(--ivory);box-shadow:0 40px 140px rgba(0,0,0,.8)}
.image-dialog::backdrop{background:rgba(2,2,1,.86);backdrop-filter:blur(8px)}
.image-dialog img{max-height:84vh;width:100%;object-fit:contain;background:#030403}
.dialog-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1rem;color:var(--muted);font-size:0.875rem}
.dialog-close{border:1px solid rgba(145,161,93,.28);background:transparent;color:#dfe4c8;padding:.45rem .7rem;cursor:pointer}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .85s ease,transform .85s ease}
.reveal.visible{opacity:1;transform:none}
footer{position:relative;z-index:2;border-top:1px solid var(--line-soft);padding:2rem;color:var(--muted);font-size:0.875rem;text-align:center}
footer span{color:var(--gold-light)}
.project-page footer span{color:#b5c17a}

@media (max-width:920px){
  body::before{left:8px} body::after{right:8px}
  .nav-toggle{display:block}
  .nav-links{display:none;position:absolute;left:0;right:0;top:100%;padding:1rem 1.4rem 1.4rem;background:rgba(9,8,6,.97);border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start}
  .nav-links.open{display:flex}
  .hero,.split,.writing-panel,.identity,.project-intro,.project-hero-copy,.process-visual{grid-template-columns:1fr}
  .hero{min-height:auto;padding-top:7rem}
  .hero-signature{min-height:360px}
  .monogram-note{bottom:5%;right:5%}
  .sticky-copy{position:relative;top:auto}
  .project-caption{display:block}.project-caption p{margin-top:1rem}
  .project-meta{grid-template-columns:1fr}
  .process-line{grid-template-columns:1fr 1fr}
  .release-links{grid-template-columns:1fr}
  .project-hero-copy{gap:1.2rem}
  .gallery figure:nth-child(n){grid-column:span 6}
  .system-grid{grid-template-columns:1fr}
  .asset-status{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  .section{padding-left:1.35rem;padding-right:1.35rem}
  .nav-inner{padding-left:1.35rem;padding-right:1.35rem}
  .worlds{grid-template-columns:1fr}
  .world{min-height:220px}
  .project-feature{padding-left:0;padding-right:0}
  .project-caption{left:1.2rem;right:1.2rem}
  .project-caption p{font-size:0.875rem}
  .process-line{grid-template-columns:1fr}
  .identity-line{grid-template-columns:1fr}
  .project-hero{padding-left:0;padding-right:0;padding-top:0}
  .project-hero-media,.project-hero-media img{min-height:72vh}
  .project-hero-copy{left:1.25rem;right:1.25rem;bottom:1.4rem}
  .gallery{display:block}.gallery figure{margin-bottom:1rem}.gallery img{min-height:260px}
  .asset-status{grid-template-columns:1fr}
  .doctrine{padding:1.4rem}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
  #splash{display:none}
  .reveal{opacity:1;transform:none}
}

/* Deployment accessibility and memoir integration */
.reveal{opacity:1;transform:none}
.book-cover img{display:block;max-height:540px;max-width:100%;width:auto;margin:auto}
.memoir-invitation blockquote{font:italic clamp(1.6rem,3.5vw,2.8rem)/1.4 var(--serif);margin:1rem 0;max-width:950px;color:var(--ivory)}
.memoir-invitation p{color:var(--muted)}
:focus-visible{outline:2px solid var(--gold-light);outline-offset:5px}
.nav-links{flex-wrap:wrap}.brand{flex-shrink:0}
@media(max-width:600px){.brand em{display:none}.display{font-size:clamp(2.5rem,10vw,3.8rem)}.doctrine-line{overflow-wrap:anywhere}}

.splash-context{margin:1.4rem 0 0;color:var(--gold-light);font:italic 500 clamp(1.4rem,3vw,2rem)/1.35 var(--serif)}
