/* Asesores ICA — cuaderno de folios. Paleta y tipos restringidos. */
:root{
  --oliva:#3f5d3a;
  --oliva-claro:#6c8a5f;
  --terracota:#c25b3a;
  --hueso:#f4f1e8;
  --tinta:#2a2a24;
  --gris:#d9d4c7;
  --serif:Georgia,'Times New Roman',serif;
  --sans:system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--tinta);
  font-size:17px;
  line-height:1.65;
  background:
    linear-gradient(0deg,rgba(63,93,58,.05),rgba(63,93,58,.05)),
    repeating-linear-gradient(90deg,transparent 0 27px,rgba(201,91,58,.05) 27px 28px),
    var(--gris);
}
a{color:var(--oliva)}
a:hover{color:var(--terracota)}
img{max-width:100%;height:auto;display:block}

/* ---------- Hoja / pliego ---------- */
.hoja{
  max-width:900px;
  margin:26px auto 60px;
  background:var(--hueso);
  box-shadow:0 1px 0 var(--gris),0 14px 40px rgba(42,42,36,.12);
  border:1px solid var(--gris);
  position:relative;
  padding-bottom:6px;
}
/* margen izquierdo con regla vertical */
.hoja::before{
  content:"";
  position:absolute;top:0;bottom:0;left:62px;width:1px;
  background:linear-gradient(180deg,transparent 0 64px,var(--terracota) 64px,var(--terracota) calc(100% - 70px),transparent calc(100% - 70px));
  opacity:.5;
}
@media(max-width:640px){.hoja::before{left:22px}.hoja{margin:0}}

/* ---------- Cabecera (placa ~64px) ---------- */
.cabecera{
  height:64px;
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;
  padding:0 26px 0 30px;
  position:relative;
}
.cabecera::after{
  content:"";position:absolute;left:26px;right:26px;bottom:0;height:4px;
  background:linear-gradient(180deg,var(--oliva) 0 1px,transparent 1px 3px,var(--oliva) 3px 4px);
}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--tinta)}
.marca-txt{font-family:var(--serif);font-size:16px;line-height:1.1;display:block}
.marca-txt em{display:block;font-style:normal;font-family:var(--sans);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--oliva-claro);margin-top:2px}

/* sello redondo con borde dentado (solo CSS) */
.sello{
  position:relative;flex:0 0 auto;
  width:44px;height:44px;border-radius:50%;
  background:radial-gradient(circle at 34% 30%,var(--oliva-claro),var(--oliva) 70%);
  color:var(--hueso);
  font-family:var(--serif);font-weight:bold;font-size:15px;letter-spacing:1px;
  display:grid;place-items:center;
  box-shadow:inset 0 0 0 2px var(--hueso),inset 0 0 0 4px var(--oliva);
  z-index:1;
}
.sello::before{
  content:"";position:absolute;inset:-6px;border-radius:50%;z-index:-1;
  background:repeating-conic-gradient(var(--terracota) 0 4deg,transparent 4deg 12deg);
  -webkit-mask:radial-gradient(circle,transparent 0 24px,#000 24px 29px,transparent 29px);
          mask:radial-gradient(circle,transparent 0 24px,#000 24px 29px,transparent 29px);
}
.cabecera-der{font-size:13.5px;white-space:nowrap}
.pliego{font-family:var(--serif);color:var(--oliva);font-style:italic}
.ir-indice{font-family:var(--serif);text-decoration:none;border-bottom:1px dotted var(--terracota)}
.ir-indice:hover{color:var(--terracota)}
@media(max-width:520px){.marca-txt em{display:none}.cabecera-der{font-size:12px}}

/* ---------- Cuerpo folio ---------- */
.folio{
  position:relative;
  padding:30px 42px 40px 92px;
  min-height:420px;
}
@media(max-width:640px){.folio{padding:24px 22px 30px 44px}}
/* número de folio en la esquina (::before) */
.folio::before{
  content:"folio " attr(data-folio);
  position:absolute;top:14px;right:26px;
  font-family:var(--serif);font-style:italic;font-size:12px;letter-spacing:.03em;
  color:var(--oliva-claro);
  border:1px solid var(--gris);padding:1px 8px;background:var(--hueso);
}
@media(max-width:640px){.folio::before{right:16px}}

.folio h1{
  font-family:var(--serif);font-weight:normal;color:var(--oliva);
  font-size:2.05rem;line-height:1.15;margin:.1em 0 .35em;
  border-bottom:1px solid var(--gris);padding-bottom:.3em;
}
.folio h2{
  font-family:var(--serif);color:var(--oliva);font-weight:normal;
  font-size:1.4rem;margin:1.7em 0 .5em;
  padding-left:.55em;border-left:5px solid var(--oliva-claro);
}
.folio h3{font-family:var(--serif);color:var(--terracota);font-size:1.12rem;margin:1.3em 0 .35em}
.folio p{margin:0 0 1em}
.folio ul,.folio ol{margin:0 0 1.2em;padding-left:1.35em}
.folio li{margin:.28em 0}
.folio li::marker{color:var(--terracota)}
.entradilla{font-family:var(--serif);font-size:1.14rem;color:var(--oliva);line-height:1.5}
.folio strong{color:var(--tinta)}

/* capitular */
.folio > p:first-of-type::first-letter{
  font-family:var(--serif);float:left;font-size:3.1rem;line-height:.78;
  padding:.06em .12em 0 0;color:var(--terracota);
}

/* ---------- Índice (main) ---------- */
.rubrica{margin:0;padding:0;list-style:none;counter-reset:rub}
.rubrica li{
  counter-increment:rub;position:relative;
  border-bottom:1px dotted var(--gris);
  padding:9px 0 9px 46px;
}
.rubrica li::before{
  content:counter(rub,decimal-leading-zero);
  position:absolute;left:0;top:9px;
  font-family:var(--serif);color:var(--terracota);font-size:15px;
}
.rubrica a{text-decoration:none;font-weight:600;color:var(--oliva)}
.rubrica a:hover{color:var(--terracota)}
.rubrica .dest{margin-left:8px;color:var(--tinta);font-weight:400;display:block;font-size:14.5px}

/* ---------- Cajas / avisos ---------- */
.nota{
  border:1px solid var(--gris);border-left:6px solid var(--oliva-claro);
  background:var(--hueso);padding:14px 18px;margin:1.4em 0;
}
.nota h3{margin-top:0}
.stamp{
  display:inline-block;transform:rotate(-2deg);
  border:2px double var(--terracota);color:var(--terracota);
  font-family:var(--serif);text-transform:uppercase;letter-spacing:.12em;
  font-size:11px;padding:3px 10px;margin:6px 0;
}
.datos{list-style:none;padding:0;margin:0 0 1.2em}
.datos li{padding:6px 0;border-bottom:1px dotted var(--gris)}
.datos strong{font-family:var(--serif)}

/* rombo decorativo */
.rombo{width:10px;height:10px;background:var(--terracota);transform:rotate(45deg);display:inline-block;margin:0 8px}

/* ---------- Tabla precios ---------- */
.tabla-wrap{overflow-x:auto;margin:1.3em 0}
table.precios{border-collapse:collapse;width:100%;font-size:15.5px}
table.precios th,table.precios td{border:1px solid var(--gris);padding:10px 12px;text-align:left;vertical-align:top}
table.precios thead th{background:var(--oliva);color:var(--hueso);font-family:var(--serif);font-weight:normal}
table.precios tbody tr:nth-child(even){background:var(--hueso)}
table.precios td.p{font-family:var(--serif);color:var(--terracota);font-weight:bold;white-space:nowrap}

/* ---------- Formularios ---------- */
form.papeleta{margin:1.2em 0;border:1px solid var(--gris);background:var(--gris);padding:18px}
.papeleta .campo{margin-bottom:14px}
.papeleta label{display:block;font-size:13.5px;font-weight:600;margin-bottom:4px;color:var(--oliva)}
.papeleta input[type=text],.papeleta input[type=email],.papeleta input[type=tel],
.papeleta select,.papeleta textarea{
  width:100%;padding:9px 10px;font:inherit;font-size:15px;color:var(--tinta);
  background:var(--hueso);border:1px solid var(--gris);border-radius:0;
}
.papeleta input:focus,.papeleta select:focus,.papeleta textarea:focus{outline:2px solid var(--oliva-claro);outline-offset:0}
.papeleta .check{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;font-weight:400}
.papeleta .check input{margin-top:3px}
.boton{
  display:inline-block;font-family:var(--serif);font-size:15px;
  background:var(--oliva);color:var(--hueso);border:0;
  padding:11px 22px;cursor:pointer;text-decoration:none;
}
.boton:hover{background:var(--terracota);color:var(--hueso)}
.boton.sec{background:transparent;color:var(--oliva);border:1px solid var(--oliva)}
.boton.sec:hover{background:var(--oliva);color:var(--hueso)}

/* ---------- Figuras ---------- */
figure{margin:1.4em 0;border:1px solid var(--gris);background:var(--hueso);padding:8px}
figure img{width:100%;height:auto}
figcaption{font-size:12.5px;color:var(--oliva-claro);font-family:var(--serif);font-style:italic;padding:7px 4px 2px}

/* ---------- Pie + colofón ---------- */
.pie{
  border-top:4px double var(--oliva);
  margin:0 26px;padding:14px 0 18px;
  display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;
  font-size:13.5px;
}
.pie-nav a,.pie-nav span{text-decoration:none;font-family:var(--serif)}
.pie-nav .off{color:var(--gris)}
.pie-nav a:hover{color:var(--terracota)}
.pie-folio{font-family:var(--serif);font-style:italic;color:var(--oliva)}
@media(max-width:640px){.pie{margin:0 18px;flex-direction:column;align-items:flex-start}}

/* ---------- Banner de cookies ---------- */
#cookie-banner{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  background:var(--tinta);color:var(--hueso);font-size:14px;
  border-top:4px double var(--terracota);
  padding:14px 20px;display:none;
}
#cookie-banner.visible{display:block}
#cookie-banner .cb-in{max-width:900px;margin:0 auto;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
#cookie-banner p{margin:0;max-width:640px}
#cookie-banner a{color:var(--gris)}
#cookie-banner .cb-acc{display:flex;gap:10px;flex:0 0 auto}
#cookie-banner button{
  font:inherit;font-family:var(--serif);cursor:pointer;border:0;padding:9px 18px;
}
#cookie-banner .aceptar{background:var(--oliva-claro);color:var(--hueso)}
#cookie-banner .rechazar{background:transparent;color:var(--hueso);border:1px solid var(--gris)}

/* rejilla sencilla para tarjetas */
.rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin:1.3em 0}
.tarjeta{border:1px solid var(--gris);border-top:5px solid var(--oliva-claro);background:var(--hueso);padding:14px 16px}
.tarjeta h3{margin-top:0}
.tarjeta .num{font-family:var(--serif);font-size:1.6rem;color:var(--terracota);display:block}