/* A/GEO Agency site styles
   Look: calm off-white paper, deep slate ink, sage accents, square corners, painted skies.
   Type: Roboto (headings, 500), Open Sans (paragraphs and interface text), JetBrains Mono (figures and code).
   All type sizes in rem. The root size scales with the viewport.
   Themes: light is the default on every page. html[data-theme="dark"] remaps the same tokens. */

@font-face { font-family: "Roboto"; src: url("/assets/fonts/roboto.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sans"; src: url("/assets/fonts/open-sans.woff2") format("woff2"); font-weight: 300 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sans"; src: url("/assets/fonts/open-sans-italic.woff2") format("woff2"); font-weight: 300 800; font-style: italic; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("/assets/fonts/jetbrains-mono-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }

:root {
  color-scheme: light;
  /* Page surface */
  --paper: #f8f9f7;
  --paper-2: #eef2ef;
  --card: #ffffff;
  --text: #19282e;
  --muted: #4d616a;
  --faint: #5c6f76;
  --line: #dbe3e0;
  --line-strong: #b4c3c0;
  --strong: #19282e;
  --on-strong: #f8f9f7;
  --strong-hover: #2b4048;
  --accent: #2f6b55;
  --accent-soft: #dfece4;
  /* Ink bands (dark panels, call to action, footer) */
  --ink: #19282e;
  --ink-2: #213840;
  --on-ink: #eef3f1;
  --on-ink-muted: #a9bcbd;
  --line-ink: rgba(238, 243, 241, 0.16);
  /* Highlight on ink, and as a soft fill with ink text on top */
  --lime: #b8e0c6;
  --lime-press: #a5d5b6;
  --on-lime: #19282e;
  --mark: #2f6b55;
  --radius: 3px;
  --shadow: 0 1px 2px rgb(25 40 46 / 0.06), 0 12px 32px -12px rgb(25 40 46 / 0.18);
  --display: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  --body: "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --s1: 0.25rem; --s2: 0.5rem; --s3: 1rem; --s4: 1.5rem; --s5: 2rem; --s6: 3rem; --s7: 4.5rem; --s8: 7rem;
}

/* Root size: 16px on phones, up to 18px on wide screens. Everything else is rem. */
html { font-size: clamp(100%, 93.75% + 0.25vw, 112.5%); -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--text); font-family: var(--body); font-size: 1rem; line-height: 1.6; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
h1, h2, h3, h4 { font-family: var(--display); font-weight: 500; line-height: 1.12; letter-spacing: -0.015em; margin: 0; text-wrap: balance; }
h1 { font-size: clamp(2.375rem, 1.5rem + 3.4vw, 3.875rem); line-height: 1.08; letter-spacing: -0.025em; text-wrap: wrap; }
h2 { font-size: clamp(1.875rem, 1.4rem + 1.8vw, 2.75rem); letter-spacing: -0.02em; }
h3 { font-size: 1.25rem; letter-spacing: -0.01em; line-height: 1.22; }
p { margin: 0; text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; }
strong, b { font-weight: 600; }
.mono { font-family: var(--mono); font-size: 0.75rem; letter-spacing: 0.01em; }
/* Eyebrow: small caps label with a dot, used above headings and on cards */
.eyebrow { display: inline-flex; align-items: center; gap: 0.5rem; font-family: var(--body); font-size: 0.6875rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; color: var(--muted); }
.eyebrow::before { content: ""; width: 0.3125rem; height: 0.3125rem; border-radius: 50%; background: currentColor; opacity: 0.8; }
.nowrap { white-space: nowrap; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -999px; top: 0; background: var(--strong); color: var(--on-strong); padding: var(--s2) var(--s3); z-index: 100; }
.skip:focus { left: var(--s3); }
:focus-visible { outline: 2px solid var(--strong); outline-offset: 3px; }
.section--ink :focus-visible, .site-foot :focus-visible, .cta-band :focus-visible { outline-color: var(--on-ink); }

.wrap { width: 100%; max-width: 76rem; margin-inline: auto; padding-inline: 1rem; }
@media (min-width: 48em) { .wrap { padding-inline: 2rem; } }
.wrap--text { max-width: 44rem; }

/* Buttons: square, quiet, with an arrow on the main action */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.625rem; min-height: 2.875rem; padding: 0.6875rem 1.125rem; border-radius: 2px; border: 1px solid transparent; font-family: var(--body); font-weight: 500; font-size: 0.9375rem; line-height: 1.2; letter-spacing: 0; text-decoration: none; cursor: pointer; transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, transform 150ms ease; }
.btn--sm { min-height: 2.375rem; padding: 0.4375rem 0.875rem; font-size: 0.875rem; }
.btn--block { width: 100%; }
.btn--accent, .btn--ink { background: var(--btn-bg, var(--strong)); color: var(--btn-fg, var(--on-strong)); border-color: var(--btn-bg, var(--strong)); }
.btn--accent:hover, .btn--ink:hover { background: var(--btn-hover, var(--strong-hover)); border-color: var(--btn-hover, var(--strong-hover)); }
.btn--accent::after { content: "\2192"; display: inline-block; transition: transform 150ms ease; }
.btn--accent:hover::after { transform: translateX(0.1875rem); }
.btn--sm.btn--accent::after { content: none; }
.btn--ghost, .btn--ghost-dark { background: var(--ghost-bg, var(--card)); border-color: var(--line-strong); color: var(--text); }
.btn--ghost:hover, .btn--ghost-dark:hover { border-color: var(--strong); }
.link { font-weight: 500; text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 0.25em; transition: text-decoration-color 150ms ease; }
.link:hover { text-decoration-color: currentColor; }
@media (prefers-reduced-motion: reduce) { .btn--accent::after { transition: none; } }

/* Ink bands: light buttons on dark */
.section--ink, .cta-band, .site-foot, .audit-cta, .score__card, .score-next, .tldr, .score-bar, .feature--dark {
  --btn-bg: var(--on-ink); --btn-fg: var(--ink); --btn-hover: #ffffff;
  --ghost-bg: transparent;
}
.section--ink .btn--ghost, .section--ink .btn--ghost-dark, .cta-band .btn--ghost-dark, .site-foot .btn--ghost-dark, .score-next .btn--ghost, .audit-cta .btn--ghost-dark { border-color: var(--line-ink); color: var(--on-ink); }
.section--ink .btn--ghost:hover, .section--ink .btn--ghost-dark:hover, .cta-band .btn--ghost-dark:hover, .score-next .btn--ghost:hover { border-color: var(--on-ink); }

/* Header: light bar on the page surface, nav in the middle */
.site-head { position: sticky; top: 0; z-index: 50; background: var(--paper); color: var(--text); border-bottom: 1px solid var(--line); }
.site-head__in { display: flex; align-items: center; justify-content: space-between; gap: var(--s3); min-height: 4rem; }
.brand { display: inline-flex; align-items: baseline; gap: 0.375rem; text-decoration: none; color: var(--text); }
.brand__mark { font-family: var(--display); font-weight: 700; font-size: 1.375rem; letter-spacing: -0.018em; line-height: 1; }
.brand__mark::after { content: ""; display: inline-block; width: 0.4em; height: 0.4em; margin-left: 0.14em; background: var(--mark); border-radius: 1px; }
.brand--light { color: var(--on-ink); }
.brand--light .brand__mark::after { background: var(--lime); }
.nav-toggle { display: none; background: var(--card); border: 1px solid var(--line-strong); color: var(--text); border-radius: 2px; font: 500 0.875rem var(--body); padding: 0.4375rem 0.875rem; min-height: 2.5rem; cursor: pointer; }
.site-nav { display: flex; align-items: center; gap: var(--s4); margin-inline: auto; }
@media (min-width: 75.0625em) { .site-nav > ul { gap: 1.5rem; } }
.site-nav__cta { display: none; }
.site-head__actions { display: flex; align-items: center; gap: var(--s2); flex-shrink: 0; }

/* Theme button: a square with the same size, border and corners as the small buttons.
   Light theme shows a moon (click for dark). Dark theme shows a sun (click for light). */
.theme-toggle, .icon-btn { display: inline-grid; place-items: center; width: 2.375rem; height: 2.375rem; padding: 0; background: var(--card); border: 1px solid var(--line-strong); border-radius: 2px; color: var(--text); cursor: pointer; text-decoration: none; transition: border-color 150ms ease, background-color 150ms ease; }
.theme-toggle:hover, .icon-btn:hover { border-color: var(--strong); }
/* Icon link to the LLM Watch Dashboard, same shape as the theme button */
.icon-btn__icon { width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linejoin: round; }
.icon-btn[aria-current="page"] { border-color: var(--strong); background: var(--paper-2); }
.icon-btn:focus-visible { outline: 2px solid var(--strong); outline-offset: 2px; }
.icon-btn--mail .icon-btn__icon { stroke-linecap: round; }
html:not(.js) .theme-toggle { display: none; }
.theme-toggle__icon { width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle__sun { display: none; }
html[data-theme="dark"] .theme-toggle__sun { display: block; }
html[data-theme="dark"] .theme-toggle__moon { display: none; }
.theme-toggle:focus-visible { outline: 2px solid var(--strong); outline-offset: 2px; }
@media (max-width: 75em) { .theme-toggle, .icon-btn { width: 2.5rem; height: 2.5rem; } }

.site-nav ul { display: flex; gap: var(--s4); list-style: none; }
.site-nav ul a { text-decoration: none; font-size: 0.8125rem; color: var(--text); transition: color 150ms ease; }
.site-nav ul a:hover { color: var(--muted); }
/* Mega dropdowns: full-width panel under the header */
.nav-group { position: relative; }
.nav-group__btn { display: inline-flex; align-items: center; gap: 0.3em; padding: 0; border: 0; background: none; font: inherit; font-size: 0.8125rem; color: var(--text); cursor: pointer; transition: color 150ms ease; }
.nav-group__btn:hover, .nav-group__btn[aria-expanded="true"] { color: var(--muted); }
.nav-group[data-current] > .nav-group__btn { text-decoration: underline; text-decoration-color: var(--line-strong); text-decoration-thickness: 1px; text-underline-offset: 0.5em; }
.nav-group__chev { flex: none; display: block; width: 0.6875rem; height: 0.6875rem; opacity: 0.6; transition: transform 150ms ease; }
.nav-group__btn[aria-expanded="true"] .nav-group__chev { transform: rotate(180deg); }
.nav-mega { display: none; }
.nav-group__btn[aria-expanded="true"] + .nav-mega { display: block; }
html:not(.js) .nav-group:focus-within > .nav-mega { display: block; }
.site-nav .nav-sub { display: flex; flex-direction: column; gap: 0; list-style: none; }
.site-nav .nav-sub a { display: flex; flex-direction: column; gap: 0.15rem; text-decoration: none; }
.nav-sub__name { font-size: 0.9375rem; font-weight: 500; }
.nav-sub__note { font-size: 0.8125rem; }
@media (min-width: 75.0625em) {
  .site-nav > ul > .nav-group { position: static; padding-block: 1.5rem; margin-block: -1.5rem; }
  @media (hover: hover) { .nav-group:hover > .nav-mega { display: block; } }
  .nav-mega { position: absolute; left: 0; right: 0; top: 100%; z-index: 60; background: var(--paper); color: var(--text); border-bottom: 1px solid var(--line); box-shadow: 0 1.5rem 3rem -1rem rgb(25 40 46 / 0.18); }
  .nav-mega::before { content: ""; position: absolute; left: 0; right: 0; top: -0.75rem; height: 0.75rem; }
  .nav-mega__in { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) minmax(0, 0.8fr); gap: var(--s5); padding-block: var(--s4) var(--s5); }
  .nav-mega__title { font-family: var(--display); font-weight: 500; font-size: 1.375rem; letter-spacing: -0.012em; line-height: 1.15; }
  .nav-mega__intro p:not(.nav-mega__title) { margin-top: var(--s2); color: var(--muted); max-width: 22rem; font-size: 0.875rem; line-height: 1.5; }
  .nav-mega__label { font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--muted); margin-bottom: var(--s2); font-family: var(--body); }
  .site-nav .nav-sub { border-top: 1px solid var(--line); }
  .site-nav .nav-sub li { border-bottom: 1px solid var(--line); }
  .site-nav .nav-sub a { gap: 0.0625rem; padding: 0.5rem 0.625rem; margin-inline: -0.625rem; border-radius: 0; color: var(--text); transition: background-color 150ms ease; }
  .site-nav .nav-sub a:hover, .site-nav .nav-sub a:focus-visible { background: var(--paper-2); }
  .site-nav .nav-mega a, .site-nav .nav-mega a:hover, .site-nav .nav-mega a[aria-current="page"] { color: var(--text); }
  .site-nav .nav-sub a[aria-current="page"] { box-shadow: inset 2px 0 0 var(--strong); text-decoration: none; background: var(--paper-2); }
  .nav-sub__name { font-size: 0.875rem; line-height: 1.35; }
  .nav-sub__note { color: var(--muted); font-size: 0.75rem; line-height: 1.4; }
  .nav-mega__feature { display: grid; gap: var(--s2); align-content: start; color: var(--text); text-decoration: none; }
  .nav-mega__feature { max-width: 17rem; }
  .nav-mega__feature img { width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; border-radius: 2px; border: 1px solid var(--line); }
  .nav-mega__kicker { font-family: var(--body); font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--muted); margin-top: var(--s1); }
  .nav-mega__ftitle { font-family: var(--display); font-weight: 500; font-size: 1rem; line-height: 1.25; letter-spacing: -0.006em; }
  .nav-mega__more { font-weight: 500; font-size: 0.8125rem; text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 0.25em; }
  .nav-mega__feature:hover .nav-mega__ftitle { text-decoration: underline; text-underline-offset: 0.15em; text-decoration-thickness: 1px; }
  .nav-mega__feature--stat { padding: var(--s3); background: var(--card); border: 1px solid var(--line); border-radius: 2px; }
  .nav-mega__stat { font-family: var(--display); font-weight: 500; font-size: 2rem; line-height: 1; letter-spacing: -0.025em; }
  .nav-mega__src { color: var(--muted); font-size: 0.75rem; }
}
@media (max-width: 75em) {
  .nav-toggle { display: inline-flex; align-items: center; }
  .js .site-nav { display: none; }
  .site-nav { position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: var(--s3); padding: var(--s2) 1rem var(--s4); background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 1.5rem 3rem -1rem rgb(25 40 46 / 0.2); max-height: calc(100dvh - 4rem); overflow-y: auto; margin: 0; }
  .js .site-nav.is-open { display: flex; }
  .site-nav ul { flex-direction: column; gap: 0; }
  .site-nav ul a { display: block; padding: 0.625rem 0; font-size: 0.9375rem; color: var(--text); border-bottom: 1px solid var(--line); }
  .site-nav .btn { width: 100%; }
  .nav-group__btn { display: flex; width: 100%; justify-content: space-between; padding: 0.75rem 0; font-size: 0.9375rem; font-weight: 500; color: var(--text); border-bottom: 1px solid var(--line); }
  .nav-group[data-current] > .nav-group__btn { text-decoration: none; }
  .nav-mega__in { padding: 0 0 0 var(--s3); }
  .site-nav .nav-mega__intro, .site-nav .nav-mega__feature, .site-nav .nav-mega__label { display: none; }
  .site-nav .nav-sub a { gap: 0.0625rem; padding: 0.5rem 0; border-bottom: 1px solid var(--line); color: var(--text); }
  .nav-sub__name { font-size: 0.875rem; }
  .nav-sub__note { font-size: 0.75rem; }
  .nav-sub__note { color: var(--muted); }
  .site-nav .nav-sub a[aria-current="page"] .nav-sub__name { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.3em; }
}
@media (max-width: 30em) {
  .site-head__cta { display: none; }
  .site-nav__cta { display: inline-flex; }
}
@media (min-width: 75.0625em) { .site-head__in { min-height: 4.5rem; } }

/* Hero: copy on the left, a painted sky scene on the right */
.hero { padding-block: var(--s6) var(--s7); }
.hero__in { display: grid; gap: var(--s6); align-items: center; }
@media (min-width: 60em) { .hero { padding-block: var(--s7) var(--s8); } .hero__in { grid-template-columns: 1fr 1fr; gap: var(--s7); } }
.hero h1 { max-width: 14ch; }
.hero__kicker { margin-bottom: var(--s4); }
.hero__lede { margin-top: var(--s4); font-size: 1.1875rem; line-height: 1.55; color: var(--muted); max-width: 34rem; }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s5); }
.hero__note { margin-top: var(--s3); font-size: 0.875rem; color: var(--muted); }
.hero__note a { color: var(--text); text-decoration: underline; }
@media (max-width: 30em) { .hero__actions .btn { width: 100%; } }

/* Sky scene: a tile image behind a card (tool cards, tool strip, resource tiles) */
.scene { position: relative; isolation: isolate; overflow: hidden; border-radius: 2px; background: #12203a; min-height: 26rem; }
.scene > img.scene__sky { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; }
.scene__sky, .band__sky { image-rendering: pixelated; }


/* Sections */
.section { padding-block: var(--s7); }
@media (min-width: 60em) { .section { padding-block: var(--s8); } }
.section--tight { padding-block: var(--s5) var(--s7); }
.section--paper2 { background: var(--paper-2); }
.section--ink { background: var(--ink); color: var(--on-ink); }
/* On wide screens an ink section is a framed panel inside the page margins */
@media (min-width: 64em) {
  .section--ink { width: calc(100% - 4rem); max-width: 76rem; margin: var(--s5) auto; border-radius: 2px; padding-block: var(--s7); }
  .section--ink > .wrap { padding-inline: 3.5rem; }
}
.section__title { max-width: 22ch; margin-bottom: var(--s5); }
.section__head { max-width: 46rem; margin-bottom: var(--s6); }
.section__head .lead { margin-top: var(--s3); }
.section__head .eyebrow, .split__head .eyebrow { margin-bottom: var(--s3); }
.section__row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--s3); margin-bottom: var(--s5); }
.section__row .section__title { margin-bottom: 0; }
.section__close { margin-top: var(--s6); max-width: 44rem; font-family: var(--display); font-weight: 500; font-size: 1.5rem; line-height: 1.3; letter-spacing: -0.012em; }
.lead { font-size: 1.125rem; line-height: 1.6; color: var(--muted); }
.section--ink .lead { color: var(--on-ink-muted); }
.fine { font-size: 0.875rem; color: var(--muted); }
.section--ink .fine { color: var(--on-ink-muted); }
.section--ink .eyebrow { color: var(--on-ink-muted); }

.split { display: grid; gap: var(--s5); }
@media (min-width: 60em) { .split { grid-template-columns: 0.9fr 1.1fr; gap: var(--s7); align-items: start; } .split__head { position: sticky; top: 7rem; } }
.split__head .lead { margin-top: var(--s3); }
.split__head .btn { margin-top: var(--s4); }

/* Organic lead story (ordered) */
.story { list-style: none; counter-reset: story; display: grid; gap: 0; border-top: 1px solid var(--line); }
.story li { counter-increment: story; display: grid; grid-template-columns: 3rem 1fr; column-gap: var(--s3); padding-block: var(--s4); border-bottom: 1px solid var(--line); }
.story li::before { content: counter(story, decimal-leading-zero); grid-row: span 2; font-family: var(--mono); font-size: 0.75rem; line-height: 2; color: var(--muted); }
.story h3 { margin-bottom: var(--s1); }
.story p { color: var(--muted); }
.story__note { margin-top: var(--s4); font-weight: 500; }

/* Facts: big figures over thin rules */
.facts { display: grid; gap: var(--s5); }
@media (min-width: 48em) { .facts { grid-template-columns: 1fr 1fr; gap: var(--s6); } }
.fact { border-top: 1px solid var(--line-ink); padding-top: var(--s4); }
.fact__num { font-family: var(--display); font-weight: 500; font-size: clamp(3.5rem, 2.5rem + 4vw, 5.75rem); line-height: 1; letter-spacing: -0.03em; color: var(--on-ink); margin-bottom: var(--s3); }
.fact p:not(.fact__num) { font-size: 1.0625rem; max-width: 30rem; }
.fact .fact__src { margin-top: var(--s3); font-size: 0.75rem; color: var(--on-ink-muted); }
.fact__src a { color: var(--on-ink-muted); }

/* Blockers */
.blockers { display: grid; gap: var(--s3); margin: 0; }
@media (min-width: 48em) { .blockers { grid-template-columns: 1fr 1fr; } }
@media (min-width: 72em) { .blockers { grid-template-columns: repeat(3, 1fr); } }
.blocker { padding: var(--s4); background: var(--card); border: 1px solid var(--line); border-radius: 2px; display: flex; flex-direction: column; gap: var(--s2); }
.blocker dt { font-family: var(--display); font-weight: 500; font-size: 1.25rem; line-height: 1.25; letter-spacing: -0.012em; }
.blocker dd { margin: 0; color: var(--muted); font-size: 0.9375rem; }
#blockers .fine { margin-top: var(--s4); }

/* Checklist */
.checklist { list-style: none; display: grid; gap: 0; border-top: 1px solid var(--line); }
.checklist li { position: relative; padding: var(--s3) 0 var(--s3) 2rem; border-bottom: 1px solid var(--line); color: var(--muted); }
.checklist li strong { color: var(--text); font-weight: 500; }
.checklist li::before { content: ""; position: absolute; left: 0.125rem; top: 1.45rem; width: 0.75rem; height: 0.4375rem; border-left: 1.5px solid var(--accent); border-bottom: 1.5px solid var(--accent); transform: rotate(-45deg); }
.checklist--tight li { padding-block: 0.625rem; }
.checklist--tight li::before { top: 1.05rem; }

/* Steps (ordered process): numbered tabs over thin rules */
.steps { list-style: none; display: grid; gap: var(--s3); }
@media (min-width: 48em) { .steps { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64em) { .steps { grid-template-columns: repeat(4, 1fr); } }
.step { padding: var(--s4); background: var(--card); border: 1px solid var(--line); border-radius: 2px; }
.step__n { display: block; color: var(--muted); margin-bottom: var(--s5); text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.6875rem; }
.step h3 { font-size: 1.5rem; margin-bottom: var(--s2); }
.step p { color: var(--muted); font-size: 0.9375rem; }

/* Who / three columns */
.who { display: grid; gap: var(--s3); }
@media (min-width: 56em) { .who { grid-template-columns: repeat(3, 1fr); } }
.who__item { padding: var(--s4); background: var(--card); border: 1px solid var(--line); border-radius: 2px; display: flex; flex-direction: column; gap: var(--s2); }
.who__item p { color: var(--muted); flex: 1; }
.who__item .link { margin-top: var(--s3); padding-top: var(--s3); border-top: 1px solid var(--line); text-decoration: none; display: flex; justify-content: space-between; }

/* Service list */
.service-list { list-style: none; border-top: 1px solid var(--line); }
.service-list a { display: flex; justify-content: space-between; align-items: center; gap: var(--s3); padding: 1.125rem 0; border-bottom: 1px solid var(--line); text-decoration: none; font-family: var(--display); font-weight: 500; font-size: 1.3125rem; letter-spacing: -0.012em; transition: color 150ms ease, padding 150ms ease; }
.service-list a:hover { color: var(--muted); padding-left: 0.375rem; }

/* Page heads */
.page-head { padding-block: var(--s6); }
@media (min-width: 60em) { .page-head { padding-block: var(--s7) var(--s6); } }
.page-head h1 { max-width: 18ch; }
.page-head .lead { margin-top: var(--s4); max-width: 44rem; }
.page-head .btn { margin-top: var(--s5); }
.svc { display: grid; gap: var(--s4); padding-block: var(--s5); border-top: 1px solid var(--line); scroll-margin-top: 6rem; }
@media (min-width: 56em) { .svc { grid-template-columns: 1fr 1fr; gap: var(--s6); } }
.svc__head h3 { font-size: 1.75rem; margin-bottom: var(--s3); letter-spacing: -0.018em; }
.svc__head p { color: var(--muted); }
.svc__list { list-style: none; display: grid; gap: var(--s2); }
.svc__list li { padding-left: 1.25rem; position: relative; }
.svc__list li::before { content: ""; position: absolute; left: 0; top: 0.75em; width: 0.5rem; height: 1px; background: var(--strong); }

/* FAQ */
.faq { border-top: 1px solid var(--line); }
.faq__item { border-bottom: 1px solid var(--line); }
.faq__item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: var(--s3); padding: 1.125rem 0; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary h3 { font-size: 1.125rem; line-height: 1.35; letter-spacing: -0.006em; }
.faq__item summary::after { content: "+"; font-size: 1.375rem; font-weight: 300; color: var(--muted); flex-shrink: 0; }
.faq__item[open] summary::after { content: "\2212"; }
.faq__item p { padding-bottom: 1.25rem; color: var(--muted); max-width: 42rem; }

/* Insight cards (same fields as socient.net/insights): tag, title, excerpt, author, date, read time */
.post-grid { display: grid; gap: var(--s3); }
@media (min-width: 48em) { .post-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64em) { .post-grid { grid-template-columns: repeat(3, 1fr); } }
.post-card { position: relative; display: flex; flex-direction: column; gap: var(--s3); padding: var(--s4); background: var(--card); border: 1px solid var(--line); border-radius: 2px; text-decoration: none; transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease; }
.post-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.post-card[hidden] { display: none; }
.post-tag { align-self: flex-start; display: inline-flex; align-items: center; gap: 0.5rem; font-family: var(--body); font-size: 0.6875rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; color: var(--accent); padding-right: 2rem; }
.post-tag--head { display: inline-flex; margin-bottom: var(--s3); }
.post-card__title { font-size: 1.375rem; line-height: 1.2; letter-spacing: -0.015em; }
.post-card__excerpt { color: var(--muted); font-size: 0.9375rem; flex: 1; }
.post-card__meta { font-size: 0.8125rem; color: var(--muted); padding-top: var(--s3); border-top: 1px solid var(--line); }
.post-card__arrow { position: absolute; right: var(--s4); top: var(--s4); font-size: 1rem; line-height: 1; color: var(--muted); transition: transform 150ms ease, color 150ms ease; }
.post-card:hover .post-card__arrow { transform: translateX(0.1875rem); color: var(--text); }
.insights-tools { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s3); margin-bottom: var(--s5); }
.topic-tabs { display: flex; flex-wrap: wrap; gap: var(--s2); }
.topic-tab { font: 500 0.875rem var(--body); padding: 0.4375rem 0.875rem; min-height: 2.5rem; border: 1px solid var(--line); border-radius: 2px; background: var(--card); color: var(--text); cursor: pointer; transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease; }
.topic-tab:hover { border-color: var(--line-strong); }
.topic-tab[aria-pressed="true"] { background: var(--strong); color: var(--on-strong); border-color: var(--strong); }
.search { width: 100%; }
@media (min-width: 48em) { .search { width: auto; } }
.search input { font: 0.9375rem var(--body); color: var(--text); padding: 0.625rem 0.875rem; min-height: 2.75rem; border: 1px solid var(--line); border-radius: 2px; background: var(--card); width: 100%; }
.search input::placeholder { color: var(--faint); }
@media (min-width: 48em) { .search input { width: 18rem; } }
.empty { padding: var(--s5) 0; color: var(--muted); }

/* Article */
.post__head { padding-block: var(--s6) var(--s5); }
.post__back { display: block; width: fit-content; margin-bottom: var(--s5); font-size: 0.875rem; color: var(--muted); text-decoration: none; }
.post__back:hover { color: var(--text); }
.post__head .post-tag { margin-bottom: var(--s3); }
.post__head h1 { font-size: clamp(2.125rem, 1.5rem + 2.6vw, 3.375rem); }
.post__dek { margin-top: var(--s4); font-size: 1.1875rem; color: var(--muted); }
.post__meta { margin-top: var(--s4); font-size: 0.875rem; color: var(--muted); padding-top: var(--s3); border-top: 1px solid var(--line); }
/* Byline with the Google preferred source button */
.post__byline { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s3); margin-top: var(--s4); padding-top: var(--s3); border-top: 1px solid var(--line); }
.post__byline .post__meta { margin: 0; padding: 0; border: 0; }
.pref-src { display: inline-flex; align-items: center; gap: 0.625rem; flex: none; min-height: 2.75rem; padding: 0.375rem 0.875rem 0.375rem 0.625rem; background: var(--card); color: var(--text); border: 1px solid var(--line-strong); border-radius: 2px; font: 500 0.8125rem/1.2 var(--body); text-decoration: none; transition: border-color 150ms ease, box-shadow 150ms ease; }
.pref-src__g { flex: none; width: 1.5rem; height: 1.5rem; }
.pref-src:hover { border-color: var(--strong); box-shadow: var(--shadow); }
.pref-src:focus-visible { outline: 2px solid var(--strong); outline-offset: 3px; }
.whero__byline { margin-top: var(--s4); border-top-color: var(--line-ink); }
.whero__byline .post__meta { color: var(--on-ink-muted); }
.post__body { padding-bottom: var(--s7); font-size: 1.0625rem; line-height: 1.7; }
.post__body > * + * { margin-top: 1.1em; }
.post__body h2 { font-size: 1.875rem; margin-top: 2.2em; }
.post__body h3 { margin-top: 1.8em; }
.post__body ul, .post__body ol { padding-left: 1.25rem; display: grid; gap: 0.5em; }
.post__body a { text-decoration: underline; }
.post__body .faq { margin-top: var(--s3); }
.post__body .faq ul { padding: 0; }
.tldr { padding: var(--s4); background: var(--ink); color: var(--on-ink); border-radius: 2px; }
.tldr h2 { font-family: var(--body); font-size: 0.6875rem !important; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; margin: 0 0 var(--s2) !important; color: var(--on-ink-muted); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
th, td { text-align: left; padding: 0.75rem 0.75rem 0.75rem 0; border-bottom: 1px solid var(--line); vertical-align: top; }
th { font-weight: 500; font-size: 0.875rem; color: var(--muted); }
.related { background: var(--paper-2); padding-block: var(--s7); }
.related h2 { margin-bottom: var(--s5); }

/* Article grid: header and body in one 44rem column. With a contents list, the list sits in a sticky
   left column on wide screens, and in a collapsed box above the body on phones and tablets. */
.post__grid { max-width: calc(44rem + 2rem); }
@media (min-width: 48em) { .post__grid { max-width: calc(44rem + 4rem); } }
@media (min-width: 64em) {
  .post--toc .post__grid { max-width: 76rem; display: grid; grid-template-columns: 14rem minmax(0, 44rem); column-gap: var(--s7); justify-content: center; align-items: start; }
  .post--toc .post__head, .post--toc .post__body { grid-column: 2; }
  .post--toc .post__toc { grid-column: 1; grid-row: 2; position: sticky; top: 6rem; max-height: calc(100vh - 7rem); overflow-y: auto; padding-top: var(--s2); scrollbar-width: thin; }
}
@media (min-width: 64em) and (min-width: 75.0625em) { .post--toc .post__toc { top: 6.5rem; } }
.post__body h2[id], .post__body [id] { scroll-margin-top: 6rem; }
.toc__box { border: 1px solid var(--line); border-radius: 2px; background: var(--card); margin-bottom: var(--s5); }
.toc__title { list-style: none; display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1rem; font-size: 0.6875rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; color: var(--muted); cursor: pointer; }
.toc__title::-webkit-details-marker { display: none; }
.toc__title::after { content: "+"; font-size: 1.125rem; font-weight: 300; letter-spacing: 0; line-height: 1; }
.toc__box[open] .toc__title::after { content: "\2212"; }
.toc__list { list-style: none; counter-reset: toc; padding: 0 1rem 0.75rem; border-top: 1px solid var(--line); }
.toc__list li { counter-increment: toc; }
.toc__list a { display: grid; grid-template-columns: 1.75rem 1fr; padding: 0.5rem 0; border-bottom: 1px solid var(--line); font-size: 0.875rem; line-height: 1.4; color: var(--muted); text-decoration: none; transition: color 150ms ease; }
.toc__list li:last-child a { border-bottom: 0; }
.toc__list a::before { content: counter(toc, decimal-leading-zero); font-family: var(--mono); font-size: 0.6875rem; padding-top: 0.15rem; color: var(--faint); }
.toc__list a:hover { color: var(--text); }
.toc__list a[aria-current="true"] { color: var(--text); font-weight: 500; }
.toc__list a[aria-current="true"]::before { color: var(--accent); }
@media (min-width: 64em) {
  .post--toc .toc__box { border: 0; background: none; margin: 0; }
  .post--toc .toc__title { padding: 0 0 0.625rem; cursor: default; pointer-events: none; }
  .post--toc .toc__title::after { content: none; }
  .post--toc .toc__list { padding: 0; border-top: 1px solid var(--line); }
  .post--toc .toc__list a { position: relative; padding: 0.5rem 0 0.5rem 0; font-size: 0.8125rem; }
  .post--toc .toc__list a[aria-current="true"]::after { content: ""; position: absolute; left: -0.875rem; top: 0.5rem; bottom: 0.5rem; width: 2px; background: var(--accent); }
}

/* Prose pages */
.prose h2 { font-size: 1.625rem; margin-top: var(--s5); margin-bottom: var(--s2); }
.prose h2:first-child { margin-top: 0; }
.prose p { color: var(--muted); }

/* Contact */
.page-head--form { border-bottom: 0; }
.contact { display: grid; gap: var(--s6); }
@media (min-width: 60em) { .contact { grid-template-columns: 1fr 1fr; gap: var(--s7); align-items: start; } }
.contact__sub { font-size: 1.125rem; margin: var(--s5) 0 var(--s3); }
.contact .fine { margin-top: var(--s4); }
.form { display: grid; gap: var(--s4); padding: var(--s5) var(--s4); background: var(--card); border: 1px solid var(--line); border-radius: 2px; }
@media (min-width: 48em) { .form { padding: var(--s5); } }
.field { display: grid; gap: var(--s2); }
.field label { font-weight: 500; font-size: 0.9375rem; }
.opt { font-weight: 400; color: var(--muted); }
.field input, .field select, .field textarea { font: 1rem var(--body); color: var(--text); width: 100%; min-height: 3rem; padding: 0.75rem 0.875rem; background: var(--paper); border: 1px solid var(--line-strong); border-radius: 2px; }
.field textarea { resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: 2px solid var(--strong); outline-offset: 1px; }
.field [aria-invalid="true"] { border-color: #a1260f; }
.hp { position: absolute; left: -9999px; }
.form__status { font-weight: 500; min-height: 1.5em; }
.form .fine { margin-top: 0; }

/* CTA band: dark, flows into the footer */
.cta-band { position: relative; isolation: isolate; overflow: hidden; background: var(--ink); color: var(--on-ink); padding-block: var(--s7); }
.cta-band__in { display: grid; gap: var(--s5); align-items: end; }
@media (min-width: 60em) { .cta-band { padding-block: var(--s8) var(--s7); } .cta-band__in { grid-template-columns: 1.4fr 1fr; gap: var(--s7); } }
.cta-band h2 { max-width: 16ch; font-size: clamp(2rem, 1.4rem + 2.4vw, 3.25rem); letter-spacing: -0.025em; }
.cta-band p { margin-top: var(--s3); color: var(--on-ink-muted); max-width: 40rem; font-size: 1.0625rem; }
.cta-band__actions { display: flex; flex-wrap: wrap; gap: var(--s2); }
@media (min-width: 60em) { .cta-band__actions { justify-content: flex-end; } }
@media (max-width: 30em) { .cta-band__actions .btn { width: 100%; } }

/* Footer */
.site-foot { background: var(--ink); color: var(--on-ink-muted); border-top: 1px solid var(--line-ink); padding-top: var(--s6); font-size: 0.8125rem; line-height: 1.55; }
.cta-band + .site-foot, main:has(> .cta-band:last-child) + .site-foot { border-top-color: var(--line-ink); }
.site-foot__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5) var(--s4); }
.site-foot__brand { grid-column: 1 / -1; }
@media (min-width: 48em) { .site-foot__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 75.0625em) { .site-foot__grid { grid-template-columns: 1.7fr repeat(5, minmax(0, 1fr)); gap: var(--s5); } .site-foot__brand { grid-column: auto; padding-right: var(--s4); } }
.site-foot h2 { font-family: var(--body); font-weight: 500; font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--on-ink-muted); margin-bottom: var(--s3); padding-bottom: var(--s2); border-bottom: 1px solid var(--line-ink); }
.site-foot ul { list-style: none; display: grid; gap: var(--s2); }
.site-foot__stack { display: grid; gap: var(--s5); align-content: start; }
.site-foot a { text-decoration: none; color: var(--on-ink); }
.site-foot a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.site-foot__brand p { margin-top: var(--s3); max-width: 24rem; }
.site-foot .btn { margin-top: var(--s4); }
.site-foot a.btn--accent, .site-foot a.btn--accent:hover { color: var(--btn-fg); text-decoration: none; }
.site-foot .btn:hover { text-decoration: none; }
.site-foot__base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2); margin-top: var(--s6); padding-block: var(--s4); border-top: 1px solid var(--line-ink); font-size: 0.75rem; }
.site-foot__base a { color: var(--on-ink-muted); }

/* Right side panel for the lead form */
.drawer-open { overflow: hidden; }
.drawer { position: fixed; inset: 0 0 0 auto; margin: 0; padding: 0; border: 0; width: min(30rem, 100vw); max-width: 100vw; height: 100dvh; max-height: 100dvh; background: var(--paper); color: var(--text); transform: translateX(100%); transition: transform 200ms ease; }
.drawer.is-open { transform: translateX(0); }
.drawer::backdrop { background: rgba(25, 40, 46, 0); transition: background-color 200ms ease; }
.drawer.is-open::backdrop { background: rgba(25, 40, 46, 0.55); }
@media (prefers-reduced-motion: reduce) { .drawer, .drawer::backdrop { transition: none; } }
.drawer__panel { height: 100%; overflow-y: auto; overscroll-behavior: contain; padding: 0 1rem var(--s5); }
@media (min-width: 30em) { .drawer__panel { padding: 0 var(--s5) var(--s5); } }
.drawer__head { position: sticky; top: 0; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: var(--s3); padding-block: var(--s4) var(--s3); background: var(--paper); border-bottom: 1px solid var(--line); }
.drawer__head h2 { font-size: 1.375rem; }
.drawer__close { flex-shrink: 0; min-height: 2.5rem; padding: 0.4375rem 0.875rem; border: 1px solid var(--line-strong); border-radius: 2px; background: var(--card); font: 500 0.875rem var(--body); color: var(--text); cursor: pointer; transition: border-color 150ms ease; }
.drawer__close:hover { border-color: var(--strong); }
.drawer__lead { margin-block: var(--s3) var(--s4); color: var(--muted); }
.drawer .form { padding: 0; background: transparent; border: 0; gap: var(--s3); }
.drawer__done-close { margin-top: var(--s4); }
.form-done { padding-top: var(--s4); outline: none; }
.contact__form .form-done { padding: var(--s5); background: var(--card); border: 1px solid var(--line); border-radius: 2px; }
.form-done__title { font-size: 1.75rem; }
.form-done__lead { margin-top: var(--s3); font-size: 1.125rem; }
.form-done h3 { font-size: 1.0625rem; margin-top: var(--s4); }
.form-done__steps { margin-top: var(--s2); padding-left: 1.25rem; display: grid; gap: var(--s2); color: var(--muted); }
.form-done .fine { margin-top: var(--s4); }
.page-head .form-done__steps { margin-bottom: var(--s5); }
.lead-form[hidden], .form-done[hidden], [data-close][hidden] { display: none; }
.form__status:empty { display: none; }
/* ---------- AI Search Visibility Audit ---------- */
.audit-hero { background: var(--ink); color: var(--on-ink); padding-block: var(--s6); }
@media (min-width: 60em) { .audit-hero { padding-block: var(--s7); } }
.audit-hero__in { display: grid; gap: var(--s5); align-items: end; }
@media (min-width: 60em) { .audit-hero__in { grid-template-columns: 1.3fr 1fr; gap: var(--s7); } }
.audit-hero__tag, .audit-cta__tag { color: var(--lime); margin-bottom: var(--s3); }
.audit-promo .audit-cta__tag { display: block; }
.audit-hero h1 { max-width: 14ch; }
.audit-hero__facts { list-style: none; display: grid; gap: 0; border-top: 1px solid var(--line-ink); }
.audit-hero__facts li { padding: var(--s3) 0; border-bottom: 1px solid var(--line-ink); color: var(--on-ink-muted); }
.audit-hero__facts strong { color: var(--on-ink); }

.audit { display: grid; gap: var(--s5); padding-block: var(--s6) var(--s7); }
@media (min-width: 64em) { .audit { grid-template-columns: minmax(0, 1fr) 21rem; gap: var(--s6); align-items: start; } }
.audit__how { padding-bottom: var(--s5); border-bottom: 1px solid var(--line); }
.audit__how h2 { font-size: 1.375rem; margin-bottom: var(--s3); }
.audit__how ol { padding-left: 1.25rem; display: grid; gap: var(--s2); color: var(--muted); }
.link-btn { margin-top: var(--s3); background: none; border: 0; padding: 0; font: 500 0.9375rem var(--body); color: var(--text); text-decoration: underline; cursor: pointer; min-height: 2.75rem; }

.audit-phase { padding-top: var(--s6); scroll-margin-top: 5rem; }
.audit-phase__tag { color: var(--muted); margin-bottom: var(--s2); }
.audit-phase__head h2 { font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem); }
.audit-phase__head > p:not(.audit-phase__tag) { margin-top: var(--s2); color: var(--muted); max-width: 40rem; }
.audit-phase__meta { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s3); margin: var(--s4) 0 var(--s3); }
@media (min-width: 40em) { .audit-phase__meta { grid-template-columns: repeat(4, 1fr); } }
.audit-phase__meta div { border-top: 2px solid var(--strong); padding-top: var(--s2); }
.audit-phase__meta dt { font-size: 0.8125rem; color: var(--muted); }
.audit-phase__meta dd { margin: 0; font-weight: 700; }

.audit-list { list-style: none; border-top: 1px solid var(--line); }
.check { border-bottom: 1px solid var(--line); scroll-margin-top: 5rem; }
.check__main { display: grid; grid-template-columns: 2rem 1fr; gap: var(--s2) var(--s3); padding-top: var(--s4); }
@media (min-width: 40em) { .check__main { grid-template-columns: 2.25rem 1fr auto; align-items: start; } }
.check__n { color: var(--muted); padding-top: 0.25rem; }
.check.is-answered .check__n { color: var(--text); font-weight: 700; }
.check__t { font-size: 1.125rem; line-height: 1.3; }
.check__d { margin-top: var(--s1); color: var(--muted); }
.check__est { margin-top: var(--s2); color: var(--muted); }
.answer-set { grid-column: 2; display: inline-flex; border: 1px solid var(--line-strong); border-radius: var(--radius); padding: 0; margin: var(--s2) 0 0; min-width: 0; width: fit-content; }
.answer-set label { position: relative; }
.answer-set input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.answer-set span { display: inline-flex; align-items: center; justify-content: center; min-width: 4.25rem; min-height: 2.75rem; padding: 0 0.75rem; font-weight: 600; font-size: 0.9375rem; border-right: 1px solid var(--line-strong); transition: background-color 150ms ease, color 150ms ease; }
.answer-set label:last-child span { border-right: 0; }
.answer-set label:first-child span { border-radius: 5px 0 0 5px; }
.answer-set label:last-child span { border-radius: 0 5px 5px 0; }
.answer-set input:checked + span { background: var(--strong); color: var(--on-strong); }
.answer-set input[value="2"]:checked + span { background: var(--lime); color: var(--on-lime); }
.answer-set input:focus-visible + span { outline: 2px solid var(--strong); outline-offset: 2px; }
@media (min-width: 40em) { .answer-set { grid-column: 3; margin-top: 0; } }
.check__help { margin: var(--s3) 0 var(--s4) 2.75rem; }
@media (min-width: 40em) { .check__help { margin-left: 3.25rem; } }
.check__help summary { cursor: pointer; font-weight: 600; font-size: 0.9375rem; width: fit-content; min-height: 2.75rem; display: inline-flex; align-items: center; text-decoration: underline; text-underline-offset: 0.2em; }
.check__help summary::-webkit-details-marker { display: none; }
.check__help summary::after { content: " +"; white-space: pre; }
.check__help[open] summary::after { content: " −"; }
.check__help-body { padding: var(--s4); background: var(--paper-2); border-radius: var(--radius); }
.check__help-body h4 { font-family: var(--display); font-weight: 500; font-size: 0.9375rem; margin: var(--s3) 0 var(--s1); }
.check__help-body h4:first-child { margin-top: 0; }
.check__help-body p, .check__help-body ol { color: var(--muted); font-size: 0.9375rem; }
.check__steps { padding-left: 1.25rem; display: grid; gap: var(--s1); }

.score { position: relative; }
@media (min-width: 64em) { .score { position: sticky; top: 5.5rem; max-height: calc(100vh - 6.5rem); overflow-y: auto; } }
.score__card { background: var(--ink); color: var(--on-ink); border-radius: var(--radius); padding: var(--s4); display: grid; gap: var(--s2); }
.score__label { color: var(--on-ink-muted); }
.score__num { font-family: var(--display); font-weight: 500; font-size: 4rem; line-height: 1; letter-spacing: -0.028em; }
.score__of { font-size: 1.125rem; font-weight: 500; color: var(--on-ink-muted); margin-left: 0.375rem; letter-spacing: 0; }
.score__grade { font-family: var(--display); font-weight: 500; font-size: 1.5rem; color: var(--lime); }
.score__sub { color: var(--on-ink-muted); font-size: 0.9375rem; }
.score__count { color: var(--on-ink-muted); }
.score__phases { list-style: none; display: grid; gap: var(--s2); padding: var(--s3) 0; border-block: 1px solid var(--line-ink); }
.score__phases li { display: grid; grid-template-columns: 4.25rem 1fr 3rem; align-items: center; gap: var(--s2); font-size: 0.875rem; }
.score__phases b { text-align: right; font-weight: 600; }
.bar { height: 0.5rem; background: rgba(244, 240, 232, 0.14); border-radius: 2px; overflow: hidden; }
.bar i { display: block; height: 100%; width: 0; background: var(--lime); transition: width 200ms ease; }
.score__next h2 { font-size: 1.125rem; margin: var(--s2) 0; }
.score__next ol { list-style: none; display: grid; gap: var(--s2); }
.score__next li a { color: var(--on-ink); text-decoration: none; font-weight: 600; font-size: 0.9375rem; line-height: 1.35; display: block; }
.score__next li a:hover { text-decoration: underline; }
.score__next li .mono { color: var(--lime); margin-right: 0.25rem; }
.score__next small { display: block; color: var(--on-ink-muted); font-size: 0.8125rem; }
.score__empty { color: var(--on-ink-muted); font-size: 0.875rem; }
.score__card .btn { margin-top: var(--s2); }
.score-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: flex; justify-content: space-between; align-items: center; gap: var(--s3); padding: 0.625rem 1rem; background: var(--ink); color: var(--on-ink); border-top: 1px solid var(--line-ink); transform: translateY(100%); transition: transform 200ms ease; }
.score-bar b { color: var(--lime); font-family: var(--display); font-size: 1.25rem; }
.score-bar.is-on { transform: translateY(0); }
@media (min-width: 64em) { .score-bar { display: none; } }

.gate { scroll-margin-top: 4.5rem; }
.gate__in { display: grid; gap: var(--s5); }
@media (min-width: 60em) { .gate__in { grid-template-columns: 1fr 1fr; gap: var(--s7); align-items: start; } }
.gate__copy .lead { margin-top: var(--s3); }
.gate__copy .checklist { margin-top: var(--s4); }
.gate__copy .fine { margin-top: var(--s4); }
.gate__copy .fine a { color: var(--on-ink); }
.checklist--dark { border-color: var(--line-ink); }
.checklist--dark li { color: var(--on-ink); border-color: var(--line-ink); }
.checklist--dark li::before { border-color: var(--lime); }
.gate__box { background: var(--paper); color: var(--text); border-radius: var(--radius); padding: var(--s5) var(--s4); }
@media (min-width: 48em) { .gate__box { padding: var(--s5); } }
.gate__box .form { padding: 0; background: transparent; }
.gate__box .form-done { padding-top: 0; }
.gate__actions { display: grid; gap: var(--s2); margin-top: var(--s4); }
.gate__upsell { margin-top: var(--s5); padding-top: var(--s4); border-top: 1px solid var(--line); }
.gate__upsell h4 { font-family: var(--display); font-weight: 500; font-size: 1.125rem; }
.gate__upsell p { margin: var(--s2) 0 var(--s3); color: var(--muted); }
.credit { margin-top: var(--s4); }

/* Promo on the home page */
.promo-phases { list-style: none; display: grid; gap: 0; border-top: 1px solid var(--line-ink); }
.promo-phases li { display: grid; grid-template-columns: 1fr auto; gap: var(--s1) var(--s3); padding: var(--s3) 0; border-bottom: 1px solid var(--line-ink); }
.promo-phases span { grid-column: 1 / -1; color: var(--on-ink-muted); }
.promo-phases b { font-family: var(--display); font-weight: 500; font-size: 1.25rem; }
.promo-phases em { font-style: normal; color: var(--on-ink-muted); align-self: center; }
.audit-promo .lead { color: var(--on-ink-muted); }

/* Audit CTA under insights, credit box, sources */
.audit-cta { margin-top: var(--s6); padding: var(--s5) var(--s4); background: var(--ink); color: var(--on-ink); border-radius: var(--radius); }
@media (min-width: 48em) { .audit-cta { padding: var(--s5); } }
.post__body .audit-cta h2 { margin-top: 0; font-size: 1.75rem; }
.audit-cta p:not(.audit-cta__tag) { color: var(--on-ink-muted); margin: var(--s3) 0 var(--s4); }
.post__body .audit-cta a.btn { text-decoration: none; }
.credit-box { padding: var(--s3) var(--s4); border: 1px solid var(--line); border-radius: var(--radius); font-size: 0.9375rem; color: var(--muted); }
.sources { font-size: 0.9375rem; }
@media (max-width: 63.99em) { .score { order: -1; } .audit { padding-top: var(--s4); } .score__next ol li:nth-child(n+4) { display: none; } }
.site-foot__parent { margin-top: var(--s1); }
/* Footer base: Contact us link with a small mail icon */
.site-foot__links { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; }
.site-foot__base a.site-foot__contact { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 2.75rem; color: var(--on-ink); font-weight: 500; text-decoration: none; }
.site-foot__base a.site-foot__contact:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.site-foot__contact svg { flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.site-foot__parent a { text-decoration: underline; text-underline-offset: 0.18em; }

/* ---------- A/GEO WordPress plugin page ---------- */
.plugin-hero h1 { max-width: 16ch; }
.wp-mock { margin: 0; background: var(--paper); color: var(--text); border-radius: var(--radius); overflow: hidden; }
.wp-mock__bar { display: flex; justify-content: space-between; align-items: center; gap: var(--s2); padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--line); color: var(--muted); }
.wp-mock__body { padding: 1.25rem; display: grid; gap: var(--s3); }
.wp-mock__title { font-family: var(--display); font-weight: 500; font-size: 1.125rem; }
.wp-mock__scope { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line-strong); border-radius: var(--radius); overflow: hidden; }
.wp-mock__scope span { padding: 0.5rem 0.25rem; text-align: center; font-size: 0.875rem; font-weight: 600; border-right: 1px solid var(--line-strong); }
.wp-mock__scope span:last-child { border-right: 0; }
.wp-mock__scope .is-on { background: var(--strong); color: var(--on-strong); }
.wp-mock__code { margin: 0; padding: var(--s3); background: var(--ink); color: var(--on-ink); border-radius: 4px; font: 500 0.75rem/1.55 var(--mono); overflow-x: auto; }
.wp-mock__note { color: var(--muted); }
.wp-mock__btn { justify-self: start; padding: 0.5rem 1rem; background: var(--lime); color: var(--on-lime); border-radius: var(--radius); font-weight: 600; font-size: 0.9375rem; }
.levels td:first-child { white-space: nowrap; }
.levels td, .levels th { padding-right: var(--s3); }
.plugin-now { margin-top: var(--s6); }
.roadmap { display: grid; gap: 0; margin: 0; border-top: 1px solid var(--line); }
@media (min-width: 48em) { .roadmap { grid-template-columns: 1fr 1fr; column-gap: var(--s6); border-top: 0; } .roadmap > div:nth-child(-n+2) { border-top: 1px solid var(--line); } }
.roadmap > div { padding-block: var(--s3); border-bottom: 1px solid var(--line); }
.roadmap dt { font-family: var(--display); font-weight: 500; font-size: 1.125rem; }
.roadmap dd { margin: var(--s1) 0 0; color: var(--muted); }
.plugin-paths { display: grid; gap: var(--s5); }
@media (min-width: 40em) { .plugin-paths { grid-template-columns: 1fr 1fr; } }
.plugin-paths > div { border-top: 1px solid var(--line-ink); padding-top: var(--s3); display: flex; flex-direction: column; gap: var(--s3); align-items: flex-start; }
.plugin-paths p { color: var(--on-ink-muted); flex: 1; }
.plugin-hero__top { display: grid; gap: var(--s5); align-items: end; }
@media (min-width: 60em) { .plugin-hero__top { grid-template-columns: 1.4fr 1fr; gap: var(--s7); } }
.plugin-hero__cta { display: flex; flex-wrap: wrap; gap: var(--s3); align-items: center; }
.plugin-hero__cta .hero__note { flex-basis: 100%; margin-top: 0; }
@media (max-width: 30em) { .plugin-hero__cta .btn { width: 100%; } }
.plugin-shot { margin: var(--s6) 0 0; }
.plugin-shot img { width: 100%; height: auto; border-radius: var(--radius); border: 1px solid var(--line-ink); }
.plugin-shot figcaption { margin-top: var(--s2); color: var(--on-ink-muted); }
.form-done__plugin { margin-top: var(--s4); }
.form-done__plugin h3 { margin-top: var(--s4); }

/* ---------- Done for you ---------- */
.dfy-hero h1 { max-width: 16ch; font-size: clamp(2.25rem, 1.5rem + 3vw, 3.75rem); }
.hero__note a { color: var(--on-ink); }
.price-card { background: var(--paper); color: var(--text); border-radius: var(--radius); padding: var(--s5) var(--s4); display: grid; gap: var(--s3); scroll-margin-top: 6rem; }
@media (min-width: 48em) { .price-card { padding: var(--s5); } }
.price-card__name { font-family: var(--display); font-weight: 500; font-size: 1.25rem; }
.price-card__price { font-family: var(--display); font-weight: 500; font-size: 3.5rem; line-height: 1; letter-spacing: -0.028em; }
.price-card__price span { font-family: var(--body); font-weight: 500; font-size: 1rem; letter-spacing: 0; color: var(--muted); margin-left: var(--s2); }
.checklist--card li { padding-block: 0.75rem; font-size: 0.9375rem; }
.checklist--card li::before { top: 1.2rem; }
@media (min-width: 64em) { .steps--3 { grid-template-columns: repeat(3, 1fr); } }
.code-sample { margin: 0; padding: var(--s4); background: var(--ink); color: var(--on-ink); border-radius: var(--radius); font: 500 0.8125rem/1.6 var(--mono); overflow-x: auto; }
.section--ink .split .lead + .hero__actions { margin-top: var(--s4); }
.svc__more { grid-column: 1 / -1; color: var(--muted); }
.wp-tip { margin: calc(var(--s5) * -1) 0 var(--s6); max-width: 46rem; padding: var(--s3) var(--s4); border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }
.dfy-promo__tag { color: var(--muted); margin-bottom: var(--s3); }

/* ===== LLM Watch (/llm-watch/) =====
   Research dashboard. The .watch tokens map to the site surface tokens at the end of this file.
   JetBrains Mono for labels and figures. */
.page-watch { background: var(--ink); color: var(--on-ink); }
.page-watch main { background: var(--ink); }
.watch { --panel: #1b1a16; --panel-2: #22211c; --bar: #7ea134; --track: rgba(244, 240, 232, 0.07); color: var(--on-ink); }
.watch :focus-visible { outline-color: var(--accent-line); }
.watch a:not(.btn) { color: inherit; }
.watch th { color: var(--on-ink); font-size: inherit; }
.watch .mtable thead th { color: var(--on-ink-muted); font-size: 0.6875rem; }
.watch .lead { color: var(--on-ink-muted); }
.watch .muted { color: var(--on-ink-muted); }
.watch .link { color: var(--accent-fg); }
.weyebrow { color: var(--on-ink-muted); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: var(--s3); }
.dot { display: inline-block; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--lime); vertical-align: 0.05em; margin-right: 0.25rem; }

/* Ticker */
.wticker { border-bottom: 1px solid var(--line-ink); background: #0f0e0b; font-size: 0.75rem; }
.wticker__in { display: flex; align-items: center; gap: var(--s4); min-height: 2.5rem; }
.wticker__flag { flex-shrink: 0; color: var(--on-ink); text-transform: uppercase; letter-spacing: 0.06em; margin: 0; }
.wticker__view { display: flex; overflow: hidden; min-width: 0; flex: 1; -webkit-mask-image: linear-gradient(90deg, transparent, #000 2rem, #000 calc(100% - 2rem), transparent); mask-image: linear-gradient(90deg, transparent, #000 2rem, #000 calc(100% - 2rem), transparent); }
.wticker__list { display: flex; gap: var(--s5); padding-right: var(--s5); list-style: none; white-space: nowrap; flex-shrink: 0; animation: wtick var(--tick-dur, 160s) linear infinite; }
/* The ticker moves at a steady, readable pace: 5 seconds for each release (set in llm-watch.mjs). */
.wticker__view:hover .wticker__list { animation-play-state: paused; }
.wticker__list li { color: var(--on-ink-muted); }
.wticker__list time { color: var(--accent-fg); margin-right: 0.25rem; }
.wticker__list b { color: var(--on-ink); font-weight: 500; }
@keyframes wtick { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
  .wticker__list { animation: none; }
  .wticker__list[aria-hidden="true"] { display: none; }
  .wticker__view { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
}

/* Section nav */
.wnav { position: sticky; top: 4rem; z-index: 40; background: rgba(20, 19, 15, 0.94); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line-ink); }
@media (min-width: 75.0625em) { .wnav { top: 4.5rem; } }
.wnav__list { display: flex; gap: var(--s1); list-style: none; overflow-x: auto; scrollbar-width: none; }
.wnav__list::-webkit-scrollbar { display: none; }
.wnav__list a { display: block; padding: 0.75rem 0.75rem; text-decoration: none; color: var(--on-ink-muted); text-transform: uppercase; letter-spacing: 0.06em; white-space: nowrap; border-bottom: 2px solid transparent; }
.wnav__list li:first-child a { padding-left: 0; }
.wnav__list a:hover { color: var(--on-ink); border-bottom-color: var(--accent-line); }
.watch [id] { scroll-margin-top: 7.5rem; }

/* Hero */
.whero { padding-block: var(--s6); border-bottom: 1px solid var(--line-ink); }
@media (min-width: 60em) { .whero { padding-block: var(--s7); } }
.whero__grid { display: grid; gap: var(--s6); align-items: center; }
@media (min-width: 64em) { .whero__grid { grid-template-columns: 1fr 1.05fr; gap: var(--s7); } }
.whero h1 { font-size: clamp(2.25rem, 1.5rem + 3vw, 3.75rem); max-width: 16ch; }
.whero .lead { margin-top: var(--s4); max-width: 36rem; }

/* Cards (panels) */
.wcard { background: var(--panel); border: 1px solid var(--line-ink); border-radius: var(--radius); padding: var(--s4); margin: 0; min-width: 0; }
.wcard__head { display: flex; justify-content: space-between; align-items: center; gap: var(--s3); padding-bottom: var(--s3); margin-bottom: var(--s3); border-bottom: 1px solid var(--line-ink); }
.wcard__head h2, .wcard__head > span:first-child { font-size: 0.75rem; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--on-ink); font-family: var(--mono); line-height: 1.4; }
.wcard__tag { color: var(--on-ink-muted); font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.06em; white-space: nowrap; }
.wcard__foot { margin-top: var(--s3); color: var(--on-ink-muted); font-size: 0.6875rem; }
.wcard__foot a { text-decoration: underline; }

/* Bar tables: a real table with a bar column */
.bars { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.bars tr { border-bottom: 1px solid var(--line-ink); }
.bars tr:last-child { border-bottom: 0; }
.bars tr:hover { background: rgba(244, 240, 232, 0.03); }
.bars td, .bars th { padding: 0.5rem 0; vertical-align: middle; }
.bars__rank { width: 2.25rem; font-family: var(--mono); font-size: 0.6875rem; color: var(--on-ink-muted); }
.bars__label { text-align: left; font-weight: 600; width: 34%; padding-right: var(--s3) !important; line-height: 1.25; }
.bars__label span { display: block; font-weight: 400; font-size: 0.75rem; color: var(--on-ink-muted); }
.bars__track { width: 46%; }
.bars__track::before { content: ""; display: block; height: 0.5rem; border-radius: 2px; background: var(--track); }
.bars__bar { display: block; height: 0.5rem; margin-top: -0.5rem; width: var(--w); background: var(--bar); border-radius: 0 4px 4px 0; }
.bars__bar.is-lead { background: var(--lead-bar); }
.bars__val { text-align: right; font-family: var(--mono); font-size: 0.8125rem; white-space: nowrap; padding-left: var(--s3) !important; }
.bars__val span { display: block; font-size: 0.6875rem; color: var(--on-ink-muted); }
@media (max-width: 30em) { .bars__label { width: 44%; } .bars__track { width: 32%; } .bars__rank { width: 2.25rem; } }
.bars__rank { padding-right: 0.375rem !important; }

/* Stat strip */
.wstats { border-bottom: 1px solid var(--line-ink); }
.wstats__grid { display: grid; }
@media (min-width: 40em) { .wstats__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64em) { .wstats__grid { grid-template-columns: repeat(4, 1fr); } }
.wstat { padding: var(--s5) 0; border-bottom: 1px solid var(--line-ink); }
.wstat:last-child { border-bottom: 0; }
@media (min-width: 40em) {
  .wstat { padding: var(--s5) var(--s4); border-bottom: 0; }
  .wstat:nth-child(odd) { padding-left: 0; }
  .wstat:nth-child(-n+2) { border-bottom: 1px solid var(--line-ink); }
  .wstat:nth-child(even) { border-left: 1px solid var(--line-ink); }
}
@media (min-width: 64em) {
  .wstat:nth-child(-n+2) { border-bottom: 0; }
  .wstat + .wstat { border-left: 1px solid var(--line-ink); }
  .wstat:nth-child(3) { padding-left: var(--s4); }
}
.wstat__label { color: var(--on-ink-muted); text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.6875rem; }
.wstat__num { font-family: var(--display); font-weight: 500; font-size: clamp(2.5rem, 2rem + 2vw, 3.5rem); line-height: 1; letter-spacing: -0.028em; margin: var(--s3) 0; }
.wstat__num small { font-size: 0.4em; font-weight: 600; letter-spacing: 0; color: var(--on-ink-muted); }
.wstat__txt { font-size: 0.875rem; color: var(--on-ink-muted); max-width: 22rem; }
.wstat__txt a { text-decoration: underline; color: var(--on-ink); }

/* Sections */
.wsec { padding-block: var(--s6); border-bottom: 1px solid var(--line-ink); }
@media (min-width: 60em) { .wsec { padding-block: var(--s7); } }
.wsec__head { max-width: 46rem; margin-bottom: var(--s5); }
.wsec__head .lead { margin-top: var(--s3); }
.wsec__head--row { max-width: none; display: grid; gap: var(--s4); align-items: end; }
.wsec__head--row > div:first-child { max-width: 46rem; }
@media (min-width: 64em) { .wsec__head--row { grid-template-columns: 1fr auto; } }
.wgrid-2 { display: grid; gap: var(--s4); }
@media (min-width: 64em) { .wgrid-2 { grid-template-columns: 1fr 1fr; } .wgrid-2--method { grid-template-columns: 0.8fr 1.2fr; gap: var(--s7); } }

/* Status chips: text carries the meaning; color only marks "Available" */
.chip { display: inline-block; font-family: var(--mono); font-size: 0.6875rem; line-height: 1.4; padding: 0.125rem 0.4375rem; border: 1px solid var(--line-ink); border-radius: 3px; color: var(--on-ink-muted); white-space: nowrap; }
.chip--ok { color: var(--accent-fg); border-color: rgba(196, 255, 77, 0.35); }
.chip--pre { border-style: dashed; }
.chip--lock, .chip--old { color: var(--on-ink-muted); }

/* Release log */
.rels { list-style: none; }
.rel { display: grid; grid-template-columns: 3.75rem 1fr auto; gap: var(--s3); align-items: center; padding: 0.625rem 0; border-bottom: 1px solid var(--line-ink); }
.rel:last-child { border-bottom: 0; }
.rel__date { font-family: var(--mono); font-size: 0.75rem; color: var(--accent-fg); text-transform: uppercase; }
.rel__name { min-width: 0; line-height: 1.3; }
.rel__name a { font-weight: 600; text-decoration: none; }
.rel__name a:hover { text-decoration: underline; }
.rel__name span { display: block; font-size: 0.75rem; color: var(--on-ink-muted); }
.wcallout { margin-top: var(--s4); padding: var(--s4); border-left: 2px solid var(--accent-line); background: var(--panel-2); font-size: 0.9375rem; color: var(--on-ink-muted); }
.wcallout b { color: var(--on-ink); }
.wcallout .link { display: inline-block; margin-top: var(--s3); }

/* Players */
.players { display: grid; gap: 1px; background: var(--line-ink); border: 1px solid var(--line-ink); border-radius: var(--radius); overflow: hidden; }
@media (min-width: 40em) { .players { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64em) { .players { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 80em) { .players { grid-template-columns: repeat(4, 1fr); } }
.player { background: var(--panel); padding: var(--s4); display: flex; flex-direction: column; gap: var(--s3); }
.player__head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s2); }
.player__head h3 { font-size: 1.125rem; }
.player__facts { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s2) var(--s3); margin: 0; }
.player__facts dt { font-family: var(--mono); font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--on-ink-muted); }
.player__facts dd { margin: 0; font-size: 0.875rem; font-weight: 500; }
.player__facts b { font-family: var(--mono); color: var(--accent-fg); font-weight: 500; }
.player__bots { font-size: 0.8125rem; color: var(--on-ink); font-family: var(--mono); line-height: 1.5; }
.player__bots span { display: block; font-family: var(--body); color: var(--on-ink-muted); font-size: 0.75rem; }
.player__link { margin-top: auto; font-size: 0.875rem; font-weight: 600; color: var(--accent-fg) !important; text-decoration: none; }
.player__link:hover { text-decoration: underline; }

/* Tabs */
.wtabs__list { position: relative; display: flex; gap: 0; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--line-ink); margin-bottom: var(--s4); }
.wtabs__list::-webkit-scrollbar { display: none; }
.wtab { flex-shrink: 0; font: 500 0.8125rem var(--mono); letter-spacing: 0.02em; color: var(--on-ink-muted); background: none; border: 0; border-bottom: 2px solid transparent; padding: 0.75rem 1rem; min-height: 2.75rem; cursor: pointer; white-space: nowrap; }
.wtab:hover { color: var(--on-ink); }
.wtab[aria-selected="true"] { color: var(--on-ink); border-bottom-color: var(--accent-line); }
.wtab:focus-visible { outline-offset: -2px; }
.wpanel { background: var(--panel); border: 1px solid var(--line-ink); border-radius: var(--radius); padding: var(--s4); }
@media (min-width: 48em) { .wpanel { padding: var(--s5); } }
.wtabs:not(.is-tabbed) .wpanel + .wpanel { margin-top: var(--s4); }
.wpanel__head { display: grid; gap: var(--s2); margin-bottom: var(--s4); max-width: 48rem; }
.wpanel__head h3 { font-size: 1.375rem; }
.wpanel__head p { color: var(--on-ink-muted); }
.wpanel__meta { list-style: none; display: flex; flex-wrap: wrap; gap: var(--s2) var(--s4); font-size: 0.75rem; }
.wpanel__meta span { color: var(--on-ink-muted); text-transform: uppercase; letter-spacing: 0.06em; margin-right: 0.25rem; }
.wpanel__src { margin-top: var(--s4); font-size: 0.75rem; color: var(--on-ink-muted); }
.wpanel__src a { text-decoration: underline; color: var(--on-ink); }
.wnote { margin-top: var(--s4); font-size: 0.9375rem; color: var(--on-ink-muted); padding-top: var(--s3); border-top: 1px solid var(--line-ink); }
.wnote b { color: var(--on-ink); }

/* Model table: rows become cards on phones */
.mtable { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.mtable thead th { font-family: var(--mono); font-size: 0.6875rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.06em; color: var(--on-ink-muted); text-align: left; padding: 0 var(--s3) var(--s2) 0; border-bottom: 1px solid var(--line-ink); }
.mtable td, .mtable tbody th { padding: 0.75rem var(--s3) 0.75rem 0; border-bottom: 1px solid var(--line-ink); text-align: left; vertical-align: top; }
.mtable tbody tr:last-child > * { border-bottom: 0; }
.mtable tbody th b { display: block; font-size: 1rem; }
.mtable tbody th span { display: block; font-weight: 400; color: var(--on-ink-muted); font-size: 0.8125rem; }
.mtable td { font-family: var(--mono); font-size: 0.8125rem; }
@media (max-width: 47.99em) {
  .mtable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .mtable, .mtable tbody, .mtable tr, .mtable td, .mtable tbody th { display: block; }
  .mtable tr { padding: var(--s3) 0; border-bottom: 1px solid var(--line-ink); }
  .mtable tbody tr:last-child { border-bottom: 0; }
  .mtable td, .mtable tbody th { border: 0; padding: 0.1875rem 0; }
  .mtable tbody th { padding-bottom: var(--s2); }
  .mtable td { display: grid; grid-template-columns: 7.5rem 1fr; gap: var(--s2); }
  .mtable td::before { content: attr(data-label); font-family: var(--body); color: var(--on-ink-muted); font-size: 0.8125rem; }
}

/* Icon link to a model's own website (opens in a new tab) */
.ext-link { display: inline-grid; place-items: center; width: 1.25rem; height: 1.25rem; margin-left: 0.25rem; vertical-align: -0.15em; color: var(--on-ink-muted); border: 1px solid transparent; border-radius: 2px; text-decoration: none; transition: color 150ms ease, border-color 150ms ease; }
.ext-link:hover { color: var(--accent-fg); border-color: var(--line-ink); }
.ext-link:focus-visible { outline: 2px solid var(--strong); outline-offset: 1px; }
.mtable tbody th b .ext-link { margin-left: 0.375rem; }
.rel__name .ext-link { width: 1.125rem; height: 1.125rem; margin-left: 0.125rem; }
.player__links { margin-top: auto; display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2); }
.player__links .player__link { margin-top: 0; }
.player__site { display: inline-flex; align-items: center; gap: 0.3125rem; font-size: 0.875rem; color: var(--on-ink-muted) !important; text-decoration: none; }
.player__site:hover { color: var(--on-ink) !important; text-decoration: underline; }
.player__site svg { flex: none; }

/* Scale table (BEAM agent memory): one column per conversation size, a bar under each score */
.scales { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.scales thead th { font-family: var(--mono); font-size: 0.6875rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.06em; color: var(--on-ink-muted); text-align: left; padding: 0 var(--s3) var(--s2) 0; border-bottom: 1px solid var(--line-ink); }
.scales td, .scales tbody th { padding: 0.75rem var(--s3) 0.75rem 0; border-bottom: 1px solid var(--line-ink); text-align: left; vertical-align: middle; }
.scales tbody tr:last-child > * { border-bottom: 0; }
.scales tbody th b { display: block; font-size: 0.9375rem; font-weight: 500; }
.scales tbody th a { text-decoration: none; }
.scales tbody th a:hover { text-decoration: underline; }
.scales tbody th span { display: block; font-weight: 400; color: var(--on-ink-muted); font-size: 0.75rem; }
.scales__cell { width: 12%; min-width: 4.5rem; }
.scales__val { display: block; font-family: var(--mono); font-size: 0.8125rem; }
.scales__bar { display: block; height: 0.3125rem; margin-top: 0.3125rem; width: 100%; background: linear-gradient(90deg, var(--bar) var(--w), var(--track) var(--w)); border-radius: 1px; }
.scales__cell.is-lead .scales__bar { background: linear-gradient(90deg, var(--lead-bar) var(--w), var(--track) var(--w)); }
.scales__cell.is-lead .scales__val { color: var(--accent-fg); font-weight: 500; }
.scales__cell.is-empty .scales__val { color: var(--on-ink-muted); }
.scales__run { font-size: 0.75rem; color: var(--on-ink-muted); max-width: 16rem; }
.scales tr.is-ref th b, .scales tr.is-ref .scales__val { color: var(--on-ink-muted); }
.scales--compact td, .scales--compact tbody th { padding: 0.4375rem var(--s3) 0.4375rem 0; }
.scales--compact tbody th b { font-size: 0.875rem; }
@media (max-width: 47.99em) {
  .scales thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .scales, .scales tbody, .scales tr, .scales td, .scales tbody th { display: block; }
  .scales tr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.5rem var(--s3); padding: var(--s3) 0; border-bottom: 1px solid var(--line-ink); }
  .scales tbody tr:last-child { border-bottom: 0; }
  .scales td, .scales tbody th { border: 0; padding: 0; }
  .scales tbody th, .scales__run { grid-column: 1 / -1; }
  .scales__cell { width: auto; min-width: 0; }
  .scales__cell::before { content: attr(data-label); display: block; font-family: var(--mono); font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--on-ink-muted); margin-bottom: 0.125rem; }
  .scales__run { max-width: none; }
}

/* Findings */
.wfind { margin-top: var(--s5); display: grid; gap: var(--s4); padding: var(--s5); border: 1px solid var(--line-ink); border-radius: var(--radius); }
@media (min-width: 64em) { .wfind { grid-template-columns: 0.6fr 1.4fr; gap: var(--s6); } }
.wfind h3 { font-size: 1.5rem; }
.wfind ul { list-style: none; display: grid; gap: var(--s3); }
@media (min-width: 48em) { .wfind ul { grid-template-columns: 1fr 1fr; gap: var(--s4); } }
.wfind li { padding-left: var(--s4); position: relative; color: var(--on-ink-muted); font-size: 0.9375rem; }
.wfind li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 0.5rem; height: 2px; background: var(--accent-line); }

/* Research */
.watch .topic-tab { color: var(--on-ink-muted); border-color: var(--line-ink); }
.watch .topic-tab[aria-pressed="true"] { background: var(--on-ink); color: var(--ink); border-color: var(--on-ink); }
.studies { display: grid; gap: 1px; background: var(--line-ink); border: 1px solid var(--line-ink); border-radius: var(--radius); overflow: hidden; }
@media (min-width: 48em) { .studies { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 72em) { .studies { grid-template-columns: repeat(3, 1fr); } }
.study { background: var(--panel); padding: var(--s4); display: flex; flex-direction: column; gap: var(--s2); }
.study[hidden] { display: none; }
.study__tags { display: flex; justify-content: space-between; gap: var(--s2); color: var(--on-ink-muted); text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.6875rem; }
.study__tags span { color: var(--accent-fg); }
.study__stat { font-family: var(--display); font-weight: 500; font-size: 1.75rem; letter-spacing: -0.012em; line-height: 1.1; margin-top: var(--s2); }
.study__title { font-size: 1.0625rem; line-height: 1.3; }
.study__title a { text-decoration: none; }
.study__title a:hover { text-decoration: underline; }
.study__by { font-size: 0.75rem; color: var(--on-ink-muted); }
.study__sum { font-size: 0.875rem; color: var(--on-ink-muted); }
.study__why { margin-top: auto; padding-top: var(--s3); border-top: 1px solid var(--line-ink); font-size: 0.875rem; }
.study__why span { display: block; font-family: var(--mono); font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--accent-fg); margin-bottom: 0.125rem; }
.wmore { margin-top: var(--s4); color: var(--on-ink-muted); }

/* Method */
.wmethod { list-style: none; border-top: 1px solid var(--line-ink); }
.wmethod li { display: grid; grid-template-columns: 2.5rem 1fr; gap: var(--s3); padding: var(--s3) 0; border-bottom: 1px solid var(--line-ink); color: var(--on-ink-muted); }
.wmethod li span { color: var(--accent-fg); padding-top: 0.2rem; }
.wmethod b { color: var(--on-ink); }

/* FAQ on dark */
.wsec--faq .faq { border-top-color: var(--line-ink); }
.wsec--faq .faq__item { border-bottom-color: var(--line-ink); }
.wsec--faq .faq__item summary::after, .wsec--faq .faq__item p { color: var(--on-ink-muted); }
.page-watch .cta-band { border-top: 0; }
.wtabs__list[hidden], .wfilter[hidden] { display: none; }

.player--cta { background: var(--panel-2); justify-content: space-between; }
.player--cta h3 { font-size: 1.125rem; }
.player--cta p { color: var(--on-ink-muted); font-size: 0.9375rem; }
.mtable td .chip { justify-self: start; }
.watch a.link { color: var(--accent-fg); }
.wgrid-2--method .lead { margin-top: var(--s3); }


/* Section nav: Dashboard View sits at the far right */
.wnav__dash { margin-left: auto; padding-left: var(--s3); border-left: 1px solid var(--line-ink); }
.wnav__dash a, .wnav__list .wnav__dash a { color: var(--on-ink); padding-left: 0.75rem; }
.wnav__dash a[aria-current="page"] { border-bottom-color: var(--accent-line); }
.wtab-group { flex-shrink: 0; align-self: center; padding: 0 0.5rem 0 1.25rem; font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--on-ink-muted); }
.wtab-group:first-child { padding-left: 0; }

/* ===== LLM Watch: Dashboard View ===== */
.wrap--wide { max-width: 100rem; }
.dhead { border-bottom: 1px solid var(--line-ink); padding-block: var(--s4); }
.dhead__in { display: flex; flex-wrap: wrap; gap: var(--s4) var(--s5); align-items: flex-end; justify-content: space-between; }
.dhead h1 { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem); }
.dhead .weyebrow { margin-bottom: var(--s2); }
.dstats { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(7.5rem, 1fr)); gap: 1px; background: var(--line-ink); border: 1px solid var(--line-ink); border-radius: var(--radius); }
@media (min-width: 40em) { .dstats { grid-template-columns: repeat(4, minmax(7.5rem, 1fr)); } }
.dstats li { position: relative; background: var(--panel); padding: 0.5rem 0.875rem; min-width: 7.5rem; }
/* Stat help: a small "?" button with a tooltip (hover, focus or tap; Esc closes) */
.dstats .dstats__label { display: flex; align-items: center; gap: 0.375rem; }
.tip { display: inline-grid; place-items: center; flex: none; width: 1rem; height: 1rem; padding: 0; border: 1px solid var(--line-strong); border-radius: 50%; background: transparent; color: var(--on-ink-muted); font: 600 0.625rem/1 var(--body); letter-spacing: 0; text-transform: none; cursor: help; transition: color 150ms ease, border-color 150ms ease; }
.tip::before { content: ""; position: absolute; inset: -0.875rem; }
.tip { position: relative; }
.tip:hover, .tip[aria-expanded="true"] { color: var(--on-ink); border-color: var(--on-ink); }
.tip:focus-visible { outline: 2px solid var(--strong); outline-offset: 2px; }
.dstats .tip__box { position: absolute; z-index: 30; top: calc(100% + 0.375rem); left: -1px; width: min(17rem, calc(100vw - 2rem)); padding: 0.75rem 0.875rem; background: var(--card); color: var(--text); border: 1px solid var(--line-strong); border-radius: 2px; box-shadow: var(--shadow); font-family: var(--body); font-size: 0.8125rem; line-height: 1.5; letter-spacing: 0; text-transform: none; opacity: 0; visibility: hidden; transform: translateY(-2px); transition: opacity 120ms ease, transform 120ms ease, visibility 0s linear 120ms; pointer-events: none; }
.dstats li:has(.tip:hover) .tip__box, .dstats li:has(.tip:focus-visible) .tip__box, .dstats li.is-tip-open .tip__box, .dstats .tip__box:hover { opacity: 1; visibility: visible; transform: none; transition: opacity 120ms ease, transform 120ms ease; pointer-events: auto; }
.dstats li.is-tip-closed .tip__box { opacity: 0 !important; visibility: hidden !important; }
.dstats li:nth-child(even) .tip__box { left: auto; right: -1px; }
@media (min-width: 40em) {
  .dstats li:nth-child(n) .tip__box { left: -1px; right: auto; }
  .dstats li:nth-child(n+3) .tip__box { left: auto; right: -1px; }
}
@media (prefers-reduced-motion: reduce) { .dstats .tip__box { transition: none; } }
.dstats span { display: block; font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--on-ink-muted); }
.dstats b { font-family: var(--display); font-weight: 500; font-size: 1.5rem; line-height: 1.1; }
.dhead__actions { display: flex; flex-wrap: wrap; gap: var(--s2); }
.dgrid { display: grid; gap: 0.75rem; padding-block: 0.75rem var(--s5); grid-template-columns: minmax(0, 1fr); grid-auto-flow: row dense; }
/* Bento: from 2 columns up, every row has the same height and every card fills its cell.
   Cards are 1x1, wide (2 columns) or tall (2 rows). Long content scrolls inside the card. */
@media (min-width: 48em) {
  .dgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 28rem; }
  .dpanel--wide { grid-column: span 2; }
  .dpanel--tall { grid-row: span 2; }
  .dpanel { height: 100%; min-height: 0; }
  .dpanel__body { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
}
@media (min-width: 80em) { .dgrid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.dpanel { background: var(--panel); border: 1px solid var(--line-ink); border-radius: var(--radius); display: flex; flex-direction: column; min-width: 0; position: relative; }
/* Drag handle and drag states */
.dpanel__head { cursor: default; }
.dpanel__grip { flex: none; display: inline-grid; place-items: center; width: 1.75rem; height: 1.75rem; margin: -0.25rem -0.375rem -0.25rem 0.125rem; padding: 0; background: none; border: 1px solid transparent; border-radius: 2px; color: var(--on-ink-muted); cursor: grab; touch-action: none; }
.dpanel__grip svg { fill: currentColor; }
.dpanel__grip:hover { color: var(--on-ink); border-color: var(--line-ink); }
.dpanel__grip:focus-visible { outline: 2px solid var(--strong); outline-offset: 1px; }
.dpanel__head > span.mono { margin-left: auto; }
.dpanel.is-dragging { opacity: 0.35; outline: 1px dashed var(--line-strong); outline-offset: -1px; }
.dpanel.is-grabbed { box-shadow: 0 0 0 2px var(--strong); }
.dpanel-ghost { position: fixed; z-index: 90; pointer-events: none; margin: 0; box-shadow: var(--shadow); opacity: 0.95; overflow: hidden; }
.dgrid.is-sorting, .dgrid.is-sorting * { cursor: grabbing !important; user-select: none; }
.dhead__reset[hidden] { display: none; }
.dpanel__head { display: flex; justify-content: flex-start; align-items: center; gap: var(--s2); padding: 0.625rem 0.875rem; border-bottom: 1px solid var(--line-ink); }
.dpanel__head h2 { font-size: 0.6875rem; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.3; }
.dpanel__head span { font-size: 0.625rem; color: var(--on-ink-muted); text-transform: uppercase; letter-spacing: 0.06em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dpanel__body { padding: 0.25rem 0.875rem; flex: 1; min-width: 0; overflow-x: auto; }
.dpanel__foot { padding: 0.5rem 0.875rem; border-top: 1px solid var(--line-ink); font-size: 0.6875rem; color: var(--on-ink-muted); }
.dpanel__foot a { color: var(--accent-fg); text-decoration: none; }
.dpanel__foot a:hover { text-decoration: underline; }
.dpanel .bars { font-size: 0.8125rem; }
.dpanel .bars td, .dpanel .bars th { padding: 0.3125rem 0; }
.dpanel .bars__label span { font-size: 0.6875rem; }
.dpanel .bars__label { width: 50%; }
.dpanel .bars__track { width: 28%; }
.dpanel .bars__rank { width: 1.875rem; }
.mtable--compact time { white-space: nowrap; }
.dpanel .bars__val span { display: none; }
.rels--dense .rel { padding: 0.375rem 0; grid-template-columns: 3.25rem 1fr auto; gap: 0.5rem; font-size: 0.875rem; }
.rels--dense .rel__name span { font-size: 0.6875rem; }
.mtable--compact { font-size: 0.8125rem; }
.mtable--compact td, .mtable--compact tbody th { padding: 0.4375rem var(--s3) 0.4375rem 0; }
.mtable--compact tbody th b { font-size: 0.875rem; }
.dfeed { list-style: none; }
.dfeed li { display: grid; grid-template-columns: 7.5rem 1fr auto; gap: var(--s3); align-items: baseline; padding: 0.4375rem 0; border-bottom: 1px solid var(--line-ink); font-size: 0.875rem; }
.dfeed li:last-child { border-bottom: 0; }
.dfeed li > span { color: var(--accent-fg); font-size: 0.75rem; }
.dfeed a { text-decoration: none; font-weight: 500; line-height: 1.35; }
.dfeed a:hover { text-decoration: underline; }
.dfeed time { font-size: 0.6875rem; color: var(--on-ink-muted); white-space: nowrap; }
@media (max-width: 40em) { .dfeed li { grid-template-columns: 1fr; gap: 0.125rem; } }
.dnote { padding-bottom: var(--s5); font-size: 0.8125rem; color: var(--on-ink-muted); }

/* ===== Pricing (/pricing/) ===== */
.price-hero h1 { max-width: 18ch; font-size: clamp(2.125rem, 1.4rem + 2.8vw, 3.5rem); }
.price-card__limit { display: flex; align-items: baseline; gap: 0.5rem; font-size: 1rem; }
.price-card__limit .mono { color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.75rem; }
.price-card__limit del { position: relative; font-family: var(--display); font-weight: 500; font-size: 1.5rem; color: var(--muted); text-decoration: none; padding: 0 0.125rem; }
.price-card__limit del::after { content: ""; position: absolute; left: -0.1875rem; right: -0.1875rem; top: 52%; height: 2px; background: var(--strong); transform: rotate(-12deg); }
.price-card__limit ins { font-family: var(--display); font-weight: 500; font-size: 1.5rem; text-decoration: none; background: var(--lime); color: var(--on-lime); padding: 0 0.375rem; border-radius: 3px; }
.checklist--ink { border-top-color: var(--line-ink); }
.checklist--ink li { border-bottom-color: var(--line-ink); color: var(--on-ink-muted); }
.checklist--ink li strong { color: var(--on-ink); }
.checklist--ink li::before { border-color: var(--lime); }

/* Tools row: inline brand marks in currentColor, so they follow the theme. */
.tools-row { border-bottom: 1px solid var(--line); padding-block: var(--s5); }
.tools-row__in { display: grid; gap: var(--s3); align-items: center; }
@media (min-width: 60em) { .tools-row__in { grid-template-columns: auto 1fr; gap: var(--s5); } }
.tools-row__label { font-size: 0.75rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); }
.tools-row__list { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s5); }
.tools-row__list li { display: inline-flex; align-items: center; gap: 0.5rem; font-family: var(--display); font-weight: 500; font-size: 1.125rem; letter-spacing: -0.006em; color: var(--muted); white-space: nowrap; }
.tools-row__icon { width: 1.5rem; height: 1.5rem; flex-shrink: 0; }

/* Scope of work */
.scope { list-style: none; counter-reset: scope; display: grid; gap: 0; border-top: 1px solid var(--line); }
@media (min-width: 56em) { .scope { grid-template-columns: 1fr 1fr; column-gap: var(--s6); } }
.scope__item { counter-increment: scope; display: grid; align-content: start; grid-template-columns: 2.5rem 1fr; column-gap: var(--s3); padding: var(--s4) 0; border-bottom: 1px solid var(--line); }
.scope__item::before { content: counter(scope, decimal-leading-zero); grid-row: span 2; font-family: var(--mono); font-size: 0.8125rem; color: var(--muted); padding-top: 0.25rem; }
.scope__item h3 { font-size: 1.125rem; }
.scope__item p { margin-top: var(--s2); color: var(--muted); }

/* Plans */
.plans { display: grid; gap: var(--s4); }
@media (min-width: 56em) { .plans { grid-template-columns: repeat(3, 1fr); } }
.plan { display: flex; flex-direction: column; gap: var(--s3); align-items: flex-start; padding: var(--s4); background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); }
.plan p:not(.plan__name):not(.plan__price) { color: var(--muted); flex: 1; }
.plan__name { font-family: var(--display); font-weight: 500; font-size: 1.125rem; line-height: 1.25; }
.plan__price { font-family: var(--display); font-weight: 500; font-size: 2.25rem; line-height: 1; letter-spacing: -0.012em; }
.plan__price span { font-family: var(--body); font-weight: 500; font-size: 0.9375rem; letter-spacing: 0; color: var(--muted); margin-left: var(--s2); }
.plan--featured { border: 2px solid var(--strong); }

/* Pricing: full-time hire vs fractional */
.compare-sec { border-bottom: 1px solid var(--line); }
.compare { display: grid; gap: var(--s5); align-items: center; }
@media (min-width: 60em) { .compare { grid-template-columns: 1fr 1.1fr; gap: var(--s6); } }
.compare__copy h2 { max-width: 20ch; }
.compare__copy .lead { margin-top: var(--s3); }
.compare__cols { display: grid; gap: var(--s3); }
@media (min-width: 40em) { .compare__cols { grid-template-columns: 1fr 1fr; } }
.compare__col { padding: var(--s4); border: 1px solid var(--line); border-radius: var(--radius); display: grid; gap: var(--s3); align-content: start; }
.compare__col--us { border: 2px solid var(--strong); }
.compare__label { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); }
.compare__price { font-family: var(--display); font-weight: 500; font-size: 2.5rem; line-height: 1; letter-spacing: -0.012em; }
.compare__price span { display: block; margin-top: var(--s2); font-family: var(--body); font-weight: 500; font-size: 0.875rem; letter-spacing: 0; color: var(--muted); }
.compare__col:not(.compare__col--us) .compare__price { color: var(--muted); }
.compare__col ul { list-style: none; border-top: 1px solid var(--line); }
.compare__col li { padding: 0.5rem 0; border-bottom: 1px solid var(--line); font-size: 0.9375rem; color: var(--muted); }
.compare__col--us li { color: var(--text); }
.svc__head p + p { margin-top: var(--s3); }

/* ===== AI Visibility Score (/ai-visibility-score/) ===== */
.score-hero { padding-block: var(--s6) var(--s7); }
.score-hero h1 { max-width: 16ch; }
.score-hero .hero__lede { max-width: 40rem; }
.scan-form { display: flex; gap: var(--s2); margin-top: var(--s5); max-width: 40rem; }
.scan-form input { flex: 1; min-width: 0; min-height: 3.25rem; padding: 0.75rem 1rem; font: 500 1.125rem var(--body); color: var(--ink); background: var(--on-ink); border: 2px solid transparent; border-radius: var(--radius); }
.scan-form input:focus { outline: none; border-color: var(--lime); }
.scan-form .btn { min-height: 3.25rem; flex-shrink: 0; }
@media (max-width: 30em) { .scan-form { flex-direction: column; } .scan-form .btn { width: 100%; } }
.score-hero .hero__note { color: var(--on-ink-muted); }

.score-run { padding-top: var(--s6); scroll-margin-top: 4.5rem; }
.score-run[hidden] { display: none; }
.score-loading p { color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; }
.score-steps { list-style: none; margin-top: var(--s3); border-top: 1px solid var(--line); max-width: 32rem; }
.score-steps li { padding: 0.625rem 0 0.625rem 1.75rem; border-bottom: 1px solid var(--line); color: var(--muted); position: relative; }
.score-steps li::before { content: ""; position: absolute; left: 0; top: 50%; width: 0.75rem; height: 0.75rem; margin-top: -0.375rem; border-radius: 50%; border: 2px solid var(--line-strong); }
.score-steps li.is-on { color: var(--text); }
.score-steps li.is-on::before { border-color: var(--strong); border-right-color: transparent; animation: sspin 0.8s linear infinite; }
.score-steps li.is-done { color: var(--text); }
.score-steps li.is-done::before { background: var(--strong); border-color: var(--strong); }
@keyframes sspin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .score-steps li.is-on::before { animation: none; border-right-color: var(--strong); } }
.score-error { padding: var(--s4); border: 1px solid var(--line-strong); border-radius: var(--radius); max-width: 40rem; }

.score-top { display: grid; gap: var(--s5); align-items: start; }
@media (min-width: 60em) { .score-top { grid-template-columns: 0.8fr 1.2fr; gap: var(--s6); } }
.score-big__host { color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; word-break: break-all; }
.score-big__num { font-family: var(--display); font-weight: 500; font-size: clamp(5rem, 3rem + 8vw, 8rem); line-height: 0.9; letter-spacing: -0.025em; margin-top: var(--s3); }
.score-big__num small { font-size: 0.3em; letter-spacing: 0; color: var(--muted); margin-left: 0.25rem; }
.score-big__band { display: inline-block; margin-top: var(--s3); font-family: var(--display); font-weight: 500; font-size: 1.5rem; padding: 0.125rem 0.625rem; border-radius: 4px; background: var(--strong); color: var(--on-strong); }
.score-result[data-band="cited-by-default"] .score-big__band { background: var(--lime); color: var(--on-lime); }
.score-big__text { margin-top: var(--s3); color: var(--muted); max-width: 26rem; }
.score-big__actions { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s4); }
.score-factors__h { font-size: 0.75rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); padding-bottom: var(--s2); border-bottom: 1px solid var(--line); }
.sbars { width: 100%; border-collapse: collapse; }
.sbars th, .sbars td { padding: 0.75rem 0; border-bottom: 1px solid var(--line); vertical-align: middle; }
.sbars th { text-align: left; font-weight: 600; font-size: 0.9375rem; color: var(--text); width: 42%; padding-right: var(--s3); }
.sbars__track { width: 44%; }
.sbars__track::before { content: ""; display: block; height: 0.625rem; border-radius: 2px; background: var(--line); }
.sbars__bar { display: block; height: 0.625rem; margin-top: -0.625rem; width: var(--w); background: var(--strong); border-radius: 0 4px 4px 0; }
.sbars__val { text-align: right; font-family: var(--mono); font-size: 0.9375rem; white-space: nowrap; padding-left: var(--s3) !important; }
.sbars__val span { color: var(--muted); }

.score-fixes { margin-top: var(--s6); }
.score-fixes .lead { margin-top: var(--s2); }
.sfixes { list-style: none; display: grid; gap: var(--s3); margin-top: var(--s4); }
@media (min-width: 56em) { .sfixes { grid-template-columns: repeat(3, 1fr); } }
.sfix { padding: var(--s4); border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); display: grid; gap: var(--s2); align-content: start; }
.sfix__gain { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
.sfix h3 { font-size: 1.125rem; }
.sfix p:last-child { color: var(--muted); font-size: 0.9375rem; }

.score-gate { margin-top: var(--s6); display: grid; gap: var(--s4); border: 1px solid var(--line); }
@media (min-width: 56em) { .score-gate { grid-template-columns: 1fr 1fr; gap: var(--s6); align-items: start; } }
.score-gate[hidden] { display: none; }
.score-gate__copy p { margin-top: var(--s2); color: var(--muted); }

.score-full { margin-top: var(--s6); }
.score-full:focus { outline: none; }
.score-full__head { display: flex; justify-content: space-between; align-items: center; gap: var(--s3); flex-wrap: wrap; margin-bottom: var(--s4); }
.sgroup { margin-top: var(--s4); }
.sgroup h3 { display: flex; justify-content: space-between; gap: var(--s3); font-size: 1.125rem; padding-bottom: var(--s2); border-bottom: 2px solid var(--strong); }
.sgroup h3 span { font-size: 0.875rem; color: var(--muted); }
.schecks { list-style: none; }
.scheck { display: grid; grid-template-columns: 5.5rem 1fr; gap: var(--s3); padding: 0.75rem 0; border-bottom: 1px solid var(--line); }
.scheck__st { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; padding-top: 0.2rem; }
.scheck--pass .scheck__st { color: var(--muted); }
.scheck--part .scheck__st, .scheck--fail .scheck__st { color: var(--text); font-weight: 600; }
.scheck--fail .scheck__st::before { content: "×  "; }
.scheck--part .scheck__st::before { content: "◐  "; }
.scheck--pass .scheck__st::before { content: "✓  "; }
.scheck__label { font-weight: 600; }
.scheck__label span { font-weight: 400; font-size: 0.8125rem; color: var(--muted); margin-left: 0.25rem; }
.scheck__detail { color: var(--muted); font-size: 0.9375rem; margin-top: 0.125rem; overflow-wrap: anywhere; }
.scheck__fix { font-size: 0.9375rem; margin-top: 0.25rem; }

.score-next { margin-top: var(--s6); padding: var(--s5) var(--s4); background: var(--ink); color: var(--on-ink); border-radius: var(--radius); display: grid; gap: var(--s4); }
@media (min-width: 56em) { .score-next { grid-template-columns: 1.4fr 1fr; align-items: center; padding: var(--s5); } }
.score-next p { margin-top: var(--s2); color: var(--on-ink-muted); }
.score-next__actions { display: flex; flex-wrap: wrap; gap: var(--s2); }
.score-next .btn--ghost { border-color: var(--line-ink); color: var(--on-ink); }
.score-more { margin-top: var(--s4); color: var(--muted); }

@media print {
  .site-head, .site-foot, .score-hero, .cta-band, .score-gate, .score-next, .score-big__actions, .score-full__head .btn, #what-h, .section:not(.score-run) { display: none !important; }
  body { background: #fff; color: #000; }
  .score-run { padding: 0; }
}
.hero__note a { color: var(--on-ink); text-decoration: underline; }
.site-foot__profiles { list-style: none; display: flex; flex-wrap: wrap; gap: var(--s2) var(--s4); margin-top: var(--s4); }
.site-foot__profiles a { color: var(--on-ink); text-decoration: underline; text-underline-offset: 0.2em; }

/* ===== Schema Generator (/schema-generator/) ===== */
.gen-run { padding-top: var(--s6); scroll-margin-top: 4.5rem; }
.gen-run[hidden], .gen-why-sec[hidden] { display: none; }
.gen-head__label { color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.8125rem; }
.gen-head__url { font-family: var(--display); font-weight: 500; font-size: clamp(1.375rem, 1rem + 1.5vw, 2rem); letter-spacing: -0.012em; line-height: 1.15; margin-top: var(--s1); overflow-wrap: anywhere; }
.gen-head__sum { margin-top: var(--s2); color: var(--muted); }
.gen-note { margin-top: var(--s4); padding: var(--s3) var(--s4); border: 1px solid var(--line-strong); border-radius: var(--radius); max-width: 48rem; }
.gen-note[hidden], .gen-missing[hidden] { display: none; }
.gen-code { margin-top: var(--s5); }
.gen-code__head { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s3); flex-wrap: wrap; margin-bottom: var(--s3); }
.gen-code__head h2 { font-size: 1.375rem; }
.gen-code__head p { margin-top: var(--s1); color: var(--muted); max-width: 40rem; }
.gen-pre { margin: 0; max-height: 26rem; overflow: auto; padding: var(--s4); background: #14130f; color: #f4f0e8; border-radius: var(--radius); font: 0.8125rem/1.55 var(--mono); white-space: pre; tab-size: 2; }
html[data-theme="dark"] .gen-pre { background: #0d0c0a; border: 1px solid var(--line); }
.gen-pre:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
.gen-pre .j-k { color: #c4ff4d; }
.gen-pre .j-s { color: #e8e2d4; }
.gen-pre .j-t { color: #8a867c; }
.gen-missing { margin-top: var(--s5); max-width: 48rem; }
.gen-missing h2 { font-size: 1.25rem; }
.gen-missing > p { margin-top: var(--s1); color: var(--muted); }
.gen-missing ul { list-style: none; margin-top: var(--s3); border-top: 1px solid var(--line); }
.gen-missing li { padding: 0.75rem 0; border-bottom: 1px solid var(--line); }
.gen-missing li code { font: 600 0.9375rem var(--mono); }
.gen-missing li .mono { font-size: 0.75rem; color: var(--muted); margin-left: var(--s2); }
.gen-missing li p { margin-top: 0.125rem; color: var(--muted); font-size: 0.9375rem; }
.gen-jump { margin-top: var(--s5); color: var(--muted); }
.gen-why { display: grid; gap: var(--s4); }
@media (min-width: 56em) { .gen-why { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.gwhy { padding: var(--s4); background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); display: grid; gap: var(--s3); align-content: start; }
.gwhy__head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s3); flex-wrap: wrap; }
.gwhy__head h3 { font-size: 1.25rem; }
.gwhy__lvl { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
.gwhy > p { color: var(--muted); }
.gwhy__tbl { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.gwhy__tbl th, .gwhy__tbl td { text-align: left; padding: 0.4rem 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.gwhy__tbl thead th { font-size: 0.75rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
.gwhy__tbl tbody th { width: 42%; padding-right: var(--s3); font-weight: 400; }
.gwhy__tbl code { font: 0.8125rem var(--mono); overflow-wrap: anywhere; }
.gwhy__tbl td { color: var(--muted); }
.gwhy__ref { justify-self: start; }
.gen-cta { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s5); }
.drawer--ref { width: min(52rem, 100vw); }
.drawer__ref { display: flex; flex-direction: column; height: 100%; }
.drawer__ref .drawer__head { position: static; padding: var(--s3) 1rem; flex-wrap: wrap; }
@media (min-width: 30em) { .drawer__ref .drawer__head { padding-inline: var(--s5); } }
.drawer__kicker { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
.drawer__actions { display: flex; gap: var(--s2); align-items: center; }
#ref-frame { flex: 1; width: 100%; border: 0; background: #fff; }
.gen-promo__in { display: grid; gap: var(--s5); align-items: end; }
@media (min-width: 60em) { .gen-promo__in { grid-template-columns: 1.1fr 1fr; gap: var(--s6); } }
.gen-promo h2 { max-width: 22ch; }
.gen-promo .lead { margin-top: var(--s3); }
.gen-promo .scan-form { margin-top: 0; }
.gen-promo__note { margin-top: var(--s3); color: var(--on-ink-muted); font-size: 0.9375rem; }

/* Post chart: one series, horizontal bars with direct value labels */
.pchart { margin: var(--s5) 0; padding: var(--s4); border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }
.pchart figcaption { display: grid; gap: 0.25rem; margin-bottom: var(--s3); }
.pchart figcaption span { color: var(--muted); font-size: 0.875rem; }
.pchart dl { margin: 0; display: grid; gap: 0; }
.pchart dl > div { display: grid; grid-template-columns: minmax(0, 13rem) minmax(0, 1fr); gap: var(--s3); align-items: center; padding: 0.5rem 0; border-bottom: 1px solid var(--line); }
.pchart dl > div:last-child { border-bottom: 0; }
.pchart dt { font-size: 0.9375rem; font-weight: 600; line-height: 1.25; }
.pchart dt small { font-weight: 400; color: var(--muted); }
.pchart dd { margin: 0; display: flex; align-items: center; gap: var(--s2); }
.pchart__bar { display: block; height: 0.75rem; width: var(--w); background: var(--muted); border-radius: 0 4px 4px 0; }
.pchart__bar--hi { background: var(--strong); }
.pchart dd b { font: 600 0.875rem var(--mono); white-space: nowrap; }
.pchart__note { margin-top: var(--s3); font-size: 0.8125rem; color: var(--muted); }
@media (max-width: 36em) { .pchart dl > div { grid-template-columns: 1fr; gap: 0.375rem; } }

/* Our approach */
.approach .scope__item::before { grid-row: span 4; }
.approach__tag { margin-top: var(--s1) !important; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); }
.approach .scope__item > * { grid-column: 2; }
.approach__out { padding-top: var(--s2); border-top: 1px solid var(--line); font-size: 0.9375rem; }
.levels tbody th { text-align: left; font-weight: 600; }
@media (min-width: 48em) { .levels tbody th { white-space: nowrap; } }

/* Comparison table: stacks into one block per row on phones */
@media (max-width: 40em) {
  .levels--stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .levels--stack, .levels--stack tbody, .levels--stack tr, .levels--stack th, .levels--stack td { display: block; width: 100%; }
  .levels--stack tr { padding: var(--s3) 0; border-bottom: 1px solid var(--line); }
  .levels--stack tbody th { font-family: var(--display); font-weight: 500; font-size: 1.125rem; padding: 0 0 var(--s2); border: 0; }
  .levels--stack td { padding: var(--s1) 0; border: 0; }
  .levels--stack td::before { content: attr(data-label); display: block; font: 500 0.75rem var(--mono); text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
}

/* ===== PDF to Flipbook Maker (/pdf-to-flipbook/) ===== */
html.js .flip-js-note { display: none; }
.flip-hero h1 { max-width: 16ch; }
.flip-drop { margin-top: var(--s5); max-width: 44rem; border: 2px dashed rgba(196, 255, 77, 0.55); border-radius: 2px; background: rgba(244, 240, 232, 0.04); transition: border-color 150ms ease, background-color 150ms ease; }
.flip-drop.is-over, .flip-drop:hover { border-color: var(--lime); background: rgba(196, 255, 77, 0.06); }
.flip-drop:focus-within { border-color: var(--lime); }
.flip-drop__label { display: flex; flex-direction: column; align-items: center; gap: var(--s3); padding: var(--s5) var(--s4) var(--s4); cursor: pointer; text-align: center; }
.flip-drop__icon { width: 2.5rem; height: 2.5rem; color: var(--lime); }
.flip-drop__title { font-family: var(--display); font-weight: 500; font-size: 1.375rem; letter-spacing: -0.006em; }
.flip-drop #flip-file:focus-visible + .flip-drop__label .btn { outline: 2px solid var(--lime); outline-offset: 3px; }
.flip-drop__opts { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--s2) var(--s3); padding: var(--s3) var(--s4); border-top: 1px solid var(--line-ink); font-size: 0.875rem; color: var(--on-ink-muted); }
.flip-drop__opts select { font: 0.875rem var(--body); color: var(--on-ink); background: var(--ink-2); border: 1px solid var(--line-ink); border-radius: var(--radius); min-height: 2.5rem; padding: 0.375rem 0.625rem; }
.flip-work { padding-top: var(--s5); }
.flip-progress { max-width: 36rem; padding: var(--s4); border: 1px solid var(--line); border-radius: var(--radius); }
.flip-progress[hidden], #flip-result[hidden] { display: none; }
.flip-meter { margin-top: var(--s3); height: 0.5rem; border-radius: 1rem; background: var(--line); overflow: hidden; }
.flip-meter span { display: block; width: 0; height: 100%; background: var(--strong); transition: width 200ms ease; }
.flip-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--s3); }
.flip-head__label { color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; }
.flip-head__file { margin-top: var(--s1); font-family: var(--display); font-weight: 500; font-size: 1.375rem; overflow-wrap: anywhere; }
.flip-head__sum { margin-top: var(--s1); color: var(--muted); }
.flip-head__actions { display: flex; flex-wrap: wrap; gap: var(--s2); }
.flip-frame { margin-top: var(--s4); border-radius: 2px; overflow: hidden; background: #1c1c1c; box-shadow: 0 1.5rem 3rem rgb(20 19 15 / 0.18); }
.flip-frame iframe { display: block; width: 100%; height: 80vh; height: 80svh; min-height: 28rem; max-height: 54rem; border: 0; }
.flip-grid { display: grid; gap: var(--s5); margin-top: var(--s6); }
@media (min-width: 60em) { .flip-grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: var(--s6); align-items: start; } .flip-check { position: sticky; top: 6rem; } }
.flip-form { display: grid; gap: var(--s4); }
.flip-form h2, .flip-sec-head h2, .flip-check h2 { font-size: 1.5rem; }
.flip-help { color: var(--muted); font-size: 0.9375rem; }
.flip-form > .flip-help { margin-top: calc(var(--s3) * -1); }
.flip-row { display: grid; gap: var(--s4); }
@media (min-width: 40em) { .flip-row { grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); } }
.flip-form input[type="color"] { padding: 0.25rem; cursor: pointer; }
.flip-count { font-size: 0.8125rem; color: var(--muted); }
.flip-checks { display: grid; gap: var(--s2); }
.flip-checks label { display: flex; align-items: center; gap: var(--s2); min-height: 2.75rem; cursor: pointer; }
.flip-checks input { width: 1.25rem; height: 1.25rem; accent-color: var(--strong); flex: none; }
.flip-check { padding: var(--s4); background: var(--paper-2); border-radius: var(--radius); }
.flip-check__score { margin-top: var(--s2); color: var(--muted); }
.flip-check__score span { font-family: var(--display); font-weight: 500; font-size: 1.75rem; color: var(--text); margin-right: 0.25rem; }
.flip-check__list { list-style: none; margin: var(--s3) 0; border-top: 1px solid var(--line); }
.flip-check__list li { display: grid; grid-template-columns: 2.75rem 1fr; gap: var(--s2); padding: 0.75rem 0; border-bottom: 1px solid var(--line); }
.flip-check__mark { align-self: start; justify-self: start; padding: 0.125rem 0.375rem; border-radius: 3px; font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.04em; }
.is-ok .flip-check__mark { background: var(--lime); color: var(--on-lime); }
.is-fix .flip-check__mark { border: 1px solid var(--line-strong); color: var(--text); }
.flip-check__name { font-weight: 600; font-size: 0.9375rem; }
.flip-check__note { margin-top: 0.125rem; color: var(--muted); font-size: 0.875rem; }
.flip-pages-sec, .flip-out { margin-top: var(--s7); }
.flip-sec-head { max-width: 44rem; margin-bottom: var(--s4); }
.flip-sec-head .flip-help { margin-top: var(--s2); }
.flip-pages { list-style: none; border-top: 1px solid var(--line); }
.flip-page { border-bottom: 1px solid var(--line); }
.flip-page summary { display: flex; align-items: center; gap: var(--s3); padding: 0.625rem 0; cursor: pointer; list-style: none; }
.flip-page summary::-webkit-details-marker { display: none; }
.flip-page summary::after { content: "+"; margin-left: auto; padding-left: var(--s2); font-size: 1.25rem; color: var(--muted); }
.flip-page details[open] summary::after { content: "\2212"; }
.flip-page summary img { width: 3rem; height: auto; flex: none; background: #fff; box-shadow: 0 1px 3px rgb(20 19 15 / 0.2); }
.flip-page__n { flex: none; width: 4.25rem; color: var(--muted); }
.flip-page__t { min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.flip-page__flag { flex: none; padding: 0.125rem 0.375rem; border: 1px solid var(--line-strong); border-radius: 3px; font-size: 0.6875rem; text-transform: uppercase; }
.flip-page__flag[hidden] { display: none; }
.flip-page__body { display: grid; gap: var(--s3); padding: 0 0 var(--s4); }
.flip-page__body textarea { font-size: 0.9375rem; line-height: 1.55; }
.flip-page__links { font-size: 0.875rem; color: var(--muted); overflow-wrap: anywhere; }
.flip-page__links .mono { margin-right: var(--s2); text-transform: uppercase; }
@media (max-width: 30em) { .flip-page__n { width: auto; } }
.flip-out__grid { display: grid; gap: var(--s3); }
@media (min-width: 48em) { .flip-out__grid { grid-template-columns: 1.2fr 1fr; } }
.flip-card { display: grid; gap: var(--s2); align-content: start; justify-items: start; padding: var(--s4); border: 1px solid var(--line); border-radius: var(--radius); }
.flip-card--main { border-color: var(--strong); }
.flip-card h3 { font-size: 1.25rem; }
.flip-card p { color: var(--muted); }
.flip-card .btn { margin-top: var(--s2); }
.flip-card__tag { color: var(--text) !important; text-transform: uppercase; letter-spacing: 0.06em; }
.flip-card__size { font-size: 0.75rem; }
.flip-out .gen-code__head h3 { font-size: 1.25rem; }
.flip-why { display: grid; gap: var(--s4); }
@media (min-width: 48em) { .flip-why { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s5); } }
.flip-why__item { padding-top: var(--s3); border-top: 2px solid var(--strong); }
.flip-why__item p { margin-top: var(--s2); color: var(--muted); }
@media (max-width: 30em) { .flip-head__actions .btn, .flip-card .btn { width: 100%; } .flip-card { justify-items: stretch; } }

/* ===== Home page ===== */
.hero--home { padding-block: var(--s6) var(--s6); }
@media (min-width: 60em) { .hero--home { padding-block: var(--s8) var(--s7); } .hero--home .hero__in { grid-template-columns: 1.15fr 1fr; gap: var(--s7); align-items: center; } }
/* Headline in three fixed lines. The size follows the screen width, so "& recommendations" always fits on one line. */
/* The widest line is about 11 font sizes wide, so the size is the column width / 11.6 (container query), at most 3.5rem. */
.hero--home .hero__copy { container-type: inline-size; }
.hero--home .hero__h1 { max-width: none; font-size: clamp(1.625rem, 8vw, 3.5rem); line-height: 1.08; }
@supports (font-size: 1cqi) { .hero--home .hero__h1 { font-size: min(3.5rem, 100cqi / 11.6); } }
.hero__line { display: block; white-space: nowrap; }
/* Subheading scales with the headline: column width / 36, between 0.9375rem and 1.0625rem */
.hero--home .hero__lede { max-width: 34rem; margin-top: var(--s3); font-size: 0.9375rem; line-height: 1.6; }
@supports (font-size: 1cqi) { .hero--home .hero__lede { font-size: clamp(0.9375rem, 100cqi / 36, 1.0625rem); } }
/* Typewriter word: a thin blinking caret after the word */
.type-word.is-typing { white-space: nowrap; }
.type-word.is-typing::after { content: ""; display: inline-block; width: 0.06em; height: 0.9em; margin-left: 0.06em; vertical-align: -0.08em; background: var(--accent); animation: caret 1s steps(1) infinite; }
@keyframes caret { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .type-word.is-typing::after { animation: none; } }
/* The proof line: one quiet sentence, not a second headline */
.hero__proof { margin-top: var(--s5); padding-top: var(--s3); border-top: 1px solid var(--line); max-width: 34rem; font-size: 0.875rem; line-height: 1.55; color: var(--faint); }
.hero__proof b { font-family: var(--display); font-weight: 500; font-size: 1rem; color: var(--muted); margin-right: 0.125rem; }
.hero__src { display: block; margin-top: 0.25rem; font-size: 0.75rem; }

/* Start card: one email field, one button */
.start-card { background: var(--card); border: 1px solid var(--line); border-radius: 2px; box-shadow: var(--shadow); padding: var(--s5) var(--s4); }
@media (min-width: 30em) { .start-card { padding: var(--s6) var(--s5); } }
.start-card .eyebrow { color: var(--accent); }
.start-card__title { margin-top: var(--s3); font-size: clamp(1.5rem, 1.25rem + 0.9vw, 1.875rem); line-height: 1.15; letter-spacing: -0.015em; }
.start-card__text { margin-top: var(--s3); color: var(--muted); font-size: 0.9375rem; }
.start-form__label { display: block; margin-top: var(--s5); margin-bottom: var(--s2); font-size: 0.875rem; font-weight: 500; }
.start-form__row { display: flex; gap: var(--s2); }
.start-form__row input { flex: 1; min-width: 0; min-height: 3.125rem; padding: 0.75rem 0.875rem; font: 1rem var(--body); color: var(--text); background: var(--paper); border: 1px solid var(--line-strong); border-radius: 2px; }
.start-form__row input::placeholder { color: var(--faint); }
.start-form__row input:focus { outline: 2px solid var(--strong); outline-offset: 1px; border-color: var(--strong); }
.start-form__row input[aria-invalid="true"] { border-color: #a1260f; }
.start-form__row .btn { min-height: 3.125rem; flex-shrink: 0; }
@media (max-width: 30em) { .start-form__row { flex-direction: column; } .start-form__row .btn { width: 100%; } }
.start-form__status { margin-top: var(--s2); font-size: 0.875rem; font-weight: 500; }
.start-form__status:empty { display: none; }
.start-card__fine { margin-top: var(--s3); font-size: 0.8125rem; color: var(--faint); }
.start-card__fine a { color: inherit; }
.start-done { outline: none; }
.start-done .btn { margin-top: var(--s4); }
.start-form[hidden], .start-done[hidden] { display: none; }

/* Tools we work in: a bordered wall of marks */
.logo-wall { padding-block: 0 var(--s4); }
.logo-wall__h { font-family: var(--body); font-size: 1rem; font-weight: 400; letter-spacing: 0; color: var(--muted); text-align: center; max-width: 40rem; margin: 0 auto var(--s4); line-height: 1.5; }
.logo-wall__list { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); background: var(--card); }
@media (min-width: 40em) { .logo-wall__list { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 64em) { .logo-wall__list { grid-template-columns: repeat(6, 1fr); } }
.logo-wall__list li { display: flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 4.5rem; padding: var(--s3); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); font-family: var(--display); font-weight: 500; font-size: 0.9375rem; letter-spacing: -0.006em; color: var(--muted); text-align: center; line-height: 1.25; }
.logo-wall__list .tools-row__icon { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }

/* Painted band: a landscape behind big figures */
.band { position: relative; isolation: isolate; overflow: hidden; color: #f3f6f4; padding-block: var(--s7); background: #12203a; --line-ink: rgb(243 246 244 / 0.22); --on-ink: #f3f6f4; --on-ink-muted: rgb(243 246 244 / 0.8); }
@media (min-width: 60em) { .band { padding-block: var(--s8); } }
.band__sky { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(13 25 46 / 0.88) 0%, rgb(13 25 46 / 0.7) 45%, rgb(13 25 46 / 0.25) 100%); }
.band .eyebrow { color: rgb(243 246 244 / 0.85); margin-bottom: var(--s3); }
.band__title { max-width: 18ch; font-size: clamp(2.125rem, 1.4rem + 2.8vw, 3.75rem); letter-spacing: -0.025em; margin-bottom: var(--s6); }
.band .fact__src a { color: inherit; }
.band .section__close { color: #f3f6f4; }

/* Free tools on the home page */
.home-tools__h { max-width: 20ch; margin-top: var(--s3); }
.tool-minis { display: grid; gap: var(--s3); grid-template-columns: 1fr; }
@media (min-width: 40em) { .tool-minis { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64em) { .tool-minis { grid-template-columns: repeat(3, 1fr); } }
.tool-mini { display: flex; flex-direction: column; gap: 0.625rem; padding: 0.625rem 0.625rem var(--s3); background: var(--ink-2); border: 1px solid var(--line-ink); border-radius: 2px; text-decoration: none; color: var(--on-ink); transition: border-color 150ms ease, transform 150ms ease; }
.tool-mini:hover { border-color: rgb(238 243 241 / 0.4); }
.tool-mini__scene { display: block; aspect-ratio: 4 / 3; min-height: 0; margin-bottom: 0.375rem; }
.tool-mini .post-tag { color: var(--lime); padding-inline: 0.25rem; }
.tool-mini__name { font-family: var(--display); font-weight: 500; font-size: 1.125rem; line-height: 1.2; letter-spacing: -0.012em; padding-inline: 0.25rem; flex: 1; }
.tool-mini__foot { display: flex; justify-content: space-between; gap: var(--s2); margin-inline: 0.25rem; padding-top: 0.625rem; border-top: 1px solid var(--line-ink); font-size: 0.8125rem; color: var(--on-ink-muted); }

/* ===== Resources (/resources/) ===== */
.res-hero { padding-block: var(--s6) var(--s5); }
@media (min-width: 60em) { .res-hero { padding-block: var(--s7) var(--s5); } }
.res-hero h1 { max-width: 17ch; margin-top: var(--s4); }
.res-hero .hero__lede { max-width: 38rem; }
.res-tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.5rem; margin-top: var(--s6); }
@media (min-width: 48em) { .res-tiles { grid-template-columns: repeat(4, 1fr); } }
.res-tile { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 0.125rem; min-height: 7.5rem; padding: 0.875rem; border: 1px solid transparent; border-radius: 2px; background: #12203a; color: #fff; font: inherit; text-align: left; cursor: pointer; outline-offset: 3px; }
@media (min-width: 48em) { .res-tile { min-height: 8.5rem; } }
.res-tile .scene__sky { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 300ms ease; }
.res-tile::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 20%, rgb(13 25 46 / 0.9)); }
.res-tile:hover .scene__sky { transform: scale(1.03); }
.res-tile[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--paper), 0 0 0 3px var(--strong); }
.res-tile__name { font-family: var(--display); font-weight: 500; font-size: 1.0625rem; letter-spacing: -0.01em; line-height: 1.2; }
.res-tile__count { font-size: 0.75rem; color: rgb(255 255 255 / 0.85); }
@media (prefers-reduced-motion: reduce) { .res-tile .scene__sky { transition: none; } }
.res-h2 { font-size: clamp(1.75rem, 1.35rem + 1.5vw, 2.375rem); margin-top: var(--s2); max-width: 22ch; }
.res-row-lead { max-width: 24rem; font-size: 1rem; }

/* Featured tools */
.tool-grid { display: grid; gap: var(--s3); }
@media (min-width: 56em) { .tool-grid { grid-template-columns: repeat(2, 1fr); } }
.tool-card { display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); border-radius: 2px; overflow: hidden; }
.tool-card__scene { display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 10; min-height: 0; padding: var(--s4); border-radius: 0; text-decoration: none; }
.tool-card__body { display: flex; flex-direction: column; gap: var(--s2); padding: var(--s4); flex: 1; }
.tool-card__title { font-size: 1.5rem; letter-spacing: -0.018em; }
.tool-card__title a { text-decoration: none; }
.tool-card__title a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
.tool-card__text { color: var(--muted); flex: 1; }
.tool-card__foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s4); margin-top: var(--s3); padding-top: var(--s3); border-top: 1px solid var(--line); font-size: 0.875rem; color: var(--muted); }
.tool-card__foot .link { margin-left: auto; color: var(--text); }
@media (min-width: 56em) {
  .tool-card--lead { grid-column: 1 / -1; display: grid; grid-template-columns: 1.15fr 1fr; }
  .tool-card--lead .tool-card__scene { order: 2; aspect-ratio: auto; min-height: 24rem; }
  .tool-card--lead .tool-card__body { padding: var(--s6) var(--s5); justify-content: center; }
  .tool-card--lead .tool-card__title { font-size: clamp(2rem, 1.5rem + 1.6vw, 2.75rem); letter-spacing: -0.025em; }
  .tool-card--lead .tool-card__text { flex: 0; font-size: 1.0625rem; max-width: 30rem; }
}
.scan-form--inline { margin-top: var(--s3); max-width: 32rem; }

/* Mock cards: small examples of what each tool shows */
.mock { position: relative; width: min(100%, 19rem); padding: 0.875rem 1rem; background: #fcfdf9; color: #19282e; border-radius: 2px; box-shadow: 0 18px 44px -18px rgb(9 26 66 / 0.6); font-size: 0.8125rem; line-height: 1.4; display: grid; gap: 0.625rem; }
.mock__k { display: flex; justify-content: space-between; gap: 0.5rem; font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.1em; color: #4d616a; }
.mock__flag { padding: 0 0.375rem; border: 1px solid #dbe3e0; border-radius: 2px; letter-spacing: 0.06em; }
.mock__t { font-family: var(--display); font-weight: 500; font-size: 1.0625rem; letter-spacing: -0.01em; line-height: 1.25; }
.mock__big { font-family: var(--display); font-weight: 500; font-size: 3.25rem; line-height: 0.95; letter-spacing: -0.03em; }
.mock__big small { font-size: 0.32em; letter-spacing: 0; color: #4d616a; margin-left: 0.25rem; }
.mock__band { justify-self: start; padding: 0.0625rem 0.5rem; background: #dfece4; color: #2f6b55; border-radius: 2px; font-weight: 500; }
.mock__bars { list-style: none; display: grid; gap: 0.4375rem; padding-top: 0.625rem; border-top: 1px solid #dbe3e0; }
.mock__bars li { display: grid; grid-template-columns: 1fr 5.5rem; align-items: center; gap: 0.5rem; }
.mock__bars i { display: block; height: 0.375rem; background: linear-gradient(90deg, #19282e var(--w), #e6ece9 var(--w)); border-radius: 1px; }
.mock__seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; border: 1px solid #b4c3c0; border-radius: 2px; overflow: hidden; }
.mock__seg span { padding: 0.375rem 0.25rem; text-align: center; font-weight: 500; border-right: 1px solid #b4c3c0; }
.mock__seg span:last-child { border-right: 0; }
.mock__seg .is-on { background: #19282e; color: #f8f9f7; }
.mock--code pre { margin: 0; padding: 0.75rem; background: #19282e; color: #dbe7e3; border-radius: 2px; font: 0.75rem/1.6 var(--mono); white-space: pre-wrap; overflow-wrap: anywhere; }
.mock--code pre b { color: #b8e0c6; font-weight: 500; }
.mock--book { width: min(100%, 17rem); grid-template-columns: 1fr 1fr; gap: 0; padding: 0.5rem; aspect-ratio: 4 / 2.7; transform: perspective(40rem) rotateX(8deg); }
.mock__page { display: flex; flex-direction: column; gap: 0.4375rem; padding: 0.75rem; background: #fff; border: 1px solid #e6ece9; }
.mock__page:first-child { box-shadow: inset -10px 0 12px -10px rgb(25 40 46 / 0.35); }
.mock__page i { display: block; height: 0.375rem; background: #dbe3e0; border-radius: 1px; }
.mock__page i:first-child { height: 1.5rem; background: #f0d2bf; margin-bottom: 0.25rem; }
.mock__page i:nth-child(3) { width: 70%; }

/* Library */
.res-lib-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--s3); margin-bottom: var(--s4); }
.res-lib-count { margin-top: var(--s1); font-size: 0.875rem; color: var(--muted); }
.search__label { display: block; margin-bottom: 0.375rem; font-size: 0.75rem; color: var(--muted); }
.res-grid { display: grid; gap: var(--s3); }
@media (min-width: 48em) { .res-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64em) { .res-grid { grid-template-columns: repeat(3, 1fr); } }
.res-card { display: flex; flex-direction: column; gap: var(--s2); min-height: 15rem; padding: var(--s4); background: var(--card); border: 1px solid var(--line); border-radius: 2px; text-decoration: none; transition: border-color 150ms ease, box-shadow 150ms ease; }
.res-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.res-card[hidden] { display: none; }
.res-card__top { display: flex; justify-content: space-between; align-items: center; gap: var(--s2); margin-bottom: var(--s2); }
.res-card__top .post-tag { padding-right: 0; }
.res-card__arrow { color: var(--muted); transition: transform 150ms ease, color 150ms ease; }
.res-card:hover .res-card__arrow { transform: translateX(0.1875rem); color: var(--text); }
.res-card__title { font-size: 1.3125rem; letter-spacing: -0.015em; line-height: 1.2; }
.res-card__text { color: var(--muted); font-size: 0.9375rem; flex: 1; }
.res-card__foot { display: flex; justify-content: space-between; gap: var(--s2); margin-top: var(--s3); padding-top: var(--s3); border-top: 1px solid var(--line); font-size: 0.8125rem; color: var(--muted); }

/* ===== Light heroes =====
   Tool and offer heroes were ink bands. They now sit on the page surface, like every other hero.
   The hero components draw with the ink tokens, so the tokens flip to surface values here. */
.hero, .audit-hero {
  --ink: var(--paper); --ink-2: var(--paper-2); --on-ink: var(--text); --on-ink-muted: var(--muted); --line-ink: var(--line); --lime: var(--accent);
  background: var(--paper); color: var(--text);
}
.audit-hero { padding-block: var(--s6) var(--s5); border-bottom: 1px solid var(--line); }
@media (min-width: 60em) { .audit-hero { padding-block: var(--s7) var(--s6); } }
.audit-hero h1, .score-hero h1 { max-width: 16ch; }
.hero:not(.hero--home) { border-bottom: 1px solid var(--line); }
.plugin-shot img { border-color: var(--line); box-shadow: var(--shadow); }
.plugin-shot figcaption { color: var(--muted); }

/* Labels above headings: small caps with a dot */
.audit-hero__tag, .audit-cta__tag, .dfy-promo__tag, .weyebrow, .flip-card__tag, .step__n, .compare__label, .tools-row__label, .gen-head__label, .flip-head__label, .score-big__host, .drawer__kicker, .approach__tag, .gwhy__lvl, .sfix__gain, .score-loading p {
  font-family: var(--body) !important; font-size: 0.6875rem !important; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em !important;
}
.audit-hero__tag, .audit-cta__tag, .dfy-promo__tag, .weyebrow { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--muted); }
.audit-hero__tag::before, .audit-cta__tag::before, .dfy-promo__tag::before, .weyebrow::before { content: ""; width: 0.3125rem; height: 0.3125rem; border-radius: 50%; background: currentColor; opacity: 0.8; }
.section--ink .audit-cta__tag, .audit-cta .audit-cta__tag, .section--ink .audit-hero__tag { color: var(--on-ink-muted); }

/* Cards on the surface: white, thin rule, square */
.price-card, .gate__box, .wp-mock { background: var(--card); color: var(--text); border: 1px solid var(--line); border-radius: 2px; box-shadow: var(--shadow); }
.plan, .sfix, .gwhy, .pchart, .compare__col, .flip-card, .credit-box, .wp-tip, .score-error, .gen-note, .flip-progress { background: var(--card); border-radius: 2px; }
.check__help-body, .flip-check { background: var(--card); border: 1px solid var(--line); border-radius: 2px; }
.score-gate { padding: var(--s5) var(--s4); background: var(--card); border-radius: 2px; }
@media (min-width: 48em) { .score-gate { padding: var(--s5); } }
.plan--featured, .compare__col--us { border: 1px solid var(--strong); box-shadow: var(--shadow); }
.price-card__price, .plan__price, .compare__price, .score__num, .score-big__num, .wstat__num, .dstats b, .study__stat, .nav-mega__stat { font-weight: 500; letter-spacing: -0.028em; }

/* Scan field on the surface */
.scan-form input { color: var(--text); background: var(--card); border: 1px solid var(--line-strong); border-radius: 2px; font-weight: 400; }
.scan-form input:focus { outline: 2px solid var(--strong); outline-offset: 1px; border-color: var(--strong); }
.scan-form input::placeholder { color: var(--faint); }
.scan-form .btn { border-radius: 2px; }
.gen-promo .scan-form input { background: var(--on-ink); color: var(--ink); border-color: transparent; }

/* Accent marks that used to be lime on paper */
.answer-set { border-radius: 2px; }
.answer-set label:first-child span { border-radius: 1px 0 0 1px; }
.answer-set label:last-child span { border-radius: 0 1px 1px 0; }
.answer-set input[value="2"]:checked + span { background: var(--accent); color: var(--on-strong); }
.score-result[data-band="cited-by-default"] .score-big__band { background: var(--accent); color: var(--on-strong); }
.score-big__band { font-weight: 500; border-radius: 2px; }
.price-card__limit ins { background: var(--accent-soft); color: var(--text); border-radius: 2px; font-weight: 500; }
.is-ok .flip-check__mark { background: var(--accent-soft); color: var(--accent); }
.wp-mock__btn { background: var(--strong); color: var(--on-strong); border-radius: 2px; font-weight: 500; }
.wp-mock__scope, .wp-mock__code { border-radius: 2px; }
.flip-drop { border: 1px dashed var(--line-strong); background: var(--card); border-radius: 2px; }
.flip-drop.is-over, .flip-drop:hover, .flip-drop:focus-within { border-color: var(--strong); background: var(--paper-2); }
.flip-drop__icon { color: var(--accent); }
.flip-drop__title { font-weight: 500; }
.flip-drop__opts select { color: var(--text); background: var(--card); border-color: var(--line-strong); border-radius: 2px; }
.flip-drop #flip-file:focus-visible + .flip-drop__label .btn { outline-color: var(--strong); }
.flip-frame { border-radius: 2px; box-shadow: var(--shadow); }
.flip-meter { border-radius: 1px; }
.code-sample, .wp-mock__code { background: #19282e; color: #e3ebe8; }
.gen-pre { background: #19282e; color: #e3ebe8; border-radius: 2px; }
.gen-pre .j-k { color: #b8e0c6; }
.gen-pre .j-s { color: #f1d9c7; }
.gen-pre .j-t { color: #8ea2a5; }
.gen-pre:focus-visible { outline-color: var(--strong); }

/* Ink panels on the surface keep the band tokens */
.audit-cta, .score__card, .score-next, .tldr { border-radius: 2px; }
.score__card .score__grade { font-weight: 500; }
.bar { border-radius: 1px; }
.audit-cta h2, .score-next h2 { letter-spacing: -0.018em; }

/* Steps and tables */
.audit-phase__meta div { border-top-width: 1px; }
.sgroup h3 { border-bottom-width: 1px; }
.flip-why__item { border-top-width: 1px; }
.tools-row__list li { font-weight: 500; }

/* ===== LLM Watch: same surface and tokens as the rest of the site ===== */
.page-watch, .page-watch main { background: var(--paper); color: var(--text); }
.watch {
  --ink: var(--paper); --ink-2: var(--paper-2); --on-ink: var(--text); --on-ink-muted: var(--muted); --line-ink: var(--line);
  --panel: var(--card); --panel-2: var(--paper-2); --bar: #a9bcb7; --track: var(--paper-2);
  --accent-fg: var(--accent); --accent-line: var(--strong); --lead-bar: var(--accent); --lime: var(--accent);
  color: var(--text);
}
.watch :focus-visible { outline-color: var(--strong); }
.watch .wticker { background: var(--paper-2); }
.watch .wnav { background: var(--paper); -webkit-backdrop-filter: none; backdrop-filter: none; }
.watch .dot { background: var(--accent); }
.watch .chip--ok { border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
.watch .btn--ghost-dark { border-color: var(--line-strong); color: var(--text); }
.wcard, .wpanel, .dpanel, .players, .studies, .dstats, .wfind { border-radius: 2px; }
.wstat__num, .study__stat, .dstats b { font-weight: 500; }
.watch .topic-tab { color: var(--text); border-color: var(--line); background: var(--card); }
.watch .topic-tab[aria-pressed="true"] { background: var(--strong); color: var(--on-strong); border-color: var(--strong); }

/* ===== Dark theme (html[data-theme="dark"], set in the head script) =====
   The surface turns deep slate. Ink bands sit one step lighter, so they still read as panels. */
html[data-theme="dark"] {
  color-scheme: dark;
  --paper: #0e171b;
  --paper-2: #131f24;
  --card: #16242a;
  --text: #e8efed;
  --muted: #a2b3b5;
  --faint: #7f9295;
  --line: rgba(232, 239, 237, 0.12);
  --line-strong: rgba(232, 239, 237, 0.28);
  --strong: #e8efed;
  --on-strong: #0e171b;
  --strong-hover: #ffffff;
  --accent: #9ed3b5;
  --accent-soft: rgba(158, 211, 181, 0.16);
  --ink: #1b2c33;
  --ink-2: #22363e;
  --on-ink: #eef3f1;
  --on-ink-muted: #a9bcbd;
  --line-ink: rgba(238, 243, 241, 0.14);
  --mark: #9ed3b5;
  --shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 12px 32px -12px rgb(0 0 0 / 0.6);
}
html[data-theme="dark"] .watch { --bar: #4a6563; }
html[data-theme="dark"] .drawer::backdrop { background: rgba(0, 0, 0, 0); }
html[data-theme="dark"] .drawer.is-open::backdrop { background: rgba(0, 0, 0, 0.7); }
html[data-theme="dark"] .gen-pre, html[data-theme="dark"] .code-sample, html[data-theme="dark"] .wp-mock__code { background: #0a1215; border: 1px solid var(--line); }
html[data-theme="dark"] .res-tile[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--paper), 0 0 0 3px var(--strong); }
html[data-theme="dark"] .site-foot { background: #0a1215; }
html[data-theme="dark"] .cta-band { background: #0a1215; border-top: 1px solid var(--line); }
html[data-theme="dark"] .cta-band, html[data-theme="dark"] .site-foot { --ink: #0a1215; }
html[data-theme="dark"] .flip-page summary img { box-shadow: 0 1px 3px rgb(0 0 0 / 0.5); }

/* Claude workflows for GEO: fill-in fields and prompt boxes */
.pfill { padding: var(--s4); border: 1px solid var(--line); border-radius: 2px; background: var(--paper-2); }
.pfill__title { font-family: var(--display); font-weight: 500; font-size: 1.25rem; line-height: 1.25; }
.pfill__note { margin-top: var(--s2); font-size: 0.9375rem; color: var(--muted); }
.pfill__grid { display: grid; gap: var(--s3); margin-top: var(--s4); }
.pfill .field label { font-size: 0.875rem; }
.pfill .field input { min-height: 2.75rem; padding: 0.625rem 0.75rem; font-size: 0.9375rem; background: var(--card); }
.pfill__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3); margin-top: var(--s4); }
.pfill__clear { font: 500 0.875rem var(--body); color: var(--muted); background: none; border: 0; padding: 0.5rem 0; text-decoration: underline; cursor: pointer; }
.pfill__clear:hover { color: var(--text); }
html:not(.js) .pfill__grid, html:not(.js) .pfill__note, html:not(.js) .pfill__clear, html:not(.js) .prompt__copy { display: none; }
@media (min-width: 40em) { .pfill__grid { grid-template-columns: 1fr 1fr; } .pfill__wide { grid-column: 1 / -1; } }
.prompt { border: 1px solid var(--line); border-radius: 2px; background: var(--card); }
.post__body .prompt { margin-top: var(--s3); }
.prompt__head { display: flex; align-items: center; justify-content: space-between; gap: var(--s3); padding: 0.5rem 0.5rem 0.5rem 1rem; border-bottom: 1px solid var(--line); background: var(--paper-2); }
.prompt__meta { display: flex; flex-wrap: wrap; gap: 0.125rem 0.875rem; margin: 0; font: 500 0.75rem/1.4 var(--mono); color: var(--muted); }
.prompt__meta span:first-child { color: var(--text); }
.prompt__copy { flex-shrink: 0; min-height: 2.25rem; padding: 0.375rem 0.75rem; font: 500 0.8125rem/1.2 var(--body); color: var(--text); background: var(--card); border: 1px solid var(--line-strong); border-radius: 2px; cursor: pointer; transition: border-color 150ms ease; }
.prompt__copy:hover { border-color: var(--strong); }
.prompt__copy:focus-visible, .prompt__code:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.prompt__code { margin: 0; max-height: 26rem; overflow: auto; padding: var(--s3); font: 0.8125rem/1.65 var(--mono); color: var(--text); white-space: pre-wrap; overflow-wrap: anywhere; tab-size: 2; }
.prompt__code code { font: inherit; }
.ph { padding: 0 0.125rem; color: var(--accent); background: var(--accent-soft); border-radius: 2px; }
.ph.is-filled { color: var(--text); }
.post__body .table-wrap td a, .post__body .table-wrap th a { text-decoration: none; }
.post__body a.btn { text-decoration: none; }

/* Home hero: mini AI Visibility Score form (sends the address to /ai-visibility-score/?url=) */
.scan-form--mini { margin-top: var(--s4); max-width: none; }
.scan-form--mini input { min-height: 3.125rem; font-size: 1rem; }
.scan-form--mini .btn { min-height: 3.125rem; }

/* Services: problem-to-service table and section intros */
.svc-intro { max-width: 46rem; margin-bottom: var(--s5); color: var(--muted); }
.svc-fit tbody th { font-weight: 500; }
@media (min-width: 48em) { .svc-fit tbody th { white-space: normal; width: 55%; } }

/* AI Visibility Engineering Playbook page (/ai-visibility-engineering-playbook/) */
.pb-tag { color: var(--accent); font-size: 0.8125rem; margin-bottom: var(--s3); }
.pb-hero h1 { max-width: 13ch; }
@media (min-width: 60em) { .pb-hero__in { grid-template-columns: 1.1fr 0.9fr; align-items: start; } }
.pb-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s3); margin: var(--s5) 0 0; max-width: 32rem; }
@media (min-width: 30em) { .pb-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pb-facts div { border-top: 1px solid var(--line-strong); padding-top: var(--s2); }
.pb-facts dt { font-size: 0.8125rem; color: var(--muted); }
.pb-facts dd { margin: 0; font-family: var(--display); font-weight: 500; font-size: 1.75rem; line-height: 1.2; letter-spacing: -0.015em; }
.pb-gate { scroll-margin-top: 6rem; }
.pb-form { display: grid; gap: var(--s3); margin-top: var(--s4); }
.pb-form__sub { font-family: var(--display); font-weight: 500; font-size: 1.0625rem; line-height: 1.35; color: var(--text); }
.pb-check { display: flex; gap: var(--s2); align-items: flex-start; font-size: 0.9375rem; color: var(--muted); cursor: pointer; }
.pb-check input { width: 1.125rem; height: 1.125rem; margin-top: 0.2rem; accent-color: var(--accent); flex-shrink: 0; }
.pb-form .form__status:empty { display: none; }
.pb-form .form__status, .pb-sub-form__status { font-size: 0.9375rem; color: #a1260f; }
.pb-done { display: grid; gap: var(--s3); margin-top: var(--s4); outline: none; }
.pb-done__title { font-size: 1.375rem; }
.pb-done__msg { color: var(--muted); }
.pb-done__email { color: var(--text); font-weight: 600; word-break: break-all; }
.pb-why { margin-top: 0; }
.pb-parts td:last-child, .pb-parts th:last-child { text-align: right; font-family: var(--mono); font-size: 0.875rem; white-space: nowrap; }
.pb-parts td:first-child, .pb-pick td:first-child { white-space: normal; }
.pb-parts td:first-child { min-width: 11rem; }
.pb-pick td:last-child { color: var(--muted); }
.pb-pages { display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
.pb-page { margin: 0; }
.pb-page img { width: 100%; height: auto; border: 1px solid var(--line); box-shadow: var(--shadow); background: #fff; }
.pb-page figcaption { margin-top: var(--s2); font-size: 0.8125rem; color: var(--muted); }
.pb-updates__in { display: grid; gap: var(--s6); }
@media (min-width: 60em) { .pb-updates__in { grid-template-columns: 1.05fr 0.95fr; gap: var(--s7); align-items: start; } }
.pb-updates h2 { margin-bottom: var(--s3); }
.pb-sub-form { display: flex; flex-wrap: wrap; gap: var(--s2); margin: var(--s5) 0 var(--s3); }
.pb-sub-form input[type="email"] { flex: 1 1 14rem; min-height: 3rem; padding: 0.75rem 0.875rem; font: 1rem var(--body); color: var(--text); background: var(--paper); border: 1px solid var(--line-strong); border-radius: 2px; }
.pb-sub-form input[type="email"]:focus { outline: 2px solid var(--lime); outline-offset: 1px; }
.pb-sub-form .btn { flex: 0 0 auto; }
@media (max-width: 30em) { .pb-sub-form .btn { width: 100%; } }
.pb-sub-form__status { flex-basis: 100%; }
.pb-updates .pb-sub-form__status { color: var(--lime); }
.pb-log { border: 1px solid var(--line-ink); border-radius: 2px; padding: var(--s4); }
.pb-log__h { font-size: 1.125rem; margin-bottom: var(--s3); }
.pb-log__list { list-style: none; display: grid; gap: var(--s4); }
.pb-log__list li { display: grid; gap: var(--s1); }
.pb-log__list p { color: var(--on-ink-muted); font-size: 0.9375rem; }
.pb-log__v { color: var(--lime) !important; font-size: 0.8125rem !important; }
.pb-log__list li + li { border-top: 1px solid var(--line-ink); padding-top: var(--s4); }
.page-playbook .checklist a { color: var(--text); }
.pb-form[hidden], .pb-done[hidden] { display: none; }
.pb-jump { margin-top: var(--s5); }
@media (min-width: 60em) { .pb-jump { display: none; } }
@media (max-width: 30em) { .pb-jump { width: 100%; } }

/* ===== Private proposals (/p/<slug>/) and the password page (/p/gate/) ===== */
.prop-hero h1 { max-width: 18ch; font-size: clamp(2.125rem, 1.4rem + 2.8vw, 3.5rem); }
@media (min-width: 60em) { .prop-hero__in { grid-template-columns: 1.15fr 0.85fr; } }
.prop-card { display: grid; gap: var(--s4); }
.prop-people { margin: 0; display: grid; gap: 0; border-top: 1px solid var(--line); }
.prop-people > div { display: grid; grid-template-columns: 6.5rem 1fr; gap: var(--s3); padding-block: 0.875rem; border-bottom: 1px solid var(--line); }
.prop-people dt { font-size: 0.6875rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; color: var(--muted); padding-top: 0.25rem; }
.prop-people dd { margin: 0; display: grid; gap: 0.125rem; }
.prop-people strong { font-family: var(--display); font-weight: 500; font-size: 1.125rem; line-height: 1.25; }
.prop-people span { font-size: 0.875rem; color: var(--muted); }
.prop-glance { list-style: none; display: grid; gap: var(--s2); }
.prop-glance a { display: grid; grid-template-columns: 4.5rem 1fr auto; align-items: baseline; gap: var(--s2); padding: 0.75rem 0.875rem; background: var(--paper); border: 1px solid var(--line); border-radius: 2px; text-decoration: none; transition: border-color 150ms ease; }
.prop-glance a:hover { border-color: var(--strong); }
.prop-glance__n { font-family: var(--mono); font-size: 0.75rem; color: var(--muted); }
.prop-glance__name { font-weight: 500; }
.prop-glance__price { font-family: var(--display); font-weight: 500; }
.prop-glance li:first-child a { border-color: var(--accent); }
.prop-src { margin-top: var(--s5); max-width: 46rem; }
.prop-src a { color: inherit; }
.prop-find tbody th { font-family: var(--display); font-weight: 500; font-size: 1rem; color: var(--text); white-space: normal; min-width: 14rem; }
.prop-find td { color: var(--muted); }
.prop-find td:last-child { white-space: nowrap; }
.prop-find td a { color: var(--text); font-weight: 500; }
@media (min-width: 48em) { .prop-find tbody th { width: 34%; } }

.tiers { display: grid; gap: var(--s3); align-items: stretch; }
@media (min-width: 64em) { .tiers { grid-template-columns: repeat(3, 1fr); } }
.tier { display: flex; flex-direction: column; gap: var(--s3); padding: var(--s5) var(--s4); background: var(--card); border: 1px solid var(--line); border-radius: 2px; scroll-margin-top: 6rem; }
.tier--lead { border-color: var(--strong); box-shadow: var(--shadow); }
.tier__n { font-size: 0.6875rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; color: var(--muted); }
.tier--lead .tier__n { color: var(--accent); }
.tier__name { font-size: 1.375rem; line-height: 1.2; letter-spacing: -0.015em; }
.tier__price { font-family: var(--display); font-weight: 500; font-size: 3rem; line-height: 1; letter-spacing: -0.028em; padding-block: var(--s2); border-block: 1px solid var(--line); }
.tier__price span { font-family: var(--body); font-size: 0.9375rem; letter-spacing: 0; color: var(--muted); margin-left: var(--s2); }
.tier__price--quote { font-size: 1.75rem; padding-block: 0.875rem; }
.tier__lead { color: var(--muted); }
.tier .checklist { flex: 1; }
.tier__done { font-size: 0.9375rem; color: var(--muted); }
.tier__done strong { color: var(--text); font-weight: 600; }
.tier .btn { margin-top: auto; }

.prop-res { display: grid; gap: var(--s3); }
@media (min-width: 48em) { .prop-res { grid-template-columns: repeat(3, 1fr); } }
.prop-res__card { display: flex; flex-direction: column; gap: var(--s2); padding: 0.625rem 0.625rem var(--s4); background: var(--card); border: 1px solid var(--line); border-radius: 2px; text-decoration: none; transition: border-color 150ms ease, box-shadow 150ms ease; }
.prop-res__card:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.prop-res__scene { min-height: 0; aspect-ratio: 16 / 7; margin-bottom: var(--s2); }
.prop-res__card .post-tag, .prop-res__title, .prop-res__text, .prop-res__foot { margin-inline: 0.625rem; }
.prop-res__title { font-family: var(--display); font-weight: 500; font-size: 1.375rem; line-height: 1.2; letter-spacing: -0.015em; }
.prop-res__text { color: var(--muted); font-size: 0.9375rem; flex: 1; }
.prop-res__foot { display: flex; justify-content: space-between; gap: var(--s2); margin-top: var(--s2); padding-top: var(--s3); border-top: 1px solid var(--line); font-size: 0.8125rem; color: var(--muted); }
.prop-res__foot span:last-child { color: var(--text); font-weight: 500; }

.gate-p { padding-block: var(--s7) var(--s8); }
.gate-p__card { max-width: 34rem; margin-inline: auto; }
.gate-p__error { margin-top: var(--s3); font-size: 0.875rem; font-weight: 500; color: #a1260f; }
html[data-theme="dark"] .gate-p__error { color: #f0a08f; }
.gate-p__error[hidden] { display: none; }

/* Local AI Presence Playbook (/local-ai-presence-playbook/): hero with a 3D book, then the covers list beside the form */
.lp-hero { padding-bottom: var(--s6); }
@media (min-width: 60em) { .lp-hero__in { grid-template-columns: 1.05fr 0.95fr; } }
.lp-hero h1 { max-width: 11ch; }
.lp-book { margin: 0; justify-self: center; width: min(100%, 26rem); }
.lp-book img { width: 100%; height: auto; }
@media (max-width: 59.99em) { .lp-book { width: min(72%, 22rem); margin-inline: auto; } }
.lp-get { scroll-margin-top: 5rem; }
.lp-get__in { display: grid; gap: var(--s6); }
@media (min-width: 60em) { .lp-get__in { grid-template-columns: 1.1fr 0.9fr; gap: var(--s7); align-items: start; } }
.lp-get__copy h2 { margin-top: var(--s3); }
.lp-get__copy .lead { margin-top: var(--s3); }
.lp-get__copy .checklist { margin-top: var(--s5); }
/* $249 Starter Package offer at the end of the Local AI Presence Playbook page */
.lp-offer { scroll-margin-top: 5rem; }
.lp-offer h2 { max-width: 18ch; }
.lp-offer__steps { list-style: none; display: grid; gap: var(--s3); margin-top: var(--s5); padding: 0; }
.lp-offer__steps li { display: grid; grid-template-columns: 2rem 1fr; gap: var(--s3); align-items: start; }
.lp-offer__steps .mono { display: grid; place-items: center; width: 2rem; height: 2rem; border: 1px solid var(--line-ink); border-radius: 2px; font-size: 0.875rem; color: var(--on-ink); }
.lp-offer__steps p { color: var(--on-ink-muted); font-size: 0.9375rem; line-height: 1.55; }
.lp-offer__steps strong { color: var(--on-ink); font-weight: 500; }
.lp-offer .price-card { box-shadow: none; --btn-bg: initial; --btn-fg: initial; --btn-hover: initial; }
.price-card__fine { font-size: 0.8125rem; color: var(--muted); }
.price-card__fine a { color: var(--text); text-decoration: underline; }
.lp-get .start-card__title { margin-top: var(--s2); }
.page-localpb .checklist a { color: var(--text); }
.page-localpb .fact__src a { text-decoration: underline; }

/* localaipresence.com home: the playbook landing page hero on top; the ageoagency.com hero moves below the tool logos */
.hero.lap-hero { border-bottom: 0; }
.hero--band { background: var(--paper-2); border-block: 1px solid var(--line); }
@media (min-width: 60em) { .hero--home.hero--band { padding-block: var(--s7); } }

/* ===== Site chat button in the header, next to the contact icon. The panel styles load with the chat (assets/css/chat.css). ===== */
html:not(.js) .icon-btn--chat { display: none; }
.icon-btn--chat { position: relative; }
.icon-btn--chat .icon-btn__icon { stroke-linecap: round; }
.icon-btn--chat[aria-expanded="true"] { border-color: var(--strong); background: var(--paper-2); }
.icon-btn--chat.has-chat::after { content: ""; position: absolute; top: 0.25rem; right: 0.25rem; width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: var(--accent); }
.icon-btn--chat[aria-busy="true"] { opacity: 0.6; }
@media print { .chat { display: none !important; } }
/* Narrow phones (under 384px): five header buttons need a little less room, so the wordmark stays on one line. */
@media (max-width: 23.99em) {
  .site-head__actions { gap: 0.375rem; }
  .site-head__actions .theme-toggle, .site-head__actions .icon-btn { width: 2.25rem; height: 2.25rem; }
  .site-head__actions .nav-toggle { padding-inline: 0.625rem; }
  .brand { white-space: nowrap; }
}

/* Colophon (/colophon/): definition lists with documentation links */
.colo h3 { font-size: 1.125rem; margin: var(--s5) 0 var(--s3); }
.colo ul { padding-left: 1.25rem; color: var(--muted); }
.colo ul li + li { margin-top: 0.5rem; }
.colo-steps { padding-left: 1.5rem; color: var(--muted); }
.colo-steps li { padding-left: 0.25rem; }
.colo-steps li + li { margin-top: 0.75rem; }
.colo-steps strong { color: var(--text); }
.colo-list { margin: 0; display: grid; border-top: 1px solid var(--line); }
.colo-list > div { padding-block: 1rem; border-bottom: 1px solid var(--line); }
.colo-list dt { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; font-family: var(--display); font-weight: 500; font-size: 1.0625rem; color: var(--text); }
.colo-list dd { margin: 0.375rem 0 0; color: var(--muted); }
.colo-tag { padding: 0.125rem 0.5rem; border: 1px solid var(--line-strong); border-radius: 2px; font: 500 0.6875rem/1.5 var(--body); text-transform: uppercase; letter-spacing: 0.08em; color: var(--accent); }
.colo-docs { display: flex; flex-wrap: wrap; gap: 0.375rem 1rem; margin-top: 0.5rem !important; }
.doc { display: inline-flex; align-items: center; gap: 0.3125rem; font-size: 0.875rem; font-weight: 500; color: var(--accent); }
.doc__icon { flex: none; width: 0.75rem; height: 0.75rem; }
.colo-foot { margin-top: var(--s5); }
.colo-date { margin-top: var(--s3); }
.colo h2, .colo h3 { scroll-margin-top: 6rem; }

/* Colophon: animated data flow ("Watch one question move through the system").
   Each row lights up in turn (--i is its step). A dot runs down the link into the next row.
   Pause button for WCAG 2.2.2; no animation when the visitor asks for less motion. */
.flow { margin: var(--s4) 0 0; padding: var(--s4) 1rem; background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--radius); --flow-step: 2s; --flow-cycle: 14s; }
@media (min-width: 48em) { .flow { padding: var(--s5); } }
.flow__bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.75rem; margin-bottom: var(--s4); }
.flow__legend { display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem 0.75rem; font-size: 0.75rem; color: var(--muted); }
.flow__key { display: inline-block; width: 0.75rem; height: 0.75rem; margin-right: -0.375rem; border: 2px solid var(--line-strong); border-radius: 2px; vertical-align: -0.1em; }
.flow__key--cf { border-color: var(--accent); }
.flow__key--ext { border-color: var(--strong); }
.flow__key--you { border-style: dashed; }
.flow__pause { min-height: 2.25rem; padding: 0.375rem 0.875rem; border: 1px solid var(--line-strong); border-radius: 2px; background: var(--card); color: var(--text); font: 500 0.8125rem var(--body); cursor: pointer; }
.flow__pause:hover { border-color: var(--strong); }
.flow__list { position: relative; list-style: none; margin: 0; padding: 0; }
.flow__list::before { content: ""; position: absolute; left: 1.25rem; top: 1.5rem; bottom: 1.5rem; width: 2px; background: var(--line-strong); }
.flow__row { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "link" "node" "aside"; }
@media (min-width: 48em) { .flow__row { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); column-gap: 1.25rem; grid-template-areas: "link aside" "node aside"; } .flow__aside { align-self: center; margin-block: 0.5rem; } }
.flow__node, .flow__aside { position: relative; z-index: 1; display: grid; gap: 0.25rem; padding: 0.875rem 1rem; background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--line-strong); border-radius: 0; }
.flow__node { grid-area: node; align-self: start; align-content: start; }
.flow__node--cf { border-left-color: var(--accent); }
.flow__node--ext { border-left-color: var(--strong); }
.flow__node--you { border-left-style: dashed; }
.flow__aside { grid-area: aside; margin-top: 0.5rem; border-style: dashed; border-left-width: 1px; background: var(--paper-2); }
@media (min-width: 48em) { .flow__aside { margin-top: 0; } }
.flow__aside--stop::before, .flow__aside--feed::before { font-size: 0.75rem; color: var(--faint); }
.flow__aside--stop::before { content: "Or, for simple messages:"; }
.flow__aside--feed::before { content: "Feeds the search:"; }
.flow__tech { font-family: var(--mono); font-size: 0.6875rem; letter-spacing: 0.01em; color: var(--accent); }
.flow__node--ext .flow__tech, .flow__node--you .flow__tech, .flow__aside .flow__tech { color: var(--muted); }
.flow__title { font-family: var(--display); font-weight: 500; font-size: 1rem; line-height: 1.3; color: var(--text); }
.flow__text { font-size: 0.875rem; line-height: 1.5; color: var(--muted); }
.flow__link { grid-area: link; position: relative; z-index: 1; display: block; width: 2px; height: 1.75rem; margin-left: 1.25rem; }
.flow__link i { position: absolute; left: 50%; top: 0; width: 0.5rem; height: 0.5rem; margin-left: -0.25rem; border-radius: 50%; background: var(--accent); opacity: 0; }
.flow figcaption { margin-top: var(--s3); }
@media (prefers-reduced-motion: no-preference) {
  .flow__node { animation: flow-node var(--flow-cycle) linear infinite; animation-delay: calc(var(--i) * var(--flow-step)); }
  .flow__link i { animation: flow-dot var(--flow-cycle) linear infinite; animation-delay: calc(var(--i) * var(--flow-step) - 0.6s); }
  .flow__aside--stop { animation: flow-aside var(--flow-cycle) linear infinite; animation-delay: calc(2 * var(--flow-step) + 0.6s); }
  .flow.is-paused .flow__node, .flow.is-paused .flow__link i, .flow.is-paused .flow__aside { animation-play-state: paused; }
}
@media (prefers-reduced-motion: reduce) { .flow__pause { display: none; } }
@keyframes flow-node {
  0% { background: var(--card); box-shadow: none; }
  2%, 12% { background: var(--accent-soft); box-shadow: 0 0 0 1px var(--accent); }
  16%, 100% { background: var(--card); box-shadow: none; }
}
@keyframes flow-dot {
  0% { transform: translateY(0); opacity: 1; }
  4% { transform: translateY(1.25rem); opacity: 1; }
  4.5%, 100% { transform: translateY(1.25rem); opacity: 0; }
}
@keyframes flow-aside {
  0% { border-color: var(--line); }
  2%, 8% { border-color: var(--accent); }
  12%, 100% { border-color: var(--line); }
}

/* Plugin page: A/GEO Answers coming soon */
.soon-note { line-height: 1.7; }
.soon-tag { display: inline-block; margin-right: 0.5rem; padding: 0.125rem 0.5rem; border: 1px solid var(--accent); border-radius: 2px; color: var(--accent); font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.08em; }
.answers-cta { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s4); }
@media (max-width: 30em) { .answers-cta .btn { width: 100%; } }
@media (min-width: 48em) { .answers-list { grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--line); } .answers-list > div:nth-child(-n+2) { border-top: 0; } }
.colo-report { margin-top: var(--s5); padding-top: var(--s4); border-top: 1px solid var(--line); color: var(--text); }
.colo-report--next { margin-top: var(--s2); padding-top: 0; border-top: 0; }
.colo-more { margin-top: var(--s3); color: var(--muted); }

/* Free tools: a large card with its own button (AI Query Fan-out) */
.tool-card__cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); margin-top: var(--s4); }