:root{--ink:#182420;--evergreen:#123A30;--evergreen2:#0e2f27;--spark:#E08A4F;--spark-d:#A8541F;--paper:#FAF7F1;--mist:#EAF0EC;--hair:#E4DFD5;--muted:#5C6B63;--white:#fff;
--serif:'Fraunces',Georgia,'Times New Roman',serif;--sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--mono:'Manrope',system-ui,sans-serif;--maxw:1180px;}
*{box-sizing:border-box;}html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.62;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.14;letter-spacing:-.01em;margin:0 0 .5em;}
h1{font-size:clamp(2.1rem,4.6vw,3.4rem);}h2{font-size:clamp(1.55rem,3vw,2.3rem);}h3{font-size:1.18rem;}
p{margin:0 0 1rem;}a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:700;color:var(--spark-d);margin:0 0 14px;}
.lede{font-size:1.12rem;color:var(--muted);max-width:62ch;}
.btn{display:inline-flex;align-items:center;gap:.5em;font-weight:600;font-size:.95rem;padding:.85em 1.4em;border-radius:999px;border:1.5px solid transparent;cursor:pointer;transition:.18s;}
.btn-primary{background:var(--spark);color:#2a1608;}.btn-primary:hover{background:var(--spark-d);color:#fff;}
.btn-outline{border-color:rgba(255,255,255,.5);color:#fff;}.btn-outline:hover{background:rgba(255,255,255,.12);}
.btn-dark{background:var(--evergreen);color:#fff;}.btn-dark:hover{background:var(--evergreen2);}
.btn-ghost{border-color:var(--evergreen);color:var(--evergreen);}.btn-ghost:hover{background:var(--evergreen);color:#fff;}
.ribbon{background:var(--ink);color:#f4efe6;font-size:.78rem;text-align:center;padding:8px 16px;}.ribbon b{color:var(--spark);}
header.site{position:sticky;top:0;z-index:50;background:rgba(250,247,241,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--hair);}
.nav{display:flex;align-items:center;justify-content:space-between;height:74px;}
.brand{display:flex;align-items:center;gap:11px;}
.brand .wm{font-family:var(--mono);font-weight:800;font-size:1.35rem;letter-spacing:-.02em;}
.brand .pr{color:var(--spark);margin-left:.12em;}
nav.menu{display:flex;align-items:center;gap:24px;font-size:.93rem;font-weight:500;}
nav.menu a:hover{color:var(--evergreen);}
.has-caret::after{content:"▾";font-size:.7em;margin-left:5px;color:var(--muted);}
.navcta{padding:.58em 1.1em;font-size:.88rem;}
.menu-toggle{display:none;background:none;border:1.5px solid var(--evergreen);border-radius:8px;padding:8px 12px;font-weight:600;color:var(--evergreen);cursor:pointer;}
section{padding:66px 0;}
.section-head{max-width:64ch;margin-bottom:38px;}.center{text-align:center;margin-left:auto;margin-right:auto;}
.hero{position:relative;background:linear-gradient(160deg,var(--evergreen),var(--evergreen2));color:#f2f4f0;overflow:hidden;}
.hero::after{content:"";position:absolute;right:-120px;top:-120px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(224,138,79,.26),transparent 68%);}
.hero .wrap{padding:80px 24px 88px;position:relative;z-index:2;}
.hero h1{color:#fff;max-width:17ch;}.hero h1 .accent{color:var(--spark);}
.hero .lede{color:#d6e0da;font-size:1.16rem;}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px;}
.crumb{color:#b9c8c0;font-size:.82rem;margin-bottom:20px;}.crumb a:hover{color:#fff;}
.hero-meta{margin-top:38px;display:flex;gap:32px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.16);padding-top:20px;color:#c4d2cb;font-size:.88rem;}
.hero-meta b{color:#fff;font-family:var(--serif);font-size:1.05rem;display:block;}
/* marquee */
.mqsec{background:var(--white);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);padding:44px 0;}
.mqsec .cap{text-align:center;text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:700;color:var(--muted);margin-bottom:26px;}
.mq{overflow:hidden;position:relative;padding:8px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);}
.mq .track{display:flex;width:max-content;animation:mqs 44s linear infinite;}
.mq.rev .track{animation-direction:reverse;animation-duration:52s;}
.mq .pub{font-family:var(--serif);font-weight:600;font-size:1.6rem;color:#6f7d75;white-space:nowrap;padding-right:32px;display:flex;align-items:center;}
.mq .pub::after{content:"✦";color:#d3b499;font-size:.7em;margin-left:32px;}
@keyframes mqs{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mqnote{text-align:center;color:var(--muted);font-size:.82rem;margin-top:24px;font-style:italic;max-width:70ch;margin-left:auto;margin-right:auto;}
@media(prefers-reduced-motion:reduce){.mq .track{animation:none;}}
/* tracks / cards */
.track-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.track2{background:var(--white);border:1px solid var(--hair);border-radius:18px;padding:32px;transition:.2s;}
.track2:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(18,58,48,.10);}
.track2 .tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--spark-d);margin-bottom:12px;}
.track2 ul{margin:14px 0 20px;padding-left:1.1em;color:var(--muted);font-size:.95rem;}.track2 ul li{margin-bottom:6px;}
.track2 .go{font-weight:600;color:var(--evergreen);font-size:.92rem;}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.svc{background:var(--white);border:1px solid var(--hair);border-radius:14px;padding:26px;transition:.2s;}
.svc:hover{border-color:var(--evergreen);transform:translateY(-3px);}
.svc .ic{width:42px;height:42px;border-radius:11px;background:var(--mist);display:flex;align-items:center;justify-content:center;margin-bottom:15px;color:var(--evergreen);font-size:1.2rem;}
.svc h3{margin-bottom:8px;}.svc p{color:var(--muted);font-size:.92rem;margin:0;}
.mist{background:var(--mist);}.white{background:var(--white);}
.why{background:var(--evergreen);color:#eef2ef;}.why h2{color:#fff;}.why .lede{color:#cdd9d2;}
.why-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:46px;align-items:center;}
.why-point{display:flex;gap:14px;margin-bottom:16px;}.why-point .n{font-family:var(--serif);color:var(--spark);font-size:1.3rem;line-height:1;}
.why-point p{color:#d3ddd7;font-size:.95rem;margin:0;}.why-point b{color:#fff;font-family:var(--serif);font-weight:600;}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.step .num{font-family:var(--serif);font-size:2.1rem;color:var(--spark);line-height:1;}
.step h3{font-size:1.05rem;margin:10px 0 6px;}.step p{color:var(--muted);font-size:.9rem;margin:0;}
/* work cards */
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.work-card{border:1px solid var(--hair);border-radius:14px;overflow:hidden;background:var(--white);}
.work-shot{aspect-ratio:16/10;background:linear-gradient(135deg,#16463a,#0f342b);display:flex;align-items:center;justify-content:center;color:#cdece0;font-family:var(--serif);font-size:1.05rem;text-align:center;padding:16px;border-bottom:1px solid var(--hair);}
.work-body{padding:20px;}.work-body .k{font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--spark-d);}
.work-body h3{font-size:1.05rem;margin:8px 0;}.work-body p{color:var(--muted);font-size:.88rem;margin:0;}
.pubrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.pubrow span{font-size:.72rem;color:var(--muted);border:1px solid var(--hair);border-radius:999px;padding:3px 10px;}
/* team */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.member{background:var(--white);border:1px solid var(--hair);border-radius:16px;overflow:hidden;}
.member .ph{width:100%;aspect-ratio:1;object-fit:cover;object-position:center top;display:block;background:var(--mist);}
.member .mb{padding:20px;}
.member .nm{font-family:var(--serif);font-weight:600;font-size:1.15rem;}
.member .rl{color:var(--spark-d);font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin:2px 0 10px;}
.member .bio{color:var(--muted);font-size:.9rem;margin:0;}
/* consultation */
.consult{background:var(--evergreen);color:#eef2ef;}
.consult h2{color:#fff;}
.consult-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:stretch;}
.cform{background:var(--paper);color:var(--ink);border-radius:18px;padding:30px;}
.cform h3{color:var(--evergreen);}
.field{margin-bottom:14px;}.field label{display:block;font-size:.8rem;font-weight:600;margin-bottom:5px;color:var(--ink);}
.field input,.field select,.field textarea{width:100%;padding:.7em .85em;border:1px solid var(--hair);border-radius:10px;font-family:var(--sans);font-size:.92rem;background:#fff;color:var(--ink);}
.field.row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.cbook{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:30px;display:flex;flex-direction:column;}
.cbook h3{color:#fff;}
.cbook .slotbox{flex:1;border:1px dashed rgba(255,255,255,.28);border-radius:12px;margin:16px 0;padding:20px;display:flex;flex-direction:column;gap:10px;justify-content:center;}
.slot{background:rgba(255,255,255,.08);border-radius:8px;padding:10px 14px;font-size:.85rem;color:#dbe6e0;display:flex;justify-content:space-between;}
.trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px;color:#c4d2cb;font-size:.82rem;}
/* insights */
.insights-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.post{border-top:2px solid var(--evergreen);padding-top:16px;}
.post .meta{font-size:.74rem;color:var(--muted);letter-spacing:.04em;text-transform:uppercase;}
.post h3{font-size:1.1rem;margin:9px 0;}.post a.read{font-weight:600;color:var(--evergreen);font-size:.86rem;}
/* in the news / appearances */
.appear-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.appear{background:var(--white);border:1px solid var(--hair);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:.2s;}
.appear:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(18,58,48,.09);}
.appear .bar{background:var(--evergreen);color:#cfe0d8;padding:12px 18px;display:flex;align-items:center;gap:10px;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;}
.appear .play{width:26px;height:26px;border-radius:50%;background:var(--spark);color:#2a1608;display:flex;align-items:center;justify-content:center;font-size:.66rem;flex:0 0 auto;}
.appear .ab{padding:20px;flex:1;display:flex;flex-direction:column;}
.appear .show{font-family:var(--serif);font-weight:600;font-size:1.12rem;margin-bottom:4px;}
.appear .topic{color:var(--muted);font-size:.9rem;margin-bottom:14px;flex:1;}
.appear .meta{font-size:.78rem;color:var(--muted);border-top:1px solid var(--hair);padding-top:12px;display:flex;justify-content:space-between;align-items:center;}
.appear .listen{color:var(--evergreen);font-weight:600;}
/* faq */
.faq{max-width:820px;margin:0 auto;}
.faq details{border-bottom:1px solid var(--hair);padding:16px 0;}
.faq summary{font-family:var(--serif);font-size:1.08rem;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;}
.faq summary::after{content:"+";color:var(--spark-d);font-weight:700;}
.faq details[open] summary::after{content:"–";}
.faq p{color:var(--muted);margin:12px 0 0;font-size:.95rem;}
/* newsletter popup */
.np{position:fixed;inset:0;background:rgba(18,36,32,.55);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;z-index:200;padding:20px;}
.np.show{display:flex;animation:npf .3s ease;}
@keyframes npf{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}
.np-card{background:var(--paper);border-radius:20px;max-width:440px;width:100%;padding:38px 34px 30px;position:relative;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.32);}
.np-x{position:absolute;top:12px;right:16px;background:none;border:none;font-size:1.7rem;color:var(--muted);cursor:pointer;line-height:1;}
.np-mark{width:56px;height:56px;border-radius:16px;background:var(--evergreen);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;}
.np-sub{color:var(--muted);font-size:.95rem;}
.np-form{display:flex;gap:8px;margin:18px 0 10px;}
.np-form input{flex:1;padding:.78em .9em;border:1px solid var(--hair);border-radius:10px;font-family:var(--sans);font-size:.92rem;}
.np-fine{font-size:.74rem;color:var(--muted);}
/* sticky fab */
.fab{position:fixed;right:22px;bottom:22px;z-index:150;background:var(--spark);color:#2a1608;font-weight:600;font-size:.9rem;padding:.8em 1.3em;border-radius:999px;box-shadow:0 10px 30px rgba(224,138,79,.42);display:inline-flex;align-items:center;gap:.5em;transition:.18s;}
.fab:hover{background:var(--spark-d);color:#fff;transform:translateY(-2px);}
/* subscribe band */
.subwrap{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;background:var(--evergreen);color:#eef2ef;border-radius:16px;padding:24px 28px;margin-top:26px;}
.subwrap b{color:#fff;}
.subform{display:flex;gap:8px;}
.subform input{padding:.72em .9em;border:1px solid rgba(255,255,255,.25);border-radius:10px;background:rgba(255,255,255,.1);color:#fff;min-width:210px;}
.subform input::placeholder{color:#a9bcb3;}
/* footer newsletter */
.foot-news{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:26px;margin-bottom:30px;}
.foot-news b{color:#fff;font-family:var(--serif);font-weight:600;font-size:1.15rem;display:block;}
.foot-news span{color:#9fb3a9;font-size:.86rem;}
.foot-news form{display:flex;gap:8px;}
.foot-news input{padding:.65em .85em;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:rgba(255,255,255,.08);color:#fff;min-width:210px;}
.foot-news input::placeholder{color:#8fa79c;}
/* testimonials + assurance */
.tgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:920px;margin-left:auto;margin-right:auto;}
.tcard{background:var(--paper);border:1px solid var(--hair);border-radius:16px;padding:26px;}
.tcard .stars{color:var(--spark);letter-spacing:2px;font-size:.95rem;margin-bottom:12px;}
.tcard .q{font-family:var(--serif);font-size:1.05rem;line-height:1.5;color:var(--ink);margin-bottom:16px;}
.tcard .who b{display:block;font-size:.92rem;}
.tcard .who span{color:var(--muted);font-size:.82rem;}
.assure{display:flex;gap:20px;flex-wrap:wrap;margin-top:16px;color:#cdd9d2;font-size:.86rem;}
.assure span{display:inline-flex;align-items:center;gap:.45em;}
/* footer */
footer.site{background:var(--evergreen2);color:#cdd9d2;font-size:.9rem;}
footer.site .wrap{padding:54px 24px 28px;}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:30px;}
footer.site h4{font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:#8fa79c;margin-bottom:13px;}
footer.site a{display:block;color:#cdd9d2;padding:4px 0;}footer.site a:hover{color:#fff;}
.foot-brand p{color:#9fb3a9;font-size:.86rem;max-width:34ch;margin-top:12px;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:34px;padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;color:#8fa79c;font-size:.82rem;}
@media(max-width:900px){.track-grid,.svc-grid,.work-grid,.steps,.insights-grid,.why-grid,.consult-grid,.foot-grid,.team-grid,.appear-grid,.tgrid{grid-template-columns:1fr 1fr;}nav.menu{display:none;}.menu-toggle{display:block;}}
@media(max-width:560px){.svc-grid,.work-grid,.steps,.insights-grid,.foot-grid,.team-grid,.appear-grid,.tgrid,.field.row{grid-template-columns:1fr;}section{padding:48px 0;}}

/* selected coverage grid */
.cov-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.cov{display:flex;flex-direction:column;gap:9px;background:var(--white);border:1px solid var(--hair);border-radius:12px;padding:20px;transition:.18s;}
.cov:hover{border-color:var(--evergreen);transform:translateY(-3px);box-shadow:0 12px 30px rgba(18,58,48,.09);}
.cov-pub{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--spark-d);}
.cov-hl{font-family:var(--serif);font-size:1.02rem;line-height:1.3;color:var(--ink);flex:1;}
.cov-go{font-size:.82rem;font-weight:600;color:var(--evergreen);}
.hs-sent,.hs-err{border-radius:10px;padding:12px 16px;margin-bottom:16px;font-size:.92rem;}
.hs-sent{background:#e6f2ea;border:1px solid #bcd9c7;color:#14432a;}
.hs-err{background:#fbe9e0;border:1px solid #f0c9b6;color:#7a3312;}
@media(max-width:900px){.cov-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.cov-grid{grid-template-columns:1fr;}}

/* header dropdown menus */
.drop{position:relative;display:flex;align-items:center;height:74px;}
.drop-menu{position:absolute;top:100%;left:0;min-width:252px;background:var(--paper);border:1px solid var(--hair);border-radius:12px;box-shadow:0 16px 40px rgba(18,58,48,.14);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.16s;z-index:60;}
.drop:hover .drop-menu,.drop:focus-within .drop-menu{opacity:1;visibility:visible;transform:translateY(0);}
.drop-menu a{display:block;padding:9px 12px;border-radius:8px;font-size:.9rem;color:var(--ink);white-space:nowrap;font-weight:500;}
.drop-menu a:hover{background:var(--mist);color:var(--evergreen);}
.drop-menu a.drop-all{color:var(--spark-d);font-weight:600;border-top:1px solid var(--hair);margin-top:4px;border-radius:0;}

/* press-logo marquee (colour on hover, pause on hover) */
.mqlogo{display:inline-flex;align-items:center;flex:0 0 auto;padding:0 30px;}
.mqlogo img{height:26px;width:auto;transition:transform .22s ease;}
.mqlogo:hover img{transform:scale(1.07);}
.mq:hover .track{animation-play-state:paused;}
@media (max-width:640px){.mqlogo{padding:0 20px;}.mqlogo img{height:21px;}}
/* header dropdown: open on tap for touch / no-hover devices */
.drop.open .drop-menu{opacity:1;visibility:visible;transform:none;}

.foot-legal{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.10);font-size:.72rem;line-height:1.5;color:rgba(243,246,243,.45);max-width:90ch;}

.hs-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none;}

/* ---------------------------------------------------------------------------
 * Blog / single post — matches the marketing site (single.php, body.hs-post)
 * ------------------------------------------------------------------------- */
.hs-post{background:var(--paper);}
.wrap-narrow{max-width:760px;margin:0 auto;padding:0 24px;}
.post-hero{background:linear-gradient(170deg,var(--mist),var(--paper));border-bottom:1px solid var(--hair);position:relative;overflow:hidden;}
.post-hero::after{content:"";position:absolute;right:-120px;top:-140px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(224,138,79,.12),transparent 68%);pointer-events:none;}
.post-hero .wrap-narrow{padding:54px 24px 44px;position:relative;z-index:2;}
.post-crumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:.8rem;color:var(--muted);margin-bottom:20px;}
.post-crumb a{color:var(--muted);text-decoration:none;}
.post-crumb a:hover{color:var(--spark-d);}
.post-crumb span{opacity:.6;}
.post-crumb .post-crumb-cur{color:var(--ink);opacity:1;}
.post-eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:700;color:var(--spark-d);margin:0 0 14px;}
.post-title{font-family:var(--serif);font-weight:600;line-height:1.1;letter-spacing:-.01em;color:var(--ink);font-size:clamp(1.9rem,4.4vw,2.9rem);margin:0 0 18px;max-width:20ch;}
.post-meta{display:flex;align-items:center;flex-wrap:wrap;gap:10px;color:var(--muted);font-size:.9rem;}
.post-meta .post-dot{opacity:.5;}
.post-feat{margin:34px 0 0;}
.post-feat img{width:100%;height:auto;border-radius:16px;display:block;box-shadow:0 18px 50px rgba(18,58,48,.12);}
.post-body{padding:44px 0 72px;}
.post-prose{font-size:1.09rem;line-height:1.75;color:#2b352f;}
.post-prose > *:first-child{margin-top:0;}
.post-prose p{margin:0 0 1.25em;}
.post-prose h2{font-family:var(--serif);font-weight:600;color:var(--evergreen);font-size:1.7rem;line-height:1.2;letter-spacing:-.01em;margin:1.9em 0 .55em;}
.post-prose h3{font-family:var(--serif);font-weight:600;color:var(--ink);font-size:1.32rem;line-height:1.25;margin:1.6em 0 .5em;}
.post-prose h4{font-family:var(--sans);font-weight:700;color:var(--ink);font-size:1.05rem;margin:1.5em 0 .4em;}
.post-prose a{color:var(--spark-d);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;}
.post-prose a:hover{color:var(--evergreen);}
.post-prose ul,.post-prose ol{margin:0 0 1.3em;padding-left:1.3em;}
.post-prose li{margin:0 0 .5em;padding-left:.2em;}
.post-prose li::marker{color:var(--spark);}
.post-prose img{max-width:100%;height:auto;border-radius:12px;display:block;margin:1.8em auto;}
.post-prose figure{margin:1.8em 0;}
.post-prose figcaption{font-size:.85rem;color:var(--muted);text-align:center;margin-top:.6em;}
.post-prose blockquote{margin:1.8em 0;padding:6px 0 6px 24px;border-left:3px solid var(--spark);font-family:var(--serif);font-style:italic;font-size:1.2rem;line-height:1.5;color:var(--evergreen);}
.post-prose blockquote p{margin:0 0 .4em;}
.post-prose hr{border:0;border-top:1px solid var(--hair);margin:2.4em 0;}
.post-prose code{font-family:var(--mono);font-size:.9em;background:var(--mist);padding:2px 6px;border-radius:5px;}
.post-prose pre{background:var(--evergreen2);color:#e7efe9;padding:18px 20px;border-radius:12px;overflow:auto;margin:1.6em 0;font-family:var(--mono);font-size:.9rem;line-height:1.6;}
.post-prose pre code{background:none;padding:0;color:inherit;}
.post-prose table{width:100%;border-collapse:collapse;margin:1.8em 0;font-size:.96rem;}
.post-prose th,.post-prose td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--hair);}
.post-prose th{font-family:var(--sans);font-weight:700;color:var(--evergreen);background:var(--mist);}
.post-prose strong{color:var(--ink);font-weight:700;}
.post-tags{margin:38px 0 0;display:flex;flex-wrap:wrap;gap:8px;}
.post-tags a{font-size:.78rem;color:var(--muted);background:var(--mist);border:1px solid var(--hair);padding:5px 12px;border-radius:20px;text-decoration:none;}
.post-tags a:hover{color:var(--spark-d);border-color:var(--spark);}
.post-share{margin:40px 0 0;padding-top:26px;border-top:1px solid var(--hair);}
.post-back{color:var(--spark-d);text-decoration:none;font-weight:600;font-size:.95rem;}
.post-back:hover{color:var(--evergreen);}
@media(max-width:640px){.post-hero .wrap-narrow{padding:40px 20px 34px;}.post-body{padding:34px 0 56px;}.post-prose{font-size:1.05rem;}}

/* ---------------------------------------------------------------------------
 * Animated hero visual — "AI & search visibility" panel
 * (logos slide in -> chart draws up -> numbers count up). GPU-friendly.
 * ------------------------------------------------------------------------- */
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:center;}
.hero-copy{min-width:0;}
.hero-viz{min-width:0;}
.hv-card{background:var(--paper);border-radius:20px;padding:20px 20px 16px;color:var(--ink);box-shadow:0 30px 70px rgba(6,24,19,.40);border:1px solid rgba(255,255,255,.35);transform:translateY(16px);opacity:0;animation:hvIn .7s cubic-bezier(.2,.7,.3,1) .1s forwards;will-change:transform,opacity;}
@keyframes hvIn{to{transform:none;opacity:1;}}
.hv-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;}
.hv-title{font-weight:700;font-size:.94rem;color:var(--evergreen);}
.hv-tag{font-size:.66rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);background:var(--mist);padding:4px 9px;border-radius:20px;white-space:nowrap;}
.hv-logos{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:16px;min-height:18px;}
.hv-logos img{height:15px;width:auto;opacity:0;transform:translateY(7px) scale(.92);animation:hvLogo .5s ease forwards;}
@keyframes hvLogo{to{opacity:1;transform:none;}}
.hv-logos img:nth-child(1){animation-delay:.15s;}
.hv-logos img:nth-child(2){animation-delay:.25s;}
.hv-logos img:nth-child(3){animation-delay:.35s;}
.hv-logos img:nth-child(4){animation-delay:.45s;}
.hv-logos img:nth-child(5){animation-delay:.55s;}
.hv-logos img:nth-child(6){animation-delay:.65s;}
.hv-chart{position:relative;margin:0 -2px 8px;}
.hv-chart svg{width:100%;height:auto;display:block;}
.hv-line{stroke-dasharray:640;stroke-dashoffset:640;animation:hvDraw 1.5s ease .7s forwards;}
@keyframes hvDraw{to{stroke-dashoffset:0;}}
.hv-area{opacity:0;animation:hvArea .9s ease 1.25s forwards;}
@keyframes hvArea{to{opacity:1;}}
.hv-tip{opacity:0;animation:hvTip .35s ease 2.05s forwards, hvPulse 2.6s ease-in-out 2.5s infinite;}
@keyframes hvTip{to{opacity:1;}}
@keyframes hvPulse{0%,100%{r:4.5;}50%{r:7;}}
.hv-stats{display:grid;grid-template-columns:1fr 1fr;gap:13px 16px;border-top:1px solid var(--hair);padding-top:15px;}
.hv-stat{display:flex;flex-direction:column;min-width:0;}
.hv-num{font-family:var(--serif);font-weight:600;font-size:1.5rem;color:var(--evergreen);line-height:1;}
.hv-lab{font-size:.72rem;color:var(--muted);margin-top:4px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.hv-up{font-style:normal;color:#2f9e6d;font-weight:700;font-size:.7rem;}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:34px;}.hero-viz{max-width:440px;}}
@media(prefers-reduced-motion:reduce){.hv-card,.hv-logos img,.hv-line,.hv-area,.hv-tip{animation:none!important;opacity:1!important;transform:none!important;stroke-dashoffset:0!important;}}

/* WebP <picture> wrappers behave as the flex child, same as the bare <img> did */
.mqlogo picture,.hv-logos picture{display:inline-flex;align-items:center;line-height:0;}
/* ==================================================================
   HealthSpark PR — v26 override layer
   Loaded AFTER healthspark.css so nothing in the base file is edited.
   Every rule here fixes a measured defect; nothing is cosmetic.
   ================================================================== */

/* ------------------------------------------------------------------
   0. MOBILE — collapse card grids to one column on phones
   ------------------------------------------------------------------
   The base CSS drops these grids to `1fr 1fr` at 900px but has NO phone
   breakpoint below that. At ~390px two cards jam into the width and the
   second is clipped: Who We Help + Beyond Coverage (.track-grid), the
   consultation form + book-a-call (.consult-grid), the "why specialist"
   02/03 list (.why-grid), plus services, work, team, insights and
   appearances. Collapse them to a single column on phones.
------------------------------------------------------------------ */
@media (max-width: 600px) {
	.track-grid,
	.consult-grid,
	.svc-grid,
	.work-grid,
	.team-grid,
	.insights-grid,
	.why-grid,
	.appear-grid,
	.tgrid,
	.steps {
		grid-template-columns: 1fr !important;
		gap: 20px !important;
	}

	/* The book-a-call slot labels overlap when the panel is squeezed;
	   let the two labels wrap instead of colliding. */
	.slot {
		flex-wrap: wrap;
		gap: 2px 10px;
	}

	/* The 02/03 markers sit beside their text; keep them from overflowing. */
	.why-point {
		gap: 10px;
	}

	/* Section side padding is tight on small screens — give content air. */
	.wrap {
		padding-left: 20px;
		padding-right: 20px;
	}
}

/* Footer can stay two compact columns rather than one very tall stack. */
@media (max-width: 600px) {
	.foot-grid {
		grid-template-columns: 1fr 1fr !important;
		gap: 24px 20px !important;
	}
}

/* ------------------------------------------------------------------
   1. CONTRAST — WCAG AA failures measured on the live site 23 Jul 2026
   ------------------------------------------------------------------
   #A8541F on the three page grounds:
       on #EAF0EC (mist)   3.08:1   needed 4.5:1
       on #FAF7F1 (cream)  3.32:1
       on #FFFFFF (white)  3.56:1
   #A8541F clears 4.5:1 on all three while reading as the same accent.
   The hero eyebrow on #123A30 already passes at 4.73:1 — left alone.
------------------------------------------------------------------ */
:root {
	--hs-accent-on-light: #a8541f;
	--hs-accent-on-dark:  #e08a4f;
	--hs-ink-muted:       #566;
}

.eyebrow,
.mp-lbl,
.section-head .eyebrow,
.work-card .tag,
.appear .kicker {
	color: var(--hs-accent-on-light);
}

/* Hero and any dark-ground section keep the lighter accent. */
.hero .eyebrow,
.brandbg .eyebrow,
[class*="dark"] .eyebrow,
.subwrap .eyebrow {
	color: var(--hs-accent-on-dark);
}

/* Star ratings were 2.48:1 — decorative-looking but they encode a rating. */
.stars,
.rating,
.testimonial .stars {
	color: var(--hs-accent-on-light);
}

/* "Details soon" style muted meta was 2.50:1 on white. */
.appear .meta span,
.meta .muted,
.card-meta {
	color: #5c6b64;
}

/* ------------------------------------------------------------------
   2. FOOTER CTA — 1.83:1, a genuine bug
   ------------------------------------------------------------------
   The mid-page instance of .btn-primary sets #2A1608 and passes.
   The footer instance inherits the footer's light text colour and
   renders pale grey-green on terracotta. Set it explicitly.
------------------------------------------------------------------ */
.site-footer .btn-primary,
footer.site .btn-primary,
.foot-news .btn-primary,
.btn.btn-primary.guide-open {
	color: #2a1608 !important;
	background-color: #e08a4f;
}

.site-footer .btn-primary:hover,
footer.site .btn-primary:hover {
	background-color: #d4793c;
	color: #2a1608 !important;
}

/* ------------------------------------------------------------------
   3. TOUCH TARGETS — 77 elements under 44px (was 106 pre-v25)
------------------------------------------------------------------ */
.btn,
.mp-btn,
.nav a,
.menu > li > a,
.drop a {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}

.drop a {
	padding-block: 11px;
}

/* ------------------------------------------------------------------
   4. MARQUEE — WebP set, and the duplicate row must not double-scroll
------------------------------------------------------------------ */
.mq {
	overflow: hidden;
	position: relative;
}

.mq .track {
	display: flex;
	width: max-content;
	animation: hs-marquee 60s linear infinite;
}

/* Three rows: even rows (row 2) reverse via .mq.rev; give the two forward
   rows (1 and 3) different speeds so they don't scroll in lockstep. */
.mq.mq-row1 .track { animation-duration: 56s; }
.mq.mq-row3 .track { animation-duration: 72s; }

.mq .mq-set {
	display: flex;
	align-items: center;
	gap: 2.5rem;
	padding-inline: 1.25rem;
}

.mq .mqlogo {
	display: block;
	flex: none;
	opacity: .78;
	transition: opacity .2s ease;
}

.mq .mqlogo:hover,
.mq .mqlogo:focus-visible {
	opacity: 1;
}

.mq .mqlogo img {
	height: 34px;
	width: auto;
	display: block;
}

@keyframes hs-marquee {
	from { transform: translate3d(0, 0, 0); }
	to   { transform: translate3d(-50%, 0, 0); }
}

/* Three rows, alternating direction and staggered speed so they never scroll
   in lockstep (the manifest now fills three rows). Explicit shorthands here
   win cleanly over the base .mq .track rule. */
.mq.mq-row1 .track { animation: hs-marquee 58s linear infinite; }
.mq.mq-row2 .track { animation: hs-marquee 66s linear infinite reverse; }
.mq.mq-row3 .track { animation: hs-marquee 62s linear infinite; }

/* Breathing room between the three rows. */
.mqsec .mq + .mq { margin-top: 10px; }

/* Pause on hover so a visitor can actually click a logo. */
.mq:hover .track,
.mq:focus-within .track {
	animation-play-state: paused;
}

/* ------------------------------------------------------------------
   5. OUTCOME STAT BAND — promotes the numbers out of prose
------------------------------------------------------------------ */
.hs-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem 2.5rem;
	margin: 1.75rem 0 0;
	padding: 0;
	list-style: none;
}

.hs-stats li {
	border-left: 3px solid var(--hs-accent-on-dark);
	padding-left: .875rem;
	min-width: 8rem;
}

.hs-stats b {
	display: block;
	font-size: clamp(1.5rem, 3.5vw, 2.125rem);
	line-height: 1.05;
	letter-spacing: -.02em;
	font-variant-numeric: tabular-nums;
}

.hs-stats span {
	display: block;
	margin-top: .3rem;
	font-size: .6875rem;
	letter-spacing: .11em;
	text-transform: uppercase;
	opacity: .75;
}

/* On a light ground the accent bar must be the darker token. */
.hs-stats--light li {
	border-left-color: var(--hs-accent-on-light);
}

/* Compact variant for the index cards — two stats side by side. */
.hs-stats--compact {
	gap: 1rem 1.5rem;
	margin-top: 1rem;
}

.hs-stats--compact li {
	min-width: 5.5rem;
	border-left-width: 2px;
	padding-left: .625rem;
}

.hs-stats--compact b {
	font-size: 1.25rem;
}

.hs-stats--compact span {
	font-size: .625rem;
	letter-spacing: .09em;
}

/* ------------------------------------------------------------------
   5b. CASE-STUDY INDEX — whole card is the link, sections aligned
   ------------------------------------------------------------------
   The two cards drift out of alignment because their content differs
   line-for-line: "BRANDED SEARCHES / MO" wraps to two lines where
   "PUBLICATIONS" is one, the ledes are 2 vs 3 lines, and the chip rows
   differ. Left unmanaged, the stat band, chips and "Read the case
   study" link all sit at different heights between the cards.

   Fix: flex column, fixed minimum heights on each varying row so the
   rows line up, and margin-top:auto to pin the CTA to a shared
   baseline. Cards are already equal height via the grid.
------------------------------------------------------------------ */
.work-card--link {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	transition: border-color .2s ease, box-shadow .2s ease;
}

.work-card--link .work-body {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.work-card--link .work-body > h3 {
	min-height: 3.6em;   /* title: hold up to three lines so stats align */
	margin-bottom: .35rem;
}

.work-card--link .work-body > p {
	min-height: 4.4em;   /* lede: up to three lines */
	margin: 0;
}

/* The stat labels are the main culprit: one line vs two. Force each
   label to reserve two lines so the numbers above them always align. */
.work-card--link .hs-stats--compact {
	min-height: 3.6em;
	align-items: flex-start;
}

.work-card--link .hs-stats--compact span {
	min-height: 2.4em;
	display: flex;
	align-items: flex-start;
}

/* Reserve two chip rows so the CTA baseline matches across cards. */
.work-card--link .pubrow {
	min-height: 4.6em;
	align-content: flex-start;
}

.work-card--link .work-more {
	margin-top: auto;   /* pin to the bottom of both cards */
	padding-top: .5rem;
}

.work-card--link:hover,
.work-card--link:focus-visible {
	border-color: var(--hs-accent-on-light);
	box-shadow: 0 6px 24px rgba(18, 58, 48, .09);
}

.work-more {
	display: inline-block;
	margin-top: 1rem;
	font-weight: 600;
	font-size: .875rem;
	color: var(--hs-accent-on-light);
}

/* ------------------------------------------------------------------
   5c. COVERAGE LIST — identical on both case studies
   ------------------------------------------------------------------
   Publication name + linked, then the article headline. Same markup on
   the haircare and physio pages so the two read as one template.
------------------------------------------------------------------ */
.hs-coverage {
	list-style: none;
	margin: 1.25rem 0 0;
	padding: 0;
}

.hs-coverage li {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .1rem .6rem;
	padding: .7rem 0;
	border-bottom: 1px solid rgba(18, 58, 48, .1);
	font-size: .9375rem;
	line-height: 1.45;
}

.hs-coverage li:last-child {
	border-bottom: 0;
}

.hs-coverage a {
	text-decoration: none;
	flex: none;
}

.hs-coverage a strong {
	color: var(--hs-accent-on-light);
	font-weight: 700;
}

.hs-coverage a:hover strong {
	text-decoration: underline;
}

.hs-coverage .hs-cov-head {
	color: var(--hs-ink-muted, #566);
}

/* Thin em-dash separator between publication and headline. */
.hs-coverage .hs-cov-head::before {
	content: "— ";
	color: var(--line, #cbd5d0);
}

/* ------------------------------------------------------------------
   5c-b. DEEP-LINK ANCHORS — marquee & graph logos jump to a placement
   ------------------------------------------------------------------
   A logo links to /case-studies/<client>/#cov-<key>. Offset the scroll
   target so the sticky header doesn't cover it, and flash the row so the
   visitor sees which placement they landed on.
------------------------------------------------------------------ */
.hs-coverage li {
	scroll-margin-top: 96px;
	border-radius: 4px;
	transition: background-color .6s ease;
}

.hs-coverage li:target {
	background: var(--hs-accent-on-light, #a8541f);
	background: color-mix(in srgb, var(--hs-accent-on-light, #a8541f) 12%, transparent);
	box-shadow: -8px 0 0 color-mix(in srgb, var(--hs-accent-on-light, #a8541f) 12%, transparent);
	animation: hs-target-flash 2.4s ease 1;
}

@keyframes hs-target-flash {
	0%, 55% { background-color: color-mix(in srgb, var(--hs-accent-on-light, #a8541f) 18%, transparent); }
	100%    { background-color: transparent; }
}

/* Clickable graph logos: keep the picture inline and hint interactivity. */
.hv-logos .hv-logo-link {
	display: inline-flex;
	align-items: center;
	cursor: pointer;
}

.hv-logos .hv-logo-link:focus-visible {
	outline: 2px solid var(--hs-accent-on-dark, #e08a4f);
	outline-offset: 3px;
	border-radius: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.hs-coverage li:target { animation: none; }
}

/* ------------------------------------------------------------------
   5d. AI & SEARCH VISIBILITY CARD — one clock drives everything
   ------------------------------------------------------------------
   Previously the line (0.7–2.2s), logos (0.85–1.95s) and count-up
   numbers (1.5–2.8s) each ran on their own timer, so nothing moved in
   sync. This disables all the independent CSS keyframes; healthspark.js
   now drives the line draw, the endpoint dot, each logo's reveal and
   the number count-up from a SINGLE eased progress value over ~3.4s.
   The logos appear exactly as the line climbs past them, at the same
   rate the numbers rise. Slower and locked together, as intended.
------------------------------------------------------------------ */
.hv-logos {
	gap: 20px;
	min-height: 22px;
	margin-bottom: 18px;
}

.hv-logos img {
	height: 19px;
	opacity: 0;                    /* JS fades each one in on cue */
	transform: translateY(8px);
	animation: none !important;    /* JS owns this now */
}

.hv-line { animation: none !important; }
.hv-area { animation: none !important; opacity: 0; }
.hv-tip  { animation: none !important; opacity: 0; }

/* Gentle endpoint pulse, added by JS only once the draw completes. */
.hv-card.hv-done .hv-tip {
	animation: hvPulse 2.6s ease-in-out infinite !important;
	opacity: 1;
}

/* Reduced-motion: no animation, everything shown in its final state. */
@media (prefers-reduced-motion: reduce) {
	.hv-logos img,
	.hv-card,
	.hv-line,
	.hv-area,
	.hv-tip {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
		stroke-dashoffset: 0 !important;
	}
}

/* ------------------------------------------------------------------
   5e. GUIDE CTA BUTTONS — never wrap
   ------------------------------------------------------------------
   "Download the guide →" / "Get the Playbook →" wrapped to two lines in
   their buttons. The labels are shortened at build time; this keeps them
   on one line regardless of container width.
------------------------------------------------------------------ */
.guide-open,
#np-form .btn,
.np-form .btn {
	white-space: nowrap;
}

/* ------------------------------------------------------------------
   5f. 404 — page not found (matches the site's hero language)
------------------------------------------------------------------ */
.nf {
	position: relative;
	overflow: hidden;
	text-align: center;
	background: linear-gradient(160deg, var(--evergreen, #123A30), #0e2f27);
	color: #f2f4f0;
}

/* the same soft spark glow the homepage/case-study heroes use */
.nf::after {
	content: "";
	position: absolute;
	right: -140px;
	top: -140px;
	width: 480px;
	height: 480px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(224, 138, 79, .24), transparent 68%);
	pointer-events: none;
}

.nf .wrap {
	position: relative;
	z-index: 2;
	max-width: 760px;
	padding: 22px 24px 16px;   /* tightened so the "recent wins" marquee clears the fold */
}

.nf-num {
	font-family: var(--serif, 'Fraunces', Georgia, serif);
	font-weight: 600;
	font-size: clamp(4.5rem, 13vw, 8rem);
	line-height: .88;
	letter-spacing: -.03em;
	color: var(--spark, #E08A4F);
	margin: 0 0 2px;
}

.nf h1 {
	color: #fff;
	font-family: var(--serif, 'Fraunces', Georgia, serif);
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	line-height: 1.15;
	max-width: 20ch;
	margin: 0 auto 10px;
	text-wrap: balance;
}

.nf-sub {
	color: #cdd9d2;
	font-size: 1.05rem;
	line-height: 1.55;
	max-width: 52ch;
	margin: 0 auto 18px;
}

.nf-cta {
	display: flex;
	gap: 14px;
	justify-content: center;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.nf-links {
	display: flex;
	gap: 10px 26px;
	justify-content: center;
	flex-wrap: wrap;
	max-width: 540px;
	margin: 0 auto;
	padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, .14);
}

.nf-links a {
	color: #cdd9d2;
	font-size: .9rem;
	text-decoration: none;
	transition: color .2s ease;
}

.nf-links a:hover,
.nf-links a:focus-visible {
	color: var(--spark, #E08A4F);
}

@media (max-width: 600px) {
	.nf .wrap { padding: 17px 20px 16px; }
	.nf-num  { font-size: clamp(3.5rem, 22vw, 6rem); }
}

/* ------------------------------------------------------------------
   5i. 404 "RECENT WINS" MARQUEE — a larger variant that fills the page
   ------------------------------------------------------------------
   Below the 404 hero sits a bigger version of the coverage marquee so a
   lost visitor lands on real placements. Higher specificity (.mqsec.nf-wins)
   overrides the default marquee sizing without touching it elsewhere.
------------------------------------------------------------------ */
.mqsec.nf-wins {
	background: var(--paper, #FAF7F1);
	padding: clamp(28px, 3.5vw, 42px) 0;
	border-top: 1px solid var(--hair, #E4DFD5);
}

.mqsec.nf-wins .cap {
	font-family: var(--serif, "Fraunces", serif);
	font-size: clamp(1.5rem, 3.4vw, 2.25rem);
	font-weight: 600;
	text-transform: none;
	letter-spacing: -.01em;
	color: var(--evergreen, #123A30);
	text-align: center;
	margin-bottom: clamp(24px, 4vw, 38px);
}

.mqsec.nf-wins .mq { margin-bottom: 30px; }
.mqsec.nf-wins .mq:last-child { margin-bottom: 0; }
.mqsec.nf-wins .mqlogo { padding-inline: 1.6rem; }
.mqsec.nf-wins .mqlogo img { height: 52px; }

@media (max-width: 600px) {
	.mqsec.nf-wins { padding: 44px 0; }
	.mqsec.nf-wins .mqlogo img { height: 38px; }
	.mqsec.nf-wins .mqlogo { padding-inline: 1.1rem; }
}

/* ------------------------------------------------------------------
   5g. GRAPH LOGOS — pop on hover, like the marquee
   ------------------------------------------------------------------
   The "AI & search visibility" card's logos deep-link to their
   placement, but sat flat on hover while the marquee logos scaled up.
   healthspark.js drives each IMG's transform/opacity inline (ending at
   transform:none), so a hover rule on the img can never win. Scale the
   LINK wrapper instead — JS never touches it — for the same lift cue,
   plus a soft spark glow that reads on the dark card.
------------------------------------------------------------------ */
.hv-logos .hv-logo-link {
	transition: transform .2s ease, filter .2s ease;
	transform-origin: center;
	will-change: transform;
}

.hv-logos .hv-logo-link:hover,
.hv-logos .hv-logo-link:focus-visible {
	transform: scale(1.18);
	filter: drop-shadow(0 0 8px rgba(224, 138, 79, .45));
	position: relative;
	z-index: 3;
}

@media (prefers-reduced-motion: reduce) {
	.hv-logos .hv-logo-link { transition: none; }
	.hv-logos .hv-logo-link:hover,
	.hv-logos .hv-logo-link:focus-visible { transform: none; }
}

/* ------------------------------------------------------------------
   5h. SEARCH BOX — on the Insights hero and the results/archive pages
   ------------------------------------------------------------------
   A GET form to "/" with name="s" is a standard WordPress search; the
   results render through index.php (the on-brand fallback template).
   Styled light-on-dark to sit on the evergreen hero.
------------------------------------------------------------------ */
.hs-search {
	display: flex;
	gap: 8px;
	margin-top: 22px;
	max-width: 440px;
}

.hs-search input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	padding: 12px 18px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, .28);
	background: rgba(255, 255, 255, .08);
	color: #fff;
	font: inherit;
	font-size: .95rem;
	-webkit-appearance: none;
	appearance: none;
}

.hs-search input[type="search"]::placeholder { color: rgba(255, 255, 255, .6); }

.hs-search input[type="search"]:focus {
	outline: none;
	border-color: var(--spark, #E08A4F);
	background: rgba(255, 255, 255, .14);
}

.hs-search button {
	flex: 0 0 auto;
	padding: 12px 24px;
	border-radius: 999px;
	border: none;
	background: var(--spark, #E08A4F);
	color: #fff;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background .18s ease;
}

.hs-search button:hover,
.hs-search button:focus-visible { background: var(--spark-d, #A8541F); }

@media (max-width: 600px) {
	.hs-search { max-width: none; }
}

/* ------------------------------------------------------------------
   6. FOCUS VISIBILITY — keyboard users
------------------------------------------------------------------ */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 3px solid var(--hs-accent-on-dark);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ------------------------------------------------------------------
   7. MOTION
------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	.mq .track {
		animation: none;
		transform: none;
	}
	.mq {
		overflow-x: auto;
	}
	*, *::before, *::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
	}
}

/* ---- Case-study combined coverage table (Publication / Article / DR / Link / date) ---- */
.cov-wrap{overflow-x:auto;margin-top:14px;-webkit-overflow-scrolling:touch;}
.cov-table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:560px;}
.cov-table th{text-align:left;padding:10px 12px;border-bottom:2px solid var(--ink);font-size:.68rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);white-space:nowrap;}
.cov-table td{padding:12px 12px;border-bottom:1px solid var(--hair);vertical-align:top;}
.cov-table tbody tr:hover{background:var(--mist);}
.cov-table td:first-child{font-weight:600;white-space:nowrap;}
.cov-table td:first-child a{color:var(--ink);text-decoration:none;}
.cov-table td:first-child a:hover{color:var(--evergreen);}
.cov-table .cov-art a{color:var(--muted);text-decoration:none;}
.cov-table .cov-art a:hover{color:var(--evergreen);text-decoration:underline;}
.cov-table td:nth-child(3){text-align:center;font-weight:700;color:var(--evergreen);font-variant-numeric:tabular-nums;}
.cov-table td:nth-child(5){white-space:nowrap;color:var(--muted);font-size:.84rem;}
.cov-table .lk{display:inline-block;font-size:.64rem;font-weight:700;padding:3px 9px;border-radius:20px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;}
.cov-table .lk.df{background:rgba(47,158,109,.15);color:#1f7d52;}
.cov-table .lk.nf{background:var(--mist);color:var(--muted);}
.cov-table .lk.mention{background:rgba(42,109,158,.13);color:#2a6d9e;}
@media(max-width:640px){.cov-table{font-size:.85rem;}.cov-table th,.cov-table td{padding:9px 9px;}}

/* ---- hv-card graph date axis (2021 -> 2026) ---- */
.hv-dates{display:flex;justify-content:space-between;font-size:.64rem;letter-spacing:.06em;color:rgba(234,246,244,.5);margin:3px 2px 0;}
.hv-card:not([id]) .hv-dates span,.hv-dates span{font-variant-numeric:tabular-nums;}

/* ---- Case-study redesign: tighter hero + logos in the coverage table ---- */
/* Trim the dark hero's top/bottom whitespace (base .hero .wrap is 80/88). */
.hero.cs-hero .wrap{padding:40px 24px 52px;}
/* Publication cell: outlet logo to the left of the name. */
.cov-table .cov-pub{white-space:nowrap;}
.cov-table .cov-logo{max-height:20px;max-width:84px;width:auto;height:auto;vertical-align:middle;margin-right:10px;}
.cov-table td.cov-pub a{vertical-align:middle;}
@media(max-width:640px){.cov-table .cov-logo{max-height:17px;max-width:66px;margin-right:7px;}}

/* ---- Homepage: rotating graph carousel (haircare + physio) ---- */
.hv-carousel{position:relative;}
.hv-slide{display:none;}
.hv-slide.is-on{display:block;animation:hvFadeIn .5s ease;}
@keyframes hvFadeIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
/* Hidden carousel slides never trigger IntersectionObserver, so render their
   graph statically visible rather than depending on the JS draw. */
.hv-slide .hv-card{animation:none!important;opacity:1!important;transform:none!important;}
.hv-slide .hv-line{stroke-dashoffset:0!important;animation:none!important;}
.hv-slide .hv-area{opacity:1!important;animation:none!important;}
.hv-slide .hv-tip{opacity:1!important;}
.hv-slide .hv-logos img{opacity:1!important;transform:none!important;}
.hv-cta{display:block;margin-top:16px;text-align:center;font-weight:700;font-size:.86rem;padding:11px 14px;border-radius:12px;background:var(--evergreen);color:#fff!important;text-decoration:none;transition:background .2s ease;}
.hv-cta:hover{background:var(--evergreen2);color:#fff!important;}
.hv-dots{display:flex;justify-content:center;gap:8px;margin-top:14px;}
.hv-dot{width:9px;height:9px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.4);cursor:pointer;transition:background .2s ease,transform .2s ease;}
.hv-dot.is-on{background:var(--spark);transform:scale(1.2);}

/* ---- Homepage: "Coverage won" logo panels replace the work-card top box ---- */
.work-shot.work-shot--logos{aspect-ratio:auto;background:var(--paper);display:flex;flex-direction:column;gap:12px;align-items:flex-start;justify-content:center;padding:20px 22px;border-bottom:1px solid var(--hair);}
.work-shot--logos .ws-cap{font-size:.68rem;text-transform:uppercase;letter-spacing:.11em;font-weight:700;color:var(--hs-accent-on-light);}
.work-shot--logos .ws-logos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 18px;align-items:center;width:100%;}
.work-shot--logos .ws-logo{max-height:22px;max-width:100%;width:auto;height:auto;object-fit:contain;justify-self:center;}
/* ==================================================================
   HealthSpark PR — v27 Notion redesign
   Appended to healthspark.css. Overrides the earthy-green palette
   with Notion-inspired warm-neutral minimalism.
   Every rule has a comment explaining what it changes.
   To revert: delete from this line to end of file, clear cache.
   ================================================================== */

/* ------------------------------------------------------------------
   1. COLOR PALETTE — green→blue, paper→white, orange→blue
   ------------------------------------------------------------------ */
:root {
  --ink:            rgba(0,0,0,0.92);      /* was #182420 */
  --evergreen:      #0075de;               /* was #123A30 → Notion Blue */
  --evergreen2:     #1c1e54;               /* was #0e2f27 → deep indigo */
  --spark:          #0075de;               /* was #E08A4F → Notion Blue */
  --spark-d:        #005bab;               /* was #A8541F → darker blue */
  --paper:          #ffffff;               /* was #FAF7F1 → pure white */
  --mist:           #f6f5f4;               /* was #EAF0EC → warm white */
  --hair:           rgba(0,0,0,0.08);      /* was #E4DFD5 → whisper border */
  --muted:          #615d59;               /* was #5C6B63 → warm gray */
  --white:          #ffffff;               /* unchanged */
  
  /* Keep the existing accessibility overrides from v26 */
  --hs-accent-on-light: #005bab;
  --hs-ink-muted: #615d59;
}

/* ------------------------------------------------------------------
   2. TYPOGRAPHY — Fraunces serif → Inter, tighter letter-spacing
   ------------------------------------------------------------------ */
:root {
  --serif: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

h1, h2, h3, h4 {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-weight: 600;
  line-height: 1.14;
  letter-spacing: -0.02em;
}

h1 { letter-spacing: -0.03em; }
h2 { letter-spacing: -0.02em; }
h3 { font-weight: 600; letter-spacing: -0.01em; }

/* Body text — slightly tighter, more editorial */
body { 
  line-height: 1.55;
  font-weight: 400;
}

/* ------------------------------------------------------------------
   3. BORDER RADIUS — reduce from 14-20px to 4-8px
   ------------------------------------------------------------------ */
.track2,
.svc,
.work-card,
.appear,
.cform,
.cbook,
.consult .cform,
.consult .cbook,
.tcard,
.member,
.np-card,
.subwrap,
.post-feat img {
  border-radius: 6px;
}

/* Cards that were 14-18px */
.work-card,
.track2,
.svc,
.appear,
.member {
  border-radius: 6px;
}

/* Consultation card */
.cform,
.cbook {
  border-radius: 8px;
}

/* Hero viz card */
.hv-card {
  border-radius: 8px;
}

/* ------------------------------------------------------------------
   4. BUTTONS — pill → 4px, blue instead of orange
   ------------------------------------------------------------------ */
.btn,
.btn-primary,
.btn-outline,
.btn-dark,
.btn-ghost,
.navcta,
.fab {
  border-radius: 4px;
}

.btn-primary {
  background: var(--spark);    /* now #0075de */
  color: #fff;
}
.btn-primary:hover {
  background: var(--spark-d);  /* now #005bab */
  color: #fff;
}

.btn-outline {
  border-color: var(--hair);
  color: var(--ink);
}
.btn-outline:hover {
  background: rgba(0,0,0,0.04);
}

.btn-dark {
  background: var(--evergreen);
  color: #fff;
}
.btn-dark:hover {
  background: var(--spark-d);
}

.btn-ghost {
  border-color: var(--hair);
  color: var(--ink);
}
.btn-ghost:hover {
  background: rgba(0,0,0,0.04);
  color: var(--ink);
}

/* Hero CTA buttons */
.hero .btn-outline {
  border-color: rgba(255,255,255,0.3);
  color: #fff;
}
.hero .btn-outline:hover {
  background: rgba(255,255,255,0.08);
}

/* Fixed action button */
.fab {
  background: var(--spark);
  color: #fff;
  box-shadow: 0 4px 18px rgba(0,0,0,0.08), 0 1px 3px rgba(0,0,0,0.04);
  border-radius: 4px;
}
.fab:hover {
  background: var(--spark-d);
}

/* ------------------------------------------------------------------
   5. SHADOWS — whisper multi-layer, Notion-style
   ------------------------------------------------------------------ */
.track2:hover,
.svc:hover,
.appear:hover,
.cov:hover {
  box-shadow: 
    rgba(0,0,0,0.04) 0px 4px 18px,
    rgba(0,0,0,0.02) 0px 2px 7px,
    rgba(0,0,0,0.01) 0px 1px 3px;
  transform: translateY(-2px);
}

.hv-card {
  box-shadow:
    rgba(0,0,0,0.04) 0px 14px 28px,
    rgba(0,0,0,0.03) 0px 7px 15px,
    rgba(0,0,0,0.02) 0px 3px 7px,
    rgba(0,0,0,0.01) 0px 1px 3px;
}

.work-card {
  box-shadow: none;
}
.work-card:hover {
  box-shadow:
    rgba(0,0,0,0.04) 0px 4px 18px,
    rgba(0,0,0,0.02) 0px 2px 7px;
}

/* ------------------------------------------------------------------
   6. HERO SECTION — blue-dark instead of green-dark
   ------------------------------------------------------------------ */
.hero {
  background: linear-gradient(160deg, #1c1e54, #0d1528);
  /* was green gradient; now deep indigo */
}

.hero h1 .accent {
  color: #62aef0;  /* lighter blue instead of orange spark */
}

.hero::after {
  background: radial-gradient(circle, rgba(0,117,222,0.18), transparent 68%);
  /* was orange; now blue tint */
}

/* ------------------------------------------------------------------
   7. MARQUEE SECTION — pure white, lighter borders
   ------------------------------------------------------------------ */
.mqsec {
  background: var(--white);
  border-top: 1px solid var(--hair);
  border-bottom: 1px solid var(--hair);
}

.mq .pub {
  color: var(--muted);
}
.mq .pub::after {
  color: var(--muted);
}

/* ------------------------------------------------------------------
   8. CARDS & SECTIONS — lighter, airier
   ------------------------------------------------------------------ */
.track2,
.svc,
.tcard,
.member {
  background: var(--white);
  border: 1px solid var(--hair);
}

.svc:hover {
  border-color: var(--evergreen);  /* blue instead of green */
}

/* Work cards */
.work-card {
  border: 1px solid var(--hair);
}
.work-shot {
  background: linear-gradient(135deg, #1c1e54, #0d1528);
  color: #cde0f0;
  border-bottom: 1px solid var(--hair);
}

/* ------------------------------------------------------------------
   9. WHY SECTION — indigo instead of dark green
   ------------------------------------------------------------------ */
.why {
  background: #1c1e54;
  color: #eef0f5;
}
.why h2 { color: #fff; }
.why .lede { color: #c5cde0; }
.why-point p { color: #d0d6e8; }
.why-point .n { color: #62aef0; }
.why-point b { color: #fff; }

/* ------------------------------------------------------------------
   10. ACCENT COLORS — orange → blue
   ------------------------------------------------------------------ */
.eyebrow,
.work-body .k,
.track2 .tag,
.post-eyebrow,
.cov-pub {
  color: var(--spark-d);  /* now blue */
}

.work-body .k,
.track2 .tag {
  color: var(--muted);
  font-weight: 600;
}

/* Step numbers */
.step .num { color: var(--spark); }

/* Links */
a.go,
.work-card a,
.post-back,
.cov-go,
.appear .listen {
  color: var(--spark);
}
a.go:hover,
.work-card a:hover { color: var(--spark-d); }

/* Testimonial stars */
.tcard .stars { color: var(--spark); }

/* Post prose links */
.post-prose a { color: var(--spark-d); }

/* ------------------------------------------------------------------
   11. HEADER / NAV
   ------------------------------------------------------------------ */
header.site {
  background: rgba(255,255,255,0.92);
  border-bottom: 1px solid var(--hair);
}
nav.menu a:hover { color: var(--spark); }

/* ------------------------------------------------------------------
   12. CONSULTATION SECTION
   ------------------------------------------------------------------ */
.consult {
  background: #1c1e54;
  color: #eef0f5;
}
.consult h2 { color: #fff; }
.cform {
  background: var(--white);
  border: 1px solid var(--hair);
}
.cform h3 { color: var(--ink); }
.cbook {
  border: 1px solid rgba(255,255,255,0.12);
}
.slot {
  background: rgba(255,255,255,0.06);
}

/* ------------------------------------------------------------------
   13. FOOTER
   ------------------------------------------------------------------ */
footer.site {
  background: #1c1e54;
  color: #c5cde0;
}
footer.site h4 { color: #8895ba; }
footer.site a { color: #c5cde0; }
footer.site a:hover { color: #fff; }
.foot-brand p { color: #a5b0ce; }
.foot-bottom { color: #8895ba; }

/* Newsletter forms in footer */
.foot-news b { color: #fff; }
.foot-news span { color: #a5b0ce; }
.subwrap {
  background: #1c1e54;
}

/* ------------------------------------------------------------------
   14. BLOG / SINGLE POST
   ------------------------------------------------------------------ */
.post-hero {
  background: linear-gradient(170deg, var(--mist), var(--white));
  border-bottom: 1px solid var(--hair);
}
.post-hero::after {
  background: radial-gradient(circle, rgba(0,117,222,0.08), transparent 68%);
}
.post-prose h2 { color: var(--ink); }
.post-prose blockquote {
  border-left-color: var(--spark);
  color: var(--ink);
}

/* ------------------------------------------------------------------
   15. APPEARANCES / PODCAST CARDS
   ------------------------------------------------------------------ */
.appear .bar {
  background: var(--evergreen);
  color: #cde0f0;
}
.appear .play {
  background: var(--spark);
  color: #fff;
}
.appear .show { color: var(--ink); }

/* ------------------------------------------------------------------
   16. ANIMATED HERO PANEL
   ------------------------------------------------------------------ */
.hv-title { color: var(--ink); }
.hv-stat .hv-num { color: var(--ink); }
.hv-cta { color: var(--spark); }
.hv-up { color: var(--spark); }

/* ------------------------------------------------------------------
   17. MISC — newsletter popup, dropdowns, etc.
   ------------------------------------------------------------------ */
.np-card { background: var(--white); }
.np-mark { background: var(--evergreen); }
.drop-menu { background: var(--white); }
.hs-sent { background: #e6f0fa; border-color: #bcd0e8; color: #142d4a; }

/* Ribbon at top */
.ribbon { background: var(--ink); }
.ribbon b { color: var(--spark); }

/* ------------------------------------------------------------------
   18. FINE-TUNE — reduce section padding slightly, cleaner spacing
   ------------------------------------------------------------------ */
section {
  padding: 56px 0;
}

/* Keep the original mobile breakpoint rules from v26 intact below */
/* v27 — work-card links */
.work-card-link { display: block; text-decoration: none; color: inherit; }
.work-card-link:hover .work-card { border-color: var(--evergreen); }

/* v27 — Tawk.to compatibility: prevent FAB + reCAPTCHA overlap */
/* Move the "Book a consultation" FAB up and left so Tawk.to widget has room */
.fab {
  bottom: 90px !important;
  right: 22px !important;
}

/* Reposition reCAPTCHA badge to bottom-left so it does not overlap chat */
.grecaptcha-badge {
  bottom: 14px !important;
  right: auto !important;
  left: 14px !important;
}

/* On mobile, move FAB higher and center it */
@media (max-width: 600px) {
  .fab {
    bottom: 80px !important;
    right: 16px !important;
    font-size: 0.82rem !important;
    padding: 0.7em 1.1em !important;
  }
}

/* v27.1 Notion cleanup */
.btn-primary{color:#fff!important}
.ribbon{color:#eef0f5!important}
.ribbon b{color:#62aef0!important}
.appear .play{background:#0075de!important;color:#fff!important}
.brand .pr{color:#62aef0!important}