/* El escudo de MATERIUM · tokens de remotion/src/lib/theme.ts (oro = dinero · terracota = persona · lacre = alerta) */

@font-face { font-family: "Courier Prime"; src: local("Courier Prime"), url("fonts/courier-prime-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Courier Prime"; src: local("Courier Prime Bold"), url("fonts/courier-prime-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Libre Baskerville"; src: url("fonts/libre-baskerville-400.woff2") format("woff2"); font-weight: 400 700; font-display: swap; }
@font-face { font-family: "Libre Baskerville"; src: url("fonts/libre-baskerville-400i.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }

:root {
  --carbon: #14100D;
  --sepia: #1E1712;
  --sepia-2: #2A2019;
  --oro: #C9A24B;
  --oro-brillo: #E7C56A;
  --terracota: #C1683C;
  --terracota-claro: #D98257;
  --lacre: #A32E22;
  --lacre-hondo: #6E1B14;
  --pergamino: #F0E6D2;
  --pergamino-apagado: #B8AC93;
  --tinta: #221A14;
  --linea: rgba(240, 230, 210, .14);

  --f-maquina: "American Typewriter", "Courier Prime", "Courier New", monospace;
  --f-serif: Georgia, "Libre Baskerville", "Times New Roman", serif;

  --pad: clamp(1.25rem, 4.5vw, 4rem);
  --ancho: 76rem;
  --radio: 3px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 4.5rem; }
body {
  margin: 0;
  background: var(--carbon);
  color: var(--pergamino);
  font: 400 clamp(1.0625rem, .35vw + 1rem, 1.1875rem)/1.6 var(--f-serif);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
/* grano de película, muy sutil */
body::before {
  content: "";
  position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .9 0 0 0 0 .8 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
img, svg, video, iframe { display: block; max-width: 100%; }
a { color: var(--terracota-claro); text-underline-offset: .18em; }
a:hover { color: var(--pergamino); }
:focus-visible { outline: 2px solid var(--oro-brillo); outline-offset: 3px; }
h1, h2, h3, h4 { font-family: var(--f-serif); font-weight: 700; line-height: 1.12; margin: 0; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
em { font-style: italic; }
[hidden] { display: none !important; }

.skip { position: absolute; left: -999px; top: 0; z-index: 200; padding: .75rem 1rem; background: var(--pergamino); color: var(--tinta); }
.skip:focus { left: 1rem; top: 1rem; }

.kicker {
  font: 700 .8125rem/1.3 var(--f-maquina);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--pergamino-apagado);
  margin-bottom: 1rem;
}
.idx { color: var(--terracota); margin-right: .35em; }

/* ---------- Botones ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  min-height: 3.25rem; padding: .85rem 1.5rem;
  font: 700 .95rem/1.2 var(--f-maquina); letter-spacing: .08em; text-transform: uppercase; text-decoration: none;
  border: 1.5px solid transparent; border-radius: var(--radio); cursor: pointer;
  transition: background-color .2s, color .2s, border-color .2s, transform .2s;
}
.btn:active { transform: translateY(1px); }
.btn--pri { background: var(--terracota); color: var(--carbon); }
.btn--pri:hover { background: var(--terracota-claro); color: var(--carbon); }
.btn--sec { border-color: var(--linea); color: var(--pergamino); background: rgba(20, 16, 13, .35); }
.btn--sec:hover { border-color: var(--pergamino-apagado); color: var(--pergamino); }
.btn--tinta { background: var(--tinta); color: var(--pergamino); }
.btn--tinta:hover { background: var(--lacre-hondo); color: var(--pergamino); }
.btn--ancho { width: 100%; }
.btn[disabled] { opacity: .6; cursor: progress; }

.enlace {
  background: none; border: 0; padding: .25rem 0; cursor: pointer;
  font: 700 .875rem/1.4 var(--f-maquina); letter-spacing: .06em; text-transform: uppercase;
  color: var(--terracota-claro); text-decoration: underline; text-underline-offset: .3em;
}
.enlace:hover { color: var(--pergamino); }

/* ---------- Cabecera ---------- */
.top {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; gap: 1rem;
  padding: .6rem var(--pad);
  background: rgba(20, 16, 13, .86);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--linea);
}
.top__marca { display: flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--pergamino); margin-right: auto; }
.top__marca span { font: 700 1.05rem/1 var(--f-serif); letter-spacing: .22em; }
.top__marca img { width: 44px; height: auto; }
.idioma { display: flex; align-items: center; gap: .15rem; font: 700 .875rem/1 var(--f-maquina); color: var(--pergamino-apagado); }
.idioma a {
  display: inline-grid; place-items: center; min-width: 2.75rem; min-height: 2.75rem;
  color: var(--pergamino-apagado); text-decoration: none; letter-spacing: .1em; border-radius: var(--radio);
}
.idioma a:hover { color: var(--pergamino); }
.idioma a[aria-current="true"] { color: var(--carbon); background: var(--pergamino); }
.top__cta { display: none; }

/* ---------- Hero ---------- */
.hero { position: relative; overflow: hidden; }
.hero__img { display: block; aspect-ratio: 16 / 10; }
.hero__img img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 40%; }
.hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(20,16,13,0) 0%, rgba(20,16,13,0) calc(62.5vw * .35), var(--carbon) calc(62.5vw * .95));
}
.hero__cuerpo { position: relative; z-index: 2; padding: 0 var(--pad) 3.5rem; margin-top: -2.75rem; max-width: 46rem; }
.hero .kicker { text-shadow: 0 1px 8px var(--carbon); }
.hero h1 { font-size: clamp(2.15rem, 6.4vw + .4rem, 4.6rem); letter-spacing: -.01em; margin-bottom: 1.25rem; }
.hero h1 em { color: var(--terracota-claro); }
.hero__lead { font-size: clamp(1.05rem, .5vw + 1rem, 1.3rem); color: var(--pergamino); opacity: .9; max-width: 36rem; margin-bottom: 1.75rem; }
.hero__ctas { display: flex; flex-wrap: wrap; gap: .75rem; margin-bottom: 1.75rem; }
.hero__ctas .btn { flex: 1 1 13rem; }
.hero__sello {
  position: absolute; z-index: 3; top: .8rem; left: .8rem;
  font: 700 .7rem/1 var(--f-maquina); letter-spacing: .26em; text-transform: uppercase;
  color: #E05A47; border: 2px solid #E05A47; padding: .45rem .6rem .4rem .8rem;
  transform: rotate(-7deg); background: rgba(20,16,13,.6);
}
.estreno { font: 700 .8125rem/1.5 var(--f-maquina); letter-spacing: .1em; text-transform: uppercase; color: var(--pergamino-apagado); }
.estreno__punto { display: inline-block; vertical-align: .05em; margin-right: .6rem; width: .55rem; height: .55rem; border-radius: 50%; background: var(--lacre); box-shadow: 0 0 0 4px rgba(163,46,34,.25); animation: latido 1.8s ease-in-out infinite; }
.estreno__cd { color: var(--pergamino); }
@keyframes latido { 50% { box-shadow: 0 0 0 8px rgba(163,46,34,0); } }

/* ---------- Secciones ---------- */
.sec { padding: clamp(4rem, 9vw, 7.5rem) var(--pad); max-width: var(--ancho); margin: 0 auto; }
.sec h2 { font-size: clamp(1.85rem, 3.6vw + .6rem, 3.25rem); max-width: 22ch; }
.sec h2::after { content: ""; display: block; width: 3.5rem; height: 3px; background: var(--terracota); margin-top: 1.1rem; }
.sec__cab { margin-bottom: 2.25rem; }
.sec__lead { margin-top: 1.25rem; max-width: 40rem; color: var(--pergamino-apagado); font-size: 1.08em; }
.meta { font: 400 .875rem/1.5 var(--f-maquina); letter-spacing: .04em; color: var(--pergamino-apagado); }
.firma { margin-top: 3rem; font: italic 400 clamp(1.15rem, 1.2vw + .8rem, 1.6rem)/1.4 var(--f-serif); color: var(--pergamino-apagado); max-width: 30ch; }
.firma::before { content: "— "; color: var(--terracota); }

/* ---------- Reproductor ---------- */
.player { position: relative; aspect-ratio: 16 / 9; background: #000; border: 1px solid var(--linea); box-shadow: 0 30px 80px -30px rgba(0,0,0,.9); }
.player video, .player iframe { width: 100%; height: 100%; border: 0; background: #000; }
.player__facade { position: absolute; inset: 0; padding: 0; border: 0; background: #000; cursor: pointer; color: inherit; }
.player__facade img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease, filter .3s; }
.player__facade:hover img { transform: scale(1.015); filter: brightness(1.08); }
.player__play {
  position: absolute; left: 50%; top: 50%; width: clamp(4rem, 9vw, 5.75rem); aspect-ratio: 1; translate: -50% -50%;
  border-radius: 50%; background: rgba(20,16,13,.72); border: 2px solid var(--pergamino);
  transition: background-color .2s, transform .2s;
}
.player__play::after {
  content: ""; position: absolute; left: 54%; top: 50%; translate: -50% -50%;
  border-style: solid; border-width: .8em 0 .8em 1.3em; border-color: transparent transparent transparent var(--pergamino);
  font-size: clamp(.8rem, 1.6vw, 1.05rem);
}
.player__facade:hover .player__play { background: var(--terracota); transform: scale(1.06); }
.player__pronto { display: none; }
.player__facade.is-pronto { cursor: default; }
.player__facade.is-pronto .player__play { display: none; }
.player__facade.is-pronto img { filter: grayscale(.5) brightness(.55); }
.player__facade.is-pronto .player__pronto {
  display: block; position: absolute; left: 50%; top: 50%; translate: -50% -50%; white-space: nowrap;
  font: 700 .875rem/1 var(--f-maquina); letter-spacing: .14em; text-transform: uppercase;
  padding: .7rem 1rem; background: rgba(20,16,13,.85); border: 1px solid var(--linea);
}
.trailer__pie { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem 1.5rem; margin-top: 1rem; }

/* ---------- Aviso anti-recuperación ---------- */
.aviso {
  position: relative; overflow: hidden;
  display: grid; gap: 1.5rem;
  padding: clamp(3.5rem, 8vw, 6.5rem) var(--pad);
  background:
    radial-gradient(120% 90% at 85% 0%, rgba(255,255,255,.06), transparent 60%),
    linear-gradient(160deg, var(--lacre) 0%, var(--lacre-hondo) 100%);
  color: var(--pergamino);
}
.aviso__sello svg { width: clamp(5rem, 12vw, 8.5rem); height: auto; filter: drop-shadow(0 10px 18px rgba(0,0,0,.45)); transform: rotate(-9deg); }
.aviso__cuerpo { max-width: 58rem; }
.aviso .kicker, .aviso .idx { color: rgba(240,230,210,.8); }
.aviso h2 { font-size: clamp(2rem, 4.6vw + .5rem, 4.1rem); line-height: 1.08; margin-bottom: 1.5rem; }
.aviso h2 strong { display: block; margin-top: .4em; font: 700 .6em/1.25 var(--f-maquina); letter-spacing: .02em; text-transform: uppercase; color: #FFD9C9; }
.aviso p { max-width: 44rem; font-size: 1.05em; }
.aviso__que { margin-top: 1.25rem; padding-left: 1rem; border-left: 3px solid rgba(240,230,210,.6); font-weight: 700; }

/* ---------- Alertas + ficha (pergamino) ---------- */
.alertas { display: grid; gap: 2.5rem; }
.alertas__manual { margin-top: 2rem; width: 100%; height: auto; border: 1px solid var(--linea); mask-image: linear-gradient(180deg, #000 70%, transparent); -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent); }

.ficha {
  position: relative;
  background: var(--pergamino);
  color: var(--tinta);
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border-radius: var(--radio);
  box-shadow: 0 2px 0 rgba(0,0,0,.25), 0 30px 60px -25px rgba(0,0,0,.8);
  background-image: linear-gradient(180deg, rgba(120,90,50,.05), rgba(120,90,50,.12));
}
.ficha::before {
  content: ""; position: absolute; top: -.6rem; left: 1.5rem; width: 6.5rem; height: 1.2rem;
  background: rgba(240,230,210,.55); transform: rotate(-3deg); box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.ficha .kicker { color: #6B5A45; }
.ficha .idx { color: var(--lacre); }
.ficha h2 { font-size: clamp(1.75rem, 2.5vw + .8rem, 2.6rem); }
.ficha h2::after { content: ""; display: block; width: 3rem; height: 3px; background: var(--terracota); margin-top: .9rem; }
.ficha__lead { margin: 1rem 0 1.75rem; color: #4A3C2E; }
.ficha a { color: var(--lacre); }

.form { display: grid; gap: 1.1rem; }
.fila { display: grid; gap: 1.1rem; }
.campo { display: grid; gap: .4rem; min-width: 0; border: 0; margin: 0; padding: 0; }
.campo > label, .campo legend { font: 700 .8125rem/1.35 var(--f-maquina); letter-spacing: .08em; text-transform: uppercase; color: #3B2F24; }
.campo input:not([type=checkbox]):not([type=radio]), .campo select, .campo textarea {
  width: 100%; min-height: 3rem; padding: .7rem .85rem;
  font: 400 1rem/1.4 var(--f-serif); color: var(--tinta);
  background: #FBF6EA; border: 1.5px solid #B9A989; border-radius: var(--radio);
  transition: border-color .15s, box-shadow .15s;
}
.campo textarea { resize: vertical; min-height: 8rem; }
.campo input::placeholder, .campo textarea::placeholder { color: #8A7B66; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--tinta); box-shadow: 0 0 0 3px rgba(193,104,60,.35); }
.campo [aria-invalid] { border-color: var(--lacre) !important; background: #FFF1EC !important; }
.campo__error { font: 700 .8125rem/1.3 var(--f-maquina); color: var(--lacre); min-height: 0; }
.campo__error:empty { display: none; }
.campo--check { grid-template-columns: auto 1fr; align-items: start; gap: .25rem .7rem; }
.campo--check .campo__error { grid-column: 2; }
.campo--check > label { font: 400 .95rem/1.45 var(--f-serif); letter-spacing: 0; text-transform: none; color: #3B2F24; }
.campo input[type=checkbox], .campo input[type=radio], .check input { width: 1.35rem; height: 1.35rem; margin: .1rem 0 0; accent-color: var(--lacre); }
.campo--radios { gap: .6rem; }
.campo--radios legend { margin-bottom: .5rem; }
.campo.campo--radios > label { display: flex; gap: .7rem; align-items: start; font: 400 .95rem/1.45 var(--f-serif); letter-spacing: 0; text-transform: none; color: #3B2F24; }
.form__nota { font: 400 .8125rem/1.4 var(--f-maquina); color: #5E4F3E; text-align: center; }
.form__nota--lacre { color: var(--lacre); font-weight: 700; }
.form__canal { justify-self: center; color: var(--lacre); }
.form__error { font: 700 .875rem/1.4 var(--f-maquina); color: var(--lacre); }
.form__error:empty { display: none; }
.form__ok { display: grid; gap: .75rem; padding: 1rem 0; outline: none; }
.form__ok-t { font: 700 clamp(1.4rem, 2vw + .8rem, 2rem)/1.15 var(--f-serif); }
.form__ok-t::before { content: "✓"; display: inline-grid; place-items: center; width: 2.2rem; height: 2.2rem; margin-right: .6rem; border-radius: 50%; background: var(--lacre); color: var(--pergamino); font-size: 1.1rem; vertical-align: .15em; }
.form__demo { font: 400 .8125rem/1.4 var(--f-maquina); padding: .6rem .8rem; background: rgba(163,46,34,.08); border-left: 3px solid var(--lacre); }
.trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Guía: el Manual del Engaño ---------- */
.guia { margin-top: clamp(3.5rem, 7vw, 5.5rem); }
.guia__cab { display: grid; gap: .6rem; margin-bottom: 1.75rem; max-width: 40rem; }
.guia h3 { font-size: clamp(1.5rem, 2vw + .9rem, 2.2rem); }
.guia__cab p { color: var(--pergamino-apagado); }
.leyes, .leyes-bloq { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.ley { display: grid; grid-template-columns: 7.5rem 1fr; gap: 1rem; padding: 1rem; background: var(--sepia); border: 1px solid var(--linea); border-radius: var(--radio); }
.ley img { width: 100%; height: auto; align-self: start; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 2px; }
.ley__n {
  display: inline-block; font: 700 .75rem/1 var(--f-maquina); letter-spacing: .12em; text-transform: uppercase;
  color: var(--pergamino); background: var(--terracota); padding: .35rem .5rem; border-radius: 2px; margin-bottom: .55rem;
}
.ley__caso { font: 400 .8125rem/1.35 var(--f-maquina); color: var(--pergamino-apagado); margin-bottom: .4rem; }
.ley__texto { font: 700 1.05rem/1.35 var(--f-serif); }
.ley__senal { position: relative; margin-top: .8rem; padding-top: .75rem; border-top: 1px dashed var(--linea); font-size: .92rem; }
.ley__senal-t { font: 700 .72rem/1 var(--f-maquina); letter-spacing: .14em; text-transform: uppercase; color: var(--terracota-claro); margin-bottom: .4rem; }
.ley__senal-txt { color: var(--pergamino-apagado); }
/* bloqueada: tachón de expediente hasta suscribirse */
.guia:not(.is-desbloqueada) .ley__senal-txt { color: transparent; background: repeating-linear-gradient(180deg, #0B0907 0 1.05em, transparent 1.05em 1.5em); border-radius: 1px; user-select: none; }
.ley__oculta { position: absolute; left: 0; bottom: .1rem; font: 700 .72rem/1.2 var(--f-maquina); letter-spacing: .08em; text-transform: uppercase; color: var(--pergamino); background: var(--sepia); padding: .2rem .4rem .2rem 0; }
.guia.is-desbloqueada .ley__oculta { display: none; }
.guia.is-desbloqueada .ley { animation: revela .6s ease both; }
@keyframes revela { from { background: var(--sepia-2); } }
.guia__sub { margin: 2.5rem 0 1rem; font: 700 .8125rem/1 var(--f-maquina); letter-spacing: .14em; text-transform: uppercase; color: var(--pergamino-apagado); }
.leyes-bloq { grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.ley-b { position: relative; overflow: hidden; border-radius: var(--radio); border: 1px solid var(--linea); background: var(--sepia); }
.ley-b img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; filter: grayscale(.85) blur(2px) brightness(.7); transform: scale(1.08); }
.ley-b__n { position: absolute; top: .45rem; left: .5rem; font: 700 .72rem/1 var(--f-maquina); letter-spacing: .1em; text-transform: uppercase; color: var(--pergamino); }
.ley-b__n::before { content: ""; display: inline-block; width: .65rem; height: .8rem; margin-right: .35rem; vertical-align: -.08rem; background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 12'%3E%3Cpath d='M2.5 5V3.5a2.5 2.5 0 0 1 5 0V5' fill='none' stroke='%23B8AC93' stroke-width='1.4'/%3E%3Crect x='1' y='5' width='8' height='7' rx='1' fill='%23B8AC93'/%3E%3C/svg%3E"); }
.ley-b__t { padding: .5rem .55rem .6rem; font: 400 .72rem/1.3 var(--f-maquina); color: var(--pergamino-apagado); }

/* ---------- Clase gratuita ---------- */
.clase { display: grid; gap: 2.25rem; }
.lecciones { list-style: none; counter-reset: l; margin: 1.75rem 0 0; padding: 0; display: grid; gap: 1.25rem; }
.lecciones li { counter-increment: l; position: relative; padding-left: 3.25rem; color: var(--pergamino-apagado); }
.lecciones li::before {
  content: counter(l); position: absolute; left: 0; top: .05rem; width: 2.2rem; height: 2.2rem; display: grid; place-items: center;
  font: 700 1rem/1 var(--f-maquina); color: var(--pergamino); border: 1.5px solid var(--terracota); border-radius: 50%;
}
.lecciones strong { display: block; color: var(--pergamino); font-size: 1.08rem; margin-bottom: .2rem; }
.clase__video .meta { margin-top: .9rem; }

/* ---------- Checklist ---------- */
.check { border: 0; margin: 0; padding: 0; display: grid; gap: .6rem; }
.check legend { font: 700 .8125rem/1.4 var(--f-maquina); letter-spacing: .1em; text-transform: uppercase; color: var(--pergamino-apagado); margin-bottom: 1rem; }
.check__item {
  display: grid; grid-template-columns: auto 1fr; gap: .9rem; align-items: start; cursor: pointer;
  padding: 1rem 1.1rem; background: var(--sepia); border: 1px solid var(--linea); border-radius: var(--radio);
  transition: border-color .15s, background-color .15s;
}
.check__item:hover { border-color: rgba(240,230,210,.3); }
.check__item:has(input:checked) { border-color: var(--lacre); background: #2A1512; }
.check__item:has(input:focus-visible) { outline: 2px solid var(--oro-brillo); outline-offset: 2px; }
.check__res { margin-top: 1.5rem; padding: 1rem 1.25rem; font: 700 1rem/1.45 var(--f-maquina); border: 1px dashed var(--linea); color: var(--pergamino-apagado); }
.check__res.is-alerta { background: var(--lacre); border: 0; color: var(--pergamino); }

/* ---------- Formularios de caso y sugerencia ---------- */
.sec--forms { padding-top: 0; }
.forms { display: grid; gap: 3rem; }
.ficha--sug { background-color: #E7DBC2; }

/* ---------- FAQ ---------- */
.faq { display: grid; border-top: 1px solid var(--linea); max-width: 52rem; }
.faq details { border-bottom: 1px solid var(--linea); }
.faq summary, .pie summary {
  list-style: none; cursor: pointer; position: relative;
  padding: 1.2rem 2.5rem 1.2rem 0; font: 700 1.08rem/1.4 var(--f-serif);
}
.faq summary::-webkit-details-marker, .pie summary::-webkit-details-marker { display: none; }
.faq summary::after, .pie summary::after {
  content: "+"; position: absolute; right: .25rem; top: 50%; translate: 0 -50%;
  font: 400 1.6rem/1 var(--f-maquina); color: var(--terracota); transition: rotate .2s;
}
.faq details[open] summary::after, .pie details[open] summary::after { rotate: 45deg; }
.faq details p { padding: 0 0 1.4rem; color: var(--pergamino-apagado); max-width: 44rem; }

/* ---------- Pie ---------- */
.pie { padding: 4rem var(--pad) 3rem; border-top: 1px solid var(--linea); background: #0F0C0A; text-align: left; }
.pie__logo { width: 88px; height: auto; opacity: .9; }
.pie__firma { margin: 1.25rem 0 2rem; font: italic 400 1.35rem/1.3 var(--f-serif); color: var(--pergamino-apagado); }
.pie__legal { display: grid; gap: 0; max-width: 52rem; border-top: 1px solid var(--linea); }
.pie details { border-bottom: 1px solid var(--linea); }
.pie summary { font: 700 .875rem/1.4 var(--f-maquina); letter-spacing: .1em; text-transform: uppercase; color: var(--pergamino); }
.pie details p { padding-bottom: 1.25rem; font-size: .9rem; color: var(--pergamino-apagado); }
.pie__copy { margin-top: 2rem; font: 400 .8125rem/1 var(--f-maquina); color: #7D7262; }

/* ---------- Permiso de vídeo, confirmación, pie legal ---------- */
.player__permiso {
  position: absolute; inset: 0; z-index: 2; display: grid; place-content: center; justify-items: center; gap: 1rem;
  padding: 1.25rem; text-align: center; background: rgba(20,16,13,.88);
}
.player__permiso p { max-width: 30rem; font-size: .95rem; color: var(--pergamino); }
.form__ko { display: grid; gap: .5rem; padding: .9rem 1rem; margin-bottom: 1rem; background: rgba(163,46,34,.1); border-left: 3px solid var(--lacre); }
.form__ko-t { font: 700 1.1rem/1.3 var(--f-serif); color: var(--lacre); }
.pie__nota { font-size: .9rem; color: var(--pergamino-apagado); max-width: 44rem; }
.pie__enlaces { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; align-items: center; margin-top: 1.5rem; }
.pie__enlaces a { font: 700 .8125rem/2.75rem var(--f-maquina); letter-spacing: .1em; text-transform: uppercase; color: var(--pergamino); text-decoration: none; }
.pie__enlaces a:hover { color: var(--terracota-claro); }
.pie__enlaces .enlace { font-size: .8125rem; min-height: 2.75rem; }

/* ---------- Página legal ---------- */
.legal { max-width: 46rem; margin: 0 auto; padding: 2.5rem var(--pad) 5rem; }
.legal h1 { font-size: clamp(2rem, 3vw + 1rem, 3rem); margin: 1.25rem 0 .5rem; }
.legal__indice { display: grid; gap: .25rem; margin: 2rem 0 1rem; padding: 1.25rem; background: var(--sepia); border: 1px solid var(--linea); }
.legal__indice .kicker { margin-bottom: .5rem; }
.legal__indice a { color: var(--pergamino); }
.legal section { padding-top: 2.5rem; scroll-margin-top: 4.5rem; }
.legal h2 { font-size: clamp(1.6rem, 1.5vw + 1rem, 2.1rem); padding-bottom: .75rem; border-bottom: 3px solid var(--terracota); margin-bottom: 1.25rem; }
.legal h3 { font: 700 .875rem/1.4 var(--f-maquina); letter-spacing: .1em; text-transform: uppercase; color: var(--terracota-claro); margin: 1.75rem 0 .6rem; }
.legal p, .legal li, .legal dd { color: #E5D9C2; font-size: 1rem; }
.legal p + p { margin-top: .8rem; }
.legal ul { padding-left: 1.2rem; display: grid; gap: .6rem; }
.legal code { font: .875em var(--f-maquina); color: var(--pergamino); }
.datos { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1.25rem; margin: 1rem 0; padding: 1rem 1.25rem; background: var(--sepia); border: 1px solid var(--linea); }
.datos dt { font: 700 .8125rem/1.6 var(--f-maquina); letter-spacing: .06em; text-transform: uppercase; color: var(--pergamino-apagado); }
.datos dd { margin: 0; }
.tabla-scroll, .legal .tabla { display: block; overflow-x: auto; }
.legal .tabla { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: .9rem; }
.legal .tabla th, .legal .tabla td { text-align: left; vertical-align: top; padding: .65rem .75rem; border-bottom: 1px solid var(--linea); min-width: 8rem; }
.legal .tabla th { font: 700 .75rem/1.3 var(--f-maquina); letter-spacing: .08em; text-transform: uppercase; color: var(--pergamino-apagado); }
.legal section .btn { margin-top: 1.5rem; }
.pie--legal { text-align: center; }

/* ---------- Consentimiento de cookies (vanilla-cookieconsent) con la marca ---------- */
#cc-main {
  --cc-font-family: Georgia, "Libre Baskerville", serif;
  --cc-bg: #1E1712;
  --cc-primary-color: #F0E6D2;
  --cc-secondary-color: #B8AC93;
  --cc-btn-primary-bg: #C1683C; --cc-btn-primary-color: #14100D; --cc-btn-primary-border-color: #C1683C;
  --cc-btn-primary-hover-bg: #D98257; --cc-btn-primary-hover-color: #14100D; --cc-btn-primary-hover-border-color: #D98257;
  --cc-btn-secondary-bg: #2A2019; --cc-btn-secondary-color: #F0E6D2; --cc-btn-secondary-border-color: rgba(240,230,210,.2);
  --cc-btn-secondary-hover-bg: #3A2C22; --cc-btn-secondary-hover-color: #F0E6D2; --cc-btn-secondary-hover-border-color: rgba(240,230,210,.4);
  --cc-btn-border-radius: 3px; --cc-modal-border-radius: 4px;
  --cc-separator-border-color: rgba(240,230,210,.14);
  --cc-toggle-on-bg: #C1683C; --cc-toggle-off-bg: #5a4d40; --cc-toggle-on-knob-bg: #F0E6D2; --cc-toggle-off-knob-bg: #F0E6D2;
  --cc-toggle-enabled-icon-color: #14100D; --cc-toggle-disabled-icon-color: #14100D;
  --cc-cookie-category-block-bg: #2A2019; --cc-cookie-category-block-border: rgba(240,230,210,.14);
  --cc-cookie-category-block-hover-bg: #33271F; --cc-cookie-category-block-hover-border: rgba(240,230,210,.2);
  --cc-cookie-category-expanded-block-bg: #2A2019; --cc-cookie-category-expanded-block-hover-bg: #33271F;
  --cc-footer-bg: #14100D; --cc-footer-color: #B8AC93; --cc-footer-border-color: rgba(240,230,210,.14);
  --cc-link-color: #D98257;
  --cc-overlay-bg: rgba(10,8,6,.75);
}
#cc-main .cm__btn, #cc-main .pm__btn { font-family: var(--f-maquina); letter-spacing: .06em; text-transform: uppercase; font-size: .8rem; }
#cc-main .cm__title, #cc-main .pm__title { font-family: Georgia, "Libre Baskerville", serif; }

/* ---------- Tablet ---------- */
@media (min-width: 600px) {
  .fila { grid-template-columns: 1fr 1fr; }
  .leyes-bloq { grid-template-columns: repeat(5, 1fr); }
  .ley { grid-template-columns: 9.5rem 1fr; }
  .top__cta { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 1rem; font: 700 .8125rem/1 var(--f-maquina); letter-spacing: .1em; text-transform: uppercase; text-decoration: none; color: var(--carbon); background: var(--terracota); border-radius: var(--radio); }
  .top__cta:hover { background: var(--terracota-claro); color: var(--carbon); }
}

/* ---------- Escritorio ---------- */
@media (min-width: 900px) {
  .hero { min-height: min(92vh, 56rem); display: flex; align-items: flex-end; }
  .hero__img { position: absolute; inset: 0 0 0 28%; aspect-ratio: auto; }
  .hero__img img { object-position: 55% 35%; }
  .hero::after { background: linear-gradient(90deg, var(--carbon) 26%, rgba(20,16,13,.85) 38%, rgba(20,16,13,0) 62%), linear-gradient(0deg, var(--carbon) 0%, rgba(20,16,13,0) 30%); }
  .hero__cuerpo { margin-top: 0; padding-top: 8rem; padding-bottom: clamp(4rem, 8vh, 6rem); max-width: calc(44rem + var(--pad)); }
  .hero__ctas .btn { flex: 0 0 auto; }
  .hero__sello { top: 15%; bottom: auto; left: 49%; font-size: 1.05rem; padding: .6rem .8rem .55rem 1.1rem; }

  .sec--trailer { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 4rem; align-items: start; }
  .sec--trailer .sec__cab { grid-row: span 3; position: sticky; top: 6rem; }
  .sec--trailer .firma { grid-column: 2; }

  .aviso { grid-template-columns: auto 1fr; gap: 3rem; align-items: start; padding-left: max(var(--pad), calc((100vw - var(--ancho)) / 2 + var(--pad))); }

  .alertas { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 4rem; align-items: start; }
  .alertas .ficha { position: sticky; top: 6rem; margin-top: 3.25rem; }
  .leyes { grid-template-columns: 1fr 1fr; }
  .ley:first-child { grid-column: span 2; grid-template-columns: 16rem 1fr; padding: 1.25rem; }
  .ley:first-child img { aspect-ratio: 16 / 10; }
  .ley:first-child .ley__texto { font-size: 1.35rem; }
  .leyes-bloq { grid-template-columns: repeat(9, 1fr); }

  .clase { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 4rem; align-items: center; }
  .clase__video { order: -1; }

  .sec--check { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 4rem; align-items: start; }
  .sec--check .sec__cab { position: sticky; top: 6rem; grid-row: span 2; }
  .check__res { grid-column: 2; }

  .forms { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 2.5rem; align-items: start; }
  .ficha--sug { margin-top: 4rem; transform: rotate(.6deg); }
  .ficha--caso { transform: rotate(-.35deg); }

  .sec--faq { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 4rem; }

  .pie { display: grid; grid-template-columns: auto 1fr; column-gap: 3rem; align-items: start; padding-left: max(var(--pad), calc((100vw - var(--ancho)) / 2 + var(--pad))); }
  .pie__logo { grid-row: span 3; }
  .pie__firma { margin-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}