/* ============================================================
   AGENCY X — shared design system
   Source of truth: talent-profile-shayna-jack.html (approved master)
   Palette: White #FFFFFF · Light Grey #F2F2F2 · Deep Navy #0D1B2A ·
   Matte Gold #C5A55A (never a background fill) · Steel Blue #3A6B8C ·
   Charcoal #1B2838
   ============================================================ */

/* Self-hosted webfonts (OFL; licences in fonts/). Replaces the render-blocking
   Google Fonts stylesheet. Outfit and DM Sans roman are variable fonts covering
   400-700 in one file each; DM Sans italic and Space Mono are static, because
   their variable versions measured larger. The range stops at 700 so <strong>
   inside a heading, which resolves to 900, keeps rendering at 700 as it does
   today. unicode-range is Google's own, so latin-ext is fetched only if a page
   actually contains such a character. */
@font-face{font-family:'Outfit';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/outfit-400-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Outfit';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/outfit-400-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'DM Sans';font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/dm-sans-400i-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'DM Sans';font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/dm-sans-400i-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/dm-sans-400-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/dm-sans-400-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/space-mono-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/space-mono-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/space-mono-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/space-mono-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}

:root{
  --white:#FFFFFF; --grey:#F2F2F2; --navy:#0D1B2A; --gold:#C5A55A;
  --steel:#3A6B8C; --char:#1B2838;
  --char-dim:rgba(27,40,56,.72); --char-faint:rgba(27,40,56,.66);
  --w-dim:rgba(255,255,255,.78); --w-faint:rgba(255,255,255,.55); --w-hair:rgba(255,255,255,.14);
  --hair:rgba(27,40,56,.12);
  --ease:cubic-bezier(0.32,0.72,0,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--white);color:var(--char);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:'Outfit',sans-serif;font-weight:600;line-height:1.08;letter-spacing:-.01em;color:var(--navy)}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.label{font-family:'Outfit';font-weight:500;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--steel)}
.label.gold{color:var(--gold)}
.gold-line{display:block;width:44px;height:2px;background:var(--gold);margin-top:14px}
.num{font-family:'Space Mono',monospace;font-weight:700}
.to-update{font-family:'Outfit';font-weight:500;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel);border:1px dashed rgba(58,107,140,.5);border-radius:6px;padding:3px 9px;display:inline-block}

/* reveal */
.rv{opacity:0;transform:translateY(34px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.on{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
/* hero content paints immediately — CSS-driven entrance, no JS wait */
.hero .rv,.page-hero .rv{opacity:1;transform:none;animation:riseIn .7s var(--ease) backwards}
.hero .rv.d1,.page-hero .rv.d1{animation-delay:.08s}
.hero .rv.d2,.page-hero .rv.d2{animation-delay:.16s}
.hero .rv.d3,.page-hero .rv.d3{animation-delay:.24s}
@keyframes riseIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

/* ---------- nav ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;gap:6px;
  padding:14px clamp(20px,4vw,44px);background:rgba(13,27,42,.97);
  border-bottom:1px solid var(--w-hair)}
nav .logo{font-family:'Outfit';font-weight:700;font-size:15px;letter-spacing:.16em;color:var(--white);margin-right:auto}
nav .logo b{color:var(--gold);font-weight:700}
/* width:auto is required — images now carry intrinsic width/height attributes for
   CLS, and without it the attribute would be used as a literal width. */
nav .logo img{height:22px;width:auto;display:block}
nav .links{display:flex;gap:2px;margin-right:14px}
nav .links a{font-family:'Outfit';font-weight:500;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--w-dim);padding:9px 13px;border-radius:6px;transition:color .45s var(--ease),background-color .45s var(--ease)}
nav .links a:hover{color:var(--white);background:rgba(255,255,255,.07)}
.btn{display:inline-flex;align-items:center;gap:10px;border-radius:8px;font-family:'Outfit';font-weight:600;
  font-size:13px;letter-spacing:.04em;cursor:pointer;background-color:transparent;-webkit-appearance:none;appearance:none;transition:background-color .5s var(--ease),border-color .5s var(--ease),color .5s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);border:1px solid transparent;
  padding:11px 20px}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px -14px rgba(13,27,42,.5)}
.btn:active{transform:translateY(0) scale(.98)}
.btn .ar{transition:transform .5s var(--ease);font-size:13px}
.btn:hover .ar{transform:translateX(3px)}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-gold:hover{background:#D4B770}
.btn-line{background-color:transparent;border-color:rgba(255,255,255,.35);color:var(--white)}
.btn-line:hover{border-color:var(--gold);color:var(--gold)}
.btn-navy{background:var(--navy);color:var(--white)}
.btn-navy:hover{background:#16293e}
.btn-line-dark{background-color:transparent;border-color:rgba(27,40,56,.35);color:var(--navy)}
.btn-line-dark:hover{border-color:var(--gold);color:var(--gold)}
.btn-lg{font-size:14px;padding:14px 26px}
.btn:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* mobile hamburger nav */
.burger{display:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  width:42px;height:42px;background:none;border:0;cursor:pointer;margin-left:2px;flex-shrink:0}
.burger span{display:block;width:20px;height:2px;background:var(--white);border-radius:2px;
  transition:transform .35s var(--ease),opacity .35s var(--ease)}
.menu-open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-open .burger span:nth-child(2){opacity:0}
.menu-open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.m-menu{position:fixed;inset:0;z-index:95;background:var(--navy);display:flex;flex-direction:column;
  justify-content:center;padding:96px 26px 40px;opacity:0;pointer-events:none;transition:opacity .35s var(--ease)}
.m-menu a{font-family:'Outfit';font-weight:600;font-size:24px;color:var(--white);padding:13px 0;
  border-bottom:1px solid var(--w-hair)}
.m-menu a:hover{color:var(--gold)}
.m-menu .btn{margin-top:24px;align-self:flex-start;font-size:14px;color:var(--navy);border-bottom:0}
.m-menu .btn:hover{color:var(--navy)}
.menu-open .m-menu{opacity:1;pointer-events:auto}
.menu-open{overflow:hidden}

/* ---------- heroes ---------- */
/* split hero — talent unobstructed, no overlay, no filter, text on solid navy */
.hero{position:relative;min-height:92vh;display:grid;grid-template-columns:1.05fr .95fr;background:var(--navy)}
.hero .bg{position:relative;overflow:hidden;order:2}
.hero-inner{order:1;display:flex;align-items:flex-end;padding:150px clamp(24px,4.5vw,64px) 64px}
.hero .label-row{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.hero .label-row .label{color:var(--gold)}
.hero .label-row i{width:34px;height:1px;background:var(--gold);font-style:normal;opacity:.7}
.hero h1{font-size:clamp(52px,7.6vw,104px);font-weight:700;color:var(--white);text-transform:uppercase;letter-spacing:.01em}
.hero h1.h-home{font-size:clamp(40px,5.4vw,74px);text-transform:none;letter-spacing:-.01em}
.hero .hon{font-family:'Outfit';font-weight:500;font-size:clamp(13px,1.3vw,16px);letter-spacing:.3em;color:var(--gold);
  display:block;margin-top:10px;text-transform:uppercase}
.hero .pos{font-size:clamp(16px,1.6vw,20px);color:var(--w-dim);max-width:36em;margin:22px 0 26px;line-height:1.55}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero .img-note{position:absolute;left:14px;bottom:14px;z-index:5;font-family:'Outfit';font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--w-faint)}

/* hero media carousel — images + video slides */
.slide{position:absolute;inset:0;opacity:0;transition:opacity .8s var(--ease);pointer-events:none}
.slide.on{opacity:1;pointer-events:auto}
.slide img,.slide video,.slide iframe{width:100%;height:100%;object-fit:cover;object-position:center 20%;border:0}
.slide.video-ph{background:linear-gradient(140deg,#13273c,#0a1520);display:flex;align-items:center;
  justify-content:center;flex-direction:column;gap:14px}
.slide.video-ph .play{width:64px;height:64px;border-radius:50%;border:1px solid rgba(255,255,255,.35);
  display:flex;align-items:center;justify-content:center;color:var(--white);font-size:16px;cursor:pointer;
  transition:all .5s var(--ease)}
.slide.video-ph .play:hover{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.slide.video-ph span{font-family:'Outfit';font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--w-faint)}
.car-ctrl{position:absolute;bottom:18px;right:18px;z-index:5;display:flex;align-items:center;gap:14px}
.car-dots{display:flex;gap:7px}
.car-dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer;font-style:normal;
  transition:all .45s var(--ease)}
.car-dots i.on{background:var(--gold);transform:scale(1.25)}
.car-btn{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(13,27,42,.45);
  backdrop-filter:blur(6px);color:var(--white);font-size:13px;cursor:pointer;display:flex;align-items:center;
  justify-content:center;transition:all .45s var(--ease)}
.car-btn:hover{background:var(--gold);border-color:var(--gold);color:var(--navy)}

/* compact split hero — interior pages (homepage keeps full height) */
.hero.compact{min-height:660px}
.hero.compact h1{font-size:clamp(34px,3.8vw,54px)}
/* compact heroes are near-square, so tall portraits crop hard — anchor to the top so heads are never cut */
/* descendant, not direct child — images are wrapped in <picture> for WebP */
.hero.compact .slide img,.hero.compact .bg img{object-position:center top}
.hero.compact .hero-inner{padding:130px clamp(24px,4vw,56px) 48px}
.hero.compact h1.h-home{font-size:clamp(34px,3.8vw,54px)}
.hero.compact .pos{font-size:clamp(15px,1.4vw,18px);margin:16px 0 22px}
.hero.compact .trust{margin-top:26px;padding-top:18px}

/* interior page hero — navy band */
.page-hero{background:var(--navy);padding:150px 0 56px}
.page-hero h1{color:var(--white);font-size:clamp(38px,4.6vw,64px);font-weight:700}
.page-hero .pos{font-size:clamp(15px,1.5vw,19px);color:var(--w-dim);max-width:44em;margin-top:18px;line-height:1.6}
.page-hero .label{color:var(--gold)}
.page-hero .hero-cta{margin-top:28px}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.chips a,.chips span{font-family:'Outfit';font-weight:500;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  padding:8px 15px;border-radius:6px;border:1px solid var(--w-hair);color:var(--w-dim);
  transition:all .45s var(--ease)}
.chips a:hover{border-color:var(--gold);color:var(--gold)}
.chips.dark{margin-bottom:0}
.chips.dark a{border-color:rgba(13,27,42,.25);color:var(--char-dim)}
.chips.dark a:hover{border-color:var(--gold);color:var(--gold)}

/* stat band — navy strip under hero */
.stats{background:var(--navy);border-top:1px solid var(--w-hair)}
.stats-in{display:grid;grid-template-columns:repeat(4,1fr)}
.stats-in.g3{grid-template-columns:repeat(3,1fr)}
.stat{padding:28px 30px}
.stat+.stat{border-left:1px solid var(--w-hair)}
.stat b{display:block;font-family:'Space Mono',monospace;font-weight:700;font-size:clamp(26px,2.6vw,36px);color:var(--gold)}
.stat span{font-size:13px;color:var(--w-dim)}
.stat small{display:block;font-size:10.5px;color:var(--w-faint);margin-top:3px}
.stat.ph b{color:rgba(197,165,90,.45)}
.stat.ph span{color:var(--w-faint)}

/* ---------- sections ---------- */
section{padding:64px 0}
section.band{background:var(--grey)}
.sec-head{margin-bottom:36px}
.sec-head h2{font-size:clamp(28px,3vw,40px);margin-top:10px}
.sec-head .sub{color:var(--char-faint);font-size:14px;margin-top:10px;max-width:40em}
.sec-head.split{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap}
/* split head variant: button top-aligns with the paragraph under the headline */
.sec-head .sub-split{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;flex-wrap:wrap}
.sec-head .sub-split .sub{margin-top:10px}
.sec-head .sub-split .btn{margin-top:12px;flex-shrink:0}

/* booker paragraph / pull quote */
.pull p.big{font-family:'Outfit';font-weight:500;font-size:clamp(20px,2.2vw,28px);line-height:1.42;color:var(--navy);max-width:32em}
.pull p.big em{font-style:normal;border-bottom:2px solid var(--gold)}
.pull .note{font-size:15px;color:var(--char-dim);margin-top:20px;max-width:52em}

/* about / bio */
.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px}
.bio p{color:var(--char-dim);margin-bottom:16px;font-size:15.5px}
.bio p:first-child{color:var(--char);font-size:17px}

/* achievements timeline */
.tl{border-top:1px solid var(--hair)}
.tl-row{display:grid;grid-template-columns:110px 1fr;gap:28px;padding:18px 6px;
  border-bottom:1px solid var(--hair)}
.tl-row b{font-family:'Space Mono',monospace;font-size:17px;color:var(--steel);transition:color .45s var(--ease)}
.tl-row:hover b{color:var(--gold)}
.tl-row p{color:var(--char-dim);font-size:15px;align-self:center}
.ach-grid{display:grid;grid-template-columns:1.15fr .8fr;gap:52px;align-items:stretch}
.ach-img{position:relative;border-radius:12px;overflow:hidden;min-height:100%;background:linear-gradient(150deg,#13273c,#0a1520)}
.ach-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
.ach-img .cap{position:absolute;left:14px;bottom:14px;font-family:'Outfit';font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--white);background:rgba(13,27,42,.75);padding:7px 13px;border-radius:6px}

/* brand logos / partner marks */
.logos{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px}
.logos span{font-family:'Outfit';font-weight:500;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--char-dim);padding:12px 22px;border-radius:8px;background:var(--white);border:1px solid var(--hair);
  transition:border-color .45s var(--ease),color .45s var(--ease)}
section:not(.band) .logos span{background:var(--grey);border-color:transparent}
.logos span:hover{border-color:var(--gold);color:var(--navy)}
.logos.center{justify-content:center;margin-bottom:0}

/* partner logo strip — real logos, greyscale until hover */
.logo-strip{display:flex;flex-wrap:wrap;gap:24px 46px;align-items:center;justify-content:center}
.logo-strip img{height:32px;width:auto;max-width:130px;object-fit:contain;filter:grayscale(1);opacity:.6;
  transition:filter .45s var(--ease),opacity .45s var(--ease)}
.logo-strip img:hover{filter:none;opacity:1}
.logo-strip img.lg{height:46px}
.logo-strip img.wide{max-width:180px}
.logo-strip.left{justify-content:flex-start}
.logo-strip .txt-pill{font-family:'Outfit';font-weight:500;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--char-dim);padding:10px 18px;border-radius:8px;background:var(--white);border:1px solid var(--hair);opacity:.75}
/* Typographic stand-in for partners whose logo artwork we do not hold. Reads as a
   deliberate wordmark row rather than a row of missing images. */
.logo-strip.wordmarks{gap:14px 18px}
.logo-strip.wordmarks span{font-family:'Outfit';font-weight:600;font-size:15px;letter-spacing:.02em;
  color:var(--navy);padding:11px 20px;border-radius:8px;background:var(--white);border:1px solid var(--hair);
  transition:border-color .45s var(--ease),color .45s var(--ease)}
.logo-strip.wordmarks span:hover{border-color:var(--gold)}

/* case / highlight panel */
.case{display:grid;grid-template-columns:1fr 1fr;border-radius:12px;overflow:hidden;background:var(--navy)}
.case .img{min-height:300px;position:relative;background:linear-gradient(140deg,#13273c,#0a1520);display:flex;
  align-items:center;justify-content:center}
.case .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.case .img span{font-family:'Outfit';font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--w-faint);padding:0 20px;text-align:center}
.case .txt{padding:clamp(28px,3.4vw,52px);color:var(--white)}
.case .txt h3{font-size:clamp(21px,2vw,28px);margin:14px 0 12px;color:var(--white)}
.case .txt p{color:var(--w-dim);font-size:15px}

/* partnership highlight carousel (profile pages) */
.case-car{position:relative}
.case-car .case-slide{display:none}
.case-car .case-slide.on{display:block;animation:caseFade .8s var(--ease)}
@keyframes caseFade{from{opacity:0}to{opacity:1}}
.case-dots{display:flex;gap:7px;justify-content:center;margin-top:18px}
.case-dots i{width:7px;height:7px;border-radius:50%;background:rgba(27,40,56,.25);cursor:pointer;font-style:normal;
  transition:all .45s var(--ease)}
.case-dots i.on{background:var(--gold);transform:scale(1.25)}

/* step-by-step process flow */
.steps-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.step-item{position:relative;padding-right:8px}
.step-item .sn{width:46px;height:46px;border-radius:50%;background:var(--navy);border:2px solid var(--gold);
  color:var(--gold);font-family:'Space Mono',monospace;font-weight:700;font-size:14px;display:flex;
  align-items:center;justify-content:center;margin-bottom:16px;position:relative;z-index:2}
.step-item::before{content:"";position:absolute;top:23px;left:56px;right:-16px;height:2px;
  background:linear-gradient(90deg,var(--gold),rgba(197,165,90,.2))}
.step-item:last-child::before{display:none}
.step-item h3{font-size:19px;margin-bottom:8px}
.step-item p{font-size:14px;color:var(--char-dim);line-height:1.55}
/* vertical variant — steps run down the left beside an image */
.steps-flow.vert{grid-template-columns:1fr;gap:30px}
.steps-flow.vert .step-item{padding:0 0 0 64px}
.steps-flow.vert .step-item .sn{position:absolute;left:0;top:0;margin-bottom:0}
.steps-flow.vert .step-item::before{top:54px;bottom:-30px;left:22px;right:auto;width:2px;height:auto;
  background:linear-gradient(180deg,var(--gold),rgba(197,165,90,.2))}

/* topic / pillar cards */
.topics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px}
.topics.g2{grid-template-columns:repeat(2,1fr)}
.topics.g4{grid-template-columns:repeat(4,1fr)}
.topic{background:var(--white);border:1px solid var(--hair);border-radius:12px;padding:26px 24px;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease)}
section.band .topic{border-color:transparent}
.topic:hover{transform:translateY(-4px);box-shadow:0 18px 40px -18px rgba(13,27,42,.25);
  border-color:var(--gold)}
.topic .n{font-family:'Space Mono',monospace;font-size:12px;color:var(--gold)}
.topic h3{font-size:19px;margin:12px 0 8px}
.topic p{font-size:14px;color:var(--char-dim)}
.formats{font-size:14px;color:var(--char-faint)}
.formats b{color:var(--char-dim);font-weight:500}

/* hero trust strip (for-talent) */
.trust{margin-top:36px;display:flex;flex-direction:column;gap:9px;border-top:1px solid var(--w-hair);padding-top:22px;max-width:56em}
.trust p{font-size:13px;line-height:1.7;color:var(--w-dim)}
.trust b{display:block;font-family:'Outfit';font-weight:500;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:2px}

/* representation cards (for-talent) */
.rep-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:stretch}
.rep-card{background:var(--white);border:1px solid var(--hair);border-radius:12px;padding:34px 30px;
  display:flex;flex-direction:column;gap:14px;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.rep-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -18px rgba(13,27,42,.25)}
.rep-card .tag{font-family:'Outfit';font-weight:500;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.rep-card h3{font-size:25px}
.rep-card h3 small{font-family:'Outfit';font-weight:500;font-size:14px;color:var(--char-faint);margin-left:4px}
.rep-card .lead{font-size:14.5px;color:var(--char-dim);line-height:1.6}
.rep-card ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin:2px 0 10px}
.rep-card li{font-size:13.5px;color:var(--char-dim);line-height:1.55;padding-left:18px;position:relative}
.rep-card li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:2px;background:var(--gold)}
.rep-card li b{color:var(--navy);font-family:'Outfit';font-weight:600}
.rep-card .btn{margin-top:auto;align-self:flex-start}
.rep-card.navy{background:var(--navy);border-color:var(--navy)}
.rep-card.navy .tag{color:var(--gold)}
.rep-card.navy h3{color:var(--white)}
.rep-card.navy h3 small{color:var(--w-faint)}
.rep-card.navy .lead,.rep-card.navy li{color:var(--w-dim)}
.rep-card.navy li b{color:var(--white)}
.rep-note{text-align:center;font-size:14.5px;color:var(--char-dim);margin-top:24px}
.ft-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:24px;flex-wrap:wrap}
.ft-foot p{font-size:14.5px;color:var(--char-dim)}
.rep-note a{color:var(--navy);font-weight:500;border-bottom:2px solid var(--gold)}
.rep-note a:hover{color:var(--gold)}

/* dash bullet list (pillar right column) */
.dashlist{list-style:none;display:flex;flex-direction:column;gap:10px;align-self:center}
.dashlist li{font-size:14.5px;color:var(--char-dim);line-height:1.55;padding-left:18px;position:relative}
.dashlist li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:2px;background:var(--gold)}

/* three-across quotes */
.quotes.g3{grid-template-columns:repeat(3,1fr)}

/* talent case study (for-talent) */
.cs-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:start}
.cs-grid .csb{font-family:'Outfit';font-weight:600;color:var(--navy)}

/* EOI form: goal fields only appear (and become required) for Managed applicants */
.mreq{display:none;color:var(--gold)}
form.managed .mreq{display:inline}
.field.mfield{display:none}
form.managed .field.mfield{display:flex}

/* image placeholders + split layouts */
.img-ph{border:1px dashed rgba(27,40,56,.3);border-radius:12px;display:flex;align-items:center;
  justify-content:center;text-align:center;padding:24px;min-height:280px;background:rgba(255,255,255,.5);
  color:var(--char-faint);font-family:'Outfit';font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  line-height:1.8}
.img-ph.dark{border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.04);color:var(--w-faint)}
.tb-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:stretch}
/* single hero image (no carousel) — fills the split hero's image panel */
.hero .bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%}
/* <picture> is an inline wrapper; it must not become the positioning context */
.hero .bg picture,.slide picture,.ph picture,.ach-img picture,.case .img picture{display:contents}

/* hero image placeholder — fills the split hero's image panel (same slot as homepage carousel) */
.hero-ph{position:absolute;inset:16px;border:1px dashed rgba(255,255,255,.25);border-radius:12px;
  display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;
  color:var(--w-faint);font-family:'Outfit';font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  line-height:1.8}

/* service hover/tap tiles (for-brands) */
.svc-tiles{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.svc-tile{position:relative;background:var(--navy);border:1px solid transparent;border-radius:12px;
  padding:30px 28px;min-height:330px;overflow:hidden;display:flex;flex-direction:column;cursor:pointer;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease),background-color .5s var(--ease)}
.svc-tile:hover,.svc-tile:focus-within{transform:translateY(-3px);box-shadow:0 18px 40px -18px rgba(13,27,42,.4);
  border-color:var(--gold)}
.svc-tile .tf{display:flex;flex-direction:column;gap:12px;flex:1;padding-right:44px}
.svc-tile .tf h3{font-size:20px;line-height:1.2;color:var(--white)}
.svc-tile .tf .hook{color:var(--w-dim);font-size:14.5px}
.svc-tile .tf .outcome{margin-top:auto;font-size:13.5px;color:var(--w-dim);border-top:1px solid var(--w-hair);padding-top:14px}
.svc-tile .olabel{display:block;font-family:'Outfit';font-weight:500;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.svc-tile .plus{position:absolute;right:18px;top:18px;width:26px;height:26px;border-radius:50%;
  border:1px solid rgba(255,255,255,.35);color:var(--white);display:flex;align-items:center;justify-content:center;
  font-size:14px;font-style:normal;transition:all .4s var(--ease);z-index:2}
.svc-tile:hover .plus,.svc-tile.open .plus{background:var(--gold);border-color:var(--gold);color:var(--navy);
  transform:rotate(45deg)}
.svc-tile .tb{position:absolute;inset:0;background:var(--white);color:var(--char);padding:26px 46px 26px 28px;
  display:flex;flex-direction:column;gap:12px;opacity:0;transform:translateY(14px);pointer-events:none;
  overflow-y:auto;transition:all .5s var(--ease);z-index:1}
.svc-tile .tb .desc{font-size:13.5px;color:var(--char-dim);line-height:1.5}
.svc-tile .tb ul{list-style:none;display:flex;flex-direction:column;gap:7px}
.svc-tile .tb li{font-size:12.5px;color:var(--char-dim);line-height:1.5}
.svc-tile .tb li b{color:var(--navy);font-family:'Outfit';font-weight:600}
.svc-tile .tb .tlink{margin-top:auto;align-self:flex-start;font-family:'Outfit';font-weight:600;font-size:13px;
  color:var(--navy);border-bottom:2px solid var(--gold);padding-bottom:2px;transition:all .4s var(--ease)}
.svc-tile .tb .tlink:hover{color:var(--gold)}
@media(hover:hover){
  .svc-tile:hover .tb,.svc-tile:focus-within .tb{opacity:1;transform:none;pointer-events:auto}
}
.svc-tile.open .tb{opacity:1;transform:none;pointer-events:auto}

/* service pillar rows */
.pillar{border-top:1px solid var(--hair);padding:44px 0;display:grid;grid-template-columns:.42fr .58fr;gap:44px}
.pillar:first-of-type{border-top:0;padding-top:0}
.pillar .n{font-family:'Space Mono',monospace;font-size:13px;color:var(--gold);display:block;margin-bottom:10px}
.pillar h3{font-size:clamp(21px,2.1vw,27px)}
.pillar .lead-tag{margin-left:10px;vertical-align:middle}
.pillar .promise{color:var(--char-dim);font-size:15px;margin-top:12px;max-width:30em}
.svc{border-top:1px solid var(--hair)}
.svc-row{display:grid;grid-template-columns:200px 1fr;gap:22px;padding:14px 4px;border-bottom:1px solid var(--hair)}
.svc-row b{font-family:'Outfit';font-weight:600;font-size:14px;color:var(--navy)}
.svc-row p{font-size:14px;color:var(--char-dim)}

/* media block */
.media{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:16/7.5;background:var(--navy);
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px}
.media::before{content:"";position:absolute;inset:0;background:
  radial-gradient(ellipse at 70% 30%,rgba(58,107,140,.35),transparent 60%)}
.play{position:relative;width:70px;height:70px;border-radius:50%;border:1px solid rgba(255,255,255,.35);display:flex;
  align-items:center;justify-content:center;font-size:18px;color:var(--white);cursor:pointer;transition:all .5s var(--ease)}
.play:hover{background:var(--gold);border-color:var(--gold);color:var(--navy);transform:scale(1.06)}
.media span{position:relative;font-family:'Outfit';font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--w-dim)}
.media .yt-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.media iframe,.media video{position:absolute;inset:0;width:100%;height:100%;border:0}
.media.playing{aspect-ratio:16/9;background:#000}
.media.playing .play,.media.playing span,.media.playing .yt-thumb{display:none}
.press{display:flex;gap:30px;justify-content:center;margin-top:26px;flex-wrap:wrap}
.press span{font-family:'Outfit';font-weight:600;font-size:14px;color:var(--char-faint);letter-spacing:.05em}

/* testimonials */
.quotes{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.q{background:var(--white);border:1px dashed rgba(27,40,56,.25);border-radius:12px;padding:28px 26px}
.q.solid{border:1px solid var(--hair)}
.q p{font-size:15px;color:var(--char-dim);font-style:italic;margin-bottom:16px}
.q b{font-family:'Outfit';font-size:12.5px;font-weight:500;color:var(--char-faint);letter-spacing:.04em}

/* placeholder box for pending content */
.ph-box{border:1px dashed rgba(27,40,56,.3);border-radius:12px;padding:34px 28px;text-align:center;
  color:var(--char-faint);font-size:14px;background:rgba(242,242,242,.5)}
section.band .ph-box{background:rgba(255,255,255,.6)}
.ph-box .to-update{margin-bottom:10px}

/* ---------- roster ---------- */
.roster-layout{display:grid;grid-template-columns:248px 1fr;gap:36px;align-items:start}
/* Cap the pinned panel at the viewport and let it scroll internally — with every
   group open it is taller than the screen, and a sticky element never reveals its
   overflow through page scroll, so without this the lower filters are unreachable. */
.roster-layout .filters{position:sticky;top:86px;margin-bottom:0;max-height:calc(100vh - 106px);overflow-y:auto;scrollbar-width:thin}
.filters{display:flex;flex-direction:column;margin-bottom:38px;background:var(--white);
  border:1px solid var(--hair);border-radius:12px;padding:18px 18px 16px}
.fhead{display:flex;align-items:center;gap:9px;padding-bottom:13px;border-bottom:1px solid var(--hair)}
.fhead svg{width:15px;height:15px;color:var(--gold);flex-shrink:0}
.fhead h3{font-size:15px;letter-spacing:.01em}
details.fgroup{border-bottom:1px solid var(--hair)}
.fgroup summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer;padding:14px 0;
  font-family:'Outfit';font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--char-dim);transition:color .35s var(--ease)}
.fgroup summary:hover{color:var(--navy)}
.fgroup summary::-webkit-details-marker{display:none}
.fgroup summary::marker{content:""}
.fgroup .fcount{font-family:'Space Mono',monospace;font-size:10px;color:var(--gold)}
.fgroup .chev{margin-left:auto;font-style:normal;font-size:10px;color:var(--steel);
  transition:transform .35s var(--ease)}
details[open].fgroup .chev{transform:rotate(180deg)}
.fgroup .fchips{display:flex;flex-wrap:wrap;gap:8px;padding:2px 0 14px}
.fclear{margin-top:14px;font-family:'Outfit';font-weight:600;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--navy);background:none;border:1px solid var(--hair);border-radius:8px;
  padding:10px 12px;cursor:pointer;width:100%;transition:all .4s var(--ease)}
.fclear:hover{border-color:var(--gold);background:rgba(197,165,90,.08)}
.fchip{font-family:'Outfit';font-weight:500;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  padding:8px 14px;border-radius:6px;border:1px solid var(--hair);color:var(--char-dim);cursor:pointer;
  background:transparent;transition:background-color .4s var(--ease),border-color .4s var(--ease),color .4s var(--ease)}
.fchip:hover{border-color:var(--gold);color:var(--navy)}
.fchip.on{background:var(--navy);border-color:var(--navy);color:var(--white)}
.roster{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.t-card{border-radius:12px;overflow:hidden;background:var(--white);border:1px solid var(--hair);
  display:flex;flex-direction:column;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.t-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -18px rgba(13,27,42,.25)}
.t-card .ph{aspect-ratio:4/4.4;position:relative;overflow:hidden;background:linear-gradient(150deg,#13273c,#0a1520);
  display:flex;align-items:center;justify-content:center;color:var(--w-faint);font-family:'Outfit';font-size:10px;
  letter-spacing:.18em;text-transform:uppercase}
.t-card .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
.t-card .info{padding:18px 20px 20px;display:flex;flex-direction:column;gap:4px;flex:1}
.t-card .info small{font-family:'Outfit';font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.t-card .info h3{font-size:19px}
.t-card .t-blurb{font-size:13.5px;line-height:1.45;color:var(--char-faint);margin-top:6px}
.t-card .actions{display:flex;gap:8px;margin-top:14px;align-items:center;flex-wrap:wrap}
.t-card .view{font-family:'Outfit';font-weight:600;font-size:12px;letter-spacing:.06em;color:var(--navy);
  border-bottom:2px solid var(--gold);padding-bottom:2px;transition:all .4s var(--ease)}
.t-card .view:hover{color:var(--gold)}
.sl-btn{font-family:'Outfit';font-weight:500;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--hair);background:transparent;color:var(--char-dim);border-radius:6px;padding:7px 12px;
  cursor:pointer;margin-left:auto;transition:all .4s var(--ease)}
.sl-btn:hover{border-color:var(--gold);color:var(--navy)}
.sl-btn.added{background:var(--navy);border-color:var(--navy);color:var(--gold)}
.roster-count{font-size:13px;color:var(--char-faint);margin-bottom:18px}

/* related talent (profile pages) */
.rel{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rel-card{border-radius:12px;overflow:hidden;background:var(--white);border:1px solid var(--hair);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.rel-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -18px rgba(13,27,42,.25)}
.rel-card .ph{aspect-ratio:4/3.2;position:relative;overflow:hidden;background:linear-gradient(150deg,#13273c,#0a1520);display:flex;align-items:center;
  justify-content:center;color:var(--w-faint);font-family:'Outfit';font-size:10px;letter-spacing:.18em;text-transform:uppercase}
.rel-card .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
.rel-card .info{padding:18px 20px 22px}
.rel-card .info small{font-family:'Outfit';font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.rel-card .info h3{font-size:18px;margin-top:6px}

/* talent testimonial tiles */
.tq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.tq-card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--hair);border-radius:12px;overflow:hidden;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.tq-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -18px rgba(13,27,42,.25)}
.tq-card .ph{display:block;aspect-ratio:4/3;position:relative;overflow:hidden;background:linear-gradient(150deg,#13273c,#0a1520)}
.tq-card .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
.tq-card .in{padding:20px 22px 24px;display:flex;flex-direction:column;flex:1}
.tq-card .in small{font-family:'Outfit';font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.tq-card .in h3{font-size:18px;margin:6px 0 12px}
.tq-card .in h3 a{color:var(--navy)}
.tq-card .in h3 a:hover{color:var(--gold)}
.tq-card .in p{font-size:13.5px;color:var(--char-dim);line-height:1.6;flex:1}
.tq-card .in b{display:block;margin-top:16px;font-family:'Outfit';font-weight:600;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}

/* horizontal card slider — narrowed track, arrows centred in the side gutters */
.h-slider{position:relative;padding:0 54px}
.h-slider .track{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.h-slider .track::-webkit-scrollbar{display:none}
.h-slider .rel-card{flex:0 0 calc((100% - 28px)/3);scroll-snap-align:start}
/* the For Brands slider carries full talent cards, not the smaller related
   cards, so they take the same track sizing */
.h-slider .t-card{flex:0 0 calc((100% - 28px)/3);scroll-snap-align:start}
.h-slider .snav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;
  border:1px solid var(--hair);background:rgba(255,255,255,.94);color:var(--navy);font-size:14px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .45s var(--ease),border-color .45s var(--ease);
  box-shadow:0 10px 24px -12px rgba(13,27,42,.35);z-index:5}
.h-slider .snav:hover{background:var(--gold);border-color:var(--gold)}
.h-slider .snav.sl-prev{left:0}
.h-slider .snav.sl-next{right:0}

/* image duo band */
.img-duo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.img-duo .ach-img{min-height:0;aspect-ratio:16/9;display:block}

/* ---------- forms (navy premium panel) ---------- */
.form-navy{background:var(--navy);padding:72px 0}
.form-navy .fwrap{max-width:860px;margin:0 auto}
/* h1 included so the brand enquiry page keeps this styling now its heading is an h1 */
.form-navy h1,.form-navy h2{color:var(--white);font-size:clamp(26px,2.8vw,38px)}
.form-navy .fintro{color:var(--w-dim);margin:12px 0 34px;font-size:15px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
.field label{font-family:'Outfit';font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-weight:500}
.field input,.field select,.field textarea{background:rgba(255,255,255,.06);border:1px solid var(--w-hair);border-radius:8px;
  padding:13px 16px;color:var(--white);font-family:'DM Sans';font-size:15px;outline:none;
  transition:border-color .45s var(--ease);appearance:none}
.field input::placeholder,.field textarea::placeholder{color:rgba(255,255,255,.35)}
.field textarea{min-height:100px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold)}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23C5A55A' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center}
.field select:invalid{color:rgba(255,255,255,.35)}
.field option{color:var(--char)}
.form-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:26px;flex-wrap:wrap}
.form-foot .call{font-size:14px;color:var(--w-faint)}
.form-foot .call a{color:var(--gold);border-bottom:1px solid rgba(197,165,90,.4)}
.fan-note{text-align:center;font-size:12px;color:var(--w-faint);margin-top:24px}
.promise{font-size:13px;color:var(--w-faint)}

/* service checkbox grid (brand enquiry form) */
.checks{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;margin-top:4px}
.check{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--w-dim);cursor:pointer;line-height:1.45;
  font-family:'DM Sans';letter-spacing:0;text-transform:none}
.check input{width:17px;height:17px;accent-color:#C5A55A;cursor:pointer;flex-shrink:0;margin-top:2px}

/* enquire 2-step */
.steps{display:flex;gap:10px;margin-bottom:34px}
.step-tag{display:flex;align-items:center;gap:10px;font-family:'Outfit';font-weight:500;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--w-faint);padding:9px 16px;border:1px solid var(--w-hair);
  border-radius:8px}
.step-tag b{font-family:'Space Mono',monospace;color:var(--gold);font-size:12px}
.step-tag.on{border-color:var(--gold);color:var(--white)}
.sl-attach{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 8px}
.sl-attach .sl-item{display:inline-flex;align-items:center;gap:10px;font-family:'Outfit';font-weight:500;font-size:12px;
  letter-spacing:.06em;color:var(--white);background:rgba(255,255,255,.07);border:1px solid var(--w-hair);
  border-radius:8px;padding:9px 14px}
.sl-attach .sl-item button{background:none;border:0;color:var(--w-faint);cursor:pointer;font-size:14px;line-height:1}
.sl-attach .sl-item button:hover{color:var(--gold)}
.sl-empty{color:var(--w-faint);font-size:14px;margin:14px 0}
.help-choose{display:flex;align-items:center;gap:12px;margin:20px 0 8px;color:var(--w-dim);font-size:14.5px;cursor:pointer}
.help-choose input{width:18px;height:18px;accent-color:#C5A55A;cursor:pointer}

/* ---------- CTA band ---------- */
.cta-band{background:var(--navy);padding:64px 0}
.cta-band .in{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.cta-band h2{color:var(--white);font-size:clamp(24px,2.6vw,36px);max-width:18em}
.cta-band .promise{margin-top:10px}
.cta-band .actions{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- footer ---------- */
footer{background:var(--navy);color:var(--white);padding:60px 0 40px;border-top:1px solid var(--w-hair)}
.f-grid{display:grid;grid-template-columns:1.2fr .9fr .7fr 1.1fr;gap:40px;margin-bottom:40px}
footer .logo{font-family:'Outfit';font-weight:700;font-size:16px;letter-spacing:.16em}
footer .logo b{color:var(--gold)}
footer .logo img{height:24px;width:auto;display:block}
footer .tag{font-style:italic;color:var(--w-dim);font-size:14px;margin:10px 0 18px}
footer p{font-size:13px;color:var(--w-faint);line-height:1.8}
footer .f-h{font-family:'Outfit';font-weight:500;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold);display:block;margin-bottom:14px}
footer a:hover{color:var(--white)}
footer .f-links a{display:block;font-size:13px;color:var(--w-faint);padding:3px 0;transition:color .4s var(--ease)}
.socials{display:flex;gap:14px}
.socials a{font-family:'Outfit';font-weight:500;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--w-faint);border:1px solid var(--w-hair);border-radius:6px;padding:7px 12px;transition:all .4s var(--ease)}
.socials a:hover{border-color:var(--gold);color:var(--gold)}
.f-news p{margin-bottom:14px}
.f-news form{display:flex;gap:8px}
.f-news input{flex:1;min-width:0;background:rgba(255,255,255,.06);border:1px solid var(--w-hair);border-radius:8px;
  padding:11px 14px;color:var(--white);font-family:'DM Sans';font-size:14px;outline:none;transition:border-color .45s var(--ease)}
.f-news input::placeholder{color:rgba(255,255,255,.35)}
.f-news input:focus{border-color:var(--gold)}
.ack{font-size:12px;color:var(--w-faint);border-top:1px solid var(--w-hair);padding-top:26px;line-height:1.7}

/* blog post body */
.post-body{max-width:52em}
/* Article heroes are landscape (about 1000x480). Without an explicit ratio
   the box was resolving to 440px tall at every width, so at 390px a 2.08
   landscape was being cropped into a 0.78 portrait and 63% of the width was
   thrown away. Give the container the source ratio and cap it instead. */
/* one hero per article and width/height on every img, so the source ratio
   can stand: nothing is cropped and layout shift stays at zero */
.post-body .post-hero{width:100%;height:auto;border-radius:12px;margin-bottom:30px}
.post-body p{color:var(--char-dim);font-size:16px;line-height:1.7;margin-bottom:18px}
.post-body h2,.post-body h3{margin:30px 0 12px}
.post-body h2{font-size:26px}
/* a section heading promoted to level 2 for the outline keeps the size it
   had, so the reading order changes and the page does not */
.post-body h2.lvl3{font-size:20px}
.post-body h3{font-size:20px}
.post-body ul{margin:0 0 18px 22px;color:var(--char-dim);font-size:16px;line-height:1.7}
.post-body li{margin-bottom:8px}
.post-body blockquote{border-left:3px solid var(--gold);padding-left:18px;font-style:italic;margin-bottom:18px;color:var(--char-dim)}
.post-body a{color:var(--navy);border-bottom:1px solid rgba(197,165,90,.5)}
.post-body a.btn{border-bottom:0}
.post-body a.btn-navy{color:var(--white)}

/* sticky mobile CTA */
.sticky-cta{display:none}

/* ---------- responsive ---------- */
@media(max-width:900px){
  nav{padding:12px 16px}
  nav .links{display:none}
  nav .btn-line{display:none}
  .burger{display:flex}
  .hero{min-height:0;grid-template-columns:1fr}
  .hero .bg{order:1;aspect-ratio:4/4.4;margin-top:58px}
  .hero.compact .bg{aspect-ratio:4/3}
  .hero.compact .hero-inner{padding:34px 20px 44px}
  .hero .bg img{object-position:center 15%}
  .hero-inner{order:2;padding:34px 20px 44px}
  .page-hero{padding:120px 0 44px}
  .stats-in,.stats-in.g3{grid-template-columns:1fr 1fr}
  .stat+.stat{border-left:none}.stat:nth-child(even){border-left:1px solid var(--w-hair)}
  .stat:nth-child(n+3){border-top:1px solid var(--w-hair)}
  .about-grid,.case,.quotes,.ach-grid,.pillar,.svc-row{grid-template-columns:1fr}
  .ach-img{min-height:0;aspect-ratio:4/3;margin-top:8px}
  .about-grid{gap:28px}
  .pillar{gap:22px;padding:34px 0}
  .svc-row{gap:4px}
  .topics,.topics.g2,.topics.g4,.rel,.fgrid,.roster,.img-duo,.roster-layout,.svc-tiles,.tb-grid,.rep-cards,.quotes.g3,.checks,.cs-grid,.steps-flow,.tq-grid{grid-template-columns:1fr}
  .step-item::before{display:none}
  .img-ph{min-height:200px}
  .svc-tile{min-height:0}
  .svc-tile .tb{position:static;display:none;opacity:1;transform:none;pointer-events:auto;padding:0 18px 0 0;
    background:transparent;overflow:visible}
  .svc-tile.open{background:var(--white);border-color:var(--hair)}
  .svc-tile.open .tf{display:none}
  .svc-tile.open .tb{display:flex}
  .roster-layout .filters{position:static;max-height:none;overflow:visible}
  .h-slider{padding:0 46px}
  .h-slider .rel-card{flex:0 0 82%}
  .h-slider .t-card{flex:0 0 82%}
  .steps-flow.vert .step-item::before{display:block}
  .f-grid{grid-template-columns:1fr;gap:30px}
  section{padding:48px 0}
  .form-navy{padding:56px 0}
  .tl-row{grid-template-columns:64px 1fr;gap:16px}
  .cta-band .in{flex-direction:column;align-items:flex-start}
  .sticky-cta{display:flex;position:fixed;bottom:14px;left:14px;right:14px;z-index:90}
  .sticky-cta .btn{width:100%;justify-content:center;box-shadow:0 16px 40px -8px rgba(13,27,42,.6)}
}
@media(min-width:901px) and (max-width:1100px){
  .roster{grid-template-columns:repeat(2,1fr)}
}

/* unified tile hover — every tile behaves like the homepage services tiles */
a.topic{display:block}
.rel-card,.t-card,.tq-card,.rep-card{transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease)}
.rel-card:hover,.t-card:hover,.tq-card:hover,.rep-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -18px rgba(13,27,42,.25);border-color:var(--gold)}
.svc-tile:hover,.svc-tile:focus-within{transform:translateY(-4px);box-shadow:0 18px 40px -18px rgba(13,27,42,.25);border-color:var(--gold)}

/* newsletter subscribed state */
.f-news .nl-done{color:var(--gold);font-weight:500;margin-top:4px}

/* ============ SITE SEARCH ============ */
.nav-search{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  background:none;border:1px solid rgba(255,255,255,.22);border-radius:8px;cursor:pointer;color:var(--w-dim);
  margin-right:8px;flex-shrink:0;padding:0;
  transition:color .45s var(--ease),border-color .45s var(--ease),background-color .45s var(--ease)}
.nav-search:hover{color:var(--gold);border-color:var(--gold);background:rgba(255,255,255,.05)}
.nav-search svg{width:16px;height:16px;display:block}

.srch{position:fixed;inset:0;z-index:200;display:none;padding:min(12vh,110px) 20px 20px;
  background:rgba(13,27,42,.78);backdrop-filter:blur(8px)}
.srch.on{display:block;animation:srchIn .22s var(--ease)}
@keyframes srchIn{from{opacity:0}to{opacity:1}}
.srch-box{max-width:680px;margin:0 auto;background:var(--white);border-radius:14px;overflow:hidden;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.6);display:flex;flex-direction:column;max-height:76vh}
.srch-in{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--hair);flex-shrink:0}
.srch-in svg{width:18px;height:18px;color:var(--char-faint);flex-shrink:0}
.srch-in input{flex:1;border:0;outline:0;background:none;font-family:'DM Sans',sans-serif;
  font-size:17px;color:var(--char);min-width:0}
.srch-in input::placeholder{color:var(--char-faint)}
.srch-esc{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.08em;color:var(--char-faint);
  border:1px solid var(--hair);border-radius:5px;padding:4px 7px;flex-shrink:0}
.srch-out{overflow-y:auto;padding:8px 0 10px}
.srch-grp{font-family:'Outfit';font-weight:500;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--steel);padding:14px 20px 7px}
.srch-hit{display:block;padding:10px 20px;border-left:2px solid transparent;cursor:pointer}
.srch-hit h4{font-family:'Outfit';font-weight:600;font-size:15px;color:var(--navy);line-height:1.25}
.srch-hit p{font-size:12.5px;color:var(--char-faint);margin-top:3px;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.srch-hit:hover,.srch-hit.sel{background:rgba(197,165,90,.09);border-left-color:var(--gold)}
.srch-hit mark{background:rgba(197,165,90,.32);color:inherit;border-radius:2px}
.srch-none{padding:26px 20px 30px;text-align:center;color:var(--char-faint);font-size:14px}
.srch-none b{display:block;color:var(--navy);font-family:'Outfit';font-weight:600;font-size:16px;margin-bottom:5px}
.srch-foot{border-top:1px solid var(--hair);padding:10px 20px;display:flex;gap:16px;flex-shrink:0;
  font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.06em;color:var(--char-faint)}
body.srch-open{overflow:hidden}
@media(max-width:900px){
  .srch{padding:74px 12px 12px}
  .srch-box{max-height:82vh}
  .srch-foot{display:none}
  .nav-search{margin-right:4px}
}


/* ---------- cookie consent bar ---------- */
#cc-bar{position:fixed;left:16px;right:16px;bottom:16px;z-index:1200;max-width:860px;margin:0 auto;background:var(--navy);color:var(--white);border:1px solid rgba(197,165,90,.35);border-radius:12px;padding:18px 20px;display:none;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;box-shadow:0 12px 40px rgba(0,0,0,.35)}
/* The banner ships in the page; consent.js adds .cc-ask in <head> when no choice
   is saved, so a returning visitor never sees it flash. */
html.cc-ask #cc-bar{display:flex}
#cc-bar p{margin:0;font-size:.92rem;line-height:1.5;flex:1 1 300px;color:rgba(255,255,255,.85)}
#cc-bar a{color:var(--gold);text-decoration:underline}
#cc-bar .cc-act{display:flex;gap:10px;flex-wrap:wrap}
.cc-manage{display:inline-block;margin:0 0 10px;font-size:.85rem;color:rgba(255,255,255,.55);text-decoration:underline;cursor:pointer}


/* ================= /book-speakers ================= */
.sp-cred{margin-top:20px;font-size:13px;line-height:1.7;color:rgba(255,255,255,.5);max-width:44em}

/* featured speaker editorial rows */
.sp-row{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:44px;align-items:center;
  padding:44px 0;border-top:1px solid var(--hair)}
.sp-row:first-of-type{border-top:0;padding-top:8px}
.sp-row.rev .sp-row-img{order:2}
.sp-row-img{border-radius:12px;overflow:hidden;aspect-ratio:4/5;background:var(--grey)}
/* portrait headshots in a box that turns landscape below 1000px: hold the head */
.sp-row-img img{width:100%;height:100%;object-fit:cover;object-position:50% 12%;display:block}
.sp-row-img picture{display:contents}
.sp-num{font-family:'Space Mono',monospace;font-weight:700;font-size:12px;color:var(--gold);display:block;margin-bottom:10px}
.sp-row-txt .desc{font-family:'Outfit';font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel);display:block}
.sp-row-txt h3{font-size:clamp(24px,2.6vw,34px);margin:8px 0 14px}
.sp-row-txt>p{color:var(--char-dim);max-width:56em}
.sp-chips{margin-top:18px}
.sp-chips span{font-family:'Outfit';font-weight:500;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  padding:8px 14px;border-radius:6px;border:1px solid var(--hair);color:var(--char-dim);background:var(--white)}
.sp-meta{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0 0}
.sp-meta dt{font-family:'Outfit';font-weight:500;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--steel);margin-bottom:6px}
.sp-meta dd{margin:0;font-size:14px;color:var(--navy)}
.sp-row-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

/* MC cards */
.sp-mcs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sp-mc{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:center;padding:14px;
  background:var(--white);border:1px solid var(--hair);border-radius:12px;
  transition:border-color .4s var(--ease),transform .4s var(--ease)}
.sp-mc:hover{border-color:var(--gold);transform:translateY(-2px)}
.sp-mc-ph{border-radius:8px;overflow:hidden;aspect-ratio:1;background:var(--grey)}
.sp-mc-ph img{width:100%;height:100%;object-fit:cover;object-position:50% 10%;display:block}
.sp-mc-ph picture{display:contents}
.sp-mc h3{font-size:17px;margin-bottom:5px}
.sp-mc p{font-size:13px;line-height:1.55;color:var(--char-dim)}

/* speaking topic cards */
.sp-topics{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sp-topic{background:var(--white);border:1px solid var(--hair);border-top:3px solid var(--gold);
  border-radius:0 0 12px 12px;padding:26px 24px}
.sp-topic h3{font-size:19px;margin-bottom:10px}
.sp-topic>p{font-size:14px;color:var(--char-dim);margin-bottom:16px}
.sp-topic ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.sp-topic li{position:relative;padding-left:18px;font-size:14px;color:var(--navy)}
.sp-topic li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--gold)}

/* audience cards (navy section) */
.sp-auds{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sp-aud{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:28px 24px}
.sp-aud h3{color:var(--white);font-size:20px;margin-bottom:10px}
.sp-aud>p{color:rgba(255,255,255,.65);font-size:14.5px}
.sp-aud-get{margin-top:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14)}
.sp-aud-get span{font-family:'Outfit';font-weight:500;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:8px}
.sp-aud-get p{color:rgba(255,255,255,.72);font-size:14px}

/* formats */
.sp-fmts{display:grid;gap:0;border:1px solid var(--hair);border-radius:12px;overflow:hidden;background:var(--white)}
.sp-fmt{display:grid;grid-template-columns:180px 120px 1fr;gap:20px;align-items:baseline;padding:20px 24px;border-top:1px solid var(--hair)}
.sp-fmt:first-child{border-top:0}
.sp-fmt h3{font-size:18px}
.sp-dur{font-family:'Space Mono',monospace;font-size:12px;color:var(--gold)}
.sp-fmt p{font-size:14px;color:var(--char-dim)}
.sp-log{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:30px}
.sp-log p{font-size:14px;color:var(--char-dim);margin-top:10px}

/* booking steps */
.sp-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.sp-step{background:var(--white);border:1px solid var(--hair);border-radius:12px;padding:24px 22px}
.sp-step h3{font-size:18px;margin-bottom:8px}
.sp-step p{font-size:14px;color:var(--char-dim)}

/* FAQ accordion — native details/summary, no JS */
.sp-faq{max-width:56em;background:var(--white);border:1px solid var(--hair);border-radius:12px;overflow:hidden}
.sp-faq details{border-top:1px solid var(--hair)}
.sp-faq details:first-child{border-top:0}
.sp-faq summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:16px;justify-content:space-between;
  padding:20px 24px;font-family:'Outfit';font-weight:600;font-size:16px;color:var(--navy);
  transition:color .35s var(--ease)}
.sp-faq summary::-webkit-details-marker{display:none}
.sp-faq summary::marker{content:""}
.sp-faq summary:hover{color:var(--gold)}
.sp-faq .plus{font-style:normal;font-size:20px;line-height:1;color:var(--gold);flex-shrink:0;
  transition:transform .35s var(--ease)}
.sp-faq details[open] .plus{transform:rotate(45deg)}
.sp-faq details>div{padding:0 24px 22px}
.sp-faq details p{font-size:15px;color:var(--char-dim);max-width:52em}

@media(max-width:1100px){
  .sp-mcs,.sp-topics{grid-template-columns:repeat(2,1fr)}
  .sp-steps{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:1000px){
  .sp-row{grid-template-columns:1fr;gap:24px;padding:34px 0}
  .sp-row.rev .sp-row-img{order:0}
  .sp-row-img{aspect-ratio:16/10}
}
@media(max-width:900px){
  .sp-auds,.sp-log{grid-template-columns:1fr}
  .sp-fmt{grid-template-columns:1fr;gap:6px;padding:18px 20px}
  .sp-meta{grid-template-columns:1fr}
}
@media(max-width:620px){
  .sp-mcs,.sp-topics,.sp-steps{grid-template-columns:1fr}
  .sp-faq summary{padding:17px 18px;font-size:15px}
  .sp-faq details>div{padding:0 18px 18px}
}
@media(prefers-reduced-motion:reduce){
  .sp-mc,.sp-faq .plus,.sp-faq summary{transition:none}
  .sp-mc:hover{transform:none}
}


/* ---------- testimonial slider (mobile): 2+ quotes swipe instead of stacking ---------- */
.q-dots{display:none}
@media(max-width:900px){
  .quotes[data-qslider]{display:flex;grid-template-columns:none;overflow-x:auto;gap:12px;
    scroll-snap-type:x mandatory;align-items:flex-start;padding-bottom:4px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .quotes[data-qslider]::-webkit-scrollbar{display:none}
  .quotes[data-qslider]>.q{flex:0 0 88%;scroll-snap-align:center}
  .q-dots{display:flex;justify-content:center;gap:8px;margin-top:14px}
  .q-dots i{width:7px;height:7px;border-radius:50%;background:rgba(27,40,56,.22);cursor:pointer;
    transition:background .3s var(--ease),transform .3s var(--ease)}
  .q-dots i.on{background:var(--gold);transform:scale(1.25)}
}


/* ---------- talent roster: search bar, filter chips, zero state, mobile sheet ---------- */
.tsearch{display:flex;gap:12px;margin-bottom:26px}
.tsearch-in{flex:1;display:flex;align-items:center;gap:10px;background:var(--white);
  border:1px solid var(--hair);border-radius:10px;padding:0 16px}
.tsearch-in svg{width:16px;height:16px;color:var(--steel);flex-shrink:0}
.tsearch-in input{flex:1;border:0;background:none;padding:14px 0;font-family:'DM Sans',sans-serif;
  font-size:15px;color:var(--char)}
.tsearch-in input:focus{outline:none}
.tsearch-in:focus-within{border-color:var(--gold)}
.tfilters-btn{display:none;font-family:'Outfit',sans-serif;font-weight:600;font-size:13px;
  letter-spacing:.04em;padding:0 20px;border-radius:10px;border:1px solid var(--hair);
  background:var(--white);color:var(--navy);cursor:pointer}
.tfilters-btn b{color:var(--gold);font-weight:700}
.tchips{display:flex;flex-wrap:wrap;gap:8px}
.tchips:not(:empty){margin-bottom:14px}
.tchip{font-family:'Outfit',sans-serif;font-weight:500;font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;padding:8px 14px;border-radius:6px;border:1px solid var(--navy);
  background:var(--navy);color:var(--white);cursor:pointer}
.tchip span{color:var(--gold);margin-left:4px}
.tzero{background:var(--white);border:1px solid var(--hair);border-radius:12px;padding:36px 30px;text-align:center}
.tzero p{color:var(--char-dim);max-width:46ch;margin:0 auto}
.tzero b{color:var(--char)}
.tzero-act{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:20px}
.tsheet-x{display:none;margin-left:auto;background:none;border:0;font-size:26px;line-height:1;
  color:var(--char-dim);cursor:pointer;padding:0 2px}
.tsheet-foot{display:none}
@media(max-width:900px){
  .tfilters-btn{display:block}
  .roster-layout .filters{position:fixed;inset:0;z-index:120;margin:0;border-radius:0;border:0;
    max-height:none;overflow-y:auto;padding:18px 20px 96px;transform:translateY(102%);
    transition:transform .45s var(--ease);visibility:hidden}
  body.tsheet-open .roster-layout .filters{transform:none;visibility:visible}
  body.tsheet-open{overflow:hidden}
  .tsheet-x{display:block}
  .tsheet-foot{display:grid;grid-template-columns:1fr 1.4fr;gap:10px;position:fixed;left:0;right:0;
    bottom:0;padding:14px 20px calc(14px + env(safe-area-inset-bottom));background:var(--white);
    border-top:1px solid var(--hair)}
  .tsheet-foot .btn{justify-content:center}
  .fclear{display:none}
}
@media(prefers-reduced-motion:reduce){
  .roster-layout .filters{transition:none}
}


/* ---------- enquire: talent picker ---------- */
.tpick{margin:6px 0 8px;border:1px solid var(--hair);border-radius:10px;background:var(--white)}
.tpick summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:14px 18px;
  font-family:'Outfit',sans-serif;font-weight:500;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--char-dim)}
.tpick summary::-webkit-details-marker{display:none}
.tpick summary::marker{content:""}
.tpick summary:hover{color:var(--navy)}
.tpick summary .chev{margin-left:auto;font-style:normal;font-size:10px;color:var(--steel);transition:transform .35s var(--ease)}
.tpick[open] summary .chev{transform:rotate(180deg)}
.tpick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px 14px;padding:4px 18px 16px}
.tpick-item{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:14px;color:var(--char);cursor:pointer}
.tpick-item input{accent-color:var(--gold);width:15px;height:15px;flex-shrink:0}
@media(max-width:900px){.tpick-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tpick-grid{grid-template-columns:1fr}}


/* ---------- talent card actions + filter rail alignment (12.08.26 tidy) ---------- */
/* Actions pin to the card bottom; the shortlist button is a full-width row, so
   linked and unlinked cards read the same and nothing floats oddly right. */
.t-card .actions{margin-top:auto;padding-top:14px;flex-direction:column;align-items:stretch;gap:10px}
.t-card .view{align-self:flex-start}
.t-card .sl-btn{margin-left:0;width:100%;text-align:center;padding:9px 12px}
/* Filter options render as a stacked, left-aligned list inside the rail — button
   text centers by default, which made the long labels wrap as centred two-liners. */
.filters .fchips{gap:6px}
.filters .fchip{display:block;width:100%;text-align:left}
.filters .fgroup summary{justify-content:flex-start;text-align:left}


/* ---------- required-field feedback ---------- */
.form-err{margin:18px 0 0;padding:13px 16px;border-radius:8px;font-size:14px;line-height:1.55;
  color:#ffb4ab;background:rgba(255,138,128,.08);border:1px solid rgba(255,138,128,.35)}
.form-err b{color:#ffd3cd;font-weight:600}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#ff8a80}
.field.invalid label{color:#ffb4ab}


/* ---- Enquiry service picker (24.08.26 taxonomy) --------------------------
   These sit inside .form-navy, so everything is drawn for a navy ground.
   The base .field input rule above sets appearance:none, which removes the
   native checkbox entirely — the box and its tick are drawn here instead. */
.svc-fs{border:0;padding:0;margin:0;min-width:0}
.svc-fs legend{display:block;width:100%;padding:0;margin:0 0 6px;
  font-family:'Outfit',sans-serif;font-size:16.5px;font-weight:600;line-height:1.35;
  letter-spacing:.01em;text-transform:none;color:var(--white)}
.svc-hint{margin:0 0 14px;font-size:13.5px;color:var(--w-dim)}
.svc-checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:10px}
.svc-fs .svc-check{display:flex;align-items:center;gap:13px;min-height:58px;
  padding:12px 16px;border:1.5px solid rgba(255,255,255,.22);border-radius:8px;
  background:rgba(255,255,255,.04);cursor:pointer;
  font-family:'DM Sans',sans-serif;font-size:15px;font-weight:500;line-height:1.35;
  letter-spacing:0;text-transform:none;color:var(--white);
  transition:border-color .2s,background .2s}
.svc-fs .svc-check:hover{border-color:rgba(197,165,90,.6);background:rgba(255,255,255,.08)}
.svc-fs input[type=checkbox]{appearance:none;-webkit-appearance:none;
  flex:0 0 22px;width:22px;height:22px;margin:0;padding:0;border-radius:5px;
  border:1.5px solid rgba(255,255,255,.5);background:transparent;
  transition:background .15s,border-color .15s}
.svc-fs input[type=checkbox]:checked{border-color:var(--gold);background-color:var(--gold);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%230D1B2A' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round' d='M3.2 8.6l3.2 3.2L12.8 5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:15px 15px}
.svc-fs .svc-check:has(input:checked){border-color:var(--gold);background:rgba(197,165,90,.14)}
.svc-fs input[type=checkbox]:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.svc-only[hidden]{display:none!important}
.enq-for{font-family:'Outfit',sans-serif;font-size:14px;letter-spacing:.02em;margin:6px 0 0;color:var(--gold)}
.fhint{font-size:12.5px;opacity:.7;margin:0 0 10px}
.enq-summary{margin:18px 0;padding:14px 18px;border:1px solid rgba(197,165,90,.45);border-radius:8px;font-size:15px;line-height:1.8}
@media(max-width:600px){.svc-checks{grid-template-columns:1fr}.svc-check{min-height:54px}}

/* privacy notice under submit buttons + accessible submit states (02.09.26 v4) */
.form-foot .privacy-note{flex-basis:100%;order:3;margin:2px 0 0;font-size:13px;line-height:1.55;color:var(--w-faint)}
.form-foot .privacy-note a{color:var(--gold);border-bottom:1px solid rgba(197,165,90,.4)}
.form-foot .privacy-note a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.form-err:focus{outline:2px solid var(--gold);outline-offset:3px}
form[aria-busy="true"] button[type="submit"]{cursor:progress}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}


/* skip link, focus landmark, accessible error and fieldset states (02.09.26 a11y pass) */
.skip-link{position:absolute;left:-9999px;top:12px;z-index:10000;padding:12px 18px;background:var(--gold);color:var(--navy);font-weight:700;font-size:14px;letter-spacing:.04em;text-decoration:none;border-radius:4px}
.skip-link:focus{left:12px;outline:3px solid #fff;outline-offset:2px}
main{scroll-margin-top:84px}
main:focus{outline:none}
[aria-invalid="true"]{border-color:#E88B7D!important;box-shadow:0 0 0 1px rgba(232,139,125,.45)}
fieldset.field{border:0;padding:0;margin:0;min-width:0}
fieldset.field>legend{padding:0;font-family:'Outfit';font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-weight:500}

/* footer links: explicit high-contrast focus state (gold on navy 7.4:1) */
footer a:focus-visible{outline:2px solid var(--gold);outline-offset:2px;color:var(--white)}

/* ---- speakers discovery cleanup (03.09.26) ----
   Directory banner service-options paragraph, the generic More Talent link
   and the /for-brands lead link: inline links are underlined (not colour
   alone) and carry an explicit focus ring. --char-faint was raised from .5
   to .66 alpha so faint text on the grey band clears 4.5:1. */
.hero .dir-options{font-size:clamp(14px,1.25vw,16.5px);color:var(--w-dim);max-width:46em;margin:-8px 0 24px;line-height:1.6}
.hero.compact .dir-options{margin:-8px 0 24px}
.dir-options a{color:var(--white);text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:1.5px;text-underline-offset:3px}
.dir-options a:hover{text-decoration-color:var(--white)}
.dir-options a:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
.more-talent-speakers{margin:20px 0 0;font-size:14px;color:var(--char-dim)}
.more-talent-speakers-link{color:var(--char);text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:1.5px;text-underline-offset:3px}
.more-talent-speakers-link:hover{text-decoration-color:var(--char)}
.more-talent-speakers-link:focus-visible{outline:2px solid var(--navy);outline-offset:3px;border-radius:2px}
a.spk-link{text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:1.5px;text-underline-offset:3px}
a.spk-link:hover{text-decoration-color:currentColor}
a.spk-link:focus-visible{outline:2px solid var(--navy);outline-offset:3px;border-radius:2px}

/* Talent directory booking flow: three steps, not the component default of four.
   Scoped by id, so the stacked mobile rule below must be scoped too -- an id
   beats the plain .steps-flow rule in the 900px media query. */
#how-booking-works .steps-flow{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){#how-booking-works .steps-flow{grid-template-columns:1fr}}
/* The only link inside a CTA-band promise line (talent directory). Gold, so it
   is distinguishable from the surrounding text rather than colour-only. */
.cta-band .promise a{color:var(--gold);border-bottom:1px solid rgba(197,165,90,.45)}
.cta-band .promise a:hover{border-bottom-color:var(--gold)}


/* ---- footer rebuild ------------------------------------------------------
   Five areas: brand, contact, explore, book, newsletter. Contact and
   newsletter are given more width so addresses and the form do not wrap.
   align-items:start stops short columns stretching and leaving dead space. */
/* The site header is styled off the bare `nav` element, so the semantic
   <nav> landmarks inside the footer inherited position:fixed and z-index:100
   and sat on top of the burger. Reset every property that rule sets. */
footer nav{position:static;top:auto;left:auto;right:auto;z-index:auto;display:block;
  align-items:initial;gap:0;padding:0;background:none;border-bottom:0}
footer{padding:56px 0 28px}
.f-grid{grid-template-columns:1.3fr 1.15fr .7fr .78fr 1.28fr;gap:34px 30px;
  align-items:start;margin-bottom:30px}
.f-col .f-h,.f-brand .f-h,.f-news .f-h{margin-bottom:12px}
.f-links a,.f-col a{display:block;font-size:13px;color:var(--w-faint);padding:4px 0;
  transition:color .4s var(--ease)}
.f-contact p{margin:0 0 4px}
.f-contact a{display:block;padding:3px 0}
.f-contact .f-sub{color:var(--w-faint);font-size:12px;letter-spacing:.02em;margin-top:12px}
/* the one prominent action in the footer */
.f-cta{display:inline-flex!important;align-items:center;gap:7px;margin-top:14px;
  font-family:'Outfit',sans-serif;font-weight:600;font-size:12.5px;letter-spacing:.04em;
  color:var(--gold)!important;border-bottom:1px solid rgba(197,165,90,.45);padding:0 0 3px!important}
.f-cta:hover{color:var(--white)!important;border-bottom-color:var(--white)}
/* compact socials, labels kept */
.socials{gap:6px;flex-wrap:wrap;margin-top:14px}
.socials a{font-size:9.5px;letter-spacing:.08em;padding:5px 7px;border-radius:5px;white-space:nowrap}
/* bottom row, under a subtle divider */
.f-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;
  border-top:1px solid var(--w-hair);padding-top:18px;margin-top:6px}
.f-bottom a,.f-bottom .cc-manage{font-size:12px;color:var(--w-faint);text-decoration:none;
  margin:0!important;display:inline-block!important;padding:2px 0}
.f-bottom a:hover,.f-bottom .cc-manage:hover{color:var(--white)}
.f-copy{font-size:12px;color:var(--w-faint);margin-left:auto}
.ack{border-top:0;padding-top:16px;margin-top:2px}

@media (max-width:900px){
  /* order per brief: brand, book, explore, contact, newsletter, bottom row */
  .f-grid{grid-template-columns:1fr;gap:26px}
  .f-brand{order:1}
  .f-contact{order:4}
  .f-explore{order:3}
  .f-book{order:2}
  .f-news{order:5}
  .f-links a,.f-col a,.f-contact a{padding:7px 0}
  .f-cta{padding-top:4px!important;padding-bottom:6px!important}
  .f-news form{flex-direction:column;gap:10px}
  .f-news form .btn{width:100%;justify-content:center}
  .f-news input{width:100%}
  .f-bottom{gap:6px 18px}
  .f-copy{margin-left:0;width:100%}
}

/* ---- mobile menu: it could not be scrolled ------------------------------
   The panel had overflow-y:visible with justify-content:center, so once the
   links were taller than the viewport they were clipped at BOTH ends and
   nothing could reach them (measured at 360x640, 390x664 and in landscape,
   where the first link sat 102px above the top of the screen).
   'safe center' keeps the centred look but falls back to flex-start instead
   of overflowing once the content is too tall; the plain 'center' above it is
   the fallback for browsers without safe alignment.
   The lock also leaked: overflow:hidden on body does not stop the page
   scrolling because the scrolling element is <html>, so the class is now set
   on both (see src/script.js). */
.m-menu{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  justify-content:center;justify-content:safe center}
html.menu-open,html.menu-open body{overflow:hidden}