/* ═══════════════════════════════════════════════════════════════════
   PTS AI · la capa de marca (Brand Guidelines: 05 Color · 06 Typography · 03 Logo)
   La inyecta scripts/seo-ptsai.mjs en todas las páginas públicas, junto con
   Fraunces + IBM Plex Sans + IBM Plex Mono. Los colores ya viven en cada página
   (scripts/brand-recolor.mjs los pasó a la paleta); aquí va el sistema
   tipográfico y el tamaño del logo.

   Va temprano en el <head>, antes del CSS de cada página, así que gana por
   especificidad (html body …, :root:root), no por orden.
   ═══════════════════════════════════════════════════════════════════ */
:root:root{
  --pts-ink:#10202E; --pts-amber:#E08A2E; --pts-amber-d:#B8641A; --pts-ivory:#F4F1EA; --pts-blue:#2F5D7C; --pts-stone:#5E656C;
  --pts-serif:'Fraunces',Georgia,'Times New Roman',serif;
  --pts-sans:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --pts-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  /* los nombres que ya usan las páginas */
  --serif:var(--pts-serif); --sans:var(--pts-sans); --mono:var(--pts-mono);
}

/* BODY · Plex Sans Regular · 17 / 1.5 */
html body{font-family:var(--pts-sans);font-feature-settings:normal}
html body :is(input,textarea,select,button){font-family:inherit}

/* DISPLAY · H1 · H2 · Fraunces Regular, −1 %. H3 · Fraunces Medium */
html body :is(h1,h2,.h-hero,.h-sec){font-family:var(--pts-serif);font-weight:400;letter-spacing:-.01em;font-optical-sizing:auto}
html body :is(h3,.h-card){font-family:var(--pts-serif);font-weight:500;letter-spacing:-.005em}
/* "Bold Italic … reserved for the logo": la palabra en cursiva va Regular */
html body :is(h1,h2,h3,.h-hero,.h-sec) :is(em,i){font-family:var(--pts-serif);font-style:italic;font-weight:400}
/* una palabra en cursiva por titular: Amber sobre Ink, Dark amber sobre claro */
html body :is(h1,h2,.h-hero,.h-sec) em{color:var(--pts-amber)}
html body :is(.ivory,.light,.on-light) :is(h1,h2,h3) em{color:var(--pts-amber-d)}

/* LABEL · Plex Mono Medium · 12 · mayúsculas · +14 % */
html body :is(.eye,.kicker,.hero-eyebrow,.eyebrow,.engine-label,.proof-tag,.path-tag,.modu-label,.vd-k,.price,.k){
  font-family:var(--pts-mono);font-weight:500;letter-spacing:.14em;text-transform:uppercase}

/* DATA · Plex Mono Medium: horas, cifras y avisos del copiloto */
html body :is(.num,.snum,.band b,.band-g b,.pb-stat .num,.stat .num,.vd-timer,.vd-ev time,[data-count]){
  font-family:var(--pts-mono);font-weight:500;letter-spacing:-.02em}
html body .vd-status{font-family:var(--pts-mono);font-weight:500}

/* LOGO · completo ≥ 120 px de ancho (03 Logo · Minimum size), aire de 2x */
html body img.pts-logo{width:128px!important;height:auto!important;max-width:none;display:block}
html body img.pts-logo.sm{width:120px!important}
html body img.pts-symbol{height:32px!important;width:auto!important}

/* foco visible con el acento de la marca */
html body :focus-visible{outline:2px solid var(--pts-amber);outline-offset:2px}

/* ── UNA sola nota de Amber por pieza (05 Color: Amber 3 %) ──
   El acento queda para el botón principal y la palabra en cursiva.
   Las franjas de datos y avisos van en Blue ("Data and support"),
   con un solo punto ámbar. Las etiquetas, en tono tenue. */
html body .offerbar{background:var(--pts-blue);color:var(--pts-ivory)}
html body .offerbar :is(b,.say,a){color:var(--pts-ivory)}
html body .offerbar .say{opacity:.82}
html body .offerbar a{border-bottom-color:rgba(244,241,234,.5)}
html body .offerbar .dot{background:var(--pts-amber);animation:none}
html body .band{background:var(--pts-blue);color:var(--pts-ivory)}
html body .band :is(b,a,.band-cap,.cap2){color:var(--pts-ivory)}
html body .band span{color:rgba(244,241,234,.8)}
html body .band-cap{border-top-color:rgba(244,241,234,.25)}
html body :is(.eye,.kicker,.hero-eyebrow){color:rgba(244,241,234,.6)}
html body :is(.ivory,.light,.on-light) :is(.eye,.kicker){color:var(--pts-stone)}
html body :is(.free,.free-badge){color:var(--pts-ivory);background:rgba(244,241,234,.06);border-color:rgba(244,241,234,.18)}
html body .price-box .pb-1 b{color:var(--pts-ivory)}

/* el logo completo necesita 120 px: las barras de navegación crecen a 72 px para darle aire */
html body :is(.nav,.top) img.pts-logo{width:120px!important}
html body nav.nav{min-height:72px;height:auto}
html body .top > .w,html body .top > .in{min-height:72px}

/* "Una frase en serif, una palabra en cursiva": el subrayado resaltador sale,
   la palabra queda en cursiva y en Amber */
html body .mark{background:none;font-family:var(--pts-serif);font-style:italic;font-weight:400;color:var(--pts-amber);padding:0}