/* The Grounded Leader — design system
   Ported 27 August 2026 from the Claude Design pass onto the current copy.
   Values taken verbatim from the design: photographic heroes, centred type,
   the black/sandstone section rhythm, gold keylines. */

@font-face{font-family:'Canela Deck';src:url('/fonts/CanelaDeck-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Canela Deck';src:url('/fonts/CanelaDeck-RegularItalic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap;}
@font-face{font-family:'Canela Deck';src:url('/fonts/CanelaDeck-MediumItalic.otf') format('opentype');font-weight:500;font-style:italic;font-display:swap;}
@font-face{font-family:'Figtree';src:url('/fonts/Figtree-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Figtree';src:url('/fonts/Figtree-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap;}

:root{
  --sand:#e5e1df; --gold:#917451; --amber:#875c29; --bronze:#7d440e; --ochre:#69370e;
  --black:#000000;
  --serif:'Canela Deck',Georgia,'Times New Roman',serif;
  --sans:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;

  --t-body:clamp(1.0625rem,1rem + 0.3vw,1.1875rem);
  --t-small:clamp(0.75rem,0.72rem + 0.2vw,0.8125rem);
  --t-h1:clamp(2.125rem,1.5rem + 2.6vw,3.75rem);
  --t-h2:clamp(1.625rem,1.3rem + 1.5vw,2.375rem);
  --t-h3:clamp(1.1875rem,1.1rem + 0.7vw,1.5rem);
  --t-quote:clamp(1.375rem,1.15rem + 1.3vw,2.125rem);

  --pad-y:clamp(4.5rem,3.5rem + 5vw,8.5rem);
  --pad-x:clamp(1.5rem,5vw,4rem);
  --hero-top:clamp(7rem,5rem + 7vw,11rem);
  --hero-bot:clamp(6rem,4rem + 6vw,9rem);
  --w:900px; --w-narrow:660px;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--black);color:var(--sand);
  font-family:var(--sans);font-size:var(--t-body);line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;text-wrap:pretty;
}
img{display:block;max-width:100%;}
h1,h2,h3{margin:0;font-weight:400;font-family:var(--serif);text-wrap:balance;}
p{margin:0;}
*:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}

/* ---------- sections ---------- */
.s{padding:var(--pad-y) var(--pad-x);}
.s--dark{background:var(--black);color:var(--sand);}
.s--light{background:var(--sand);color:var(--black);}
.in{max-width:var(--w);margin:0 auto;}
.in--narrow{max-width:var(--w-narrow);}
.centred{text-align:center;}
.stack{display:flex;flex-direction:column;gap:1.25rem;}
.stack--tight{gap:0.9rem;}
.stack--loose{gap:2rem;}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--black);color:var(--sand);
  padding:var(--hero-top) var(--pad-x) var(--hero-bot);overflow:hidden;}
.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero__veil{position:absolute;inset:0;background:rgba(0,0,0,0.66);}
.hero__in{position:relative;z-index:1;max-width:var(--w);margin:0 auto;}
.hero h1{font-size:var(--t-h1);line-height:1.1;color:var(--gold);margin:0 0 1.75rem;}
.hero--centred .hero__in{text-align:center;}
.hero--centred h1{max-width:19ch;margin-left:auto;margin-right:auto;}
.hero__sub{font-family:var(--serif);font-size:var(--t-h3);line-height:1.4;color:var(--sand);max-width:44ch;}
.hero--centred .hero__sub{margin-left:auto;margin-right:auto;}

.eyebrow{font-family:var(--sans);font-weight:500;font-size:var(--t-small);
  text-transform:uppercase;letter-spacing:0.12em;color:var(--gold);margin:0 0 1.5rem;}
.s--light .eyebrow{color:var(--amber);}

/* inline hero list: relationships · business · life */
.inline-list{list-style:none;margin:0 0 2.5rem;padding:0;
  display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:0.35rem 1rem;}
.inline-list li{font-family:var(--serif);font-size:var(--t-h3);line-height:1.35;color:var(--sand);}
.inline-list .sep{color:var(--gold);}

/* ---------- type ---------- */
h2{font-size:var(--t-h2);line-height:1.2;color:var(--gold);}
.s--light h2{color:var(--black);}
.lead{font-family:var(--serif);font-size:var(--t-h3);line-height:1.5;}
.body{max-width:62ch;}
.centred .body{margin-left:auto;margin-right:auto;}
.quote{font-family:var(--serif);font-style:italic;font-size:var(--t-quote);
  line-height:1.32;color:var(--gold);max-width:26ch;margin:0;}
.centred .quote{margin-left:auto;margin-right:auto;}
.note{font-family:var(--sans);font-size:var(--t-small);color:rgba(229,225,223,0.62);}
.s--light .note{color:rgba(0,0,0,0.6);}
hr.key{border:0;border-top:1px solid var(--gold);opacity:.55;margin:2.5rem 0;}

/* ---------- button ---------- */
.btn{display:inline-block;font-family:var(--serif);font-size:var(--t-body);
  background:var(--amber);color:var(--sand);padding:0.95rem 2.25rem;
  text-decoration:none;border:1px solid var(--amber);border-radius:0;min-height:44px;
  transition:background-color .25s ease,border-color .25s ease;cursor:pointer;}
.btn:hover,.btn:focus-visible{background:var(--bronze);border-color:var(--bronze);color:var(--sand);}
/* quiet secondary: outline only, for a link that must not compete with the CTA */
.btn--quiet{background:transparent;border-color:var(--gold);}
.s--light .btn--quiet{color:var(--black);}
.s--dark .btn--quiet{color:var(--gold);}
.btn--quiet:hover,.btn--quiet:focus-visible{background:transparent;border-color:var(--ochre);color:var(--ochre);}
.s--dark .btn--quiet:hover,.s--dark .btn--quiet:focus-visible{border-color:var(--sand);color:var(--sand);}

/* ---------- three-column groups ---------- */
.cols3{display:grid;grid-template-columns:1fr;gap:2.5rem;margin-top:2rem;}
@media(min-width:760px){.cols3{grid-template-columns:repeat(3,1fr);gap:clamp(2rem,4vw,3.5rem);}}
.cols3 h3{font-size:var(--t-h3);line-height:1.2;color:var(--gold);margin-bottom:0.9rem;}
.s--light .cols3 h3{color:var(--amber);}
.cols3 p{font-size:0.95rem;line-height:1.6;}

/* ---------- tiles (who this is for) ---------- */
.cols3--tiles{margin-top:2.5rem;}
@media(min-width:760px){.cols3--tiles{gap:1.5rem;}}
.cols3--tiles>div{
  background:rgba(255,255,255,0.045);
  border:1px solid rgba(145,116,81,0.32);
  border-top:2px solid var(--gold);
  padding:clamp(1.75rem,1.5rem + 1vw,2.5rem);
  display:flex;flex-direction:column;
  transition:background-color .25s ease,border-color .25s ease;
}
.cols3--tiles>div:hover{
  background:rgba(255,255,255,0.07);
  border-color:rgba(145,116,81,0.6);
  border-top-color:var(--amber);
}
.s--light .cols3--tiles>div{background:rgba(0,0,0,0.035);border-color:rgba(145,116,81,0.35);}
.cols3--tiles h3{margin-bottom:1rem;}
.cols3--tiles p{margin:0;}

/* ---------- two-column ---------- */
.cols2{display:grid;grid-template-columns:1fr;gap:2.5rem;}
@media(min-width:760px){.cols2{grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,3.5rem);}}

/* ---------- offers ---------- */
.offers{margin-top:2rem;}
.offer{display:grid;grid-template-columns:1fr;gap:0.6rem;
  padding:2rem 0;border-top:1px solid rgba(145,116,81,0.45);}
.offer:last-child{border-bottom:1px solid rgba(145,116,81,0.45);}
.offer h3{font-size:var(--t-h3);line-height:1.2;color:var(--gold);}
.offer p{max-width:56ch;}
.offer .terms{font-family:var(--sans);font-weight:500;font-size:var(--t-small);
  text-transform:uppercase;letter-spacing:0.12em;color:var(--amber);margin-top:0.75rem;}
@media(min-width:720px){
  .offer{grid-template-columns:9rem 1fr;column-gap:2.5rem;align-items:baseline;}
}

/* ---------- testimonials ---------- */
.said{font-family:var(--serif);font-style:italic;font-size:var(--t-h3);
  line-height:1.45;margin:0 0 1rem;}
cite{font-family:var(--sans);font-weight:500;font-size:var(--t-small);
  text-transform:uppercase;letter-spacing:0.12em;color:var(--gold);font-style:normal;}
.s--light cite{color:var(--amber);}

/* ---------- video facade ---------- */
.video{position:relative;cursor:pointer;overflow:hidden;aspect-ratio:16/9;width:100%;
  border:1px solid rgba(145,116,81,0.45);background:rgba(255,255,255,0.03);
  display:flex;align-items:center;justify-content:center;margin-top:2.5rem;}
.video img,.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover;}
.video .play{position:relative;z-index:2;width:0;height:0;
  border-left:1.6rem solid var(--gold);border-top:1rem solid transparent;border-bottom:1rem solid transparent;
  filter:drop-shadow(0 0 1.5rem rgba(0,0,0,0.6));transition:transform .25s ease;}
.video:hover .play{transform:scale(1.12);}
.video.playing .play{display:none;}

/* ---------- media rows (image beside text) ---------- */
.media{display:grid;grid-template-columns:1fr;gap:2rem;align-items:start;}
@media(min-width:820px){
  .media{grid-template-columns:0.85fr 1fr;gap:clamp(2rem,5vw,4rem);}
  .media--flip{grid-template-columns:1fr 0.85fr;}
  .media--flip .media__img{order:2;}
}
.media__img img{width:100%;height:auto;}

/* ---------- forms ---------- */
form.tgl{display:flex;flex-direction:column;gap:1.25rem;margin-top:2rem;max-width:34rem;}
form.tgl label{font-family:var(--sans);font-weight:500;font-size:var(--t-small);
  text-transform:uppercase;letter-spacing:0.12em;color:var(--gold);
  display:flex;flex-direction:column;gap:0.5rem;}
.s--light form.tgl label{color:var(--amber);}
form.tgl input,form.tgl textarea{font-family:var(--sans);font-size:var(--t-body);
  background:rgba(255,255,255,0.05);color:var(--sand);
  border:1px solid rgba(145,116,81,0.5);padding:0.75rem 0.9rem;border-radius:0;width:100%;}
.s--light form.tgl input,.s--light form.tgl textarea{background:rgba(0,0,0,0.04);color:var(--black);}
form.tgl textarea{min-height:7rem;resize:vertical;line-height:1.5;}
form.tgl button{align-self:flex-start;}
.hp{position:absolute;left:-9999px;}

/* ---------- shape list (the Quest) ---------- */
.shape{list-style:none;margin:2rem 0 0;padding:0;}
.shape li{display:grid;grid-template-columns:1fr;gap:0.4rem;
  padding:1.5rem 0;border-top:1px solid rgba(145,116,81,0.45);}
.shape li:last-child{border-bottom:1px solid rgba(145,116,81,0.45);}
.shape b{font-family:var(--sans);font-weight:500;font-size:var(--t-small);
  text-transform:uppercase;letter-spacing:0.12em;color:var(--gold);}
.s--light .shape b{color:var(--amber);}
@media(min-width:720px){
  .shape li{grid-template-columns:9rem 1fr;column-gap:2.5rem;align-items:baseline;}
}

/* ---------- Being (no box: keyline, space and type) ---------- */
.being{
  border-top:1px solid var(--gold);
  padding-top:clamp(2.5rem,2rem + 2vw,3.5rem);
  margin-top:clamp(3.5rem,3rem + 3vw,5.5rem);
}
.s--light .being .eyebrow{color:var(--amber);margin-bottom:1.5rem;}
.being__lead{font-family:var(--serif);font-size:var(--t-h2);line-height:1.15;
  color:var(--ochre);margin:0 0 1.75rem;max-width:18ch;}
.being .body{max-width:54ch;margin:0;}
.being__frag{font-family:var(--serif);font-style:italic;font-size:var(--t-h3);
  line-height:1.4;margin:1.5rem 0 0;max-width:40ch;}
.being .note{margin-top:2rem;max-width:54ch;}

/* offers sitting on black */
.s--dark .offer .terms{color:var(--gold);}

/* the capacity questions inside .shape */
.shape em{font-family:var(--serif);font-style:italic;}
.s--light .shape em{color:var(--amber);}
.s--dark .shape em{color:var(--gold);}
.shape span{display:block;max-width:62ch;}

/* plain bulleted list (the Quest "is this you") */
ul.plain{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.9rem;}
ul.plain li{position:relative;padding-left:1.35rem;max-width:46ch;}
ul.plain li::before{content:"";position:absolute;left:0;top:.72em;width:.4rem;height:1px;background:var(--gold);}
.s--light ul.plain li::before{background:var(--amber);}

.placeholder{border:1px solid rgba(145,116,81,0.45);aspect-ratio:16/10;
  display:flex;align-items:center;justify-content:center;text-align:center;padding:2rem;
  font-family:var(--sans);font-size:var(--t-small);text-transform:uppercase;
  letter-spacing:0.12em;color:var(--gold);}

/* ============================================================
   HERO PASS — 3 September 2026
   Phase 1 alignment and scale, Phase 2 veil and rag,
   Phase 3 motion. Hero and nav only.
   ============================================================ */

/* nav scale and alignment live in js/chrome.js, which injects after this file */

/* --- 1c. optical centring: the fixed nav was eating the top gap,
         leaving the block sitting low with dead space beneath --- */
.hero--centred{
  min-height:min(88vh,920px);
  display:flex;
  align-items:center;
  padding-top:calc(var(--hero-top) * 0.72);
  padding-bottom:calc(var(--hero-bot) * 0.72);
}
.hero--centred .hero__in{width:100%;}

/* --- 1d. the separators were wrapping as flex items and stranding
         a dangling middot at the end of line one on mobile --- */
@media(max-width:620px){
  .inline-list{flex-direction:column;align-items:center;text-align:center;gap:.6rem;}
  .inline-list li{width:100%;}
  .inline-list .sep{display:none;}
}

/* --- 2a. veil: was a flat 66% wash. Now heavier top and bottom so the
         photo breathes mid-frame and the type keeps its contrast --- */
.hero__veil{
  background:linear-gradient(to bottom,
    rgba(0,0,0,0.78) 0%,
    rgba(0,0,0,0.58) 42%,
    rgba(0,0,0,0.66) 72%,
    rgba(0,0,0,0.84) 100%);
}

/* --- 2b. tighter measure so the three lines break deliberately --- */
.hero--centred h1{max-width:17ch;}

/* --- 3a. the button had no motion at all --- */
.btn{transition:background-color .25s ease,border-color .25s ease,transform .25s ease;}
.btn:hover,.btn:focus-visible{transform:translateY(-2px);}

/* --- 3b. one slow entrance, staggered. Nothing bounces. --- */
@keyframes tglRise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.hero--centred .eyebrow{animation:tglRise .7s .05s both cubic-bezier(.22,.61,.36,1);}
.hero--centred h1{animation:tglRise .9s .18s both cubic-bezier(.22,.61,.36,1);}
.hero--centred .inline-list{animation:tglRise .9s .36s both cubic-bezier(.22,.61,.36,1);}
.hero--centred .hero__sub{animation:tglRise .9s .36s both cubic-bezier(.22,.61,.36,1);}
.hero--centred .btn{animation:tglRise .9s .54s both cubic-bezier(.22,.61,.36,1);}

/* ---------- gold gradientscapes behind the dark sections ---------- */
/* The source images are already near-black, so no scrim by default.
   Anything with a strong bloom gets a light one, per variant. */
.s--dark{
  background-color:var(--black);
  background-image:url('/img/grad-ember.webp');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.s--dark.g-hearth{background-image:url('/img/grad-hearth.webp');}
.s--dark.g-drift{background-image:url('/img/grad-drift.webp');}
.s--dark.g-rise{
  background-image:linear-gradient(rgba(0,0,0,0.42),rgba(0,0,0,0.42)),url('/img/grad-rise.webp');
}
.s--dark.g-none{background-image:none;}

/* ---------- full-bleed media band (sits between sections, no colour of its own) ---------- */
.band{position:relative;width:100%;overflow:hidden;background:var(--black);line-height:0;}
.band video,.band img{display:block;width:100%;height:clamp(16rem,42vw,32rem);object-fit:cover;}
.band__cap{position:absolute;left:0;right:0;bottom:0;padding:1.25rem clamp(1.5rem,5vw,4rem);
  background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,0));
  font-family:var(--sans);font-size:var(--t-small);letter-spacing:.12em;text-transform:uppercase;
  color:rgba(229,225,223,.72);line-height:1.6;}

@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important;}}

/* ---------- the declarations (manifesto: "Who I'm being") ---------- */
/* Max's own lines. No markers, no emphasis, no trimming. Space carries them. */
.declare{
  list-style:none;margin:2.5rem 0 0;padding:0;
  display:flex;flex-direction:column;gap:1.5rem;
  border-top:1px solid var(--gold);padding-top:2.5rem;
}
.declare li{
  font-family:var(--serif);font-size:var(--t-h3);line-height:1.35;
  max-width:42ch;margin:0;
}
.s--dark .declare li{color:var(--sand);}
.s--light .declare li{color:var(--black);}


/* ---------- contrast corrections. Signed 3 September 2026. ----------
   Measured in a browser, not guessed:
     gold   #917451 on sand #e5e1df = 3.35:1   (fails 4.5:1 under 24px, passes 3:1 above it)
     amber  #875c29 on sand         = 4.4996:1 (fails 4.5:1 by a hair, both directions)
     bronze #7d440e on sand         = 5.98:1   PASS
     ochre  #69370e on sand         = 7.51:1   PASS
     gold   #917451 on black        = 4.82:1   PASS — gold is untouched on dark
   Bronze and ochre are already in the brand board. No new colour enters the palette.
   This block is deliberately last so it wins on equal specificity. Fold it into the
   rules above when the two stylesheets become one. */

/* quotes on light: this was being patched inline on each page. Now it is systemic. */
.s--light .quote{color:var(--ochre);}

/* small text on light: amber 4.4996 -> bronze 5.98 */
.s--light .eyebrow,
.s--light .being .eyebrow,
.s--light cite,
.s--light form.tgl label,
.s--light .shape b,
.s--light .shape em,
.s--light .cols3 h3,
.s--light .offer .terms{color:var(--bronze);}
.s--light ul.plain li::before{background:var(--bronze);}

/* the button: sand on amber 4.4996 -> sand on bronze 5.98, hover deepens to ochre */
.btn{background:var(--bronze);border-color:var(--bronze);}
.btn:hover,.btn:focus-visible{background:var(--ochre);border-color:var(--ochre);color:var(--sand);}
/* re-assert the quiet variant, which must stay outline-only after the rule above */
.btn--quiet{background:transparent;border-color:var(--gold);}
.s--light .btn--quiet{border-color:var(--bronze);color:var(--black);}
.s--dark .btn--quiet{color:var(--gold);}
.btn--quiet:hover,.btn--quiet:focus-visible{background:transparent;border-color:var(--ochre);color:var(--ochre);}
.s--dark .btn--quiet:hover,.s--dark .btn--quiet:focus-visible{border-color:var(--sand);color:var(--sand);}

/* ---------- measure. 3 September 2026. ----------
   Measured: .body at 62ch rendered ~69 real characters a line, because the ch unit
   is the width of "0", which is narrower than the average lowercase letter in Figtree.
   Dyson & Haselgrove: 55 characters comprehends better than 100. WCAG AAA ceiling is 80.
   Measured in Figtree at 19px: 1ch = 12.18px, average character = 9.58px, so real
   characters = ch x 1.27. 47ch renders ~60 real characters. The .note rule is here
   because one footnote on the Quest page ran to 101 characters with no width limit. */
.body,
.shape span{max-width:47ch;}
.note{max-width:52ch;}
.offer p{max-width:47ch;}
.lead{max-width:40ch;}

/* ---------- FAQ accordion ----------
   Class names match the toggle already in js/site.js (.faq-question / .faq-item.is-open),
   so the behaviour is unchanged. Added 3 September 2026 when sessions.html moved onto
   this stylesheet. */
.faq{margin-top:2rem;}
.faq-item{border-top:1px solid rgba(145,116,81,0.45);}
.faq-item:last-child{border-bottom:1px solid rgba(145,116,81,0.45);}
.faq-question{display:flex;width:100%;justify-content:space-between;align-items:center;gap:1.5rem;
  background:none;border:0;padding:1.35rem 0;cursor:pointer;text-align:left;min-height:44px;
  font-family:var(--serif);font-size:var(--t-h3);line-height:1.3;color:inherit;}
.s--dark .faq-question{color:var(--gold);}
.s--light .faq-question{color:var(--black);}
.faq-icon{flex:0 0 auto;width:14px;height:14px;position:relative;}
.faq-icon::before,.faq-icon::after{content:"";position:absolute;background:currentColor;}
.faq-icon::before{left:0;top:6.25px;width:14px;height:1.5px;}
.faq-icon::after{left:6.25px;top:0;width:1.5px;height:14px;transition:transform .25s ease;}
.faq-item.is-open .faq-icon::after{transform:scaleY(0);}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.faq-item.is-open .faq-answer{max-height:44rem;}
.faq-answer__inner{padding:0 0 1.35rem;max-width:54ch;}
@media(prefers-reduced-motion:reduce){
  .faq-answer,.faq-icon::after{transition:none;}
}

/* ---------- price row (one offer, one number) ---------- */
.price{display:grid;grid-template-columns:1fr;gap:0.5rem;align-items:baseline;
  padding:2rem 0;border-top:1px solid rgba(145,116,81,0.45);
  border-bottom:1px solid rgba(145,116,81,0.45);margin-top:2rem;}
.price h3{font-size:var(--t-h3);line-height:1.2;color:var(--gold);}
.s--light .price h3{color:var(--black);}
.price .amount{font-family:var(--serif);font-size:var(--t-h2);line-height:1;}
.s--dark .price .amount{color:var(--gold);}
.s--light .price .amount{color:var(--ochre);}
@media(min-width:720px){
  .price{grid-template-columns:12rem 1fr auto;column-gap:2.5rem;}
}

/* offer rows that are themselves links (the 1:1 packs) */
.offer--link{text-decoration:none;color:inherit;transition:background-color .25s ease;}
.offer--link:hover,.offer--link:focus-visible{background:rgba(145,116,81,0.09);}
.offer h3 .terms{display:block;margin-top:0.4rem;}
.offer .amount{font-family:var(--serif);font-size:var(--t-h3);line-height:1;margin:0;}
.s--dark .offer .amount{color:var(--gold);}
.s--light .offer .amount{color:var(--ochre);}
@media(min-width:720px){
  .offer--link{grid-template-columns:13rem 1fr auto;column-gap:2.5rem;}
  .offer .amount{text-align:right;}
}

/* inline links inside body copy */
.body a,.note a{color:inherit;text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px;text-decoration-color:var(--gold);}
.s--light .body a:hover,.s--light .body a:focus-visible{color:var(--ochre);text-decoration-color:var(--ochre);}
.s--dark .body a:hover,.s--dark .body a:focus-visible{color:var(--gold);}

/* inline-link: carried over from the old stylesheet, used inside body copy */
.inline-link{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;}
.s--dark .inline-link{color:var(--gold);text-decoration-color:var(--gold);}
.s--light .inline-link{color:var(--ochre);text-decoration-color:var(--ochre);}

/* hero with two calls to action: the conversation, and the assessment */
.hero__cta{display:flex;flex-wrap:wrap;gap:0.9rem 1.75rem;margin:0;}
.hero--centred .hero__cta{justify-content:center;}
.hero__note{margin-top:1rem;color:var(--sand);opacity:.82;}
.hero--centred .hero__note{text-align:center;margin-left:auto;margin-right:auto;}