/* ============================================================
   Ecomodular System — estilos de las páginas legales
   ============================================================ */
:root{
  --espresso:#3A302A;
  --espresso-deep:#2B231E;
  --sage:#AABB90;
  --sage-deep:#5C6E42;
  --cream:#F1EBDF;
  --paper:#FBF7EF;
  --line:rgba(56,47,39,.16);
  --line-light:rgba(242,240,233,.22);
  --f-display:'Bodoni Moda', Georgia, serif;
  --f-body:'Jost', system-ui, -apple-system, sans-serif;
  --pad:clamp(20px,5vw,64px);
  --r:2px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--espresso);
  font-family:var(--f-body);font-weight:450;font-size:17px;line-height:1.75;
}
a{color:var(--sage-deep)}
.wrap{max-width:760px;margin:0 auto;padding-inline:var(--pad)}

/* cabecera */
.lhdr{background:var(--espresso-deep);color:var(--cream);padding:16px 0}
.lhdr .wrap{max-width:1240px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--cream)}
.brand svg{width:28px;height:28px;flex:none}
.brand b{font-weight:500;font-size:.76rem;letter-spacing:.19em;text-transform:uppercase;display:block}
.brand i{font-family:var(--f-display);font-style:italic;font-size:.66rem;opacity:.62}
.lhdr a.back{
  color:var(--cream);text-decoration:none;font-size:.74rem;
  letter-spacing:.14em;text-transform:uppercase;opacity:.8
}
.lhdr a.back:hover{opacity:1}

/* contenido */
main{padding-block:clamp(44px,7vw,84px)}
h1{
  font-family:var(--f-body);font-weight:550;
  font-size:clamp(1.9rem,4.4vw,2.9rem);line-height:1.14;letter-spacing:-.015em;margin:0
}
.updated{
  margin:14px 0 0;font-size:.8rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--sage-deep);font-weight:650
}
hr.rule{height:1px;background:var(--line);border:0;margin:clamp(30px,4vw,44px) 0}
h2{
  font-family:var(--f-body);font-weight:550;
  font-size:clamp(1.18rem,2.3vw,1.5rem);line-height:1.25;letter-spacing:-.01em;
  margin:clamp(34px,4.5vw,48px) 0 14px
}
h3{font-family:var(--f-body);font-weight:650;font-size:1rem;margin:26px 0 8px}
p{margin:0 0 1.05em}
ul{margin:0 0 1.2em;padding-left:0;list-style:none}
li{position:relative;padding-left:20px;margin-bottom:9px}
li::before{
  content:'';position:absolute;left:0;top:13px;width:9px;height:1px;background:var(--sage-deep)
}
strong{font-weight:600}
.box{
  background:var(--cream);border-left:2px solid var(--sage-deep);border-radius:var(--r);
  padding:22px 26px;margin:24px 0
}
.box p:last-child{margin-bottom:0}
.box dl{margin:0;display:grid;gap:9px}
@media(min-width:560px){.box dl{grid-template-columns:auto 1fr;gap:9px 22px}}
.box dt{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;opacity:.75;font-weight:600;padding-top:4px}
.box dd{margin:0}

/* tabla de cookies */
.tbl{width:100%;border-collapse:collapse;margin:20px 0;font-size:.9rem}
.tbl th,.tbl td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{
  font-weight:650;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  background:var(--cream);color:var(--espresso)
}
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:14px 26px;border:0;border-radius:var(--r);cursor:pointer;
  background:var(--sage-deep);color:#fff;font-family:var(--f-body);
  font-size:.82rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;
  text-decoration:none;transition:background .25s
}
.btn:hover{background:var(--espresso)}

/* pie */
.lftr{
  background:var(--espresso);color:rgba(242,240,233,.62);
  padding:36px 0;font-size:.83rem;margin-top:clamp(40px,6vw,72px)
}
.lftr .wrap{max-width:1240px}
.lftr a{color:rgba(242,240,233,.62);text-decoration:none}
.lftr a:hover{color:var(--sage)}
.lftr .wrap{text-align:center}
.lftr-legal-links{
  margin:0 0 18px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:6px 12px;font-size:.94rem;line-height:1.6
}
.lftr-legal-links a{color:var(--cream);opacity:.9;text-decoration:none}
.lftr-legal-links a:hover{color:var(--sage);opacity:1}
.lftr-legal-links span{opacity:.4}
.lftr-copy{margin:0;font-size:.9rem;opacity:.55}
.lftr-holder{margin:8px 0 0;font-size:.76rem;opacity:.42;line-height:1.55}
.lftr-extra{margin:18px 0 0;font-size:.76rem;opacity:.45}
:focus-visible{outline:2px solid var(--sage-deep);outline-offset:3px}
