/* ABDECOACH — Base web premium 2026
   Tipografías de producción recomendadas: GT Sectra + Söhne (pendientes de licencia).
   En uso ahora: Newsreader + Inter, autoalojadas (self-hosted), subset "latin" (cubre ES/EN).
*/

/* === Tipografía de marca — bloque reemplazable ===
   Para sustituir por GT Sectra (Display) + Söhne (Texto) cuando se licencien:
   solo cambiar los 3 @font-face de abajo y los archivos en assets/fonts/.
   Los nombres de las custom properties --serif/--sans no cambian, así que
   ningún otro selector de este archivo necesita tocarse. */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/newsreader-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/inter-600.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* === fin bloque de tipografía === */

:root {
  --ink: #1A1A18;
  --bone: #F5F0E8;
  --stone: #8C857B;
  --ochre: #B8763E;
  --olive: #4D5240;
  --white: #FFFFFF;
  --line: rgba(26,26,24,.16);
  --max: 1240px;
  --reading: 72ch;
  --serif: Newsreader, "Iowan Old Style", Baskerville, "Times New Roman", serif;
  --sans: Inter, "Helvetica Neue", Arial, sans-serif;
  --shadow: 0 18px 50px rgba(26,26,24,.08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bone); }
body { margin:0; background:var(--bone); color:var(--ink); font-family:var(--sans); font-size:clamp(16px,1.1vw,18px); line-height:1.68; text-rendering:optimizeLegibility; }
body.menu-open { overflow:hidden; }
a { color:inherit; text-decoration-thickness:1px; text-underline-offset:.23em; }
a:hover { text-decoration-color:var(--ochre); }
img,svg { max-width:100%; display:block; }
button,input,textarea,select { font:inherit; }
button { color:inherit; }
:focus-visible { outline:3px solid var(--ochre); outline-offset:4px; }
::selection { background:rgba(184,118,62,.22); }
.skip-link { position:fixed; left:1rem; top:-6rem; z-index:9999; background:var(--ink); color:var(--bone); padding:.75rem 1rem; }
.skip-link:focus { top:1rem; }
.progress { position:fixed; inset:0 auto auto 0; width:0; height:2px; background:var(--ochre); z-index:3000; }
.container { width:min(calc(100% - 2.4rem),var(--max)); margin-inline:auto; }
.reading { max-width:var(--reading); }
.eyebrow { margin:0 0 1rem; color:var(--stone); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; font-weight:600; }
.display { font-family:var(--serif); font-weight:400; letter-spacing:-.025em; line-height:.98; }
.h1 { font-size:clamp(3.2rem,8.2vw,7.7rem); margin:0; max-width:12ch; }
.h2 { font-size:clamp(2.45rem,5vw,5.3rem); margin:0 0 1.4rem; max-width:15ch; }
.h3 { font-family:var(--serif); font-weight:400; font-size:clamp(1.6rem,2.5vw,2.35rem); line-height:1.12; margin:0 0 .7rem; }
.lead { font-size:clamp(1.15rem,1.7vw,1.48rem); line-height:1.55; max-width:68ch; }
.muted { color:var(--stone); }
.rule { border:0; border-top:1px solid var(--line); margin:0; }
.section { padding:clamp(5rem,10vw,10rem) 0; border-top:1px solid var(--line); }
.section-tight { padding:clamp(3.5rem,7vw,6rem) 0; }
.grid-2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(2.5rem,6vw,7rem); align-items:start; }
.grid-3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.grid-4 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.card { display:block; background:var(--bone); color:var(--ink); padding:clamp(1.5rem,3vw,2.8rem); min-height:100%; text-decoration:none; }
.card h3 a { text-decoration:none; color:inherit; }
.card h3 a:hover { text-decoration:underline; text-decoration-color:var(--ochre); text-underline-offset:.18em; }
.card .number { font-family:var(--serif); color:var(--ochre); font-size:1.5rem; margin-bottom:2rem; }
.card p:last-child { margin-bottom:0; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.82rem 1.2rem; border:1px solid var(--ink); text-decoration:none; background:transparent; cursor:pointer; transition:background .2s,color .2s,transform .2s; }
.button:hover { background:var(--ink); color:var(--bone); transform:translateY(-1px); text-decoration:none; }
.button-dark { background:var(--ink); color:var(--bone); }
.button-dark:hover { background:var(--ochre); color:var(--ink); border-color:var(--ochre); }
.button-quiet { border-color:var(--line); }
.button-row { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
/* backdrop-filter vive en un ::before, no en .site-header directamente: en
   .site-header crearia un containing block nuevo para descendientes con
   position:fixed (incl. .nav en movil), rompiendo el overlay de pantalla
   completa del menu movil (quedaba recortado a la altura de la cabecera). */
.site-header { position:sticky; top:0; z-index:1000; border-bottom:1px solid var(--line); }
.site-header::before { content:""; position:absolute; inset:0; z-index:-1; backdrop-filter:blur(14px); background:rgba(245,240,232,.92); }
.header-inner { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.logo { font-family:var(--serif); font-size:1.55rem; letter-spacing:.02em; text-decoration:none; }
.logo small { display:block; font-family:var(--sans); color:var(--stone); font-size:.55rem; line-height:1; letter-spacing:.16em; text-transform:lowercase; margin-top:.2rem; }
.nav { display:block; font-size:.9rem; }
.nav-list { list-style:none; display:flex; align-items:center; gap:1.5rem; margin:0; padding:0; }
.nav-list li { margin:0; padding:0; }
.nav a { text-decoration:none; padding:.5rem 0; }
.nav a[aria-current="page"] { border-bottom:1px solid var(--ochre); }
.menu-toggle { display:none; background:none; border:1px solid var(--line); min-width:48px; min-height:48px; }
.language-switch { display:inline-flex; align-items:center; gap:.42rem; margin-left:.2rem; padding-left:1.1rem; border-left:1px solid var(--line); font-size:.72rem; letter-spacing:.12em; }
.language-switch a { color:var(--stone); padding:.2rem 0; }
.language-switch a.active { color:var(--ink); border-bottom:1px solid var(--ochre); }
.language-switch span { color:var(--stone); }
.hero { min-height:calc(100vh - 78px); display:grid; align-items:end; padding:clamp(4rem,8vw,7rem) 0 2.5rem; overflow:hidden; position:relative; }
.hero::after { content:""; position:absolute; right:-8vw; top:7vh; width:min(42vw,620px); aspect-ratio:1; border:1px solid var(--line); border-radius:50%; opacity:.6; }
.hero-layout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.5fr); gap:5vw; align-items:end; position:relative; z-index:1; }
.hero-side { border-left:1px solid var(--line); padding-left:2rem; }
/* Portada real del libro — sin marco 3D, sin sombra ni degradado añadidos;
   solo el borde fino ya usado en tarjetas/avisos en el resto del sitio. */
.book-cover { display:block; width:100%; height:auto; max-width:340px; border:1px solid var(--line); margin-left:auto; }
.book-cover-small { max-width:180px; margin-bottom:1.6rem; }
.hero-side p { margin-top:0; }
.hero-bottom { margin-top:clamp(4rem,10vh,8rem); padding-top:1.2rem; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:2rem; color:var(--stone); font-size:.83rem; letter-spacing:.06em; text-transform:uppercase; }
.statement { background:var(--ink); color:var(--bone); }
.statement .display { max-width:17ch; }
.statement .accent { color:#d6b28f; }
.program-card { position:relative; overflow:hidden; }
.program-card::after { content:""; position:absolute; left:0; bottom:0; width:0; height:3px; background:var(--ochre); transition:width .25s; }
.program-card:hover::after { width:100%; }
.program-card a { text-decoration:none; }
.program-meta { display:flex; gap:1rem; flex-wrap:wrap; margin-top:1.4rem; color:var(--stone); font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; }
.method { counter-reset:maps; }
.method-step { display:grid; grid-template-columns:90px minmax(0,1fr); gap:clamp(1.5rem,4vw,4rem); padding:2.5rem 0; border-top:1px solid var(--line); }
.method-step::before { counter-increment:maps; content:"0" counter(maps); font-family:var(--serif); font-size:2.3rem; color:var(--ochre); }
.quote { font-family:var(--serif); font-size:clamp(2rem,4.2vw,4.5rem); line-height:1.08; max-width:18ch; margin:0; }
.context-strip { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); }
.context-strip > div { padding:1.5rem; border-right:1px solid var(--line); }
.context-strip > div:last-child { border-right:0; }
.context-strip strong { display:block; font-family:var(--serif); font-size:1.35rem; font-weight:400; }
.timeline { border-left:1px solid var(--line); margin-left:.45rem; padding-left:2rem; }
.timeline-item { position:relative; padding:0 0 2.5rem; }
.timeline-item::before { content:""; position:absolute; width:.65rem; height:.65rem; border-radius:50%; background:var(--bone); border:1px solid var(--ochre); left:-2.36rem; top:.4rem; }
.metric { font-family:var(--serif); font-size:clamp(2.4rem,4vw,4.2rem); line-height:1; }
.form { display:grid; gap:1.2rem; }
.form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.field label { display:block; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--stone); margin-bottom:.45rem; }
.field input,.field textarea,.field select { width:100%; border:1px solid var(--line); background:rgba(255,255,255,.34); padding:.9rem; min-height:48px; color:var(--ink); border-radius:0; }
.field textarea { min-height:150px; resize:vertical; }
.field-note { font-size:.82rem; color:var(--stone); }
.recommendation { margin-top:1rem; border-left:3px solid var(--ochre); padding:1rem 1.2rem; background:rgba(255,255,255,.35); }
.faq details { border-top:1px solid var(--line); padding:1.3rem 0; }
.faq details:last-child { border-bottom:1px solid var(--line); }
.faq summary { cursor:pointer; font-family:var(--serif); font-size:1.45rem; list-style:none; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:"+"; float:right; font-family:var(--sans); color:var(--ochre); }
.faq details[open] summary::after { content:"−"; }
.article-list article { display:grid; grid-template-columns:150px minmax(0,1fr) auto; gap:2rem; padding:1.5rem 0; border-top:1px solid var(--line); align-items:baseline; }
.article-list article:last-child { border-bottom:1px solid var(--line); }
.article-list h3 { font-family:var(--serif); font-weight:400; font-size:1.8rem; margin:0; }
.page-hero { padding:clamp(6rem,11vw,11rem) 0 clamp(4rem,8vw,7rem); }
.page-hero .h1 { max-width:15ch; }
.kpi { border-top:1px solid var(--line); padding-top:1rem; }
.kpi strong { display:block; font-family:var(--serif); font-size:2.2rem; font-weight:400; }
.notice { padding:1.3rem; border:1px solid var(--line); background:rgba(255,255,255,.25); }
.site-footer { background:var(--ink); color:var(--bone); padding:clamp(4rem,8vw,7rem) 0 2rem; }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:4rem; }
.footer-title { font-family:var(--serif); font-size:clamp(2.2rem,4vw,4.2rem); max-width:11ch; line-height:1.05; margin:0; }
.footer-nav,.footer-links { display:grid; gap:.65rem; }
.footer-links { list-style:none; margin:0; padding:0; }
.footer-nav a { color:var(--bone); text-decoration:none; }
.footer-bottom { display:flex; justify-content:space-between; gap:2rem; border-top:1px solid rgba(245,240,232,.18); margin-top:4rem; padding-top:1.4rem; color:#bdb6ab; font-size:.78rem; }
/* Área táctil de 44px sin alterar el espaciado visual: relleno compensado
   con margen negativo, técnica estándar de accesibilidad para enlaces de
   texto pequeño (aviso legal/privacidad/cookies). */
.footer-bottom a { display:inline-block; padding:.85rem .2rem; margin:-.85rem -.2rem; }
.legal { max-width:80ch; }
.legal h2 { font-family:var(--serif); font-weight:400; margin-top:2.7rem; }

/* === Sistema visual global — ampliación (sesión 10) ===
   Escala tipográfica: eyebrow/h3/h2/h1/display ya definidos arriba (líneas 60-72).
   Se añade aquí: cuerpo pequeño, enlaces editoriales, tarjetas de artículo,
   bloque CTA, bloque "teaser" (para contenido con fuente pendiente),
   lista de situaciones y estados de navegación/foco adicionales. */

.small { font-size:.85rem; line-height:1.6; color:var(--stone); }

/* Enlaces dentro de texto largo: borde inferior en Ocre, nunca subrayado plano
   (BRAND_SYSTEM.md §6: "subrayado prohibido, usar borde inferior u Ocre"). */
.reading a,.article-body a { text-decoration:underline; text-decoration-color:var(--ochre); text-decoration-thickness:1px; text-underline-offset:.2em; }
.reading a:hover,.article-body a:hover { text-decoration-color:var(--ink); }

.nav a:hover { border-bottom:1px solid var(--line); }

/* Tarjeta editorial (Pensamiento/Insights) */
.article-card { display:block; padding:1.8rem 0; border-top:1px solid var(--line); text-decoration:none; color:inherit; }
.article-card:last-child { border-bottom:1px solid var(--line); }
.article-card h3 { font-family:var(--serif); font-weight:400; font-size:clamp(1.4rem,2.2vw,1.9rem); margin:0 0 .5rem; }
.article-card p { margin:0; color:var(--stone); }
.article-card:hover h3 { text-decoration:underline; text-decoration-color:var(--ochre); text-underline-offset:.18em; }
.article-list-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:0 3rem; }

/* Bloque CTA (inversión de color, editorial no "banner") */
.cta-block { background:var(--ink); color:var(--bone); padding:clamp(3.5rem,8vw,6.5rem) 0; }
.cta-block .display { max-width:19ch; }
.cta-block .lead { color:#d8d3c8; }
.cta-block .button { border-color:rgba(245,240,232,.4); color:var(--bone); }
.cta-block .button:hover { background:var(--bone); color:var(--ink); }
.cta-block .button-dark { background:var(--bone); color:var(--ink); border-color:var(--bone); }
.cta-block .button-dark:hover { background:var(--ochre); color:var(--ink); border-color:var(--ochre); }

/* Bloque "teaser": contenido real pero deliberadamente mínimo — sin
   inventar detalle no recibido (5P, libro). Ver CLAUDE.md: no fabricar. */
.teaser { border:1px solid var(--line); padding:clamp(1.8rem,4vw,3rem); }
.teaser .tag { display:inline-block; border:1px solid var(--line); padding:.3rem .7rem; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--stone); margin-bottom:1.2rem; }
.p-list { display:flex; flex-wrap:wrap; gap:.5rem 1.6rem; margin:1.4rem 0 0; padding:0; list-style:none; }
.p-list li { font-family:var(--serif); font-size:1.1rem; color:var(--ink); }

/* Lista de situaciones ejecutivas */
.situations { border-top:1px solid var(--line); }
.situations > div { display:grid; grid-template-columns:56px minmax(0,1fr); gap:1.6rem; padding:1.7rem 0; border-bottom:1px solid var(--line); align-items:baseline; }
.situations .n { font-family:var(--serif); color:var(--ochre); font-size:1.3rem; }
.situations p { margin:0; max-width:52ch; }

@media (max-width: 1000px) {
  .nav { position:fixed; inset:78px 0 0; background:var(--bone); padding:2rem 1.2rem; display:none; font-size:1.35rem; }
  .nav.open { display:block; }
  .nav-list { flex-direction:column; align-items:flex-start; }
  .language-switch { margin:1rem 0 0; padding:1rem 0 0; border-left:0; border-top:1px solid var(--line); width:100%; }
  .menu-toggle { display:block; }
  .hero-layout,.grid-2,.footer-grid { grid-template-columns:minmax(0,1fr); }
  .hero-side { border-left:0; border-top:1px solid var(--line); padding:1.5rem 0 0; }
  .grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .grid-3 { grid-template-columns:minmax(0,1fr); }
  .context-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .context-strip > div:nth-child(2) { border-right:0; }
  .context-strip > div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
}
@media (max-width: 680px) {
  .container { width:min(calc(100% - 1.4rem),var(--max)); }
  .h1 { font-size:clamp(3rem,17vw,5.2rem); }
  .grid-4,.context-strip,.form-row { grid-template-columns:minmax(0,1fr); }
  .context-strip > div { border-right:0; border-bottom:1px solid var(--line); }
  .context-strip > div:last-child { border-bottom:0; }
  .hero-bottom { flex-direction:column; }
  .method-step { grid-template-columns:56px minmax(0,1fr); }
  .article-list article { grid-template-columns:minmax(0,1fr); gap:.3rem; }
  .footer-bottom { flex-direction:column; }
  .situations > div { grid-template-columns:40px minmax(0,1fr); gap:1rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}
@media print {
  .site-header,.site-footer,.button-row,.progress { display:none; }
  body { background:white; color:black; }
  .section { break-inside:avoid; }
}