/* =====================================================
   TRAVELSY — páginas interiores (legales y artículos)
   Se carga después de style.css; reutiliza sus variables.
   ===================================================== */

/* El encabezado es sólido desde el inicio (no hay hero de video debajo) */
.site-header--solid{
  background:rgba(16,24,32,.96);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ink-line);
}

/* ---------- cabecera de página ---------- */
.page-hero{
  position:relative; overflow:hidden; background:var(--ink); color:var(--bone);
  padding:clamp(132px, 15vw, 190px) 0 clamp(52px, 7vw, 92px);
}
.page-hero::before{
  content:""; position:absolute; right:-10%; top:-40%; width:720px; height:720px; max-width:120vw;
  background:radial-gradient(closest-side, rgba(169,146,106,.16), transparent); pointer-events:none;
}
.page-hero .container{ position:relative; }
.page-hero .section-label{ color:var(--ice); }
.page-hero h1{
  margin-top:18px; max-width:20ch;
  font-size:clamp(2.4rem, 6vw, 4.4rem); line-height:1.06; color:var(--bone);
}
.page-hero--article h1{ max-width:24ch; font-size:clamp(2.1rem, 5vw, 3.7rem); }
.page-lede{
  margin-top:24px; max-width:56ch; font-size:clamp(1.05rem, 1.5vw, 1.2rem); line-height:1.65;
  color:rgba(247,244,238,.82);
}
.page-meta{
  margin-top:28px; font-family:var(--mono); font-size:.74rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--mist);
}

.breadcrumb{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:34px;
  font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(247,244,238,.62);
}
.breadcrumb a{ transition:color .25s var(--ease); }
.breadcrumb a:hover{ color:var(--bone); }
.breadcrumb [aria-current="page"]{ color:var(--bone); }

/* ---------- páginas legales ---------- */
.legal-layout{
  display:grid; grid-template-columns:260px minmax(0, 1fr); gap:clamp(32px, 6vw, 96px);
  padding-top:clamp(52px, 7vw, 96px); padding-bottom:clamp(40px, 5vw, 72px);
}
.legal-toc{ position:sticky; top:110px; align-self:start; }
.legal-toc-title{
  font-family:var(--mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--mist);
  margin-bottom:18px;
}
.legal-toc ol{ list-style:none; margin:0; padding:0; counter-reset:toc; border-left:1px solid rgba(16,24,32,.14); }
.legal-toc li{ counter-increment:toc; }
.legal-toc a{
  display:block; padding:8px 0 8px 18px; margin-left:-1px; border-left:1px solid transparent;
  font-family:var(--sans); font-weight:400; font-size:.9rem; line-height:1.4; color:var(--stone);
  transition:color .25s var(--ease), border-color .25s var(--ease);
}
.legal-toc a::before{ content:counter(toc, decimal-leading-zero) "  "; font-family:var(--mono); font-size:.72rem; color:var(--brass-deep); }
.legal-toc a:hover{ color:var(--ink); border-left-color:var(--brass); }

.legal-body{ max-width:720px; }
.legal-body h2{
  margin:60px 0 18px; font-size:clamp(1.6rem, 2.6vw, 2.1rem); line-height:1.2; scroll-margin-top:110px;
}
.legal-body h2:first-child{ margin-top:0; }
.legal-body h3{ margin:30px 0 10px; font-size:1.1rem; letter-spacing:.02em; }
.legal-body p, .legal-body li{
  font-family:var(--sans); font-weight:400; font-size:1.02rem; line-height:1.8; color:#33414e;
}
.legal-body p + p{ margin-top:14px; }
.legal-body ul, .legal-body ol{ margin:14px 0 0; padding-left:1.25em; }
.legal-body li{ margin-top:8px; padding-left:4px; }
.legal-body li::marker{ color:var(--brass-deep); }
.legal-body a{ color:var(--slate); border-bottom:1px solid currentColor; transition:color .25s var(--ease); }
.legal-body a:hover{ color:var(--ink); }
.legal-intro{ font-size:1.12rem !important; color:var(--ink) !important; }

.legal-back{ padding-bottom:clamp(64px, 8vw, 110px); }
.legal-back .text-link{ margin-top:0; }

/* ---------- artículos ---------- */
.article-figure{
  position:relative; z-index:2; margin:calc(-1 * clamp(28px, 4vw, 56px)) auto 0;
  max-width:1120px; padding:0 var(--pad);
}
.article-figure img{
  width:100%; aspect-ratio:16/9; object-fit:cover; background:var(--slate);
  box-shadow:0 30px 70px rgba(16,24,32,.28);
}
.article-body{ max-width:760px; margin:0 auto; padding:clamp(52px, 7vw, 92px) var(--pad) clamp(40px, 6vw, 80px); }
.article-body h2{ margin:58px 0 16px; font-size:clamp(1.7rem, 3vw, 2.3rem); line-height:1.18; }
.article-body p, .article-body li{
  font-family:var(--sans); font-weight:400; font-size:1.08rem; line-height:1.85; color:#2e3b47;
}
.article-body p + p{ margin-top:16px; }
.article-body > p:first-of-type::first-letter{
  float:left; font-family:var(--serif-display); font-weight:400; font-size:4.6rem; line-height:.82;
  padding:8px 14px 0 0; color:var(--brass-deep);
}
.article-body ul, .article-body ol{ margin:18px 0 0; padding-left:1.3em; }
.article-body li{ margin-top:10px; padding-left:4px; }
.article-body li::marker{ color:var(--brass-deep); }
.article-body strong{ font-weight:500; color:var(--ink); }
.article-callout{
  margin:34px 0 0; padding:22px 26px; background:var(--linen); border-left:2px solid var(--brass);
}
.article-callout p{ font-size:1.02rem; line-height:1.7; }
.article-callout strong{ font-family:var(--mono); font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; font-weight:400; color:var(--brass-deep); }

.compare{ margin:26px 0 0; overflow-x:auto; }
.compare table{ width:100%; border-collapse:collapse; min-width:520px; }
.compare caption{ position:absolute; left:-9999px; }
.compare th, .compare td{ text-align:left; vertical-align:top; padding:16px 18px; border-bottom:1px solid rgba(16,24,32,.12); font-family:var(--sans); font-size:.98rem; line-height:1.55; }
.compare thead th{ font-family:var(--mono); font-weight:400; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--mist); border-bottom:1px solid rgba(16,24,32,.3); }
.compare tbody th{ font-weight:500; color:var(--ink); width:24%; }
.compare tbody td:nth-child(2){ color:var(--stone); }
.compare tbody td:nth-child(3){ color:var(--ink); background:rgba(169,146,106,.1); }

/* cierre con llamada a la acción */
.article-cta{ position:relative; overflow:hidden; background:var(--ink); color:var(--bone); padding:clamp(72px, 9vw, 130px) 0; text-align:center; }
.article-cta::before{
  content:""; position:absolute; left:50%; top:-45%; width:800px; height:800px; max-width:140vw; transform:translateX(-50%);
  background:radial-gradient(closest-side, rgba(169,146,106,.17), transparent); pointer-events:none;
}
.article-cta .container{ position:relative; max-width:680px; }
.article-cta .section-label{ justify-content:center; color:var(--ice); }
.article-cta h2{ margin-top:16px; font-size:clamp(1.9rem, 3.8vw, 2.8rem); line-height:1.16; color:var(--bone); }
.article-cta p{ margin-top:18px; color:rgba(247,244,238,.78); font-size:1.05rem; line-height:1.65; }
.article-cta .cta-actions{ margin-top:34px; }

/* más historias */
.more-stories{ padding:clamp(72px, 9vw, 130px) 0; background:var(--linen); }
.more-grid{ display:grid; grid-template-columns:repeat(2, 1fr); gap:clamp(24px, 4vw, 48px); }
.more-card{ position:relative; }
.more-card .journal-media img{ width:100%; aspect-ratio:16/10; object-fit:cover; background:var(--slate); }
.more-card h3{ margin-top:18px; font-size:clamp(1.1rem, 1.6vw, 1.3rem); line-height:1.4; }
.more-back{ margin-top:clamp(36px, 5vw, 56px); }
.more-back .text-link{ margin-top:0; }

@media (hover:hover){
  .more-card:hover .journal-media img{ transform:scale(1.05); }
  .more-card:hover .journal-link{ background-size:100% 1px; }
  .more-card:hover .journal-read::after{ transform:translateX(6px); }
}

/* ---------- móvil ---------- */
@media (max-width:980px){
  .legal-layout{ grid-template-columns:1fr; }
  .legal-toc{ position:static; }
  .legal-toc ol{ columns:1; }
}
@media (max-width:640px){
  .more-grid{ grid-template-columns:1fr; }
  .article-body > p:first-of-type::first-letter{ font-size:3.8rem; padding-right:10px; }
  .compare th, .compare td{ padding:14px 12px; }
}
@media print{
  .site-header, .site-footer, .skip-link, .legal-toc, .article-cta, .more-stories{ display:none !important; }
  .page-hero{ background:none; color:#000; padding:24px 0; }
  .page-hero h1, .page-lede, .page-meta, .breadcrumb{ color:#000 !important; }
}

/* marcadores legales por completar: visibles y fáciles de buscar/reemplazar */
.placeholder{
  background:rgba(169,146,106,.22); color:#5d4b26; padding:1px 6px;
  font-family:var(--mono); font-size:.82em; letter-spacing:.02em; line-height:1.6;
  box-decoration-break:clone; -webkit-box-decoration-break:clone;
}
.page-meta .placeholder{ background:rgba(169,146,106,.25); color:var(--bone); }

.legal-back{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 36px; }
.legal-sep{ display:none; }
.more-stories .section-head{ margin-bottom:clamp(32px, 4vw, 52px); text-align:left; }
.article-figure img{ height:auto; }
.legal-body ul + p, .legal-body ol + p, .article-body ul + p, .article-body ol + p{ margin-top:16px; }
