/* ==========================================================================
   JED-CONFRA GHANA LTD
   Design system: warm dark, softened.

   The brief was sexier and smoother, less bold, Silicon Valley corporate
   blended with Dubai gold trading. That resolves to four decisions, and every
   rule below follows from one of them:

     1. The canvas is espresso black, not blue black. Warmth everywhere.
     2. Weight comes out of the type and goes into the space around it.
        Display type is Cinzel 400 with wide tracking. Body is Montserrat 300.
     3. Structure is drawn with gold hairlines and glass, never with slabs.
     4. Photography sits under a gradient, never beside a caption. The images
        are atmosphere. Nothing on this site claims they are our premises,
        our staff or our events.

   Written for a strict Content-Security-Policy: no @import, no external URL,
   no inline style anywhere on the site.
   ========================================================================== */

/* ------------------------------------------------------------------ fonts */
@font-face{font-family:Cinzel;src:url(/assets/fonts/cinzel-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Cinzel;src:url(/assets/fonts/cinzel-latin-600-normal.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Montserrat;src:url(/assets/fonts/montserrat-latin-300-normal.woff2) format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:Montserrat;src:url(/assets/fonts/montserrat-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Montserrat;src:url(/assets/fonts/montserrat-latin-500-normal.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Montserrat;src:url(/assets/fonts/montserrat-latin-600-normal.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}

/* ----------------------------------------------------------------- tokens */
:root{
  /* canvas */
  --ink:#0B0906;
  --ink-2:#120D08;
  --ink-3:#1A130C;
  --veil:rgba(255,255,255,.035);
  --veil-2:rgba(255,255,255,.055);

  /* metal */
  --gold:#C9A227;
  --gold-soft:#D9B64A;
  --champagne:#F0DFAE;
  --deep-gold:#7E5C14;
  --rose:#B76E79;
  --rose-light:#E3B7AE;

  /* ink on canvas */
  --ivory:#EAE3D6;
  --text:#CFC7B8;
  --muted:#968D7E;
  --faint:#857C6D;

  /* lines */
  --hair:rgba(201,162,39,.22);
  --hair-soft:rgba(234,227,214,.10);

  /* gradients */
  --metal:linear-gradient(115deg,#7E5C14 0%,#C9A227 28%,#F0DFAE 48%,#C9A227 68%,#8A6516 100%);
  --rose-metal:linear-gradient(115deg,#8E4E57 0%,#B76E79 32%,#E3B7AE 52%,#B76E79 72%,#8E4E57 100%);
  --glass:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.012) 55%,rgba(255,255,255,0));

  /* rhythm */
  --shell:1240px;
  --gut:clamp(20px,5vw,48px);
  --sec:clamp(72px,10vw,136px);
  --r:18px;
  --r-s:10px;
  --arch:180px 180px var(--r) var(--r);

  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ------------------------------------------------------------------ reset */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;
  background:var(--ink);
  color:var(--text);
  font:300 clamp(15.5px,.42vw + 14.4px,17px)/1.75 Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.008em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,h5,p,figure,blockquote{margin:0}
:focus-visible{outline:2px solid var(--gold-soft);outline-offset:3px;border-radius:2px}

.skip{position:absolute;left:-9999px;top:0;z-index:999;background:var(--gold);color:#120D08;padding:12px 20px;border-radius:0 0 var(--r-s) 0;font-weight:500}
.skip:focus{left:0}

/* --------------------------------------------------------------- headings */
h1,h2,h3,.dsp{
  font-family:Cinzel,Georgia,serif;
  font-weight:400;
  color:var(--ivory);
  line-height:1.14;
  letter-spacing:.012em;
}
h1{font-size:clamp(34px,5.4vw,62px);line-height:1.08;letter-spacing:.004em}
h2{font-size:clamp(26px,3.3vw,40px)}
h3{font-size:clamp(19px,1.5vw,23px);line-height:1.3}
h4{font-family:Montserrat,sans-serif;font-weight:500;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--champagne);margin:0}

.eyebrow{
  display:inline-flex;align-items:center;gap:.7em;
  font-size:11px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;
  color:var(--gold-soft);margin:0 0 20px;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--metal);flex:none;opacity:.85}

.lede{font-size:clamp(17px,1.2vw,20px);line-height:1.68;color:var(--ivory);font-weight:300}
.sub{color:var(--muted)}
.gold{color:var(--champagne)}
strong,b{font-weight:500;color:var(--ivory)}

/* ----------------------------------------------------------------- layout */
.shell{width:100%;max-width:var(--shell);margin-inline:auto;padding-inline:var(--gut)}
.sec{padding-block:var(--sec);position:relative}
.sec--tight{padding-block:clamp(52px,7vw,88px)}
.sec--line{border-top:1px solid var(--hair-soft)}
.sec__head{max-width:62ch;margin-bottom:clamp(36px,4vw,56px)}
.sec__head p{margin-top:18px}

.grid{display:grid;gap:clamp(18px,2vw,28px)}
.grid>*{min-width:0}
@media (min-width:700px){.grid--2{grid-template-columns:repeat(2,1fr)}}
@media (min-width:860px){.grid--3{grid-template-columns:repeat(3,1fr)}}
@media (min-width:980px){.grid--4{grid-template-columns:repeat(4,1fr)}}

.split{display:grid;gap:clamp(28px,4vw,64px);align-items:center}
.split>*{min-width:0}
@media (min-width:900px){
  .split{grid-template-columns:1.08fr .92fr}
  .split--rev>:first-child{order:2}
}

.stack>*+*{margin-top:1.05em}
.narrow{max-width:72ch}

/* ------------------------------------------------------------- atmosphere */
/* A single warm glow behind the page so the black never reads flat. */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(60% 42% at 78% -6%,rgba(201,162,39,.085),transparent 70%),
    radial-gradient(48% 38% at 6% 12%,rgba(183,110,121,.055),transparent 72%),
    radial-gradient(70% 50% at 50% 108%,rgba(201,162,39,.05),transparent 70%);
}
.hdr,.drawer,main,.ftr{position:relative;z-index:1}

/* ----------------------------------------------------------------- header */
.hdr{
  position:sticky;top:0;z-index:60;
  transition:background .5s var(--ease),border-color .5s var(--ease),backdrop-filter .5s var(--ease);
  border-bottom:1px solid transparent;
}
.hdr.is-stuck{
  background:rgba(11,9,6,.78);
  border-bottom-color:var(--hair-soft);
  -webkit-backdrop-filter:saturate(150%) blur(18px);
  backdrop-filter:saturate(150%) blur(18px);
}
.hdr__in{
  max-width:var(--shell);margin-inline:auto;padding:16px var(--gut);
  display:flex;align-items:center;gap:clamp(14px,2.4vw,34px);
}
.brand{flex:none;display:block;line-height:0}
.brand img{width:clamp(126px,22vw,182px)}
.nav{display:none}
.hdr__cta{display:none}

@media (min-width:1120px){
  .nav{display:flex;align-items:center;gap:clamp(16px,1.9vw,30px);margin-left:auto}
  .nav a{
    position:relative;text-decoration:none;color:var(--text);
    font-size:12.5px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;
    padding:8px 0;transition:color .35s var(--ease);
  }
  .nav a::after{
    content:"";position:absolute;left:0;right:100%;bottom:2px;height:1px;
    background:var(--metal);transition:right .45s var(--ease);
  }
  .nav a:hover,.nav a[aria-current="page"]{color:var(--champagne)}
  .nav a:hover::after,.nav a[aria-current="page"]::after{right:0}
  .hdr__cta{display:inline-flex}
  .burger{display:none}
}

.burger{
  margin-left:auto;width:46px;height:46px;border:1px solid var(--hair);
  border-radius:50%;background:var(--veil);display:grid;place-content:center;gap:5px;
  cursor:pointer;padding:0;transition:border-color .35s var(--ease),background .35s var(--ease);
}
.burger span{display:block;width:17px;height:1px;background:var(--champagne);transition:transform .4s var(--ease),opacity .3s var(--ease)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
/* declared after the 1120px block above so it wins the cascade */
@media (min-width:1120px){.burger{display:none}}

/* ----------------------------------------------------------------- drawer */
.drawer{
  position:fixed;inset:0;z-index:55;
  background:linear-gradient(170deg,#100C07,#0B0906 60%);
  padding:104px var(--gut) 44px;
  display:flex;flex-direction:column;gap:2px;
  overflow-y:auto;
  opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .42s var(--ease),transform .42s var(--ease),visibility .42s;
}
.drawer.is-open{opacity:1;visibility:visible;transform:none}
body.nav-open{overflow:hidden}
.dnav{
  display:flex;align-items:baseline;gap:16px;text-decoration:none;
  padding:16px 2px;border-bottom:1px solid var(--hair-soft);
  font-family:Cinzel,serif;font-size:21px;color:var(--ivory);letter-spacing:.02em;
}
.dnav i{font-style:normal;font-family:Montserrat,sans-serif;font-size:10px;letter-spacing:.2em;color:var(--gold);opacity:.75}
.dnav[aria-current="page"]{color:var(--champagne)}
.drawer .btn{margin-top:28px;align-self:flex-start}
.drawer__foot{margin-top:auto;padding-top:34px;font-size:13.5px;color:var(--muted);line-height:2}
.drawer__foot a{color:var(--champagne);text-decoration:none}
@media (min-width:1120px){.drawer{display:none}}

/* --------------------------------------------------------------- buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.7em;
  padding:14px 30px;border-radius:999px;text-decoration:none;border:1px solid transparent;
  font-size:12.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  cursor:pointer;transition:transform .4s var(--ease),box-shadow .4s var(--ease),
             background .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease);
}
.btn--gold{
  background:var(--metal);color:#14100A;font-weight:600;
  box-shadow:0 1px 0 rgba(255,255,255,.28) inset,0 10px 34px -16px rgba(201,162,39,.85);
}
.btn--gold:hover{transform:translateY(-2px);box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 18px 44px -16px rgba(201,162,39,.95)}
.btn--ghost{border-color:var(--hair);color:var(--champagne);background:var(--veil)}
.btn--ghost:hover{border-color:var(--gold-soft);background:rgba(201,162,39,.09);transform:translateY(-2px)}
.btn--rose{background:var(--rose-metal);color:#1A0E10;font-weight:600}
.btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}

.tlink{
  display:inline-flex;align-items:center;gap:.6em;text-decoration:none;
  color:var(--champagne);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;
}
.tlink::after{content:"";width:18px;height:1px;background:var(--metal);transition:width .4s var(--ease)}
.tlink:hover::after{width:30px}

/* ------------------------------------------------------------------- hero */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(560px,88svh,880px);display:flex;align-items:flex-end}
.hero__media{position:absolute;inset:0;z-index:-2}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:62% 28%}
@media (min-width:900px){.hero__media img{object-position:center 30%}}
.hero__media::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(to top,var(--ink) 2%,rgba(11,9,6,.86) 26%,rgba(11,9,6,.42) 56%,rgba(11,9,6,.62) 100%),
    linear-gradient(to right,rgba(11,9,6,.88) 0%,rgba(11,9,6,.42) 46%,rgba(11,9,6,.18) 100%);
}
.hero__in{width:100%;max-width:var(--shell);margin-inline:auto;padding:0 var(--gut) clamp(60px,8vw,104px);position:relative}
.hero__in h1{max-width:20ch}
.hero__in .lede,.hero__in p{max-width:58ch}
.hero__in .btns{max-width:none}
.hero h1 .lg{display:block;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lede{margin-top:24px}
.hero--sm{min-height:clamp(380px,54svh,560px)}
.hero--sm h1{max-width:20ch}

/* scroll cue */
.cue{display:none}

/* ------------------------------------------------------------------ bands */
/* Full-bleed photographic section. Same rule as the hero: gradient over it,
   text on top of it, no caption anywhere near it. */
.band{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(84px,11vw,150px)}
.band__media{position:absolute;inset:0;z-index:-2}
.band__media img{width:100%;height:100%;object-fit:cover}
.band__media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(11,9,6,.95) 0%,rgba(11,9,6,.80) 42%,rgba(11,9,6,.46) 74%,rgba(11,9,6,.66) 100%);
}
.band::before,.band::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--hair-soft)}
.band::before{top:0}
.band::after{bottom:0}
.band__in{max-width:60ch}

/* ------------------------------------------------------------------ cards */
.card{
  position:relative;padding:clamp(24px,2.4vw,34px);border-radius:var(--r);
  background:var(--glass),rgba(255,255,255,.012);
  border:1px solid var(--hair-soft);
  transition:border-color .5s var(--ease),transform .5s var(--ease),background .5s var(--ease);
  overflow:hidden;
}
.card::before{
  content:"";position:absolute;left:0;top:0;height:1px;width:100%;
  background:linear-gradient(90deg,transparent,rgba(201,162,39,.55),transparent);
  opacity:0;transition:opacity .5s var(--ease);
}
.card:hover{border-color:var(--hair);transform:translateY(-3px)}
.card:hover::before{opacity:1}
.card h3{margin-bottom:12px}
.card p{font-size:15.5px;color:var(--text)}
.card__n{
  display:block;font-family:Cinzel,serif;font-size:13px;letter-spacing:.2em;
  color:var(--gold);margin-bottom:16px;opacity:.85;
}
.card--quiet{background:rgba(255,255,255,.015);border-style:dashed}

.panel{
  padding:clamp(26px,3vw,44px);border-radius:var(--r);
  background:var(--glass),rgba(255,255,255,.014);
  border:1px solid var(--hair-soft);
}
.panel--gold{border-color:var(--hair);background:linear-gradient(160deg,rgba(201,162,39,.09),rgba(201,162,39,.02) 60%,transparent)}
.panel--rose{border-color:rgba(183,110,121,.26);background:linear-gradient(160deg,rgba(183,110,121,.10),rgba(183,110,121,.02) 60%,transparent)}

/* ------------------------------------------------------------------ media */
/* The Dubai arch, used only on portrait tiles. */
.tile{position:relative;border-radius:var(--arch);overflow:hidden;border:1px solid var(--hair-soft);isolation:isolate}
.tile img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5}
.tile::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(11,9,6,.72),transparent 52%),
             linear-gradient(120deg,rgba(201,162,39,.12),transparent 55%);
}
.tile--flat{border-radius:var(--r)}
.tiles{display:grid;gap:clamp(14px,1.6vw,22px)}
@media (min-width:640px){.tiles--2{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.tiles--3{grid-template-columns:repeat(3,1fr)}}
.tiles--offset>*:nth-child(even){transform:translateY(clamp(16px,3vw,44px))}

/* --------------------------------------------------------------- listings */
.facts{display:grid;gap:1px;background:var(--hair-soft);border:1px solid var(--hair-soft);border-radius:var(--r);overflow:hidden}
@media (min-width:760px){.facts--3{grid-template-columns:repeat(3,1fr)}}
.facts>div{background:var(--ink-2);padding:clamp(22px,2.4vw,32px)}
.facts dt{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:12px}
.facts dd{margin:0;font-family:Cinzel,serif;font-size:clamp(19px,1.7vw,25px);color:var(--ivory);line-height:1.25}
.facts small{display:block;margin-top:10px;font-family:Montserrat,sans-serif;font-size:13px;color:var(--muted);line-height:1.6}

.steps{counter-reset:s;display:grid;gap:clamp(16px,2vw,24px)}
.steps li{counter-increment:s;position:relative;padding-left:64px}
.steps li::before{
  content:counter(s,decimal-leading-zero);position:absolute;left:0;top:-2px;
  width:44px;height:44px;border-radius:50%;border:1px solid var(--hair);
  display:grid;place-content:center;
  font-family:Cinzel,serif;font-size:13px;color:var(--gold);
  background:rgba(201,162,39,.055);
}
.steps h3{font-size:18px;margin-bottom:7px}
.steps p{font-size:15.5px;color:var(--muted)}

.checks li,.crosses li{position:relative;padding-left:32px;margin-bottom:14px;font-size:15.5px}
.checks li::before,.crosses li::before{
  position:absolute;left:0;top:.05em;width:19px;height:19px;border-radius:50%;
  display:grid;place-content:center;font-size:11px;line-height:1;
}
.checks li::before{content:"\2713";background:rgba(201,162,39,.14);color:var(--champagne);border:1px solid var(--hair)}
.crosses li::before{content:"\00d7";background:rgba(183,110,121,.14);color:var(--rose-light);border:1px solid rgba(183,110,121,.3)}

.kv{display:grid;gap:0;border-top:1px solid var(--hair-soft)}
.kv>div{display:grid;gap:4px;padding:18px 0;border-bottom:1px solid var(--hair-soft)}
@media (min-width:620px){.kv>div{grid-template-columns:230px 1fr;gap:24px;align-items:baseline}}
.kv dt{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft)}
.kv dd{margin:0;color:var(--ivory);font-size:15.5px}

.pill{
  display:inline-flex;align-items:center;gap:.6em;padding:7px 15px;border-radius:999px;
  border:1px solid var(--hair);background:rgba(201,162,39,.07);
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--champagne);
}
.pill--rose{border-color:rgba(183,110,121,.32);background:rgba(183,110,121,.09);color:var(--rose-light)}
.pill--quiet{border-color:var(--hair-soft);background:var(--veil);color:var(--muted)}
.pills{display:flex;flex-wrap:wrap;gap:10px}

/* a thin ruled divider with a diamond at its centre */
.seal-rule{display:flex;align-items:center;gap:16px;margin-block:clamp(40px,5vw,64px);opacity:.75}
.seal-rule::before,.seal-rule::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--hair),transparent)}
.seal-rule i{width:7px;height:7px;transform:rotate(45deg);background:var(--metal);flex:none}

/* ----------------------------------------------------------------- people */
.people{display:grid;gap:clamp(18px,2vw,26px)}
@media (min-width:700px){.people{grid-template-columns:repeat(2,1fr)}}
.person{padding:clamp(24px,2.6vw,34px);border-radius:var(--r);border:1px solid var(--hair-soft);background:var(--glass),rgba(255,255,255,.012)}
.person .mono{
  width:52px;height:52px;border-radius:50%;display:grid;place-content:center;margin-bottom:20px;
  background:var(--metal);color:#16110A;font-family:Cinzel,serif;font-size:16px;letter-spacing:.06em;
}
.person h3{font-size:21px;margin-bottom:6px}
.person .role{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft)}
.person p{margin-top:14px;font-size:15px;color:var(--muted)}

/* -------------------------------------------------------------------- map */
.gh-map{position:relative;width:100%;max-width:620px;margin-inline:auto}
.gh-map img{width:100%;opacity:.92}
.mk{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:9px;white-space:nowrap}
.mk::before{
  content:"";width:9px;height:9px;border-radius:50%;flex:none;
  background:var(--gold);box-shadow:0 0 0 4px rgba(201,162,39,.16),0 0 18px 2px rgba(201,162,39,.5);
}
.mk span{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--champagne)}
.mk--bono          {left:17.11%;top:55.43%}
.mk--ahafo         {left:14.40%;top:67.80%}
.mk--eastern       {left:62.66%;top:75.56%}
.mk--western-north {left:16.00%;top:81.00%}
.mk--western       {left:24.58%;top:90.89%}
@media (max-width:560px){.mk span{font-size:9px;letter-spacing:.1em}}

/* ------------------------------------------------------------------ forms */
.form{display:grid;gap:20px}
.field{display:grid;gap:9px}
.field label{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-soft)}
.field .hint{font-size:13px;color:var(--faint);letter-spacing:0;text-transform:none}
.field input,.field select,.field textarea{
  width:100%;padding:14px 16px;border-radius:var(--r-s);
  background:rgba(255,255,255,.025);border:1px solid var(--hair-soft);
  color:var(--ivory);font-weight:300;
  transition:border-color .35s var(--ease),background .35s var(--ease);
}
.field textarea{min-height:150px;resize:vertical}
.field input:hover,.field textarea:hover,.field select:hover{border-color:var(--hair)}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--gold-soft);background:rgba(255,255,255,.04);outline:none}
.field input:user-invalid,.field textarea:user-invalid,.field select:user-invalid{border-color:rgba(183,110,121,.6)}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px;background-size:6px 6px;background-repeat:no-repeat}
.field input[type=file]{padding:11px 14px;font-size:14px;color:var(--muted)}
.field input[type=file]::file-selector-button{
  margin-right:14px;padding:9px 16px;border-radius:999px;border:1px solid var(--hair);
  background:rgba(201,162,39,.09);color:var(--champagne);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;cursor:pointer;
}
@media (min-width:680px){.form--2{grid-template-columns:repeat(2,1fr)}.form--2 .field--wide{grid-column:1/-1}}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fnote{display:none;padding:13px 16px;border-radius:var(--r-s);border:1px solid rgba(183,110,121,.4);background:rgba(183,110,121,.1);color:var(--rose-light);font-size:14.5px}
.fnote.is-on{display:block}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--muted)}
.consent input{width:18px;height:18px;flex:none;margin-top:3px;accent-color:var(--gold)}
.cap{margin-top:4px}

/* ------------------------------------------------------------------ notes */
.note{
  padding:clamp(20px,2.2vw,28px);border-radius:var(--r);
  border:1px solid var(--hair-soft);border-left:2px solid var(--gold);
  background:rgba(201,162,39,.045);font-size:15px;color:var(--text);
}
.note--rose{border-left-color:var(--rose);background:rgba(183,110,121,.06)}
.note h3{font-size:17px;margin-bottom:10px}
.note p+p{margin-top:.9em}

/* ----------------------------------------------------------------- footer */
.ftr{border-top:1px solid var(--hair-soft);padding-block:clamp(56px,7vw,88px) 34px;background:linear-gradient(to bottom,transparent,rgba(0,0,0,.34))}
.ftr__grid{display:grid;gap:clamp(34px,4vw,54px)}
@media (min-width:760px){.ftr__grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1060px){.ftr__grid{grid-template-columns:1.6fr .8fr .8fr 1.3fr}}
.ftr__brand img{width:186px;margin-bottom:22px}
.ftr__brand p{font-size:14.5px;color:var(--muted);max-width:44ch}
.ftr__reg{margin-top:14px;font-size:13px;letter-spacing:.04em}
.ftr h4{margin-bottom:18px}
.ftr__links li{margin-bottom:11px}
.ftr__links a{text-decoration:none;font-size:14.5px;color:var(--text);transition:color .3s var(--ease)}
.ftr__links a:hover{color:var(--champagne)}
.ftr__c{display:grid;gap:16px;font-size:14px;color:var(--muted);line-height:1.75}
.ftr__c b{display:block;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft);font-weight:500;margin-bottom:4px}
.ftr__c a{color:var(--text);text-decoration:none}
.ftr__c a:hover{color:var(--champagne)}
.ftr__base{
  margin-top:clamp(40px,5vw,60px);padding-top:26px;border-top:1px solid var(--hair-soft);
  display:flex;flex-wrap:wrap;gap:16px 26px;justify-content:space-between;
  font-size:12.5px;color:var(--faint);
}
.ftr__base nav{display:flex;flex-wrap:wrap;gap:20px}
.ftr__base a{text-decoration:none;color:var(--faint)}
.ftr__base a:hover{color:var(--champagne)}

/* ----------------------------------------------------------------- reveal */
.rv{opacity:0;transform:translateY(18px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv--d1{transition-delay:.08s}
.rv--d2{transition-delay:.16s}
.rv--d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  .btn,.card,.tlink::after{transition:none}
}

/* ------------------------------------------------------------ typography */
.prose{max-width:74ch}
.prose h2{margin-top:clamp(44px,5vw,64px);margin-bottom:16px}
.prose h3{margin-top:32px;margin-bottom:10px}
.prose p{margin-bottom:1.05em}
.prose ul{margin:0 0 1.2em}
.prose ul li{position:relative;padding-left:24px;margin-bottom:10px}
.prose ul li::before{content:"";position:absolute;left:4px;top:.72em;width:5px;height:5px;transform:rotate(45deg);background:var(--gold);opacity:.8}
.prose ol{counter-reset:p;margin:0 0 1.2em}
.prose ol li{counter-increment:p;position:relative;padding-left:32px;margin-bottom:10px}
.prose ol li::before{content:counter(p) ".";position:absolute;left:0;color:var(--gold);font-size:13px}
.prose a{color:var(--champagne);text-underline-offset:4px;text-decoration-color:var(--hair)}
.prose small{color:var(--faint)}

table{width:100%;border-collapse:collapse;font-size:14.5px}
th,td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--hair-soft);vertical-align:top}
th{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft);font-weight:500}
.tw{overflow-x:auto;border:1px solid var(--hair-soft);border-radius:var(--r)}

/* -------------------------------------------------------------- accordion */
.acc{border-top:1px solid var(--hair-soft)}
.acc details{border-bottom:1px solid var(--hair-soft)}
.acc summary{
  list-style:none;cursor:pointer;padding:20px 44px 20px 0;position:relative;
  font-family:Cinzel,serif;font-size:clamp(16px,1.2vw,18.5px);color:var(--ivory);
}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{
  content:"";position:absolute;right:8px;top:50%;width:9px;height:9px;
  border-right:1px solid var(--gold);border-bottom:1px solid var(--gold);
  transform:translateY(-70%) rotate(45deg);transition:transform .35s var(--ease);
}
.acc details[open] summary::after{transform:translateY(-20%) rotate(-135deg)}
.acc summary:hover{color:var(--champagne)}
.acc__body{padding:0 0 24px;font-size:15.5px;color:var(--text);max-width:80ch}
.acc__body a{color:var(--champagne);text-underline-offset:4px}
.acc__body b,.acc__body strong{color:var(--ivory)}
.fineprint{margin-top:28px;font-size:13px;color:var(--faint);max-width:70ch}
