/* === Legal pages — On The Go Transportes === */
.legal-nav{
  position: sticky; top: 0; z-index: 50;
  background: var(--green);
  border-bottom: 1px solid rgba(0,0,0,.12);
  box-shadow: 0 1px 0 rgba(255,255,255,.18) inset, var(--shadow-sm);
}
.legal-nav .container{
  display:flex; align-items:center; justify-content:space-between;
  gap: 20px; height: 74px;
}
.legal-nav__brand{ display:flex; align-items:center; gap:12px; }
.legal-nav__logo{
  display:flex; align-items:center; justify-content:center;
  width: 56px; height: 56px; padding: 7px;
  background:#fff; border-radius: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,.14);
}
.legal-nav__logo img{ max-height: 100%; max-width: 100%; width:auto; height:auto; display:block; object-fit: contain; }
.legal-nav .back{
  display:inline-flex; align-items:center; gap:8px;
  background:#fff; color: var(--ink); font-weight: 700; font-size: 14px;
  padding: 9px 16px; border-radius: var(--r-pill);
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}
.legal-nav .back:hover{ background: var(--bg-2); }

.legal-nav__right{ display:flex; align-items:center; gap: 14px; }
.legal-nav__right .lang-switch{
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 10px; padding: 3px 4px;
}
.legal-nav__right .lang-switch button.is-on{ background: rgba(255,255,255,.18); }
@media (max-width: 520px){
  .legal-nav .back{ display:none; }
}

.legal-hero{
  background: var(--bg-2);
  border-bottom: 1px solid var(--line);
  padding: clamp(40px, 6vw, 72px) 0 clamp(36px, 5vw, 56px);
}
.legal-hero .container{ display:grid; grid-template-columns: 1.2fr .8fr; gap: clamp(28px,5vw,64px); align-items:center; }
@media (max-width: 880px){ .legal-hero .container{ grid-template-columns: 1fr; } .legal-hero__art{ display:none; } }
.legal-hero .eyebrow{
  font-family: var(--f-mono); font-size: 12px; letter-spacing:.16em;
  text-transform:uppercase; color: var(--green-ink); font-weight: 700;
}
.legal-hero h1{
  font-family: var(--f-display); font-weight: 900; line-height: .98;
  font-size: clamp(34px, 4.6vw, 56px); margin: 14px 0 0; color: var(--ink);
}
.legal-hero p{ color: var(--ink-3); font-size: 17px; margin-top: 16px; max-width: 48ch; }
.legal-hero__art{
  border-radius: var(--r-lg); overflow:hidden; border:1px solid var(--line);
  box-shadow: var(--shadow-md); background:#fff;
}
.legal-hero__art img{ width:100%; display:block; }

.legal-wrap{ padding: clamp(40px, 6vw, 72px) 0 clamp(48px,7vw,96px); }
.legal-wrap .container{ display:grid; grid-template-columns: 240px 1fr; gap: clamp(28px,5vw,64px); align-items:start; }
@media (max-width: 880px){ .legal-wrap .container{ grid-template-columns: 1fr; } .legal-toc{ position: static !important; } }

.legal-toc{
  position: sticky; top: 96px;
  border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 18px 18px; background: var(--surface);
}
.legal-toc h4{
  font-family: var(--f-mono); font-size: 11px; letter-spacing:.16em;
  text-transform:uppercase; color: var(--ink-4); margin: 0 0 12px;
}
.legal-toc a{
  display:block; padding: 7px 0; font-size: 14.5px; font-weight: 600;
  color: var(--ink-3); border-bottom: 1px dashed var(--line);
}
.legal-toc a:last-child{ border-bottom: none; }
.legal-toc a:hover{ color: var(--green-ink); }

.legal-body{ max-width: 720px; }
.legal-body h2{
  font-family: var(--f-display); font-weight: 800;
  font-size: clamp(22px, 2.6vw, 28px); margin: 44px 0 14px;
  color: var(--ink); scroll-margin-top: 96px;
  display:flex; align-items:center; gap: 12px;
}
.legal-body h2:first-child{ margin-top: 0; }
.legal-body h2 .n{
  font-family: var(--f-mono); font-size: 13px; font-weight: 700;
  color: var(--green-ink); background: var(--green-soft);
  border-radius: 8px; padding: 4px 9px; flex: none;
}
.legal-body h3{ font-family: var(--f-display); font-weight: 700; font-size: 18px; margin: 24px 0 8px; }
.legal-body p{ color: var(--ink-2); font-size: 16.5px; line-height: 1.65; margin: 0 0 14px; }
.legal-body ul{ margin: 0 0 16px; padding-left: 0; list-style: none; }
.legal-body ul li{
  position: relative; padding-left: 26px; margin-bottom: 10px;
  color: var(--ink-2); font-size: 16.5px; line-height: 1.6;
}
.legal-body ul li::before{
  content:""; position:absolute; left: 4px; top: 9px;
  width: 7px; height: 7px; border-radius: 50%; background: var(--route);
}
.legal-body a.inline{ color: var(--green-ink); font-weight: 600; border-bottom: 1px solid var(--green-soft); }
.legal-body a.inline:hover{ border-color: var(--green); }
.legal-body strong{ color: var(--ink); font-weight: 700; }

.legal-data{
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--bg-2); padding: 22px 24px; margin: 0 0 8px;
}
.legal-data dl{ display:grid; grid-template-columns: 180px 1fr; gap: 10px 18px; margin: 0; }
@media (max-width: 560px){ .legal-data dl{ grid-template-columns: 1fr; gap: 4px 0; } .legal-data dd{ margin-bottom: 12px; } }
.legal-data dt{ font-family: var(--f-mono); font-size: 12px; letter-spacing:.06em; text-transform:uppercase; color: var(--ink-4); padding-top: 2px; }
.legal-data dd{ margin: 0; color: var(--ink); font-weight: 600; font-size: 16px; }
.legal-data .todo{ color: var(--red-ink); background: var(--red-soft); border-radius: 6px; padding: 2px 8px; font-size: 13px; font-weight: 700; font-family: var(--f-mono); }

.legal-note{
  display:flex; gap: 12px; align-items:flex-start;
  background: var(--green-soft); border: 1px solid #CDE3C8;
  border-radius: var(--r-md); padding: 16px 18px; margin: 18px 0 0;
  color: var(--green-ink); font-size: 15px; line-height: 1.55;
}
.legal-meta{ font-family: var(--f-mono); font-size: 13px; color: var(--ink-4); margin-top: 40px; }

.legal-foot{ background: var(--ink); color: #C9C5BB; padding: 28px 0; }
.legal-foot .container{ display:flex; align-items:center; justify-content:space-between; gap: 16px; flex-wrap: wrap; font-size: 14px; }
.legal-foot a{ color:#F4EFE6; font-weight: 600; }
.legal-foot .links{ display:flex; gap: 20px; flex-wrap: wrap; }