/* ============================================================
   MorettiFlix — sistema de diseño (web pública)
   Tema "Premium naranja": fondo naranja quemado con degradado
   y textura diagonal (como los afiches de precios), tarjetas
   marrón oscuro translúcidas, acentos crema/durazno y CTAs
   crema con texto marrón. Instrument Sans.
   ============================================================ */

/* ---------- Tipografía real del tema (Instrument Sans) ---------- */
@font-face{font-family:"Instrument Sans";src:url("../fonts/InstrumentSans-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url("../fonts/InstrumentSans-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url("../fonts/InstrumentSans-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url("../fonts/InstrumentSans-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}

:root{
  color-scheme:dark;
  --bg:#7d3309;            /* naranja quemado base */
  --bg-deep:#571f04;       /* borde/abajo del degradado */
  --bg-alt:rgba(30,11,2,.22);
  --ink:#ffffff;           /* titulares */
  --text:#f9e9d8;          /* cuerpo, crema claro */
  --muted:#e8c39c;         /* atenuado cálido */
  --accent:#FF9E4F;        /* naranja durazno de marca */
  --accent-ink:#3c1503;    /* texto sobre acento/crema */
  --cream:#ffd9a8;         /* crema de los afiches */
  --cream-2:#f2b26b;
  --border:rgba(255,216,171,.16);
  --border-strong:rgba(255,216,171,.34);

  --surface:rgba(43,16,3,.5);        /* tarjeta translúcida */
  --surface-strong:rgba(34,12,2,.78);
  --glass:rgba(43,16,3,.55);
  --glass-strong:rgba(34,12,2,.8);
  --glass-border:rgba(255,216,171,.22);

  --radius:10px;
  --radius-lg:18px;
  --radius-xl:24px;
  --pill:9999px;

  --shadow-sm:0 4px 16px rgba(24,8,0,.25);
  --shadow:0 10px 35px rgba(24,8,0,.32);
  --shadow-lg:0 24px 60px -18px rgba(15,5,0,.55);
  --shadow-accent:0 18px 44px -14px rgba(255,158,79,.38);

  --container:1320px;
  --container-xl:1480px;
  --gut:clamp(1.4rem,4vw,2.4rem);

  --ff:"Instrument Sans",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --lh:1.714;
  --ls-head:-0.034em;

  --t:.4s cubic-bezier(.3,1,.3,1);
  --t-fast:.25s ease;
}

body{
  margin:0;font-family:var(--ff);font-size:15px;line-height:var(--lh);
  color:var(--text);background:var(--bg-deep);-webkit-font-smoothing:antialiased;overflow-x:hidden;
}

/* Fondo del afiche: degradado radial cálido + rayas diagonales sutiles (fijo al viewport). */
body::before{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:
    radial-gradient(120% 80% at 50% -8%,#d06a20 0%,#b04c12 42%,transparent 78%),
    linear-gradient(180deg,#9c430f 0%,#7d3309 46%,#571f04 100%);
}
/* Rejilla de ingeniería (cuadros) con viñeta radial, como iptvrebrandscr. */
body::after{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(circle at 50% 30%,#000 45%,transparent 90%);
          mask-image:radial-gradient(circle at 50% 30%,#000 45%,transparent 90%);
}
/* Campo de estrellas: puntos tenues en un pseudo de 1px; dos bandas idénticas
   separadas 800px para que la deriva lenta hacia arriba haga bucle perfecto. */
.starfield{
  position:fixed;top:0;left:0;width:1px;height:1px;z-index:-1;pointer-events:none;
  border-radius:50%;background:transparent;
  box-shadow:
    180px  60px rgba(255,244,230,.6),  640px 220px rgba(255,244,230,.42),
    980px 120px rgba(255,244,230,.55), 1280px 360px rgba(255,244,230,.38),
    320px 440px rgba(255,244,230,.48), 1520px 540px rgba(255,244,230,.42),
    760px 640px rgba(255,244,230,.48), 1120px 720px rgba(255,244,230,.32),
    120px 300px rgba(255,244,230,.42), 1700px 180px rgba(255,244,230,.38),
    180px  860px rgba(255,244,230,.6),  640px 1020px rgba(255,244,230,.42),
    980px 920px rgba(255,244,230,.55), 1280px 1160px rgba(255,244,230,.38),
    320px 1240px rgba(255,244,230,.48),1520px 1340px rgba(255,244,230,.42),
    760px 1440px rgba(255,244,230,.48),1120px 1520px rgba(255,244,230,.32),
    120px 1100px rgba(255,244,230,.42),1700px 980px rgba(255,244,230,.38);
  animation:noir-stars 140s linear infinite;
}
@keyframes noir-stars{to{transform:translateY(-800px)}}
/* Resplandor ambiental animado (solo transform: barato para el compositor). */
.glow-orb{position:fixed;z-index:-1;pointer-events:none;width:56vw;height:56vw;min-width:420px;min-height:420px;
  left:50%;top:-18vw;border-radius:50%;filter:blur(10px);
  background:radial-gradient(closest-side,rgba(255,171,88,.2),transparent 70%);
  animation:orb-drift 16s ease-in-out infinite alternate}
@keyframes orb-drift{
  from{transform:translate(-70%,0) scale(1)}
  to{transform:translate(-30%,6vh) scale(1.15)}
}

img{max-width:100%;display:block;height:auto}
a{color:var(--ink);text-decoration:none;transition:color var(--t-fast)}
a:hover{color:var(--cream)}
h1,h2,h3,h4{font-family:var(--ff);color:var(--ink);font-weight:600;line-height:1.12;letter-spacing:var(--ls-head);margin:0 0 .5em}
p{margin:0 0 1em}
.accent{color:var(--accent)}
.muted{color:var(--muted)}
strong{color:var(--ink)}

.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gut)}
.container--xl{max-width:var(--container-xl)}
.full-bleed{width:100vw;margin-inline:calc(50% - 50vw)}
.section{padding:clamp(2.6rem,5vw,4.4rem) 0}
/* Banda alterna sin cortes: funde a transparente arriba y abajo. */
.section--alt{background:linear-gradient(180deg,transparent,rgba(30,11,2,.3) 22%,rgba(30,11,2,.3) 78%,transparent)}
.section--tight{padding:clamp(1.9rem,4vw,2.8rem) 0}

.skip-link{position:absolute;left:-999px;top:0;background:var(--cream);color:var(--accent-ink);padding:.6rem 1rem;z-index:200;border-radius:0 0 8px 0}
.skip-link:focus{left:0}
:focus-visible{outline:2px solid var(--cream);outline-offset:2px;border-radius:6px}

/* ---------- Botones (píldora crema estilo afiche, con shine) ---------- */
.btn{
  --bg-btn:linear-gradient(180deg,var(--cream),var(--cream-2));--fg:var(--accent-ink);--bd:transparent;
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-weight:700;font-size:15px;letter-spacing:calc(var(--ls-head) + .01em);line-height:1;
  padding:16.5px 30px;border-radius:var(--pill);border:1px solid var(--bd);
  background:var(--bg-btn);color:var(--fg);cursor:pointer;transition:.25s;white-space:nowrap;
  box-shadow:0 10px 26px -10px rgba(20,7,0,.55);
}
.btn::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg)}
.btn:hover::after{animation:shine .75s cubic-bezier(.01,.56,1,1)}
@keyframes shine{to{left:140%}}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 34px -12px rgba(20,7,0,.65);color:var(--accent-ink);filter:brightness(1.05)}
.btn:active{transform:translateY(0)}
.btn--accent{--bg-btn:linear-gradient(180deg,var(--cream),var(--cream-2));--bd:transparent;--fg:var(--accent-ink)}
.btn--light{--bg-btn:rgba(255,216,171,.08);--fg:#fff;--bd:var(--border-strong);box-shadow:none;backdrop-filter:blur(6px)}
.btn--light:hover{background:rgba(255,216,171,.18);color:#fff;border-color:var(--cream)}
.btn--wa{--bg-btn:#25d366;--bd:#25d366;--fg:#08361a}
.btn--wa:hover{background:#1fb855;border-color:#1fb855;color:#08361a;filter:none}
.btn--lg{padding:19px 36px;font-size:16px}
.btn--block{display:flex;width:100%}

.chip{display:inline-flex;align-items:center;gap:.45em;padding:.55em 1.05em;border-radius:var(--pill);background:var(--surface);border:1px solid var(--border);font-size:.86rem;font-weight:600;color:var(--ink);transition:border-color var(--t-fast),transform var(--t-fast)}
.chip:hover{transform:translateY(-2px);border-color:var(--border-strong);color:var(--ink)}
.chip--wa{background:#25d366;color:#08361a;border-color:transparent}
.chip--wa:hover{color:#08361a}

.eyebrow{display:inline-flex;align-items:center;gap:.55em;font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);margin-bottom:1rem}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--accent)}

.section-head{max-width:48rem;margin-bottom:clamp(1.6rem,3vw,2.3rem)}
.section-head--center{margin-inline:auto;text-align:center}
.section-head h2{font-size:clamp(1.9rem,4vw,2.9rem);color:#fff;text-shadow:0 2px 18px rgba(30,10,0,.35)}
.section-head p{color:var(--muted);font-size:1.05rem;margin:0}

/* ---------- Capa glass reutilizable ---------- */
.glass{background:var(--glass);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border:1px solid var(--glass-border);box-shadow:var(--shadow)}

/* ---------- Header (píldora de vidrio flotante, estilo iptvrebrandscr) ---------- */
.site-header{position:sticky;top:0;z-index:100;background:transparent;padding:.55rem .625rem 0;pointer-events:none}
.site-header>*{pointer-events:auto}
.site-header__inner{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;height:66px;
  max-width:1240px;padding-inline:.8rem 1rem;border-radius:var(--pill);
  background:rgba(46,17,4,.6);
  backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(255,216,171,.14);box-shadow:0 10px 34px -12px rgba(15,5,0,.6);
  transition:background var(--t),border-color var(--t)}
.site-header.is-stuck .site-header__inner{background:rgba(38,14,3,.86);border-color:rgba(255,216,171,.28)}
.site-header__left{display:flex;align-items:center;min-width:0}
.site-header__right{display:flex;align-items:center;justify-content:flex-end;gap:.35rem}
.brand{display:inline-flex;align-items:center;gap:.55rem}
.brand:hover{color:var(--ink)}
.brand__mark{border-radius:50%;box-shadow:0 0 0 2px rgba(255,216,171,.25)}
.brand__name{font-weight:700;font-size:1.3rem;letter-spacing:var(--ls-head);color:#fff;white-space:nowrap}

/* Navegación centrada con subrayado animado */
.site-nav .nav-menu{display:flex;align-items:center;justify-content:center;list-style:none;margin:0;padding:0}
.site-nav .nav-menu>li{padding:0 17px}
.site-nav .nav-menu>li>a{position:relative;display:inline-block;font-weight:600;font-size:15px;line-height:25px;color:#fff;padding:4px 0;white-space:nowrap}
.site-nav .nav-menu>li>a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--cream);transition:width var(--t)}
.site-nav .nav-menu>li>a:hover{color:var(--cream)}
.site-nav .nav-menu>li>a:hover::after,.site-nav .nav-menu>li.is-active>a::after{width:100%}

.header-phone{display:inline-flex;align-items:center;gap:.45rem;color:#fff;font-weight:600;font-size:.92rem;white-space:nowrap}
.header-phone svg{width:18px;height:18px;color:#25d366;flex:0 0 auto}
.header-phone:hover{color:var(--cream)}
.site-cta{margin-left:.7rem;padding:11px 24px}

.nav-toggle{display:none;background:var(--surface);border:1px solid var(--border);border-radius:11px;width:46px;height:44px;cursor:pointer;padding:0;flex-direction:column;gap:5px;align-items:center;justify-content:center;margin-left:.3rem}
.nav-toggle span{width:20px;height:2px;background:#fff;border-radius:2px;transition:transform var(--t),opacity var(--t)}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- Hero (cálido + glass) ---------- */
.hero{position:relative;padding:clamp(2.6rem,5vw,4.4rem) 0 clamp(2rem,4vw,3rem);overflow:hidden}
.hero__inner{max-width:66rem;margin-inline:auto;text-align:center}
.hero h1{font-size:clamp(2.5rem,6vw,4.6rem);font-weight:700;margin-bottom:.3em;letter-spacing:-.035em}
.hero__lead{font-size:clamp(1.05rem,2vw,1.25rem);color:var(--text);max-width:42rem;margin:0 auto 1.6rem}
.hero__cta{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;margin-bottom:1.3rem}
.hero__chips{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;padding:0;margin:0}
.hero__chips li{display:inline-flex;align-items:center;gap:.45rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--pill);padding:.45em 1em;font-size:.9rem;font-weight:600;color:#fff;box-shadow:var(--shadow-sm)}
.hero__chips svg{width:16px;height:16px;color:var(--cream);flex:0 0 auto}
.hero__note{color:var(--muted);font-size:.92rem;text-align:center;margin-top:1.1rem}
.hero__note b{color:var(--ink)}

/* Carrusel de clips en vivo (full-bleed) */
.hero__clips{margin-top:clamp(2rem,4vw,3rem);display:flex;flex-direction:column;gap:1rem;-webkit-mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.hero__track{display:flex;gap:1rem;width:max-content;animation:clip-scroll 60s linear infinite;will-change:transform}
.hero__track--rev{animation-direction:reverse}
.hero__clips:hover .hero__track{animation-play-state:paused}
@keyframes clip-scroll{to{transform:translateX(-50%)}}
.clip{position:relative;flex:0 0 auto;width:clamp(220px,22vw,300px);aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:linear-gradient(150deg,#30110a,#180701);border:1px solid var(--border);box-shadow:var(--shadow);display:block}
.clip::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 85% at 28% 18%,rgba(255,158,79,.2),transparent 55%)}
.clip__cat{position:absolute;top:.7rem;left:.7rem;z-index:2;font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);padding:.25em .6em;border-radius:var(--pill);backdrop-filter:blur(4px)}
.clip__live{position:absolute;top:.7rem;right:.7rem;z-index:2;font-size:.64rem;font-weight:800;letter-spacing:.06em;color:var(--accent-ink);background:var(--cream);padding:.28em .6em;border-radius:var(--pill)}
.clip__badge{position:absolute;top:.7rem;right:.7rem;z-index:2;font-size:.64rem;font-weight:800;letter-spacing:.06em;color:#111;background:#fff;padding:.28em .6em;border-radius:var(--pill)}
.clip__play{position:absolute;inset:0;z-index:2;display:grid;place-items:center}
.clip__play svg{width:46px;height:46px;color:#fff;opacity:.95;filter:drop-shadow(0 4px 14px rgba(0,0,0,.55));transition:transform var(--t)}
.clip:hover .clip__play svg{transform:scale(1.14)}
.clip__meta{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:1.6rem .85rem .75rem;background:linear-gradient(transparent,rgba(15,4,0,.85));color:#fff;font-weight:600;font-size:.92rem;line-height:1.25}
@media (prefers-reduced-motion:reduce){.hero__track{animation:none;flex-wrap:wrap;justify-content:center;width:auto}.hero__clips{-webkit-mask:none;mask:none}}

.hero__visual{position:relative}
.hero__screen{background:linear-gradient(165deg,#3a1505,#1c0902);border:1px solid var(--border-strong);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:.9rem;color:#fff;aspect-ratio:4/3.1;display:flex;flex-direction:column;overflow:hidden}
.hero__screen-top{display:flex;align-items:center;padding:.1rem .2rem .85rem}
.hero__live{margin-left:auto;display:inline-flex;align-items:center;font-size:.72rem;font-weight:800;letter-spacing:.08em;background:var(--cream);color:var(--accent-ink);padding:.3em .8em;border-radius:var(--pill)}
.hero__screen-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.7rem}
.hero__screen-main img{width:clamp(86px,18vw,118px);height:auto;border-radius:50%}
.hero__screen-main p{margin:0;color:var(--muted);font-size:.92rem;max-width:26ch}
.hero__rail{display:flex;gap:.45rem;flex-wrap:wrap;justify-content:center;padding-top:.85rem;border-top:1px solid var(--border)}
.hero__rail span{background:rgba(255,216,171,.08);border:1px solid var(--border);border-radius:var(--pill);padding:.4em .85em;font-size:.78rem;color:var(--text)}

/* ---------- Hero de marca (home): copy + cascada de pósters ---------- */
.hero-brand{position:relative;padding:clamp(2.8rem,6vw,5rem) 0 clamp(2rem,4vw,3rem);overflow:hidden}
.hero-brand__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.hero-brand__grid--solo{grid-template-columns:1fr;text-align:center;max-width:52rem;margin-inline:auto}
.hero-brand__grid--solo .hero__cta,.hero-brand__grid--solo .hero__chips{justify-content:center}
.hero-brand__title{font-size:clamp(2.3rem,5vw,3.9rem);font-weight:700;line-height:1.06;letter-spacing:-.03em;color:#fff;margin:0 0 .55em;text-shadow:0 2px 22px rgba(30,10,0,.4)}
.hero-brand__sub{color:var(--text);font-size:clamp(1.02rem,1.7vw,1.18rem);max-width:34rem;line-height:1.6;margin:0 0 1.6rem}
.hero-brand__cta{justify-content:flex-start;margin-bottom:1.4rem}
.hero-brand__chips{justify-content:flex-start}
.hero-brand__visual{position:relative;height:clamp(300px,30vw,430px)}
.hero-brand__visual::before{content:"";position:absolute;inset:-12%;background:radial-gradient(55% 55% at 50% 45%,rgba(255,180,100,.24),transparent 70%);z-index:0}
.hero-poster{position:absolute;width:44%;aspect-ratio:2/3;object-fit:cover;border-radius:16px;border:1px solid rgba(255,216,171,.3);box-shadow:0 26px 54px -20px rgba(15,5,0,.8);transition:transform var(--t);z-index:1}
.hero-poster:nth-of-type(1){left:1%;top:8%;transform:rotate(-7deg)}
.hero-poster:nth-of-type(2){left:28%;top:0;transform:rotate(1deg);z-index:2;width:47%}
.hero-poster:nth-of-type(3){left:58%;top:10%;transform:rotate(7deg)}
.hero-poster:hover{transform:rotate(0) translateY(-8px) scale(1.03);z-index:3}
.hero-brand__badge{position:absolute;z-index:3;bottom:2%;left:50%;transform:translateX(-50%) rotate(-2deg);background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink);font-weight:800;font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;padding:.5em 1.1em;border-radius:8px;box-shadow:var(--shadow-accent);white-space:nowrap}
@media (max-width:980px){
  .hero-brand__grid{grid-template-columns:1fr}
  .hero-brand__visual{height:clamp(250px,56vw,340px);max-width:520px;margin-inline:auto;width:100%}
}

/* ---------- Billboard (hero estilo Netflix / HBO) ---------- */
/* Sin fondo propio ni corte inferior: la foto se funde con el fondo naranja. */
.bb{position:relative;isolation:isolate;min-height:clamp(440px,64vh,660px);display:flex;align-items:flex-end;overflow:hidden;background:transparent;color:#fff}
.bb--plain{background:radial-gradient(90% 120% at 50% -20%,rgba(30,11,2,.55),transparent 75%)}
.bb__slides{position:absolute;inset:0;z-index:-2;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 48%,transparent 96%);mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 48%,transparent 96%)}
.bb__slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease}
.bb__slide.is-active{opacity:1}
.bb__slide picture{display:contents}
.bb__slide img{width:100%;height:100%;object-fit:cover;object-position:center 18%}
.bb__slide.is-active img{animation:bb-pan 18s ease-in-out infinite alternate}
@keyframes bb-pan{from{transform:scale(1.06)}to{transform:scale(1.16) translateY(-2%)}}
@keyframes bb-soft{from{transform:scale(1.09)}to{transform:scale(1)}}
.bb__rotor{position:relative}
.bb__textslide{position:absolute;left:0;right:0;top:0;opacity:0;transform:translateY(10px);transition:opacity .6s ease,transform .6s ease;pointer-events:none}
.bb__textslide.is-active{position:relative;opacity:1;transform:none;pointer-events:auto}
/* Scrim con tinte cálido: funde la foto con el fondo naranja del sitio. */
.bb__scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(30,10,2,.9) 0%,rgba(30,10,2,.62) 40%,rgba(30,10,2,.2) 72%,transparent 100%),linear-gradient(0deg,rgba(60,22,5,.5),rgba(38,14,3,.28) 48%,transparent 78%);-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 97%);mask-image:linear-gradient(180deg,#000 55%,transparent 97%)}
.bb__inner{padding:clamp(2.4rem,6vw,5rem) 0;max-width:46rem}
.eyebrow--light{color:var(--cream)}
.bb__title{color:#fff;font-size:clamp(2.2rem,5.5vw,4.2rem);font-weight:700;letter-spacing:-.035em;margin:0 0 .5rem;text-shadow:0 2px 24px rgba(0,0,0,.45)}
.bb__meta{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-bottom:1rem;font-size:.92rem;color:#f0dcc8}
.bb__tag{background:var(--cream);color:var(--accent-ink);font-weight:800;font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;padding:.25em .7em;border-radius:var(--pill)}
.bb__rate{color:#ffd35c;font-weight:600}
.bb__on{border-left:1px solid rgba(255,255,255,.25);padding-left:.7rem}
.bb__overview{color:#f4e3d2;font-size:clamp(1rem,1.6vw,1.12rem);max-width:38rem;margin-bottom:1.6rem;line-height:1.6}
.bb .hero__cta{margin-bottom:1.4rem;justify-content:flex-start}
.bb__chips{justify-content:flex-start}
.bb__chips li{background:rgba(30,10,2,.45);border-color:rgba(255,216,171,.25);color:#fff;box-shadow:none;backdrop-filter:blur(6px)}
.bb__chips svg{color:var(--cream)}

/* ---------- Filas de pósters (TMDB) ---------- */
.rails{padding-bottom:clamp(2rem,4vw,3rem)}
.rail{margin-bottom:clamp(1.6rem,3.4vw,2.4rem)}
.rail__h{font-size:1.15rem;font-weight:700;color:var(--ink);margin:0 0 .8rem}
/* Cabecera de fila: chip crema + línea que se desvanece */
.rail__head{display:flex;align-items:center;gap:1rem;margin-bottom:.9rem}
.rail__head::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--border-strong),transparent)}
.rail__chip{display:inline-flex;align-items:center;background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink);font-weight:800;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;padding:.5em 1.1em;border-radius:var(--pill);box-shadow:0 6px 18px -8px rgba(20,7,0,.5);white-space:nowrap}
.rail__viewport{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
/* Carrusel inerte: no se puede clicar ni pausar (sigue girando siempre). */
.rail__track{display:flex;gap:.9rem;width:max-content;animation:clip-scroll 85s linear infinite;will-change:transform;pointer-events:none}
.rail__track--rev{animation-direction:reverse}
.poster{position:relative;flex:0 0 auto;width:clamp(124px,12.5vw,172px);aspect-ratio:2/3;border-radius:14px;overflow:hidden;background:#2a0f03;border:1px solid rgba(255,216,171,.22);box-shadow:0 14px 30px -14px rgba(15,5,0,.65);display:block;transition:transform var(--t),box-shadow var(--t),border-color var(--t)}
.poster:hover{transform:translateY(-5px) scale(1.04);box-shadow:var(--shadow-lg);border-color:rgba(255,216,171,.5)}
.poster img{width:100%;height:100%;object-fit:cover}
.poster__t{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:1.6rem .65rem .6rem;background:linear-gradient(transparent,rgba(15,4,0,.9));color:#fff;font-size:.78rem;font-weight:600;line-height:1.25;opacity:0;transition:opacity var(--t)}
.poster:hover .poster__t{opacity:1}
.poster__play{position:absolute;inset:0;display:grid;place-items:center;opacity:0;background:rgba(0,0,0,.28);transition:opacity var(--t)}
.poster__play svg{width:42px;height:42px;color:#fff}
.poster{cursor:default}
@media (prefers-reduced-motion:reduce){.bb__slide img{animation:none}.rail__track{animation:none}.rail__viewport{overflow-x:auto}}

.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:var(--surface);backdrop-filter:blur(8px);box-shadow:var(--shadow-sm);margin-top:clamp(1.5rem,3vw,2.2rem)}
.stats__item{padding:1.5rem 1.2rem;text-align:center;border-right:1px solid var(--border)}
.stats__item:last-child{border-right:0}
.stats__num{font-weight:700;font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:var(--ls-head);
  background:linear-gradient(180deg,#fff,var(--cream));-webkit-background-clip:text;background-clip:text;color:transparent}
.stats__label{color:var(--muted);font-size:.86rem;margin-top:.2rem}

/* ---------- Selector de moneda (CR ₡ / US $) ---------- */
.cur-switch{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.45rem;margin-bottom:1.2rem}
.cur-switch__label{font-size:.82rem;font-weight:600;color:var(--muted);margin-right:.2rem}
.cur-switch__opt{display:inline-flex;align-items:center;gap:.45em;padding:.5em 1.05em;border-radius:var(--pill);border:1px solid var(--border);background:var(--surface);font-size:.88rem;font-weight:700;color:#fff;transition:border-color var(--t-fast),background var(--t-fast),transform var(--t-fast)}
.cur-switch__opt:hover{transform:translateY(-2px);border-color:var(--border-strong);color:#fff}
.cur-switch__opt.is-active{background:linear-gradient(180deg,var(--cream),var(--cream-2));border-color:transparent;color:var(--accent-ink)}
.cur-switch__flag{font-size:1.05em;line-height:1}

/* ---------- Planes ---------- */
.pricing-toggle{display:flex;justify-content:center;margin-bottom:2.4rem}
.seg{display:inline-flex;background:var(--surface-strong);border:1px solid var(--border);border-radius:var(--pill);padding:5px;gap:2px;flex-wrap:wrap;justify-content:center;box-shadow:var(--shadow-sm)}
.seg button{border:0;background:transparent;color:var(--muted);font-weight:600;font-size:.92rem;padding:.6em 1.15em;border-radius:var(--pill);cursor:pointer;transition:color var(--t-fast),background var(--t)}
.seg button .save{font-size:.72rem;color:var(--accent);margin-left:.35em}
.seg button.is-active{background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink)}
.seg button.is-active .save{color:var(--accent-ink);opacity:.85}

.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1.4rem;align-items:start}

/* Grupos de nivel: Premium protagonista, Ultra secundario */
.plans-tier{margin-top:clamp(2.2rem,4vw,3.2rem)}
.plans-tier:first-of-type{margin-top:0}
.plans-tier__head{display:flex;align-items:baseline;gap:.7rem 1rem;flex-wrap:wrap;margin-bottom:1.2rem}
.plans-tier__head h3{font-size:clamp(1.4rem,2.4vw,1.8rem);margin:0;color:#fff}
.plans-tier__head p{margin:0;color:var(--muted);font-size:.97rem;flex-basis:100%;max-width:52rem}
.plans-tier__tag{display:inline-flex;align-items:center;background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink);font-weight:800;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;padding:.35em .9em;border-radius:var(--pill);transform:translateY(-2px)}
/* Premium: halo cálido detrás de las tarjetas para que sea el foco */
.plans-tier--premium{position:relative}
.plans-tier--premium::before{content:"";position:absolute;inset:-8% -4%;z-index:-1;pointer-events:none;background:radial-gradient(60% 70% at 50% 45%,rgba(255,190,110,.14),transparent 70%)}
/* Green (tier plus): plegado y discreto, con acento verde */
.plans-tier--plus .plans{grid-template-columns:repeat(auto-fit,minmax(270px,400px));justify-content:center}
.plans-fold{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);backdrop-filter:blur(8px);transition:border-color var(--t)}
.plans-fold[open]{border-color:rgba(37,211,102,.35)}
.plans-fold summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:.9rem;padding:1.05rem 1.4rem;flex-wrap:wrap}
.plans-fold summary::-webkit-details-marker{display:none}
.plans-fold__name{font-weight:800;font-size:1.15rem;color:#8be79e}
.plans-fold__desc{color:var(--muted);font-size:.92rem;flex:1;min-width:220px}
.plans-fold__cta{display:inline-flex;align-items:center;gap:.4em;font-weight:700;font-size:.82rem;color:var(--accent-ink);background:linear-gradient(180deg,#9ef0b0,#5fd57e);padding:.5em 1.05em;border-radius:var(--pill);white-space:nowrap}
.plans-fold__cta::after{content:"▾";transition:transform var(--t)}
.plans-fold[open] .plans-fold__cta::after{transform:rotate(180deg)}
.plans-fold .plans{padding:0 1.4rem 1.4rem}
.plans-fold__tools{padding:.2rem 1.4rem .4rem}
.plans-fold__tools .cur-switch{margin-bottom:.6rem;justify-content:flex-start}
.plans-tier--plus .plan{border-color:rgba(37,211,102,.2)}
.plans-tier--plus .plan:hover{border-color:rgba(37,211,102,.45)}
.plans-tier--plus .plan__stat b{background:linear-gradient(180deg,#fff,#8be79e);-webkit-background-clip:text;background-clip:text}
.plans-tier--plus .plan__meta .badge-dev{color:#8be79e;background:rgba(37,211,102,.1)}
/* Ultra: tarjetas más sobrias con detalle dorado */
.plans-tier--ultra .plan{background:linear-gradient(180deg,rgba(44,19,5,.45),rgba(32,12,3,.55));border-color:rgba(245,158,11,.22)}
.plans-tier--ultra .plan:hover{border-color:rgba(245,158,11,.45)}
.plans-tier--ultra .plans-tier__head h3{color:#ffd35c}
.plans-tier--ultra .plan__meta .badge-dev{color:#ffd35c;background:rgba(245,158,11,.1)}
.plan{position:relative;background:linear-gradient(180deg,rgba(54,20,4,.72),rgba(38,14,3,.82));border:1px solid var(--border);border-radius:var(--radius-xl);padding:2rem;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px);transition:transform var(--t),box-shadow var(--t),border-color var(--t);display:flex;flex-direction:column}
.plan:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:var(--border-strong)}
.plan--popular{border-color:rgba(255,216,171,.55);box-shadow:var(--shadow-accent),var(--shadow-lg);transform:translateY(-6px)}
.plan--popular::before{content:attr(data-badge);position:absolute;top:-13px;left:50%;transform:translateX(-50%) rotate(-2deg);background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink);font-weight:800;font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;padding:.45em 1.05em;border-radius:6px;box-shadow:var(--shadow-accent);white-space:nowrap}
.plan__tier{font-weight:700;font-size:1.5rem;color:#fff}
.plan__tagline{color:var(--muted);font-size:.95rem;margin:.35rem 0 1.4rem;min-height:2.6em}
.plan__price{display:flex;align-items:baseline;gap:.45rem;flex-wrap:wrap}
.plan__price .amount{font-weight:700;font-size:2.7rem;color:#fff;line-height:1;letter-spacing:var(--ls-head);text-shadow:0 2px 14px rgba(20,7,0,.4)}
.plan__price .per{color:var(--muted);font-size:.95rem}
.plan__price .was{color:var(--muted);text-decoration:line-through;font-size:1rem}
.plan__permonth{color:var(--muted);font-size:.85rem;margin:.5rem 0 0}
.plan__save{display:inline-block;margin-top:.7rem;margin-right:.4rem;background:rgba(255,216,171,.14);color:var(--cream);font-weight:700;font-size:.8rem;padding:.32em .8em;border-radius:var(--pill)}
.plan__save--hot{background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink)}
.plan__meta{display:flex;align-items:center;gap:.5rem;margin:1.4rem 0 .2rem;font-weight:600;color:#fff}
.plan__meta .badge-dev{background:rgba(255,216,171,.12);border:1px solid var(--border);border-radius:8px;padding:.2em .6em;font-size:.85rem;color:var(--cream)}
.plan__content{color:var(--muted);font-size:.92rem;margin:.5rem 0 1.3rem}
/* Cifras de contenido destacadas (lo que la gente busca) */
.plan__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;margin:.8rem 0 1.2rem;padding:.85rem .5rem;background:rgba(255,216,171,.07);border:1px solid var(--border);border-radius:12px;text-align:center}
.plan__stat b{display:block;font-size:1.24rem;font-weight:800;letter-spacing:-.02em;line-height:1.1;background:linear-gradient(180deg,#fff,var(--cream));-webkit-background-clip:text;background-clip:text;color:transparent}
.plan__stat span{display:block;margin-top:.2rem;font-size:.66rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;line-height:1.25}
.plans-tier--ultra .plan__stat b{background:linear-gradient(180deg,#fff,#ffd35c);-webkit-background-clip:text;background-clip:text}
.plan__stats--lg{max-width:34rem;padding:1.1rem .8rem}
.plan__stats--lg .plan__stat b{font-size:1.7rem}
.plan__stats--lg .plan__stat span{font-size:.74rem}
.plan__perks{list-style:none;padding:0;margin:0 0 1.7rem;display:grid;gap:.65rem}
.plan__perks li{display:flex;gap:.6rem;align-items:flex-start;font-size:.95rem;color:var(--text)}
.plan__perks li::before{content:"";flex:0 0 20px;height:20px;margin-top:1px;background:var(--cream);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z' fill='black'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z' fill='black'/%3E%3C/svg%3E") center/contain no-repeat}
.plan .btn{margin-top:auto}

/* ---------- Detalle de plan ---------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.plan-detail{display:grid;grid-template-columns:1.4fr .9fr;gap:2.4rem;align-items:start}
.plan-detail__main h2{font-size:1.6rem}
.plan-detail__buy{border-radius:var(--radius-xl);padding:1.7rem;position:sticky;top:96px}
.plan-detail__buy .cur-switch{justify-content:flex-start;margin-bottom:1rem}
.buy__head{font-weight:700;font-size:1.2rem;color:#fff;margin-bottom:1rem}
.dur-options{border:0;padding:0;margin:0 0 1.2rem;display:grid;gap:.6rem}
.dur-opt{display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid var(--border);border-radius:var(--radius);padding:.85rem 1rem;cursor:pointer;background:rgba(30,11,2,.4);transition:border-color var(--t-fast),box-shadow var(--t-fast),background var(--t-fast)}
.dur-opt:hover{border-color:var(--border-strong)}
.dur-opt.is-active{border-color:var(--cream);box-shadow:0 0 0 3px rgba(255,216,171,.15);background:rgba(255,216,171,.07)}
.dur-opt input{position:absolute;opacity:0;pointer-events:none}
.dur-opt__info{display:flex;flex-direction:column}
.dur-opt__label{font-weight:600;color:#fff}
.dur-opt__perm{font-size:.82rem;color:var(--muted)}
.dur-opt__price{text-align:right;font-size:.9rem;color:var(--muted);white-space:nowrap}
.dur-opt__price b{color:#fff;font-size:1.15rem}
.dur-opt__price .was{text-decoration:line-through;margin-right:.35rem;font-size:.82rem}
@media (max-width:980px){.plan-detail{grid-template-columns:1fr}.plan-detail__buy{position:static}}

/* ---------- Menú de compartir plan ---------- */
.share-menu{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.7rem;padding:.7rem;background:rgba(30,11,2,.5);border:1px solid var(--border);border-radius:var(--radius-lg)}
.share-item{display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:.7rem .3rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:#fff;font-weight:600;font-size:.78rem;cursor:pointer;transition:transform var(--t-fast),border-color var(--t-fast);text-align:center}
.share-item:hover{transform:translateY(-2px);color:#fff}
.share-item svg{width:22px;height:22px}
.share-item--wa svg{color:#25d366}
.share-item--wa:hover{border-color:rgba(37,211,102,.6)}
.share-item--tg svg{color:#3fa9e0}
.share-item--tg:hover{border-color:rgba(63,169,224,.6)}
.share-item--fb svg{color:#7ea4f5}
.share-item--fb:hover{border-color:rgba(126,164,245,.6)}
.share-item--x svg{color:#fff}
.share-item--x:hover{border-color:var(--border-strong)}
.share-item--mail svg{color:var(--cream)}
.share-item--mail:hover{border-color:var(--border-strong)}
.share-item--copy svg{color:var(--cream)}
.share-item--copy:hover{border-color:var(--border-strong)}

/* ---------- Detalle de plan: enlaces a otros planes ---------- */
.plan-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.8rem;max-width:64rem;margin-inline:auto}
.plan-link{display:flex;align-items:center;justify-content:space-between;gap:.8rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1rem 1.2rem;transition:transform var(--t),border-color var(--t),box-shadow var(--t)}
.plan-link:hover{transform:translateY(-3px);border-color:var(--border-strong);box-shadow:var(--shadow);color:var(--ink)}
.plan-link__info{display:flex;flex-direction:column;min-width:0}
.plan-link__info b{color:#fff;font-size:1rem}
.plan-link__info span{color:var(--muted);font-size:.86rem}
.plan-link__arrow{color:var(--cream);font-size:1.2rem;transition:transform var(--t-fast)}
.plan-link:hover .plan-link__arrow{transform:translateX(4px)}
.plan-link--ultra{border-color:rgba(245,158,11,.25)}
.plan-link--ultra:hover{border-color:rgba(245,158,11,.5)}
.plan-link--plus{border-color:rgba(37,211,102,.2)}
.plan-link--plus:hover{border-color:rgba(37,211,102,.45)}

/* ---------- Pasos / cómo funciona ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;counter-reset:step}
.step{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:2rem 1.8rem;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px);transition:transform var(--t),box-shadow var(--t)}
.step:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.step__icon{width:60px;height:60px;border-radius:16px;background:rgba(255,216,171,.1);border:1px solid var(--border);display:grid;place-items:center;margin-bottom:1.2rem}
.step__icon img{width:32px;height:32px}
.step::after{counter-increment:step;content:"0" counter(step);position:absolute;top:1.6rem;right:1.7rem;font-weight:700;font-size:1.8rem;color:rgba(255,216,171,.22)}
.step h3{font-size:1.2rem}
.step p{color:var(--muted);margin:0;font-size:.96rem}

/* ---------- Confianza ---------- */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.trust__item{display:flex;gap:1rem;align-items:flex-start;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.6rem;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px)}
.trust__item img{width:34px;height:34px;flex:0 0 auto}
.trust__item h3{font-size:1.06rem;margin-bottom:.25em}
.trust__item p{color:var(--muted);margin:0;font-size:.93rem}

/* ---------- Testimonios ---------- */
.testi{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem}
.testi__card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.7rem 1.8rem;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px)}
.testi__top{display:flex;align-items:center;gap:.9rem;margin-bottom:1rem}
.testi__avatar{width:46px;height:46px;border-radius:50%;background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink);display:grid;place-items:center;font-weight:800;font-size:1.15rem;flex:0 0 auto}
.testi__who{flex:1;min-width:0}
.testi__who b{display:block;color:#fff;font-weight:700}
.testi__who span{display:block;color:var(--muted);font-size:.84rem}
.testi__stars{color:#ffd35c;letter-spacing:.08em;font-size:.95rem;flex:0 0 auto;white-space:nowrap}
.testi__body{font-size:1rem;color:var(--text);margin:0;line-height:1.65}

/* ---------- Blog ---------- */
.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}
.card-post{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px);transition:transform var(--t),box-shadow var(--t)}
.card-post:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.card-post__media{aspect-ratio:16/9;background:linear-gradient(135deg,#5d2408,#2e1103);position:relative;overflow:hidden}
.card-post__media img{width:100%;height:100%;object-fit:cover}
.card-post__media .ph{position:absolute;inset:0;display:grid;place-items:center;opacity:.85}
.card-post__media .ph img{width:42%;height:auto}
.card-post__body{padding:1.4rem 1.5rem 1.6rem;display:flex;flex-direction:column;flex:1}
.card-post__cat{align-self:flex-start;font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--cream);margin-bottom:.6rem}
.card-post__body h3{font-size:1.2rem;margin-bottom:.5rem}
.card-post__body h3 a:hover{color:var(--cream)}
.card-post__body p{color:var(--muted);font-size:.94rem;flex:1}
.card-post__meta{color:var(--muted);font-size:.82rem;margin-top:1rem}

.pagination{display:flex;gap:.4rem;justify-content:center;margin-top:2.6rem;flex-wrap:wrap}
.pagination a,.pagination span{min-width:42px;height:42px;display:grid;place-items:center;padding:0 .6rem;border-radius:11px;border:1px solid var(--border);font-weight:600;color:var(--muted);background:var(--surface)}
.pagination a:hover{border-color:var(--cream);color:#fff}
.pagination .is-active{background:linear-gradient(180deg,var(--cream),var(--cream-2));border-color:transparent;color:var(--accent-ink)}

/* ---------- Artículo ---------- */
.article{max-width:760px;margin-inline:auto}
.article__cat{color:var(--cream);font-weight:700;text-transform:uppercase;letter-spacing:.07em;font-size:.78rem}
.article h1{font-size:clamp(1.9rem,4vw,3rem);margin:.5rem 0}
.article__meta{color:var(--muted);font-size:.9rem;display:flex;gap:.7rem;align-items:center;flex-wrap:wrap}
.article__cover{aspect-ratio:16/8;border-radius:var(--radius-lg);overflow:hidden;margin:1.6rem 0 2.2rem;border:1px solid var(--border);background:linear-gradient(135deg,#5d2408,#2e1103)}
.article__cover img{width:100%;height:100%;object-fit:cover}
.article__figure{margin:1.6rem 0 2.2rem}
.article__figure .article__cover{margin:0}
.article__credit{color:var(--muted);font-size:.8rem;margin:.55rem 0 0;text-align:right}
.article__credit a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.article__credit a:hover{color:var(--cream)}
.prose{font-size:1.08rem;color:var(--text);overflow-wrap:break-word;word-wrap:break-word}
.prose iframe,.prose video{max-width:100%}
.prose table{width:100%;border-collapse:collapse;margin:1.5em 0;font-size:.97rem;display:block;max-width:100%;overflow-x:auto}
.prose th,.prose td{border:1px solid var(--border);padding:.6rem .85rem;text-align:left;vertical-align:top}
.prose thead th{background:rgba(255,216,171,.1);font-weight:700;color:#fff;white-space:nowrap}
.prose tbody th{font-weight:600;color:#fff}
.prose tbody tr:nth-child(even){background:rgba(255,255,255,.03)}
.prose h2{font-size:1.6rem;margin:1.9rem 0 .6rem;color:#fff}
.prose h3{font-size:1.25rem;margin:1.4rem 0 .5rem;color:#fff}
.prose p{margin:0 0 1.1em}
.prose a{color:var(--cream);text-decoration:underline;text-underline-offset:3px}
/* Botones dentro de contenido: conservan su color propio, sin subrayado. */
.prose .btn,.lp-content .btn{text-decoration:none;color:var(--fg)}
.prose ul,.prose ol{margin:0 0 1.2em;padding-left:1.3em}
.prose li{margin:.4em 0}
.prose blockquote{border-left:3px solid var(--cream);margin:1.4em 0;padding:.4em 0 .4em 1.2em;color:var(--muted)}
.prose h4{font-size:1.1rem;margin:1.2rem 0 .4rem;color:#fff}
.prose img{max-width:100%;height:auto;border-radius:10px;margin:1.2em 0}
.prose code{background:rgba(0,0,0,.3);border:1px solid var(--border);border-radius:4px;padding:.08em .35em;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9em}
.prose pre{background:#200b02;color:#f4e3d2;border-radius:10px;padding:16px 18px;overflow:auto;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9em;margin:1.4em 0;border:1px solid var(--border)}
.prose pre code{background:none;border:0;padding:0;color:inherit}
.prose hr{border:0;border-top:1px solid var(--border-strong);margin:2em 0}

/* ---------- FAQ / acordeón ---------- */
.accordion{display:grid;gap:.7rem;max-width:820px;margin-inline:auto}
.accordion details{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px);transition:border-color var(--t)}
.accordion details[open]{border-color:var(--border-strong)}
.accordion summary{cursor:pointer;list-style:none;padding:1.15rem 1.4rem;font-weight:600;font-size:1.05rem;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.accordion summary::-webkit-details-marker{display:none}
.accordion summary::after{content:"+";font-size:1.5rem;color:var(--cream);transition:transform var(--t);line-height:1}
.accordion details[open] summary::after{transform:rotate(45deg)}
.accordion .acc__body{padding:0 1.4rem 1.3rem;color:var(--text)}
.faq-cat{font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;margin:2rem auto .9rem;max-width:820px}

/* ---------- Tutoriales ---------- */
.tut-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:1.4rem}
.tut{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.9rem;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px);transition:transform var(--t),box-shadow var(--t)}
.tut:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.tut__head{display:flex;align-items:center;gap:.9rem;margin-bottom:1rem}
.tut__ico{width:50px;height:50px;border-radius:13px;background:rgba(255,216,171,.1);border:1px solid var(--border);display:grid;place-items:center;color:var(--cream);flex:0 0 auto}
.tut__ico svg{width:26px;height:26px}
.tut h3{font-size:1.15rem;margin:0;color:#fff}
.tut__intro{color:var(--muted);font-size:.93rem;margin:.2rem 0 1rem}
.tut ol{margin:0;padding-left:1.2em;display:grid;gap:.55rem}
.tut ol li{font-size:.94rem}
.tut ol li::marker{color:var(--cream);font-weight:700}
/* Tutoriales: tarjetas de directorio */
.tut-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px);transition:transform var(--t),box-shadow var(--t);color:var(--ink)}
.tut-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);color:var(--ink)}
.tut-card__media{position:relative;display:block;aspect-ratio:16/9;background:rgba(30,11,2,.5);overflow:hidden}
.tut-card__logo{position:absolute;top:.6rem;left:.6rem;background:#fff;border-radius:9px;padding:.34rem .58rem;box-shadow:var(--shadow-sm);display:inline-flex;align-items:center}
.tut-card__logo img{height:20px;width:auto;max-width:84px;object-fit:contain;display:block}
.tut-card__media--logo{display:grid;place-items:center;background:#fff;padding:1rem}
/* Más específico que «.tut-card__media img» para que el logo no se recorte (contain, no cover). */
.tut-card__media.tut-card__media--logo img{height:auto;width:auto;max-height:48px;max-width:74%;object-fit:contain}
.tut-brandlogo{display:grid;place-items:center;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:2.2rem 1rem;margin:0 0 1.4rem}
.tut-brandlogo img{height:56px;width:auto;max-width:70%;object-fit:contain}
.tut-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.tut-card__body{display:flex;flex-direction:column;gap:.55rem;padding:1.4rem 1.5rem 1.6rem}
.tut-card__head{display:flex;align-items:center;gap:.8rem}
.tut-card__head h3{font-size:1.1rem;margin:0}
.tut-card__head .tut__ico{width:44px;height:44px}
.tut-card__head .tut__ico svg{width:24px;height:24px}
.tut-card__intro{color:var(--muted);font-size:.92rem;line-height:1.5}
.tut-card__cta{margin-top:auto;font-weight:700;font-size:.9rem;color:var(--cream);display:inline-flex;gap:.4em;align-items:center}
.tut-card__cta span{transition:transform var(--t-fast)}
.tut-card:hover .tut-card__cta span{transform:translateX(3px)}
/* Tutoriales: página individual */
.crumbs{font-size:.85rem;color:var(--muted);margin-bottom:1rem}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--cream)}
.tut-app{display:inline-flex;align-items:center;gap:.6em;margin-top:1rem;padding:.5em 1em;background:var(--surface);border:1px solid var(--border);border-radius:var(--pill);font-size:.92rem}
.tut-app__label{color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.tut-article{font-size:1.05rem;line-height:1.7;color:var(--text)}
.tut-article h2{font-size:1.4rem;margin:2.2rem 0 .6rem}
.tut-article h2:first-child{margin-top:0}
.tut-article h3{font-size:1.15rem;margin:1.6rem 0 .5rem}
.tut-article p{margin:0 0 1rem}
.tut-article figure{margin:1.2rem 0}
.tut-article img{max-width:100%;height:auto;border-radius:var(--radius);border:1px solid var(--border);display:block;box-shadow:var(--shadow-sm);margin:1.2rem 0}
.tut-article figcaption{color:var(--muted);font-size:.85rem;text-align:center;margin-top:.5rem}
.tut-steps{padding-left:1.3em;display:grid;gap:1rem;margin:0}
.tut-steps li{font-size:1.05rem;line-height:1.6}
.tut-steps li::marker{color:var(--cream);font-weight:700}
.tut-note{margin-top:2rem;padding:1.3rem 1.5rem;background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--cream);border-radius:var(--radius);font-size:.95rem;display:flex;flex-direction:column;gap:.3rem}
.tut-note strong{color:#fff}
.tut-others{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center}
.tut-others a{display:inline-flex;align-items:center;gap:.55em;background:var(--surface);border:1px solid var(--border);border-radius:var(--pill);padding:.45em 1.1em .45em .5em;font-weight:600;font-size:.9rem;box-shadow:var(--shadow-sm);transition:border-color var(--t-fast),transform var(--t-fast)}
.tut-others a:hover{transform:translateY(-2px);border-color:var(--border-strong);color:var(--ink)}
.tut-others .tut__ico{width:32px;height:32px;border-radius:9px}
.tut-others .tut__ico svg{width:18px;height:18px}

/* ---------- Contacto: tarjetas de canal ---------- */
.contact-cards{display:grid;gap:.8rem}
.contact-card{display:flex;align-items:center;gap:1rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.1rem 1.3rem;transition:transform var(--t),border-color var(--t),box-shadow var(--t)}
.contact-card:hover{transform:translateY(-3px);border-color:var(--border-strong);box-shadow:var(--shadow);color:var(--ink)}
.contact-card__ic{display:grid;place-items:center;width:48px;height:48px;flex:0 0 auto;border-radius:13px;background:rgba(255,216,171,.1);color:var(--cream)}
.contact-card__ic svg{width:24px;height:24px}
.contact-card--wa .contact-card__ic{background:rgba(37,211,102,.15);color:#25d366}
.contact-card--wa:hover{border-color:rgba(37,211,102,.5)}
.contact-card--tg .contact-card__ic{background:rgba(34,158,217,.15);color:#3fa9e0}
.contact-card__info{display:flex;flex-direction:column;min-width:0}
.contact-card__info b{color:#fff;font-size:1.02rem}
.contact-card__info span{color:var(--muted);font-size:.9rem;overflow-wrap:anywhere}
.contact-card__tag{margin-left:auto;background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink);font-weight:700;font-size:.7rem;letter-spacing:.04em;text-transform:uppercase;padding:.4em .8em;border-radius:var(--pill);white-space:nowrap}
.contact-notes{list-style:none;padding:0;margin:1.3rem 0 0;display:grid;gap:.6rem}
.contact-notes li{display:flex;align-items:center;gap:.6rem;color:var(--text);font-size:.95rem}
.contact-notes__ic{display:inline-flex;color:var(--cream)}
.contact-notes__ic svg{width:19px;height:19px}
@media (max-width:560px){.contact-card__tag{display:none}}

/* ---------- Formularios ---------- */
.form{display:grid;gap:1.1rem}
.field label{display:block;font-weight:600;font-size:.92rem;margin-bottom:.4rem;color:#fff}
.field input,.field select,.field textarea{
  width:100%;background:rgba(20,7,1,.45);border:1px solid var(--border);border-radius:var(--radius);
  color:var(--text);font:inherit;padding:.85rem 1.1rem;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.field input::placeholder,.field textarea::placeholder{color:rgba(232,195,156,.55)}
.field textarea{min-height:140px;resize:vertical;border-radius:var(--radius)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--cream);box-shadow:0 0 0 3px rgba(255,216,171,.14)}
.field .err{color:#ffb3a6;font-size:.84rem;margin-top:.35rem}
.field--row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
/* Selector de plan en píldoras (sin <select>: evita el popup nativo mal posicionado) */
.field__title{display:block;font-weight:600;font-size:.92rem;margin-bottom:.4rem;color:#fff}
.choice{display:flex;flex-wrap:wrap;gap:.5rem}
.choice label{display:inline-flex;align-items:center;margin:0;cursor:pointer;padding:.55em .95em;border:1px solid var(--border);border-radius:var(--pill);background:var(--surface);font-size:.9rem;font-weight:600;color:#fff;transition:border-color var(--t-fast),background var(--t-fast),color var(--t-fast)}
.choice label:hover{border-color:var(--border-strong)}
.choice label:focus-within{box-shadow:0 0 0 3px rgba(255,216,171,.2)}
.choice input{position:absolute;opacity:0;width:0;height:0}
.choice label:has(input:checked){background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink);border-color:transparent}
.notice{padding:1rem 1.2rem;border-radius:12px;border:1px solid;font-weight:500}
.notice--ok{background:rgba(38,178,86,.16);border-color:rgba(38,178,86,.5);color:#a4f0bd}
.notice--err{background:rgba(229,50,20,.16);border-color:rgba(229,50,20,.45);color:#ffc0b3}

/* ---------- Bloques compartidos ---------- */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.panel-cta{position:relative;overflow:hidden;background:linear-gradient(135deg,#3c1605,#22190b);color:#fff;border-radius:var(--radius-xl);padding:clamp(2.4rem,5vw,3.8rem);text-align:center;box-shadow:var(--shadow-lg);border:1px solid var(--border)}
.panel-cta::before{content:"";position:absolute;width:440px;height:440px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,158,79,.22),transparent);top:-200px;right:-140px}
.panel-cta h2{color:#fff;font-size:clamp(1.7rem,4vw,2.6rem);position:relative}
.panel-cta p{color:rgba(255,240,224,.8);max-width:38rem;margin-inline:auto;position:relative}
.panel-cta .hero__cta{justify-content:center;position:relative}

.page-hero{padding:clamp(2.6rem,6vw,4.5rem) 0 0;position:relative;overflow:hidden}
.page-hero h1{font-size:clamp(2rem,5vw,3.4rem);text-shadow:0 2px 18px rgba(30,10,0,.35)}
.page-hero p{color:var(--text);font-size:1.1rem;max-width:44rem}
.breadcrumbs{color:var(--muted);font-size:.86rem;margin-bottom:1rem}
.breadcrumbs a{color:var(--muted)}
.breadcrumbs a:hover{color:var(--cream)}
.empty{text-align:center;color:var(--muted);padding:4rem 1rem}

/* ---------- WhatsApp flotante ---------- */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:90;width:58px;height:58px;border-radius:50%;background:#25d366;display:grid;place-items:center;box-shadow:0 14px 30px -8px rgba(37,211,102,.6);transition:transform var(--t)}
.wa-float::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(37,211,102,.7);animation:wa-pulse 2.6s ease-out infinite}
@keyframes wa-pulse{0%{transform:scale(1);opacity:1}70%,100%{transform:scale(1.55);opacity:0}}
.wa-float:hover{transform:scale(1.08)}
.wa-float img,.wa-float svg{width:30px;height:30px}

/* ---------- Logos de métodos de pago ---------- */
.paylogos{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;justify-content:center}
.paylogos__label{font-size:.8rem;color:var(--muted);font-weight:600;margin-right:.3rem}
.paylogos__chip{display:inline-flex;align-items:center;gap:.3rem;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:8px;padding:0 .6rem;height:34px;box-shadow:var(--shadow-sm)}
.pl-visa{color:#1434CB;font-weight:800;font-style:italic;letter-spacing:.03em;font-size:.95rem}
.pl-amex{background:#2E77BC;color:#fff;font-weight:800;font-size:.7rem;padding:.18em .4em;border-radius:3px;letter-spacing:.03em}
.pl-paypal{font-weight:800;font-style:italic;font-size:.92rem}
.pl-paypal span:first-child{color:#003087}
.pl-paypal span:last-child{color:#0070E0}
.pl-bn{color:#181A20;font-weight:700;font-size:.85rem}
.pl-btc{color:#F7931A;font-weight:800;font-size:1.05rem}
.pl-cr{font-weight:700;font-size:.85rem;color:#181A20}
.pl-card{color:#334155;font-weight:700;font-size:.8rem}
.pl-sinpe{color:#005CA9;font-weight:800;font-size:.82rem;letter-spacing:.02em}
.pl-sinpe span{color:#6FBE44}
.pl-wink{color:#E6007E;font-weight:800;font-size:1rem;letter-spacing:-.02em;text-transform:lowercase}

/* ---------- Landing: canales + ancla de precio ---------- */
.chan-chips{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;padding:0;margin:0 auto 1.8rem;max-width:60rem}
.chan-chips li{background:var(--surface);border:1px solid var(--border);border-radius:var(--pill);padding:.45em 1em;font-weight:600;font-size:.9rem;color:#fff;box-shadow:var(--shadow-sm)}
.chan-chips__more{background:linear-gradient(180deg,var(--cream),var(--cream-2))!important;color:var(--accent-ink)!important;border-color:transparent!important}
.cable-anchor{max-width:48rem;margin-inline:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:1.6rem 1.8rem;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px);text-align:center}
.cable-anchor__vs{display:flex;align-items:center;justify-content:center;gap:1.4rem;margin-bottom:1rem;flex-wrap:wrap}
.cable-anchor__cable,.cable-anchor__us{display:flex;flex-direction:column;gap:.2rem}
.cable-anchor__cable span,.cable-anchor__us span{font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.cable-anchor__cable b{font-size:1.3rem;color:var(--muted);text-decoration:line-through}
.cable-anchor__us b{font-size:1.5rem;color:var(--cream)}
.cable-anchor__arrow{font-size:1.6rem;color:var(--border-strong)}
.cable-anchor p{color:var(--text);margin:0;font-size:.95rem}

/* ---------- Footer (marrón profundo) ---------- */
/* El footer emerge del fondo sin línea de corte. */
.site-footer{margin-top:clamp(3rem,6vw,5rem);background:linear-gradient(180deg,transparent,rgba(34,13,3,.72) 22%,#1c0902 85%);color:#e9cfae}
.site-footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2rem;padding:clamp(2.6rem,5vw,4rem) var(--gut);max-width:var(--container);margin-inline:auto}
.site-footer .brand__name{color:#fff}
.site-footer__brand p{color:#cfa87e;font-size:.94rem;margin:1rem 0;max-width:32ch}
.site-footer__social{display:flex;gap:.6rem;flex-wrap:wrap}
.site-footer__social .chip{background:rgba(255,216,171,.07);border-color:rgba(255,216,171,.18);color:#fff}
.site-footer__social .chip:hover{border-color:rgba(255,216,171,.45);color:#fff}
.site-footer__social .chip--wa{background:#25d366;color:#08361a;border-color:transparent}
.site-footer__col h4{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:#b98a5c;margin-bottom:1rem}
.site-footer__col a{display:block;color:#e9cfae;padding:.32rem 0;font-size:.95rem}
.site-footer__col a:hover{color:#fff}
.site-footer__contact a{color:#fff}
.site-footer__contact a:hover{color:var(--cream)}
.site-footer__pay{border-top:1px solid rgba(255,216,171,.1);padding:1.2rem 0}
.site-footer__pay .paylogos__label{color:#cfa87e}
.site-footer__bottom{border-top:1px solid rgba(255,216,171,.1);padding:1.3rem 0;color:#b98a5c;font-size:.86rem;text-align:center}
.site-footer__tmdb{display:block;margin-top:.45rem;font-size:.76rem;opacity:.7;max-width:60rem;margin-inline:auto}

/* ---------- Comparativa + landings ---------- */
.container.narrow{max-width:48rem}
.lead{font-size:1.08rem;color:var(--text);margin:0 0 1rem;line-height:1.6}
.trust--4{grid-template-columns:repeat(4,1fr)}
.trust__ic{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;flex:0 0 auto;border-radius:13px;background:rgba(255,216,171,.1);color:var(--cream)}
.trust__ic svg{width:24px;height:24px}
.vs{max-width:52rem;margin-inline:auto;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:var(--surface-strong);box-shadow:var(--shadow-sm)}
.vs table{width:100%;border-collapse:collapse;font-size:.95rem}
.vs th,.vs td{padding:.85rem 1rem;border-bottom:1px solid var(--border);vertical-align:middle;text-align:center}
.vs thead th{background:rgba(255,216,171,.1);font-weight:700;color:#fff}
.vs thead th:first-child,.vs tbody th{text-align:left}
.vs thead th.vs-mine{color:var(--cream)}
.vs tbody th{font-weight:600;color:#fff}
.vs td.vs-mine{background:rgba(255,216,171,.05)}
.vs tbody tr:last-child th,.vs tbody tr:last-child td{border-bottom:0}
.vs .ok,.vs .no{display:inline-flex;align-items:center;gap:.45em;justify-content:center;font-weight:600}
.vs .ok{color:#7fe8a4}
.vs .no{color:#ffab9d}
.vs-ic{width:17px;height:17px;flex:0 0 auto}
@media (max-width:560px){.vs table{font-size:.82rem}.vs th,.vs td{padding:.6rem .45rem}}
.feature-list{max-width:46rem;margin-inline:auto;list-style:none;padding:0;display:grid;gap:.7rem}
.feature-list li{display:flex;gap:.75rem;align-items:flex-start;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.9rem 1.15rem;box-shadow:var(--shadow-sm);font-size:1rem;line-height:1.5}
.feature-list .fok{color:#7fe8a4;flex:0 0 auto;display:inline-flex;margin-top:.05em}
.feature-list .fok svg{width:20px;height:20px}

/* ---------- Animaciones de entrada (sutiles, con escalonado) ---------- */
/* Se activan solo si <html class="anim"> (lo pone un script que respeta prefers-reduced-motion). */
.anim .section-head,
.anim .feature-list,
.anim .panel-cta,
.anim .cable-anchor,
.anim .chan-chips,
.anim .accordion,
.anim .vs{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s cubic-bezier(.16,1,.3,1)}
.anim .is-in{opacity:1;transform:none}
/* Escalonado: los hijos de las cuadrículas entran en cascada. */
.anim :is(.plans,.steps,.trust,.testi,.post-grid,.tut-grid,.stats)>*{
  opacity:0;transform:translateY(26px);
  transition:opacity .6s ease,transform .6s cubic-bezier(.16,1,.3,1)}
.anim :is(.plans,.steps,.trust,.testi,.post-grid,.tut-grid,.stats).is-in>*{opacity:1;transform:none}
.anim :is(.plans,.steps,.trust,.testi,.post-grid,.tut-grid,.stats).is-in>*:nth-child(2){transition-delay:.09s}
.anim :is(.plans,.steps,.trust,.testi,.post-grid,.tut-grid,.stats).is-in>*:nth-child(3){transition-delay:.18s}
.anim :is(.plans,.steps,.trust,.testi,.post-grid,.tut-grid,.stats).is-in>*:nth-child(4){transition-delay:.27s}
.anim :is(.plans,.steps,.trust,.testi,.post-grid,.tut-grid,.stats).is-in>*:nth-child(5){transition-delay:.36s}
.anim :is(.plans,.steps,.trust,.testi,.post-grid,.tut-grid,.stats).is-in>*:nth-child(n+6){transition-delay:.45s}
/* El plan destacado mantiene su elevación al entrar. */
.anim .plans.is-in>.plan--popular{transform:translateY(-6px)}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .hero__grid{grid-template-columns:1fr}
  .hero__visual{max-width:360px;margin-inline:auto;width:100%}
  .plans,.steps,.trust,.trust--4{grid-template-columns:1fr 1fr}
  .plan--popular{transform:none}
  .anim .plans.is-in>.plan--popular{transform:none}
  .split{grid-template-columns:1fr}
  .site-footer__grid{grid-template-columns:1fr 1fr}
  /* Header móvil: menú colapsable */
  .site-header__inner{display:flex;justify-content:space-between}
  .nav-toggle{display:flex}
  .header-phone{display:none}
  .site-nav{position:fixed;left:.625rem;right:.625rem;top:78px;background:rgba(42,16,4,.95);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,216,171,.16);border-radius:18px;padding:.3rem var(--gut) 1.1rem;transform:translateY(-135%);transition:transform var(--t),opacity var(--t);opacity:0;box-shadow:var(--shadow-lg);max-height:calc(100dvh - 92px);overflow:auto}
  .site-nav.is-open{opacity:1}
  .site-nav.is-open{transform:translateY(0)}
  .site-nav .nav-menu{flex-direction:column;align-items:stretch}
  .site-nav .nav-menu>li{padding:0;border-bottom:1px solid var(--border)}
  .site-nav .nav-menu>li>a{display:block;padding:.95rem .25rem;font-size:1.02rem}
  .site-nav .nav-menu>li>a::after{display:none}
}
@media (max-width:760px){
  .stats{grid-template-columns:1fr 1fr}
  .stats__item:nth-child(2){border-right:0}
  .stats__item:nth-child(-n+2){border-bottom:1px solid var(--border)}
  .plans,.steps,.trust,.trust--4,.testi{grid-template-columns:1fr}
  .field--row{grid-template-columns:1fr}
  .site-footer__grid{grid-template-columns:1fr}
  /* Rendimiento móvil: el desenfoque de fondo es caro en gama baja;
     las tarjetas usan su color sólido y solo el header conserva blur. */
  .plan,.step,.trust__item,.testi__card,.card-post,.tut,.tut-card,.accordion details,.stats,.cable-anchor,.plans-fold,.glass{backdrop-filter:none;-webkit-backdrop-filter:none}
  .glow-orb{filter:blur(6px);animation-duration:22s}
  /* Toques táctiles y densidad */
  .plan__stats{gap:.3rem;padding:.75rem .4rem}
  .plan__stat b{font-size:1.12rem}
  .cur-switch__opt,.seg button{padding:.6em 1em;min-height:40px}
  .plans-fold summary{padding:1rem 1.1rem}
  .plans-fold .plans{padding:0 .9rem 1rem}
  .hero-brand__cta .btn{flex:1 1 auto;justify-content:center}
}
/* Pulido del hero (billboard) en celular */
@media (max-width:600px){
  /* Alto con espacio para que se vea el fondo arriba; el texto va abajo. */
  .bb{min-height:68vh}
  /* Transición suave en celular: zoom de asentamiento (termina en escala 1, sin saltos). */
  .bb__slide.is-active img{animation:bb-soft 6s ease-out both}
  /* En celular el hero usa el póster vertical (vía <picture>): se encuadra centrado. */
  .bb__slide img{object-position:center}
  /* Fondo visible arriba, oscuro cálido solo donde está el texto (abajo). */
  .bb__scrim{background:linear-gradient(180deg,rgba(30,10,2,.14),rgba(30,10,2,.08) 30%,rgba(30,10,2,.5) 46%,rgba(38,14,3,.6) 74%,rgba(38,14,3,.35))}
  .bb__inner{padding:1.9rem var(--gut) 2.3rem}
  .eyebrow--light{margin-bottom:.7rem;font-size:.72rem;text-shadow:0 1px 14px rgba(0,0,0,.6)}
  .bb__title{font-size:clamp(2rem,8.5vw,2.7rem);line-height:1.1;margin-bottom:.7rem}
  /* Menos info en celular: ocultamos ficha y sinopsis de la película. */
  .bb__meta{display:none}
  .bb__overview{display:none}
  /* CTAs compactos: ancho según su texto, en una fila, alineados a la izquierda. */
  .bb .hero__cta{gap:.55rem;margin-bottom:1.25rem}
  .bb .hero__cta .btn--lg{padding:12px 20px;font-size:14.5px}
  .bb__chips{gap:.45rem}
  .bb__chips li{font-size:.8rem;padding:.42em .85em}
}
/* Cabecera compacta en celular: marca y CTA con aire, sin apretarse */
@media (max-width:600px){
  .site-header__inner{gap:.5rem}
  .brand__mark{width:32px;height:32px}
  .brand__name{font-size:1.12rem}
  .site-cta{margin-left:0;padding:8px 14px;font-size:13.5px}
  .nav-toggle{width:42px;height:40px;margin-left:.15rem}
}
@media (max-width:360px){
  .site-cta{padding:7px 12px;font-size:13px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
  .btn:hover,.plan:hover,.card-post:hover,.step:hover,.tut:hover,.wa-float:hover,.poster:hover{transform:none}
  .glow-orb{display:none}
  .starfield{animation:none}
  .wa-float::before{display:none}
}

/* Reproductor de video responsivo (tutoriales y "Cómo funciona") */
.video-embed{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000;box-shadow:0 10px 40px rgba(0,0,0,.35);margin:0 auto;max-width:880px}
.video-embed iframe,.video-embed video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;object-fit:cover}

/* Video incrustado en el contenido del blog (YouTube/Vimeo o archivo propio) */
.embed{position:relative;aspect-ratio:16/9;margin:1.5rem 0;border-radius:12px;overflow:hidden;background:#000}
.embed iframe,.embed video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}

/* ===== Landings de campaña (plantilla "landing") ===== */
.lp-hero{position:relative;overflow:hidden;text-align:center;color:#fff;padding:clamp(3.5rem,9vw,7rem) 0 clamp(4.5rem,11vw,8.5rem);background:linear-gradient(165deg,var(--lp-accent,#4f9dff),color-mix(in oklab,var(--lp-accent,#4f9dff) 45%,#0b1f4d))}
.lp-hero__sky{position:absolute;inset:0;pointer-events:none;background:radial-gradient(38% 30% at 16% 22%,rgba(255,255,255,.45),transparent 60%),radial-gradient(30% 24% at 82% 18%,rgba(255,255,255,.32),transparent 60%),radial-gradient(48% 40% at 50% 122%,rgba(255,255,255,.55),transparent 60%)}
.lp-hero__inner{position:relative;z-index:1;max-width:46rem}
.lp-hero__title{color:#fff;font-size:clamp(2.1rem,5.4vw,3.6rem);line-height:1.08;letter-spacing:-.03em;margin:0 0 1rem;text-shadow:0 2px 24px rgba(0,0,0,.18)}
.lp-hero__sub{color:rgba(255,255,255,.92);font-size:clamp(1.05rem,1.8vw,1.25rem);line-height:1.55;max-width:38rem;margin:0 auto 1.8rem}
.lp-hero__cta{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap}
.lp-btn{--fg:var(--lp-accent,#1d4ed8);background:#fff;color:var(--fg);font-weight:700;border:0}
.lp-btn:hover{transform:translateY(-2px)}
.lp-hero__clouds{position:absolute;left:0;right:0;bottom:-1px;height:38px;background:#fff;-webkit-mask:radial-gradient(22px at 50% 0,transparent 96%,#000) repeat-x;mask:radial-gradient(22px at 50% 0,transparent 96%,#000) repeat-x;-webkit-mask-size:54px 38px;mask-size:54px 38px}
.lp-content{max-width:44rem;margin-inline:auto}
.lp-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin:1.4rem 0 2rem}
.lp-card{background:#fff;border:1px solid var(--lp-border,#e5e7eb);border-radius:16px;padding:1.3rem 1.2rem;box-shadow:0 10px 30px -18px rgba(0,0,0,.25);color:#111}
.lp-card h3{margin:0 0 .35rem;font-size:1.08rem;color:#111}
.lp-card p{margin:0;color:#6b7280;font-size:.95rem;line-height:1.5}
.lp-note{background:color-mix(in oklab,var(--lp-accent,#4f9dff) 10%,#fff);border:1px solid color-mix(in oklab,var(--lp-accent,#4f9dff) 25%,#fff);border-radius:12px;padding:.9rem 1.1rem;font-size:.95rem;color:#111}
.lp-methods{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem;max-width:60rem;margin:0 auto}
.lp-method{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.3rem;background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:1.4rem 1rem;color:#111;text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s}
.lp-method:hover{transform:translateY(-3px);box-shadow:0 16px 34px -20px rgba(0,0,0,.35);border-color:var(--lp-accent,#4f9dff);color:#111}
.lp-method__ico{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:color-mix(in oklab,var(--lp-accent,#4f9dff) 14%,#fff);color:var(--lp-accent,#4f9dff);margin-bottom:.3rem}
.lp-method__ico svg{width:24px;height:24px}
.lp-method--wa .lp-method__ico{background:rgba(37,211,102,.15);color:#1faa52}
.lp-method__label{font-weight:700;font-size:1rem}
.lp-method__val{font-size:.85rem;color:#6b7280;word-break:break-word}

/* --- Landing · Tema Marca (naranja MorettiFlix: usa el fondo del sitio) --- */
.lp--brand .lp-hero{background:radial-gradient(80% 110% at 50% -25%,rgba(255,170,90,.38),transparent 72%);padding:clamp(3rem,8vw,5.5rem) 0 clamp(2.2rem,5vw,3.4rem)}
.lp--brand .lp-hero__sky,.lp--brand .lp-hero__clouds{display:none}
.lp--brand .lp-hero__title{text-shadow:0 4px 30px rgba(30,10,0,.5)}
.lp--brand .lp-hero__sub{color:var(--text)}
.lp--brand .lp-btn{--fg:var(--accent-ink);background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--fg);box-shadow:0 10px 26px -10px rgba(20,7,0,.55)}
.lp--brand .lp-btn:hover{filter:brightness(1.05)}
.lp--brand .section{background:transparent;color:var(--text)}
.lp--brand .section--alt{background:linear-gradient(180deg,transparent,rgba(30,11,2,.32) 22%,rgba(30,11,2,.32) 78%,transparent)}
.lp--brand .section-head h2,.lp--brand .lp-content :is(h1,h2,h3,h4){color:#fff}
.lp--brand .lp-stats{gap:.8rem}
.lp--brand .lp-stat{background:rgba(255,216,171,.07);border:1px solid var(--border);border-radius:14px;padding:1.3rem .6rem}
.lp--brand .lp-stat b{font-size:2.1rem;background:linear-gradient(180deg,#fff,var(--cream));-webkit-background-clip:text;background-clip:text;color:transparent}
.lp--brand .lp-stat span{color:var(--muted);text-transform:uppercase;font-size:.7rem;font-weight:600;letter-spacing:.06em}
.lp--brand .lp-checks li{color:var(--text);font-size:1.05rem}
.lp--brand .lp-checks li::before{background:linear-gradient(180deg,var(--cream),var(--cream-2));color:var(--accent-ink)}
.lp--brand .lp-price{background:linear-gradient(180deg,rgba(54,20,4,.8),rgba(38,14,3,.9));border:1px solid rgba(255,216,171,.42);box-shadow:var(--shadow-lg);max-width:26rem}
.lp--brand .lp-price__amount{color:#fff;text-shadow:0 2px 16px rgba(20,7,0,.5)}
.lp--brand .lp-price ul li::before{color:var(--cream)}
.lp--brand .lp-price ul{color:var(--text)}
.lp--brand .lp-note{background:rgba(255,216,171,.08);border-color:var(--border);color:var(--text)}
.lp--brand .lp-cta{background:rgba(255,216,171,.09);border-color:rgba(255,216,171,.3)}
.lp--brand .lp-cta h3{color:#fff}
.lp--brand .lp-cta p{color:var(--muted)}
.lp--brand .lp-method{background:var(--surface);border-color:var(--border);color:#fff}
.lp--brand .lp-method:hover{border-color:var(--border-strong);box-shadow:var(--shadow);color:#fff}
.lp--brand .lp-method__val{color:var(--muted)}
.lp--brand .lp-method__ico{background:rgba(255,216,171,.12);color:var(--cream)}
.lp--brand .lp-method--wa .lp-method__ico{background:rgba(37,211,102,.15);color:#25d366}
.lp--brand .lp-method--tg .lp-method__ico{background:rgba(34,158,217,.15);color:#3fa9e0}
.lp--brand .lp-faq details{background:var(--surface);border-color:var(--border)}
.lp--brand .lp-countdown div{background:rgba(255,216,171,.08)}
.lp--brand .lp-countdown b{color:var(--cream)}

/* --- Landing · Tema Oscuro premium --- */
.lp--dark .lp-hero{background:radial-gradient(75% 95% at 50% -12%,color-mix(in oklab,var(--lp-accent,#7c5cff) 42%,#0b0b14),#0b0b14)}
.lp--dark .lp-hero__sky{background:radial-gradient(42% 32% at 82% 12%,color-mix(in oklab,var(--lp-accent,#7c5cff) 35%,transparent),transparent 60%)}
.lp--dark .lp-hero__clouds{display:none}
.lp--dark .section{background:#0c0c12;color:#e9e9f0}
.lp--dark .section--alt{background:#08080d}
.lp--dark .section-head h2,.lp--dark .lp-content :is(h1,h2,h3,h4){color:#fff}
.lp--dark .lp-card{background:#15151f;border-color:#262633;color:#e9e9f0}
.lp--dark .lp-card h3{color:#fff}
.lp--dark .lp-card p,.lp--dark .lp-method__val{color:#a6a6b5}
.lp--dark .lp-note{background:color-mix(in oklab,var(--lp-accent,#7c5cff) 16%,#15151f);border-color:color-mix(in oklab,var(--lp-accent,#7c5cff) 35%,#15151f);color:#e9e9f0}
.lp--dark .lp-method{background:#15151f;border-color:#262633;color:#fff}
.lp--dark .lp-btn{--fg:#fff;background:var(--lp-accent,#7c5cff);color:var(--fg)}

/* --- Landing · Tema Neón --- */
.lp--neon .lp-hero{background:radial-gradient(85% 95% at 50% -20%,color-mix(in oklab,var(--lp-accent,#21e6c1) 45%,#05060a),#05060a)}
.lp--neon .lp-hero__sky{background:radial-gradient(48% 42% at 15% 18%,color-mix(in oklab,var(--lp-accent,#21e6c1) 40%,transparent),transparent 60%)}
.lp--neon .lp-hero__clouds{display:none}
.lp--neon .lp-hero__title{text-shadow:0 0 26px color-mix(in oklab,var(--lp-accent,#21e6c1) 60%,transparent)}
.lp--neon .section{background:#05060a;color:#dfe7ea}
.lp--neon .section--alt{background:#080a12}
.lp--neon .section-head h2,.lp--neon .lp-content :is(h1,h2,h3,h4){color:#fff}
.lp--neon .lp-card{background:#0c0e16;border-color:color-mix(in oklab,var(--lp-accent,#21e6c1) 35%,#0c0e16);color:#dfe7ea;box-shadow:0 0 26px -12px color-mix(in oklab,var(--lp-accent,#21e6c1) 70%,transparent)}
.lp--neon .lp-card h3{color:#fff}
.lp--neon .lp-card p,.lp--neon .lp-method__val{color:#9fb0b6}
.lp--neon .lp-note{background:color-mix(in oklab,var(--lp-accent,#21e6c1) 12%,#0c0e16);border-color:color-mix(in oklab,var(--lp-accent,#21e6c1) 40%,#0c0e16);color:#dfe7ea}
.lp--neon .lp-method{background:#0c0e16;border-color:color-mix(in oklab,var(--lp-accent,#21e6c1) 30%,#0c0e16);color:#fff}
.lp--neon .lp-method:hover{box-shadow:0 0 30px -8px var(--lp-accent,#21e6c1)}
.lp--neon .lp-btn{--fg:#05060a;background:var(--lp-accent,#21e6c1);color:var(--fg);box-shadow:0 0 28px -6px var(--lp-accent,#21e6c1)}

/* --- Landing · Tema Minimal --- */
.lp--minimal .lp-hero{background:#fff;color:#111;border-bottom:1px solid #ececec;padding-bottom:clamp(3rem,7vw,5.5rem)}
.lp--minimal .lp-hero__sky,.lp--minimal .lp-hero__clouds{display:none}
.lp--minimal .lp-hero__title{color:#111;text-shadow:none;font-weight:800}
.lp--minimal .lp-hero__sub{color:#6b7280}
.lp--minimal .lp-btn{--fg:#fff;background:var(--lp-accent,#111);color:var(--fg)}
.lp--minimal .lp-hero .btn--light{background:transparent;border:1px solid #ddd;color:#111}
.lp--minimal .lp-card{box-shadow:none;border-radius:10px}
.lp--minimal .lp-method{box-shadow:none;border-radius:10px}
.lp--minimal .lp-method:hover{box-shadow:0 10px 26px -18px rgba(0,0,0,.3)}

/* ===== Bloques de sección para landings (se pegan en el contenido) =====
   Superficies con color-mix(currentColor) → se adaptan a temas claros y oscuros. */
.lp-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem;margin:1.8rem 0;text-align:center}
.lp-stat{padding:1.2rem .6rem;border-radius:14px;background:color-mix(in oklab,currentColor 5%,transparent);border:1px solid color-mix(in oklab,currentColor 12%,transparent)}
.lp-stat b{display:block;font-size:1.8rem;line-height:1;color:var(--lp-accent,#4f9dff);font-weight:800}
.lp-stat span{font-size:.85rem;opacity:.75}

.lp-checks{list-style:none;padding:0;margin:1.2rem 0;display:grid;gap:.65rem}
.lp-checks li{position:relative;padding-left:2.1rem;line-height:1.5}
.lp-checks li::before{content:"✓";position:absolute;left:0;top:.05em;width:1.45rem;height:1.45rem;display:grid;place-items:center;font-size:.8rem;font-weight:700;color:#fff;background:var(--lp-accent,#4f9dff);border-radius:50%}

.lp-split{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;margin:2.2rem 0}
.lp-split img{width:100%;border-radius:16px;display:block}

.lp-price{max-width:24rem;margin:2rem auto;text-align:center;padding:2rem 1.6rem;border-radius:20px;background:color-mix(in oklab,currentColor 5%,transparent);border:1px solid color-mix(in oklab,var(--lp-accent,#4f9dff) 35%,transparent);box-shadow:0 18px 44px -26px color-mix(in oklab,var(--lp-accent,#4f9dff) 80%,transparent)}
.lp-price__amount{font-size:2.8rem;font-weight:800;color:var(--lp-accent,#4f9dff);line-height:1}
.lp-price__amount small{font-size:1rem;font-weight:600;opacity:.7}
.lp-price ul{list-style:none;padding:0;margin:1.2rem 0;display:grid;gap:.5rem;text-align:left}
.lp-price ul li{padding-left:1.6rem;position:relative}
.lp-price ul li::before{content:"✓";position:absolute;left:0;color:var(--lp-accent,#4f9dff);font-weight:700}

.lp-quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin:1.8rem 0}
.lp-quote{padding:1.3rem;border-radius:16px;background:color-mix(in oklab,currentColor 5%,transparent);border:1px solid color-mix(in oklab,currentColor 12%,transparent)}
.lp-quote__stars{color:#ffc83d;margin-bottom:.45rem;letter-spacing:2px}
.lp-quote__who{margin-top:.7rem;font-weight:700;font-size:.9rem;opacity:.9}

.lp-faq{margin:1.4rem 0;display:grid;gap:.6rem}
.lp-faq details{border:1px solid color-mix(in oklab,currentColor 14%,transparent);border-radius:12px;background:color-mix(in oklab,currentColor 4%,transparent)}
.lp-faq summary{cursor:pointer;padding:.95rem 1.1rem;font-weight:600;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary::after{content:"+";color:var(--lp-accent,#4f9dff);font-size:1.3rem;line-height:1}
.lp-faq details[open] summary::after{content:"–"}
.lp-faq details p{margin:0;padding:0 1.1rem 1rem;opacity:.85}

.lp-logos{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;justify-content:center;margin:1.6rem 0;opacity:.85}
.lp-logos img{height:30px;width:auto}

.lp-cta{margin:2.2rem 0;text-align:center;padding:1.9rem 1.4rem;border-radius:18px;background:color-mix(in oklab,var(--lp-accent,#4f9dff) 14%,transparent);border:1px solid color-mix(in oklab,var(--lp-accent,#4f9dff) 30%,transparent)}
.lp-cta h3{margin:0 0 .4rem;font-size:1.4rem}
.lp-cta p{margin:0 0 1.1rem;opacity:.85}

.lp-countdown{display:flex;gap:.6rem;justify-content:center;margin:1.1rem 0}
.lp-countdown div{min-width:3.8rem;padding:.6rem .4rem;border-radius:12px;background:color-mix(in oklab,currentColor 8%,transparent)}
.lp-countdown b{display:block;font-size:1.55rem;font-weight:800;color:var(--lp-accent,#4f9dff);line-height:1.1}
.lp-countdown span{font-size:.68rem;opacity:.7;text-transform:uppercase;letter-spacing:.04em}

@media(max-width:640px){.lp-split{grid-template-columns:1fr;gap:1.2rem}}

/* Insignia/eyebrow para landings */
.lp-badge{display:inline-block;padding:.4em 1em;border-radius:999px;font-size:.78rem;font-weight:700;letter-spacing:.03em;color:var(--lp-accent,#4f9dff);background:color-mix(in oklab,var(--lp-accent,#4f9dff) 15%,transparent);border:1px solid color-mix(in oklab,var(--lp-accent,#4f9dff) 30%,transparent)}

/* Iconos de bloques (mosaico en tarjetas, círculo en cifras) — estilo Rocket, temables */
.lp-card__ico{width:48px;height:48px;display:grid;place-items:center;border-radius:13px;margin-bottom:.9rem;background:color-mix(in oklab,var(--lp-accent,#4f9dff) 16%,transparent);color:var(--lp-accent,#4f9dff)}
.lp-card__ico svg{width:24px;height:24px}
.lp-stat__ico{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;margin:0 auto .6rem;background:color-mix(in oklab,var(--lp-accent,#4f9dff) 18%,transparent);color:var(--lp-accent,#4f9dff)}
.lp-stat__ico svg{width:22px;height:22px}

/* Modo anuncio: cabecera mínima centrada (sin nav ni CTA) */
.site-header--bare{position:relative}
.site-header--bare .container{display:flex;justify-content:center;align-items:center;height:60px;max-width:520px;border-radius:var(--pill);background:rgba(46,17,4,.6);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);border:1px solid rgba(255,216,171,.14);box-shadow:0 10px 34px -12px rgba(15,5,0,.6)}
.site-header--bare .brand{display:inline-flex;align-items:center;gap:.5rem}