@import url("https://fonts.googleapis.com/css2?family=Arvo:ital,wght@0,400;0,700;1,400&family=Archivo:ital,wght@0,300..800;1,300..700&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

/* ==========================================================================
   The Credibility Code — SpeechSkills marketing site
   Tokens copied from the design system (self-contained on purpose).
   ========================================================================== */

:root{
  /* Signal Yellow — sampled from the book cover */
  --yellow-50:#FEFBEF;--yellow-100:#FBF0C9;--yellow-200:#F7E29B;--yellow-300:#F3D66C;
  --yellow-400:#EFCC3C;--yellow-500:#DDB528;--yellow-600:#B4901C;--yellow-700:#8A6D14;
  /* Authority Navy */
  --navy-50:#EEF2F9;--navy-100:#D5DEEE;--navy-200:#A9BAD9;--navy-300:#7B92C1;
  --navy-400:#5570A4;--navy-500:#2D4984;--navy-600:#243B6C;--navy-700:#1B2C51;
  --navy-800:#131F39;--navy-900:#0C1424;
  /* Neutrals */
  --gray-0:#FFFFFF;--gray-50:#F6F7FA;--gray-100:#ECEEF3;--gray-200:#DADEE6;
  --gray-300:#B9BFCC;--gray-400:#8B93A5;--gray-500:#626B7E;--gray-600:#454D5D;
  --gray-700:#2E3542;--gray-800:#1D222B;--gray-900:#0F1319;
  --paper:#FFFFFF;--paper-warm:#FCFAF4;
  --green-500:#2E7D5B;--green-100:#DDEEE6;
  --red-500:#B3341F;--red-100:#F7E1DC;

  --text-strong:var(--navy-700);
  --text-body:var(--gray-700);
  --text-muted:var(--gray-500);
  --text-faint:var(--gray-400);
  --text-link:var(--navy-500);
  --text-link-hover:var(--navy-700);

  --surface-page:var(--paper);
  --surface-page-warm:var(--paper-warm);
  --surface-card:#FFFFFF;
  --surface-sunken:var(--gray-50);
  --surface-accent:var(--yellow-400);
  --surface-dark:var(--navy-600);
  --surface-dark-deep:var(--navy-800);

  --border-hairline:var(--gray-200);
  --border-accent:var(--yellow-500);
  --border-on-dark:rgba(255,255,255,.22);
  --focus-ring:var(--yellow-500);

  --status-success-fg:var(--green-500);--status-success-bg:var(--green-100);
  --status-error-fg:var(--red-500);--status-error-bg:var(--red-100);

  /* Type */
  --font-display:"Arvo",Rockwell,Georgia,"Times New Roman",serif;
  --font-sans:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --fs-display-1:76px;--fs-display-2:56px;--fs-display-3:40px;
  --fs-heading-2:24px;--fs-heading-3:20px;
  --fs-lead:21px;--fs-body:17px;--fs-body-sm:15px;--fs-caption:13px;--fs-micro:11px;
  --ls-display:-0.015em;--ls-wide:0.06em;--ls-eyebrow:0.16em;--ls-caps-lockup:0.28em;
  --measure-prose:66ch;--measure-narrow:46ch;

  /* Space & shape */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;
  --space-7:32px;--space-8:40px;--space-9:48px;--space-10:64px;
  --container-max:1160px;--gutter:24px;--gutter-lg:40px;
  --radius-sm:3px;--radius-md:6px;--radius-pill:999px;

  --shadow-xs:0 1px 2px rgba(27,44,81,.06);
  --shadow-md:0 4px 14px rgba(27,44,81,.10);
  --shadow-lg:0 14px 40px rgba(27,44,81,.14);
  --shadow-book:0 18px 44px rgba(27,44,81,.28);
  --shadow-focus:0 0 0 3px rgba(221,181,40,.55);

  --ease-standard:cubic-bezier(.2,.6,.2,1);
  --dur-fast:120ms;--dur-base:200ms;--dur-slow:320ms;
  --transition-ui:color var(--dur-fast) var(--ease-standard),background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard);
}

/* --- Base ---------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-sans);font-size:var(--fs-body);line-height:1.62;color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-strong);font-weight:400;letter-spacing:var(--ls-display);margin:0;text-wrap:balance}
p{margin:0}
img{max-width:100%;display:block}
a{color:var(--text-link);text-decoration:none;border-bottom:1px solid var(--border-accent);transition:var(--transition-ui)}
a:hover{color:var(--text-link-hover);border-bottom-color:var(--yellow-400)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
::selection{background:var(--yellow-200);color:var(--navy-700)}
code,kbd{font-family:var(--font-mono);font-size:.92em}
[hidden]{display:none !important}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* --- Icon ---------------------------------------------------------------- */
.icon{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.icon--15{width:15px;height:15px}
.icon--18{width:18px;height:18px}
.icon--22{width:22px;height:22px}
.icon--26{width:26px;height:26px}
.icon--28{width:28px;height:28px}
.icon--40{width:40px;height:40px}

/* --- Layout -------------------------------------------------------------- */
.container{max-width:var(--container-max);margin:0 auto}
.section{padding:var(--pad,96px) var(--gutter-lg);background:var(--surface-page)}
.section--warm{background:var(--surface-page-warm)}
.section--sunken{background:var(--surface-sunken)}
.section--accent{background:var(--surface-accent)}
.section--dark{background:var(--surface-dark);color:#fff}
.section--accent .eyebrow--rule::before{background:var(--navy-500)}
.section--accent .sh__lead{color:var(--navy-600)}

/* --- Wordmark ------------------------------------------------------------ */
.wordmark{display:inline-flex;align-items:center;gap:9px}
.wordmark__device{height:20px;width:auto}
.wordmark__text{font:400 20px/1.3 var(--font-display);letter-spacing:var(--ls-display);color:var(--navy-500);white-space:nowrap}
.wordmark--light .wordmark__text{font-size:22px;color:#fff}
a.wordmark-link{border-bottom:none;display:inline-flex;align-items:center;min-width:0}

/* --- Buttons ------------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:11px 22px;
  font:600 var(--fs-body-sm)/1.1 var(--font-sans);letter-spacing:var(--ls-wide);text-transform:uppercase;
  border-radius:var(--radius-pill);border:2px solid transparent;cursor:pointer;text-decoration:none;
  background:var(--navy-500);color:#fff;border-color:var(--navy-500);
  transition:var(--transition-ui),transform var(--dur-fast) var(--ease-standard)}
.btn > span{white-space:nowrap}
.btn:hover{background:var(--navy-600);border-color:var(--navy-600);color:#fff}
.btn:active{background:var(--navy-700);border-color:var(--navy-700);transform:translateY(1px)}
.btn--sm{padding:7px 14px;font-size:var(--fs-caption)}
.btn--sm .icon{width:15px;height:15px}
.btn--lg{padding:15px 30px;font-size:var(--fs-body);gap:var(--space-3)}
.btn--lg .icon{width:19px;height:19px}
.btn .icon{width:17px;height:17px}
.btn--accent{background:var(--yellow-400);color:var(--navy-600);border-color:var(--yellow-400)}
.btn--accent:hover{background:var(--yellow-500);border-color:var(--yellow-500);color:var(--navy-600)}
.btn--accent:active{background:var(--yellow-600);border-color:var(--yellow-600);color:#fff}
.btn--outline{background:transparent;color:var(--navy-500);border-color:var(--navy-500)}
.btn--outline:hover{background:var(--navy-50);color:var(--navy-500);border-color:var(--navy-500)}
.btn--outline:active{background:var(--navy-100)}
.btn--ghost{background:transparent;color:var(--navy-500);border-color:transparent}
.btn--ghost:hover{background:var(--navy-50);color:var(--navy-500);border-color:transparent}
.btn--ondark{background:#fff;color:var(--navy-600);border-color:#fff}
.btn--ondark:hover{background:var(--yellow-400);border-color:var(--yellow-400);color:var(--navy-600)}
.btn--block{display:flex;width:100%}

.icon-btn{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;border:2px solid transparent;background:transparent;color:var(--navy-500);
  cursor:pointer;transition:var(--transition-ui)}
.icon-btn:hover{background:var(--navy-50)}
.icon-btn--soft{background:var(--navy-50)}
.icon-btn--soft:hover{background:var(--navy-100)}
.icon-btn--sm{width:32px;height:32px}
.icon-btn--sm .icon{width:15px;height:15px}

/* --- Cards --------------------------------------------------------------- */
.card{background:var(--surface-card);border:1px solid var(--border-hairline);border-radius:var(--radius-md);
  padding:var(--space-7);box-shadow:var(--shadow-xs);color:var(--text-body);
  transition:box-shadow var(--dur-base) var(--ease-standard),transform var(--dur-base) var(--ease-standard)}
.card--accent-top{border-top:3px solid var(--yellow-400)}
.card--interactive{border-bottom:1px solid var(--border-hairline)}
a.card--interactive{cursor:pointer}
.card--interactive:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
a.card{display:block;border-bottom:1px solid var(--border-hairline);color:var(--text-body)}
a.card:hover{color:var(--text-body)}
.card__stack{display:flex;flex-direction:column;gap:var(--space-4);height:100%}
.card__title{font:400 var(--fs-heading-3)/1.3 var(--font-display);letter-spacing:var(--ls-display);color:var(--text-strong)}
.card__body{font:400 var(--fs-body-sm)/1.55 var(--font-sans);color:var(--text-muted)}
.card__num{font:700 var(--fs-caption)/1 var(--font-mono);color:var(--gray-300)}
.icon-circle{width:44px;height:44px;border-radius:var(--radius-pill);background:var(--yellow-400);
  color:var(--navy-600);display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}

/* --- Brand type ---------------------------------------------------------- */
.eyebrow{display:inline-flex;align-items:center;gap:var(--space-3);font:700 var(--fs-caption)/1.2 var(--font-sans);
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--navy-500)}
.eyebrow--rule::before{content:"";width:32px;height:3px;background:var(--yellow-400);flex:0 0 auto}
.eyebrow--light{color:var(--navy-200)}

.sh{display:flex;flex-direction:column;gap:var(--space-4);align-items:flex-start;max-width:var(--measure-prose)}
.sh__title{font:400 clamp(28px,5.2vw,var(--fs-display-3))/1.08 var(--font-display);letter-spacing:var(--ls-display);color:var(--text-strong)}
.sh__lead{font:400 var(--fs-lead)/1.5 var(--font-sans);color:var(--text-body)}
.sh--dark .sh__title{color:#fff}
.sh--dark .sh__lead{color:var(--navy-200)}
.sh--wide{max-width:none}

.display-2{font:400 clamp(34px,8vw,var(--fs-display-2))/1.02 var(--font-display);letter-spacing:var(--ls-display);color:var(--text-strong)}
.lead{font:400 var(--fs-lead)/1.5 var(--font-sans);color:var(--text-strong);max-width:52ch}
.prose{font:400 var(--fs-body)/1.62 var(--font-sans);max-width:var(--measure-prose)}
.meta{font:400 var(--fs-caption)/1.5 var(--font-sans);color:var(--text-muted)}

.quote{margin:0;display:flex;flex-direction:column;gap:var(--space-5);max-width:var(--measure-narrow);color:var(--navy-600)}
.quote blockquote{margin:0;font:400 clamp(24px,4.4vw,var(--fs-display-3))/1.22 var(--font-display);letter-spacing:var(--ls-display);text-wrap:balance}
.quote--sm blockquote{font-size:var(--fs-lead);line-height:1.34}
.quote figcaption{font:600 var(--fs-caption)/1.5 var(--font-sans);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--text-muted)}
.quote__role{display:block;font-weight:400;text-transform:none;letter-spacing:0}
.quote--dark{color:#fff}
.quote--dark figcaption{color:var(--navy-200)}
.quote--accent figcaption{color:var(--navy-600)}
.quote--center{align-items:center;text-align:center;max-width:70ch}

.badge{display:inline-block;padding:4px 10px 3px;font:700 var(--fs-micro)/1.2 var(--font-sans);
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;border-radius:var(--radius-pill);
  white-space:nowrap;background:var(--yellow-400);color:var(--navy-600)}

.tag{display:inline-flex;align-items:center;gap:var(--space-2);padding:6px 12px;
  font:500 var(--fs-caption)/1.2 var(--font-sans);border:1px solid var(--border-hairline);
  background:#fff;color:var(--navy-600);border-radius:var(--radius-pill);cursor:pointer;transition:var(--transition-ui)}
.tag:hover{background:var(--navy-50)}
.tag[aria-pressed="true"]{background:var(--navy-500);border-color:var(--navy-500);color:#fff}

/* --- Tabs ---------------------------------------------------------------- */
.tabs{display:flex;gap:var(--space-7);border-bottom:1px solid var(--border-hairline);overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs__btn{appearance:none;background:transparent;border:none;cursor:pointer;white-space:nowrap;
  font:500 var(--fs-caption)/1.2 var(--font-sans);letter-spacing:var(--ls-wide);text-transform:uppercase;
  color:var(--text-muted);padding:0 0 12px;transition:var(--transition-ui)}
.tabs__btn[aria-selected="true"]{font-weight:700;color:var(--navy-600);box-shadow:inset 0 -3px 0 0 var(--yellow-400)}

/* --- Forms --------------------------------------------------------------- */
.field{display:flex;flex-direction:column;gap:var(--space-2)}
.field__label{font:700 var(--fs-micro)/1.2 var(--font-sans);letter-spacing:var(--ls-eyebrow);
  text-transform:uppercase;color:var(--navy-500)}
.field__hint{font:400 var(--fs-caption)/1.4 var(--font-sans);color:var(--text-muted)}
.control{position:relative;display:flex;align-items:center}
.control__icon{position:absolute;left:13px;color:var(--text-faint);display:flex;pointer-events:none}
.control__chevron{position:absolute;right:13px;color:var(--navy-400);display:flex;pointer-events:none}
.input,.textarea,.select{width:100%;font:400 var(--fs-body-sm)/1.4 var(--font-sans);color:var(--text-strong);
  background:#fff;border:1px solid var(--border-hairline);border-radius:var(--radius-sm);padding:11px 13px;
  outline:none;transition:var(--transition-ui)}
.input:focus,.textarea:focus,.select:focus{border-color:var(--navy-500);box-shadow:var(--shadow-focus);outline:none}
.control--icon .input{padding-left:40px}
.select{appearance:none;padding-right:40px;cursor:pointer}
.textarea{resize:vertical}
.checkbox{display:flex;gap:var(--space-3);align-items:flex-start;cursor:pointer}
.checkbox input{position:absolute;opacity:0;width:0;height:0}
.checkbox__box{width:20px;height:20px;flex:0 0 auto;margin-top:1px;border-radius:var(--radius-sm);
  border:2px solid var(--gray-300);background:#fff;color:#fff;display:flex;align-items:center;
  justify-content:center;transition:var(--transition-ui)}
.checkbox__box .icon{width:14px;height:14px;opacity:0}
.checkbox input:checked + .checkbox__box{background:var(--navy-500);border-color:var(--navy-500)}
.checkbox input:checked + .checkbox__box .icon{opacity:1}
.checkbox input:focus-visible + .checkbox__box{outline:2px solid var(--focus-ring);outline-offset:2px}
.checkbox__label{display:block;font:500 var(--fs-body-sm)/1.4 var(--font-sans);color:var(--text-strong)}
.checkbox__hint{display:block;font:400 var(--fs-caption)/1.45 var(--font-sans);color:var(--text-muted)}

/* --- Dialog -------------------------------------------------------------- */
.scrim{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(19,31,57,.55);backdrop-filter:blur(3px);padding:var(--space-6);z-index:60}
.dialog{width:var(--dialog-w,520px);max-width:100%;max-height:calc(100vh - 48px);overflow:auto;
  background:#fff;border-radius:var(--radius-md);border-top:3px solid var(--yellow-400);box-shadow:var(--shadow-lg)}
.dialog__head{display:flex;align-items:flex-start;gap:var(--space-4);padding:var(--space-7) var(--space-7) var(--space-4)}
.dialog__title{flex:1;font:400 var(--fs-heading-2)/1.2 var(--font-display);letter-spacing:var(--ls-display);color:var(--text-strong)}
.dialog__body{padding:0 var(--space-7);font:400 var(--fs-body-sm)/1.6 var(--font-sans);color:var(--text-body)}
.dialog__body p{margin:0}
.dialog__foot{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--space-3);padding:var(--space-7)}
.dialog__spacer{height:var(--space-7)}
.dialog__stack{display:flex;flex-direction:column;gap:var(--space-4)}
.dialog__row{display:flex;gap:var(--space-5);flex-wrap:wrap}
.dialog__cover{width:110px;height:auto;border-radius:2px;box-shadow:var(--shadow-md)}
.video-frame{position:relative;width:100%;padding-top:56.25%;background:#000;border-radius:var(--radius-sm);overflow:hidden}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.fullscreen-video{position:fixed;inset:0;z-index:90;background:#000;display:flex;align-items:center;justify-content:center}
.fullscreen-video iframe{width:100%;height:100%;border:0}
.fullscreen-video__close{position:absolute;top:max(12px,env(safe-area-inset-top));right:12px;width:44px;height:44px;
  border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.55);color:#fff;
  font:600 18px/1 var(--font-sans);cursor:pointer}

/* --- Toast --------------------------------------------------------------- */
.toast-host{position:fixed;right:24px;bottom:24px;z-index:80;display:flex;flex-direction:column;gap:var(--space-3)}
.toast{display:flex;gap:var(--space-3);align-items:flex-start;background:#fff;border:1px solid var(--border-hairline);
  border-left:none;border-radius:var(--radius-sm);box-shadow:var(--shadow-md);padding:var(--space-4) var(--space-5);
  min-width:300px;max-width:420px;background-image:linear-gradient(to right,var(--navy-500) 0 3px,transparent 3px)}
.toast--success{background-image:linear-gradient(to right,var(--status-success-fg) 0 3px,transparent 3px)}
.toast__icon{display:flex;margin-top:1px;color:var(--navy-500)}
.toast--success .toast__icon{color:var(--status-success-fg)}
.toast__title{font:600 var(--fs-body-sm)/1.35 var(--font-sans);color:var(--text-strong)}
.toast__body{font:400 var(--fs-caption)/1.5 var(--font-sans);color:var(--text-muted)}
.toast__dismiss{appearance:none;background:none;border:none;cursor:pointer;color:var(--text-faint);display:flex;padding:0}

/* --- Header -------------------------------------------------------------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border-hairline)}
.site-header__bar{max-width:var(--container-max);margin:0 auto;padding:var(--space-3) var(--gutter-lg);
  min-height:76px;display:flex;align-items:center;gap:var(--space-6);flex-wrap:wrap;row-gap:var(--space-3)}
.site-nav{display:flex;gap:var(--space-5);margin-left:auto;flex-wrap:wrap;row-gap:var(--space-3)}
.site-nav__link{border-bottom:3px solid transparent;padding-bottom:4px;margin-bottom:-7px;
  font:500 var(--fs-caption)/1 var(--font-sans);letter-spacing:var(--ls-wide);text-transform:uppercase;
  color:var(--text-muted);white-space:nowrap}
.site-nav__link:hover{color:var(--navy-500);border-bottom-color:transparent}
.site-nav__link.is-active{border-bottom-color:var(--yellow-400);font-weight:700;color:var(--navy-600)}
.site-header__cta{flex:0 0 auto}
.site-header__toggle{display:none;margin-left:auto}
.site-drawer{display:none}

/* --- Footer -------------------------------------------------------------- */
.site-footer{background:var(--surface-dark-deep);color:var(--navy-200);padding:var(--space-10) var(--gutter-lg) var(--space-8)}
.site-footer__grid{max-width:var(--container-max);margin:0 auto;display:grid;grid-template-columns:1.2fr .7fr 1.4fr;gap:var(--space-10)}
.site-footer__col{display:flex;flex-direction:column;gap:var(--space-4)}
.site-footer__blurb{font:400 var(--fs-body-sm)/1.6 var(--font-sans);max-width:34ch}
.site-footer__head{font:700 var(--fs-micro)/1 var(--font-sans);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:#fff}
.site-footer__links{display:flex;flex-direction:column;gap:var(--space-3)}
.site-footer__links a{color:var(--navy-200);border-bottom:none;font:400 var(--fs-body-sm)/1.7 var(--font-sans)}
.site-footer__links a:hover{color:#fff}
.site-footer__quote{margin:0;display:flex;flex-direction:column;gap:var(--space-4);
  border-left:3px solid var(--yellow-400);padding-left:var(--space-5)}
.site-footer__quote blockquote{margin:0;font:400 var(--fs-body-sm)/1.65 var(--font-sans);color:#fff}
.site-footer__quote figcaption{font:400 var(--fs-caption)/1.5 var(--font-sans);color:var(--navy-300)}
.site-footer__who{display:block;font-weight:700;color:var(--yellow-400)}
.site-footer__legal{max-width:var(--container-max);margin:var(--space-9) auto 0;padding-top:var(--space-5);
  border-top:1px solid var(--border-on-dark);font:400 var(--fs-caption)/1.4 var(--font-sans);color:var(--navy-300)}
.site-footer__cta-row{margin-top:var(--space-2)}

/* --- Hero (home) --------------------------------------------------------- */
.hero{position:relative;background:var(--yellow-400);overflow:hidden}
.hero__device{position:absolute;right:-90px;top:-110px;height:780px;width:auto;opacity:.5;max-width:none}
.hero__inner{position:relative;max-width:var(--container-max);margin:0 auto;padding:104px var(--gutter-lg);
  display:grid;grid-template-columns:1.15fr .85fr;gap:var(--space-10);align-items:center}
.hero__copy{display:flex;flex-direction:column;gap:var(--space-6);min-width:0}
.hero__eyebrow{font:700 var(--fs-caption)/1.4 var(--font-sans);letter-spacing:var(--ls-caps-lockup);
  text-transform:uppercase;color:var(--navy-500)}
.hero__title{margin:0;font:400 clamp(38px,10.5vw,var(--fs-display-1))/.94 var(--font-display);
  letter-spacing:var(--ls-display);color:var(--navy-500);overflow-wrap:break-word}
.hero__lead{max-width:var(--measure-narrow);font:400 var(--fs-lead)/1.5 var(--font-sans);color:var(--navy-600)}
.hero__actions{display:flex;gap:var(--space-4);align-items:center;margin-top:var(--space-2);flex-wrap:wrap}
.hero__cover-wrap{display:flex;justify-content:center;min-width:0}
.book-cover{width:100%;max-width:320px;height:auto;border-radius:2px;box-shadow:var(--shadow-book)}

/* --- Grids --------------------------------------------------------------- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
.grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:var(--space-5)}
.mt-9{margin-top:var(--space-9)}
.mt-8{margin-top:var(--space-8)}
.mt-7{margin-top:var(--space-7)}

.learn-more{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font:700 var(--fs-caption)/1 var(--font-sans);
  letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--navy-500)}
.rule-link{margin-top:var(--space-7);display:flex;align-items:center;justify-content:center;gap:var(--space-4);flex-wrap:wrap}
.rule-link__rule{height:1px;flex:1;min-width:40px;background:var(--border-hairline)}
.rule-link a{display:inline-flex;align-items:center;gap:8px;border-bottom:none;font:700 var(--fs-caption)/1.4 var(--font-sans);
  letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--navy-500);text-align:center}

/* --- Video block --------------------------------------------------------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-10);align-items:center}
.video-thumb{cursor:pointer;position:relative;aspect-ratio:16/9;background:linear-gradient(160deg,var(--navy-500),var(--navy-800));
  border:1px solid var(--border-on-dark);border-radius:var(--radius-md);display:flex;align-items:center;
  justify-content:center;overflow:hidden;container-type:inline-size;padding:0;width:100%}
.video-thumb__device{position:absolute;left:-30px;bottom:0;height:100%;width:auto;opacity:.12;max-width:none}
.video-thumb__label{position:absolute;left:calc(29% + 8px);right:28px;bottom:24px;font:400 clamp(13px,7cqi,46px)/1.05 var(--font-display);
  letter-spacing:var(--ls-display);color:var(--navy-200);white-space:nowrap;text-align:center}
.video-thumb__play{position:relative;width:52px;height:52px;border-radius:50%;background:var(--yellow-400);
  color:var(--navy-600);display:flex;align-items:center;justify-content:center}
.video-thumb__play .icon{width:23px;height:23px}

/* --- Clients marquee ----------------------------------------------------- */
.marquee{background:var(--surface-page);padding:34px 0;overflow:hidden;
  border-top:1px solid var(--border-hairline);border-bottom:1px solid var(--border-hairline)}
.marquee__track{display:flex;width:max-content;animation:tcc-marquee 46s linear infinite}
.marquee__group{display:flex;align-items:center;gap:var(--space-9);padding-right:var(--space-9)}
.marquee__item{font:600 var(--fs-body-sm)/1 var(--font-sans);letter-spacing:var(--ls-wide);
  text-transform:uppercase;color:var(--gray-400);white-space:nowrap}
@keyframes tcc-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* --- Newsletter band ----------------------------------------------------- */
.band{display:flex;align-items:center;gap:var(--space-9);flex-wrap:wrap}
.band__copy{flex:1;min-width:min(100%,320px)}

/* --- Book page ----------------------------------------------------------- */
.book-hero{display:grid;grid-template-columns:300px 1fr;gap:var(--space-10);align-items:start}
.book-hero__cover{width:300px;border-radius:2px;box-shadow:var(--shadow-book)}
.stack-5{display:flex;flex-direction:column;gap:var(--space-5)}
.actions{display:flex;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-2)}
.meta-row{display:flex;gap:var(--space-4);align-items:center;flex-wrap:wrap;margin-top:var(--space-2)}
.check-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);max-width:900px}
.check-list li{display:flex;gap:var(--space-3);align-items:flex-start;font:400 var(--fs-body)/1.55 var(--font-sans)}
.check-list .icon{color:var(--yellow-500);margin-top:2px}

/* --- Author page --------------------------------------------------------- */
.author-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--space-10);align-items:center}
.portrait{margin:0}
.portrait img{display:block;width:100%;height:auto;border-radius:var(--radius-md);box-shadow:var(--shadow-sm)}
.quote-split{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--space-10);align-items:center}
.keynotes{display:flex;flex-direction:column;gap:var(--space-4);align-items:flex-start;border-top:3px solid var(--yellow-400);padding-top:var(--space-5)}
a.learn-more{border-bottom:none}
.bio-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:var(--space-10);align-items:start}
.portrait-slot{aspect-ratio:4/5;background:var(--surface-sunken);border:1px dashed var(--gray-300);
  border-radius:var(--radius-md);display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:var(--space-3);color:var(--text-faint);text-align:center;padding:var(--space-6)}
.portrait-slot__label{font:700 var(--fs-micro)/1.4 var(--font-sans);letter-spacing:var(--ls-eyebrow);text-transform:uppercase}
.portrait-slot__note{font:400 var(--fs-caption)/1.5 var(--font-sans)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-8)}
.stats--3{grid-template-columns:repeat(3,1fr)}
.stat{border-top:3px solid var(--yellow-400);padding-top:var(--space-4)}
.stat__n{font:400 clamp(30px,6vw,var(--fs-display-3))/1 var(--font-display);letter-spacing:var(--ls-display);color:#fff}
.stat__label{margin-top:var(--space-2);font:700 var(--fs-micro)/1.4 var(--font-sans);letter-spacing:var(--ls-eyebrow);
  text-transform:uppercase;color:var(--navy-200)}

/* --- Services page ------------------------------------------------------- */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:var(--space-10);align-items:start}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.form-stack{display:flex;flex-direction:column;gap:var(--space-5)}

/* --- Testimonials page --------------------------------------------------- */
.filters{display:flex;gap:var(--space-2);margin-top:var(--space-7);flex-wrap:wrap}
.masonry{column-count:2;column-gap:var(--space-6)}
.masonry .card{break-inside:avoid;margin-bottom:var(--space-6);display:inline-block;width:100%}

/* ==========================================================================
   Narrow — 860px and below
   ========================================================================== */
@media (max-width:860px){
  .section{padding-inline:var(--gutter);padding-block:max(48px,calc(var(--pad,96px) * .6))}

  .site-header__bar{padding:0 var(--gutter);min-height:64px;flex-wrap:nowrap;gap:var(--space-4)}
  .wordmark__text{font-size:17px}
  .wordmark__device{height:17px}
  .site-nav,.site-header__cta{display:none}
  .site-header__toggle{display:inline-flex}
  .site-drawer{display:block;border-top:1px solid var(--border-hairline);background:var(--surface-page);
    padding:var(--space-5) var(--gutter) var(--space-6)}
  .site-drawer[hidden]{display:none}
  .site-drawer__links{display:flex;flex-direction:column;gap:var(--space-2)}
  .site-drawer__links a{border-bottom:none;display:flex;align-items:center;min-height:48px;
    border-left:3px solid transparent;padding-left:var(--space-4);font:500 var(--fs-body)/1 var(--font-sans);
    letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--text-muted)}
  .site-drawer__links a.is-active{border-left-color:var(--yellow-400);font-weight:700;color:var(--navy-600)}
  .site-drawer__cta{margin-top:var(--space-3)}
  .site-drawer__cta .btn{width:100%}

  .hero__device{display:none}
  .hero__inner{grid-template-columns:1fr;gap:var(--space-8);padding:56px var(--gutter) 64px}
  .hero__eyebrow{line-height:1.5}
  .hero__eyebrow span{display:block}
  .hero__cover-wrap .book-cover{max-width:260px}

  .grid-3,.grid-auto{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
  .split{grid-template-columns:1fr;gap:var(--space-7)}
  .marquee{display:none}

  .book-hero{grid-template-columns:1fr;gap:var(--space-7);justify-items:center;text-align:left}
  .book-hero__cover{width:100%;max-width:240px}
  .check-list{grid-template-columns:1fr}

  .author-grid,.bio-grid,.quote-split{grid-template-columns:1fr;gap:var(--space-7)}
  .portrait-slot{max-width:320px;width:100%}
  .stats{grid-template-columns:1fr 1fr;gap:var(--space-6)}
  .stats--3{grid-template-columns:repeat(3,1fr);gap:var(--space-4)}

  .contact-grid{grid-template-columns:1fr;gap:var(--space-7)}
  .pair{grid-template-columns:1fr}
  .card{padding:var(--space-6)}

  .masonry{column-count:1}

  .site-footer{padding:var(--space-9) var(--gutter) var(--space-7)}
  .site-footer__grid{grid-template-columns:1fr;gap:var(--space-7)}

  .toast-host{right:var(--gutter);left:var(--gutter);bottom:var(--gutter)}
  .toast{min-width:0;max-width:none}
  .dialog{--dialog-w:100% !important}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}
