/* Auvy Classic — theme stylesheet. Tokens first, then chrome, then one block per widget. */
:root{
  /* Brand palette. Semantic names first; the older names remain as aliases so
     every existing rule keeps working while meaning the new thing. */
  --ink:#171512; --bone:#F5F1E6; --sand:#D8CBA8; --olive:#3D451C;
  --vermilion:#E0431F; --vermilion-deep:#B32F12; --sand-deep:#5A5233;

  /* surfaces */
  --tint:#FAF7EF;            /* barely-there warm panel */
  --sand-2:#C7B78F;          /* borders and rules on sand */
  --line:#E4DCC8;            /* hairlines on bone */
  --line-dark:rgba(245,241,230,.16);
  --white:#FFFDF8;

  /* text */
  --body:#4A443A;            /* long-form text on bone */
  --grey:#5E574B;            /* large secondary statements */
  --muted:#6B6356;           /* captions on bone (never on sand) */
  --ink-2:#171512;

  /* aliases kept so existing rules inherit the new palette */
  --orange:var(--vermilion); --orange-ink:var(--vermilion-deep); --orange-deep:var(--vermilion-deep);

  --ff:'Inter',system-ui,-apple-system,sans-serif; --ff-display:'Bebas Neue','Inter',sans-serif;
  --wrap:1440px; --gut:36px; --r-lg:40px; --r-md:16px; --r-sm:12px;
  --ease:cubic-bezier(.22,1,.36,1); --dur:.7s;
}
*,*::before,*::after{box-sizing:border-box}
/* A component that sets its own display (flex/grid) outranks the user-agent
   [hidden] rule, so a filtered-out card stayed on screen while reporting itself
   hidden. Nothing that carries [hidden] may occupy space. */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bone);color:var(--body);font:400 16px/1.6 var(--ff);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,h5,h6,p,ul,ol,dl,figure{margin:0}
ul,ol{padding:0;list-style:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 14px;z-index:99}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}

/* ---- type ---- */
.eyebrow{display:flex;align-items:center;gap:10px;font:500 16px/1 var(--ff);color:var(--ink);margin-bottom:28px}
.eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--orange);flex:none}
.eyebrow--light{color:#fff}
.display{font:700 clamp(40px,9.5vw,144px)/.86 var(--ff);letter-spacing:-.03em;color:var(--ink-2);overflow-wrap:anywhere}
.display--light{color:#fff}
.display--md{font-size:clamp(34px,6.5vw,96px);line-height:.95}
.display--xl{font-family:var(--ff-display);font-weight:400;font-size:clamp(44px,11vw,160px);line-height:.9;letter-spacing:.005em;text-transform:uppercase}
.statement{font:600 clamp(26px,4.2vw,60px)/1.12 var(--ff);letter-spacing:-.02em;color:var(--grey);max-width:1035px;overflow-wrap:anywhere}
.statement--md{font-size:clamp(28px,3vw,40px)}
.statement--sm{font-size:clamp(22px,2.2vw,28px)}
.lede{font:400 22px/1.36 var(--ff);color:var(--grey);max-width:640px;margin-top:28px}
.lede--wide{max-width:900px}
.sec-head{margin-bottom:60px;position:relative;padding-top:26px}
.sec-head::before{content:"";position:absolute;top:0;left:0;width:72px;height:3px;background:var(--orange);border-radius:2px}
.sec-head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;flex-wrap:wrap}
.sec-note{font:400 14px/1.56 var(--ff);color:var(--muted);max-width:420px}
.sec-head--dark .sec-note{color:rgba(255,255,255,.6)}

/* ---- controls ---- */
.pill{display:inline-flex;align-items:center;gap:14px;height:60px;padding:0 30px;border-radius:50px;font:600 18px/1 var(--ff);letter-spacing:-.01em;transition:background .25s,color .25s,transform .25s var(--ease)}
.pill--white{background:#fff;color:var(--ink)}
.pill--ink{background:var(--ink);color:#fff}
.pill:hover{transform:translateY(-2px)}
.pill--white:hover{background:var(--orange);color:#fff}
.pill--ink:hover{background:var(--orange)}
.pill-arrow{width:12px;height:12px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);transition:transform .25s}
.pill:hover .pill-arrow{transform:rotate(45deg) translate(2px,-2px)}
.tlink{position:relative;display:inline-flex;align-items:center;gap:8px;font:500 16px/1.25 var(--ff);color:var(--ink);padding-bottom:4px}
.tlink::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;transform-origin:left;transition:transform .35s var(--ease)}
.tlink:hover::after{transform:scaleX(0);transform-origin:right}
.tl-arrow{width:8px;height:8px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}

/* ---- header ---- */
.hd{position:fixed;inset:0 0 auto 0;z-index:50;padding:26px 0;transition:background .3s,padding .3s,box-shadow .3s;color:#fff}
.hd-in{display:flex;align-items:center;justify-content:space-between;gap:24px}
.hd .logo{display:block;height:34px}
.hd .logo img,.hd .logo svg{height:100%;width:auto}
.hd .logo-dark{display:none}
.hd-nav{display:flex;gap:34px;font:500 15px/1 var(--ff)}
.hd-nav a{position:relative;padding:8px 0}
.hd-nav a::after{content:"";position:absolute;left:0;bottom:2px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease)}
.hd-nav a:hover::after,.hd-nav a.is-current::after{transform:scaleX(1);transform-origin:left}
.hd-right{display:flex;align-items:center;gap:22px}
.hd-cta{height:44px;padding:0 22px;font-size:15px}
.burger{width:44px;height:44px;display:grid;place-items:center;gap:0;position:relative}
.burger span{position:absolute;left:10px;right:10px;height:2px;background:currentColor;transition:transform .3s,top .3s,opacity .3s;top:17px}
.burger span+span{top:25px}
.burger[aria-expanded=true] span{top:21px;transform:rotate(45deg)}
.burger[aria-expanded=true] span+span{transform:rotate(-45deg)}
.hd.is-solid,.hd.is-dark{background:rgba(245,245,245,.9);backdrop-filter:blur(12px);color:var(--ink);padding:14px 0;box-shadow:0 1px 0 var(--line)}
.hd.is-solid .logo-light,.hd.is-dark .logo-light{display:none}
.hd.is-solid .logo-dark,.hd.is-dark .logo-dark{display:block}
.hd.is-solid .hd-cta,.hd.is-dark .hd-cta{background:var(--ink);color:#fff}
body.admin-bar .hd{top:32px}
@media(max-width:782px){body.admin-bar .hd{top:46px}}
.offc{position:fixed;inset:0;z-index:49;background:var(--ink);color:#fff;padding:120px var(--gut) 40px;display:grid;grid-template-rows:1fr auto;transform:translateY(-100%);transition:transform .5s var(--ease);visibility:hidden}
.offc.is-open{transform:none;visibility:visible}
.offc-nav{display:grid;gap:8px}
.offc-nav a{font:400 clamp(44px,8vw,80px)/1 var(--ff-display);text-transform:uppercase;letter-spacing:.01em;opacity:.9}
.offc-nav a:hover{color:var(--orange)}
.offc-foot{display:flex;flex-wrap:wrap;gap:24px 48px;font-size:15px;color:rgba(255,255,255,.7);padding-top:24px;border-top:1px solid var(--line-dark)}
.offc-foot a:hover{color:#fff}
@media(max-width:1024px){.hd-nav,.hd-cta{display:none}}
@media(min-width:1025px){.burger{display:none}}

/* ---- hero ---- */
.hero{position:relative;min-height:100svh;padding:290px 0 70px;border-radius:0 0 60px 60px;overflow:hidden;color:#fff;display:flex;align-items:flex-end;background:var(--ink)}
.hero-bg{position:absolute;inset:-8% 0;z-index:0}
.hero-bg video,.hero-bg img{width:100%;height:100%;object-fit:cover}
.hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,.05) 40%,rgba(0,0,0,.55) 100%)}
.hero--ov-none::before{display:none}
.hero--ov-soft::before{opacity:.5}
.hero--ov-strong::before{background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.7))}
.hero-in{position:relative;z-index:2;width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,300px);
  grid-template-areas:"top tag" "top ctas" "chips chips";gap:0 40px;align-items:center}
.hero-top{grid-area:top;align-self:center}
.hero-eyebrow{display:inline-block;font:600 22px/1.4 var(--ff);letter-spacing:-.04em;margin-bottom:25px}
.hero-title{font:400 clamp(48px,9.7vw,140px)/.9 var(--ff-display);text-transform:uppercase;letter-spacing:.005em;max-width:1050px}
.hero-tag{grid-area:tag;font:600 22px/1.4 var(--ff);letter-spacing:-.04em;align-self:end;margin:0}
.hero-chips{grid-area:chips;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:60px;padding-top:28px;border-top:1px solid rgba(255,255,255,.25)}
.hero-chips li{display:grid;gap:15px;font:600 18px/1 var(--ff);letter-spacing:-.04em}
.chip-l{position:relative;display:inline}
.chip-l::after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease)}
.chip-l:hover::after{transform:scaleX(1);transform-origin:left}
@media(max-width:600px){:root{--gut:20px}}
@media(max-width:900px){.hero{padding:180px 0 40px;border-radius:0 0 32px 32px}.hero-in{grid-template-columns:1fr;grid-template-areas:"top" "tag" "chips";gap:32px}.hero-chips{grid-template-columns:repeat(2,1fr)}}

/* ---- intro & stats ---- */
.intro{padding:130px 0 120px}
.intro-grid{display:grid;grid-template-columns:minmax(0,1fr)}
.intro-copy .tlink{margin-top:36px}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:100px;padding-top:60px;border-top:1px solid var(--line)}
.stats li{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"v l" "n n" "m m";gap:0 24px;align-content:start}
.stat-v{grid-area:v;font:600 46px/1 var(--ff);letter-spacing:-.03em;color:var(--ink)}
.stat-l{grid-area:l;font:600 18px/1.3 var(--ff);letter-spacing:-.02em;color:var(--ink);align-self:center;max-width:180px}
.stat-n{grid-area:n;font:500 16px/1.5 var(--ff);color:var(--muted);max-width:287px;margin-top:22px}
.stat-marks{grid-area:m;display:flex;flex-wrap:wrap;gap:22px;margin-top:26px;align-items:center}
.stat-marks .mark{height:22px;width:auto;filter:grayscale(1) contrast(1.2);opacity:.75}
@media(max-width:900px){.intro{padding:90px 0 80px}.stats{grid-template-columns:1fr;gap:36px;margin-top:64px}}

/* ---- work ---- */
.work{padding:20px 0 120px}
.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.wcard{background:#fff;border-radius:var(--r-md);padding:6px;transition:transform .5s var(--ease)}
.wcard:hover{transform:translateY(-6px)}
.wcard-img{display:block;aspect-ratio:1476/1040;border-radius:12px;overflow:hidden;background:var(--line)}
.wcard-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.wcard:hover .wcard-img img{transform:scale(1.04)}
.wcard-foot{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 16px;padding:22px 18px 18px;min-width:0}
.wcard-t{font:600 20px/1.2 var(--ff);letter-spacing:-.02em;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.wcard-tag{font:500 14px/1 var(--ff);color:var(--muted);white-space:nowrap}
.work-all{margin-top:48px}
@media(max-width:800px){.work-grid{grid-template-columns:1fr}}

/* ---- services (dark) ---- */
.svc{padding:0 0 0}
.svc-in{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:120px 0 140px}
.svc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-bottom:70px}
.svc-list{border-top:1px solid var(--line-dark)}
.svc-item{border-bottom:1px solid var(--line-dark)}
.svc-btn{width:100%;display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:24px;padding:34px 0;text-align:left;color:#fff}
.svc-n{font:500 16px/1 var(--ff);color:rgba(255,255,255,.55)}
.svc-t{font:600 22px/1.2 var(--ff);letter-spacing:-.02em}
.svc-plus{position:relative;width:18px;height:18px;flex:none}
.svc-plus::before,.svc-plus::after{content:"";position:absolute;background:currentColor;left:0;top:8px;width:18px;height:2px;transition:transform .35s var(--ease)}
.svc-plus::after{transform:rotate(90deg)}
.is-open .svc-plus::after{transform:rotate(0)}
.svc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--ease)}
.is-open .svc-body{grid-template-rows:1fr}
.svc-body-in{overflow:hidden;display:grid;grid-template-columns:70px 285px 1fr auto;gap:24px 40px;align-items:start}
.svc-p{grid-column:2;font:500 16px/1.5 var(--ff);color:rgba(255,255,255,.6);padding-bottom:40px}
.svc-tags{grid-column:3;display:grid;gap:12px;font:500 15px/1 var(--ff);color:rgba(255,255,255,.85)}
.svc-tags li::before{content:"— ";color:var(--orange)}
.svc-side{grid-column:4;display:flex;align-items:center;gap:26px;padding-bottom:40px}
.svc-badge{font:600 15px/1 var(--ff);padding:10px 12px;border:1px solid var(--line-dark);border-radius:30px}
.svc-img{display:block;width:260px;height:140px;border-radius:var(--r-md);overflow:hidden;background:#222}
.svc-img img{width:100%;height:100%;object-fit:cover}
@media(max-width:1024px){.svc-body-in{grid-template-columns:1fr;gap:20px}.svc-p,.svc-tags,.svc-side{grid-column:1}.svc-p{padding-bottom:0}}
@media(max-width:800px){.svc-in{border-radius:28px;padding:80px 0 90px}.svc-btn{grid-template-columns:44px 1fr auto;padding:24px 0}.svc-t{font-size:19px}}

/* ---- partners ---- */
.partners{padding:120px 0}
.partner-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:32px 40px}
.partner-row img{height:28px;width:auto;filter:grayscale(1) contrast(1.15);opacity:.7;transition:opacity .3s,filter .3s}
.partner-row li:hover img{opacity:1;filter:none}
.partner-name{font:600 15px/1 var(--ff);color:var(--ink)}

/* ---- recognition ---- */
.recog{padding:0 0 140px}
.recog .sec-note{font:600 30px/1 var(--ff);color:#2E2D2D;letter-spacing:-.02em}
.recog-list{border-top:1px solid var(--line)}
.recog-list li{display:grid;grid-template-columns:110px 1.4fr 1.2fr auto;align-items:center;gap:24px;min-height:82px;padding:18px 0;border-bottom:1px solid var(--line);font:500 16px/1.3 var(--ff);color:var(--ink)}
.recog-n{color:var(--muted);font-size:15px}
.recog-name{display:flex;align-items:center;gap:14px;font-weight:600;font-size:18px;letter-spacing:-.02em}
.recog-ico{width:20px;height:20px;object-fit:contain}
.recog-detail{color:var(--body)}
.recog-tag{color:var(--muted);font-size:15px}
@media(max-width:800px){.recog-list li{grid-template-columns:60px 1fr;grid-auto-flow:row}.recog-detail,.recog-tag{grid-column:2}}

/* ---- footer ---- */
.ft{background:var(--ink);color:#fff;border-radius:var(--r-lg) var(--r-lg) 0 0;margin-top:0;padding:120px 0 0;overflow:hidden}
.ft-grid{display:grid;grid-template-columns:1.3fr .7fr .9fr;gap:60px 40px;padding-bottom:90px;border-bottom:1px solid var(--line-dark)}
.ft-say{font:700 clamp(44px,5.5vw,80px)/1 var(--ff);letter-spacing:-.035em;max-width:560px}
.ft-h{font:600 18px/1 var(--ff);margin-bottom:26px}
.ft-links{display:grid;gap:12px;font:400 17px/1.3 var(--ff);color:rgba(255,255,255,.8);text-transform:lowercase}
.ft-links a:hover{color:var(--orange)}
.ft-contact{display:grid;gap:14px;font:400 17px/1.4 var(--ff);color:rgba(255,255,255,.8)}
.ft-contact a:hover{color:var(--orange)}
.ft-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:26px 0;font-size:14px;color:rgba(255,255,255,.55)}
.ft-bottom a:hover{color:#fff}
.ft-giant{display:block;text-align:center;font:400 clamp(48px,16.5vw,234px)/.95 var(--ff-display);text-transform:uppercase;color:var(--orange);letter-spacing:.01em;margin-bottom:-.12em;white-space:nowrap}
@media(max-width:900px){.ft{border-radius:28px 28px 0 0;padding-top:80px}.ft-grid{grid-template-columns:1fr;gap:44px;padding-bottom:60px}}

/* ---- page title ---- */
.ptitle{padding:220px 0 70px}
.ptitle--compact{padding:170px 0 40px}
.ptitle--center{text-align:center}
.ptitle--center .eyebrow{justify-content:center}
.ptitle--center .lede{margin-inline:auto}
@media(max-width:900px){.ptitle{padding:150px 0 50px}}

/* ---- marquee ---- */
.marquee{overflow:hidden;padding:40px 0;font:400 clamp(44px,9vw,140px)/1 var(--ff-display);text-transform:uppercase;color:var(--ink-2);white-space:nowrap}
.marquee--dark{background:var(--ink);color:#fff}
.marquee--white{background:#fff}
.marquee--outline{color:transparent;-webkit-text-stroke:1.5px var(--ink-2)}
.marquee--dark.marquee--outline{-webkit-text-stroke-color:#fff}
.marquee-track{display:flex;width:max-content;animation:marq 40s linear infinite}
.marquee-set{display:flex;align-items:center;gap:.35em;padding-right:.35em}
.marquee em{font-style:normal;color:var(--orange);-webkit-text-stroke:0}
@keyframes marq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none}}

/* ---- statement ---- */
.stmt{padding:110px 0}
.stmt--dark{background:var(--ink);color:#fff;border-radius:var(--r-lg)}
.stmt--dark .statement{color:#fff}
.stmt--dark .lede{color:rgba(255,255,255,.65)}
.stmt--dark .eyebrow{color:#fff}
.stmt--white{background:#fff}
.stmt-cta{margin-top:40px}

/* ---- media ---- */
.media{padding:20px 0 100px}
.media-frame{border-radius:var(--r-md);overflow:hidden;background:var(--line)}
.media-inner{height:100%;transform:scale(1.08)}
.media-frame--21-9{aspect-ratio:21/9}.media-frame--16-9{aspect-ratio:16/9}.media-frame--3-2{aspect-ratio:3/2}.media-frame--1-1{aspect-ratio:1}
.media-frame img,.media-frame video{width:100%;height:100%;object-fit:cover}
.media-frame figcaption{padding:14px 4px 0;font-size:14px;color:var(--muted)}

/* ---- counters ---- */
.counters{padding:60px 0 120px}
.counters--dark{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:100px 0}
.counter-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px;border-top:1px solid var(--line);padding-top:50px}
.counters--dark .counter-row{border-color:var(--line-dark)}
.counter-v{display:block;font:600 clamp(48px,6vw,90px)/1 var(--ff);letter-spacing:-.04em;color:var(--ink)}
.counters--dark .counter-v{color:#fff}
.counter-l{display:block;margin-top:16px;font:500 16px/1.4 var(--ff);color:var(--muted)}
.counters--dark .counter-l{color:rgba(255,255,255,.65)}
@media(max-width:800px){.counter-row{grid-template-columns:repeat(2,1fr)}}

/* ---- service boxes ---- */
.sboxes{padding:40px 0 120px}
.sbox-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.sbox-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sbox{background:#fff;border-radius:var(--r-md);padding:40px 36px 36px;display:grid;gap:18px;align-content:start}
.sbox-n{font:500 15px/1 var(--ff);color:var(--muted)}
.sbox-t{font:600 26px/1.15 var(--ff);letter-spacing:-.02em;color:var(--ink)}
.sbox p{font-size:16px;line-height:1.55}
.sbox-list{display:grid;gap:8px;font:500 15px/1.3 var(--ff);color:var(--ink)}
.sbox-list li::before{content:"— ";color:var(--orange)}
.sbox-more{margin-top:8px}
@media(max-width:900px){.sbox-grid,.sbox-grid--3{grid-template-columns:1fr}}

/* ---- team ---- */
.team{padding:20px 0 120px}
.team-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px}
.tcard-img{aspect-ratio:4/5;border-radius:var(--r-md);overflow:hidden;background:#fff;display:grid;place-items:center;margin-bottom:22px}
.tcard-img img{width:100%;height:100%;object-fit:cover}
.mono{font:400 96px/1 var(--ff-display);color:var(--orange)}
.tcard-n{font:600 22px/1.2 var(--ff);letter-spacing:-.02em;color:var(--ink)}
.tcard-r{font:500 15px/1.3 var(--ff);color:var(--muted);margin-top:6px}
.tcard-b{font-size:15px;line-height:1.55;margin-top:14px}
@media(max-width:900px){.team-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.team-grid{grid-template-columns:1fr}}

/* ---- posts ---- */
.posts{padding:20px 0 120px}
.post-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:50px}
.post-filters button{padding:12px 20px;border:1px solid var(--line);border-radius:30px;font:500 15px/1 var(--ff);color:var(--ink);background:#fff;transition:background .25s,color .25s}
.post-filters button.is-on,.post-filters button:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px}
.post-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pcard.is-hidden{display:none}
.pcard-img{display:block;aspect-ratio:3/2;border-radius:var(--r-md);overflow:hidden;background:#fff;margin-bottom:20px}
.pcard-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.pcard:hover .pcard-img img{transform:scale(1.04)}
.pcard-ph{display:block;width:100%;height:100%;background:linear-gradient(135deg,#fff,var(--line))}
.pcard-meta{display:flex;gap:14px;font:500 14px/1 var(--ff);color:var(--muted);margin-bottom:12px}
.pcard-t{font:600 22px/1.25 var(--ff);letter-spacing:-.02em;color:var(--ink)}
.pcard-t a:hover{color:var(--orange-ink)}
@media(max-width:900px){.post-grid,.post-grid--2{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.post-grid,.post-grid--2{grid-template-columns:1fr}}

/* ---- contact ---- */
.contact{padding:20px 0 120px}
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr .6fr;gap:40px;padding:60px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ccol-l{font:500 15px/1 var(--ff);color:var(--muted);margin-bottom:22px;text-transform:uppercase;letter-spacing:.06em}
.ccol-big{font:600 clamp(22px,2.6vw,36px)/1.15 var(--ff);letter-spacing:-.02em;color:var(--ink);word-break:break-word}
.ccol-big:hover{color:var(--orange-ink)}
.ccol-addr{font-style:normal;font:400 18px/1.5 var(--ff);color:var(--ink)}
.ccol-line{display:block;font:400 18px/1.5 var(--ff);color:var(--ink);margin-top:6px}
.ccol .tlink{margin-top:18px}
.ccol-social{display:grid;gap:10px;font:500 18px/1.3 var(--ff);color:var(--ink)}
.ccol-social a:hover{color:var(--orange-ink)}
.cform-wrap{padding-top:90px;max-width:900px}
.cform{display:grid;gap:22px;margin-top:40px}
.cform-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.cform label{display:grid;gap:8px;font:500 14px/1 var(--ff);color:var(--ink)}
.cform input,.cform textarea{width:100%;border:0;border-bottom:1px solid var(--ink);background:transparent;padding:12px 0;font:400 18px/1.4 var(--ff);color:var(--ink);border-radius:0}
.cform input:focus,.cform textarea:focus{outline:0;border-bottom-color:var(--orange)}
.cform .pill{justify-self:start;margin-top:10px}
.hp{position:absolute;left:-9999px}
.form-err{color:var(--orange-ink);font-weight:600}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr;gap:36px}.cform-row{grid-template-columns:1fr}}

/* ---- prose ---- */
.prose-sec{padding:20px 0 120px}
.prose{max-width:760px;margin:0 auto;font-size:18px;line-height:1.7;color:#2E2D2D}
.prose--wide{max-width:960px}
.prose h2{font:600 34px/1.15 var(--ff);letter-spacing:-.02em;color:var(--ink);margin:48px 0 18px}
.prose h3{font:600 24px/1.25 var(--ff);letter-spacing:-.01em;color:var(--ink);margin:36px 0 12px}
.prose p,.prose ul,.prose ol{margin:0 0 20px}
.prose ul{padding-left:22px;list-style:disc}.prose ol{padding-left:22px;list-style:decimal}
.prose a{text-decoration:underline;text-underline-offset:3px}
.prose blockquote{margin:32px 0;padding-left:24px;border-left:3px solid var(--orange);font-size:22px;color:var(--ink)}
.prose img{border-radius:var(--r-sm);margin:28px 0}

/* ---- case header ---- */
.chead{padding:220px 0 60px}
.chead-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:60px;padding-top:30px;border-top:1px solid var(--line)}
.chead-meta dt{font:500 14px/1 var(--ff);color:var(--muted);margin-bottom:10px}
.chead-meta dd{margin:0;font:600 18px/1.3 var(--ff);color:var(--ink)}
@media(max-width:800px){.chead{padding-top:150px}.chead-meta{grid-template-columns:1fr 1fr}}

/* ---- faq ---- */
.faq{padding:20px 0 120px}
.faq-list{border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0;text-align:left;font:600 20px/1.3 var(--ff);letter-spacing:-.01em;color:var(--ink)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.is-open .faq-a{grid-template-rows:1fr}
.faq-a-in{overflow:hidden}
.faq-a p{padding-bottom:26px;max-width:760px;font-size:17px;line-height:1.6}

/* ---- cta ---- */
.cta{padding:0 0 0}
.cta--dark{background:var(--ink);color:#fff;border-radius:var(--r-lg);margin:0 0 120px}
.cta-in{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;flex-wrap:wrap;padding:110px var(--gut)}
.cta--white{background:#fff}
@media(max-width:800px){.cta-in{padding:70px var(--gut)}.cta--dark{border-radius:28px}}

/* ---- single post (non-Elementor fallback) ---- */
.post-hero{padding:200px 0 40px}
.post-hero h1{font:600 clamp(34px,4.5vw,64px)/1.1 var(--ff);letter-spacing:-.03em;color:var(--ink);max-width:960px}
.post-hero .pcard-meta{margin-bottom:24px}
.post-cover{margin:30px 0 50px}
.post-cover img{width:100%;aspect-ratio:21/9;object-fit:cover;border-radius:var(--r-md)}
.post-nav{display:flex;justify-content:space-between;gap:24px;max-width:760px;margin:0 auto;padding-top:40px;border-top:1px solid var(--line)}

/* ---- motion primitives (JS sets the end state; no-JS shows content) ---- */
.js [data-fade]{opacity:0;transform:translateY(24px)}
.js [data-reveal]{opacity:0;transform:translateY(40px)}
.js .is-in{opacity:1;transform:none;transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js [data-split] .w,.js [data-split-lines] .l{display:inline-block;overflow:hidden;vertical-align:bottom}
.js [data-split] .w>span,.js [data-split-lines] .l>span{display:inline-block;transform:translateY(110%)}
.js .is-in.split-done .w>span,.js .is-in .l>span{transform:none;transition:transform 1s var(--ease)}
@media(prefers-reduced-motion:reduce){.js [data-fade],.js [data-reveal]{opacity:1;transform:none}.js [data-split] .w>span,.js [data-split-lines] .l>span{transform:none}}

/* ---- Elementor editor/preview guards ---- */
.elementor-widget:not(:last-child){margin-block-end:0}
.elementor-element{--widgets-spacing:0px 0px}
.e-con,.e-con-inner{max-width:none}
.elementor img{border-radius:inherit}
.elementor .wcard-img img,.elementor .svc-img img,.elementor .pcard-img img,.elementor .tcard-img img,.elementor .media-frame img{height:100%}

/* ---- text section ---- */
.tsec{padding:90px 0}
.tsec--dark{background:var(--ink);color:#fff;border-radius:var(--r-lg)}
.tsec--dark .statement{color:#fff}
.tsec--white{background:#fff}
.tsec-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px 80px;align-items:start}
.tsec-head .statement{max-width:none}
.tsec-body{font-size:18px;line-height:1.65;color:#2E2D2D;max-width:640px}
.tsec--dark .tsec-body{color:rgba(255,255,255,.75)}
.tsec-body p{margin:0 0 18px}
.tsec-list{display:grid;gap:10px;margin:8px 0 18px;font:500 16px/1.4 var(--ff);color:var(--ink)}
.tsec--dark .tsec-list{color:#fff}
.tsec-list li{padding-left:22px;position:relative}
.tsec-list li::before{content:"—";position:absolute;left:0;color:var(--orange)}
.tsec-list a{text-decoration:underline;text-underline-offset:3px}
.tsec-outro{font:500 17px/1.5 var(--ff);color:var(--ink)}
.tsec--dark .tsec-outro{color:#fff}
@media(max-width:900px){.tsec{padding:64px 0}.tsec-grid{grid-template-columns:1fr;gap:28px}}

/* ---- testimonials ---- */
.quotes{padding:20px 0 110px}
.quote-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.qcard{background:#fff;border-radius:var(--r-md);padding:40px 36px;margin:0;display:grid;gap:26px;align-content:space-between}
.qcard-t{font:500 21px/1.4 var(--ff);letter-spacing:-.015em;color:var(--ink)}
.qcard-t::before{content:"“";color:var(--orange);margin-right:2px}
.qcard footer{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap;font:500 15px/1 var(--ff);color:var(--ink)}
.qcard-r{color:var(--muted)}
@media(max-width:800px){.quote-grid{grid-template-columns:1fr}}

/* ---- quick answer ---- */
.quick{padding:0 0 60px}
.quick-panel{background:#fff;border-left:4px solid var(--orange);border-radius:var(--r-md);padding:34px 40px;display:grid;gap:18px}
.quick-l{font:500 13px/1 var(--ff);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.quick-t{font:600 22px/1.35 var(--ff);letter-spacing:-.015em;color:var(--ink);max-width:900px}
.quick-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px 32px;padding-top:12px;border-top:1px solid var(--line)}
.quick-facts dt{font:500 13px/1 var(--ff);color:var(--muted);margin-bottom:6px}
.quick-facts dd{margin:0;font:500 16px/1.45 var(--ff);color:var(--ink)}

/* ---- related links ---- */
.rel{padding:0 0 80px}
.rel-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;padding-top:30px;border-top:1px solid var(--line)}
.rel-l{font:500 14px/1 var(--ff);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;flex:none}
.rel-links{display:flex;flex-wrap:wrap;gap:10px}
.rel-links a{display:inline-block;padding:11px 18px;border:1px solid var(--line);border-radius:30px;background:#fff;font:500 15px/1 var(--ff);color:var(--ink);transition:background .25s,color .25s,border-color .25s}
.rel-links a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ---- key facts card ---- */
.kf{padding:0 0 90px}
.kf-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);background:#fff;border-radius:var(--r-md);padding:6px;gap:0 40px;align-items:center}
.kf-img{aspect-ratio:3/2;border-radius:12px;overflow:hidden;background:var(--line)}
.kf-img img{width:100%;height:100%;object-fit:cover}
.kf-body{padding:30px 34px 30px 0;display:grid;gap:28px;justify-items:start}
.kf-facts{display:grid;gap:16px}
.kf-facts div{display:grid;grid-template-columns:120px 1fr;gap:12px;font:500 16px/1.45 var(--ff)}
.kf-facts dt{color:var(--muted)}
.kf-facts dd{margin:0;color:var(--ink)}
@media(max-width:900px){.kf-card{grid-template-columns:1fr}.kf-body{padding:26px 24px 24px}.kf-facts div{grid-template-columns:1fr}}

/* ---- embed ---- */
.embed{padding:0 0 110px}
.embed-frame{border-radius:var(--r-md);overflow:hidden;background:#fff}
.embed-frame iframe{display:block;width:100%;border:0}
.embed-fb{margin-top:16px}
.ptitle-cta{margin-top:36px}
.lede--light{color:rgba(255,255,255,.7)}
.cform-wrap--solo{padding-top:0}
.embed-gap{height:44px}
.embed-frame{min-height:240px}

/* ======================================================================
   Visual system — surfaces, opening images, hover behaviour.
   Sections alternate between bone, white and sand so a long page has
   rhythm instead of one flat ground; the orange accent appears once per
   block (rule, dot, number or arrow), never as a field of colour.
   ====================================================================== */

/* ---- page opening ---- */
.ptitle{position:relative;padding:220px 0 70px}
.ptitle--cover{padding:260px 0 80px;color:#fff;background:var(--ink);border-radius:0 0 40px 40px;overflow:hidden;margin-bottom:90px}
.ptitle-bg{position:absolute;inset:-8% 0;z-index:0}
.ptitle-bg img{width:100%;height:100%;object-fit:cover}
.ptitle--cover::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,10,10,.72),rgba(10,10,10,.42) 45%,rgba(10,10,10,.8))}
.ptitle-in{position:relative;z-index:2}
.ptitle--cover .display{color:#fff}
.ptitle--cover .lede{color:rgba(255,255,255,.8)}
.ptitle-band{margin:60px 0 0;border-radius:var(--r-md);overflow:hidden;aspect-ratio:21/9;background:var(--line)}
.ptitle-band-in{height:100%;transform:scale(1.1)}
.ptitle-band img{width:100%;height:100%;object-fit:cover}
.ptitle-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:20px 32px;margin-top:54px;padding-top:26px;border-top:1px solid var(--line)}
.ptitle--cover .ptitle-meta{border-color:rgba(255,255,255,.25)}
.ptitle-meta dt{font:500 13px/1 var(--ff);letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.ptitle--cover .ptitle-meta dt{color:rgba(255,255,255,.65)}
.ptitle-meta dd{margin:0;font:600 18px/1.35 var(--ff);color:var(--ink)}
.ptitle--cover .ptitle-meta dd{color:#fff}
@media(max-width:900px){.ptitle--cover{padding:170px 0 56px;margin-bottom:56px}.ptitle-band{margin-top:40px;aspect-ratio:16/10}}

/* ---- text section: sticky label column + photo ---- */
.tsec-head{position:sticky;top:110px}
@media(max-width:900px){.tsec-head{position:static}}
.tsec--img .tsec-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:40px 64px}
.tsec--img .tsec-head{position:static;margin-bottom:22px}
.tsec--img .tsec-body{grid-column:1;max-width:none}
.tsec--img .tsec-head{grid-column:1}
.tsec-img{margin:0;border-radius:var(--r-md);overflow:hidden;aspect-ratio:4/3;background:var(--line);grid-row:1 / span 2;grid-column:2}
.tsec--img-left .tsec-img{grid-column:1;grid-row:1 / span 2}
.tsec--img-left .tsec-head,.tsec--img-left .tsec-body{grid-column:2}
.tsec-img-in{height:100%;transform:scale(1.1)}
.tsec-img img,.tsec-wide img{width:100%;height:100%;object-fit:cover}
.tsec-wide{margin:48px 0 0;border-radius:var(--r-md);overflow:hidden;aspect-ratio:21/9;background:var(--line)}
@media(max-width:900px){.tsec--img .tsec-grid{grid-template-columns:1fr}.tsec-img,.tsec--img-left .tsec-img{grid-column:1;grid-row:auto;aspect-ratio:16/10}}

/* ---- alternating surfaces ---- */
.tsec--white,.sboxes--white,.quotes--white{background:#fff}
.tsec--sand,.sboxes--sand{background:var(--sand)}
.sboxes--sand,.tsec--sand{border-radius:var(--r-lg)}
.sboxes--dark{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:100px 0}
.sboxes--dark .sbox{background:#151515;border:1px solid var(--line-dark)}
.sboxes--dark .sbox-t,.sboxes--dark .sbox-list{color:#fff}
.sboxes--dark .sbox p{color:rgba(255,255,255,.7)}
.sboxes--dark .tlink{color:#fff}

/* ---- cards: lift, accent number, hover arrow ---- */
.sbox{position:relative;overflow:hidden;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.sbox::after{content:"";position:absolute;left:0;top:0;width:0;height:3px;background:var(--orange);transition:width .5s var(--ease)}
.sbox:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(10,10,10,.07)}
.sbox:hover::after{width:100%}
.sbox-n{font:600 13px/1 var(--ff);letter-spacing:.08em;color:var(--body)}
.sbox:hover .sbox-n{color:var(--orange-ink)}
.sbox-img{margin:-40px -36px 6px;aspect-ratio:3/2;overflow:hidden;background:var(--line)}
.sbox-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.sbox:hover .sbox-img img{transform:scale(1.05)}
.sbox-grid--numbered .sbox{background:transparent;padding:32px 0 0;border-top:1px solid var(--line)}
.sbox-grid--numbered .sbox:hover{transform:none;box-shadow:none}
.sbox-grid--numbered .sbox::after{display:none}
.sbox-grid--numbered .sbox-n{font:700 44px/1 var(--ff-display);color:#847A6D;letter-spacing:.02em}
.sbox-grid--numbered .sbox:hover .sbox-n{color:var(--orange-ink)}
.sbox-grid--plain .sbox{background:transparent;padding:0}
.sbox-grid--plain .sbox:hover{transform:none;box-shadow:none}

/* ---- richer quotes ---- */
.qcard{position:relative;overflow:hidden}
.qcard::before{content:"";position:absolute;right:-10px;top:-30px;width:120px;height:120px;background:radial-gradient(circle at 30% 30%,rgba(255,71,29,.10),transparent 70%)}
.qcard-t::before{content:none}
.qcard-t{position:relative;padding-top:34px}
.qcard-t::after{content:"“";position:absolute;left:0;top:-14px;font:700 64px/1 var(--ff);color:var(--orange)}
.qcard-n{position:relative;padding-left:26px}
.qcard-n::before{content:"";position:absolute;left:0;top:.55em;width:16px;height:1px;background:var(--orange)}

/* ---- quick answer panel ---- */
.quick-panel{background:var(--sand);border-left:0;position:relative;padding:38px 44px}
.quick-panel::before{content:"";position:absolute;left:0;top:34px;bottom:34px;width:3px;background:var(--orange);border-radius:2px}
.quick-facts{border-top-color:var(--sand-2)}

/* ---- FAQ rows ---- */
.faq-item{transition:background .3s}
.faq-q{position:relative;padding-left:52px}
.faq-q::before{counter-increment:faq;content:counter(faq,decimal-leading-zero);position:absolute;left:0;top:50%;transform:translateY(-50%);font:600 13px/1 var(--ff);color:var(--orange);letter-spacing:.06em}
.faq-list{counter-reset:faq}
.faq-item:hover .faq-q{color:var(--orange-ink)}
.faq-item.is-open{background:linear-gradient(90deg,rgba(255,71,29,.04),transparent 60%)}
.faq-a p{padding-left:52px}
@media(max-width:600px){.faq-q{padding-left:38px}.faq-a p{padding-left:38px}}

/* ---- work + post cards: stronger hover ---- */
.wcard::after,.pcard-img::after{content:"";position:absolute;inset:auto 18px 18px auto;width:44px;height:44px;border-radius:50%;background:var(--orange);opacity:0;transform:translateY(10px) scale(.8);transition:opacity .4s var(--ease),transform .4s var(--ease);pointer-events:none}
.wcard{position:relative}
.wcard::after{background:var(--orange) url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2'%3E%3Cpath d='M6 18 L18 6 M9 6h9v9'/%3E%3C/svg%3E") center/18px no-repeat}
.wcard:hover::after{opacity:1;transform:none}
.pcard-img::after{display:none}
.pcard-t a{background-image:linear-gradient(var(--orange),var(--orange));background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .4s var(--ease)}
.pcard:hover .pcard-t a{background-size:100% 1px}

/* ---- key facts: overlap + accent ---- */
.kf-card{position:relative;box-shadow:0 20px 50px rgba(10,10,10,.06)}
.kf-facts dt{position:relative;padding-left:16px}
.kf-facts dt::before{content:"";position:absolute;left:0;top:.5em;width:8px;height:1px;background:var(--orange)}

/* ---- partner strip on tint ---- */
.partners{background:var(--tint);border-radius:var(--r-lg);padding:70px 0}
.partners .wrap{display:grid;gap:34px}

/* ---- counters with dividers ---- */
.counter-row li{position:relative;padding-left:26px}
.counter-row li::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--line)}
.counters--dark .counter-row li::before{background:var(--line-dark)}
.counter-row li:first-child{padding-left:0}
.counter-row li:first-child::before{display:none}

/* ---- related links ---- */
.rel-links a{position:relative;padding-right:34px}
.rel-links a::after{content:"";position:absolute;right:16px;top:50%;width:6px;height:6px;margin-top:-3px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);transition:transform .3s var(--ease)}
.rel-links a:hover::after{transform:rotate(45deg) translate(2px,-2px)}

/* ---- reveal for images ---- */
.js [data-reveal] .tsec-img-in,.js [data-reveal] .ptitle-band-in{clip-path:inset(0 0 100% 0)}
.js .is-in .tsec-img-in,.js .is-in .ptitle-band-in{clip-path:inset(0 0 0 0);transition:clip-path 1.1s var(--ease)}
@media(prefers-reduced-motion:reduce){.js [data-reveal] .tsec-img-in,.js [data-reveal] .ptitle-band-in{clip-path:none}}

/* ---- dark surfaces: one selector list, so no dark block is ever missed ----
   A heading that inherits its light-ground colour on a dark panel renders at
   about 1:1 contrast — invisible, and invisible in a screenshot too. Every
   dark context is listed here together. */
.sec-head--dark .display,
.sboxes--dark .display,.sboxes--dark .statement,.sboxes--dark .sec-head .display,
.tsec--dark .display,.tsec--dark .statement,.tsec--dark .tsec-outro,
.stmt--dark .display,.stmt--dark .statement,
.svc .display,.svc .statement,
.cta--dark .display,.cta--dark .statement{color:#fff}
.sboxes--dark .eyebrow,.tsec--dark .eyebrow,.stmt--dark .eyebrow,.sec-head--dark .eyebrow{color:#fff}
.sboxes--dark .sec-head::before,.tsec--dark .sec-head::before,.svc .sec-head::before{background:var(--orange)}
.sboxes--dark .sbox-n{color:var(--orange)}
.sboxes--dark .sbox-grid--numbered .sbox{border-top-color:var(--line-dark)}
.sboxes--dark .sbox-grid--numbered .sbox-n{color:rgba(255,255,255,.35)}
.sboxes--dark .sbox-grid--numbered .sbox:hover .sbox-n{color:var(--orange-ink)}
.sboxes--dark .sbox-list li::before,.tsec--dark .tsec-list li::before{color:var(--orange)}
.sboxes--dark .tlink::after,.tsec--dark .tlink::after{background:#fff}
.tsec--dark .tsec-body{color:rgba(255,255,255,.75)}
.tsec--dark .tsec-list{color:#fff}

/* ---- unpublished CMS slot (editors only) ---- */
.au-ph{padding:30px 0}
.au-ph-box{border:2px dashed var(--sand-2);border-radius:var(--r-md);padding:26px 30px;background:var(--tint)}
.au-ph-tag{font:600 12px/1 var(--ff);letter-spacing:.1em;text-transform:uppercase;color:var(--orange-ink);margin-bottom:10px}
.au-ph-t{font:600 20px/1.3 var(--ff);color:var(--ink);margin-bottom:6px}
.au-ph-box p{font-size:15px;color:var(--body)}

/* ======================================================================
   Assessment, blog tools, form states, article meta.
   Same tokens as everything else — ink, bone, sand, one orange accent.
   ====================================================================== */
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* ---- assessment ---- */
.quiz{padding:20px 0 120px}
.quiz-note{margin-top:18px;font:500 15px/1.5 var(--ff);color:var(--muted)}
.quiz-intro .pill{margin-top:34px}
.quiz-progress{max-width:760px;margin:0 0 34px}
.quiz-step{font:600 14px/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.quiz-bar{height:4px;background:var(--sand-2);border-radius:3px;overflow:hidden}
.quiz-bar span{display:block;height:100%;background:var(--orange);border-radius:3px;transition:width .4s var(--ease)}
@media(prefers-reduced-motion:reduce){.quiz-bar span{transition:none}}
.quiz-q{border:0;padding:0;margin:0 0 34px;max-width:760px}
.quiz-q-title{padding:0;display:block;margin-bottom:22px}
.quiz-q-n{display:block;font:600 13px/1 var(--ff);letter-spacing:.08em;text-transform:uppercase;color:var(--orange-ink);margin-bottom:12px}
.quiz-q-text{display:block;font:600 clamp(22px,2.6vw,32px)/1.25 var(--ff);letter-spacing:-.02em;color:var(--ink)}
.quiz-help{font-size:15px;color:var(--muted);margin:-10px 0 18px}
.quiz-opts{display:grid;gap:10px}
.quiz-opt{display:block;cursor:pointer}
.quiz-opt input{position:absolute;opacity:0;width:1px;height:1px}
.quiz-opt-box{display:flex;align-items:center;gap:14px;min-height:56px;padding:14px 20px;border:1px solid var(--line);border-radius:12px;background:#fff;transition:border-color .2s,background .2s,transform .2s var(--ease)}
.quiz-opt-mark{flex:none;width:20px;height:20px;border:2px solid var(--line);border-radius:50%;position:relative}
.quiz-opt-label{font:500 17px/1.4 var(--ff);color:var(--ink)}
.quiz-opt:hover .quiz-opt-box{border-color:var(--ink)}
.quiz-opt input:focus-visible+.quiz-opt-box{outline:2px solid var(--orange);outline-offset:3px}
.quiz-opt input:checked+.quiz-opt-box{border-color:var(--ink);background:var(--sand)}
.quiz-opt input:checked+.quiz-opt-box .quiz-opt-mark{border-color:var(--orange-ink)}
.quiz-opt input:checked+.quiz-opt-box .quiz-opt-mark::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--orange-ink)}
.quiz-error{color:var(--orange-ink);font-weight:600;margin-top:14px}
.quiz-nav{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px}
.pill--ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.pill--ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.pill:disabled{opacity:.4;cursor:not-allowed;transform:none}
.pill-arrow--back{transform:rotate(-135deg)}
.quiz-result{max-width:860px;padding-top:10px}
.quiz-priorities{counter-reset:pr;display:grid;gap:24px;margin:36px 0 0;padding:0;list-style:none}
.quiz-priority{display:grid;grid-template-columns:auto 1fr;gap:20px;background:#fff;border-radius:var(--r-md);padding:28px 30px}
.quiz-priority-n{font:700 34px/1 var(--ff-display);color:var(--orange)}
.quiz-priority-t{font:600 22px/1.25 var(--ff);letter-spacing:-.02em;color:var(--ink);margin-bottom:8px}
.quiz-priority p{font-size:16px;line-height:1.6}
.quiz-priority-links{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:14px;font:500 15px/1 var(--ff)}
.quiz-priority-links a{text-decoration:underline;text-underline-offset:3px}
.quiz-review{margin-top:28px}
.quiz-ask{max-width:760px;margin-top:56px;padding-top:40px;border-top:1px solid var(--line)}
.quiz-ask .cform-row{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}
.quiz-ask label{display:grid;gap:8px;font:500 14px/1.3 var(--ff);color:var(--ink)}
.quiz-ask input{width:100%;border:0;border-bottom:1px solid var(--ink);background:transparent;padding:12px 0;font:400 18px/1.4 var(--ff)}
.quiz-after{margin-top:22px;font-size:15px;color:var(--body)}
.quiz-ask .pill{margin-top:22px}
@media(max-width:700px){.quiz-ask .cform-row{grid-template-columns:1fr}.quiz-priority{grid-template-columns:1fr}}

/* ---- form states ---- */
.req{color:var(--orange-deep);font-weight:700}
.opt{color:var(--muted);font-weight:400}
.form-req-note{font-size:15px;color:var(--body);margin-top:16px}
.field-err{color:var(--orange-ink);font:500 14px/1.4 var(--ff);margin-top:6px}
.cform input[aria-invalid=true],.cform textarea[aria-invalid=true],.quiz-ask input[aria-invalid=true]{border-bottom-color:var(--orange-ink);border-bottom-width:2px}
.form-privacy{font-size:14px;line-height:1.55;color:var(--muted);margin-top:8px}
.form-privacy a{text-decoration:underline;text-underline-offset:3px}
.cform-send{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:10px}
.form-reply{font-size:14px;color:var(--muted);max-width:280px}
.cform select{width:100%;border:0;border-bottom:1px solid var(--ink);background:transparent;padding:12px 0;font:400 18px/1.4 var(--ff);border-radius:0}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---- blog tools ---- */
.post-tools{display:grid;gap:26px;margin-bottom:46px}
.post-search label{display:block;font:500 14px/1 var(--ff);color:var(--muted);margin-bottom:10px}
.post-search-row{display:flex;gap:12px;flex-wrap:wrap;max-width:620px}
.post-search input{flex:1 1 260px;min-height:52px;border:1px solid var(--line);border-radius:30px;padding:0 22px;font:400 16px/1 var(--ff);background:#fff}
.post-search input:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.post-filter{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:11px 18px;border:1px solid var(--line);border-radius:30px;font:500 15px/1 var(--ff);color:var(--ink);background:#fff;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.post-filter:hover,.post-filter.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}
.post-filter-n{font-size:13px;opacity:.6}
.posts-empty{font:500 18px/1.5 var(--ff);color:var(--ink);padding:40px 0}
.posts-empty a{text-decoration:underline;text-underline-offset:3px}
.posts-more{margin-top:50px}

/* ---- article meta + TOC ---- */
.amet{padding:0 0 10px}
.amet-in{max-width:760px;margin:0 auto}
.amet-row{display:flex;flex-wrap:wrap;gap:10px 28px;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font:500 15px/1.4 var(--ff);color:var(--ink);list-style:none}
.amet-k{color:var(--muted)}
.amet-row a{text-decoration:underline;text-underline-offset:3px}
.amet-sum{margin-top:26px;font:400 19px/1.6 var(--ff);color:#2E2D2D}
.toc{margin-top:30px;background:var(--sand);border-radius:var(--r-md);padding:24px 28px}
.toc-h{font:600 14px/1 var(--ff);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.toc-list{counter-reset:toc;display:grid;gap:8px;font:500 16px/1.45 var(--ff);list-style:none;padding:0}
.toc-list a{text-decoration:underline;text-underline-offset:3px;color:var(--ink)}
.toc-list a:hover{color:var(--orange-ink)}

/* ---- embed states ---- */
.embed-frame{position:relative}
.embed-status{position:absolute;inset:0;display:grid;place-items:center;padding:24px;text-align:center;font:500 16px/1.5 var(--ff);color:var(--muted);background:var(--sand);border-radius:var(--r-md)}
.embed-frame.is-loaded .embed-status{display:none}
.embed-frame.is-failed .embed-status{color:var(--ink);background:var(--sand-2)}
.embed-tz{margin-top:14px;font-size:15px;color:var(--muted)}
.embed-fb.is-prominent{margin-top:18px;font-weight:600}
.embed-fb.is-prominent .tlink{font-size:18px}

/* ---- hero calls to action ----
   The tagline and the buttons are separate grid areas in normal flow: no
   overlap is possible, at any width, and neither needs a fixed offset. */
.hero-ctas{grid-area:ctas;display:flex;flex-wrap:wrap;gap:12px;align-self:start;margin-top:14px}
.hero-cta{min-height:48px}
.pill--ghost-light{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55)}
.pill--ghost-light:hover{background:#fff;color:var(--ink);border-color:#fff}
@media(max-width:900px){
  /* phone: headline, then tagline, then the buttons, then the service chips */
  .hero{padding:150px 0 40px}
  .hero-in{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "tag" "ctas" "chips";gap:0;align-items:start}
  .hero-tag{margin-top:22px;align-self:start}
  .hero-ctas{margin-top:16px;gap:12px}
  .hero-cta{flex:1 1 100%;justify-content:center}
  .hero-chips{margin-top:34px;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
}
@media(max-width:400px){
  .hero-cta{padding:0 20px;font-size:16px}
  .hero-chips{grid-template-columns:1fr;gap:14px}
}

/* ---- work card: one target, inner links keep their own ---- */
.wcard{position:relative}
.wcard-hit{position:absolute;inset:0;z-index:1}
.wcard-foot{position:relative;z-index:2;pointer-events:none}
.wcard-foot a{pointer-events:auto}
.wcard-result{font:600 15px/1.35 var(--ff);color:var(--orange-deep);width:100%;min-width:0;margin:2px 0 0}
.wcard:focus-within{outline:2px solid var(--orange);outline-offset:4px;border-radius:var(--r-md)}
.wcard-t a:focus-visible{outline:none}

/* ---- drawn stand-in portraits (until approved photographs exist) ---- */
.tcard-img--drawn{background:var(--sand)}
.tportrait{width:100%;height:100%;display:block}
.tcard-img{display:block}

/* ---- tap targets: the visual size is unchanged, the hit area reaches 44px ---- */
.skip{display:inline-flex;align-items:center;min-height:44px;padding:0 14px}
.hd .logo{display:inline-flex;align-items:center;min-height:44px}
/* these are separate facts on separate lines; inline-flex ran the phone number
   straight into the opening hours */
.offc-foot a,.ft-contact a,.ft-links a,.ccol-social a{display:inline-flex;align-items:center;min-height:44px}
.ccol-line,.ccol-big{display:flex;align-items:center;min-height:44px;width:fit-content;max-width:100%}
.ft-links{gap:2px}
.amet-row a{min-height:auto}
/* the text link keeps its underline against the text while the target grows */
.tlink{min-height:44px;padding-bottom:0}
.tlink::after{bottom:calc(50% - .78em)}
.sbox-more .tlink,.ccol .tlink{margin-top:2px}
/* hero chips: same type and rhythm, hit area raised to 44px */
.chip-l{display:inline-flex;align-items:center;min-height:44px}
.chip-l::after{bottom:calc(50% - .8em)}
.hero-chips li{gap:8px}
.li-k{color:var(--muted)}

/* ---- assessment polish ---- */
.quiz-hint{color:var(--muted);font:500 15px/1.4 var(--ff);margin-top:14px}
.quiz-result{scroll-margin-top:120px}
.quiz-q-title{scroll-margin-top:110px}
.quiz-ask{scroll-margin-top:110px}

/* ---- booking loader: the layer exists only while loading ---- */
.embed-frame .embed-status{display:none}
.embed-frame.is-loading .embed-status,.embed-frame.is-slow .embed-status{display:grid}
.embed-frame.is-slow .embed-status{background:var(--sand-2);color:var(--ink);align-content:center}
.embed-frame.is-loaded .embed-status{display:none}
/* ---- work cards: equal heights, one metric line ---- */
.work-grid{align-items:stretch;grid-auto-rows:1fr}
.wcard{display:flex;flex-direction:column}
.wcard-foot{margin-top:auto}
.wcard-result--pending{color:var(--muted);font-weight:500}

/* ======================================================================
   Goal chooser — outcome-first selection. Same tokens, no new palette.
   ====================================================================== */
.goals{padding:20px 0 90px}
.goals-head{margin-bottom:40px}
.goals-head .lede{margin-top:20px}
.goals-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:36px}
.goal{display:flex;align-items:flex-start;gap:14px;min-height:76px;padding:20px 22px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);
  transition:border-color .22s var(--ease),background .22s var(--ease),transform .22s var(--ease)}
.goal:hover{border-color:var(--ink);transform:translateY(-2px)}
.goal:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.goal-n{font:600 12px/1.6 var(--ff);letter-spacing:.08em;color:var(--muted);flex:none}
.goal-l{font:600 17px/1.35 var(--ff);letter-spacing:-.01em;color:var(--ink);flex:1}
.goal-tick{flex:none;width:22px;height:22px;border:2px solid var(--line);border-radius:50%;position:relative;transition:border-color .22s,background .22s}
.goal[aria-pressed=true]{border-color:var(--ink);background:var(--sand)}
.goal[aria-pressed=true] .goal-tick{border-color:var(--orange-deep);background:var(--orange-deep)}
.goal[aria-pressed=true] .goal-tick::after{content:"";position:absolute;left:6px;top:2px;width:6px;height:11px;border:2px solid #fff;border-top:0;border-left:0;transform:rotate(45deg)}
.goal-panel{background:#fff;border-radius:var(--r-lg);padding:44px 48px;scroll-margin-top:110px}
.goal-panel:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.goal-why{font:500 clamp(19px,2.1vw,24px)/1.45 var(--ff);color:var(--ink);max-width:760px;margin-bottom:30px}
.goal-recs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;list-style:none;padding:0;margin:0 0 26px;counter-reset:rec}
.goal-rec{padding-top:18px;border-top:2px solid var(--line)}
.goal-rec.is-first{border-top-color:var(--orange)}
.goal-rec-tag{display:inline-block;font:700 11px/1 var(--ff);letter-spacing:.1em;text-transform:uppercase;color:var(--orange-deep);margin-bottom:10px}
.goal-rec-t{font:600 19px/1.3 var(--ff);letter-spacing:-.01em;margin-bottom:8px}
.goal-rec-t a{background-image:linear-gradient(var(--ink),var(--ink));background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .25s var(--ease)}
.goal-rec-t a:hover{background-size:100% 1px}
.goal-rec-why,.goal-measure{font:400 15px/1.55 var(--ff);color:var(--body)}
.goal-rec-k{color:var(--ink);font-weight:600}
.goal-measure{margin-bottom:18px;max-width:640px}
.goal-case{margin-bottom:26px;font:500 15px/1.5 var(--ff)}
.goal-case a{text-decoration:underline;text-underline-offset:3px}
.goal-case-note{color:var(--muted)}
.goal-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;padding-top:26px;border-top:1px solid var(--line)}
.goal-reassure{font:500 14px/1.4 var(--ff);color:var(--muted);flex-basis:100%}
.goals-all{margin-top:30px}
@media(max-width:1000px){.goals-list{grid-template-columns:repeat(2,minmax(0,1fr))}.goal-recs{grid-template-columns:1fr}}
@media(max-width:600px){.goals-list{grid-template-columns:1fr}.goal-panel{padding:30px 24px}}

/* chips above a form */
.goals--chips{padding:0 0 26px}
.goals--chips .wrap{padding:0}
.goals--chips .goals-head{margin-bottom:18px}
.goals--chips .goals-list{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.goals--chips .goal{min-height:44px;padding:11px 18px;border-radius:30px;gap:10px}
.goals--chips .goal-n,.goals--chips .goal-tick{display:none}
.goals--chips .goal-l{font-size:15px}

/* ---- case-study filters ---- */
.work-filters{display:grid;gap:18px;margin-bottom:40px}
.work-facet{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.work-facet-h{font:500 14px/1 var(--ff);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;min-width:82px}
.work-facet-row{display:flex;flex-wrap:wrap;gap:8px}
.work-empty{padding:40px 0;font:500 17px/1.5 var(--ff)}
.wcard-challenge{font:400 14px/1.45 var(--ff);color:var(--body);width:100%;margin-top:6px}

/* ---- audit result: profile, effort, reasoning ---- */
.quiz-profile-k{font:600 13px/1 var(--ff);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.quiz-profile{font:700 clamp(30px,4vw,52px)/1.05 var(--ff);letter-spacing:-.03em;color:var(--ink);margin-bottom:16px}
.quiz-diagnosis{font:400 clamp(18px,2vw,22px)/1.5 var(--ff);color:var(--grey);max-width:720px;margin-bottom:44px}
.quiz-priority.is-first{border:2px solid var(--orange);border-radius:var(--r-md)}
.quiz-meta{display:flex;flex-wrap:wrap;gap:8px 26px;margin:14px 0 0;font:500 14px/1.4 var(--ff);color:var(--ink);list-style:none;padding:0}
.quiz-meta-k{color:var(--muted);margin-right:4px}
.quiz-meta li{text-transform:capitalize}
.quiz-why{margin-top:14px}
.quiz-why summary{cursor:pointer;font:500 15px/1.4 var(--ff);color:var(--ink);min-height:44px;display:flex;align-items:center;gap:8px}
.quiz-why summary::marker{color:var(--orange-deep)}
.quiz-why[open] summary{color:var(--orange-ink)}
.quiz-why p{font-size:15px;line-height:1.6;color:var(--body);padding:4px 0 6px}
.quiz-case{margin-top:12px;font:500 15px/1.5 var(--ff)}
.quiz-case a{text-decoration:underline;text-underline-offset:3px}
.quiz-review{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;margin-top:30px}
@media print{
  .hd,.offc,.ft,.quiz-intro,.quiz-form .quiz-q,.quiz-nav,.quiz-ask,.quiz-review,.marquee,.embed{display:none!important}
  .quiz-result{display:block!important}
  body{background:#fff}
  .quiz-priority{break-inside:avoid;border:1px solid #ccc!important}
  .quiz-why{display:block}.quiz-why summary{display:none}.quiz-why p{padding:0}
  a[href^="/"]::after{content:" (auvymarketing.com" attr(href) ")";font-size:11px;color:#555}
}

/* ---- contact: one question first, detail on request ---- */
.cform-main{margin-top:6px}
.cform-help{font:400 14px/1.5 var(--ff);color:var(--muted);font-weight:400}
.cform-more{border-top:1px solid var(--line);padding-top:18px}
.cform-more summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:8px;font:500 15px/1.4 var(--ff);color:var(--ink)}
.cform-more summary::marker{color:var(--orange-deep)}
.cform-more-in{display:grid;gap:22px;padding-top:12px}

/* ---- in-article tool ---- */
.tool{background:var(--sand);border-radius:var(--r-md);padding:34px 36px;margin:44px 0;max-width:760px}
.tool-k{font:600 12px/1 var(--ff);letter-spacing:.09em;text-transform:uppercase;color:var(--orange-deep);margin-bottom:10px}
.tool-h{font:600 24px/1.25 var(--ff);letter-spacing:-.02em;color:var(--ink);margin-bottom:10px}
.tool-intro{font-size:16px;line-height:1.6;color:var(--body);margin-bottom:22px}
.tool-q{border:0;padding:0;margin:0 0 20px}
.tool-q legend{font:600 16px/1.4 var(--ff);color:var(--ink);margin-bottom:10px;padding:0}
.tool-opts{display:flex;flex-wrap:wrap;gap:8px}
.tool-opt{display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:30px;background:#fff;cursor:pointer;font:500 15px/1 var(--ff);transition:border-color .2s,background .2s}
.tool-opt:hover{border-color:var(--ink)}
.tool-opt input{position:absolute;opacity:0;width:1px;height:1px}
.tool-opt:has(input:checked){background:var(--ink);color:#fff;border-color:var(--ink)}
.tool-opt input:focus-visible+span{outline:2px solid var(--orange);outline-offset:4px}
.tool-hint{font:500 15px/1.5 var(--ff);color:var(--muted)}
.tool-result{background:#fff;border-left:3px solid var(--orange);border-radius:12px;padding:22px 24px;margin-top:8px}
.tool-result h3{font:600 19px/1.3 var(--ff);color:var(--ink);margin-bottom:8px}
.tool-result p{font-size:16px;line-height:1.6}
.tool-note{font:400 13px/1.5 var(--ff);color:var(--muted);margin-top:14px}

/* ---- reading progress + live table of contents ---- */
.readbar{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;pointer-events:none;background:transparent}
.readbar span{display:block;height:100%;background:var(--orange);transform:scaleX(0);transform-origin:0 50%;transition:transform .12s linear}
@media(prefers-reduced-motion:reduce){.readbar span{transition:none}}
body.admin-bar .readbar{top:32px}
.toc{position:sticky;top:96px}
.toc-list a.is-current{color:var(--orange-deep);font-weight:600}
.toc-list a.is-current::before{content:"";display:inline-block;width:10px;height:2px;background:var(--orange);margin-right:8px;vertical-align:middle}
@media(max-width:900px){.toc{position:static}}

/* ---- was this useful ---- */
.afeed{margin:40px auto 0;max-width:760px;padding-top:26px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.afeed-q{font:600 16px/1.4 var(--ff);color:var(--ink)}
.afeed button{min-height:44px;padding:10px 20px;border:1px solid var(--line);border-radius:30px;background:#fff;font:500 15px/1 var(--ff);cursor:pointer}
.afeed button:hover:not(:disabled){background:var(--ink);color:#fff;border-color:var(--ink)}
.afeed button:disabled{opacity:.5;cursor:default}
.afeed-out{font:500 15px/1.5 var(--ff);color:var(--body);flex-basis:100%}

@media print{
  .readbar,.afeed,.tool-q,.tool-hint,.post-tools,.posts-more{display:none!important}
  .prose{max-width:none}
  .toc{position:static}
}

/* ---- hero: the artwork answers the service you point at ---- */
.hero-bg{transition:transform .26s var(--ease)}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;
  background:radial-gradient(38vmax 38vmax at var(--hx,50%) var(--hy,40%),rgba(255,71,29,.30),transparent 62%);
  transition:opacity .24s var(--ease),background-position .24s var(--ease)}
.hero.is-lit::after{opacity:1}
.hero-chips li{transition:opacity .22s var(--ease)}
.hero.is-lit .hero-chips li:not(.is-active){opacity:.55}
.chip-out{display:block;font:400 14px/1.45 var(--ff);color:rgba(255,255,255,.72);margin-top:8px;max-width:26ch}
.hero-chips li.is-active .chip-out{color:#fff}
@media(prefers-reduced-motion:reduce){
  /* the light still marks the choice; nothing moves */
  .hero-bg{transition:none!important;transform:none!important}
  .hero::after{transition:opacity .01ms}
}
@media(max-width:900px){.chip-out{font-size:13px;max-width:none}}
.hero-reassure{flex-basis:100%;margin-top:12px;font:500 14px/1.45 var(--ff);color:rgba(255,255,255,.72)}

/* ---- catalogue behind a disclosure ---- */
.sbox-accordion{border-top:1px solid var(--line)}
.sgroup{border-bottom:1px solid var(--line)}
.sgroup summary{display:flex;align-items:center;gap:18px;min-height:64px;padding:16px 0;cursor:pointer;list-style:none;font:600 20px/1.3 var(--ff);color:var(--ink)}
.sgroup summary::-webkit-details-marker{display:none}
.sgroup summary::after{content:"";margin-left:auto;width:12px;height:12px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg);transition:transform .22s var(--ease)}
.sgroup[open] summary::after{transform:rotate(225deg)}
.sgroup summary:hover .sgroup-t{color:var(--orange-ink)}
.sgroup-n{font:600 12px/1 var(--ff);letter-spacing:.08em;color:var(--muted)}
.sgroup-c{font:400 14px/1 var(--ff);color:var(--muted);margin-left:8px}
.sgroup-in{padding:0 0 26px 46px}
.sgroup-blurb{font-size:16px;line-height:1.6;color:var(--body);margin-bottom:16px;max-width:620px}
.sgroup-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 30px;font:500 16px/1.4 var(--ff)}
.sgroup-list a{text-decoration:underline;text-underline-offset:3px;display:inline-flex;align-items:center;min-height:44px}
.sgroup-list a:hover{color:var(--orange-ink)}
@media(max-width:700px){.sgroup-in{padding-left:0}.sgroup-list{grid-template-columns:1fr}}

/* ---- hero shortcut: outcome, proof and where it leads ---- */
.chip-proof{display:block;font:600 13px/1.4 var(--ff);color:#fff;margin-top:6px}
.chip-proof::before{content:"";display:inline-block;width:14px;height:2px;background:var(--orange);margin-right:8px;vertical-align:middle}
.chip-go{display:block;font:500 13px/1.4 var(--ff);color:rgba(255,255,255,.55);margin-top:8px;opacity:0;transform:translateY(-2px);transition:opacity .18s var(--ease),transform .18s var(--ease)}
.hero-chips li.is-active .chip-go,.hero-chips li:hover .chip-go,.hero-chips li:focus-within .chip-go{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.chip-go{transition:none}}
@media(max-width:900px){.chip-go{opacity:1;transform:none}}

/* ---- anchored headings clear the sticky header ---- */
:target{scroll-margin-top:110px}
.goal-panel,.quiz-q-title,.quiz-result,.quiz-ask,.tool,.faq-item,.sgroup,.toc-list a,[id]{scroll-margin-top:110px}
@media(max-width:900px){:target,[id]{scroll-margin-top:92px}}

/* ---- contact column: the phone and the hours are separate facts ---- */
.ccol-line+.ccol-line{margin-top:10px}
.ccol-addr+.ccol-line{margin-top:14px}
.ccol-line:last-of-type{margin-bottom:4px}


/* ======================================================================
   Semantic colour application. Bone carries the page, Ink carries the
   editorial weight, Sand explains, Olive vouches, and Vermilion Deep is
   the one thing to press. Bright Vermilion is reserved for accents and
   never used as normal-sized text on Bone or Sand.
   ====================================================================== */

/* the one obvious action: Vermilion Deep with Bone text */
.pill--ink{background:var(--vermilion-deep);color:var(--bone)}
.pill--ink:hover{background:var(--ink);color:var(--bone)}
.pill--white{background:var(--bone);color:var(--ink)}
.pill--white:hover{background:var(--vermilion-deep);color:var(--bone)}
/* the quieter second action */
.pill--ghost{background:transparent;color:var(--ink);border:1px solid var(--sand-2)}
.pill--ghost:hover{background:var(--ink);color:var(--bone);border-color:var(--ink)}

/* sand explains: quick answers, FAQ, empty states, recommendation results */
.quick-panel,.toc,.tool,.sboxes--sand,.tsec--sand{background:var(--sand);color:var(--ink)}
.quick-l,.toc-h,.tool-k,.amet-k,.sgroup-c,.sgroup-n{color:var(--sand-deep)}
.quick-facts dt{color:var(--sand-deep)}
.quick-facts{border-top-color:var(--sand-2)}
.quick-panel::before{background:var(--vermilion-deep)}
.tool-opt{border-color:var(--sand-2);background:var(--white)}
.toc-list a{color:var(--ink)}
.toc-list a.is-current{color:var(--vermilion-deep)}
.posts-empty,.work-empty,.quiz-hint{background:var(--sand);color:var(--ink);border-radius:var(--r-md);padding:26px 28px}
.work-empty,.posts-empty{margin-top:10px}

/* olive vouches: verified proof and the audit's result state */
.quiz-result{background:var(--olive);color:var(--bone);border-radius:var(--r-lg);padding:48px 52px;margin-top:10px}
.quiz-result .display,.quiz-profile{color:var(--bone)}
.quiz-profile-k{color:var(--sand)}
.quiz-diagnosis{color:rgba(245,241,230,.82)}
.quiz-priority{background:var(--bone);color:var(--ink)}
.quiz-result .lede{color:rgba(245,241,230,.82)}
.quiz-review .pill--ghost{color:var(--bone);border-color:rgba(245,241,230,.42)}
.quiz-review .pill--ghost:hover{background:var(--bone);color:var(--ink)}
.quiz-review .tlink{color:var(--bone)}
.wcard-result{color:var(--olive)}
.goal-case-note,.wcard-result--note{color:var(--sand-deep)}
.chip-proof{color:var(--bone)}

/* vermilion, used sparingly and never as small text on light ground */
.eyebrow .dot,.sec-head::before,.goal-rec.is-first,.quiz-priority.is-first{--accent:var(--vermilion)}
.sec-head::before{background:var(--vermilion)}
.eyebrow .dot{background:var(--vermilion)}
.ft-giant{color:var(--vermilion)}
.marquee em{color:var(--vermilion)}
.goal-rec-tag,.sbox-n{color:var(--vermilion-deep)}

/* focus: Ink or Vermilion Deep, always offset */
:focus-visible{outline:3px solid var(--vermilion-deep);outline-offset:3px}
.hero :focus-visible,.svc :focus-visible,.cta--dark :focus-visible,.quiz-result :focus-visible,.ft :focus-visible{outline-color:var(--bone)}

/* Sand is a mid-tone: only Ink or Sand Deep are readable on it at text sizes.
   Vermilion Deep clears Bone (5.5:1) but not Sand (3.9:1), so on Sand the
   accent becomes a mark rather than the text colour. */
.sbox-grid--numbered .sbox-n{color:var(--sand-deep)}
.sbox-grid--numbered .sbox:hover .sbox-n{color:var(--ink)}
.goal[aria-pressed=true] .goal-n{color:var(--sand-deep)}
.toc-list a.is-current{color:var(--ink);font-weight:700}
.toc-list a.is-current::before{background:var(--vermilion-deep);height:3px}

/* ---- one obvious action per viewport ---- */
.pill--primary{background:var(--vermilion-deep);color:var(--bone)}
.pill--primary:hover{background:var(--vermilion);color:var(--bone)}
.pill--primary:active{background:var(--vermilion-deep);transform:translateY(1px)}

/* ---- recovery from a selection ---- */
.goals-clear{margin:-22px 0 30px}
.goals-clear .tlink{color:var(--ink)}

/* ---- which filters are on, and how to drop them ---- */
.work-active{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:14px 0 0;border-top:1px solid var(--line)}
.work-active-k{font:600 14px/1 var(--ff);color:var(--ink)}
.work-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border:1px solid var(--ink);border-radius:30px;background:var(--ink);color:var(--bone);font:500 14px/1 var(--ff);cursor:pointer}
.work-chip:hover{background:var(--vermilion-deep);border-color:var(--vermilion-deep)}
.work-chip span{font-size:16px;line-height:1}

/* ---- audit metadata reads as a sentence ---- */
.quiz-meta li{text-transform:none}
.quiz-meta-k{text-transform:none}

/* ---- the recommendation panel explains on Sand, guides in Olive, acts in Vermilion Deep ---- */
.goal-panel{background:var(--sand);color:var(--ink)}
.goal-rec-why,.goal-measure{color:var(--sand-deep)}
.goal-rec-k{color:var(--ink)}
.goal-measure{background:var(--olive);color:var(--bone);border-radius:12px;padding:16px 20px;max-width:none}
.goal-measure .goal-rec-k{color:var(--sand)}
.goal-rec{border-top-color:var(--sand-2)}
.goal-rec.is-first{border-top-color:var(--vermilion)}
.goal-actions{border-top-color:var(--sand-2)}
.goal-reassure{color:var(--sand-deep)}
.goal-panel .pill--ghost{border-color:var(--ink);color:var(--ink)}
/* "Start here" becomes a filled badge on Sand: Bone on Vermilion Deep clears
   5.5:1, and the label is a shape as well as a colour. */
.goal-rec-tag,.quiz-priority.is-first .goal-rec-tag{display:inline-flex;align-items:center;gap:6px;background:var(--vermilion-deep);color:var(--bone);
  padding:5px 10px;border-radius:20px;letter-spacing:.06em}
.goal-rec-tag::before{content:"★";font-size:10px;line-height:1}

/* ---- sticky section navigation (desktop only) ---- */
.pagenav{position:sticky;top:78px;z-index:20;background:var(--bone);border-bottom:1px solid var(--line);margin-bottom:10px}
.pagenav-list{display:flex;flex-wrap:wrap;gap:4px 22px;padding:12px 0;list-style:none}
.pagenav-list a{display:inline-flex;align-items:center;min-height:44px;font:500 14px/1.3 var(--ff);color:var(--sand-deep);border-bottom:2px solid transparent}
.pagenav-list a:hover{color:var(--ink)}
.pagenav-list a.is-current{color:var(--ink);border-bottom-color:var(--vermilion)}
@media(max-width:900px){.pagenav{display:none}}

/* ---- validation summary and success ---- */
.form-summary{background:var(--sand);border-left:4px solid var(--vermilion-deep);border-radius:var(--r-md);padding:20px 24px;margin-bottom:24px}
.form-summary-h{font:600 17px/1.4 var(--ff);color:var(--ink);margin-bottom:8px}
.form-summary ul{display:grid;gap:6px;padding-left:18px;list-style:disc}
.form-summary a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;min-height:auto}
.form-ok{background:var(--olive);color:var(--bone);border-radius:var(--r-md);padding:26px 30px;margin-bottom:26px}
.form-ok h2{font:600 22px/1.3 var(--ff);margin-bottom:8px}
.wcard-period{color:var(--sand-deep);font-weight:500}
/* the small step number sits on both white and sand cards; Sand Deep clears
   both (7.4:1 and 4.8:1) where Vermilion Deep clears only white */
.sbox-n{color:var(--sand-deep)}
.sbox:hover .sbox-n{color:var(--ink)}
/* Bright Vermilion is an accent, not a text colour: at 13px on the ink card it
   reads 4.34:1. Labels on dark surfaces use Sand (11:1). */
.sboxes--dark .sbox-n,.svc .svc-n{color:var(--sand)}
.sboxes--dark .sbox:hover .sbox-n{color:var(--bone)}
