/* =========================================================
   TOKENS — every size and colour on this page comes from here.
   ========================================================= */
:root{
  /* surface */
  --ink:#2A1A29;        /* page — lifted off black, still deep aubergine */
  --ink-2:#332132;      /* raised band — lighter than the page, so it reads as raised */
  --rule:#3E2A3C;       /* hairline */
  --rule-2:#4E374C;     /* stronger border */
  --well:#221523;       /* media backing — the one thing darker than the page */
  /* text — exactly three levels, never improvised */
  --t-1:#FBF7FA;        /* headings + emphasis — 14.9:1 */
  --t-2:#E4DCE2;        /* all body prose — 12.3:1, near-white */
  --t-3:#BCADB7;        /* labels, meta, tertiary — 7.7:1 */
  /* brand */
  --plum:#8E5D89;       /* logo only */
  --ember:#E88A52;      /* accents, links */
  --ember-d:#C2552C;    /* buttons */
  --ember-dd:#A9481F;   /* button hover */
  --warm:#FFF6F0;       /* text on ember */
  /* type scale — six steps, nothing between them */
  --f-micro:12px;       /* uppercase tracked labels */
  --f-sm:15px;          /* meta, spec rows, footer */
  --f-body:17px;        /* body prose */
  --f-lg:18.5px;        /* ledes and intros */
  --f-h3:25px;
  --f-quote:clamp(21px,2.4vw,28px);
  --f-h2:clamp(32px,4.4vw,50px);
  --f-h1:clamp(46px,7.4vw,86px);
  /* rhythm */
  --gap:12px;
  --sec:92px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--ink); color:var(--t-2);
  font-family:Karla,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:var(--f-body); line-height:1.65; -webkit-font-smoothing:antialiased;
}
img,video{display:block;max-width:100%}
p{margin:0 0 14px}
p:last-child{margin-bottom:0}
figure{margin:0}
.wrap{max-width:1180px;margin:0 auto;padding:0 6vw}
/* ---------- headings: always --t-1, always Fraunces ---------- */
h1,h2,h3{font-family:Fraunces,Georgia,"Times New Roman",serif;color:var(--t-1);margin:0}
h1{font-weight:700;font-size:var(--f-h1);line-height:.98;letter-spacing:-.025em}
h2{font-weight:500;font-size:var(--f-h2);line-height:1.08;letter-spacing:-.02em}
h3{font-weight:500;font-size:var(--f-h3);line-height:1.2}
/* ---------- the one label style, used everywhere ---------- */
.label{font-family:Karla,sans-serif;font-size:var(--f-micro);font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;line-height:1.5;margin:0 0 14px}
.label.ember{color:var(--ember)}
.label.dim{color:var(--t-3)}
/* ---------- links + buttons ---------- */
a{color:var(--ember)}
.btns{display:flex;flex-wrap:wrap;gap:13px;margin-top:34px}
.btn{display:inline-block;background:var(--ember-d);color:var(--warm);text-decoration:none;
  font-weight:600;font-size:16px;padding:16px 28px;border-radius:2px}
.btn:hover{background:var(--ember-dd)}
.btn.ghost{background:transparent;color:var(--t-1);border:1px solid var(--rule-2)}
.btn.ghost:hover{border-color:var(--ember);color:var(--ember)}
/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:40;background:rgba(42,26,41,.93);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--rule)}
.nav-in{max-width:1180px;margin:0 auto;padding:16px 6vw;display:flex;align-items:center;gap:26px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex:0 0 auto}
.brand svg{height:30px;width:auto;display:block}
.brand .wm{font-family:Fraunces,Georgia,serif;font-weight:700;font-size:19px;letter-spacing:-.01em;line-height:1}
.wm .p{color:var(--plum)} .wm .o{color:var(--ember)}
.nav-flag{display:inline-flex;align-items:center;gap:6px;margin-left:10px;padding-left:12px;white-space:nowrap;
  border-left:1px solid var(--rule);flex:0 0 auto}
.nav-flag svg{width:17px;height:17px;display:block}
.nav-flag>span{font-size:9px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--t-3);line-height:1.25}
@media(max-width:820px){.nav-flag>span{display:none}.nav-flag{margin-left:10px;padding-left:10px}}
.nav-links{display:flex;gap:19px;margin-left:auto;align-items:center;flex-wrap:nowrap}
.nav-links a{color:var(--t-2);text-decoration:none;font-size:var(--f-sm);font-weight:500;white-space:nowrap}
.nav-links a:hover,.nav-links a.here{color:var(--t-1)}
.nav-cta{background:var(--ember-d);color:var(--warm)!important;padding:10px 18px;
  border-radius:2px;font-weight:600!important}
.nav-cta:hover{background:var(--ember-dd)}
/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--rule)}