/* Shared styles for legal pages (aviso-legal, privacidad, cookies) */
*, *::before, *::after { box-sizing: border-box; }
html { background: #0a0a0a; }
html, body { margin: 0; padding: 0; }
body {
  background: #0a0a0a;
  color: #efede6;
  font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
  font-size: 0.95rem;
}

/* Brand mark (top-left, same as home) */
.brand {
  position: fixed;
  top: clamp(1.25rem, 2.5vw, 1.75rem);
  left: clamp(1.25rem, 2.5vw, 1.75rem);
  z-index: 100;
  display: block;
  width: clamp(60px, 7vw, 88px);
  height: auto;
  transition: transform 0.25s ease-out;
}
.brand img {
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 3px 10px rgba(0,0,0,0.6));
}
.brand:hover, .brand:focus-visible { transform: scale(1.06); outline: none; }

/* Draft banner */
.legal-banner {
  background: #F0CC1A;
  color: #0a0a0a;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-align: center;
  padding: 0.85rem 1rem;
  border-bottom: 2px solid #0a0a0a;
}

/* Main content */
.legal {
  max-width: 760px;
  margin: 0 auto;
  padding: 8rem 1.75rem 4rem;
}
.legal__back {
  display: inline-block;
  font-size: 0.7rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(239,237,230,0.55);
  text-decoration: none;
  margin-bottom: 2.5rem;
  transition: color 0.2s ease;
}
.legal__back:hover { color: #F0CC1A; }
.legal__back::before { content: '← '; }

.legal h1 {
  font-family: 'Arial Black', 'Helvetica Neue', system-ui, sans-serif;
  font-weight: 900;
  font-size: clamp(2rem, 5vw, 3rem);
  letter-spacing: 0.05em;
  line-height: 1.1;
  margin: 0 0 0.5rem;
  color: #efede6;
}
.legal__updated {
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(239,237,230,0.4);
  margin: 0 0 3rem;
}

.legal section { margin-bottom: 2.75rem; }
.legal h2 {
  font-family: 'Arial Black', 'Helvetica Neue', system-ui, sans-serif;
  font-weight: 900;
  font-size: clamp(1.05rem, 1.8vw, 1.25rem);
  letter-spacing: 0.04em;
  margin: 0 0 1rem;
  color: #efede6;
}
.legal p, .legal li { color: rgba(239,237,230,0.8); }
.legal p { margin: 0 0 1rem; }
.legal ul { padding-left: 1.25rem; margin: 0 0 1rem; }
.legal li { margin-bottom: 0.4rem; }
.legal a {
  color: #F0CC1A;
  text-decoration: none;
  border-bottom: 1px solid rgba(240,204,26,0.4);
  transition: border-color 0.2s ease;
}
.legal a:hover { border-color: #F0CC1A; }
.legal strong { color: #efede6; font-weight: 700; }

/* Placeholder marker inside text */
.legal .pending {
  background: rgba(240,204,26,0.15);
  color: #F0CC1A;
  padding: 0.05em 0.4em;
  border-radius: 2px;
  font-weight: 700;
  font-size: 0.95em;
  letter-spacing: 0.04em;
}

/* Footer (simplified, no brand bar — back link does the job) */
.legal-footer {
  max-width: 760px;
  margin: 0 auto;
  padding: 2rem 1.75rem 3rem;
  font-size: 0.65rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(239,237,230,0.35);
  border-top: 1px solid rgba(239,237,230,0.06);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
}
.legal-footer nav { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.legal-footer a {
  color: inherit;
  text-decoration: none;
  transition: color 0.2s ease;
}
.legal-footer a:hover { color: #F0CC1A; }