/* ==========================================================================
   CONTENT PAGES: blog listing, category archives, posts, legal, search, 404,
   free tools hub and the nine tool pages. Loads after v2.css + theme.css via
   $page['css'] = 'content'. Light first: white and warm off-white surfaces,
   near-black type, teal for actions, dark only as a contained panel.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Shared hero extras (v2_page_hero / .pg2)
   -------------------------------------------------------------------------- */
.pg2 .h2-hero__actions { align-items: center; }
.pg2__media img { background: var(--bg-soft); }

/* Jump links (tools hub): outlined light pills */
.pg2 .hub-jump { margin-top: 0; gap: 10px; }
.pg2 .hub-jump a {
  min-height: 44px; padding: 10px 18px; border-radius: 999px; font-size: 14.5px; font-weight: 600;
  color: var(--tx); background: #fff; border: 1.5px solid var(--line);
  transition: border-color .2s, color .2s, background-color .2s, transform .2s;
}
.pg2 .hub-jump a:hover { border-color: var(--accent); color: var(--accent); background: #fff; transform: translateY(-2px); }

/* Light search pill (search page + 404 hero) */
.pg2 .cn-search {
  width: min(560px, 100%); margin: 0; padding: 6px 6px 6px 20px; min-height: 58px;
  background: #fff; border: 1.5px solid var(--line); color: var(--muted);
  box-shadow: var(--shadow-sm); backdrop-filter: none; -webkit-backdrop-filter: none;
}
.pg2 .cn-search input { color: var(--tx); font-size: 16px; }
.pg2 .cn-search input::placeholder { color: var(--muted); }
.pg2 .cn-search:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(46,110,118,.14); }
.pg2 .cn-search .v2-btn { flex: none; }
.cn-nf__links { display: flex; flex-wrap: wrap; gap: 12px; width: 100%; margin-top: 18px; }
/* 404: the "note" label reads as a big code chip */
.pg2__note { font: 800 22px/1 var(--f-head); letter-spacing: -.02em; padding: 12px 16px; }

/* --------------------------------------------------------------------------
   Section helpers
   -------------------------------------------------------------------------- */
.cn-note { margin-top: 24px; max-width: 760px; color: var(--tx-2); font-size: 16px; }
.cn-note a, .tool-page .v2-prose a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.cn-note a:hover { color: var(--accent-2); }

/* Services strip (blog, category, tools hub, 404) */
.cn-svc .v2-left-head { margin-bottom: 40px; }
.cn-svc__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.cn-svc__card {
  display: flex; flex-direction: column; gap: 10px; min-height: 100%; padding: 26px;
  border-radius: var(--r); background: #fff; border: 1px solid var(--line); color: var(--tx);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
}
.cn-svc__card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: #CFE3E6; }
.cn-svc__card strong { font: 700 19px/1.25 var(--f-head); letter-spacing: -.015em; }
.cn-svc__ic { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 6px; border-radius: 14px; background: var(--accent-soft); color: var(--accent); }
.cn-svc__ic .v2-ic { width: 22px; height: 22px; }
.cn-svc__text { font-size: 15px; line-height: 1.55; color: var(--muted); }
.cn-svc__more { margin-top: auto; padding-top: 8px; display: inline-flex; align-items: center; gap: 6px; font-size: 14.5px; font-weight: 600; color: var(--accent); }
@media (max-width: 1000px) { .cn-svc__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .cn-svc__grid { grid-template-columns: minmax(0, 1fr); } }

/* "Want us to fix it" card (tool pages + posts) */
.cn-fix__card {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 5vw, 64px); align-items: center;
  padding: clamp(28px, 5vw, 64px); border-radius: var(--r-lg); background: var(--bg-tint); border: 1px solid #D6EAEC;
}
.cn-fix__title { font-size: clamp(30px, 3.6vw, 48px); margin-bottom: 16px; }
.cn-fix__copy .v2-lead { margin-bottom: 26px; max-width: 52ch; }
.cn-fix__links { display: grid; gap: 12px; }
.cn-fix__link {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 18px 22px;
  border-radius: 16px; background: #fff; border: 1px solid var(--line); color: var(--tx);
  transition: transform .25s var(--ease), border-color .25s, box-shadow .25s;
}
.cn-fix__link:hover { transform: translateY(-3px); border-color: var(--accent); box-shadow: var(--shadow-sm); }
.cn-fix__link strong { display: block; font: 700 17px/1.3 var(--f-head); letter-spacing: -.01em; }
.cn-fix__link small { display: block; margin-top: 2px; font-size: 14px; color: var(--muted); }
.cn-fix__link .v2-ic { flex: none; color: var(--accent); }
.cn-fix + .v2-sec--tight { padding-top: 0; }
@media (max-width: 900px) { .cn-fix__card { grid-template-columns: minmax(0, 1fr); } }

/* --------------------------------------------------------------------------
   Blog listing + category archives
   -------------------------------------------------------------------------- */
.bl-feat { border-color: var(--line); }
.bl-feat__pill { background: var(--accent-soft); border-color: var(--accent-soft); color: var(--accent-2); }
.bl-feat__pill .v2-pill__dot { background: var(--accent); }
.bl-feat__title { color: var(--tx); }
.bl-feat .h2-svc__more { color: var(--accent); font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.bl .pf-chip { color: var(--tx); min-height: 44px; }
.bl .pf-chip:hover { border-color: var(--accent); color: var(--accent); }
.bl .pf-chip.is-active { background: var(--tx); border-color: var(--tx); color: #fff; }
.bl .pf-chip.is-active span { color: rgba(255,255,255,.7); }
.bl .pf-search:focus-within { border-color: var(--accent); }
.h2-ins__meta { color: var(--accent); }
.h2-ins__more { color: var(--accent); }
.h2-ins__body h3 { color: var(--tx); }
.bl .sr__empty { max-width: 720px; }

/* --------------------------------------------------------------------------
   Post: light hero (title + meta left, framed article image right)
   -------------------------------------------------------------------------- */
.ps-hero2__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center; }
.ps-hero2__title { font-size: clamp(32px, 4.2vw, 56px); line-height: 1.04; letter-spacing: -.035em; }
.ps-hero2__lead { font-size: clamp(16.5px, 1.25vw, 18px); margin-bottom: 24px; }
a.ps-hero2__cat { margin-bottom: 4px; transition: background-color .2s, color .2s; }
a.ps-hero2__cat:hover { background: var(--accent-soft); color: var(--accent-2); }
.ps-hero2__media img { aspect-ratio: 16 / 11; }
.ps-hero2 .ps-byline { margin: 0; color: var(--tx-2); }
.ps-hero2 .ps-byline strong { color: var(--tx); }
.ps-hero2 .ps-byline__meta { color: var(--muted); }
.ps-hero2 .ps-byline__av { border: 1px solid var(--line); }
.ps-sec { padding-top: clamp(40px, 5vw, 72px); }
.ps-card { border-color: var(--line); }
.ps-card__label { color: var(--accent); }
.ps-card--cta { background: var(--panel); border-color: var(--panel); border-radius: var(--r); }
.ps-card--cta .ps-card__label { color: var(--mint); }
.post-share__btn { color: var(--tx); }
.post-share__btn:hover { background: var(--tx); border-color: var(--tx); }
.post-toc__list a.is-active { color: var(--accent); border-left-color: var(--accent); }
.v2-prose { color: var(--tx-2); }
.v2-prose h2, .v2-prose h3, .v2-prose h4, .v2-prose strong { color: var(--tx); }
.v2-prose a { color: var(--accent); }
.v2-prose blockquote { background: var(--bg-tint); color: var(--tx); border-left: 4px solid var(--accent); }
.v2-prose thead th { background: var(--panel); }
.v2-prose tbody tr:nth-child(even) { background: var(--bg-soft); }
.v2-prose code { background: var(--bg-soft); }
.ps-author { background: var(--bg-soft); border: 1px solid var(--line); }
.ps-author__role { color: var(--accent); }
.cn-fix--post { padding-top: clamp(56px, 7vw, 96px); }
.cn-nf-post .v2-left-head { margin-bottom: 32px; }
@media (max-width: 900px) {
  .ps-hero2__grid { grid-template-columns: minmax(0, 1fr); }
  .ps-hero2__media { order: 2; }
}

/* --------------------------------------------------------------------------
   Legal pages (privacy, terms)
   -------------------------------------------------------------------------- */
.lg__toc { border-color: var(--line); border-radius: var(--r); box-shadow: var(--shadow-sm); }
.lg__toc a { color: var(--tx-2); min-height: 36px; align-items: center; }
.lg__toc a span { color: var(--accent); margin-top: 0; }
.lg__toc a:hover { background: var(--bg-tint); color: var(--accent); }
.lg__intro { color: var(--tx); }
.lg__section h2 { color: var(--tx); font-weight: 700; letter-spacing: -.02em; }
.lg__section h2 span { color: var(--accent); }
.lg__section p { color: var(--tx-2); }
.lg__section .v2-checks .v2-ic { color: var(--accent); }
.lg__contact { background: var(--panel); border-radius: var(--r-lg); padding: clamp(24px, 3vw, 36px); }
.lg__contact a { color: var(--mint); }
@media (max-width: 900px) {
  .lg { grid-template-columns: minmax(0, 1fr); }
  .lg__toc { position: static; }
}

/* --------------------------------------------------------------------------
   Search results
   -------------------------------------------------------------------------- */
.sr .sr__empty .v2-h2 { font-size: clamp(30px, 3.6vw, 46px); }
.sr__group-title { color: var(--accent); }
.sr__group-title span { background: var(--bg-soft); }
.sr .pf-chip { min-height: 44px; color: var(--tx); }
.sr .pf-chip:hover { border-color: var(--accent); color: var(--accent); }
.sr .pf-chip.is-active { background: var(--accent); border-color: var(--accent); color: #fff; }
.sr__hit { border-color: var(--line); }
.sr__hit:hover { border-color: var(--accent); box-shadow: var(--shadow-sm); }
.sr__hit .v2-ic { color: var(--accent); flex: none; }

/* --------------------------------------------------------------------------
   FREE TOOLS: light premium widgets (overrides the v1-era rules in v2.css)
   -------------------------------------------------------------------------- */
.tool-page .v2-h2 { font-size: clamp(30px, 3.4vw, 44px); }
.tool-page.v2-sec--sand .v2-prose p { color: var(--tx-2); }

/* Panels */
.tool-split { gap: clamp(16px, 2vw, 24px); }
.tool-panel {
  background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: clamp(22px, 3vw, 36px); box-shadow: var(--shadow-sm);
}
.tool-panel--result { background: var(--bg-soft); border-top: 1px solid var(--line); box-shadow: none; top: 104px; }
.tool-panel__title { font: 700 20px/1.2 var(--f-head); letter-spacing: -.015em; color: var(--tx); border-bottom-color: var(--line); }
.tool-panel__sub { font: 600 12px/1.2 var(--f-body); letter-spacing: .08em; color: var(--muted); border-top-color: var(--line); }

/* Fields */
.tool-field__label { color: var(--tx); }
.tool-field__count { font-family: var(--f-body); font-size: 12px; font-weight: 500; color: var(--muted); }
.tool-field__wrap { min-height: 50px; border: 1.5px solid var(--line); border-radius: 12px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.tool-field__wrap:hover { border-color: #D3D3CB; }
.tool-field__wrap:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(46,110,118,.14); background: #fff; }
.tool-field__wrap input, .tool-field__wrap textarea, .tool-field__wrap select { color: var(--tx); font-size: 16px; }
.tool-field__wrap select { cursor: pointer; }
.tool-field__prefix, .tool-field__suffix { background: var(--bg-soft); font-family: var(--f-body); font-weight: 600; color: var(--tx-2); }
.tool-field__req, .tool-field__opt { font: 600 11px/1 var(--f-body); letter-spacing: .02em; text-transform: none; padding: 4px 8px; }
.tool-field__req { color: var(--accent); border-color: rgba(46,110,118,.35); background: var(--accent-soft); }
.tool-field__opt { color: var(--muted); background: var(--bg-soft); }
.tool-check-row { color: var(--tx-2); font-size: 14px; }
.tool-check-row strong { color: var(--tx); }
.tool-check-row input { accent-color: var(--accent); width: 18px; height: 18px; }

/* Meters */
.tool-meter { height: 6px; background: var(--line); }
.tool-meter__fill.is-good { background: var(--accent); }
.tool-meter__fill.is-short { background: var(--mint); }

/* Segmented toggles */
.tool-toggle { border: 1.5px solid var(--line); border-radius: 12px; background: #fff; }
.tool-toggle__btn { min-height: 44px; background: #fff; color: var(--tx-2); font-weight: 600; transition: background-color .2s, color .2s; }
.tool-toggle__btn + .tool-toggle__btn { border-left-color: var(--line); }
.tool-toggle__btn:hover { color: var(--accent); }
.tool-toggle__btn.is-active { background: var(--tx); color: #fff; }

/* Single-field forms (domain, redirect) */
.tool-form { padding: 8px; border-radius: 999px; background: #fff; border: 1.5px solid var(--line); box-shadow: var(--shadow); }
.tool-form:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(46,110,118,.14), var(--shadow); }
.tool-form__input { color: var(--tx); min-height: 48px; }
.tool-form__hint { padding-left: 22px; color: var(--muted); font-size: 14px; }
@media (max-width: 560px) { .tool-form { border-radius: var(--r); } .tool-form__hint { padding-left: 4px; } }

/* Output + checks */
.tool-output__code { background: var(--panel); color: #E6F1F2; border-radius: 16px; font-size: 13px; padding: 20px 22px; }
.tool-output__code.is-ready { color: var(--mint); }
.tool-checks { gap: 10px; }
.tool-check { color: var(--tx); font-size: 14.5px; }
.tool-check span { width: 20px; height: 20px; }
.tool-check.is-ok span { background: var(--accent); }
.tool-check.is-warn { color: var(--tx-2); }
.tool-out { margin-top: 28px; }
.tool-out__summary { font: 700 20px/1.3 var(--f-head); letter-spacing: -.015em; color: var(--tx); }
.tool-out__note { color: var(--muted); font-size: 13.5px; }
.tool-out__error { border-radius: 14px; border-color: #F0D5CE; border-left-width: 4px; background: #FFF7F5; color: var(--tx); }

/* ROI / stat grids */
.roi-grid { gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.roi-cell { background: #fff; padding: 16px 18px; }
.roi-cell dt { color: var(--muted); font-size: 13px; }
.roi-cell dd { font: 700 21px/1.2 var(--f-head); letter-spacing: -.02em; color: var(--tx); }
.roi-headline { border-bottom-color: var(--line); }
.roi-headline__num { font-family: var(--f-head); color: var(--tx); letter-spacing: -.04em; }
.roi-headline__label { font: 600 12px/1.2 var(--f-body); letter-spacing: .08em; }
.roi-verdict { color: var(--tx-2); }
.tool-panel--result.is-good .roi-headline__num { color: var(--accent); }

/* SERP preview */
.serp { border-radius: 16px; border-color: var(--line); box-shadow: var(--shadow-sm); padding: 20px 22px; }

/* Keyword density rows */
.kd-row { border-radius: 10px; padding: 9px 12px; }
.kd-row:nth-child(odd) { background: #fff; }
.kd-row__bar { background: var(--line); }
.kd-row__bar span { background: var(--accent); }
.kd-row__num, .kd-row__pct { font-family: var(--f-body); font-variant-numeric: tabular-nums; }
.kd-target { border-radius: 12px; background: #fff; border-color: var(--line); border-left-width: 4px; }
.kd-target.is-ok { border-left-color: var(--accent); }

/* Word counter limits */
.wc-limits { gap: 12px; }
.wc-limit { color: var(--tx); font-size: 14px; }
.wc-limit__bar { background: var(--line); }
.wc-limit__bar span { background: var(--accent); }
.wc-limit__num { font-family: var(--f-body); font-variant-numeric: tabular-nums; }

/* Schema FAQ rows */
.sc-faq { border-radius: 16px; border-color: var(--line); background: #fff; }
.sc-faq__remove { font: 600 12px/1 var(--f-body); letter-spacing: 0; text-transform: none; min-height: 32px; padding: 0 6px; }

/* Redirect hops */
.rc-list { gap: 10px; }
.rc-hop { border-radius: 14px; border-color: var(--line); border-left-width: 4px; background: #fff; }
.rc-hop--ok { border-left-color: var(--accent); }
.rc-hop__no { background: var(--bg-soft); border-color: var(--line); font-family: var(--f-body); }
.rc-hop__url { font-size: 13.5px; color: var(--tx); }
.rc-head { border-radius: 8px; background: var(--bg-soft); border-color: var(--line); }
.rc-hop__status { font-family: var(--f-head); }
.rc-hop--ok .rc-hop__status { color: var(--accent); }

/* Domain results */
.dom-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.dom-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; padding: 14px 18px;
  border-radius: 14px; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--line);
}
.dom-row__name { min-width: 0; overflow-wrap: anywhere; font: 600 16px/1.3 var(--f-head); color: var(--tx); }
.dom-row__state { flex: none; padding: 5px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 600; background: var(--bg-soft); color: var(--muted); }
.dom-row--available { border-left-color: var(--accent); }
.dom-row--available .dom-row__state { background: var(--accent-soft); color: var(--accent-2); }
.dom-row--taken .dom-row__name { color: var(--muted); }
.dom-row--taken .dom-row__state { background: #F6EEEC; color: #8A3B2A; }
@media (max-width: 560px) { .dom-list { grid-template-columns: minmax(0, 1fr); } }

/* Tools hub cards */
.tools-grid { gap: 18px; }
.tool-card { border-radius: var(--r); border-color: var(--line); background: #fff; padding: 28px; }
.tool-card:hover { border-color: #CFE3E6; box-shadow: var(--shadow); transform: translateY(-4px); }
.tool-card__ico { background: var(--accent-soft); border-color: #D2E8EB; border-radius: 14px; }
.tool-card:hover .tool-card__ico { background: var(--accent-soft); }
.tool-card__tag { color: var(--accent-2); background: #fff; border-color: var(--line); }
.tool-card__title { color: var(--tx); font-weight: 700; letter-spacing: -.015em; }
.tool-card__cta { color: var(--accent); display: inline-flex; align-items: center; gap: 6px; }

/* Hand-written CTA band on tool pages: the glass button sits on the teal card */
.h2-final .v2-btn--glass { border-color: rgba(255,255,255,.45); }

/* --------------------------------------------------------------------------
   Small screens
   -------------------------------------------------------------------------- */
@media (max-width: 560px) {
  .pg2 .cn-search { padding-left: 14px; }
  .pg2 .cn-search .v2-btn { width: auto; }
  .pg2 .hub-jump a { width: auto; }
  .cn-nf__links .v2-btn { flex: 1 1 100%; }
  .pg2 .hub-jump a { flex: 1 1 auto; justify-content: center; }
  .cn-fix__link { padding: 16px 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .cn-svc__card, .cn-fix__link, .pg2 .hub-jump a, .tool-card { transition: none; }
  .cn-svc__card:hover, .cn-fix__link:hover, .pg2 .hub-jump a:hover, .tool-card:hover { transform: none; }
}

/* ==========================================================================
   ROUND 2: tone rhythm (white / soft / tint / teal / dark), full width
   layouts and the dark variants of every cn- component used in a teal or
   dark section.
   ========================================================================== */

/* ----- Shared two column block: heading left, copy right ----- */
.cn-guide__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 6vw, 96px); align-items: start; }
.cn-guide__grid > * { grid-column: 2; }
.cn-guide__grid > .cn-guide__head { grid-column: 1; grid-row: 1 / span 4; position: sticky; top: 110px; }
.cn-guide__head .v2-h2 { font-size: clamp(30px, 3.4vw, 46px); }
.cn-guide__grid .v2-prose, .cn-guide__grid .cn-note { max-width: 70ch; margin-top: 0; }
.cn-guide__grid .cn-note { margin-top: 8px; }
@media (max-width: 900px) {
  .cn-guide__grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .cn-guide__grid > *, .cn-guide__grid > .cn-guide__head { grid-column: 1; grid-row: auto; position: static; }
}

/* Tool pages: the tool sits on warm off-white, panels stay white */
.tool-page.v2-sec--soft .tool-panel--result { background: var(--bg-tint); border-color: #D6EAEC; }
.tool-page.v2-sec--soft .roi-cell, .tool-page.v2-sec--soft .kd-row:nth-child(odd) { background: #fff; }
.tool-page#use-tool > .v2-narrow { max-width: calc(1080px + var(--gut) * 2); }

/* ----- Prose, notes and links inside teal / dark ----- */
:is(.v2-sec--teal, .v2-sec--dark) .v2-prose { color: rgba(233,238,239,.82); }
:is(.v2-sec--teal, .v2-sec--dark) .v2-prose :is(h2, h3, h4, strong) { color: #fff; }
:is(.v2-sec--teal, .v2-sec--dark) .v2-prose a,
:is(.v2-sec--teal, .v2-sec--dark) .cn-note a,
.cn-band a:not(.v2-btn) { color: var(--mint); text-decoration: underline; text-underline-offset: 3px; }
:is(.v2-sec--teal, .v2-sec--dark) .v2-prose li::marker { color: var(--mint); }
:is(.v2-sec--teal, .v2-sec--dark) .v2-prose code { background: rgba(255,255,255,.1); color: #fff; }
:is(.v2-sec--teal, .v2-sec--dark) .cn-note { color: rgba(233,238,239,.75); }
:is(.v2-sec--teal, .v2-sec--dark) .v2-checks li { color: rgba(233,238,239,.85); }
:is(.v2-sec--teal, .v2-sec--dark) .v2-checks .v2-ic { color: var(--mint); }

/* ----- Service cards on teal / dark ----- */
:is(.v2-sec--teal, .v2-sec--dark) .cn-svc__card { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); color: #fff; }
:is(.v2-sec--teal, .v2-sec--dark) .cn-svc__card:hover { background: rgba(255,255,255,.08); border-color: rgba(159,210,217,.4); box-shadow: none; }
:is(.v2-sec--teal, .v2-sec--dark) .cn-svc__ic { background: rgba(159,210,217,.14); color: var(--mint); }
:is(.v2-sec--teal, .v2-sec--dark) .cn-svc__text { color: rgba(233,238,239,.75); }
:is(.v2-sec--teal, .v2-sec--dark) .cn-svc__more { color: var(--mint); }
.cn-svc__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1000px) { .cn-svc__grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .cn-svc__grid--3 { grid-template-columns: minmax(0, 1fr); } }

/* ----- Tool cards on teal / dark ----- */
:is(.v2-sec--teal, .v2-sec--dark) .tool-card:hover { background: rgba(255,255,255,.08); border-color: rgba(159,210,217,.4); box-shadow: none; }
:is(.v2-sec--teal, .v2-sec--dark) .tool-card__ico { background: var(--accent-soft); border-color: transparent; }
:is(.v2-sec--teal, .v2-sec--dark) .tool-card__tag { background: transparent; border-color: rgba(255,255,255,.2); color: var(--mint); }
:is(.v2-sec--teal, .v2-sec--dark) .tool-card__title { color: #fff; }
:is(.v2-sec--teal, .v2-sec--dark) .tool-card__text { color: rgba(233,238,239,.75); }
:is(.v2-sec--teal, .v2-sec--dark) .tool-card__cta { color: var(--mint); }

/* ----- Article cards on teal / dark ----- */
:is(.v2-sec--teal, .v2-sec--dark) .h2-ins__card { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); }
:is(.v2-sec--teal, .v2-sec--dark) .h2-ins__card:hover { box-shadow: none; border-color: rgba(159,210,217,.4); }
:is(.v2-sec--teal, .v2-sec--dark) :is(.h2-ins__meta, .h2-ins__more) { color: var(--mint); }
:is(.v2-sec--teal, .v2-sec--dark) .h2-ins__body h3 { color: #fff; }
:is(.v2-sec--teal, .v2-sec--dark) .bl-excerpt { color: rgba(233,238,239,.72); }

/* ----- Blog: topics we cover (dark) ----- */
.cn-topics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.cn-topic { display: flex; flex-direction: column; gap: 12px; padding: 28px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); }
.cn-topic__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cn-topic__ic { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--accent-soft); color: var(--accent); }
.cn-topic__ic .v2-ic { width: 22px; height: 22px; }
.cn-topic__count { font-size: 13px; font-weight: 600; color: var(--muted); }
.cn-topic h3 { font: 700 21px/1.25 var(--f-head); letter-spacing: -.02em; color: var(--tx); }
.cn-topic p { font-size: 15.5px; line-height: 1.6; color: var(--muted); }
.cn-topic__links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 10px; }
.cn-topic__links a { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 8px 14px; border-radius: 999px; border: 1.5px solid var(--line); font-size: 14px; font-weight: 600; color: var(--tx); transition: border-color .2s, color .2s, background-color .2s; }
.cn-topic__links a:hover { border-color: var(--accent); color: var(--accent); }
.cn-topic__links a.is-archive { background: var(--accent); border-color: var(--accent); color: #fff; }
:is(.v2-sec--teal, .v2-sec--dark) .cn-topic { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); }
:is(.v2-sec--teal, .v2-sec--dark) .cn-topic__ic { background: rgba(159,210,217,.14); color: var(--mint); }
:is(.v2-sec--teal, .v2-sec--dark) .cn-topic__count { color: rgba(233,238,239,.6); }
:is(.v2-sec--teal, .v2-sec--dark) .cn-topic p { color: rgba(233,238,239,.75); }
:is(.v2-sec--teal, .v2-sec--dark) .cn-topic__links a { border-color: rgba(255,255,255,.22); color: #fff; }
:is(.v2-sec--teal, .v2-sec--dark) .cn-topic__links a:hover { border-color: var(--mint); color: var(--mint); }
:is(.v2-sec--teal, .v2-sec--dark) .cn-topic__links a.is-archive { background: var(--mint); border-color: var(--mint); color: #0F1416; }
@media (max-width: 1000px) { .cn-topics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .cn-topics { grid-template-columns: minmax(0, 1fr); } .cn-topic { padding: 24px; } }

/* ----- Numbered points (blog standards, tools how-to) ----- */
ol.cn-points { list-style: none; margin: 0; padding: 0; }
.cn-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.cn-point { display: flex; gap: 16px; align-items: flex-start; padding: 24px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); }
.cn-point__no { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--accent); color: #fff; font: 700 14px/1 var(--f-head); }
.cn-point h3 { margin-bottom: 6px; font: 700 18px/1.3 var(--f-head); letter-spacing: -.015em; color: var(--tx); }
.cn-point p { font-size: 15.5px; line-height: 1.6; color: var(--muted); }
.cn-points + .cn-note { max-width: 70ch; }
.v2-sec--soft .cn-point, .v2-sec--tint .cn-point { border-color: #DCE9EA; }
@media (max-width: 760px) { .cn-points { grid-template-columns: minmax(0, 1fr); } }

/* ----- Legal: three columns on wide screens, help band ----- */
.cn-lg { grid-template-columns: 260px minmax(0, 1fr) 280px; }
.cn-lg .lg__body { max-width: none; }
.cn-lg .lg__section p, .cn-lg .lg__intro { max-width: 70ch; }
.cn-lg__aside { position: sticky; top: 100px; }
.cn-lg__card { padding: 22px; border-radius: var(--r); background: var(--bg-tint); border: 1px solid #D6EAEC; }
.cn-lg__label { margin-bottom: 14px !important; font: 600 15px/1 var(--f-head); color: var(--tx); }
.cn-lg__card dl { display: grid; gap: 0; }
.cn-lg__card dl > div { padding: 12px 0; border-top: 1px solid #D6EAEC; }
.cn-lg__card dt { font-size: 12.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.cn-lg__card dd { margin: 4px 0 0; font-size: 15px; color: var(--tx); overflow-wrap: anywhere; }
.cn-lg__card dd a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1200px) { .cn-lg { grid-template-columns: 240px minmax(0, 1fr); } .cn-lg__aside { display: none; } }
@media (max-width: 900px) { .cn-lg { grid-template-columns: minmax(0, 1fr); } }

.cn-band__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(24px, 5vw, 72px); align-items: center; }
.cn-band__grid .v2-h2 { font-size: clamp(30px, 3.6vw, 48px); margin-bottom: 14px; }
.cn-band__grid .v2-lead { max-width: 60ch; }
.cn-band__actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; }
@media (max-width: 860px) { .cn-band__grid { grid-template-columns: minmax(0, 1fr); } .cn-band__actions { justify-content: flex-start; } }

/* ----- Search: use the full width ----- */
.v2-wrap.sr { max-width: calc(var(--wrap) + var(--gut) * 2); }
.sr .sr__empty { max-width: 860px; }
@media (min-width: 900px) { .sr__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.v2-sec--soft .sr__hit { background: #fff; }
.v2-sec--soft .sr__group-title span { background: #fff; }

/* ----- 404 + search quick links on teal ----- */
.cn-quick { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.cn-quick a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 18px; border-radius: 999px; border: 1.5px solid var(--line); font-size: 14.5px; font-weight: 600; color: var(--tx); transition: border-color .2s, color .2s; }
.cn-quick a:hover { border-color: var(--accent); color: var(--accent); }
:is(.v2-sec--teal, .v2-sec--dark) .cn-quick a { border-color: rgba(255,255,255,.25); color: #fff; }
:is(.v2-sec--teal, .v2-sec--dark) .cn-quick a:hover { border-color: var(--mint); color: var(--mint); }

/* ----- Post related-services card on warm off-white ----- */
.v2-sec--soft .cn-fix__card { background: #fff; border-color: var(--line); }
.v2-sec--soft .cn-fix__link { background: var(--bg-soft); }

@media (prefers-reduced-motion: reduce) {
  .cn-topic__links a, .cn-quick a { transition: none; }
}