/* Expediente Claro — concepto « La Raíz ». Tierra oscura; la página baja como un sondeo: la pregunta, la siembra de la
   fecha, la foto de unas raíces reales (ficus de la Alameda Apodaca, Cádiz) que es la superficie del corte, y el corte
   del terreno, una capa por año. Las páginas interiores bajan a lo largo de una raíz. Martel (serif) + Hind (sans).
   Las fuentes se declaran en gabarits/base.html (direcciones con huella). */
:root{
  --aire:#17120e; --aire-2:#211a14; --hondo:#100c09; --semilla:#2a2119;
  --texto:#f3ece2; --texto-2:#d3c6b3; --texto-3:#b8a991;
  --brote:#a8e06f; --brote-tinta:#14230a;
  --raiz:#e0bd92;
  --t:"Martel",Georgia,"Times New Roman",serif;
  --s:"Hind","Segoe UI",Roboto,Arial,sans-serif;
  --m:clamp(18px,4vw,64px);
  --col-anos:calc(var(--m) + 96px); --col-raiz:150px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--aire);color:var(--texto);font:400 19px/1.55 var(--s)}
a{color:var(--raiz);text-underline-offset:3px}
a:hover{color:var(--texto)}
:focus-visible{outline:3px solid #fff;outline-offset:3px}
h1,h2,h3{font-family:var(--t);font-weight:900;line-height:1.15;margin:0;letter-spacing:-.005em}
h2{font-size:clamp(26px,2.6vw,36px)}
.oculto-visual{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:-9999px;top:0;background:#fff;color:#000;padding:10px 14px;z-index:9}
.saltar:focus{left:12px;top:12px}

/* cabecera */
.cab{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:4px 32px;padding:14px var(--m) 10px}
.marca{font-family:var(--t);font-weight:900;font-size:24px;color:var(--texto);text-decoration:none;line-height:1;min-height:44px;display:inline-flex;align-items:center;gap:10px}
.marca-raiz{width:18px;height:26px;fill:none;stroke:var(--brote);stroke-width:2.4;stroke-linecap:round}
.menu{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:0 22px}
.menu a{color:var(--texto-2);text-decoration:none;font-weight:500;font-size:17px;min-height:44px;display:inline-flex;align-items:center}
.menu a:hover{color:var(--texto);text-decoration:underline}
.menu a[aria-current=page]{color:var(--brote);box-shadow:inset 0 -3px 0 var(--brote)}
.indep{grid-column:1/-1;margin:0;font-size:16px;line-height:1.45;color:var(--texto-3)}

/* ---------- portada ---------- */
.cielo{padding:16px var(--m) 22px;display:grid;gap:12px}
.cielo h1{font-size:clamp(18px,1.6vw,22px);font-weight:700;color:var(--raiz);max-width:60ch}
.cielo .pregunta{font-size:clamp(30px,3.6vw,52px);max-width:22ch}
.hoy{margin:0;color:var(--texto-2);max-width:62ch}
.hoy strong,.hoy time{color:var(--texto)}
.cortes{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 28px}
.cortes li{display:grid;align-content:start;padding-left:14px;box-shadow:inset 3px 0 0 var(--brote)}
.cortes b{font-family:var(--t);font-weight:700;font-size:22px;line-height:1.2}
.cortes span{font-size:15px;color:var(--texto-2);line-height:1.35}

/* la siembra: la fecha se planta encima de la superficie */
.siembra{background:var(--semilla);padding:18px var(--m) 20px;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:10px 48px;align-items:end}
.siembra>h2{grid-column:1/-1;font-size:24px}
.raiz-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px 14px;align-items:end}
.campo{display:grid;gap:6px;min-width:0}
.campo label{font-weight:600;font-size:16px}
.ayuda{grid-column:1/-1;font-size:15px;color:var(--texto-3);line-height:1.4}
input,select{font:inherit;font-size:18px;color:var(--texto);background:#3a2e23;border:1px solid #8a7a66;border-radius:3px;min-height:48px;padding:8px 12px;width:100%;max-width:100%;min-width:0;color-scheme:dark}
.boton{font:600 18px/1 var(--s);background:var(--brote);color:var(--brote-tinta);border:0;border-radius:3px;min-height:48px;padding:12px 20px;cursor:pointer}
.boton:hover{background:#c0f08e}
.resultado{display:grid;gap:2px}
.resultado p{margin:0}
.res-ante{font-size:16px;color:var(--texto-2)}
.res-fecha{font-size:19px}
.res-fecha strong{display:block;font-family:var(--t);font-weight:900;font-size:clamp(26px,2.4vw,34px);line-height:1.15;color:var(--brote)}
.res-dias{font-size:17px}
.res-error{font-size:19px;font-weight:600;color:#ffb4a2}

/* la foto, superficie del corte (sin nada entre la foto y las capas) */
.superficie{margin:0;position:relative}
.superficie img{display:block;width:100%;height:clamp(120px,17vw,250px);object-fit:cover;object-position:50% 70%}
.credito{font-size:13px;line-height:1.4;color:var(--texto-3)}
.superficie .credito{position:absolute;right:var(--m);bottom:8px;color:#fff;background:rgba(16,12,9,.82);padding:2px 8px;max-width:calc(100% - 2 * var(--m))}
.superficie .credito a{color:#fff}

/* el corte: filas a todo lo ancho; columna de años, columna de la raíz, texto */
.estratos{padding:0 0 30px}
.superficie-linea{margin:0;padding:6px var(--m);font-size:15px;font-weight:600;color:var(--texto-2);background:var(--semilla);box-shadow:inset 0 3px 0 var(--brote)}
.corte{position:relative}
.raiz-svg{position:absolute;left:0;top:0;pointer-events:none;overflow:visible}
.capas{list-style:none;margin:0;padding:0}
.capas>li{display:grid;grid-template-columns:var(--col-anos) var(--col-raiz) minmax(0,1fr);align-items:center;padding:0 var(--m) 0 0}
.capa{min-height:46px;background:var(--tono)}
.capa-anos{padding-left:var(--m);font-size:15px;color:#efe3d0;font-variant-numeric:tabular-nums}
.capa-raiz{align-self:stretch}
.capa-nota{margin:0;font-weight:600;color:#fff;font-size:17px}
.capa-nota:empty{display:none}
.umbral{min-height:50px;background:#1a140f;box-shadow:inset 0 2px 0 rgba(255,255,255,.75);padding-top:6px!important;padding-bottom:6px!important}
.u-anos{padding-left:var(--m);font-family:var(--t);font-weight:700;font-size:18px;color:#fff}
.u-texto{grid-column:3;margin:0;font-size:16px;color:var(--texto-2);line-height:1.4}
.u-texto b{color:var(--texto);font-weight:600}
.u-tuyo{grid-column:3;margin:2px 0 0;font-family:var(--t);font-weight:700;font-size:18px;color:var(--brote)}
.u-tuyo:empty{display:none}
.umbral.mio{box-shadow:inset 0 3px 0 var(--brote)}
.umbral.mio .u-anos{color:var(--brote)}
.capa-fin{background:#130e0b;min-height:28px}
.capa-fin p{grid-column:3;margin:6px 0;font-weight:600;color:#fff}
.capa-fin p:empty{display:none}
.raiz{fill:none;stroke:var(--raiz);stroke-width:6;stroke-linecap:round}
.raiz.cumplida{stroke:var(--brote)}
.raicilla{fill:none;stroke:var(--raiz);stroke-width:2.4;stroke-linecap:round}
.raiz-pendiente{stroke:var(--raiz);stroke-width:3;stroke-dasharray:2 7;stroke-linecap:round}
.objetivo{fill:var(--aire);stroke:var(--brote);stroke-width:3}
.objetivo.lleno{fill:var(--brote)}
.punta{fill:var(--raiz)}
.corte-lee{margin:18px var(--m) 0;max-width:80ch;color:var(--texto-2);font-size:17px}
.rae{display:block;margin-bottom:6px;font-family:var(--t);font-size:18px;color:var(--texto)}
.limites{margin:14px var(--m) 0;max-width:80ch;display:grid;gap:8px;font-size:16px;color:var(--texto-2)}
.limites p{margin:0}
.res-fuente{font-size:15px;color:var(--texto-3)}

/* tasas: testigo de sondeo, grosor de cada capa = importe */
.tasas{background:var(--hondo);padding:48px var(--m) 40px;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:24px 56px;align-items:start}
.tasas-cab{display:grid;gap:14px;position:sticky;top:16px}
.tasas-cab p{margin:0;color:var(--texto-2)}
.busca{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 10px}
.busca label{grid-column:1/-1;font-weight:600;font-size:17px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font:500 16px var(--s);color:var(--texto);background:#3a2e23;border:0;border-radius:2px;min-height:44px;padding:8px 14px;cursor:pointer}
.chip:hover,.chip[aria-pressed=true]{background:var(--raiz);color:var(--hondo)}
.nucleo{list-style:none;margin:0;padding:0;display:grid}
.nucleo li{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:4px 18px;align-items:center;padding:4px 0}
.testigo{display:block;width:110px;background:linear-gradient(90deg,#7a5536,#5a3d26);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.nucleo li:nth-child(even) .testigo{background:linear-gradient(90deg,#8b6a4a,#68492f)}
.cortada .testigo{-webkit-mask:linear-gradient(#000 85%,transparent);mask:linear-gradient(#000 85%,transparent)}
.n-txt{font-size:17px;line-height:1.4}
.n-txt em{color:var(--texto-3)}
.l-cod{font-weight:600;color:var(--raiz);white-space:nowrap}
.l-imp{font-family:var(--t);font-weight:700;font-size:23px;white-space:nowrap}
.nucleo .l-vacio{display:block;color:var(--texto-2);padding:10px 0}
.aviso-validez{margin:0;font-weight:600;color:#ffc2b3;box-shadow:inset 3px 0 0 #ff8f73;padding-left:14px}
.validez{grid-column:1/-1;margin:0;font-size:15px;color:var(--texto-3);line-height:1.5;max-width:110ch}

/* lo que no hacemos y las demás páginas */
.lo-que-no{padding:40px var(--m) 8px}
.lo-que-no .articulo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 40px;max-width:none}
.lo-que-no h3{grid-row:1;font-size:21px;padding-top:12px;box-shadow:inset 0 3px 0 #7a5c3e}
.lo-que-no h3+p{grid-row:2;margin-top:6px}
.raices-pag{padding:32px var(--m) 10px}
.raices-pag ul{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 40px}
.raices-pag li{display:grid;gap:4px;padding-left:16px;box-shadow:inset 3px 0 0 var(--raiz)}
.raices-pag a{font-family:var(--t);font-weight:700;font-size:19px;line-height:1.25}
.raices-pag span{font-size:16px;color:var(--texto-2)}

/* ---------- páginas interiores: el texto baja a lo largo de una raíz ---------- */
.perfil{padding:20px var(--m) 18px;max-width:1100px}
.migas{margin:0 0 10px;font-size:16px;color:var(--texto-3)}
.perfil h1{font-size:clamp(30px,3.4vw,48px);max-width:24ch}
.bajada{margin:10px 0 0;font-size:20px;color:var(--texto-2);max-width:60ch}
.fecha{margin:10px 0 0;font-size:15px;color:var(--texto-3)}
.veta{margin:0;position:relative}
.veta img{display:block;width:100%;height:84px;object-fit:cover;object-position:50% 80%}
.veta .credito{padding:6px var(--m) 0}
.sondeo{--x:calc(var(--m) + 10px);position:relative;padding:26px var(--m) 30px calc(var(--x) + 40px);max-width:calc(940px + var(--m) * 2)}
.sondeo::before{content:"";position:absolute;left:var(--x);top:0;bottom:0;width:5px;border-radius:3px;background:linear-gradient(var(--raiz),#8b6a4a 60%,rgba(139,106,74,.15))}
.sondeo-legal::before{background:linear-gradient(#8b6a4a,rgba(139,106,74,.1))}
.articulo{max-width:72ch}
.sondeo .articulo h2{position:relative;font-size:clamp(24px,2.4vw,32px);margin:38px 0 12px}
.sondeo .articulo h2::before{content:"";position:absolute;left:calc(-40px + 2px);top:.55em;width:34px;height:16px;border:solid var(--raiz);border-width:0 0 3px 0;border-radius:0 0 0 30px;transform:skewY(18deg)}
.sondeo .articulo h3{font-size:22px;margin:26px 0 8px}
.articulo p,.articulo li{line-height:1.6}
.articulo ul,.articulo ol{padding-left:1.2em}
.articulo li{margin:6px 0}
.articulo strong{color:#fff}
.articulo table{border-collapse:collapse;width:100%;margin:16px 0;font-size:17px}
.articulo th{text-align:left;font-family:var(--t);font-weight:700;padding:8px 10px;background:#2a2119;color:var(--texto)}
.articulo td{padding:8px 10px;vertical-align:top}
.articulo tbody tr:nth-child(odd){background:#211a14}
.articulo tbody tr:nth-child(even){background:#1c1611}
.aviso-juridico{margin:0 0 6px;max-width:72ch;padding:10px 14px;background:var(--semilla);font-size:17px;color:var(--texto-2)}
.aviso-juridico b{color:var(--texto)}
.herramienta-tasas{margin:24px 0 10px;display:grid;gap:14px;max-width:880px}
.herramienta-tasas h2{font-size:clamp(22px,2.2vw,28px)}
.herramienta-nac{margin:26px calc(-1 * var(--m)) 10px calc(-1 * (var(--x) + 40px))}
.herramienta-nac .siembra{box-shadow:inset 0 3px 0 var(--brote)}
.herramienta-nac .superficie-linea{box-shadow:none}
.sondeo .validez{margin-top:18px}

/* anexo completo, plegado por grupo */
.anexo{margin-top:36px}
.anexo>p{color:var(--texto-2);max-width:72ch}
.grupo{margin:0 0 8px;background:#1c1611}
.grupo summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 14px;align-items:baseline;padding:12px 14px;min-height:48px;font-family:var(--t);font-weight:700;font-size:18px}
.grupo summary::-webkit-details-marker{display:none}
.grupo summary::before{content:"+";color:var(--brote);font-family:var(--s);font-weight:600}
.grupo[open] summary::before{content:"−"}
.g-dato{font-family:var(--s);font-weight:400;font-size:15px;color:var(--texto-2);white-space:nowrap}
.lineas{list-style:none;margin:0;padding:0 14px 12px}
.linea,.titulo-linea{display:grid;grid-template-columns:70px minmax(0,1.4fr) minmax(0,1fr) 100px;gap:0 14px;align-items:center;padding:8px 0}
.linea+.linea,.titulo-linea+.linea,.linea+.titulo-linea{box-shadow:inset 0 1px 0 rgba(243,236,226,.08)}
.titulo-linea .hecho{grid-column:2/span 3;font-style:italic;color:var(--texto-2)}
.cod{font-weight:600;color:var(--raiz);font-size:16px}
.hecho{font-size:16px;line-height:1.4}
.barra{display:block;height:10px;box-shadow:inset 2px 0 0 var(--texto-3)}
.barra i{display:block;height:100%;background:linear-gradient(90deg,#8b6a4a,#a6825e);min-width:3px}
.imp{font-family:var(--t);font-weight:700;text-align:right;white-space:nowrap}
.linea.sel{background:#2f2519}
.linea.sel .imp{color:var(--brote)}

.publicidad{margin:24px var(--m);padding:16px;background:var(--aire-2);min-height:120px}
.pub-eti{font-size:14px;color:var(--texto-3);margin:0}

/* pie: el subsuelo */
.pie{margin-top:40px;background:linear-gradient(#100c09,#090705);color:var(--texto-2);font-size:16px}
.pie-raices{display:block;width:100%;height:40px;fill:none;stroke:#5a3d26;stroke-width:3;stroke-linecap:round}
.pie-in{padding:16px var(--m) 52px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px 56px}
.pie h2{font-size:24px;margin-bottom:12px;color:var(--texto)}
.fuentes-lista{margin:0;padding:0 0 0 1.4em;display:grid;gap:10px}
.fuentes-lista li::marker{color:var(--raiz);font-family:var(--t)}
.fuentes-lista .lu{display:block;color:var(--texto-3);font-size:15px}
.pie-texto p{margin:0 0 10px}
.pie-texto b{color:var(--texto)}
.pie-nota{color:var(--texto-3);font-size:15px}

@media (max-width:980px){
  .siembra{grid-template-columns:minmax(0,1fr)}
  .tasas,.pie-in{grid-template-columns:1fr}
  .tasas-cab{position:static}
  .menu{justify-content:flex-start}
  .cab{grid-template-columns:1fr}
  .cortes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lo-que-no .articulo,.raices-pag ul{grid-template-columns:1fr}
  .lo-que-no h3,.lo-que-no h3+p{grid-row:auto}
}
@media (max-width:700px){
  :root{--col-anos:84px;--col-raiz:64px}
  .raiz-form{grid-template-columns:minmax(0,1fr)}
  .raiz-form .boton{justify-self:start}
  .capa-anos,.u-anos{padding-left:12px}
  .capas>li{padding-right:12px}
  .capa-anos{font-size:14px}
  .u-anos{font-size:16px}
  .cortes{grid-template-columns:1fr;gap:10px}
  .nucleo li{grid-template-columns:64px minmax(0,1fr) auto;gap:4px 12px}
  .testigo{width:64px}
  .sondeo{--x:14px;padding-left:40px;padding-right:16px}
  .sondeo .articulo h2::before{left:-28px;width:22px}
  .herramienta-nac{margin-left:-40px;margin-right:-16px}
  .linea,.titulo-linea{grid-template-columns:auto 1fr;grid-template-areas:"cod imp" "hecho hecho" "barra barra";gap:2px 10px}
  .linea .cod{grid-area:cod}.linea .imp{grid-area:imp}.linea .hecho{grid-area:hecho}.linea .barra{grid-area:barra;margin-top:4px}
  .titulo-linea .hecho{grid-column:1/-1}
  .grupo summary{grid-template-columns:auto minmax(0,1fr);font-size:17px}
  .g-dato{grid-column:2;white-space:normal}
  .articulo table{font-size:15px}
  .articulo th,.articulo td{padding:6px}
}
@media (max-width:520px){
  body{font-size:18px}
  .menu{gap:0 16px}
  .menu a{font-size:16px}
  .indep{font-size:15px}
  .cielo .pregunta{font-size:28px}
  .perfil h1{font-size:28px}
  .bajada{font-size:18px}
  .superficie .credito{position:static;display:block;background:none;color:var(--texto-3);padding:4px var(--m);max-width:none}
  .superficie .credito a{color:var(--raiz)}
  /* tablas: cada fila se apila (sin desbordar a 320 px) */
  .articulo table,.articulo tbody,.articulo tr,.articulo td{display:block}
  .articulo thead{display:none}
  .articulo tr{padding:8px 0}
  .articulo td{padding:2px 10px}
  .articulo td:first-child{font-weight:600;color:var(--texto)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
