/* Shared styles for the legal pages (aviso-legal / privacidad / cookies) */
:root{
  --gold:#86683F;--gold-wash:#F7F1E6;--teal:#0B4E58;--teal-deep:#0C3339;
  --ink:#15191A;--ink-2:#4A5254;--ink-3:#6A7375;--paper:#fff;--paper-2:#FBF9F6;--line:#E6E2DB;
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
body{
  margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;
}
a{color:var(--gold)}
.wrap{max-width:780px;margin-inline:auto;padding-inline:clamp(20px,5vw,40px)}

.lhdr{background:var(--teal-deep);color:#fff;padding-block:26px}
.lhdr .wrap{max-width:1180px;display:flex;align-items:center;gap:12px}
.lhdr img{width:36px;height:36px;object-fit:contain}
.lhdr a{color:#fff;text-decoration:none;display:flex;align-items:center;gap:12px}
.lhdr b{font-family:var(--serif);font-size:1.3rem;font-weight:600}
.lhdr small{
  display:block;font-size:.55rem;letter-spacing:.22em;text-transform:uppercase;
  color:#C9A96B;margin-top:3px;font-weight:600;
}
.lhdr .back{margin-left:auto;font-size:.85rem;opacity:.8}
.lhdr .back:hover{opacity:1}

main{padding-block:clamp(48px,7vw,80px)}
h1{font-family:var(--serif);font-size:clamp(2rem,5vw,2.8rem);font-weight:500;line-height:1.15;margin:0 0 12px}
.updated{color:var(--ink-3);font-size:.86rem;margin:0 0 44px}
h2{
  font-family:var(--serif);font-size:clamp(1.25rem,2.6vw,1.55rem);font-weight:500;
  margin:44px 0 14px;padding-top:24px;border-top:1px solid var(--line);
}
h2:first-of-type{border-top:0;padding-top:0}
h3{font-size:1rem;font-weight:600;margin:26px 0 8px}
p{margin:0 0 16px;color:var(--ink-2)}
ul{margin:0 0 16px;padding-left:22px;color:var(--ink-2)}
li{margin-bottom:8px}
strong{color:var(--ink)}

/* Data the agency must fill in. Deliberately loud so it cannot ship unnoticed.
   Allowed to wrap: a 45-character placeholder held on one line was what
   pushed the privacy table 238px past the edge of a phone screen. The clone
   keeps the highlight boxed on every line it wraps onto. */
.todo{
  background:#FFF4D6;border:1px solid #E8C55E;border-radius:4px;
  padding:1px 7px;font-weight:600;color:#7A5B00;font-size:.94em;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}
.notice{
  background:var(--gold-wash);border-left:3px solid var(--gold);
  border-radius:0 10px 10px 0;padding:20px 24px;margin:32px 0;
}
.notice p{margin:0;color:var(--teal-deep);font-size:.94rem}
.notice p+p{margin-top:10px}

table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:.92rem}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:700}
td{color:var(--ink-2);overflow-wrap:anywhere}
/* On a phone the tables ran up to 238px past the edge of the screen, because
   nothing inside a cell was allowed to break. Cell text now wraps (labels in
   th are short words and are left whole), and a table that still cannot fit -
   the four-column cookie table - scrolls sideways on its own instead of
   dragging the whole page with it. */
@media (max-width:560px){
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  th,td{padding:9px 8px}
  th{letter-spacing:.06em}
}

.lftr{
  background:var(--paper-2);border-top:1px solid var(--line);
  padding-block:32px;margin-top:60px;font-size:.86rem;color:var(--ink-3);
}
.lftr .wrap{max-width:1180px;display:flex;flex-wrap:wrap;gap:12px 26px;justify-content:space-between}
.lftr nav{display:flex;flex-wrap:wrap;gap:20px}
.lftr a{text-decoration:none}
.lftr a:hover{text-decoration:underline}
