﻿@font-face{font-family:"Source Sans 3";src:url("../fonts/SourceSans3-latin-variable.woff2") format("woff2");font-style:normal;font-weight:200 900;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url("../fonts/SourceSerif4-latin-variable.woff2") format("woff2");font-style:normal;font-weight:200 900;font-display:swap}
:root{--orange:#B04A28;--orange-dark:#8A3720;--gold:#C9A875;--gold-dark:#A88853;--ink:#1A1614;--ink-2:#1A1E36;--ink-3:#2A3050;--paper:#F3EEE6;--paper-warm:#EBE4D6;--white:#FFFFFF;--muted:#6B5F52;--muted-2:#9A8F80;--rule:rgba(201,168,117,.28);--text-on-orange:#FFFFFF;--font-display:"Source Serif 4",Georgia,serif;--font-body:"Source Sans 3",Arial,sans-serif;--wrap:1240px;--pad:clamp(1.25rem,4vw,3rem);--sect:clamp(5rem,10vw,9rem);--d-fast:180ms;--d-base:320ms;--ease:cubic-bezier(.2,.7,.2,1)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:1rem/1.65 var(--font-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.wrap{width:min(var(--wrap),calc(100% - var(--pad) * 2));margin-inline:auto}
.section{padding-block:var(--sect)}
.section--ink{background:var(--ink);color:var(--paper)}
.section--paper-warm{background:var(--paper-warm)}
.eyebrow{display:inline-block;font:800 .688rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--orange)}
.h2{font-family:var(--font-display);font-weight:500;font-size:clamp(2.25rem,5vw,4.25rem);line-height:1;letter-spacing:-.045em;margin:0}
.h2 em{font-style:italic;font-weight:400;color:var(--orange)}
.btn{display:inline-flex;align-items:center;gap:.75rem;padding:1.05rem 1.6rem;font:700 .75rem/1 var(--font-body);letter-spacing:.18em;text-transform:uppercase;border:1px solid transparent;transition:transform var(--d-fast) var(--ease),background var(--d-base),color var(--d-base),border-color var(--d-base)}
.btn:hover{transform:translateY(-2px)}
.btn--orange{background:var(--orange);color:var(--text-on-orange)}
.btn--orange:hover{background:var(--orange-dark);color:var(--white)}
.btn--ghost{border-color:rgba(255,255,255,.35);color:var(--paper);background:transparent}
.btn--ghost:hover{border-color:var(--paper);background:rgba(255,255,255,.06)}
.btn--arrow span{transition:transform var(--d-base) var(--ease)}
.btn--arrow:hover span{transform:translateX(4px)}
.nav{position:fixed;inset:0 0 auto;z-index:100;padding-block:1.1rem;background:transparent;transition:background var(--d-base),border-color var(--d-base),padding var(--d-base);border-bottom:1px solid transparent}
.nav.is-scrolled{background:rgba(10,10,10,.9);backdrop-filter:blur(14px);border-color:rgba(255,255,255,.06);padding-block:.8rem}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:2rem}
.brand{display:flex;align-items:center;gap:.9rem;font:500 1.05rem/1 var(--font-display);color:var(--paper);letter-spacing:-.01em}
.brand img{width:auto;height:38px}
.brand__meta{font:700 .688rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--muted-2);padding-left:.9rem;border-left:1px solid rgba(255,255,255,.18)}
.nav-links{display:flex;align-items:center;gap:2.2rem;list-style:none;margin:0;padding:0}
.nav-links a{font:700 .72rem/1 var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:rgba(247,246,242,.72);transition:color var(--d-base)}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--orange)}
.nav-cta{display:flex;align-items:center;gap:1rem}
.nav-cta .btn{padding:.8rem 1.2rem;font-size:.688rem}
.nav-cta .btn--play{color:var(--orange);border:1px solid rgba(17,22,42,.4);background:transparent}
.nav-cta .btn--play:hover{background:rgba(17,22,42,.1);border-color:var(--orange)}
.burger{display:none;width:44px;height:44px;padding:10px;flex-direction:column;gap:5px;justify-content:center;align-items:center}
.burger span{display:block;width:22px;height:1.5px;background:var(--paper);transition:transform var(--d-base),opacity var(--d-base)}
@media (max-width:900px){.nav-links,.nav-cta .btn:not(.btn--play){display:none}.burger{display:flex}}
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;padding-block:9rem 4rem;background:var(--ink);color:var(--paper);overflow:hidden;isolation:isolate}
.hero__media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero__media img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(1.06) brightness(.82);transform:scale(1.03);animation:hero-drift 24s ease-in-out infinite alternate}
.hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,10,.94) 0%,rgba(10,10,10,.72) 38%,rgba(10,10,10,.28) 72%,rgba(10,10,10,.15) 100%),linear-gradient(0deg,rgba(10,10,10,.88),transparent 45%)}
.hero__content{position:relative;z-index:2}
.hero__content .eyebrow{display:block;margin-bottom:1.8rem;color:var(--gold)}
.hero h1{font-family:var(--font-display);font-weight:500;font-size:clamp(3.2rem,10vw,9.5rem);line-height:.9;letter-spacing:-.07em;margin:0 0 2rem;max-width:14ch}
.hero h1 em{font-style:italic;font-weight:400;color:var(--orange)}
.hero__lede{font-family:var(--font-display);font-size:clamp(1.05rem,1.35vw,1.3rem);line-height:1.7;color:rgba(247,246,242,.82);max-width:42rem;margin:0 0 2.6rem}
.hero__actions{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
.hero__meta{position:absolute;bottom:1.6rem;left:0;right:0;display:flex;justify-content:space-between;align-items:center;font:700 .625rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:rgba(247,246,242,.55);padding-inline:var(--pad)}
.hero__scroll{display:inline-flex;align-items:center;gap:.9rem}
.hero__scroll::before{content:"";width:36px;height:1px;background:var(--gold)}
@keyframes hero-drift{from{transform:scale(1.03) translate(0,0)}to{transform:scale(1.09) translate(-1%,-1%)}}
.proof{background:var(--paper-warm);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding-block:clamp(2.2rem,4vw,3.4rem)}
.proof__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.proof__item{padding-inline:1.8rem;border-right:1px solid var(--rule);display:flex;flex-direction:column;gap:.6rem}
.proof__item:first-child{padding-left:0}
.proof__item:last-child{border-right:0;padding-right:0}
.proof__num{font-family:var(--font-display);font-weight:500;font-size:clamp(2.6rem,4.4vw,4rem);line-height:1;letter-spacing:-.045em;color:var(--ink)}
.proof__num sup{font-size:.45em;color:var(--orange);vertical-align:super;margin-left:.1em}
.proof__label{font:700 .688rem/1.3 var(--font-body);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
@media (max-width:800px){.proof__grid{grid-template-columns:repeat(2,1fr);gap:2rem 0}.proof__item{padding-inline:1rem}.proof__item:nth-child(2){border-right:0}.proof__item:nth-child(3),.proof__item:nth-child(4){padding-top:1.6rem;border-top:1px solid var(--rule)}.proof__item:nth-child(3){padding-left:0}}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:2.5rem;margin-bottom:clamp(2.5rem,4vw,4rem)}
.section-head__title{max-width:42rem}
.section-head__title .eyebrow{display:block;margin-bottom:1.2rem}
.section-head__copy{max-width:22rem;font-size:.95rem;line-height:1.7;color:var(--muted)}
@media (max-width:800px){.section-head{flex-direction:column;align-items:flex-start;gap:1.2rem}}
.projects{display:grid;grid-template-columns:1.2fr .9fr .9fr;gap:1rem}
.project{position:relative;display:block;overflow:hidden;isolation:isolate;aspect-ratio:4/5;background:var(--ink-2);color:var(--paper)}
.project img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.04) brightness(.96);transition:transform 800ms var(--ease),filter 800ms var(--ease)}
.project::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,10,.92) 0%,rgba(10,10,10,.3) 38%,transparent 62%);pointer-events:none}
.project:hover img{transform:scale(1.04)}
.project__num{position:absolute;top:1.4rem;right:1.4rem;font-family:var(--font-display);font-style:italic;font-size:1.1rem;color:var(--gold)}
.project__body{position:absolute;inset:auto 0 0 0;padding:1.6rem;z-index:2}
.project__type{display:block;font:800 .625rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--orange);margin-bottom:.8rem}
.project__title{font-family:var(--font-display);font-weight:500;font-size:clamp(1.35rem,1.9vw,1.75rem);line-height:1.08;letter-spacing:-.025em;margin:0 0 .5rem}
.project__loc{font:700 .688rem/1 var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:rgba(247,246,242,.72)}
@media (max-width:900px){.projects{grid-template-columns:1fr}}
.services{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.service{position:relative;overflow:hidden;isolation:isolate;aspect-ratio:3/4;background:var(--ink-2);color:var(--paper);padding:2rem;display:flex;flex-direction:column;justify-content:flex-end}
.service img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:saturate(.7) contrast(1.05) brightness(.72);transition:transform 900ms var(--ease)}
.service::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(10,10,10,.92),rgba(10,10,10,.35) 55%,rgba(10,10,10,.15))}
.service:hover img{transform:scale(1.05)}
.service__num{position:absolute;top:1.6rem;left:1.6rem;font-family:var(--font-display);font-style:italic;font-size:1.1rem;color:var(--gold)}
.service h3{font-family:var(--font-display);font-weight:500;font-size:clamp(1.6rem,2.4vw,2.2rem);line-height:1.05;letter-spacing:-.03em;margin:0 0 .9rem}
.service p{font-size:.92rem;line-height:1.65;color:rgba(247,246,242,.78);margin:0 0 1.4rem;max-width:30ch}
.service__link{display:inline-flex;align-items:center;gap:.6rem;font:700 .688rem/1 var(--font-body);letter-spacing:.2em;text-transform:uppercase;color:var(--orange)}
@media (max-width:900px){.services{grid-template-columns:1fr}}
.approach__grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.approach__rows{border-top:1px solid rgba(255,255,255,.15)}
.approach__row{display:grid;grid-template-columns:2.4rem 1fr;gap:1.5rem;padding:1.8rem 0;border-bottom:1px solid rgba(255,255,255,.15)}
.approach__row .num{font-family:var(--font-display);font-style:italic;color:var(--gold);font-size:1.05rem;line-height:1.2}
.approach__row h4{font-family:var(--font-display);font-weight:500;font-size:1.35rem;line-height:1.2;letter-spacing:-.02em;margin:0 0 .55rem}
.approach__row p{font-size:.92rem;line-height:1.7;color:rgba(247,246,242,.7);margin:0;max-width:44ch}
@media (max-width:800px){.approach__grid{grid-template-columns:1fr}}
.cta{background:var(--ink);color:var(--paper);padding-block:clamp(5rem,9vw,8rem)}
.cta h2{font-family:var(--font-display);font-weight:500;font-size:clamp(2.6rem,6.5vw,6rem);line-height:.96;letter-spacing:-.055em;margin:0 0 1.8rem;max-width:18ch}
.cta h2 em{font-style:italic;font-weight:400;color:var(--orange)}
.cta__actions{display:flex;flex-wrap:wrap;gap:1rem}
.foot{background:var(--ink);color:var(--paper);border-top:1px solid rgba(255,255,255,.08);padding-block:clamp(3rem,6vw,5rem) 1.6rem}
.foot__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:3rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.08)}
.foot__brand img{height:42px;width:auto;margin-bottom:1.2rem}
.foot__brand p{max-width:34ch;font-size:.92rem;line-height:1.7;color:rgba(247,246,242,.6);margin:0 0 1.2rem}
.foot__grade{display:inline-block;font:700 .625rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.foot h5{font:800 .688rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:0 0 1.2rem}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.8rem}
.foot ul a,.foot ul span{font-size:.88rem;line-height:1.6;color:rgba(247,246,242,.72);transition:color var(--d-base)}
.foot ul a:hover{color:var(--orange)}
.foot__legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;padding-top:1.6rem;font-size:.75rem;color:rgba(247,246,242,.4)}
.foot__legal a{color:inherit;margin-left:1.2rem}
@media (max-width:800px){.foot__grid{grid-template-columns:1fr;gap:2rem}}
.film{position:fixed;inset:0;z-index:500;background:var(--ink);display:none}
.film.is-open{display:block}
.film__slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1.35s ease,visibility 1.35s}
.film__slide.is-active{opacity:1;visibility:visible}
.film__media{position:absolute;inset:-4%;background-size:cover;background-position:center;filter:saturate(.85) contrast(1.04) brightness(.85);transform:scale(1.08);transition:transform 9s linear}
.film__slide.is-active .film__media{transform:scale(1)}
.film__overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,10,.94) 0%,rgba(10,10,10,.6) 45%,rgba(10,10,10,.15) 100%),linear-gradient(0deg,rgba(10,10,10,.72),transparent 55%)}
.film__slide--right .film__overlay{background:linear-gradient(270deg,rgba(10,10,10,.94) 0%,rgba(10,10,10,.6) 45%,rgba(10,10,10,.15) 100%),linear-gradient(0deg,rgba(10,10,10,.72),transparent 55%)}
.film__content{position:absolute;inset:0;padding:8vw;display:flex;flex-direction:column;justify-content:center;max-width:62rem}
.film__slide--right .film__content{margin-left:auto;align-items:flex-end;text-align:right}
.film__kicker{font:800 .688rem/1 var(--font-body);letter-spacing:.3em;text-transform:uppercase;color:var(--orange);margin-bottom:1.6rem}
.film__title{font-family:var(--font-display);font-weight:500;font-size:clamp(3rem,11vw,10rem);line-height:.84;letter-spacing:-.08em;text-transform:uppercase;margin:0 0 2rem;color:var(--paper)}
.film__title em{display:block;font-style:italic;font-weight:400;text-transform:none;color:var(--orange);letter-spacing:-.06em}
.film__lede{font-family:var(--font-display);font-size:clamp(1.05rem,1.5vw,1.35rem);line-height:1.6;color:rgba(247,246,242,.82);max-width:40rem;margin:0}
.film__slide--text{background:var(--ink)}
.film__slide--text .film__media{display:none}
.film__slide--text .film__overlay{background:linear-gradient(rgba(201,168,117,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,117,.08) 1px,transparent 1px);background-size:92px 92px}
.film__slide--text .film__content{margin-inline:auto;max-width:min(70rem,90vw);align-items:center;text-align:center}
.film__chrome{position:absolute;inset:0;z-index:10;pointer-events:none;padding:1.6rem var(--pad);display:flex;flex-direction:column;justify-content:space-between}
.film__top{display:flex;justify-content:space-between;align-items:center}
.film__brand{font:500 .95rem/1 var(--font-display);color:var(--paper);letter-spacing:.1em}
.film__brand small{font:700 .625rem/1 var(--font-body);letter-spacing:.22em;color:var(--gold);margin-left:.7rem}
.film__exit{pointer-events:auto;padding:.7rem 1.1rem;border:1px solid rgba(255,255,255,.3);color:var(--paper);font:700 .688rem/1 var(--font-body);letter-spacing:.18em;text-transform:uppercase;background:rgba(10,10,10,.4)}
.film__exit:hover{border-color:var(--orange);background:rgba(17,22,42,.12)}
.film__bottom{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.film__location{font:700 .625rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:rgba(247,246,242,.6)}
.film__counter{font:700 .688rem/1 var(--font-body);letter-spacing:.22em;color:rgba(247,246,242,.6)}
.film__counter b{color:var(--orange);margin-right:.4rem}
.film__progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.1)}
.film__progress span{display:block;height:100%;width:0;background:var(--orange);transition:width 200ms linear}
@media (max-width:700px){.film__content{padding:6rem 1.5rem 4rem}.film__slide--right .film__content{margin-left:0;align-items:flex-start;text-align:left}.film__title{font-size:clamp(2.4rem,12vw,5rem)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}.hero__media img{animation:none}.film__media{transform:none}}

/* ---- Inner page hero ---- */
.page-hero{position:relative;min-height:56svh;display:flex;align-items:flex-end;padding-block:8rem 3rem;background:var(--ink);color:var(--paper);overflow:hidden;isolation:isolate}
.page-hero__media{position:absolute;inset:0;z-index:-2}
.page-hero__media img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(1.06) brightness(.75)}
.page-hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,10,.92) 0%,rgba(10,10,10,.5) 55%,rgba(10,10,10,.25) 100%),linear-gradient(0deg,rgba(10,10,10,.75),transparent 55%)}
.page-hero__content{position:relative;z-index:2}
.page-hero__content .eyebrow{display:block;margin-bottom:1.4rem}
.page-hero h1{font-family:var(--font-display);font-weight:500;font-size:clamp(2.6rem,7vw,6rem);line-height:.95;letter-spacing:-.06em;margin:0;max-width:16ch}
.page-hero h1 em{font-style:italic;font-weight:400;color:var(--orange)}
.reading{max-width:46rem}
.reading h2{font-family:var(--font-display);font-weight:500;font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.15;letter-spacing:-.03em;margin:2.4rem 0 .9rem}
.reading h3{font-family:var(--font-display);font-weight:500;font-size:1.25rem;line-height:1.2;letter-spacing:-.02em;margin:1.8rem 0 .6rem}
.reading p{font-size:1rem;line-height:1.85;color:var(--ink-3);margin:0 0 1.1rem}
.reading ul{margin:0 0 1.2rem;padding-left:1.2rem}
.reading li{font-size:1rem;line-height:1.8;color:var(--ink-3);margin-bottom:.5rem}
.reading a{color:var(--orange);text-decoration:underline;text-underline-offset:3px}
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,4rem);align-items:start}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}
.contact-info{background:var(--ink);color:var(--paper);padding:2.2rem}
.contact-info .eyebrow{color:var(--gold);margin-bottom:1rem;display:block}
.contact-info h2{font-family:var(--font-display);font-weight:500;font-size:clamp(1.6rem,2.4vw,2rem);line-height:1.1;letter-spacing:-.03em;margin:0 0 1.6rem}
.contact-info__row{padding:1.1rem 0;border-top:1px solid rgba(255,255,255,.15)}
.contact-info__row:first-of-type{border-top:0;padding-top:0}
.contact-info__label{display:block;font:800 .625rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:.5rem}
.contact-info__row a,.contact-info__row span{color:rgba(247,246,242,.88);font-size:.95rem;line-height:1.6}
.contact-form{background:var(--paper-warm);padding:clamp(1.5rem,3.5vw,2.4rem)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-grid .field--full{grid-column:1/-1}
@media (max-width:700px){.form-grid{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:.5rem}
.field label{font:700 .688rem/1 var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.field input,.field select,.field textarea{width:100%;padding:.9rem 1rem;border:1px solid var(--rule);border-radius:0;background:var(--paper);color:var(--ink);font:400 1rem var(--font-body)}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--orange);border-color:var(--orange)}
.field textarea{min-height:140px;resize:vertical}
.form-actions{grid-column:1/-1;display:flex;margin-top:.6rem}
.privacy-consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.85rem;color:var(--ink-3);line-height:1.6}
.privacy-consent input{margin-top:.25rem}
.filters{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2.4rem;padding-bottom:1.4rem;border-bottom:1px solid var(--rule)}
.filter-btn{padding:.7rem 1.1rem;background:transparent;border:1px solid var(--rule);font:700 .688rem/1 var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);cursor:pointer;transition:all var(--d-base)}
.filter-btn:hover{border-color:var(--orange);color:var(--orange)}
.filter-btn.is-active{background:var(--orange);border-color:var(--orange);color:var(--text-on-orange)}
.project-list{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
@media (max-width:900px){.project-list{grid-template-columns:1fr}}
.project-row{background:var(--paper);border:1px solid var(--rule);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--d-base),box-shadow var(--d-base)}
.project-row:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(10,10,10,.08)}
.project-row__image{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--ink-2)}
.project-row__image img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.04) brightness(.96);transition:transform 800ms var(--ease)}
.project-row:hover .project-row__image img{transform:scale(1.04)}
.project-row__body{padding:1.4rem 1.5rem 1.6rem}
.project-row__type{display:inline-block;font:800 .625rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--orange);margin-bottom:.7rem}
.project-row h3{font-family:var(--font-display);font-weight:500;font-size:1.3rem;line-height:1.15;letter-spacing:-.02em;margin:0 0 .7rem}
.project-row p{font-size:.9rem;line-height:1.7;color:var(--ink-3);margin:0 0 .9rem}
.project-row__meta{display:flex;flex-wrap:wrap;gap:.4rem 1rem;font:700 .688rem/1.4 var(--font-body);letter-spacing:.06em;color:var(--muted);text-transform:uppercase}
.project-row__meta strong{color:var(--ink);font-weight:700}
.project-pending{display:grid;place-items:center;background:var(--ink-2);aspect-ratio:16/9;text-align:center;padding:2rem;border:1px solid var(--rule)}
.project-pending .eyebrow{color:var(--orange);margin-bottom:.9rem}
.project-pending h4{font-family:var(--font-display);font-weight:500;font-size:1.1rem;color:var(--paper-warm);letter-spacing:-.02em;line-height:1.2;margin:0}
.empty-state{padding:3rem 2rem;text-align:center;background:var(--paper-warm);border:1px solid var(--rule);margin-top:2rem}
.empty-state h2{font-family:var(--font-display);font-weight:500;font-size:1.5rem;letter-spacing:-.03em;margin:0 0 .6rem}
.empty-state p{font-size:.95rem;line-height:1.7;color:var(--ink-3);margin:0}
.service-detail{display:grid;grid-template-columns:1fr 1fr;gap:0;background:var(--paper);border:1px solid var(--rule);overflow:hidden;margin-bottom:1.5rem}
@media (max-width:900px){.service-detail{grid-template-columns:1fr}}
.service-detail__media{position:relative;aspect-ratio:1;background:var(--ink-2);overflow:hidden}
.service-detail__media img{width:100%;height:100%;object-fit:cover;filter:saturate(.82) contrast(1.05) brightness(.92)}
.service-detail__body{padding:clamp(1.6rem,3.5vw,2.6rem);display:flex;flex-direction:column;justify-content:center}
.service-detail__num{font-family:var(--font-display);font-style:italic;color:var(--gold-dark);font-size:1.2rem;margin-bottom:1rem}
.service-detail h2{font-family:var(--font-display);font-weight:500;font-size:clamp(1.6rem,2.8vw,2.4rem);line-height:1.05;letter-spacing:-.035em;margin:0 0 1rem}
.service-detail p{font-size:.95rem;line-height:1.8;color:var(--ink-3);margin:0 0 1.4rem}
.bullet-list{list-style:none;margin:0;padding:0}
.bullet-list li{padding:.7rem 0;border-top:1px solid var(--rule);font-size:.9rem;line-height:1.6;color:var(--ink-3);display:flex;gap:.7rem;align-items:flex-start}
.bullet-list li::before{content:"→";color:var(--orange);flex:none;font-weight:700}
.credentials{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:2rem}
@media (max-width:700px){.credentials{grid-template-columns:1fr}}
.credential{display:grid;grid-template-columns:120px 1fr;gap:1.2rem;padding:1rem;background:var(--paper);border:1px solid var(--rule);align-items:center;text-decoration:none;transition:transform var(--d-base)}
.credential:hover{transform:translateY(-2px)}
.credential img{width:120px;height:150px;object-fit:cover;object-position:top;background:var(--paper-warm)}
.credential strong{display:block;font-family:var(--font-display);font-weight:500;font-size:1rem;letter-spacing:-.02em;color:var(--ink);margin-bottom:.35rem}
.credential span{font-size:.82rem;color:var(--muted);line-height:1.5}
.job-list{display:grid;gap:1rem;margin-bottom:3rem}
.job-row{display:flex;justify-content:space-between;align-items:center;gap:2rem;padding:1.5rem 1.6rem;background:var(--paper);border:1px solid var(--rule);text-decoration:none;transition:border-color var(--d-base),transform var(--d-base)}
.job-row:hover{border-color:var(--orange);transform:translateY(-2px)}
.job-row h3{font-family:var(--font-display);font-weight:500;font-size:1.25rem;line-height:1.2;letter-spacing:-.02em;margin:0 0 .5rem}
.job-row__meta{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;font:700 .688rem/1 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.job-row__cta{font:700 .688rem/1 var(--font-body);letter-spacing:.2em;text-transform:uppercase;color:var(--orange);white-space:nowrap}
@media (max-width:700px){.job-row{flex-direction:column;align-items:flex-start;gap:1rem}}
.sitemap-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem 3rem}
@media (max-width:700px){.sitemap-grid{grid-template-columns:1fr}}
.sitemap-col h3{font:800 .688rem/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--gold-dark);margin:0 0 1.2rem;padding-bottom:.8rem;border-bottom:1px solid var(--rule)}
.sitemap-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.7rem}
.sitemap-col a{font-size:.95rem;color:var(--ink);transition:color var(--d-base)}
.sitemap-col a:hover{color:var(--orange)}
.mobile-menu{position:fixed;inset:0;z-index:400;background:var(--ink);padding:clamp(2rem,6vw,4rem);display:none;flex-direction:column;justify-content:center;gap:1.2rem;opacity:0;transition:opacity var(--d-base)}
.mobile-menu.is-open{display:flex;opacity:1}
.mobile-menu__brand{font-family:var(--font-display);font-weight:500;font-size:1.4rem;color:var(--paper);letter-spacing:.05em;margin-bottom:1rem}
.mobile-menu__brand small{color:var(--gold);font:700 .625rem/1 var(--font-body);letter-spacing:.22em;margin-left:.7rem}
.mobile-menu a{font-family:var(--font-display);font-weight:500;font-size:clamp(1.5rem,4.5vw,2rem);line-height:1.15;letter-spacing:-.03em;color:var(--paper);text-decoration:none;padding-block:.6rem;border-bottom:1px solid rgba(255,255,255,.08);min-height:44px;display:flex;align-items:center;transition:color var(--d-base)}
.mobile-menu a:hover,.mobile-menu a[aria-current="page"]{color:var(--orange)}
.mobile-menu__close{position:absolute;top:1.2rem;right:1.2rem;width:48px;height:48px;border:1px solid rgba(255,255,255,.2);background:transparent;color:var(--paper);font-size:1.4rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
.mobile-menu__close:hover{border-color:var(--orange);color:var(--orange)}
body.menu-open{overflow:hidden}

/* Footer social */
.foot__social{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem}
.foot__social a{display:inline-flex;align-items:center;justify-content:center;padding:.55rem .9rem;border:1px solid rgba(201,168,117,.3);font:700 .625rem/1 var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:rgba(247,246,242,.7);transition:all var(--d-base)}
.foot__social a:hover{border-color:var(--orange);color:var(--orange);background:rgba(17,22,42,.08)}



/* ==========================================================================
   MOBILE MENU v2 — sliding panel, staggered reveal, editorial links
   ========================================================================== */

.mobile-menu{
  position:fixed;
  inset:0;
  z-index:400;
  background:rgba(10,10,10,.5);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:5rem clamp(1.5rem,6vw,3rem) 3rem;
  opacity:0;
  visibility:hidden;
  transition:opacity .4s cubic-bezier(.2,.7,.2,1), visibility .4s;
}
.mobile-menu.is-open{
  opacity:1;
  visibility:visible;
}
.mobile-menu::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(10,10,10,.98) 0%, rgba(10,10,10,.92) 100%);
  z-index:-1;
}

.mobile-menu__brand{
  position:absolute;
  top:1.6rem;
  left:clamp(1.5rem,6vw,3rem);
  font-family:var(--font-display);
  font-weight:500;
  font-size:1.2rem;
  color:var(--paper);
  letter-spacing:.05em;
  margin:0;
}
.mobile-menu__brand small{
  color:var(--gold);
  font:700 .625rem/1 var(--font-body);
  letter-spacing:.22em;
  margin-left:.6rem;
}

.mobile-menu__close{
  position:absolute;
  top:1rem;
  right:clamp(1rem,4vw,1.6rem);
  width:48px;
  height:48px;
  border:1px solid rgba(201,168,117,.35);
  background:transparent;
  color:var(--paper);
  font-size:1.3rem;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  transition:border-color .3s, color .3s, transform .3s;
}
.mobile-menu__close:hover{
  border-color:var(--orange);
  color:var(--orange);
  transform:rotate(90deg);
}

.mobile-menu a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-family:var(--font-display);
  font-weight:500;
  font-size:clamp(1.9rem,7vw,2.6rem);
  line-height:1.05;
  letter-spacing:-.035em;
  color:var(--paper);
  text-decoration:none;
  padding:1.1rem 0;
  border-bottom:1px solid rgba(255,255,255,.08);
  min-height:64px;
  opacity:0;
  transform:translateY(20px);
  transition:color .3s, padding-left .3s;
}
.mobile-menu.is-open a{
  animation:menu-link-in .6s cubic-bezier(.2,.7,.2,1) forwards;
}
.mobile-menu.is-open a:nth-of-type(1){animation-delay:.08s}
.mobile-menu.is-open a:nth-of-type(2){animation-delay:.14s}
.mobile-menu.is-open a:nth-of-type(3){animation-delay:.20s}
.mobile-menu.is-open a:nth-of-type(4){animation-delay:.26s}
.mobile-menu.is-open a:nth-of-type(5){animation-delay:.32s}
.mobile-menu.is-open a:nth-of-type(6){animation-delay:.38s}

@keyframes menu-link-in{
  to{opacity:1;transform:none}
}

.mobile-menu a:hover,
.mobile-menu a[aria-current="page"]{
  color:var(--orange);
  padding-left:.5rem;
}
.mobile-menu a::after{
  content:"→";
  font-family:var(--font-body);
  font-weight:400;
  font-size:1rem;
  color:var(--orange);
  opacity:0;
  transform:translateX(-8px);
  transition:opacity .3s, transform .3s;
}
.mobile-menu a:hover::after,
.mobile-menu a[aria-current="page"]::after{
  opacity:1;
  transform:translateX(0);
}
.mobile-menu a[href*="showcase"]{
  color:var(--orange);
}
.mobile-menu a[href*="showcase"]::after{
  content:"▶";
  opacity:1;
  transform:none;
  font-size:.8rem;
}

/* Burger icon refinement */
.burger{
  display:none;
  width:48px;
  height:48px;
  padding:12px;
  flex-direction:column;
  gap:6px;
  justify-content:center;
  align-items:center;
  background:transparent;
  border:1px solid rgba(201,168,117,.3);
  border-radius:0;
  cursor:pointer;
  transition:border-color .3s;
}
.burger:hover{border-color:var(--orange)}
.burger span{
  display:block;
  width:22px;
  height:1.5px;
  background:var(--paper);
  transition:transform .3s cubic-bezier(.2,.7,.2,1), opacity .3s;
}
.burger.is-open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.burger.is-open span:nth-child(2){opacity:0}
.burger.is-open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

@media (max-width:900px){
  .nav-links,
  .nav-cta .btn:not(.btn--play){display:none}
  .nav-cta{gap:.6rem}
  .nav-cta .btn--play{
    padding:.55rem .9rem;
    font-size:.6rem;
    letter-spacing:.14em;
  }
  .burger{display:flex}
}

@media (prefers-reduced-motion:reduce){
  .mobile-menu a,
  .mobile-menu.is-open a{animation:none;opacity:1;transform:none}
}

/* ==========================================================================
   THEME SYSTEM — light / dark
   ========================================================================== */

html.theme-ready { transition: background .4s ease, color .4s ease; }

html[data-theme="light"] { background: var(--paper); color: var(--ink); }
html[data-theme="dark"]  { background: var(--ink);   color: var(--paper); }

html[data-theme="dark"] body { background: var(--ink); color: var(--paper); }

/* Sections that flip with theme */
html[data-theme="dark"] .section:not(.section--ink) { background: #0F0F0F; color: var(--paper); }
html[data-theme="dark"] .section--paper-warm { background: #131313; color: var(--paper); }
html[data-theme="dark"] .proof { background: #131313; border-color: rgba(201,168,117,.18); }
html[data-theme="dark"] .proof__num { color: var(--paper); }
html[data-theme="dark"] .proof__num sup { color: var(--gold); }
html[data-theme="dark"] .proof__label { color: rgba(247,246,242,.55); }
html[data-theme="dark"] .section-head__copy { color: rgba(247,246,242,.55); }
html[data-theme="dark"] .h2 { color: var(--paper); }
html[data-theme="dark"] .reading p,
html[data-theme="dark"] .reading li { color: rgba(247,246,242,.75); }
html[data-theme="dark"] .reading h2,
html[data-theme="dark"] .reading h3 { color: var(--paper); }
html[data-theme="dark"] .contact-form { background: #131313; }
html[data-theme="dark"] .field input,
html[data-theme="dark"] .field select,
html[data-theme="dark"] .field textarea { background: #1A1614; color: var(--paper); border-color: rgba(201,168,117,.25); }
html[data-theme="dark"] .field label { color: var(--gold); }
html[data-theme="dark"] .privacy-consent { color: rgba(247,246,242,.7); }
html[data-theme="dark"] .project-row { background: #131313; border-color: rgba(201,168,117,.15); }
html[data-theme="dark"] .project-row h3 { color: var(--paper); }
html[data-theme="dark"] .project-row p { color: rgba(247,246,242,.7); }
html[data-theme="dark"] .project-row__meta { color: rgba(247,246,242,.5); }
html[data-theme="dark"] .project-row__meta strong { color: var(--paper); }
html[data-theme="dark"] .service-detail { background: #131313; border-color: rgba(201,168,117,.15); }
html[data-theme="dark"] .service-detail h2 { color: var(--paper); }
html[data-theme="dark"] .service-detail p { color: rgba(247,246,242,.7); }
html[data-theme="dark"] .empty-state { background: #131313; }
html[data-theme="dark"] .empty-state h2 { color: var(--paper); }
html[data-theme="dark"] .empty-state p { color: rgba(247,246,242,.7); }
html[data-theme="dark"] .credential { background: #131313; border-color: rgba(201,168,117,.15); }
html[data-theme="dark"] .credential strong { color: var(--paper); }
html[data-theme="dark"] .credential span { color: rgba(247,246,242,.6); }
html[data-theme="dark"] .job-row { background: #131313; border-color: rgba(201,168,117,.15); }
html[data-theme="dark"] .job-row h3 { color: var(--paper); }
html[data-theme="dark"] .sitemap-col a { color: rgba(247,246,242,.75); }
html[data-theme="dark"] .filter-btn { color: rgba(247,246,242,.65); border-color: rgba(201,168,117,.25); }
html[data-theme="dark"] .filter-btn:hover { color: var(--orange); border-color: var(--orange); }
html[data-theme="dark"] .filter-btn.is-active { background: var(--orange); border-color: var(--orange); color: #FFFFFF; }

/* Theme toggle button */
.theme-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  padding:0;
  border:1px solid rgba(201,168,117,.4);
  background:transparent;
  color:var(--gold);
  cursor:pointer;
  transition:border-color .3s, color .3s, transform .3s;
}
.theme-toggle:hover{
  border-color:var(--orange);
  color:var(--orange);
  transform:rotate(15deg);
}
.theme-toggle svg{
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* ==========================================================================
   GOLD ENHANCEMENTS — make gold more present without losing the orange
   ========================================================================== */

/* Section eyebrows now gold by default */
.eyebrow{color:var(--gold-dark)}
.hero .eyebrow, .page-hero .eyebrow, .section--ink .eyebrow, .cta .eyebrow,
.foot .eyebrow { color: var(--gold); }

/* Italic accent stays orange but gold underline appears on hover */
.h2 em, .hero h1 em, .page-hero h1 em, .cta h2 em { position: relative; }
.h2 em::after, .hero h1 em::after, .page-hero h1 em::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -.08em; height: 2px;
  background: var(--gold); opacity: 0; transition: opacity .3s;
}
.h2:hover em::after, .hero h1:hover em::after, .page-hero h1:hover em::after { opacity: 1; }

/* Proof band numbers - gold accent on the sup */
.proof__num sup { color: var(--gold-dark); }

/* Project numbered corner now gold on dark */
.project__num { color: var(--gold); }

/* Service numbers gold */
.service__num { color: var(--gold); }

/* Approach row numbers gold */
.approach__row .num { color: var(--gold); }

/* Footer column headings gold (already gold via --gold var) */
.foot h5 { color: var(--gold); }

/* Links hover to gold on dark surfaces */
.section--ink a:hover, .cta a:hover, .foot a:hover { color: var(--gold); }

/* Reading links: gold accent */
.reading a { color: var(--gold-dark); }
.reading a:hover { color: var(--orange); }

/* Divider rules in gold */
.proof { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }

/* Contact form focus becomes gold-tinted */
.field input:focus, .field select:focus, .field textarea:focus {
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(201,168,117,.15);
}

/* ==========================================================================
   MOBILE MENU v3 — watermark, active state, footer
   ========================================================================== */

.mobile-menu{
  position:fixed; inset:0; z-index:400;
  background:var(--ink);
  display:flex; flex-direction:column;
  padding:6rem clamp(1.5rem,6vw,3rem) 2rem;
  opacity:0; visibility:hidden;
  transition:opacity .4s cubic-bezier(.2,.7,.2,1), visibility .4s;
  overflow:hidden;
}
.mobile-menu.is-open{ opacity:1; visibility:visible; }

/* Huge faded watermark showing current section */
.mobile-menu__watermark{
  position:absolute;
  bottom:-4vw; left:-2vw; right:-2vw;
  font-family:var(--font-display);
  font-weight:500;
  font-size:clamp(8rem,28vw,16rem);
  line-height:.82;
  letter-spacing:-.06em;
  color:var(--gold);
  opacity:.06;
  pointer-events:none;
  user-select:none;
  z-index:0;
  white-space:nowrap;
  text-transform:uppercase;
  transition:opacity .4s ease;
}
.mobile-menu.is-open .mobile-menu__watermark{ opacity:.08; }

.mobile-menu__brand{
  position:absolute; top:1.6rem; left:clamp(1.5rem,6vw,3rem);
  font-family:var(--font-display); font-weight:500; font-size:1.2rem;
  color:var(--paper); letter-spacing:.05em; margin:0;
  z-index:2;
}
.mobile-menu__brand small{
  color:var(--gold); font:700 .625rem/1 var(--font-body);
  letter-spacing:.22em; margin-left:.6rem;
}

.mobile-menu__close{
  position:absolute; top:1rem; right:clamp(1rem,4vw,1.6rem);
  width:48px; height:48px;
  border:1px solid rgba(201,168,117,.35);
  background:transparent; color:var(--paper);
  font-size:1.4rem; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  transition:border-color .3s, color .3s, transform .3s;
  z-index:3;
}
.mobile-menu__close:hover{
  border-color:var(--orange); color:var(--orange); transform:rotate(90deg);
}

.mobile-menu__nav{
  position:relative; z-index:2;
  display:flex; flex-direction:column;
  margin-top:auto;
}
.mobile-menu__nav a{
  display:flex; align-items:center; justify-content:space-between;
  font-family:var(--font-display);
  font-weight:500;
  font-size:clamp(1.9rem,7vw,2.6rem);
  line-height:1.05;
  letter-spacing:-.035em;
  color:var(--paper);
  text-decoration:none;
  padding:1.1rem 0;
  border-bottom:1px solid rgba(255,255,255,.08);
  min-height:64px;
  opacity:0; transform:translateY(20px);
  transition:color .3s, padding-left .3s;
}
.mobile-menu.is-open .mobile-menu__nav a{
  animation:menu-link-in .6s cubic-bezier(.2,.7,.2,1) forwards;
}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(1){animation-delay:.08s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(2){animation-delay:.14s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(3){animation-delay:.20s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(4){animation-delay:.26s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(5){animation-delay:.32s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(6){animation-delay:.38s}

@keyframes menu-link-in{ to{opacity:1; transform:none} }

.mobile-menu__nav a::after{
  content:"";
  width:0; height:2px;
  background:var(--gold);
  transition:width .4s cubic-bezier(.2,.7,.2,1);
  flex:none;
}
.mobile-menu__nav a:hover::after{ width:32px; }
.mobile-menu__nav a[aria-current="page"]{
  color:var(--gold);
  padding-left:.6rem;
}
.mobile-menu__nav a[aria-current="page"]::after{
  width:32px;
  background:var(--orange);
}
.mobile-menu__play{
  color:var(--orange) !important;
  font-size:clamp(1.4rem,5vw,1.9rem) !important;
  margin-top:1rem;
  border-bottom:0 !important;
}
.mobile-menu__play::after{
  content:"▶" !important;
  width:auto !important; height:auto !important;
  background:transparent !important;
  color:var(--orange);
  font-size:.9rem;
  opacity:1 !important;
}

.mobile-menu__foot{
  position:relative; z-index:2;
  display:flex; gap:.7rem; flex-wrap:wrap; align-items:center;
  margin-top:2rem;
  font:700 .688rem/1.4 var(--font-body);
  letter-spacing:.18em; text-transform:uppercase;
  color:rgba(247,246,242,.5);
}
.mobile-menu__foot a{
  color:rgba(247,246,242,.7);
  transition:color .3s;
  min-height:44px; display:flex; align-items:center;
}
.mobile-menu__foot a:hover{ color:var(--gold); }

@media (prefers-reduced-motion:reduce){
  .mobile-menu.is-open .mobile-menu__nav a{animation:none; opacity:1; transform:none}
}


/* ==========================================================================
   PREMIUM REBRAND v2 — Navy + Copper + Brass, Fraunces display
   ========================================================================== */

:root{
  --orange: #11162A;
  --orange-dark: #0F0A07;
  --orange-light: #4A3B2A;
  --gold: #D4AF6A;
  --gold-light: #EBD6A0;
  --gold-dark: #B8955A;
  --ink: #0B1020;
  --ink-2: #11162A;
  --ink-3: #2A2018;
  --paper: #F5F1E8;
  --paper-warm: #EBE4D5;
  --white: #FFFFFF;
  --muted: #5A6273;
  --muted-2: #8891A1;
  --rule: rgba(212,184,136,.28);
  --text-on-orange: #FFFFFF;
  --font-display: "Fraunces", "Source Serif 4", Georgia, serif;
}

.hero h1,
.page-hero h1,
.h2,
.film__title{
  font-family: "Fraunces", "Source Serif 4", Georgia, serif;
  font-weight: 500;
  font-variation-settings: "SOFT" 30, "WONK" 1, "opsz" 144;
  letter-spacing: -.045em;
}

.hero h1{ font-size: clamp(2.8rem, 7.6vw, 7rem); line-height: .95; }
.page-hero h1{ font-size: clamp(2.4rem, 6vw, 5rem); }
.h2{ font-size: clamp(2rem, 4.2vw, 3.6rem); letter-spacing: -.04em; }
.film__title{ font-size: clamp(2.6rem, 9vw, 8rem); letter-spacing: -.06em; }

.nav-links a{ font-size: .78rem; letter-spacing: .2em; }
.brand__meta{ font-size: .7rem; }

.eyebrow{ color: var(--gold-dark); font-size: .72rem; letter-spacing: .24em; }
.hero .eyebrow, .page-hero .eyebrow, .section--ink .eyebrow, .cta .eyebrow { color: var(--gold); }

.hero__lede{ font-size: clamp(1.05rem, 1.5vw, 1.3rem); line-height: 1.65; }
.section-head__copy{ font-size: 1rem; line-height: 1.7; }
.lede{ font-size: clamp(1.05rem, 1.4vw, 1.3rem); }

.proof__num sup{ color: var(--gold-dark); }

.btn--orange{ background: var(--orange); color: var(--text-on-orange); }
.btn--orange:hover{ background: var(--orange-dark); color: var(--white); }
.btn--ghost{ border-color: rgba(255,255,255,.35); }
.btn--ghost:hover{ border-color: var(--gold); color: var(--gold); }

html[data-theme="dark"] body{ background: var(--ink); color: var(--paper); }
html[data-theme="dark"] .section:not(.section--ink){ background: var(--ink-2); }
html[data-theme="dark"] .section--paper-warm{ background: var(--ink-2); }



/* ==========================================================================
   GOLD-FORWARD PREMIUM TREATMENT
   ========================================================================== */

/* Gold as metallic gradient on text — real gold feel */
.hero h1 em,
.page-hero h1 em,
.h2 em,
.cta h2 em{
  background: linear-gradient(135deg, #B8955A 0%, #EBD6A0 45%, #D4AF6A 55%, #B8955A 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-style: italic;
  font-weight: 400;
}

/* Eyebrows in gold */
.eyebrow{
  color: #B8955A;
  font-weight: 800;
}

/* Buttons: espresso with gold text and thin gold border */
.btn--orange{
  background: #11162A;
  color: #EBD6A0;
  border: 1px solid #B8955A;
  transition: background .3s ease, border-color .3s ease, color .3s ease;
}
.btn--orange:hover{
  background: #B8955A;
  color: #11162A;
  border-color: #EBD6A0;
}
.btn--orange::before{ display: none; }

/* Ghost buttons: gold on dark */
.btn--ghost{
  border-color: rgba(212,175,106,.45);
  color: #EBD6A0;
}
.btn--ghost:hover{
  border-color: #EBD6A0;
  color: #EBD6A0;
  background: rgba(212,175,106,.08);
}

/* Hero photo treatment — deep espresso veil */
.hero__media::after{
  background:
    linear-gradient(90deg, rgba(11,16,32,.96) 0%, rgba(11,16,32,.78) 38%, rgba(11,16,32,.32) 72%, rgba(11,16,32,.15) 100%),
    linear-gradient(0deg, rgba(11,16,32,.92), transparent 45%);
}

/* Proof numbers in gold */
.proof__num{ color: #11162A; }
.proof__num sup{ color: #B8955A; }

/* Section markers */
.project__num, .service__num, .approach__row .num{ color: #D4AF6A; }

/* Nav: gold underline on hover */
.nav-links a:hover, .nav-links a[aria-current="page"]{ color: #EBD6A0; }

/* Links on light paper */
.text-link, .service__link, .reading a{ color: #8B6F38; }
.text-link:hover, .service__link:hover, .reading a:hover{ color: #B8955A; }

/* Project type labels in gold */
.project__type, .project-row__type{ color: #D4AF6A; }

/* Reading headings */
.reading h2, .reading h3, .service-detail h2{ color: #11162A; }

/* Film mode — gold progress bar */
.film__progress span{ background: #D4AF6A; }
.film__kicker{ color: #D4AF6A; }
.film__counter b{ color: #D4AF6A; }
.film__title em{
  background: linear-gradient(135deg, #B8955A 0%, #EBD6A0 50%, #B8955A 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* Softer body sizes — less shouty, more editorial */
.hero h1{ font-size: clamp(2.6rem, 7vw, 6.2rem); letter-spacing: -.05em; line-height: .96; }
.page-hero h1{ font-size: clamp(2.2rem, 5.5vw, 4.4rem); }
.h2{ font-size: clamp(1.9rem, 4vw, 3.4rem); }
.hero__lede{ font-size: clamp(1rem, 1.35vw, 1.2rem); }

/* Dark theme */
html[data-theme="dark"] body{ background: #0B1020; color: #F5F1E8; }
html[data-theme="dark"] .section:not(.section--ink){ background: #11162A; color: #F5F1E8; }
html[data-theme="dark"] .section--paper-warm{ background: #11162A; }
html[data-theme="dark"] .reading h2,
html[data-theme="dark"] .reading h3{ color: #EBD6A0; }
html[data-theme="dark"] .reading p{ color: rgba(245,241,232,.75); }
html[data-theme="dark"] .proof__num{ color: #EBD6A0; }

/* ==========================================================================
   REFINEMENT PASS — photo, buttons, nav, headline
   ========================================================================== */

/* 1. Hero photo — push toward monochrome so gold pops */
.hero__media img{
  filter: saturate(.25) contrast(1.1) brightness(.75) !important;
}
.hero__media::after{
  background:
    linear-gradient(90deg, rgba(11,16,32,.97) 0%, rgba(11,16,32,.85) 42%, rgba(11,16,32,.5) 78%, rgba(11,16,32,.3) 100%),
    linear-gradient(0deg, rgba(11,16,32,.95), transparent 50%) !important;
}

/* 2. Primary button — solid gold, dark text. Real CTA energy */
.btn--orange{
  background: linear-gradient(135deg, #D4AF6A 0%, #EBD6A0 50%, #D4AF6A 100%) !important;
  color: #11162A !important;
  border: 1px solid #EBD6A0 !important;
  font-weight: 800 !important;
  box-shadow: 0 8px 24px rgba(212,175,106,.25) !important;
}
.btn--orange:hover{
  background: linear-gradient(135deg, #EBD6A0 0%, #F5E5B8 50%, #EBD6A0 100%) !important;
  color: #11162A !important;
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(212,175,106,.4) !important;
}

/* Ghost button — thicker gold border, brighter text */
.btn--ghost{
  border: 1px solid rgba(212,175,106,.65) !important;
  color: #EBD6A0 !important;
  font-weight: 700 !important;
}
.btn--ghost:hover{
  background: rgba(212,175,106,.12) !important;
  border-color: #EBD6A0 !important;
}

/* 3. Nav — kill the cream strip, sit flush on hero */
.nav{
  background: transparent !important;
  border-bottom: 1px solid rgba(212,175,106,.18) !important;
}
.nav.is-scrolled{
  background: rgba(11,16,32,.92) !important;
  backdrop-filter: blur(16px) !important;
}
body{ background: #0B1020; }
main{ background: #0B1020; }

/* 4. Hero headline — tighter, more deliberate */
.hero h1{
  font-size: clamp(2.4rem, 6.4vw, 5.6rem) !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
  max-width: 15ch !important;
}
.hero h1 em{
  display: inline !important;
}

/* WhatsApp button — match the palette */
a[href*="wa.me"]{
  background: #11162A !important;
  color: #EBD6A0 !important;
  border: 1px solid #B8955A !important;
}
a[href*="wa.me"]:hover{
  background: #B8955A !important;
  color: #11162A !important;
}

/* ==========================================================================
   FIX: light content pages, dark hero only, bright readable layout
   ========================================================================== */

body{
  background: #F5F1E8 !important;
  color: #11162A !important;
}
main{ background: #F5F1E8 !important; }

.section:not(.section--ink):not(.cta){
  background: #F5F1E8 !important;
  color: #11162A !important;
}
.section--paper-warm{
  background: #EBE4D5 !important;
  color: #11162A !important;
}
.section--ink, .cta, .hero, .page-hero{
  background: #0B1020 !important;
  color: #F5F1E8 !important;
}

.reading h2, .reading h3{ color: #11162A !important; }
.reading p, .reading li{ color: #3D322A !important; }
.reading strong{ color: #11162A !important; }
.reading a{ color: #8B6F38 !important; }

.h2, .section-head__title h2, .section-head__title .h2{ color: #11162A !important; }
.section-head__copy, .section-head p{ color: #5A4F42 !important; }

.proof{ background: #EBE4D5 !important; color: #11162A !important; }
.proof__num{ color: #11162A !important; }
.proof__num sup{ color: #B8955A !important; }
.proof__label{ color: #5A4F42 !important; }

.project-row, .service-detail, .credential, .job-row, .empty-state{
  background: #FFFFFF !important;
  color: #11162A !important;
  border-color: rgba(17,22,42,.12) !important;
}
.project-row h3, .service-detail h2, .credential strong, .job-row h3, .empty-state h2{ color: #11162A !important; }
.project-row p, .service-detail p, .credential span, .job-row__meta, .empty-state p{ color: #4A3F32 !important; }

.contact-form{ background: #EBE4D5 !important; color: #11162A !important; }
.contact-info{ background: #0B1020 !important; color: #F5F1E8 !important; }
.field label{ color: #3D322A !important; }
.field input, .field select, .field textarea{
  background: #FFFFFF !important;
  color: #11162A !important;
  border-color: rgba(17,22,42,.2) !important;
}
.privacy-consent{ color: #3D322A !important; }

.foot{ background: #0B1020 !important; color: #F5F1E8 !important; }

/* Dark theme overrides */
html[data-theme="dark"] body{ background: #0B1020 !important; color: #F5F1E8 !important; }
html[data-theme="dark"] main{ background: #0B1020 !important; }
html[data-theme="dark"] .section:not(.section--ink):not(.cta){ background: #11162A !important; color: #F5F1E8 !important; }
html[data-theme="dark"] .section--paper-warm{ background: #11162A !important; }
html[data-theme="dark"] .proof{ background: #11162A !important; }
html[data-theme="dark"] .proof__num{ color: #EBD6A0 !important; }
html[data-theme="dark"] .proof__label{ color: rgba(245,241,232,.6) !important; }
html[data-theme="dark"] .h2,
html[data-theme="dark"] .reading h2,
html[data-theme="dark"] .reading h3,
html[data-theme="dark"] .section-head__title h2{ color: #EBD6A0 !important; }
html[data-theme="dark"] .reading p,
html[data-theme="dark"] .reading li,
html[data-theme="dark"] .section-head__copy{ color: rgba(245,241,232,.8) !important; }
html[data-theme="dark"] .project-row,
html[data-theme="dark"] .service-detail,
html[data-theme="dark"] .credential,
html[data-theme="dark"] .job-row,
html[data-theme="dark"] .empty-state{ background: #11162A !important; border-color: rgba(212,175,106,.18) !important; }
html[data-theme="dark"] .project-row h3,
html[data-theme="dark"] .service-detail h2,
html[data-theme="dark"] .credential strong,
html[data-theme="dark"] .job-row h3,
html[data-theme="dark"] .empty-state h2{ color: #EBD6A0 !important; }
html[data-theme="dark"] .project-row p,
html[data-theme="dark"] .service-detail p,
html[data-theme="dark"] .credential span,
html[data-theme="dark"] .job-row__meta,
html[data-theme="dark"] .empty-state p{ color: rgba(245,241,232,.75) !important; }
html[data-theme="dark"] .contact-form{ background: #11162A !important; color: #F5F1E8 !important; }
html[data-theme="dark"] .field input,
html[data-theme="dark"] .field select,
html[data-theme="dark"] .field textarea{ background: #0B1020 !important; color: #EBD6A0 !important; border-color: rgba(212,175,106,.25) !important; }
html[data-theme="dark"] .field label{ color: #EBD6A0 !important; }

/* ==========================================================================
   JEWELRY ACCENT — oxblood, used only on tiny details
   ========================================================================== */

:root{ --oxblood: #6B1E28; --oxblood-light: #8A2A36; }

/* Gold italic accent gets a fine oxblood hairline on hover */
.hero h1 em, .page-hero h1 em, .h2 em, .cta h2 em, .film__title em{
  position: relative;
  background: linear-gradient(135deg, #B8955A 0%, #EBD6A0 45%, #D4AF6A 55%, #B8955A 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero h1 em::after, .page-hero h1 em::after, .h2 em::after{
  content:""; position:absolute; left:0; right:0; bottom:-.06em;
  height:1px; background:#6B1E28; opacity:0; transition:opacity .35s;
}
.hero h1:hover em::after, .page-hero h1:hover em::after, .h2:hover em::after{ opacity:1; }

/* Film mode progress bar — oxblood */
.film__progress span{ background: linear-gradient(90deg, #6B1E28, #B8955A) !important; }

/* Film "Exit" hover — oxblood fill */
.film__exit:hover{
  background: #6B1E28 !important;
  border-color: #8A2A36 !important;
  color: #EBD6A0 !important;
}

/* Portfolio filter active state — oxblood */
.filter-btn.is-active{
  background: #6B1E28 !important;
  border-color: #8A2A36 !important;
  color: #EBD6A0 !important;
}

/* Form focus ring — oxblood shadow instead of orange */
.field input:focus, .field select:focus, .field textarea:focus{
  outline: none !important;
  border-color: #B8955A !important;
  box-shadow: 0 0 0 3px rgba(107,30,40,.18) !important;
}

/* Active nav underline — oxblood */
.nav-links a[aria-current="page"]::after{
  background: #6B1E28 !important;
}

/* Mobile menu active link — oxblood underline stays, text gold */
.mobile-menu__nav a[aria-current="page"]::after{
  background: #6B1E28 !important;
}

/* Small luxury detail — link underline in reading pages */
.reading a{ text-decoration-color: rgba(107,30,40,.4); }
.reading a:hover{ color: #6B1E28 !important; text-decoration-color: #6B1E28; }

/* WhatsApp button — one tiny oxblood pulse on hover */
a[href*="wa.me"]:hover{
  box-shadow: 0 0 0 4px rgba(107,30,40,.15) !important;
}

/* ==========================================================================
   FIX: nav "Play showcase" button visibility
   ========================================================================== */

.nav-cta .btn--play{
  color: #EBD6A0 !important;
  border: 1px solid rgba(212,175,106,.55) !important;
  background: rgba(212,175,106,.06) !important;
  font-weight: 700 !important;
  letter-spacing: .2em !important;
  transition: all .3s ease !important;
}
.nav-cta .btn--play:hover{
  background: rgba(212,175,106,.15) !important;
  border-color: #EBD6A0 !important;
  color: #FFFFFF !important;
}
.nav-cta .btn--play span{
  color: #D4AF6A !important;
  font-size: .7em !important;
  margin-left: .3em !important;
}

/* On scroll (dark bar) — same treatment */
.nav.is-scrolled .btn--play{
  color: #EBD6A0 !important;
  border-color: rgba(212,175,106,.55) !important;
}

/* Hero play button — make gold text match */
.hero__actions .btn--ghost{
  color: #EBD6A0 !important;
  border-color: rgba(212,175,106,.6) !important;
}
.hero__actions .btn--ghost:hover{
  background: rgba(212,175,106,.12) !important;
  border-color: #EBD6A0 !important;
}

/* Ensure the arrow ">" inside the nav play button is gold */
.nav-cta .btn--play svg,
.nav-cta .btn--play .arrow{
  color: #D4AF6A !important;
}

/* ==========================================================================
   FILM MODE v2 — 3D perspective transitions, brighter slides, parallax
   ========================================================================== */

/* Lighter overlay so photos breathe */
.film__overlay{
  background:
    linear-gradient(90deg, rgba(11,16,32,.85) 0%, rgba(11,16,32,.35) 45%, rgba(11,16,32,.05) 100%),
    linear-gradient(0deg, rgba(11,16,32,.55), transparent 60%) !important;
}
.film__slide--right .film__overlay{
  background:
    linear-gradient(270deg, rgba(11,16,32,.85) 0%, rgba(11,16,32,.35) 45%, rgba(11,16,32,.05) 100%),
    linear-gradient(0deg, rgba(11,16,32,.55), transparent 60%) !important;
}

/* Photo brightness up, richer colour */
.film__media{
  filter: saturate(1.05) contrast(1.05) brightness(.95) !important;
  transform: scale(1.15) rotateY(12deg) !important;
  transition: transform 1.4s cubic-bezier(.2,.7,.2,1), opacity 1.2s ease !important;
}
.film__slide.is-active .film__media{
  transform: scale(1.02) rotateY(0) !important;
}
.film__slide--right.is-active .film__media{
  transform: scale(1.02) rotateY(0) !important;
}
.film__slide--right .film__media{
  transform: scale(1.15) rotateY(-12deg) !important;
}

/* Content slides in from side with parallax */
.film__content{
  transform: translateX(-40px);
  opacity: 0;
  transition: transform 1s cubic-bezier(.2,.7,.2,1) .3s, opacity .8s ease .3s;
}
.film__slide.is-active .film__content{
  transform: translateX(0);
  opacity: 1;
}
.film__slide--right .film__content{
  transform: translateX(40px);
}
.film__slide--right.is-active .film__content{
  transform: translateX(0);
}

/* Gold grid overlay on every slide — engineering blueprint feel */
.film__slide::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  opacity: .06;
  background-image:
    linear-gradient(rgba(212,175,106,.4) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,106,.4) 1px, transparent 1px);
  background-size: 90px 90px;
  mask-image: linear-gradient(90deg, transparent, black 40%);
  -webkit-mask-image: linear-gradient(90deg, transparent, black 40%);
}
.film__slide--right::before{
  mask-image: linear-gradient(270deg, transparent, black 40%);
  -webkit-mask-image: linear-gradient(270deg, transparent, black 40%);
}

/* Bigger, more editorial counter */
.film__counter{
  font-family: var(--font-display) !important;
  font-size: 1.2rem !important;
  letter-spacing: .1em !important;
  color: #EBD6A0 !important;
}
.film__counter b{
  font-size: 1.8rem !important;
  color: #D4AF6A !important;
  margin-right: .3rem !important;
}

/* Location marker bottom-left — gold microtype */
.film__location{
  color: #D4AF6A !important;
  font-weight: 700 !important;
  letter-spacing: .28em !important;
}

/* Headlines brighter, more presence */
.film__title{
  text-shadow: 0 4px 40px rgba(0,0,0,.5) !important;
  color: #FFFCF5 !important;
}
.film__title em{
  background: linear-gradient(135deg, #B8955A 0%, #F2E0B0 45%, #D4AF6A 55%, #B8955A 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.film__kicker{
  color: #D4AF6A !important;
  font-weight: 800 !important;
  letter-spacing: .32em !important;
}

.film__lede{
  color: rgba(255,252,245,.85) !important;
  text-shadow: 0 2px 20px rgba(0,0,0,.4) !important;
}

/* Exit button more visible */
.film__exit{
  color: #EBD6A0 !important;
  border-color: rgba(212,175,106,.6) !important;
  background: rgba(11,16,32,.6) !important;
  font-weight: 700 !important;
}
.film__exit:hover{
  background: #6B1E28 !important;
  border-color: #8A2A36 !important;
  color: #EBD6A0 !important;
}

/* Film brand top-left brighter */
.film__brand{
  color: #EBD6A0 !important;
  font-weight: 500 !important;
}
.film__brand small{
  color: #D4AF6A !important;
}

/* ==========================================================================
   FILM MODE v3 — FAST + opening slide has subtle imagery
   ========================================================================== */

/* Remove expensive 3D — replace with fast, elegant slide-in */
.film__media{
  filter: saturate(1.05) contrast(1.04) brightness(.92) !important;
  transform: scale(1.08) !important;
  transition: transform 8s linear !important;
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.film__slide.is-active .film__media{
  transform: scale(1) !important;
}
.film__slide--right .film__media{
  transform: scale(1.08) !important;
}
.film__slide--right.is-active .film__media{
  transform: scale(1) !important;
}

/* Softer overlay — photos now visible */
.film__overlay{
  background:
    linear-gradient(90deg, rgba(11,16,32,.78) 0%, rgba(11,16,32,.28) 45%, rgba(11,16,32,.02) 100%),
    linear-gradient(0deg, rgba(11,16,32,.4), transparent 65%) !important;
}
.film__slide--right .film__overlay{
  background:
    linear-gradient(270deg, rgba(11,16,32,.78) 0%, rgba(11,16,32,.28) 45%, rgba(11,16,32,.02) 100%),
    linear-gradient(0deg, rgba(11,16,32,.4), transparent 65%) !important;
}

/* Content fade-in — simple, fast */
.film__content{
  transform: translateY(20px);
  opacity: 0;
  transition: transform .9s cubic-bezier(.2,.7,.2,1) .15s, opacity .7s ease .15s !important;
}
.film__slide.is-active .film__content{
  transform: translateY(0);
  opacity: 1;
}
.film__slide--right .film__content{
  transform: translateY(20px);
}
.film__slide--right.is-active .film__content{
  transform: translateY(0);
}

/* Opening slide — give it a subtle dark image so it is not pure black */
.film__slide--text{
  background:
    linear-gradient(rgba(11,16,32,.88), rgba(11,16,32,.94)),
    radial-gradient(ellipse at 50% 40%, rgba(212,175,106,.08), transparent 70%),
    url('/static/images/ethiopia/addis-convention.jpg') center/cover !important;
}
.film__slide--text .film__media{ display: none; }
.film__slide--text .film__overlay{
  background:
    linear-gradient(rgba(212,175,106,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,106,.045) 1px, transparent 1px) !important;
  background-size: 90px 90px !important;
}

/* Kill the grid overlay bug (was hiding content) */
.film__slide::before{ display: none !important; }
.film__slide--text::before{ display: none !important; }

/* Smoother transitions between slides */
.film__slide{
  transition: opacity 1s ease, visibility 1s !important;
}



/* FINAL FIX: opening slide — visible Addis panorama with dark veil for text */
.film__slide--text{
  background-image: url('/static/images/ethiopia/addis-panorama.jpg') !important;
  background-size: cover !important;
  background-position: center 40% !important;
  background-repeat: no-repeat !important;
}
.film__slide--text .film__media{ display: none !important; }
.film__slide--text .film__overlay{
  background:
    radial-gradient(ellipse at 50% 50%, rgba(11,16,32,.78) 0%, rgba(11,16,32,.55) 45%, rgba(11,16,32,.85) 100%) !important;
  opacity: 1 !important;
}
.film__slide--text::before{
  display: none !important;
}

/* ==========================================================================
   SADAR-STEAL — three refinements worth taking
   ========================================================================== */

/* A) Mixed headline: sans uppercase main + Fraunces italic accent */
.hero h1, .page-hero h1{
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: -.04em !important;
}
.hero h1 em, .page-hero h1 em{
  font-family: "Fraunces", "Source Serif 4", Georgia, serif !important;
  font-style: italic !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: -.055em !important;
}

/* B) Grid lines over the hero */
.hero::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .09;
  background-image:
    linear-gradient(rgba(212,175,106,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,106,.5) 1px, transparent 1px);
  background-size: 90px 90px;
  mask-image: linear-gradient(90deg, transparent 0%, black 35%, black 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 35%, black 100%);
}
.hero__content, .hero__meta{ position: relative; z-index: 2; }

/* C) Fine-print row in footer */
.foot__fineprint{
  grid-column: 1 / -1;
  padding-top: 1.6rem;
  margin-top: 1.2rem;
  border-top: 1px solid rgba(212,175,106,.15);
  font-size: .65rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(247,246,242,.35);
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1.5rem;
  justify-content: space-between;
}


/* ==========================================================================
   EDITORIAL INTRO + COVERAGE MAP — SADAR-quality components
   ========================================================================== */

.intro-editorial{
  background: var(--paper);
  padding-block: clamp(5rem, 9vw, 9rem);
  border-bottom: 1px solid rgba(212,175,106,.15);
}
.intro-editorial .wrap{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 6vw, 6rem);
  align-items: start;
}
@media (max-width:800px){ .intro-editorial .wrap{ grid-template-columns:1fr } }
.section-index{
  font-size: .688rem;
  letter-spacing: .24em;
  color: var(--gold-dark);
  font-weight: 800;
  text-transform: uppercase;
  align-self: start;
}
.section-index i{ color: var(--orange); font-style: normal; padding: 0 .4rem; }
.intro-display{
  font-family: "Fraunces", "Source Serif 4", Georgia, serif;
  font-weight: 500;
  font-size: clamp(2.4rem, 5.5vw, 4.6rem);
  line-height: 1.02;
  letter-spacing: -.04em;
  margin: 0 0 1.6rem;
  color: var(--ink);
}
.intro-display em{
  font-style: italic;
  font-weight: 400;
  color: var(--orange);
}
.intro-body{
  font-family: var(--font-display);
  font-size: 1rem;
  line-height: 1.75;
  color: var(--ink-3);
  max-width: 34rem;
  margin: 0 0 1.8rem;
}

.coverage{
  background: var(--ink);
  color: var(--paper);
  padding-block: clamp(5rem, 9vw, 9rem);
}
.coverage-grid{
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: clamp(2rem, 6vw, 6rem);
  align-items: center;
}
@media (max-width:900px){ .coverage-grid{ grid-template-columns:1fr } }
.coverage-copy .eyebrow{ display:block; margin-bottom:1.2rem; color: var(--gold); }
.coverage-copy .h2{ color: var(--paper); margin-bottom:1rem; }
.coverage-copy .h2 em{ color: var(--gold); }
.coverage-copy .lede{ color: rgba(243,238,230,.65); }
.coverage-list{
  list-style:none;
  margin:2.4rem 0 0;
  padding:0;
  border-top:1px solid rgba(212,175,106,.25);
}
.coverage-list li{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:1.1rem 0;
  border-bottom:1px solid rgba(212,175,106,.15);
  transition:padding-left .3s ease;
}
.coverage-list li:hover{ padding-left:.5rem; }
.cov-region{
  font-family: "Fraunces", "Source Serif 4", Georgia, serif;
  font-size:1.15rem;
  color: var(--paper);
  letter-spacing:-.02em;
}
.cov-count{
  font-size:.688rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color: rgba(243,238,230,.55);
  font-weight:700;
  transition:color .3s;
}
.coverage-list li:hover .cov-count{ color: var(--gold); }

.coverage-map{
  position:relative;
  aspect-ratio: 7 / 5;
  background: radial-gradient(ellipse at 50% 50%, rgba(17,22,42,.9) 0%, rgba(11,16,32,1) 70%);
  border: 1px solid rgba(212,175,106,.15);
  overflow: hidden;
}
.coverage-map svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.cov-pin{
  position:absolute;
  width:12px; height:12px;
  border-radius:50%;
  background: var(--gold);
  box-shadow: 0 0 0 8px rgba(212,175,106,.1), 0 0 24px rgba(212,175,106,.4);
  transform: translate(-50%, -50%);
}
.cov-pin::after{
  content: attr(data-label);
  position:absolute;
  left:20px; top:-4px;
  white-space:nowrap;
  font:700 .625rem/1 var(--font-body);
  letter-spacing:.2em;
  text-transform:uppercase;
  color: rgba(243,238,230,.75);
}
.cov-coords{
  position:absolute;
  bottom:1.4rem; left:1.6rem;
  font:700 .625rem/1 var(--font-body);
  letter-spacing:.2em;
  text-transform:uppercase;
  color: rgba(243,238,230,.4);
}

/* Dark theme */
html[data-theme="dark"] .intro-editorial{ background: #11162A; border-bottom-color: rgba(212,175,106,.12); }
html[data-theme="dark"] .intro-display{ color: #F3EEE6; }
html[data-theme="dark"] .intro-body{ color: rgba(243,238,230,.7); }

/* ==========================================================================
   PREMIUM PORTFOLIO CARDS
   ========================================================================== */

.project-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .project-list { grid-template-columns: 1fr; }
}

.project {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  aspect-ratio: 16/9;
  background: var(--ink);
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(212,175,106,.15);
  transition: transform var(--d-base) var(--ease), border-color var(--d-base);
}
.project:hover {
  transform: translateY(-4px);
  border-color: var(--gold);
}

.project img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.85) contrast(1.04) brightness(.9);
  transition: transform 800ms var(--ease);
  z-index: -2;
}
.project:hover img {
  transform: scale(1.04);
}

/* The premium background for missing photos */
.project__fallback {
  position: absolute;
  inset: 0;
  z-index: -2;
  background: 
    linear-gradient(rgba(212,175,106,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,106,.08) 1px, transparent 1px),
    radial-gradient(ellipse at 50% 50%, var(--ink-2) 0%, var(--ink) 100%);
  background-size: 40px 40px, 40px 40px, 100% 100%;
}

/* Dark gradient over everything */
.project::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(0deg, rgba(11,16,32,.95) 0%, rgba(11,16,32,.4) 50%, transparent 100%);
  pointer-events: none;
}

.project__num {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.1rem;
  color: var(--gold);
  z-index: 1;
}

.project__body {
  position: relative;
  z-index: 1;
  padding: 2rem;
}

.project__type {
  display: block;
  font: 800 .625rem/1 var(--font-body);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--orange);
  margin-bottom: .8rem;
}

.project__title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  line-height: 1.1;
  letter-spacing: -.02em;
  color: var(--paper);
  margin: 0 0 1.2rem;
}

.project__meta {
  display: flex;
  gap: 2rem;
  font: 700 .688rem/1 var(--font-body);
  letter-spacing: .15em;
  text-transform: uppercase;
  color: rgba(245,241,232,.6);
  border-top: 1px solid rgba(212,175,106,.2);
  padding-top: 1rem;
}

/* ==========================================================================
   PREMIUM CAREERS / JOB LIST
   ========================================================================== */

.job-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.job-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
  padding: 2rem;
  background: var(--paper);
  border: 1px solid rgba(17,22,42,.1);
  text-decoration: none;
  transition: border-color var(--d-base), transform var(--d-base), box-shadow var(--d-base);
  position: relative;
  overflow: hidden;
}
.job-row::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--orange);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform var(--d-base);
}
.job-row:hover {
  border-color: rgba(212,175,106,.6);
  transform: translateY(-2px);
  box-shadow: 0 10px 40px rgba(11,16,32,.05);
}
.job-row:hover::before {
  transform: scaleY(1);
  transform-origin: top;
}

.job-row h3 {
  font-family: "Fraunces", serif;
  font-weight: 500;
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -.02em;
  color: var(--ink);
  margin: 0 0 .6rem;
}

.job-row__meta {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1.5rem;
  font: 700 .688rem/1.4 var(--font-body);
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted);
}

.job-row__cta {
  font: 700 .75rem/1 var(--font-body);
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--orange);
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}
.job-row__cta span {
  transition: transform var(--d-base);
}
.job-row:hover .job-row__cta span {
  transform: translateX(4px);
}

@media (max-width: 700px) {
  .job-row { flex-direction: column; align-items: flex-start; gap: 1.5rem; padding: 1.5rem; }
}

/* Dark theme overrides for jobs */
html[data-theme="dark"] .job-row { background: var(--ink-2); border-color: rgba(212,175,106,.15); }
html[data-theme="dark"] .job-row h3 { color: var(--paper); }
html[data-theme="dark"] .job-row__meta { color: rgba(245,241,232,.5); }

/* ==========================================================================
   SCROLL REVEAL ANIMATIONS
   ========================================================================== */

[data-reveal] {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 800ms cubic-bezier(.22, 1, .36, 1), transform 800ms cubic-bezier(.22, 1, .36, 1);
  will-change: opacity, transform;
}

[data-reveal="left"] {
  transform: translateX(-35px);
}

[data-reveal="right"] {
  transform: translateX(35px);
}

[data-reveal="scale"] {
  transform: scale(.97);
}

[data-reveal].is-visible {
  opacity: 1;
  transform: none;
}

/* Respect user accessibility settings */
@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Update map container to handle the real SVG */
.coverage-map {
  position: relative;
  aspect-ratio: 1; /* Make it square for the map */
  background: transparent; /* Remove the old radial gradient */
  border: none; /* Remove the old border */
  overflow: hidden;
}
.coverage-map svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 2rem; /* Padding so it doesn't touch the edges */
}
