/* ==================================================================
   PÁGINAS LEGALES · PortaFolio Corporate Solutions
   Compartida por privacidad.html y cookies.html

   Modo lectura: la prioridad es que se entienda, no que impresione.
   Medida de línea corta, jerarquía obvia, índice fijo en escritorio.
   ================================================================== */

:root{
  --ink:#1a1512;
  --navy:#3b3430;
  --brand:#e87722;
  --amber:#f6a14f;
  --rust:#b4490f;
  --cream:#fcf9f4;
  --sand:#f5ede2;
  --line:#eadfd0;
  --steel:#6e655f;
  --panel-line:#e5d6c1;

  --shadow-soft:0 1px 2px rgba(26,21,18,.04), 0 6px 18px -10px rgba(26,21,18,.18);

  --font-body:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  --font-display:"Jost","Inter","Segoe UI",system-ui,sans-serif;
  --font-serif:"Fraunces",Georgia,serif;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scrollbar-color:var(--line) transparent;}
body{
  margin:0; background:var(--cream); color:var(--navy);
  font-family:var(--font-body); font-size:16.5px; line-height:1.7;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
::selection{background:rgba(232,119,34,.26);}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--line);border-radius:99px;border:3px solid var(--cream)}
::-webkit-scrollbar-thumb:hover{background:var(--amber)}
:focus-visible{outline:2px solid var(--brand); outline-offset:3px; border-radius:4px;}

/* ---------- Barra superior ---------- */
.top{
  position:sticky; top:0; z-index:40; background:rgba(252,249,244,.93);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.top-inner{
  max-width:1120px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.top img{height:3rem; width:auto; max-width:none; display:block;}
@media (min-width:621px){ .top img{height:3.25rem;} }
@media (min-width:961px){ .top img{height:3.75rem;} }
.top .volver{
  font-size:.88rem; font-weight:500; color:var(--steel); text-decoration:none;
  display:inline-flex; align-items:center; gap:7px; white-space:nowrap;
}
.top .volver:hover{color:var(--rust);}

/* ---------- Encabezado ---------- */
.cabecera{
  background:linear-gradient(150deg,#241d18 0%,var(--navy) 100%);
  color:#f7f1e8; position:relative; overflow:hidden;
  padding:clamp(40px,6vw,64px) 0 clamp(36px,5vw,52px);
}
.cabecera::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(60% 90% at 88% 8%, rgba(232,119,34,.20), transparent 62%);
}
.cabecera .interior{max-width:1120px; margin:0 auto; padding:0 20px; position:relative; z-index:1;}
.cabecera h1{
  font-family:var(--font-display); font-size:clamp(2rem,5vw,3rem); font-weight:600;
  letter-spacing:-.025em; line-height:1.08; margin:0 0 12px; color:#fff; max-width:18ch;
}
.cabecera h1 em{font-family:var(--font-serif); font-style:italic; color:var(--amber); font-weight:400;}
.cabecera p{color:#e6ddd1; margin:0; max-width:58ch; font-size:1.04rem;}
.cabecera .fecha{
  margin-top:20px; padding-top:18px; border-top:1px solid rgba(255,255,255,.16);
  font-size:.86rem; color:#b6a897; display:flex; flex-wrap:wrap; gap:8px 22px;
}
.cabecera .fecha b{color:#e6ddd1; font-weight:600;}

/* ---------- Cuerpo ---------- */
.contenedor{
  max-width:1120px; margin:0 auto; padding:clamp(34px,5vw,56px) 20px 80px;
  display:grid; gap:44px;
}
@media (min-width:981px){
  .contenedor{grid-template-columns:230px 1fr; gap:56px; align-items:start;}
}

/* Índice */
.indice{font-size:.9rem;}
@media (min-width:981px){
  .indice{position:sticky; top:118px; max-height:calc(100vh - 150px); overflow-y:auto;}
}
.indice p{
  font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  color:var(--steel); margin:0 0 12px;
}
.indice ol{margin:0; padding:0; list-style:none; counter-reset:i;}
.indice li{counter-increment:i;}
.indice a{
  display:flex; gap:10px; padding:7px 0; color:var(--steel); text-decoration:none;
  border-bottom:1px solid transparent; transition:color .15s ease;
}
.indice a::before{
  content:counter(i); flex:none; width:1.3em; font-variant-numeric:tabular-nums;
  font-family:var(--font-display); font-weight:600; color:var(--line);
}
.indice a:hover{color:var(--rust);}
.indice a:hover::before{color:var(--amber);}

/* Texto */
.texto{min-width:0; max-width:68ch;}
.texto section{scroll-margin-top:130px; margin-bottom:42px;}
.texto section:last-child{margin-bottom:0;}
.texto h2{
  font-family:var(--font-display); font-size:clamp(1.3rem,3vw,1.6rem); font-weight:600;
  letter-spacing:-.018em; line-height:1.2; margin:0 0 14px;
  display:flex; gap:12px; align-items:baseline;
}
.texto h2 .n{
  font-size:.82rem; font-variant-numeric:tabular-nums; color:var(--rust);
  flex:none; font-weight:600;
}
.texto h3{
  font-family:var(--font-display); font-size:1.05rem; font-weight:600;
  margin:26px 0 8px; letter-spacing:-.01em;
}
.texto p{margin:0 0 15px;}
.texto ul{margin:0 0 15px; padding-left:20px;}
.texto li{margin-bottom:8px;}
.texto a{color:var(--rust); text-decoration:underline; text-underline-offset:2px;}
.texto a:hover{color:var(--navy);}
.texto strong{font-weight:600;}

/* Tablas de datos */
.tabla-envoltura{overflow-x:auto; margin:0 0 18px; border-radius:11px; border:1px solid var(--line);}
table{border-collapse:collapse; width:100%; min-width:430px; font-size:.9rem; background:#fff;}
thead th{
  text-align:left; padding:11px 15px; background:var(--sand);
  border-bottom:1px solid var(--panel-line); font-weight:600;
  font-size:.74rem; letter-spacing:.08em; text-transform:uppercase; color:var(--steel);
  white-space:nowrap;
}
tbody td{padding:12px 15px; border-bottom:1px solid var(--line); vertical-align:top;}
tbody tr:last-child td{border-bottom:none;}
tbody td:first-child{font-weight:600; white-space:nowrap;}
td code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.85em;
  background:var(--sand); padding:2px 6px; border-radius:4px; color:var(--rust);
}

/* Llamados */
.nota{
  background:var(--sand); border:1px solid var(--panel-line); border-radius:11px;
  padding:17px 20px; margin:0 0 18px;
}
.nota p:last-child{margin-bottom:0;}
.nota .etiqueta{
  display:flex; align-items:center; gap:8px; margin:0 0 8px;
  font-size:.75rem; font-weight:600; letter-spacing:.09em; text-transform:uppercase;
  color:var(--rust);
}
.nota .etiqueta svg{flex:none;}

/* Contacto para ejercer derechos */
.via{
  border:1px solid var(--line); border-radius:11px; background:#fff;
  padding:20px 22px; box-shadow:var(--shadow-soft); margin:0 0 18px;
}
.via dl{margin:0; display:grid; gap:12px;}
@media (min-width:560px){ .via dl{grid-template-columns:auto 1fr; gap:12px 22px;} }
.via dt{
  font-size:.74rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--steel); white-space:nowrap;
}
.via dd{margin:0;}

/* Pie */
footer{
  border-top:1px solid var(--line); padding:26px 0 40px;
  font-size:.82rem; color:var(--steel);
}
footer .interior{
  max-width:1120px; margin:0 auto; padding:0 20px;
  display:flex; justify-content:space-between; gap:14px 26px; flex-wrap:wrap;
}
footer a{color:var(--rust); text-decoration:none;}
footer a:hover{text-decoration:underline;}

@media (max-width:620px){
  body{font-size:16px;}
  .texto h2{flex-direction:column; gap:2px;}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none!important; transition:none!important;}
}