/* base.css — alias de tokens, reset, base y layout.
   SIN @layer a propósito: WordPress emite sus estilos globales sin capa y
   lo no-capado gana siempre a lo capado. La precedencia la da el orden:
   base → componentes → CSS de plantilla → utilidades.
   Regla: ningún valor de longitud literal fuera de la capa `tokens`
   (excepciones: 0, 100%, y los breakpoints documentados en componentes.css,
   porque @media/@container no aceptan var()). */

/* — reset — */
  *, *::before, *::after { box-sizing: border-box; }
  body, h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dd, figure, blockquote, fieldset, legend { margin: 0; }
  /* Gutenberg emite SIEMPRE <ul class="wp-block-list">: si se le quita la lista
     aquí, todo el contenido del cliente pierde viñetas y sangría. */
  ul[class]:not(.wp-block-list), ol[class]:not(.wp-block-list) { list-style: none; padding: 0; }
  .wp-block-list { padding-inline-start: 1.2em; }
  img, svg { display: block; max-inline-size: 100%; block-size: auto; }
  input, button, textarea, select { font: inherit; }
  fieldset { padding: 0; border: 0; }
  [hidden] { display: none !important; } /* !important justificado: el atributo hidden debe ganar a cualquier display de componente */
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms; animation-iteration-count: 1; transition-duration: 0.01ms; }
  }

/* — tokens — */
  :root {
    --color-primary: var(--wp--preset--color--primary);
    --color-primary-light: var(--wp--preset--color--primary-light);
    --color-primary-dark: var(--wp--preset--color--primary-dark);
    --color-accent: var(--wp--preset--color--accent);
    --color-accent-dark: var(--wp--preset--color--accent-dark);
    --color-accent-deep: var(--wp--preset--color--accent-deep);
    --color-background: var(--wp--preset--color--background);
    --color-surface: var(--wp--preset--color--surface);
    --color-muted: var(--wp--preset--color--muted);
    --color-foreground: var(--wp--preset--color--foreground);
    --color-foreground-light: var(--wp--preset--color--foreground-light);
    --color-border: var(--wp--preset--color--border);
    --color-on-dark-muted: var(--wp--preset--color--on-dark-muted);
    --color-success: var(--wp--preset--color--success);
    --color-error: var(--wp--preset--color--error);
    --text-xs: var(--wp--preset--font-size--xs);
    --text-s: var(--wp--preset--font-size--s);
    --text-m: var(--wp--preset--font-size--m);
    --text-l: var(--wp--preset--font-size--l);
    --text-xl: var(--wp--preset--font-size--xl);
    --text-2xl: var(--wp--preset--font-size--2-xl);
    --text-3xl: var(--wp--preset--font-size--3-xl);
    --text-4xl: var(--wp--preset--font-size--4-xl);
    --text-5xl: var(--wp--preset--font-size--5-xl);
    --space-3xs: var(--wp--preset--spacing--3-xs);
    --space-2xs: var(--wp--preset--spacing--2-xs);
    --space-xs: var(--wp--preset--spacing--xs);
    --space-s: var(--wp--preset--spacing--s);
    --space-m: var(--wp--preset--spacing--m);
    --space-l: var(--wp--preset--spacing--l);
    --space-xl: var(--wp--preset--spacing--xl);
    --space-m-l: var(--wp--custom--space--m-l);
    --space-l-xl: var(--wp--custom--space--l-xl);
    --section-space-m: var(--wp--custom--section--m);
    --section-space-l: var(--wp--custom--section--l);
    --radius-s: var(--wp--custom--radius--s);
    --radius-m: var(--wp--custom--radius--m);
    --radius-l: var(--wp--custom--radius--l);
    --radius-pill: var(--wp--custom--radius--pill);
    --border-hairline: var(--wp--custom--border--hairline);
    --border-control: var(--wp--custom--border--control);
    --border-accent-bar: var(--wp--custom--border--accent-bar);
    --tracking-tight: var(--wp--custom--tracking--tight);
    --tracking-heading: var(--wp--custom--tracking--heading);
    --tracking-label: var(--wp--custom--tracking--label);
    --tracking-meta: var(--wp--custom--tracking--meta);
    --measure-heading: var(--wp--custom--measure--heading);
    --measure-lede: var(--wp--custom--measure--lede);
    --measure-body: var(--wp--custom--measure--body);
    --target-min: var(--wp--custom--target--min);
    --logo-alto: var(--wp--custom--logo--alto);
    --hero-media-max: var(--wp--custom--hero--media-max);
    --logo-alto-pie: var(--wp--custom--logo--alto-pie);
    --focus-ring: var(--wp--custom--focus--ring);
    --focus-offset: var(--wp--custom--focus--offset);
    --col-s: var(--wp--custom--col--s);
    --col-m: var(--wp--custom--col--m);
    --content-size: var(--wp--style--global--content-size);
    --wide-size: var(--wp--style--global--wide-size);
  }

/* — base — */
  body {
    font-family: var(--wp--preset--font-family--primary);
    font-size: var(--text-m);
    line-height: 1.6;
    color: var(--color-foreground);
    background: var(--color-background);
    -webkit-text-size-adjust: 100%;
  }
  a { color: var(--color-primary); text-underline-offset: var(--space-3xs); }
  a:hover { color: var(--color-primary-light); }
  :focus-visible { outline: var(--focus-ring) solid var(--color-primary); outline-offset: var(--focus-offset); }
  h1, h2, h3, h4, h5, h6 { font-family: var(--wp--preset--font-family--heading); font-weight: 700; line-height: 1.15; text-wrap: balance; }
  h1 { font-size: var(--text-5xl); line-height: 1.05; letter-spacing: var(--tracking-tight); max-inline-size: var(--measure-heading); font-weight: 800; }
  h2 { font-size: var(--text-3xl); letter-spacing: var(--tracking-heading); max-inline-size: var(--wp--custom--measure--lede); }
  h3 { font-size: var(--text-l); line-height: 1.3; }
  p, li, dd { text-wrap: pretty; }
  /* El contenido de post vive en .entry-content, no en el envoltorio .flow:
     sin esta segunda mitad, legales y blog salen sin separación de párrafos. */
  .flow > * + *,
  .entry-content > * + * { margin-block-start: var(--space-s); }

/* — layout — */
  .envoltura { max-inline-size: var(--wide-size); margin-inline: auto; padding-inline: var(--space-s); }
  .envoltura--estrecha { max-inline-size: var(--content-size); }
  .seccion { padding-block: var(--section-space-m); }
  .seccion--amplia { padding-block: var(--section-space-l); } /* solo hero y CTA de cierre */
  .seccion--superficie { background: var(--color-surface); border-block: var(--border-hairline) solid var(--color-border); }
  .pila { display: flex; flex-direction: column; gap: var(--space-m); }
  .pila--compacta { gap: var(--space-2xs); }
  .contenedor { container-type: inline-size; }
  .rejilla { display: grid; gap: var(--space-s); grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--col-s)), 1fr)); }
  .rejilla--ancha { gap: var(--space-m-l); grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--col-m)), 1fr)); align-items: center; }