/* ============================================================
 * raww.css — RAWW FILMS · shared stylesheet
 * Fix ③: eliminates all <style> blocks from HTML + _s injection
 * All pages share this file via <link rel="stylesheet" href="raww.css">
 * ============================================================ */

/* ── 1. TOKENS ────────────────────────────────────────────── */
:root{
  --void:#0D0B09;
  --shadow:#1C1814;
  --gold:#d6b373;
  --sienna:#8B7355;
  --ash:#6B6560;
  --ivory:#F2EDE4;
  --ivory-dim:rgba(242,237,228,.62);
  --ivory-faint:rgba(242,237,228,.32);
  --hair:rgba(242,237,228,.12);
  --hair-strong:rgba(242,237,228,.22);
  --font-sans:"Helvetica Neue","Helvetica","Arial",sans-serif;
  --font-mono:"Courier New","Courier",monospace;
  --max:1440px;
  --pad:clamp(20px,4vw,56px);
}

/* ── 2. RESET ─────────────────────────────────────────────── */
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--void);color:var(--ivory);font-family:var(--font-sans);font-weight:300;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
body{overflow-x:hidden;cursor:none}
@media(max-width:900px){body{cursor:auto}}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
::selection{background:var(--gold);color:var(--void)}

/* ── 3. GRAIN OVERLAY ─────────────────────────────────────── */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:200;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.4' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.5'/></svg>");
  opacity:.07;mix-blend-mode:overlay;
}

/* ── 4. CUSTOM CURSOR ─────────────────────────────────────── */
.cursor,.cursor-dot{position:fixed;left:0;top:0;pointer-events:none;z-index:600;mix-blend-mode:difference;will-change:transform;display:none;transition:opacity .2s ease}
@media(min-width:901px){.cursor,.cursor-dot{display:block}}
.cursor{width:34px;height:34px;border:1px solid var(--ivory);border-radius:50%;transform:translate(-50%,-50%);transition:width .25s ease, height .25s ease, background .25s ease, border-color .25s ease, opacity .2s ease}
.cursor.is-hover{width:62px;height:62px;background:var(--ivory)}
.cursor-dot{width:4px;height:4px;background:var(--ivory);border-radius:50%;transform:translate(-50%,-50%)}
/* Lightbox mode (index home) */
body.lb-active .cursor,body.lb-active .cursor-dot{mix-blend-mode:normal;transition:width .25s ease,height .25s ease,background .25s ease,border-color .25s ease,opacity .15s ease}
body.lb-active .cursor{border-color:rgba(242,237,228,.9)}
body.lb-active .cursor.is-hover{background:rgba(242,237,228,.15);border-color:var(--ivory)}
body.lb-active .cursor-dot{background:rgba(242,237,228,.9)}
body.lb-active.over-frame .cursor,body.lb-active.over-frame .cursor-dot{opacity:0;pointer-events:none}
/* Work page cursor-hidden state */
body.cursor-hidden .cursor,body.cursor-hidden .cursor-dot{opacity:0;pointer-events:none}
body.cursor-hidden{cursor:auto}

/* ── 5. NAV (solid — default for all inner pages) ─────────── */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;padding:14px var(--pad);display:flex;align-items:center;justify-content:space-between;background:rgba(13,11,9,.78);backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid var(--hair)}
.brand{display:flex;align-items:center;gap:14px;color:var(--ivory);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;letter-spacing:.22em;font-size:13px}
.brand .glyph{width:22px;height:22px;border:1px solid var(--ivory);display:grid;place-items:center;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;font-size:11px;letter-spacing:0}
.brand .mono{font-family:var(--font-mono);font-weight:400;letter-spacing:.08em;color:var(--ivory-faint);font-size:11px;display:none}
@media(min-width:1100px){.brand .mono{display:inline}}
.nav-links{display:none;gap:34px;align-items:center;font-size:12px;letter-spacing:.24em;text-transform:uppercase}
@media(min-width:760px){.nav-links{display:flex}}
.nav-links a{position:relative;color:var(--ivory-dim);transition:color .25s}
.nav-links a:hover,.nav-links a.is-active{color:var(--ivory)}
.nav-links a::after{content:"";position:absolute;left:0;right:auto;bottom:-6px;height:1px;width:0;background:var(--gold);transition:width .35s ease}
.nav-links a:hover::after,.nav-links a.is-active::after{width:100%}
.nav-cta{display:none;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);border:1px solid var(--hair-strong);padding:10px 16px;transition:background .3s, color .3s, border-color .3s}
@media(min-width:1000px){.nav-cta{display:inline-block}}
.nav-cta:hover{background:var(--gold);color:var(--void);border-color:var(--gold)}

/* ── 6. HOME NAV OVERRIDE (transparent → solid on scroll) ─── */
.page-home .nav{background:transparent;border-bottom:1px solid transparent;padding-top:22px;padding-bottom:22px}
.page-home .nav.is-scrolled{background:rgba(13,11,9,.78);backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);border-bottom-color:var(--hair);padding-top:14px;padding-bottom:14px}

/* ── 7. NAV-LINKS CENTERED (all pages) ───────────────────── */
@media(min-width:760px){.nav-links{position:absolute;left:50%;transform:translateX(-50%)}}

/* ── 8. HAMBURGER + MOBILE MENU ──────────────────────────── */
.hamburger{display:flex;flex-direction:column;gap:5px;width:28px;height:22px;justify-content:center;align-items:flex-end;cursor:pointer;background:none;border:0;padding:0}
@media(min-width:760px){.hamburger{display:none}}
.hamburger span{display:block;width:22px;height:1px;background:var(--ivory);transition:transform .35s ease, width .35s ease, opacity .35s ease}
.hamburger span:nth-child(2){width:14px}
.hamburger.is-open span:nth-child(1){transform:translateY(6px) rotate(45deg);width:22px}
.hamburger.is-open span:nth-child(2){opacity:0}
.hamburger.is-open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);width:22px}
.mobile-menu{position:fixed;inset:0;background:var(--void);z-index:40;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:32px;opacity:0;pointer-events:none;transition:opacity .45s ease}
.mobile-menu.is-open{opacity:1;pointer-events:auto}
.mobile-menu a{font-family:var(--font-sans);font-weight:300;font-size:42px;letter-spacing:-.01em}
.mobile-menu .mono{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;color:var(--ivory-faint);margin-top:24px}

/* ── 9. CURTAIN ───────────────────────────────────────────── */
.curtain{position:fixed;inset:0;background:var(--void);z-index:400;transform:translateY(0);transition:transform .9s cubic-bezier(.77,0,.18,1);pointer-events:none}
.curtain.is-up{transform:translateY(-100%)}

/* ── 10. JS _s INJECTION MOVED HERE ──────────────────────── */
/* cursor:none only on desktop — mobile keeps native cursor */
@media(min-width:901px){a,button,label,select,[role="button"]{cursor:none!important}}
@media(max-width:900px){
  .sector,.work-card,.work-thumb,.btn-line,.idx-lb,.idx-lb-close,
  .card,.filter-btn,.cat-pill,.submit-btn{cursor:auto!important}
  .mobile-menu a{cursor:pointer!important}
  .field input,.field textarea,.field select{cursor:text!important}
}
button{outline:none;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none}
/* brand suffix only at wide breakpoint to avoid nav overlap */
@media(max-width:1099px){.brand .mono{display:none!important}}
/* videos never overflow their container */
video{max-width:100%;display:block}
/* work-grid mobile — prevent implicit columns outside viewport */
@media(max-width:779px){
  .work-grid{overflow-x:clip}
  .work-card.col-7,.work-card.col-5,.work-card.col-12{grid-column:1!important}
  .work-card{min-width:0;max-width:100%}
  .work-thumb{min-width:0;max-width:100%}
  .work-card.col-12 .work-thumb{aspect-ratio:16/9}
}
/* hero mobile: pillars hidden, scroll indicator to the right */
@media(max-width:640px){
  .hero-pillars{display:none!important}
  .scroll-ind{margin-left:auto!important}
}
/* contact mobile order */
@media(max-width:999px){
  .intro-head{order:1!important}
  .form-card{order:2!important}
  .book-row{order:3!important}
  .intro-contacts{order:4!important}
}
/* contact desktop grid */
@media(min-width:1000px){
  .page:has(.intro-head){row-gap:32px;grid-template-columns:1.05fr 1fr}
  .intro-head{grid-column:1;grid-row:1}
  .form-card{grid-column:2!important;grid-row:1/4!important;align-self:start!important}
  .book-row{grid-column:1!important;grid-row:2!important;margin-top:0!important}
  .intro-contacts{grid-column:1!important;grid-row:3!important}
}
/* about — process step description in correct column on mobile */
@media(max-width:759px){.process-step p,.process-step .dur{grid-column:2!important}}
/* lang toggle — injected by rawwInjectLangToggle() */
.lang-toggle{display:inline-flex;align-items:center;border:1px solid rgba(242,237,228,.22);font-family:"Courier New",monospace;font-size:11px;letter-spacing:.18em;margin-left:14px;background:transparent}
.lang-toggle .opt{padding:6px 10px;color:rgba(242,237,228,.5);background:transparent;border:0;font-family:inherit;font-size:inherit;letter-spacing:inherit}
.lang-toggle .opt.is-active{background:#d6b373;color:#0D0B09}
.lang-toggle .sep{color:rgba(242,237,228,.32);padding:0 2px}
@media(max-width:759px){.lang-toggle{display:none}}
.mobile-menu .lang-toggle{display:inline-flex;margin:24px 0 0}

/* ── 11. UTILITY CLASSES ──────────────────────────────────── */
.u-hidden{display:none!important}
.text-gold{color:var(--gold)}
.legal-link{color:inherit;text-decoration:underline;text-underline-offset:3px}
.ext--dim{color:var(--ivory-faint)!important}
/* Kept for back-compat but no longer used — alignment handled via .sectors-head */
.section-head--flush{margin-bottom:0!important;border-bottom:0!important;padding:80px var(--pad) 56px!important;margin-left:calc(var(--pad)*-1)!important;margin-right:calc(var(--pad)*-1)!important}
/* Sectors section-head: no negative margins, aligns perfectly with other section-heads */
.sectors-head{border-bottom:0!important;margin-bottom:0!important;padding-top:80px;padding-bottom:56px}
.lazy-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ── 12. REVEAL ON SCROLL ─────────────────────────────────── */
.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s cubic-bezier(.2,.8,.2,1), transform 1s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal.delay-1{transition-delay:.12s}
.reveal.delay-2{transition-delay:.24s}
.reveal.delay-3{transition-delay:.36s}

/* ── 13. FOOTER ───────────────────────────────────────────── */
footer{padding:64px var(--pad) 30px;border-top:1px solid var(--hair)}
.footer-grid{display:grid;grid-template-columns:1fr;gap:36px;margin-bottom:40px}
@media(min-width:760px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr}}
.footer-brand .name{font-size:36px;font-weight:300;letter-spacing:-.02em;line-height:1}
.footer-brand .tag{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-faint);margin-top:10px}
.footer-col h4{font-family:var(--font-mono);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--ivory-faint);margin-bottom:14px;font-weight:400}
.footer-col ul{list-style:none}
.footer-col li{margin-bottom:10px;font-size:14px;color:var(--ivory-dim);transition:color .25s ease}
.footer-col a:hover{color:var(--gold)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:22px;border-top:1px solid var(--hair);font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ivory-faint)}
.footer-bottom .meta-row{display:flex;gap:18px}
/* Home footer has extra vertical space */
.page-home footer{padding:80px var(--pad) 36px}
.page-home .footer-grid{gap:48px;margin-bottom:56px}
.page-home .footer-brand .name{font-size:42px}
.page-home .footer-bottom{padding-top:28px}
/* Contact footer — no border-top (page has a bottom-strip above) */
.page-contact footer{border-top:0}

/* ══════════════════════════════════════════════════════════
   HOME PAGE (index.html · class="page-home")
   ══════════════════════════════════════════════════════════ */

/* Section base */
section{position:relative;padding:clamp(80px,12vh,160px) var(--pad)}
.eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:12px;margin-bottom:24px}
.eyebrow::before{content:"";width:24px;height:1px;background:var(--gold)}
.section-title{font-family:var(--font-sans);font-weight:300;font-size:clamp(40px,6vw,84px);line-height:1;letter-spacing:-.03em;color:var(--ivory)}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-bottom:64px;border-bottom:1px solid var(--hair);padding-bottom:28px}
.section-head .lede{max-width:380px;color:var(--ivory-dim);font-size:14px;line-height:1.7}

/* Hero */
.hero{position:relative;height:100vh;min-height:640px;width:100%;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:0 var(--pad) calc(var(--pad) + 12px)}
.hero-media{position:absolute;inset:0;z-index:0}
.hero-media video,.hero-media .fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-media .fallback{background:radial-gradient(ellipse at 30% 25%, rgba(214,179,115,.22), transparent 55%),radial-gradient(ellipse at 80% 90%, rgba(139,115,85,.30), transparent 60%),linear-gradient(180deg,#1a140e 0%,#0b0908 60%,#050403 100%)}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(13,11,9,.55) 0%, rgba(13,11,9,.25) 35%, rgba(13,11,9,.78) 100%)}
.hero-vignette{position:absolute;inset:0;box-shadow:inset 0 0 240px 60px rgba(0,0,0,.85);pointer-events:none}
.hero-meta{position:absolute;top:calc(var(--pad) + 60px);left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;align-items:flex-start;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;color:var(--ivory-faint);text-transform:uppercase;z-index:2}
.hero-meta .col{display:flex;flex-direction:column;gap:6px}
.hero-meta .col.right{text-align:right}
.hero-meta .label{color:var(--ivory-faint);opacity:.6}
.hero-meta .value{color:var(--ivory-dim)}
.hero-center{position:absolute;left:0;right:0;top:50%;transform:translateY(-54%);z-index:2;text-align:center;padding:0 var(--pad)}
.hero-eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);margin-bottom:28px;display:inline-flex;align-items:center;gap:14px}
.hero-eyebrow::before,.hero-eyebrow::after{content:"";width:30px;height:1px;background:var(--gold);opacity:.6}
.hero-title{font-family:var(--font-sans);font-weight:300;font-size:clamp(72px,16vw,260px);line-height:.86;letter-spacing:-.045em;color:var(--ivory);text-transform:uppercase}
.hero-title .row{display:block;overflow:hidden}
.hero-title .row span{display:inline-block;transform:translateY(110%);animation:rise 1.4s cubic-bezier(.2,.8,.2,1) forwards}
.hero-title .row:nth-child(2) span{animation-delay:.16s}
@keyframes rise{to{transform:translateY(0)}}
.hero-sub{margin-top:34px;font-family:var(--font-sans);font-weight:300;font-size:clamp(15px,1.4vw,18px);letter-spacing:.04em;color:var(--ivory-dim);max-width:560px;margin-left:auto;margin-right:auto;opacity:0;animation:fade 1.2s ease .8s forwards}
@keyframes fade{to{opacity:1}}
.hero-bottom{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:24px}
.hero-pillars{display:flex;gap:0;font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--ivory-dim)}
.hero-pillars span{padding:0 18px;border-right:1px solid var(--hair);position:relative}
.hero-pillars span:first-child{padding-left:28px}
.hero-pillars span:last-child{border-right:0;padding-right:0}
.hero-pillars span::before{content:"";display:inline-block;width:4px;height:4px;background:var(--gold);border-radius:50%;margin-right:10px;vertical-align:middle;transform:translateY(-2px)}
.scroll-ind{display:flex;align-items:center;gap:14px;font-family:var(--font-mono);font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--ivory-faint)}
.scroll-ind .line{position:relative;width:1px;height:48px;background:var(--hair-strong);overflow:hidden}
.scroll-ind .line::after{content:"";position:absolute;top:-48px;left:0;width:1px;height:48px;background:var(--gold);animation:trail 2.6s cubic-bezier(.6,0,.4,1) infinite}
@keyframes trail{0%{top:-48px}60%,100%{top:48px}}

/* Corner brackets */
.bracket{position:absolute;width:18px;height:18px;border:1px solid var(--gold);opacity:.55;z-index:2}
.bracket.tl{top:calc(var(--pad) + 6px);left:var(--pad);border-right:0;border-bottom:0}
.bracket.tr{top:calc(var(--pad) + 6px);right:var(--pad);border-left:0;border-bottom:0}
.bracket.bl{bottom:calc(var(--pad) + 6px);left:var(--pad);border-right:0;border-top:0}
.bracket.br{bottom:calc(var(--pad) + 6px);right:var(--pad);border-left:0;border-top:0}

/* Sectors */
.sectors{padding-top:0}
.sectors-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--hair);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
@media(min-width:900px){.sectors-grid{grid-template-columns:repeat(3,1fr)}}
.sector{position:relative;background:var(--void);overflow:hidden;padding:56px var(--pad);min-height:380px;display:flex;flex-direction:column;justify-content:space-between;cursor:none;transition:padding .5s ease}
.sector .bg{position:absolute;inset:0;opacity:0;transition:opacity .8s ease, transform 1.2s ease;transform:scale(1.06)}
.sector .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(13,11,9,.35), rgba(13,11,9,.85))}
.sector:hover .bg{opacity:1;transform:scale(1)}
.sector .num{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;color:var(--gold);position:relative;z-index:1}
.sector .name{position:relative;z-index:1;font-family:var(--font-sans);font-weight:300;font-size:clamp(38px,5vw,64px);letter-spacing:-.02em;line-height:1;margin-top:auto}
.sector .name em{font-style:italic;font-weight:300}
.sector .meta{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;margin-top:32px;font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ivory-dim)}
.sector .meta .arrow{display:inline-flex;align-items:center;gap:8px;transition:transform .4s ease}
.sector:hover .meta .arrow{transform:translateX(8px);color:var(--gold)}
.sector.sport .bg{background:radial-gradient(ellipse at 20% 80%, rgba(214,179,115,.28), transparent 55%), linear-gradient(135deg, #1a1410 0%, #2a1f17 50%, #0d0a08 100%)}
.sector.luxury .bg{background:radial-gradient(ellipse at 70% 30%, rgba(214,179,115,.40), transparent 60%), linear-gradient(135deg, #1c1814 0%, #2d2419 60%, #0d0b09 100%)}
.sector.travel .bg{background:radial-gradient(ellipse at 50% 50%, rgba(139,115,85,.35), transparent 65%), linear-gradient(135deg, #161210 0%, #28201a 50%, #0a0807 100%)}

/* Home work grid */
.work-grid{display:grid;grid-template-columns:1fr;gap:48px}
@media(min-width:780px){.work-grid{grid-template-columns:repeat(12,1fr);gap:32px 24px}}
.work-card{position:relative;cursor:none;display:flex;flex-direction:column;gap:18px}
.work-card.col-7{grid-column:span 12}
.work-card.col-5{grid-column:span 12}
.work-card.col-12{grid-column:span 12}
@media(min-width:780px){
  .work-card.col-7{grid-column:span 7}
  .work-card.col-5{grid-column:span 5}
  .work-card.col-12{grid-column:span 12}
}
.work-thumb{position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--shadow);cursor:none}
.work-card.col-12 .work-thumb{aspect-ratio:21/9}
.work-thumb .img{position:absolute;inset:0;transition:transform 1.4s cubic-bezier(.2,.8,.2,1), filter .8s ease;filter:saturate(.85) brightness(.9)}
.work-thumb .img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(13,11,9,.05), rgba(13,11,9,.55))}
.work-card:hover .work-thumb .img{transform:scale(1.06);filter:saturate(1) brightness(1)}
.work-thumb .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.92);width:88px;height:88px;border:1px solid var(--ivory);border-radius:50%;display:grid;place-items:center;color:var(--ivory);font-family:var(--font-mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;opacity:0;transition:opacity .5s ease, transform .5s ease, background .35s ease, color .35s ease}
.work-card:hover .work-thumb .play{opacity:1;transform:translate(-50%,-50%) scale(1)}
.work-card:hover .work-thumb .play:hover{background:var(--gold);color:var(--void);border-color:var(--gold)}
.work-thumb .tag{position:absolute;left:18px;top:18px;font-family:var(--font-mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory);background:rgba(13,11,9,.55);backdrop-filter:blur(10px);padding:8px 12px;border:1px solid var(--hair-strong)}
.work-thumb .runtime{position:absolute;right:18px;top:18px;font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;color:var(--ivory-dim)}
.work-info{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;border-top:1px solid var(--hair);padding-top:18px}
.work-info .left h3{font-family:var(--font-sans);font-weight:300;font-size:clamp(22px,2.4vw,34px);letter-spacing:-.015em;line-height:1.05}
.work-info .left .client{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-faint);margin-top:8px}
.work-info .right{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-dim);text-align:right;display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.work-cta{margin-top:80px;display:flex;justify-content:center}

/* Home placeholder thumbs */
.thumb-1{background:radial-gradient(ellipse at 25% 70%, rgba(214,179,115,.25), transparent 55%), linear-gradient(135deg,#1a130d,#0a0807)}
.thumb-2{background:radial-gradient(ellipse at 70% 35%, rgba(214,179,115,.35), transparent 50%), linear-gradient(135deg,#1c1814,#0d0b09)}
.thumb-3{background:radial-gradient(ellipse at 50% 60%, rgba(139,115,85,.40), transparent 60%), linear-gradient(135deg,#161210,#080605)}
.thumb-4{background:radial-gradient(ellipse at 30% 50%, rgba(214,179,115,.20), transparent 55%), linear-gradient(135deg,#1f1813,#0c0a08)}

/* Shared btn-line */
.btn-line{display:inline-flex;align-items:center;gap:18px;font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--ivory);padding:18px 28px;border:1px solid var(--hair-strong);transition:background .35s ease, color .35s ease, border-color .35s ease, padding .35s ease;cursor:none;background:transparent}
.btn-line:hover{background:var(--ivory);color:var(--void);border-color:var(--ivory);padding:18px 36px}
.btn-line.gold{border-color:var(--gold);color:var(--gold)}
.btn-line.gold:hover{background:var(--gold);color:var(--void)}
.btn-line .arrow{transition:transform .35s ease}
.btn-line:hover .arrow{transform:translateX(6px)}

/* Index lightbox */
.idx-lb{position:fixed;inset:0;z-index:500;background:rgba(13,11,9,.96);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s ease;cursor:none}
.idx-lb.is-open{opacity:1;pointer-events:auto}
.idx-lb iframe{width:90vw;max-width:1280px;aspect-ratio:16/9;border:0}
.idx-lb-close{position:absolute;top:24px;right:28px;background:none;border:0;color:var(--ivory);font-size:28px;line-height:1;padding:8px;opacity:.6;transition:opacity .2s;cursor:none}
.idx-lb-close:hover{opacity:1}

/* Testimonials */
.testimonials{padding:clamp(64px,8vw,128px) var(--pad)}
.t-inner{max-width:1200px;margin:0 auto}
.t-head{text-align:center;margin:0 auto 48px;max-width:560px}
@media(min-width:768px){.t-head{margin-bottom:64px}}
.t-head h2{font-family:var(--font-sans);font-weight:300;font-size:clamp(30px,4vw,52px);line-height:1.05;letter-spacing:-.03em;color:var(--ivory)}
.t-head h2 em{font-style:italic;color:var(--gold);font-weight:300}
.t-head p{color:var(--ivory-dim);font-size:15px;line-height:1.7;margin-top:20px}
.t-scroll-wrap{display:flex;gap:20px;max-height:680px;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent,black 13%,black 87%,transparent);mask-image:linear-gradient(to bottom,transparent,black 13%,black 87%,transparent)}
.t-col{flex:1;min-width:0;max-width:640px;margin:0 auto}
.t-col-inner{display:flex;flex-direction:column;gap:20px}
.tcard{border:1px solid var(--hair);background:var(--shadow);display:flex;flex-direction:column;transition:background .4s}
.tcard:hover{background:#211d19}
.tc-head{padding:20px 24px 16px;border-bottom:1px solid var(--hair);flex-shrink:0}
.tc-head-brand{font-family:var(--font-mono);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.tc-body{padding:32px;flex:1}
.tquote{display:flex;flex-direction:column;justify-content:space-between;gap:20px;height:100%}
.tq-uni{font-family:var(--font-sans);font-weight:300;font-size:17px;line-height:1.8;color:var(--ivory-dim)}
.tc-author{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px}
.tc-author img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:1px solid var(--hair-strong)}
.tc-name{font-family:var(--font-sans);font-weight:400;font-size:13px;color:var(--ivory);display:block;font-style:normal}
.tc-role{font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-faint);display:block;margin-top:3px}
@keyframes t-scroll-up{from{transform:translateY(0)}to{transform:translateY(-50%)}}
.t-anim-1{animation:t-scroll-up 20s linear infinite}
.t-anim-2{animation:t-scroll-up 26s linear infinite}
.t-col:hover .t-col-inner{animation-play-state:paused}

/* Brand line */
.brand-line{padding:120px var(--pad);text-align:center;border-bottom:1px solid var(--hair)}
.brand-line .pillar-row{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:34px}
.brand-line .pillar-row span{display:inline-block}
.brand-line .pillar-row .sep{color:var(--ivory-faint)}
.brand-line h2{font-family:var(--font-sans);font-weight:300;font-size:clamp(34px,5.5vw,72px);line-height:1.05;letter-spacing:-.03em;max-width:14ch;margin:0 auto;color:var(--ivory)}
.brand-line h2 em{font-style:italic;color:var(--gold);font-weight:300}

/* ══════════════════════════════════════════════════════════
   WORK PAGE (work.html · class="page-work")
   ══════════════════════════════════════════════════════════ */

/* Page header */
.page-head{padding:160px var(--pad) 60px;border-bottom:1px solid var(--hair);position:relative}
.page-head .meta{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:32px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px}
.page-head h1{font-family:var(--font-sans);font-weight:300;font-size:clamp(60px,12vw,200px);line-height:.86;letter-spacing:-.045em;text-transform:uppercase}
.page-head h1 em{font-style:italic;font-weight:300;color:var(--gold)}
.page-head .lede{font-family:var(--font-sans);font-weight:300;font-size:clamp(15px,1.4vw,18px);color:var(--ivory-dim);max-width:540px;margin-top:36px;line-height:1.6}

/* Filters */
.filters{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:24px;padding:32px var(--pad);border-bottom:1px solid var(--hair);position:sticky;top:54px;background:rgba(13,11,9,.92);backdrop-filter:blur(12px);z-index:30}
.filters-list{display:flex;gap:0;flex-wrap:wrap;font-family:var(--font-mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase}
.filter-btn{background:none;border:0;color:var(--ivory-faint);padding:10px 22px 10px 0;cursor:none;position:relative;transition:color .3s ease;font-family:var(--font-mono);letter-spacing:.24em;font-size:11px;text-transform:uppercase;display:inline-flex;align-items:baseline;gap:8px}
.filter-btn .count{font-size:9px;color:var(--ivory-faint);opacity:.6}
.filter-btn:hover{color:var(--ivory)}
.filter-btn.is-active{color:var(--gold)}
.filter-btn.is-active .count{color:var(--gold);opacity:.8}
.filter-btn::after{content:"";position:absolute;left:0;bottom:6px;height:1px;width:0;background:var(--gold);transition:width .35s ease}
.filter-btn.is-active::after{width:calc(100% - 22px)}
.filters-meta{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-faint)}

/* Work archive grid */
.work-section{padding:80px var(--pad) 120px}
.work-section .work-grid{grid-template-columns:1fr;gap:48px 24px}
@media(min-width:680px){.work-section .work-grid{grid-template-columns:repeat(6,1fr)}}
@media(min-width:1100px){.work-section .work-grid{grid-template-columns:repeat(12,1fr);gap:64px 28px}}
.card{position:relative;cursor:none;display:flex;flex-direction:column;gap:18px;transition:opacity .5s ease, transform .5s ease}
@media(max-width:900px){.card,.filter-btn,.card .thumb{cursor:auto}.mobile-menu a{cursor:pointer}}
.card.is-hidden{display:none}
@media(min-width:1100px){
  .card.size-l{grid-column:span 7}
  .card.size-m{grid-column:span 5}
  .card.size-s{grid-column:span 4}
  .card.size-w{grid-column:span 12}
}
@media(min-width:680px) and (max-width:1099px){
  .card.size-l,.card.size-w{grid-column:span 6}
  .card.size-m,.card.size-s{grid-column:span 3}
}
.card .thumb{position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--shadow)}
.card.size-w .thumb{aspect-ratio:21/9}
.card.size-s .thumb{aspect-ratio:4/5}
.card .img{position:absolute;inset:0;transition:transform 1.4s cubic-bezier(.2,.8,.2,1), filter .8s ease;filter:saturate(.85) brightness(.9)}
.card .img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(13,11,9,.05), rgba(13,11,9,.6))}
.card:hover .img{transform:scale(1.06);filter:saturate(1) brightness(1)}
.card .tag-group{position:absolute;left:16px;top:16px;display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 32px)}
.card .tag{font-family:var(--font-mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory);background:rgba(13,11,9,.6);padding:7px 11px;border:1px solid var(--hair-strong)}
.card .runtime{position:absolute;right:16px;top:16px;font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;color:var(--ivory-dim)}
.card .play{position:absolute;left:50%;top:50%;width:88px;height:88px;border:1px solid var(--ivory);border-radius:50%;transform:translate(-50%,-50%) scale(.92);display:grid;place-items:center;color:var(--ivory);font-family:var(--font-mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;opacity:0;transition:opacity .4s ease, transform .4s ease, background .35s ease, color .35s ease}
.card:hover .play{opacity:1;transform:translate(-50%,-50%) scale(1)}
.card:hover .play:hover{background:var(--gold);color:var(--void);border-color:var(--gold)}
.card .info{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--hair);padding-top:16px}
.card .info h3{font-family:var(--font-sans);font-weight:300;font-size:clamp(20px,2vw,28px);letter-spacing:-.015em;line-height:1.05}
.card .info .client{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-faint);margin-top:8px}
.card .info .right{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-dim);text-align:right;display:flex;flex-direction:column;gap:6px;flex-shrink:0}

/* Work archive placeholder thumbs */
.thumb-1{background-image:url('https://vumbnail.com/1186679207.jpg');background-size:cover;background-position:center}
.thumb-5{background:radial-gradient(ellipse at 80% 80%, rgba(214,179,115,.30), transparent 50%), linear-gradient(135deg,#1d1814,#0b0908)}
.thumb-6{background:radial-gradient(ellipse at 20% 30%, rgba(139,115,85,.30), transparent 55%), linear-gradient(135deg,#191411,#080706)}
.thumb-7{background:radial-gradient(ellipse at 60% 70%, rgba(214,179,115,.32), transparent 55%), linear-gradient(135deg,#1c1610,#0a0807)}
.thumb-8{background:radial-gradient(ellipse at 40% 40%, rgba(139,115,85,.34), transparent 55%), linear-gradient(135deg,#1a1612,#080605)}

/* Work lightbox */
.lightbox{position:fixed;inset:0;z-index:500;background:rgba(5,4,3,.96);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s ease;padding:64px var(--pad)}
.lightbox.is-open{opacity:1;pointer-events:auto}
.lightbox-frame{position:relative;width:100%;max-width:1280px;aspect-ratio:16/9;background:#000;border:1px solid var(--hair);box-shadow:0 30px 120px rgba(0,0,0,.6)}
.lightbox-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lightbox-close{position:absolute;top:24px;right:24px;width:48px;height:48px;border:1px solid var(--hair-strong);background:rgba(13,11,9,.6);color:var(--ivory);display:grid;place-items:center;cursor:none;font-family:var(--font-mono);font-size:14px;letter-spacing:.18em;transition:background .3s, color .3s, border-color .3s}
.lightbox-close:hover{background:var(--gold);color:var(--void);border-color:var(--gold)}
.lightbox-info{position:absolute;left:24px;bottom:24px;font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-faint)}
.lightbox-info strong{font-family:var(--font-sans);font-weight:300;font-size:18px;letter-spacing:-.01em;color:var(--ivory);text-transform:none;display:block;margin-bottom:6px}

/* ══════════════════════════════════════════════════════════
   ABOUT PAGE (about.html)
   ══════════════════════════════════════════════════════════ */

/* About hero */
.about-hero{position:relative;min-height:100vh;padding:140px var(--pad) 80px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
.about-hero .bg{position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 70% 30%, rgba(214,179,115,.30), transparent 55%),radial-gradient(ellipse at 20% 80%, rgba(139,115,85,.30), transparent 55%),linear-gradient(160deg,#1a1410 0%,#0a0807 70%)}
.about-hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(13,11,9,.45), rgba(13,11,9,.85))}
.about-hero .placeholder-tag{position:absolute;left:var(--pad);bottom:24px;font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-faint);z-index:2;opacity:.7}
.about-hero-content{position:relative;z-index:2}
.about-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:60px}
.about-title{font-family:var(--font-sans);font-weight:300;font-size:clamp(80px,18vw,300px);line-height:.84;letter-spacing:-.05em;text-transform:uppercase}
.about-title em{font-style:italic;color:var(--gold);font-weight:300}
.about-subtitle{margin-top:36px;display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;border-top:1px solid var(--hair);padding-top:32px}
.about-subtitle h2{font-family:var(--font-sans);font-weight:300;font-size:clamp(22px,2.4vw,32px);letter-spacing:-.015em;line-height:1.2;max-width:540px}
.about-subtitle .credit{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-dim);text-align:right}

/* Method */
.method{padding:140px var(--pad);border-top:1px solid var(--hair);position:relative}
.method-head{display:grid;grid-template-columns:1fr;gap:32px;margin-bottom:80px}
@media(min-width:880px){.method-head{grid-template-columns:1fr 1fr}}
.method-head .eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);display:inline-flex;gap:12px;align-items:center}
.method-head .eyebrow::before{content:"";width:24px;height:1px;background:var(--gold)}
.method-head h2{font-family:var(--font-sans);font-weight:300;font-size:clamp(40px,6vw,84px);line-height:1;letter-spacing:-.03em;margin-top:20px}
.method-head p{color:var(--ivory-dim);font-size:15px;line-height:1.7;max-width:480px;align-self:end}
.method-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--hair)}
@media(min-width:900px){.method-grid{grid-template-columns:repeat(3,1fr)}}
.method-card{background:var(--void);padding:48px 36px;display:flex;flex-direction:column;gap:32px;min-height:420px;position:relative;transition:background .5s}
.method-card:hover{background:var(--shadow)}
.method-card .num{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.method-card h3{font-family:var(--font-sans);font-weight:300;font-size:clamp(28px,3vw,40px);letter-spacing:-.02em;line-height:1.05;margin-top:auto}
.method-card h3 em{font-style:italic;color:var(--gold);font-weight:300}
.method-card p{color:var(--ivory-dim);font-size:14px;line-height:1.7;margin-top:auto}

/* Display quote */
.display-quote{padding:140px var(--pad);border-top:1px solid var(--hair);position:relative;overflow:hidden}
.display-quote::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 30% 50%, rgba(214,179,115,.10), transparent 60%);pointer-events:none}
.display-quote .text{font-family:var(--font-sans);font-weight:300;font-size:clamp(36px,7vw,108px);line-height:1.02;letter-spacing:-.035em;max-width:18ch;position:relative}
.display-quote .text em{font-style:italic;color:var(--gold);font-weight:300}
.display-quote .footer-meta{margin-top:60px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-faint);border-top:1px solid var(--hair);padding-top:24px}

/* Bio */
.bio{padding:140px var(--pad);border-top:1px solid var(--hair);display:grid;grid-template-columns:1fr;gap:64px}
@media(min-width:1000px){.bio{grid-template-columns:1.1fr 1fr;gap:96px}}
.bio-image{position:relative;aspect-ratio:4/5;background:radial-gradient(ellipse at 30% 50%, rgba(214,179,115,.20), transparent 55%),linear-gradient(135deg,#1c1714,#080605);border:1px solid var(--hair);overflow:hidden}
.bio-image .tag{position:absolute;left:18px;top:18px;font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-faint)}
.bio-image .runtime{position:absolute;right:18px;bottom:18px;font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;color:var(--ivory-faint)}
.bio-text{display:flex;flex-direction:column;gap:32px;align-self:center}
.bio-text .eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);display:inline-flex;gap:12px;align-items:center}
.bio-text .eyebrow::before{content:"";width:24px;height:1px;background:var(--gold)}
.bio-text h2{font-family:var(--font-sans);font-weight:300;font-size:clamp(28px,3.4vw,46px);letter-spacing:-.02em;line-height:1.15}
.bio-text h2 em{font-style:italic;color:var(--gold);font-weight:300}
.bio-text p{color:var(--ivory-dim);font-size:15px;line-height:1.75;max-width:54ch}

/* Stats */
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--hair);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
@media(min-width:760px){.stats{grid-template-columns:repeat(4,1fr)}}
.stat{background:var(--void);padding:36px var(--pad);display:flex;flex-direction:column;gap:8px}
.stat .v{font-family:var(--font-sans);font-weight:300;font-size:clamp(36px,4.5vw,64px);letter-spacing:-.025em;line-height:1}
.stat .v em{font-style:italic;color:var(--gold);font-weight:300}
.stat .l{font-family:var(--font-mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ivory-faint)}

/* Clients */
.clients{padding:140px var(--pad);border-top:1px solid var(--hair)}
.clients-head{margin-bottom:64px}
.clients-head .eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);display:inline-flex;gap:12px;align-items:center}
.clients-head .eyebrow::before{content:"";width:24px;height:1px;background:var(--gold)}
.clients-head h2{font-family:var(--font-sans);font-weight:300;font-size:clamp(40px,5.5vw,72px);line-height:1;letter-spacing:-.025em;margin-top:20px}
.clients-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--hair);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
@media(min-width:760px){.clients-grid{grid-template-columns:repeat(3,1fr)}}
.client-cell{background:var(--void);padding:42px 24px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:8px;min-height:160px;transition:background .35s}
.client-cell:hover{background:var(--shadow)}
.client-cell .name{font-family:var(--font-sans);font-weight:400;font-size:clamp(15px,1.4vw,18px);letter-spacing:.02em;color:var(--ivory)}
.client-cell .sector{font-family:var(--font-mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ivory-faint)}

/* Process */
.process{padding:140px var(--pad);border-top:1px solid var(--hair)}
.process-head{margin-bottom:80px;display:grid;grid-template-columns:1fr;gap:32px}
@media(min-width:880px){.process-head{grid-template-columns:1fr 1fr}}
.process-head .eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.process-head h2{font-family:var(--font-sans);font-weight:300;font-size:clamp(40px,5.5vw,72px);line-height:1;letter-spacing:-.025em;margin-top:20px}
.process-head p{color:var(--ivory-dim);font-size:15px;line-height:1.7;max-width:480px;align-self:end}
.process-list{display:flex;flex-direction:column;border-top:1px solid var(--hair)}
.process-step{display:grid;grid-template-columns:80px 1fr;gap:24px;padding:32px 0;border-bottom:1px solid var(--hair);align-items:start;transition:padding .35s}
@media(min-width:760px){.process-step{grid-template-columns:120px 200px 1fr 200px;gap:48px}}
.process-step:hover{padding-left:12px}
.process-step .num{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.process-step h3{font-family:var(--font-sans);font-weight:300;font-size:clamp(22px,2.4vw,30px);letter-spacing:-.015em;line-height:1.1}
.process-step p{color:var(--ivory-dim);font-size:14px;line-height:1.7}
.process-step .dur{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-faint);text-align:right}

/* CTA block (about page) */
.cta-block{padding:160px var(--pad);text-align:center;border-top:1px solid var(--hair);position:relative}
.cta-block::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 60%, rgba(214,179,115,.08), transparent 65%);pointer-events:none}
.cta-block .eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:32px;display:block}
.cta-block h2{font-family:var(--font-sans);font-weight:300;font-size:clamp(44px,8vw,128px);line-height:.92;letter-spacing:-.04em;max-width:14ch;margin:0 auto}
.cta-block h2 em{font-style:italic;color:var(--gold);font-weight:300}
.cta-block .actions{margin-top:60px;display:flex;justify-content:center;gap:18px;flex-wrap:wrap}

/* ══════════════════════════════════════════════════════════
   CONTACT PAGE (contact.html · class="page-contact")
   ══════════════════════════════════════════════════════════ */
.page-contact body,.page-contact{min-height:100vh}
.bg-ambient{position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 75% 20%, rgba(214,179,115,.20), transparent 55%),radial-gradient(ellipse at 15% 90%, rgba(139,115,85,.18), transparent 55%),var(--void)}
.page{padding:140px var(--pad) 80px;display:grid;grid-template-columns:1fr;gap:80px}
@media(min-width:1000px){.page{grid-template-columns:1.05fr 1fr;gap:96px;padding-bottom:120px}}
.intro .meta{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:36px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-bottom:1px solid var(--hair);padding-bottom:24px}
.intro h1{font-family:var(--font-sans);font-weight:300;font-size:clamp(56px,10vw,140px);line-height:.88;letter-spacing:-.045em;text-transform:uppercase}
.intro h1 em{font-style:italic;color:var(--gold);font-weight:300}
.intro .lede{margin-top:36px;color:var(--ivory-dim);font-size:16px;line-height:1.7;max-width:48ch}
.intro-list{margin-top:60px;display:flex;flex-direction:column;border-top:1px solid var(--hair)}
.intro-row{display:grid;grid-template-columns:140px 1fr auto;gap:24px;padding:22px 0;border-bottom:1px solid var(--hair);align-items:center;transition:padding .35s}
.intro-row:hover{padding-left:8px}
.intro-row .label{font-family:var(--font-mono);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--ivory-faint)}
.intro-row .value{font-family:var(--font-sans);font-weight:300;font-size:clamp(17px,1.6vw,22px);letter-spacing:-.005em}
.intro-row .ext{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);transition:transform .35s}
.intro-row:hover .ext{transform:translateX(6px)}
/* Form card */
.form-card{background:var(--shadow);border:1px solid var(--hair);padding:48px clamp(24px,3vw,40px);position:relative;align-self:start}
.form-card::before{content:"";position:absolute;left:-1px;top:-1px;right:-1px;bottom:-1px;border:1px solid var(--hair-strong);pointer-events:none;opacity:0}
.form-head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:16px;margin-bottom:36px;padding-bottom:24px;border-bottom:1px solid var(--hair)}
.form-head .title{font-family:var(--font-sans);font-weight:300;font-size:clamp(22px,2.2vw,30px);letter-spacing:-.015em}
.form-head .num{font-family:var(--font-mono);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:28px}
.field label{font-family:var(--font-mono);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--ivory-faint);display:flex;justify-content:space-between;align-items:center}
.field label .req{color:var(--gold);opacity:.6}
.field input,.field textarea,.field select{background:transparent;border:0;border-bottom:1px solid var(--hair-strong);color:var(--ivory);font-family:var(--font-sans);font-weight:300;font-size:16px;padding:12px 0;outline:0;transition:border-color .3s ease;width:100%;border-radius:0;cursor:none}
.field input:focus,.field textarea:focus,.field select:focus{border-bottom-color:var(--gold)}
.field input::placeholder,.field textarea::placeholder{color:var(--ivory-faint)}
.field textarea{resize:none;min-height:120px;line-height:1.6}
.field select{appearance:none;-webkit-appearance:none;background:transparent;background-image:linear-gradient(45deg, transparent 50%, var(--ivory-dim) 50%), linear-gradient(135deg, var(--ivory-dim) 50%, transparent 50%);background-position:calc(100% - 14px) 50%, calc(100% - 8px) 50%;background-size:6px 6px, 6px 6px;background-repeat:no-repeat;padding-right:30px}
.field select option{background:var(--shadow);color:var(--ivory)}
/* Category pills */
.cat-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.cat-pill{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;padding:10px 14px;border:1px solid var(--hair-strong);color:var(--ivory-dim);cursor:none;transition:background .3s, color .3s, border-color .3s;background:transparent}
.cat-pill:hover{color:var(--ivory);border-color:var(--ivory-dim)}
.cat-pill.is-active{background:var(--gold);color:var(--void);border-color:var(--gold)}
/* Budget */
.budget-row{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:6px}
@media(min-width:520px){.budget-row{grid-template-columns:repeat(4,1fr)}}
/* Submit */
.submit-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px;margin-top:36px;padding-top:24px;border-top:1px solid var(--hair)}
.submit-row .legal{font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ivory-faint);max-width:32ch;line-height:1.6}
.submit-btn{display:inline-flex;align-items:center;gap:18px;font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--void);background:var(--gold);border:1px solid var(--gold);padding:18px 28px;cursor:none;transition:padding .35s, background .3s, color .3s}
.submit-btn:hover{padding:18px 36px;background:var(--ivory);border-color:var(--ivory)}
.submit-btn .arrow{transition:transform .35s}
.submit-btn:hover .arrow{transform:translateX(6px)}
.submit-btn:disabled{opacity:.6;cursor:not-allowed}
/* Status */
.status{margin-top:18px;font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;display:none}
.status.is-show{display:block}
.status.success{color:var(--gold)}
.status.error{color:#d97a6c}
/* Book row */
.book-row{padding-top:32px;border-top:1px solid var(--hair);display:flex;flex-direction:column;gap:14px}
.book-row .label{font-family:var(--font-mono);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--ivory-faint)}
.book-row a{font-family:var(--font-sans);font-weight:300;font-size:clamp(22px,2.4vw,32px);letter-spacing:-.015em;display:inline-flex;align-items:center;gap:14px;color:var(--ivory);transition:color .3s}
.book-row a:hover{color:var(--gold)}
.book-row a .arrow{display:inline-block;transition:transform .35s}
.book-row a:hover .arrow{transform:translateX(8px)}
/* Mobile cursor fixes */
@media(max-width:900px){.cat-pill,.submit-btn{cursor:pointer}.field input,.field textarea,.field select{cursor:text}}
/* Bottom strip */
.bottom-strip{display:grid;grid-template-columns:1fr;gap:1px;background:var(--hair);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
@media(min-width:760px){.bottom-strip{grid-template-columns:repeat(3,1fr)}}
.strip-cell{background:var(--void);padding:42px var(--pad);display:flex;flex-direction:column;gap:14px}
.strip-cell .l{font-family:var(--font-mono);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--ivory-faint)}
.strip-cell .v{font-family:var(--font-sans);font-weight:300;font-size:clamp(20px,2vw,26px);letter-spacing:-.01em}
.strip-cell .v em{font-style:italic;color:var(--gold);font-weight:300}

/* ══════════════════════════════════════════════════════════
   LEGAL PAGES (mentions-legales + politique-de-confidentialite)
   ══════════════════════════════════════════════════════════ */
.legal-page{padding:140px var(--pad) 120px;max-width:800px}
.legal-page .page-eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:32px;display:inline-flex;align-items:center;gap:12px}
.legal-page .page-eyebrow::before{content:"";width:24px;height:1px;background:var(--gold)}
.legal-page h1{font-family:var(--font-sans);font-weight:300;font-size:clamp(40px,6vw,84px);line-height:1;letter-spacing:-.03em;margin-bottom:64px;border-bottom:1px solid var(--hair);padding-bottom:40px}
.legal-section{margin-bottom:48px;padding-bottom:48px;border-bottom:1px solid var(--hair)}
.legal-section:last-child{border-bottom:0;margin-bottom:0}
.legal-section h2{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.legal-section h3{font-family:var(--font-mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-dim);margin:18px 0 10px}
.legal-section p{color:var(--ivory-dim);font-size:15px;line-height:1.75;max-width:62ch}
.legal-section p + p{margin-top:12px}
.legal-section ul{list-style:none;margin-top:12px;display:flex;flex-direction:column;gap:8px}
.legal-section ul li{color:var(--ivory-dim);font-size:15px;line-height:1.75;padding-left:16px;position:relative;max-width:62ch}
.legal-section ul li::before{content:"—";position:absolute;left:0;color:var(--gold)}
.legal-section a{color:var(--gold);transition:opacity .25s}
.legal-section a:hover{opacity:.7}
.legal-update{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-faint);margin-top:64px;padding-top:24px;border-top:1px solid var(--hair)}

/* ══════════════════════════════════════════════════════════
   404 PAGE (404.html · class="page-404" on <body>)
   ══════════════════════════════════════════════════════════ */
.page-404{overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:var(--pad)}
@media(max-width:900px){.page-404{cursor:auto;overflow:auto}}
/* 404 scanline overlay */
.scanline{position:fixed;inset:0;pointer-events:none;z-index:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,.06) 3px,rgba(0,0,0,.06) 4px)}
/* 404 brand (fixed top-left, not inside .nav) */
.page-404 .brand{position:fixed;top:0;left:0;padding:14px var(--pad);display:flex;align-items:center;gap:14px;color:var(--ivory);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;letter-spacing:.22em;font-size:13px;z-index:50}
.page-404 .brand .glyph{width:22px;height:22px;border:1px solid var(--ivory);display:grid;place-items:center;font-weight:400;font-size:11px}
/* 404 large frame number */
.frame{position:fixed;right:var(--pad);top:50%;transform:translateY(-50%);font-family:var(--font-mono);font-size:clamp(180px,22vw,320px);font-weight:300;line-height:1;color:rgba(214,179,115,.18);letter-spacing:-.05em;pointer-events:none;user-select:none}
/* 404 content */
.page-404 .content{position:relative;z-index:2;max-width:680px}
.page-404 .eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:36px;display:inline-flex;align-items:center;gap:12px}
.page-404 .eyebrow::before{content:"";width:24px;height:1px;background:var(--gold)}
.page-404 h1{font-family:var(--font-sans);font-weight:300;font-size:clamp(42px,7vw,100px);line-height:.92;letter-spacing:-.04em;text-transform:uppercase;margin-bottom:12px}
.page-404 h1 em{font-style:normal;color:var(--gold)}
.page-404 .sub{font-family:var(--font-mono);font-size:13px;letter-spacing:.12em;color:var(--ivory-dim);margin-bottom:56px;line-height:1.6}
.page-404 .sub span{display:block}
.page-404 .cta{display:inline-flex;align-items:center;gap:16px;font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;border-bottom:1px solid var(--hair-strong);padding-bottom:14px;transition:border-color .3s,gap .3s;color:var(--ivory)}
.page-404 .cta:hover{border-color:var(--gold);gap:24px}
.page-404 .cta .arrow{color:var(--gold);transition:transform .35s}
.page-404 .cta:hover .arrow{transform:translateX(6px)}
/* 404 bottom meta */
.page-404 .meta{position:fixed;bottom:var(--pad);left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;align-items:flex-end;z-index:2}
.page-404 .meta .label{font-family:var(--font-mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ivory-faint)}
.page-404 .meta a{font-family:var(--font-mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ivory-faint);transition:color .25s}
.page-404 .meta a:hover{color:var(--gold)}