/* Automate and Grow — blog stylesheet. Shared by /blog/ and every /blog/<slug>/ page.
   Tokens, nav, buttons, FAQ and footer mirror index.html so the blog feels like the same site. */

:root{
  --ink:#1E2021; --ink-2:#26292A;
  --teal:#49A98D; --teal-deep:#2E7C66; --teal-dark:#1F5C4B;
  --lime:#9FE247; --stone:#C1B8AE;
  --paper:#F3F2EE; --paper-2:#E7E5DF; --white:#FCFCFA;
  --text:#1E2021; --muted:#595E5D; --line:rgba(30,32,33,.11);
  --on-dark:#EEEEEE; --on-dark-muted:rgba(238,238,238,.7); --line-dark:rgba(238,238,238,.12);
  --font-display:"Schibsted Grotesk","Neue Haas Grotesk Display","Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-body:"Hanken Grotesk","Neue Haas Grotesk Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  --step--1:.875rem; --step-0:1.0625rem;
  --step-1:clamp(1.125rem,1.05rem + .3vw,1.3125rem);
  --step-2:clamp(1.375rem,1.25rem + .55vw,1.625rem);
  --step-3:clamp(2.125rem,1.5rem + 2.7vw,3.5rem);
  --s-1:.25rem; --s-2:.5rem; --s-3:.75rem; --s-4:1rem; --s-5:1.5rem; --s-6:2rem; --s-7:3rem; --s-8:4rem; --s-9:6rem;
  --section:clamp(4.5rem,3rem + 7vw,8.5rem);
  --gutter:clamp(1.25rem,.8rem + 2vw,2.5rem);
  --max:72rem; --measure:42rem;
  --radius:20px; --ease:cubic-bezier(.2,.7,.2,1); --nav-h:68px;
}

/* Base */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px);-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-body);font-size:var(--step-0);line-height:1.6;color:var(--text);background:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--font-display);margin:0;font-weight:700;line-height:1.05;letter-spacing:-.03em}
p{margin:0}
::selection{background:var(--lime);color:var(--ink)}
:focus-visible{outline:3px solid var(--teal-deep);outline-offset:3px;border-radius:6px}
.nav :focus-visible,.footer :focus-visible{outline-color:var(--lime)}
.container{width:100%;max-width:calc(var(--max) + var(--gutter) * 2);margin-inline:auto;padding-inline:var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:var(--s-4);top:-100px;z-index:100;background:var(--lime);color:var(--ink);padding:.6rem 1rem;border-radius:10px;font-weight:600;text-decoration:none}
.skip-link:focus{top:var(--s-3)}
.i{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* Buttons */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.65rem;font:600 1rem/1 var(--font-body);letter-spacing:-.005em;text-decoration:none;white-space:nowrap;border:0;border-radius:999px;padding:1rem 1.5rem;min-height:48px;cursor:pointer;transition:transform .3s var(--ease)}
.btn::after{content:"";position:absolute;inset:0;border-radius:inherit;opacity:0;pointer-events:none;transition:opacity .3s var(--ease)}
.btn .chev{width:9px;height:14px;fill:currentColor;transition:transform .3s var(--ease)}
.btn--lime{background:var(--lime);color:var(--ink)}
.btn--lime::after{box-shadow:0 12px 32px -10px rgba(159,226,71,.65)}
.btn--ink{background:var(--ink);color:var(--on-dark)}
.btn--ink .chev{color:var(--lime)}
.btn--ink::after{box-shadow:0 14px 30px -12px rgba(30,32,33,.55)}
.btn--sm{padding:.7rem 1.15rem;min-height:42px;font-size:.9375rem}
.btn--lg{padding:1.2rem 1.9rem;min-height:58px;font-size:1.0625rem}
@media (hover:hover){.btn:hover{transform:translateY(-2px)}.btn:hover::after{opacity:1}.btn:hover .chev{transform:translateX(3px)}}
.btn:active{transform:translateY(0)}
.btn--glow{isolation:isolate}
.btn--glow::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--lime);opacity:0;pointer-events:none;animation:pulse-ring 3.2s cubic-bezier(.2,.6,.3,1) 1.2s infinite}
@keyframes pulse-ring{0%{opacity:.45;transform:scale(1)}65%,100%{opacity:0;transform:scale(1.28)}}
@media (prefers-reduced-motion:reduce){.btn--glow::before{animation:none}}

/* Nav */
.nav{position:sticky;top:0;z-index:50;color:var(--on-dark);background:rgba(30,32,33,.95);box-shadow:inset 0 -1px 0 var(--line-dark)}
.nav__inner{display:flex;align-items:center;gap:var(--s-3);height:var(--nav-h)}
.brand{display:inline-flex;align-items:center;gap:.9rem;text-decoration:none;margin-right:auto}
.brand__mark{height:34px;width:auto;color:#EEEEEE}
.brand__name{font-family:var(--font-display);font-weight:700;font-size:1rem;letter-spacing:-.015em;line-height:1;white-space:nowrap}
.nav__links{display:none;list-style:none;margin:0 var(--s-3) 0 0;padding:0;gap:.125rem}
.nav__links a,.menu__panel a{position:relative;display:block;text-decoration:none;font-size:.9375rem;font-weight:500;color:var(--on-dark-muted)}
.nav__links a{padding:.55rem .9rem;border-radius:999px}
.nav__links a::before{content:"";position:absolute;inset:0;border-radius:inherit;background:rgba(238,238,238,.08);opacity:0;transition:opacity .25s var(--ease)}
.nav__links a:hover,.nav__links a[aria-current]{color:var(--on-dark)}
.nav__links a:hover::before,.nav__links a[aria-current]::before{opacity:1}
.menu{position:relative}
.menu summary{list-style:none;cursor:pointer;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line-dark)}
.menu summary::-webkit-details-marker{display:none}
.menu .i{width:22px;height:22px}
.menu .i-close{display:none}
.menu[open] .i-open{display:none}
.menu[open] .i-close{display:block}
.menu__panel{position:absolute;right:0;top:calc(100% + 12px);width:min(240px,80vw);list-style:none;margin:0;padding:.5rem;background:var(--ink-2);border-radius:16px;box-shadow:inset 0 0 0 1px var(--line-dark),0 24px 48px -16px rgba(0,0,0,.55)}
.menu__panel a{padding:.8rem 1rem;border-radius:10px}
.menu__panel a:hover{color:var(--on-dark);background:rgba(238,238,238,.06)}
@media (min-width:64rem){.nav__links{display:flex}.menu{display:none}}

/* Shared section bits */
.kicker{display:inline-flex;align-items:center;gap:.55rem;font-size:.8125rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-deep)}
.kicker .chev{width:7px;height:11px;fill:currentColor}

/* Post header */
.post-head{padding-block:clamp(3rem,2rem + 4vw,5.5rem) var(--s-6)}
.post-head__inner{max-width:var(--measure);margin-inline:auto}
.post-head h1{margin-top:var(--s-4);font-size:var(--step-3);line-height:1.04;letter-spacing:-.04em}
.post-head .standfirst{margin-top:var(--s-5);font-size:var(--step-1);line-height:1.55;color:var(--muted)}
.post-meta{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4);margin-top:var(--s-5);font-size:var(--step--1);color:var(--muted)}
.post-meta .by{display:inline-flex;align-items:center;gap:.6rem;color:var(--text);font-weight:600}
.post-meta .by img{width:28px;height:28px;border-radius:50%;object-fit:cover}

/* Summary block: the answer, high on the page */
.summary{margin-top:var(--s-6);padding:1.2rem 1.4rem;border-radius:16px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line);border-left:4px solid var(--lime)}
.summary__label{font-size:.8125rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-deep);margin-bottom:.4rem}
.summary p+p{margin-top:0}
.summary>p:last-child{font-size:var(--step-0);line-height:1.6}

/* Author bio */
.author{max-width:var(--measure);margin:var(--s-8) auto 0;display:flex;gap:var(--s-5);align-items:flex-start;padding:1.4rem 1.5rem;border-radius:var(--radius);background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
.author img{width:72px;height:72px;border-radius:50%;object-fit:cover;flex:none}
.author__name{font-family:var(--font-display);font-weight:700;font-size:var(--step-1);letter-spacing:-.02em;margin-bottom:.35rem}
.author p{font-size:var(--step-0);color:var(--muted)}
.author__links{margin-top:.6rem;font-weight:600}
.author__links a{color:var(--teal-deep);text-decoration:none}
.author__links a:hover{text-decoration:underline}
@media (max-width:30rem){.author{flex-direction:column}}

/* Video embed: a thumbnail link that becomes an iframe on click. Works as a plain link without JS. */
.video{position:relative;max-width:calc(var(--measure) + 8rem);margin:var(--s-6) auto 0;aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;background:var(--ink);box-shadow:0 30px 60px -30px rgba(30,32,33,.45)}
.video img,.video iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.video a{position:absolute;inset:0;display:grid;place-items:center;color:var(--ink);text-decoration:none}
.video a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,32,33,0) 55%,rgba(30,32,33,.55));pointer-events:none}
.video__play{position:relative;z-index:1;display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:var(--lime);box-shadow:0 18px 40px -14px rgba(159,226,71,.8);transition:transform .3s var(--ease)}
.video__play svg{width:30px;height:30px;fill:var(--ink);margin-left:4px}
.video a:hover .video__play{transform:scale(1.06)}
.video__label{position:absolute;left:var(--s-5);bottom:var(--s-4);z-index:1;color:var(--on-dark);font-size:var(--step--1);font-weight:600}

/* Article body */
.post{padding-block:var(--s-7) var(--section)}
.prose{max-width:var(--measure);margin-inline:auto;font-size:clamp(1.0625rem,1rem + .25vw,1.1875rem);line-height:1.7}
.prose>*+*{margin-top:1.3em}
.prose h2{margin-top:2.4em;font-size:var(--step-2);line-height:1.15;letter-spacing:-.03em}
.prose h3{margin-top:1.8em;font-size:var(--step-1);line-height:1.25;letter-spacing:-.02em}
.prose h2+*,.prose h3+*{margin-top:.8em}
.prose a{color:var(--teal-deep);text-decoration-thickness:1.5px;text-underline-offset:3px}
.prose a:hover{color:var(--teal-dark)}
.prose ul,.prose ol{padding-left:1.3em}
.prose li+li{margin-top:.5em}
.prose li::marker{color:var(--teal-deep);font-weight:600}
.prose strong{font-weight:600}
.prose blockquote{margin:1.6em 0;padding:1.1rem 1.4rem;border-left:4px solid var(--lime);background:var(--white);border-radius:0 14px 14px 0;color:var(--text);font-family:var(--font-display);font-weight:600;font-size:var(--step-1);line-height:1.4;letter-spacing:-.015em}
.prose blockquote p+p{margin-top:.6em}
.prose hr{border:0;height:1px;background:var(--line);margin:2.4em 0}
.prose .aside{padding:1.2rem 1.4rem;border-radius:16px;background:var(--paper-2);font-size:var(--step-0);color:var(--text)}
.prose .aside strong{display:block;margin-bottom:.3em;font-family:var(--font-display);letter-spacing:-.015em}
.prose table{width:100%;border-collapse:collapse;font-size:var(--step-0)}
.prose th,.prose td{text-align:left;padding:.65rem .8rem;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{font-family:var(--font-display);font-weight:700;letter-spacing:-.01em}
.prose figure{margin:1.6em 0}
.prose figure img{border-radius:14px}
.prose figcaption{margin-top:.6em;font-size:var(--step--1);color:var(--muted)}

/* In-article CTA */
.post-cta{max-width:var(--measure);margin:var(--s-8) auto 0;padding:clamp(1.6rem,1.2rem + 2vw,2.6rem);border-radius:var(--radius);background:var(--ink);color:var(--on-dark);position:relative;overflow:hidden}
.post-cta::before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,var(--teal),var(--lime))}
.post-cta .kicker{color:var(--lime)}
.post-cta h2{margin-top:var(--s-3);font-size:var(--step-2);letter-spacing:-.03em;max-width:24ch}
.post-cta p{margin-top:var(--s-4);color:var(--on-dark-muted);max-width:36rem}
.post-cta .btn{margin-top:var(--s-5)}
.post-cta small{display:block;margin-top:var(--s-4);font-size:.8125rem;color:var(--on-dark-muted)}

/* FAQ (mirrors index.html) */
.faq{padding-block:var(--section);background:var(--paper-2)}
.faq__inner{max-width:var(--measure);margin-inline:auto}
.faq h2{margin-top:var(--s-4);font-size:var(--step-2);letter-spacing:-.03em}
.faq__list{display:grid;gap:.75rem;margin-top:var(--s-6)}
.faq__item{border-radius:18px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
.faq__item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);padding:1.3rem 1.5rem;border-radius:18px;font-family:var(--font-display);font-weight:700;font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);line-height:1.3;letter-spacing:-.015em}
.faq__item summary::-webkit-details-marker{display:none}
.faq__icon{position:relative;flex:none;width:34px;height:34px;border-radius:50%;background:var(--ink)}
.faq__icon::before,.faq__icon::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;border-radius:2px;background:var(--lime);transition:transform .35s var(--ease)}
.faq__icon::after{transform:rotate(90deg)}
.faq__item[open] .faq__icon::after{transform:rotate(0)}
.faq__body{padding:0 1.5rem 1.5rem;color:var(--muted);max-width:40rem}
.faq__body p+p{margin-top:.7em}
.faq__ask{display:inline-flex;align-items:center;gap:.5rem;margin-top:var(--s-6);font-weight:600;color:var(--teal-deep);text-decoration:none}
.faq__ask .chev{width:8px;height:12px;fill:currentColor;transition:transform .3s var(--ease)}
.faq__ask:hover .chev{transform:translateX(3px)}

/* More posts */
.more{padding-block:var(--section)}
.more h2{font-size:var(--step-2);letter-spacing:-.03em}

/* Blog index + cards */
.blog-head{padding-block:clamp(3rem,2rem + 4vw,5.5rem) var(--s-7)}
.blog-head h1{margin-top:var(--s-4);font-size:var(--step-3);letter-spacing:-.04em;max-width:18ch}
.blog-head p{margin-top:var(--s-5);font-size:var(--step-1);color:var(--muted);max-width:36rem;line-height:1.55}
.cards{display:grid;gap:var(--s-5);padding-bottom:var(--section)}
@media (min-width:40rem){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:64rem){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card{display:flex;flex-direction:column;background:var(--white);border-radius:var(--radius);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;text-decoration:none;color:inherit;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
@media (hover:hover){.card:hover{transform:translateY(-6px);box-shadow:inset 0 0 0 1px var(--line),0 30px 50px -28px rgba(30,32,33,.35)}}
.card img{aspect-ratio:16/9;object-fit:cover;width:100%}
.card__body{display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-5)}
.card__body .kicker{font-size:.75rem}
.card h2{font-size:var(--step-1);line-height:1.25;letter-spacing:-.02em}
.card p{color:var(--muted);font-size:var(--step-0)}
.card time{margin-top:auto;padding-top:var(--s-3);font-size:var(--step--1);color:var(--muted)}

/* Footer */
.footer{background:var(--ink);color:var(--on-dark);padding-block:var(--s-7)}
.footer__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-5)}
.footer .brand{margin-right:0}
.footer p{font-size:.875rem;color:var(--on-dark-muted)}
.footer ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5)}
.footer ul a{font-size:.875rem;color:var(--on-dark-muted);text-decoration:none}
.footer ul a:hover{color:var(--on-dark)}
.footer__social{list-style:none;margin:0;padding:0;display:flex;gap:.5rem}
.footer__social a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:var(--on-dark-muted);box-shadow:inset 0 0 0 1px var(--line-dark);transition:color .25s var(--ease),background-color .25s var(--ease),transform .3s var(--ease)}
.footer__social a:hover{color:var(--lime);background:rgba(238,238,238,.06);transform:translateY(-2px)}
.footer__social svg{width:18px;height:18px;fill:currentColor}
@media (max-width:40rem){.footer__inner{flex-direction:column;align-items:flex-start}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* Free audit popup (mirrors the home page's #book section, inside a dialog) */
.modal{border:0;padding:1rem;background:transparent;width:min(58rem,100%);max-width:none;height:100vh;height:100dvh;max-height:none;margin:auto;overflow:hidden}
.modal[open]{display:flex;flex-direction:column;justify-content:center}
.modal::backdrop{background:rgba(30,32,33,.65)}
.modal[open] .modal__card{animation:modal-in .35s var(--ease)}
@keyframes modal-in{from{opacity:0;transform:translate3d(0,16px,0) scale(.985)}}
.modal__card{position:relative;background:var(--ink);color:var(--on-dark);border-radius:var(--radius);max-height:100%;min-height:0;overflow:auto;overscroll-behavior:contain;padding:clamp(1.25rem,1rem + 1.5vw,2.25rem);background-image:radial-gradient(60% 45% at 50% 0%,rgba(73,169,141,.3),transparent 70%)}
.modal__head{display:flex;justify-content:space-between;align-items:center;gap:var(--s-4)}
.modal__title{font-family:var(--font-display);font-weight:700;font-size:var(--step-2);letter-spacing:-.03em;line-height:1.1}
.modal__lede{margin-top:var(--s-3);color:var(--on-dark-muted);max-width:40rem}
.modal__close{flex:none;width:40px;height:40px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:var(--on-dark);background:rgba(238,238,238,.1)}
.modal__close .i{width:18px;height:18px}
@media (hover:hover){.modal__close:hover{background:rgba(238,238,238,.2)}}
body:has(.modal[open]){overflow:hidden}

.choice{display:grid;gap:var(--s-3);margin-top:var(--s-5)}
@media (min-width:36rem){.choice{grid-template-columns:1fr 1fr}}
.choice__card{display:grid;gap:.4rem;justify-items:start;text-align:left;padding:1.2rem 1.3rem;font:inherit;color:var(--on-dark);cursor:pointer;border:0;border-radius:16px;background:rgba(238,238,238,.05);box-shadow:inset 0 0 0 1px var(--line-dark);transition:transform .3s var(--ease),box-shadow .3s var(--ease),background-color .3s var(--ease)}
@media (hover:hover){.choice__card:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(238,238,238,.3)}}
.choice__card[aria-expanded="true"]{background:rgba(159,226,71,.09);box-shadow:inset 0 0 0 2px var(--lime)}
.choice__title{font-family:var(--font-display);font-weight:700;font-size:1.0625rem;letter-spacing:-.015em}
.choice__desc{font-size:.875rem;line-height:1.45;color:var(--on-dark-muted)}
.choice__cta{display:inline-flex;align-items:center;gap:.5rem;margin-top:.2rem;font-weight:600;font-size:.875rem;color:var(--lime)}
.choice__cta .chev{width:8px;height:12px;fill:currentColor;transition:transform .3s var(--ease)}
@media (hover:hover){.choice__card:hover .choice__cta .chev{transform:translateX(3px)}}

.book__panel{margin-top:var(--s-5)}
.book__panel[hidden]{display:none}
.book__card{--cal-h:720px;position:relative;min-height:calc(var(--cal-h) + 1rem);padding:.5rem;border-radius:18px;background:#fff}
@media (max-width:40rem){.book__card{--cal-h:860px}}
.book__card iframe{position:relative;display:block;width:100%;min-height:var(--cal-h);border:0;border-radius:14px;background:transparent}
.book__loading{position:absolute;left:0;right:0;top:45%;text-align:center;font-size:.9375rem;color:var(--muted)}
.book__open{display:none;padding-top:var(--s-2)}
.book__open .form-note{color:var(--on-dark-muted)}
.book__alt{margin-top:var(--s-3);font-size:.875rem;text-align:center;color:var(--on-dark-muted)}
.book__alt a{color:var(--lime)}

.audit-form{max-width:42rem;margin-inline:auto;padding:clamp(1.25rem,1rem + 1.5vw,2rem);border-radius:18px;background:var(--white);color:var(--text)}
.fields{display:grid;gap:var(--s-4)}
.fields__row{display:grid;gap:var(--s-4)}
@media (min-width:36rem){.fields__row{grid-template-columns:1fr 1fr}}
.field label{display:block;margin-bottom:.4rem;font-size:.875rem;font-weight:600}
.field input,.field select{display:block;width:100%;min-height:50px;padding:.8rem 1rem;font:inherit;font-size:1rem;line-height:1.4;color:var(--text);background:#F7F6F3;border:1px solid rgba(30,32,33,.16);border-radius:12px;-webkit-appearance:none;appearance:none}
.field select{padding-right:2.75rem;cursor:pointer;background-repeat:no-repeat;background-position:right 1rem center;background-size:14px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='%231E2021' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5.5l4 4 4-4'/%3E%3C/svg%3E")}
.field input::placeholder{color:#8B8F8E}
.field input:focus,.field select:focus{outline:none;background-color:#fff;border-color:var(--teal-deep);box-shadow:0 0 0 4px rgba(73,169,141,.2)}
.btn--block{width:100%}
.form-note{margin-top:var(--s-3);font-size:.8125rem;color:var(--muted);text-align:center}
@media (max-width:40rem){.modal{padding:.25rem}.modal__card{padding:.9rem}.book__card,.book__alt{display:none}.book__open{display:block}}
