/* ============================================================
   AYV PROPOSALS — Prototipo de rediseño
   Estilo: romance editorial · cinematográfico · limpio
   ============================================================ */

/* ---------- Variables ----------
   Paleta v3 (S62, feedback de Alan): "demasiado beige" → base casi blanco cálido
   (como el fondo de Claude), vino real y PRESENTE en toda la página (no solo
   botones), dorado y negro como apoyos. Los tonos claros (wine-900/800/700/line)
   ya NO son beige/tan — están tintados de vino muy diluido, así que cualquier
   sección que los use automáticamente deja de leerse "beige".
   Las secciones con FOTO (hero, cards, subhero, CTA final) mantienen texto
   claro fijo (hardcode) porque van sobre overlays oscuros de la imagen,
   independientes del tema general. */
:root{
  /* marca */
  --wine-950:#fbfaf8;          /* fondo principal — casi blanco cálido, NO beige */
  --wine-900:#f7f1f0;          /* fondo alterno — blanco con lavado de vino sutil */
  --wine-800:#ffffff;          /* tarjetas — blanco puro, crujiente contra el fondo */
  --wine-700:#f3e9e8;          /* lavado de vino un poco más presente (franjas/bandas) */
  --wine-600:#7a1830;          /* ACENTO vino real (color de marca, protagonista) */
  --wine-deep:#450d1a;         /* vino profundo (hover/estado activo) */
  --wine-ink:#2b0a12;          /* vino casi negro — para la banda oscura de firma */
  --rose:#7a1830;              /* alias histórico → vino */
  --plum:#450d1a;              /* alias histórico → vino profundo */
  --blush:#e7b8be;             /* blush suave (detalle romántico, sin cambio) */
  --blush-soft:rgba(231,184,190,.28);
  --gold:#ad7f3e;              /* dorado bronce — apoyo, no protagonista */
  --gold-soft:#d2ac6c;
  --cream:#211316;             /* tinta casi negra (texto principal) — apoyo "negro" */
  --cream-dim:#5e4a48;         /* texto secundario */
  --cream-faint:#8a7573;       /* texto terciario / placeholders */
  --line:#ecdfde;              /* borde claro tintado de vino, ya no tan/caqui */
  --photo-ink:#f8f0ea;         /* texto claro fijo sobre fotos con overlay oscuro */
  --photo-ink-dim:rgba(248,240,234,.78);
  --photo-ink-faint:rgba(248,240,234,.55);

  /* tipografía */
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Jost',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --script:'Great Vibes',cursive;

  --maxw:1240px;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
  --shadow:0 30px 80px -30px rgba(0,0,0,.7);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  background:var(--wine-950);
  color:var(--cream);
  line-height:1.6;
  overflow-x:hidden;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
ul{list-style:none}
::selection{background:var(--wine-600);color:#fff}

h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.05;letter-spacing:.01em}
.script{font-family:var(--script);font-weight:400}

/* ---------- Utilidades ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(20px,5vw,48px)}
.eyebrow{
  font-size:.72rem;letter-spacing:.42em;text-transform:uppercase;
  color:var(--wine-600);font-weight:400;display:inline-block;
}
/* sobre foto con overlay oscuro (hero/subhero/final) el dorado contrasta mejor que el vino */
.hero .eyebrow,.subhero .eyebrow,.final .eyebrow{color:var(--gold)}
.section{padding:clamp(72px,11vw,150px) 0;position:relative}
.center{text-align:center}

/* botones */
.btn{
  display:inline-flex;align-items:center;gap:.6em;
  font-family:var(--sans);font-size:.82rem;font-weight:400;
  letter-spacing:.22em;text-transform:uppercase;
  padding:1.05em 2.1em;border-radius:100px;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),background .4s,color .4s;
  position:relative;overflow:hidden;white-space:nowrap;
}
.btn svg{width:1.1em;height:1.1em;transition:transform .5s var(--ease)}
.btn--solid{background:linear-gradient(120deg,var(--wine-600),var(--wine-deep));color:#fff;box-shadow:0 14px 38px -14px rgba(110,30,46,.55)}
.btn--solid:hover{transform:translateY(-3px);box-shadow:0 22px 50px -14px rgba(110,30,46,.6)}
.btn--solid:hover svg{transform:translateX(4px)}
.btn--gold{background:linear-gradient(120deg,var(--gold),var(--gold-soft));color:#2d181c;box-shadow:0 14px 38px -16px rgba(185,138,94,.55)}
.btn--gold:hover{transform:translateY(-3px)}
.btn--ghost{border:1px solid var(--line);color:var(--cream);background:rgba(110,30,46,.03);backdrop-filter:blur(6px)}
.btn--ghost:hover{border-color:var(--wine-600);color:var(--wine-600);transform:translateY(-3px)}
/* variante para botones ghost sobre foto (hero/subhero con overlay oscuro) */
.hero .btn--ghost,.subhero .btn--ghost{color:var(--photo-ink);border-color:rgba(248,240,234,.4);background:rgba(255,255,255,.06)}
.hero .btn--ghost:hover,.subhero .btn--ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn--wa{background:#1faf57;color:#fff;box-shadow:0 14px 38px -16px #1faf57}
.btn--wa:hover{transform:translateY(-3px);background:#25c264}

/* títulos de sección */
.sec-head{max-width:760px;margin-inline:auto;margin-bottom:clamp(40px,6vw,72px)}
.sec-head h2{
  font-size:clamp(2.4rem,6vw,4.5rem);margin:.18em 0 .35em;
  letter-spacing:.005em;
}
.sec-head p{color:var(--cream-dim);font-size:1.05rem;max-width:54ch;margin-inline:auto}
.flourish{color:var(--wine-600);font-size:1.6rem;line-height:1;opacity:.85}

/* ---------- Reveal (animación al hacer scroll) ---------- */
.reveal{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.1s}
.reveal[data-d="2"]{transition-delay:.2s}
.reveal[data-d="3"]{transition-delay:.3s}
.reveal[data-d="4"]{transition-delay:.4s}

/* barra de progreso */
.progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:1000;
  background:linear-gradient(90deg,var(--wine-600),var(--gold));box-shadow:0 0 12px rgba(110,30,46,.5)}

/* ============================================================
   HEADER
   ============================================================ */
.header{
  position:fixed;top:0;left:0;width:100%;z-index:900;
  display:flex;align-items:center;justify-content:space-between;
  padding:clamp(16px,2.4vw,26px) clamp(20px,5vw,48px);
  transition:background .5s var(--ease-soft),padding .5s var(--ease-soft),border-color .5s;
  border-bottom:1px solid transparent;
}
.header.scrolled{
  background:rgba(251,250,248,.92);backdrop-filter:blur(16px) saturate(1.2);
  padding-top:12px;padding-bottom:12px;border-bottom:1px solid var(--line);
}
/* scrim: mientras el header es transparente (sobre foto), un degradado oscuro
   detrás garantiza que el texto claro SIEMPRE se lea, aunque abajo haya zona clara.
   Al scrollear (fondo marfil sólido) el scrim se apaga y el texto pasa a tinta oscura. */
.header::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(15,8,12,.55),rgba(15,8,12,0));
  transition:opacity .5s var(--ease-soft)}
.header.scrolled::before{opacity:0}
/* header transparente va sobre la foto del hero → texto claro fijo; al scrollear
   gana fondo marfil sólido → texto pasa a tinta oscura (--cream ya es oscuro) */
.brand{font-family:var(--serif);font-size:clamp(1.2rem,2vw,1.55rem);letter-spacing:.14em;font-weight:500;display:flex;align-items:center;gap:.5em;color:var(--photo-ink);transition:color .5s var(--ease-soft)}
.header.scrolled .brand{color:var(--cream)}
.brand b{font-weight:500}
.brand .dot{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold);display:inline-block}
.nav{display:flex;align-items:center;gap:clamp(18px,2.4vw,38px)}
.nav a{font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--photo-ink);text-shadow:0 1px 14px rgba(0,0,0,.55);position:relative;padding:.3em 0;transition:color .35s,text-shadow .35s}
.header.scrolled .nav a{text-shadow:none}
.nav a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--gold);transition:width .4s var(--ease)}
.header.scrolled .nav a::after{background:var(--wine-600)}
.nav a:hover{color:var(--photo-ink)}.nav a:hover::after{width:100%}
/* página activa: subrayado persistente (adapta color con el header), sin forzar tinta oscura que se perdía sobre la foto */
.nav a.active::after{width:100%}
/* flecha con rebote: pista de que hay que bajar para ver los paquetes */
@keyframes bounceY{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.bounce-y{animation:bounceY 1.3s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.bounce-y{animation:none}}
/* botón WhatsApp del menú móvil, más bonito (pill con brillo verde) */
.mobile-menu .btn--wa{margin-top:1.6rem;border-radius:100px;gap:.5em;font-weight:500;letter-spacing:.05em;box-shadow:0 14px 34px -12px rgba(31,175,87,.6)}
.header.scrolled .nav a{color:var(--cream-dim)}
.header.scrolled .nav a:hover{color:var(--cream)}
.nav .nav-cta{margin-left:6px}
.nav-cta{display:inline-flex;align-items:center;gap:.5em;border:1px solid rgba(248,240,234,.4);padding:.7em 1.3em;border-radius:100px;color:var(--photo-ink);text-transform:uppercase;letter-spacing:.14em;font-size:.76rem;transition:all .4s var(--ease)}
.header.scrolled .nav-cta{border-color:var(--line);color:var(--cream)}
.nav-cta:hover{background:var(--wine-600);border-color:var(--wine-600);color:#fff;transform:translateY(-2px)}
.nav-cta::after{display:none}

.burger{display:none;flex-direction:column;gap:5px;padding:8px;z-index:950}
.burger span{width:26px;height:2px;background:var(--photo-ink);transition:.4s var(--ease)}
.header.scrolled .burger span{background:var(--cream)}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* menú móvil */
.mobile-menu{
  position:fixed;inset:0;z-index:910;background:linear-gradient(160deg,var(--wine-900),var(--wine-700));
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4rem;
  opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility .5s;
}
.mobile-menu.open{opacity:1;visibility:visible}
.mobile-menu a{font-family:var(--serif);font-size:2rem;color:var(--cream);opacity:0;transform:translateY(20px);transition:all .5s var(--ease)}
.mobile-menu.open a{opacity:1;transform:none}
.mobile-menu.open a:nth-child(1){transition-delay:.08s}
.mobile-menu.open a:nth-child(2){transition-delay:.14s}
.mobile-menu.open a:nth-child(3){transition-delay:.2s}
.mobile-menu.open a:nth-child(4){transition-delay:.26s}
.mobile-menu.open a:nth-child(5){transition-delay:.32s}
.mobile-menu .btn{margin-top:1rem;transition-delay:.4s}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__bg img{width:100%;height:100%;object-fit:cover;animation:kenburns 22s ease-in-out infinite alternate}
@keyframes kenburns{from{transform:scale(1.06) translate(0,0)}to{transform:scale(1.18) translate(-1.5%,-2%)}}
.hero__bg::after{   /* overlay para legibilidad */
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(120% 90% at 50% 8%,transparent 30%,rgba(18,4,7,.55) 100%),
    linear-gradient(180deg,rgba(18,4,7,.55) 0%,rgba(18,4,7,.18) 38%,rgba(18,4,7,.72) 78%,var(--wine-950) 100%);
}
.hero__inner{position:relative;z-index:2;width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(20px,5vw,48px);text-align:center}
.hero .eyebrow{margin-bottom:1.4rem}
.hero h1{
  font-size:clamp(3.4rem,12vw,9.5rem);line-height:.92;font-weight:500;color:var(--photo-ink);
  letter-spacing:.02em;text-shadow:0 30px 80px rgba(0,0,0,.5);
}
.hero h1 .script{display:block;font-size:clamp(2.6rem,8vw,6rem);color:var(--gold);font-weight:400;letter-spacing:0;margin-top:-.18em;line-height:1.1;text-shadow:0 10px 40px rgba(74,20,32,.4)}
.hero__sub{font-family:var(--serif);font-size:clamp(1.15rem,2.4vw,1.7rem);font-weight:300;color:var(--photo-ink);font-style:italic;margin:1.5rem auto 2.4rem;max-width:30ch}
.hero__cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* palabras animadas del h1 */
.hero h1 .w{display:inline-block;opacity:0;transform:translateY(40px) rotate(3deg);animation:wordIn 1.1s var(--ease) forwards}
.hero h1 .script{opacity:0;transform:translateY(30px);animation:wordIn 1.1s var(--ease) forwards .5s}
.hero .eyebrow,.hero__sub,.hero__cta{opacity:0;animation:fadeUp 1s var(--ease) forwards}
.hero .eyebrow{animation-delay:.1s}
.hero__sub{animation-delay:.8s}
.hero__cta{animation-delay:1s}
@keyframes wordIn{to{opacity:1;transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* indicador scroll */
.scroll-cue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:.6rem;color:var(--photo-ink-faint);
  font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;opacity:0;animation:fadeUp 1s 1.4s forwards}
.scroll-cue .line{width:1px;height:42px;background:linear-gradient(var(--gold),transparent);position:relative;overflow:hidden}
.scroll-cue .line::after{content:"";position:absolute;top:-50%;left:0;width:100%;height:50%;background:var(--gold);animation:cue 2s ease-in-out infinite}
@keyframes cue{0%{top:-50%}100%{top:100%}}

/* partículas flotantes (hearts) */
.particles{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.particle{position:absolute;bottom:-30px;color:var(--blush);opacity:0;font-size:14px;animation:float 14s linear infinite}
@keyframes float{
  0%{opacity:0;transform:translateY(0) scale(.6) rotate(0)}
  12%{opacity:.5}
  88%{opacity:.5}
  100%{opacity:0;transform:translateY(-105vh) scale(1) rotate(220deg)}
}

/* ============================================================
   STATS / TRUST
   ============================================================ */
.stats{background:linear-gradient(var(--wine-950),var(--wine-900));border-block:1px solid var(--line);padding:clamp(38px,5vw,58px) 0}
.stats__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stat .num{font-family:var(--serif);font-size:clamp(2.2rem,4.4vw,3.4rem);color:var(--wine-600);font-weight:500;line-height:1}
.stat .lbl{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--cream-dim);margin-top:.6em}
.stats .stat+.stat{border-left:1px solid var(--line)}

/* ============================================================
   EXPERIENCIAS (cards)
   ============================================================ */
.exp{background:var(--wine-900)}
.exp__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
.card{
  position:relative;border-radius:18px;overflow:hidden;min-height:clamp(420px,52vw,560px);
  display:flex;align-items:flex-end;isolation:isolate;
  box-shadow:var(--shadow);transition:transform .6s var(--ease)}
.card:hover{transform:translateY(-8px)}
.card__img{position:absolute;inset:0;z-index:-2}
.card__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.card:hover .card__img img{transform:scale(1.08)}
.card::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(20,4,9,.1) 0%,rgba(20,4,9,.22) 34%,rgba(20,4,9,.95) 100%);
  transition:background .5s}
.card:hover::after{background:linear-gradient(180deg,rgba(80,16,32,.18) 0%,rgba(20,4,9,.5) 34%,rgba(20,4,9,.97) 100%)}
/* Franja sólida SIEMPRE oscura detrás del texto (independiente del tono de la foto) —
   garantiza legibilidad del título aunque la imagen sea clara en esa zona. */
.card__body{position:relative;z-index:1;width:100%}
.card__body::before{content:"";position:absolute;inset:-10% 0 0 0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,transparent 0%,rgba(15,2,6,.55) 40%,rgba(15,2,6,.9) 100%)}
.card__body>*{position:relative;padding-inline:clamp(24px,3vw,38px)}
.card__body>:first-child{padding-top:clamp(24px,3vw,38px)}
.card__body>:last-child{padding-bottom:clamp(24px,3vw,38px)}
.card__tag{font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);text-shadow:0 2px 12px rgba(0,0,0,.5)}
.card h3{font-size:clamp(1.9rem,3vw,2.6rem);margin:.25em 0 .4em;color:var(--photo-ink);text-shadow:0 4px 20px rgba(0,0,0,.55)}
.card p{color:var(--photo-ink-dim);font-size:.96rem;max-width:34ch;
  max-height:0;opacity:0;overflow:hidden;transition:max-height .6s var(--ease),opacity .5s,margin .5s}
.card:hover p{max-height:120px;opacity:1;margin-bottom:1.1em}
.card__link{display:inline-flex;align-items:center;gap:.6em;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--photo-ink)}
.card__link svg{width:1.1em;transition:transform .5s var(--ease)}
.card:hover .card__link svg{transform:translateX(6px)}
.card__link .u{position:relative}
.card__link .u::after{content:"";position:absolute;left:0;bottom:-3px;width:100%;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.card:hover .card__link .u::after{transform:scaleX(1)}

/* ============================================================
   POR QUÉ (value props)
   ============================================================ */
.why{position:relative;background:
   linear-gradient(120deg,var(--wine-800),var(--wine-950));overflow:hidden}
.why::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(110,30,46,.10),transparent 65%);top:-160px;right:-120px;filter:blur(20px)}
.why::after{content:"";position:absolute;width:480px;height:480px;border-radius:50%;
  background:radial-gradient(circle,rgba(185,138,94,.14),transparent 65%);bottom:-180px;left:-140px;filter:blur(20px)}
.why__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,46px);position:relative;z-index:1}
.vp{text-align:center;padding:clamp(20px,2vw,30px)}
.vp__ic{width:74px;height:74px;margin:0 auto 1.4rem;border-radius:50%;
  display:grid;place-items:center;border:1px solid var(--line);
  background:radial-gradient(circle at 30% 25%,rgba(227,189,145,.18),transparent 70%);
  transition:transform .6s var(--ease),border-color .5s}
.vp:hover .vp__ic{transform:translateY(-6px) rotate(-4deg);border-color:var(--wine-600)}
.vp__ic svg{width:34px;height:34px;stroke:var(--wine-600);fill:none;stroke-width:1.3}
.vp h3{font-size:clamp(1.4rem,2.2vw,1.9rem);margin-bottom:.5em}
.vp p{color:var(--cream-dim);font-size:.98rem;max-width:32ch;margin-inline:auto}

/* ============================================================
   BANDA DE FIRMA — vino oscuro sólido, el "acento real" de la marca
   protagonista de una sección entera (no solo botones). Signature element.
   ============================================================ */
.planners{background:radial-gradient(120% 140% at 15% 0%,rgba(160,40,66,.35),transparent 55%),linear-gradient(165deg,var(--wine-ink),var(--wine-deep) 70%);position:relative;overflow:hidden;color:var(--photo-ink)}
.planners::before{content:"";position:absolute;width:640px;height:640px;border-radius:50%;
  background:radial-gradient(circle,rgba(212,168,108,.14),transparent 65%);top:-240px;right:-200px;filter:blur(20px)}
.planners .eyebrow,.planners .flourish{color:var(--gold)}
.planners__grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,70px);align-items:center;position:relative;z-index:1}
.planners__copy h2{font-size:clamp(2.2rem,4.6vw,3.4rem);margin:.25em 0 .5em;color:var(--photo-ink)}
.planners__copy h2 .script{color:var(--gold)}
.planners__copy p{color:var(--photo-ink-dim);font-size:1.02rem;max-width:52ch;margin-bottom:1em}
.planners__note{color:var(--photo-ink-faint)!important;font-size:.92rem!important;font-style:italic;border-left:2px solid var(--gold);padding-left:1em}
.planners__tags{display:flex;flex-wrap:wrap;gap:10px;align-content:flex-start}
.p-tag{display:inline-flex;flex-direction:column;gap:.15em;font-size:.86rem;letter-spacing:.02em;
  padding:.85em 1.2em;border:1px solid rgba(248,240,234,.28);border-radius:100px;color:var(--photo-ink);
  background:rgba(255,255,255,.05);transition:all .4s var(--ease)}
.p-tag:hover{border-color:var(--gold);transform:translateY(-3px);background:rgba(255,255,255,.08)}
.p-tag--soon{border-style:dashed;color:var(--photo-ink-faint)}
.p-tag--soon small{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}

/* ============================================================
   DALE UNA PISTA (hint loop)
   ============================================================ */
.hint{background:var(--wine-950)}
.hint__card{max-width:680px;margin-inline:auto;text-align:center;padding:clamp(40px,6vw,64px) clamp(24px,5vw,56px);
  border:1px solid var(--line);border-radius:24px;background:radial-gradient(120% 140% at 50% 0%,rgba(227,189,145,.08),transparent 60%)}
.hint__card h2{font-size:clamp(2rem,4.4vw,3rem);margin:.2em 0 .5em}
.hint__card p{color:var(--cream-dim);max-width:46ch;margin:0 auto 1.8rem;font-size:1rem}

/* ============================================================
   GALERÍA
   ============================================================ */
.gallery{background:var(--wine-950)}
.gallery__grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;gap:14px}
.g-item{position:relative;overflow:hidden;border-radius:14px;cursor:pointer}
.g-item img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease),filter .6s}
.g-item::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(18,4,7,.55));opacity:.5;transition:opacity .5s}
.g-item:hover img{transform:scale(1.1)}
.g-item:hover::after{opacity:.15}
.g-item .g-zoom{position:absolute;right:14px;bottom:14px;width:40px;height:40px;border-radius:50%;background:rgba(18,4,7,.5);backdrop-filter:blur(6px);display:grid;place-items:center;opacity:0;transform:scale(.6);transition:all .5s var(--ease);z-index:2}
.g-item:hover .g-zoom{opacity:1;transform:scale(1)}
.g-item .g-zoom svg{width:18px;stroke:var(--photo-ink);fill:none;stroke-width:1.5}
.g-tall{grid-row:span 2}
.g-wide{grid-column:span 2}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:1100;background:rgba(10,2,4,.94);backdrop-filter:blur(8px);
  display:grid;place-items:center;opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;padding:24px}
.lightbox.open{opacity:1;visibility:visible}
.lightbox img{max-width:92vw;max-height:88vh;border-radius:10px;box-shadow:var(--shadow);transform:scale(.92);transition:transform .5s var(--ease)}
.lightbox.open img{transform:scale(1)}
.lightbox .lb-close{position:absolute;top:24px;right:28px;font-size:2rem;color:var(--photo-ink);width:48px;height:48px;border-radius:50%;border:1px solid rgba(248,240,234,.3)}
.lightbox .lb-nav{position:absolute;top:50%;transform:translateY(-50%);font-size:2rem;color:var(--photo-ink);width:54px;height:54px;border-radius:50%;border:1px solid rgba(248,240,234,.3);background:rgba(255,255,255,.04);transition:background .3s}
.lightbox .lb-nav:hover{background:rgba(255,255,255,.12)}
.lb-prev{left:20px}.lb-next{right:20px}

/* lightbox de carrusel (tarjetas de paquete + configurador) — sobre TODO */
.pxlb{position:fixed;inset:0;z-index:1400;background:rgba(10,2,4,.95);backdrop-filter:blur(10px);
  display:flex;align-items:center;justify-content:center;gap:8px;padding:20px;
  opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.pxlb.open{opacity:1;visibility:visible}
.pxlb__stage{position:relative;display:flex;flex-direction:column;align-items:center;max-width:94vw}
.pxlb__img{max-width:92vw;max-height:84vh;border-radius:12px;box-shadow:var(--shadow);
  transform:scale(.94);transition:transform .45s var(--ease)}
.pxlb.open .pxlb__img{transform:scale(1)}
.pxlb__cap{margin-top:12px;font-size:.82rem;letter-spacing:.04em;color:var(--photo-ink-faint);text-align:center;max-width:92vw}
.pxlb__dots{display:flex;justify-content:center;gap:6px;margin-top:10px}
.pxlb__dots span{width:6px;height:6px;border-radius:50%;background:rgba(248,240,234,.4);transition:all .3s}
.pxlb__dots span.on{background:var(--photo-ink);width:20px;border-radius:100px}
.pxlb__close{position:absolute;top:20px;right:24px;font-size:2rem;line-height:1;color:var(--photo-ink);
  width:48px;height:48px;border-radius:50%;border:1px solid rgba(248,240,234,.3);background:rgba(255,255,255,.04);z-index:2}
.pxlb__nav{flex:none;font-size:2rem;color:var(--photo-ink);width:54px;height:54px;border-radius:50%;
  border:1px solid rgba(248,240,234,.3);background:rgba(255,255,255,.05);transition:background .3s;z-index:2}
.pxlb__nav:hover{background:rgba(255,255,255,.14)}
.pxlb--single .pxlb__nav,.pxlb--single .pxlb__dots{display:none}
@media (max-width:640px){
  .pxlb__nav{position:absolute;top:auto;bottom:26px;width:46px;height:46px}
  .pxlb__prev{left:24px}.pxlb__next{right:24px}
  .pxlb__img{max-height:78vh}
}

/* ============================================================
   CÓMO RESERVAR (steps)
   ============================================================ */
.steps{background:linear-gradient(var(--wine-900),var(--wine-800))}
.steps__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,30px);counter-reset:step}
.step{position:relative;padding-top:2.6rem}
.step::before{counter-increment:step;content:"0" counter(step);font-family:var(--serif);font-size:3.2rem;color:transparent;-webkit-text-stroke:1px var(--wine-600);opacity:.5;line-height:1;display:block;margin-bottom:.3em}
.step h3{font-size:1.4rem;margin-bottom:.4em}
.step p{color:var(--cream-dim);font-size:.94rem}
.step__line{position:absolute;top:1.5rem;left:0;width:100%;height:1px;background:var(--line);z-index:0}
.step:last-child .step__line{display:none}

/* ============================================================
   TESTIMONIOS
   ============================================================ */
.marquee{overflow:hidden;padding:26px 0;border-block:1px solid var(--line);background:var(--wine-950);white-space:nowrap}
.marquee__track{display:inline-flex;gap:3rem;animation:scrollx 28s linear infinite;will-change:transform}
.marquee span{font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.4rem);color:var(--cream-faint);letter-spacing:.1em;text-transform:uppercase;display:inline-flex;align-items:center;gap:3rem}
.marquee span::after{content:"♥";color:var(--rose);font-size:.6em}
@keyframes scrollx{to{transform:translateX(-50%)}}

.testi{background:var(--wine-950);position:relative}
.testi__viewport{max-width:840px;margin-inline:auto;position:relative;min-height:320px}
.t-card{position:absolute;inset:0;text-align:center;display:flex;flex-direction:column;justify-content:center;opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease);pointer-events:none}
.t-card.active{opacity:1;transform:none;pointer-events:auto}
.t-stars{color:var(--gold);letter-spacing:.3em;font-size:1.1rem;margin-bottom:1.4rem}
.t-quote{font-family:var(--serif);font-size:clamp(1.4rem,3vw,2.1rem);font-style:italic;font-weight:300;line-height:1.4;color:var(--cream)}
.t-author{margin-top:1.6rem;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--wine-600)}
.t-author span{display:block;color:var(--cream-faint);letter-spacing:.12em;margin-top:.3em;font-size:.72rem}
.t-dots{display:flex;gap:10px;justify-content:center;margin-top:2.6rem}
.t-dots button{width:9px;height:9px;border-radius:50%;background:var(--line);transition:all .4s var(--ease)}
.t-dots button.active{background:var(--gold);width:26px;border-radius:6px}
.testi__cta{margin-top:2.4rem;text-align:center}

/* ============================================================
   CTA FINAL
   ============================================================ */
.final{position:relative;overflow:hidden;text-align:center;padding:clamp(90px,13vw,170px) 0}
.final__bg{position:absolute;inset:0;z-index:0}
.final__bg img{width:100%;height:100%;object-fit:cover}
.final__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(45,24,28,.78),rgba(30,12,17,.86))}
.final__inner{position:relative;z-index:1}
.final h2{font-size:clamp(2.6rem,7vw,5.5rem);line-height:1;margin-bottom:.4em;color:var(--photo-ink)}
.final .script{color:var(--gold);font-size:clamp(2.2rem,6vw,4rem);display:block}
.final p{color:var(--photo-ink-dim);max-width:42ch;margin:0 auto 2.4rem;font-size:1.08rem}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:var(--wine-950);border-top:1px solid var(--line);padding:clamp(56px,7vw,84px) 0 32px}
.footer__top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.1fr;gap:40px;margin-bottom:48px}
.footer .brand{font-size:1.8rem;margin-bottom:1rem;color:var(--cream)}
.footer__col h4{font-family:var(--sans);font-size:.74rem;letter-spacing:.24em;text-transform:uppercase;color:var(--wine-600);margin-bottom:1.1em;font-weight:400}
.footer__col a,.footer__col p{display:block;color:var(--cream-dim);font-size:.95rem;margin-bottom:.7em;transition:color .3s}
.footer__col a:hover{color:var(--cream)}
.footer__phone{font-family:var(--serif);font-size:1.5rem!important;color:var(--cream)!important}
.footer__social{display:flex;gap:14px;margin-top:1rem}
.footer__social a{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;transition:all .4s var(--ease)}
.footer__social a:hover{border-color:var(--wine-600);transform:translateY(-3px)}
.footer__social svg{width:18px;height:18px;fill:var(--cream)}
.footer__handles{margin-top:.9rem;font-size:.82rem;color:var(--cream-faint);letter-spacing:.04em}
.footer__handles a{transition:color .3s}
/* footer en VINO con letras claras — se ve más limpio (feedback Estefani) */
.footer{background:var(--wine-ink);color:rgba(248,240,234,.72)}
.footer .brand{color:#fff}
.footer .brand .dot{background:var(--gold-soft);box-shadow:0 0 10px var(--gold-soft)}
.footer__col h4{color:var(--gold-soft)}
.footer__col p{color:rgba(248,240,234,.58)}
.footer__col a{color:rgba(248,240,234,.74)}
.footer__col a:hover{color:#fff}
.footer__phone{color:#fff!important}
.footer__social a{border-color:rgba(255,255,255,.22)}
.footer__social a:hover{border-color:var(--gold-soft);transform:translateY(-3px)}
.footer__social svg{fill:#fff}
.footer__handles{color:rgba(248,240,234,.5)}
.footer__handles a{color:var(--gold-soft)}
.footer__handles a:hover{color:#fff}
.footer__bottom{border-top-color:rgba(255,255,255,.14);color:rgba(248,240,234,.5)}
.footer__bottom a{color:rgba(248,240,234,.62)}
.footer__bottom a:hover{color:#fff}

/* ---------- FAQ (acordeón) ---------- */
.faq-list{display:flex;flex-direction:column;gap:12px}
.faq-item{background:var(--wine-800);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  box-shadow:0 2px 12px -8px rgba(74,20,32,.14);transition:border-color .35s}
.faq-item[open]{border-color:rgba(122,24,48,.35)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:20px clamp(18px,3vw,28px);font-family:var(--serif);font-size:clamp(1.1rem,2vw,1.32rem);color:var(--cream);font-weight:500}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-family:var(--sans);font-size:1.5rem;font-weight:300;color:var(--wine-600);
  transition:transform .4s var(--ease);flex:none;line-height:1}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item summary:hover{color:var(--wine-600)}
.faq-item__a{padding:0 clamp(18px,3vw,28px) 22px;color:var(--cream-dim);font-size:1rem;line-height:1.7}
.faq-item__a a{color:var(--wine-600);text-decoration:underline;text-underline-offset:2px}
.faq-item__a a:hover{color:var(--wine-deep)}
.footer__bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
  border-top:1px solid var(--line);padding-top:26px;font-size:.78rem;color:var(--cream-faint);letter-spacing:.06em}

/* WhatsApp flotante */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:800;width:60px;height:60px;border-radius:50%;
  background:#1faf57;display:grid;place-items:center;box-shadow:0 12px 34px -8px rgba(31,175,87,.7);
  transition:transform .5s var(--ease)}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:32px;height:32px;fill:#fff}
.wa-float::before{content:"";position:absolute;inset:0;border-radius:50%;background:#1faf57;z-index:-1;animation:pulse 2.4s ease-out infinite}
@keyframes pulse{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.9);opacity:0}}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1024px){
  .gallery__grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .nav{display:none}
  .burger{display:flex}
  .exp__grid{grid-template-columns:1fr;gap:18px}
  .card{min-height:440px}
  .card p{max-height:120px;opacity:1;margin-bottom:1.1em}   /* en móvil siempre visible */
  .planners__grid{grid-template-columns:1fr;gap:30px}
  .why__grid{grid-template-columns:1fr;gap:34px}
  .steps__grid{grid-template-columns:1fr 1fr;gap:28px 22px}
  .step__line{display:none}
  .stats__grid{grid-template-columns:1fr 1fr;gap:34px 16px}
  .stats .stat:nth-child(3),.stats .stat:nth-child(2){border-left:1px solid var(--line)}
  .stats .stat:nth-child(odd){border-left:none}
  .footer__top{grid-template-columns:1fr;gap:30px}
  .testi__viewport{min-height:400px}
  .gallery__grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:160px}
  .g-wide{grid-column:span 2}.g-tall{grid-row:span 1}
}
@media(max-width:480px){
  .hero__cta{flex-direction:column;width:100%}
  .hero__cta .btn{width:100%;justify-content:center}
  .stats__grid{grid-template-columns:1fr 1fr}
  .steps__grid{grid-template-columns:1fr}
}

/* ============================================================
   PÁGINAS INTERNAS (catálogo de paquetes)
   ============================================================ */
.subhero{position:relative;min-height:56svh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.subhero__bg{position:absolute;inset:0;z-index:0}
.subhero__bg img{width:100%;height:100%;object-fit:cover;animation:kenburns 24s ease-in-out infinite alternate}
.subhero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(45,24,28,.62),rgba(45,24,28,.5) 45%,var(--wine-950) 100%)}
.subhero__inner{position:relative;z-index:2;padding:120px clamp(20px,5vw,48px) 40px}
.breadcrumb{font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--photo-ink-dim);margin-bottom:1rem}
.breadcrumb a:hover{color:var(--gold)}
.breadcrumb span{color:var(--gold);margin:0 .5em}
.subhero h1{font-size:clamp(2.8rem,7vw,5.5rem);line-height:1;margin-bottom:.3em;color:var(--photo-ink)}
.subhero h1 .script{display:block;color:var(--gold);font-size:clamp(2rem,5vw,3.4rem);margin-top:.05em}
.subhero p{color:var(--photo-ink-dim);max-width:46ch;margin:1rem auto 0;font-size:1.05rem}

/* toggle de filtro (ciudad Y tipo Personalizado/Express) — contexto CLARO,
   vive en secciones de papel, no sobre foto: nada de blancos translúcidos. */
.city-toggle,.filter-toggle{display:inline-flex;gap:6px;padding:6px;border:1px solid var(--line);border-radius:100px;margin:0 auto;background:var(--wine-900)}
.city-toggle button,.filter-toggle button{font-family:var(--sans);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cream-dim);padding:.8em 1.8em;border-radius:100px;transition:color .4s,background .4s}
.city-toggle button.active,.filter-toggle button.active{background:linear-gradient(120deg,var(--wine-600),var(--wine-deep));color:#fff;box-shadow:0 10px 26px -12px rgba(122,24,48,.45)}
.city-wrap,.filter-wrap{display:flex;justify-content:center;margin-bottom:clamp(18px,2.4vw,26px)}
.filter-wrap{flex-wrap:wrap;gap:14px}

/* explicación Express vs Personalizado */
.tipo-note{max-width:640px;margin:0 auto clamp(30px,4vw,46px);text-align:center;
  background:var(--wine-700);border:1px solid var(--line);border-radius:16px;padding:16px 22px;
  font-size:.88rem;color:var(--cream-dim);transition:opacity .3s}
.tipo-note b{color:var(--wine-600);font-family:var(--serif);font-size:1.02rem}

/* grid de paquetes */
.pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,30px)}
.pkg-grid[hidden]{display:none}
/* Encabezado de subsección dentro del grid (ej. Corazones & Letras / Picnics) — ocupa todo el ancho */
.pkg-subhead{grid-column:1/-1;display:flex;align-items:center;gap:.7rem;margin:.2rem 0 .1rem}
.pkg-subhead + *{--x:0}
.pkg-subhead:not(:first-child){margin-top:1.9rem;padding-top:1.9rem;border-top:1px solid var(--line)}
.pkg-subhead__ic{flex:none;width:2.3rem;height:2.3rem;display:grid;place-items:center;border-radius:50%;
  background:var(--wine-900);border:1px solid var(--line);color:var(--wine-600);font-size:1.05rem}
.pkg-subhead__tx{display:flex;flex-direction:column;line-height:1.15}
.pkg-subhead__tx{font-family:var(--serif);font-size:clamp(1.3rem,2.4vw,1.7rem);color:var(--cream)}
.pkg-subhead__tx small{font-family:var(--sans);font-size:.72rem;letter-spacing:.04em;color:var(--cream-dim);text-transform:none;margin-top:.15rem}
.pkg{display:flex;flex-direction:column;background:var(--wine-800);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:transform .6s var(--ease),border-color .5s,box-shadow .6s var(--ease)}
.pkg:hover{transform:translateY(-8px);border-color:rgba(122,24,48,.35);box-shadow:0 30px 70px -34px rgba(74,20,32,.28)}
.pkg__img{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--wine-900)}
.pkg__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.pkg:hover .pkg__img img{transform:scale(1.07)}
.pkg__img[data-fotos]{cursor:zoom-in}
/* badge "N fotos" + dots sobre la foto de la tarjeta */
.pkg__count{position:absolute;left:12px;bottom:12px;z-index:2;display:inline-flex;align-items:center;gap:.4em;
  background:rgba(43,10,18,.62);backdrop-filter:blur(8px);border:1px solid rgba(248,240,234,.22);
  padding:.34em .7em;border-radius:100px;font-size:.68rem;letter-spacing:.06em;color:var(--photo-ink);font-weight:500;pointer-events:none}
.pkg__count svg{width:.95em;height:.95em;stroke:currentColor;fill:none;stroke-width:1.7}
.pkg__dots{position:absolute;left:0;right:0;top:10px;z-index:2;display:flex;justify-content:center;gap:5px;pointer-events:none}
.pkg__dots span{width:5px;height:5px;border-radius:50%;background:rgba(248,240,234,.55)}
.pkg__dots span.on{background:var(--photo-ink);width:14px;border-radius:100px}
.pkg__price{position:absolute;right:12px;bottom:12px;display:flex;align-items:baseline;gap:.5em;
  background:rgba(43,10,18,.7);backdrop-filter:blur(8px);border:1px solid rgba(248,240,234,.25);
  padding:.5em .9em;border-radius:100px;font-family:var(--serif);font-size:1.25rem;color:var(--photo-ink)}
.pkg__price .was{font-size:.85rem;color:var(--photo-ink-faint);text-decoration:line-through;font-family:var(--sans)}
.pkg__price .mxn{font-size:.6rem;letter-spacing:.1em;color:var(--gold-soft);font-family:var(--sans);align-self:center}
/* Precio Express (doble Lun-Jue / Vie-Sáb): bloque limpio de 2 renglones alineado a la derecha */
.pkg__price--dual{flex-direction:column;align-items:flex-end;gap:.12em;border-radius:16px;padding:.55em .95em;font-size:1.18rem;line-height:1.05}
.pkg__price-row{display:flex;align-items:baseline;gap:.5em;white-space:nowrap}
.pkg__price-row b{font-weight:500}
.pkg__price--dual small{font-size:.56rem;letter-spacing:.09em;color:var(--gold-soft);text-transform:uppercase;font-family:var(--sans);min-width:3.4em;text-align:left}
.pkg__price--flat{position:static;background:var(--wine-900);border:1px solid var(--line);color:var(--wine-600);backdrop-filter:none}
.pkg__price--flat.pkg__price--dual{align-items:flex-start;border-radius:12px}
.pkg__price--flat .mxn{color:var(--gold)}
.pkg__badge{position:absolute;left:12px;top:12px;background:var(--gold);color:#2d181c;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;padding:.4em .8em;border-radius:100px;font-weight:500;z-index:2}
.pkg__sku{display:inline-block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-faint);margin-bottom:.5em}
.pkg__body{padding:clamp(18px,2vw,26px);display:flex;flex-direction:column;flex:1}
.pkg__body h3{font-size:1.35rem;line-height:1.1;margin-bottom:.45em}
.pkg__body p{color:var(--cream-dim);font-size:.9rem;flex:1;margin-bottom:1em}
.pkg__note{display:flex;gap:.5em;align-items:flex-start;font-size:.8rem;color:var(--wine-600);background:var(--wine-700);
  border-radius:10px;padding:.6em .8em;margin-bottom:1.1em}
.pkg__note svg{width:1.1em;height:1.1em;flex:none;stroke:var(--wine-600);fill:none;stroke-width:1.6;margin-top:.1em}
/* tarjeta SIN foto real (33/44 paquetes) — nunca una foto genérica haciéndose pasar por el producto */
.pkg--nophoto{background:linear-gradient(155deg,var(--wine-800),var(--wine-900))}
.pkg__falta{display:flex;align-items:center;gap:7px;margin:12px clamp(18px,2vw,26px) 0;padding:7px 11px;border:1px dashed rgba(248,240,234,.3);border-radius:9px;font-size:.74rem;letter-spacing:.03em;color:var(--photo-ink-faint);background:rgba(0,0,0,.14)}
.pkg__falta svg{width:1.05em;height:1.05em;flex:none;opacity:.85;stroke:currentColor}
.pkg__head{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
  padding:18px clamp(18px,2vw,26px) 0}
.pkg__head .pkg__badge{position:static}
.pkg__cta{display:inline-flex;align-items:center;justify-content:center;gap:.6em;width:100%;
  background:linear-gradient(120deg,var(--wine-600),var(--wine-deep));color:#fff;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  padding:1em;border-radius:100px;transition:background .4s,transform .4s var(--ease);box-shadow:0 14px 30px -16px rgba(110,30,46,.55)}
.pkg__cta:hover{transform:translateY(-2px);box-shadow:0 18px 36px -14px rgba(110,30,46,.6)}
.pkg__cta svg{width:1.05em;fill:currentColor}
.pkg__cta-alt{display:inline-flex;align-items:center;justify-content:center;gap:.5em;width:100%;
  color:var(--cream-dim);font-size:.76rem;letter-spacing:.08em;margin-top:.6em;padding:.4em;transition:color .3s}
.pkg__cta-alt:hover{color:#25c264}
.pkg__cta-alt svg{width:1em;fill:currentColor}

/* franja informativa (cómo funciona / nota anticipo) */
.info-strip{background:var(--wine-900);border-block:1px solid var(--line)}
.info-strip__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.info-it{display:flex;gap:1rem;align-items:flex-start}
.info-it .n{font-family:var(--serif);font-size:1.8rem;color:transparent;-webkit-text-stroke:1px var(--wine-600);opacity:.6;line-height:1}
.info-it h4{font-size:1.15rem;margin-bottom:.3em}
.info-it p{color:var(--cream-dim);font-size:.9rem}
.note-deposit{text-align:center;color:var(--cream-faint);font-size:.85rem;max-width:60ch;margin:clamp(30px,4vw,46px) auto 0}

@media(max-width:860px){
  .pkg-grid{grid-template-columns:1fr 1fr;gap:16px}
  .info-strip__grid{grid-template-columns:1fr;gap:24px}
}
@media(max-width:560px){
  .pkg-grid{grid-template-columns:1fr;max-width:380px;margin-inline:auto}
  .city-toggle button{padding:.7em 1.3em;font-size:.76rem}
}

/* Accesibilidad: reduce motion */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .hero__bg img{animation:none}
  .reveal{opacity:1;transform:none}
}
