:root{
  /* ESCALA TIPOGRAFICA OFICIAL v1 (2026-07-03) - una sola voz alta (display); el lujo baja el volumen.
     Toda pieza nueva usa estos tokens; prohibido inventar tamanos por pagina. */
  --t-display:clamp(33px,4.8vw,64px); /* h1 hero: la unica voz alta */
  --t-h2:clamp(27px,3.4vw,46px);      /* titulo de seccion */
  --t-h3:clamp(20px,2vw,28px);        /* subtitulo/tarjeta */
  --t-pull-xl:clamp(26px,3.4vw,46px); /* manifiesto editorial: NUNCA supera al h2 */
  --t-pull:clamp(19px,1.6vw,24px);    /* cita destacada */
  --t-lead:clamp(16px,1.35vw,21px);   /* parrafo lider bajo titulo */
  --t-body:17px;                       /* cuerpo en tarjetas/listas */
  --t-body-lg:21px;                    /* cuerpo destacado (section-head, cta) */
  --t-caption:14px;                    /* pie, notas, footer texto */
  --t-btn:12px;                        /* botones (display, tracking .16em) */
  --t-mini:11px;                       /* kicker/eyebrow mayusculas */
  --t-fine:12px;                       /* letra pequena: notas legales, micro-copy */

  --paper:#f7f1e7;--cream:#efe6d7;--ink:#15110c;--muted:#938777;
  --green:#0e5c3f;--green-deep:#06291c;--gold:#c7a24a;--gold-soft:#e3c873;
  --burgundy:#5c0a18;--black:#070706;--line:rgba(247,241,231,.16);
  --dark-line:rgba(14,92,63,.18);
  --serif:"Playfair Display",Georgia,serif;--body:"EB Garamond",Georgia,serif;--display:"EB Garamond",Georgia,serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--paper);font-family:var(--body);font-size:18px;line-height:1.5;overflow-x:hidden}
body.menu-open{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:0}
h1{font-size:var(--t-display);line-height:1.02;color:#f7f1e7}
h2{font-size:var(--t-h2);line-height:1.05;color:var(--paper)}
h3{font-size:var(--t-h3);line-height:1.12;color:var(--paper)}
em{font-style:italic;color:var(--gold-soft);font-weight:400}
.wrap{width:min(1160px,calc(100% - 44px));margin:0 auto}
.mini{font-family:var(--display);text-transform:uppercase;letter-spacing:.22em;font-size:var(--t-mini);color:var(--gold-soft)}
.lead{font-size:var(--t-lead);color:rgba(247,241,231,.82);max-width:50ch}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:50px;padding:14px 23px;border:1px solid var(--gold);background:var(--gold);color:#170f08;font-family:var(--display);text-transform:uppercase;letter-spacing:.16em;font-size:var(--t-btn);font-weight:600;line-height:1;cursor:pointer;transition:transform .2s ease,filter .2s ease,background .2s ease,color .2s ease,border-color .2s ease}
.btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.btn.ghost{background:transparent;color:var(--paper);border-color:rgba(247,241,231,.56)}
.btn.ghost:hover{background:var(--paper);color:#160f08;border-color:var(--gold-soft)}
.arrow{width:17px;height:1px;background:currentColor;position:relative}
.arrow::after{content:"";position:absolute;right:0;top:-4px;width:8px;height:8px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.topbar{position:fixed;z-index:40;top:0;left:0;right:0;height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 34px;background:linear-gradient(180deg,rgba(7,7,6,.88),rgba(7,7,6,0));pointer-events:none}
.topbar>*{pointer-events:auto}
.brand img{height:38px;width:auto}
.top-actions{display:flex;align-items:center;gap:12px}
.nav-buy{min-height:48px;display:inline-flex;align-items:center;padding:0 18px;border:1px solid rgba(247,241,231,.28);background:rgba(7,7,6,.44);backdrop-filter:blur(10px);font-family:var(--display);letter-spacing:.16em;text-transform:uppercase;font-size:12px}
.menu-toggle{width:52px;height:52px;border:1px solid rgba(247,241,231,.28);background:rgba(7,7,6,.44);color:var(--paper);display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(10px)}
.menu-toggle span,.menu-toggle span::before,.menu-toggle span::after{content:"";display:block;width:20px;height:1px;background:currentColor;transition:.25s ease}
.menu-toggle span{position:relative}
.menu-toggle span::before{position:absolute;top:-7px}
.menu-toggle span::after{position:absolute;top:7px}
.side-menu{position:fixed;z-index:80;top:0;right:0;width:min(420px,100vw);height:100vh;background:#0b0a08;border-left:1px solid rgba(247,241,231,.12);transform:translateX(102%);transition:transform .35s cubic-bezier(.2,.7,.2,1);padding:30px;display:flex;flex-direction:column;overflow-y:auto}
.menu-open .side-menu{transform:none}
.menu-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}
.menu-head img{height:34px}
.menu-close{width:44px;height:44px;border:1px solid rgba(247,241,231,.22);background:transparent;color:var(--paper);font-size:26px;cursor:pointer}
.menu-links{display:grid;border-top:1px solid rgba(247,241,231,.12)}
.menu-links a{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:11px 0;border-bottom:1px solid rgba(247,241,231,.1);font-family:var(--display);text-transform:uppercase;letter-spacing:.18em;font-size:12px}
.menu-links a:hover{color:var(--gold-soft)}
.menu-foot{margin-top:auto;color:rgba(247,241,231,.62);font-size:16px}
.menu-overlay{position:fixed;z-index:70;inset:0;background:rgba(0,0,0,.56);opacity:0;pointer-events:none;transition:.3s ease}
.menu-open .menu-overlay{opacity:1;pointer-events:auto}
.hero{position:relative;min-height:100svh;display:grid;align-items:end;overflow:hidden;padding:122px 0 58px;background:#080706}
.hero::before{content:"";position:absolute;inset:0;background:var(--hero) center/cover no-repeat;transform:scale(1.06);opacity:.78}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(7,7,6,.52),rgba(7,7,6,.74)),radial-gradient(125% 95% at 50% 28%,rgba(7,7,6,.12),rgba(7,7,6,.9)),linear-gradient(90deg,rgba(7,7,6,.95),rgba(7,7,6,.5) 50%,rgba(7,7,6,.14))}
.hero .wrap{position:relative;z-index:2}
.hero{min-height:100svh!important}
.hero h1{max-width:20ch;margin:12px 0 20px;font-size:var(--t-display)!important;line-height:1.05}
.hero .lead{margin-bottom:28px;font-size:var(--t-lead)!important;max-width:52ch}
.hero .lead{max-width:46ch}
.actions{display:flex;gap:16px;flex-wrap:wrap}
.btn{position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.32),transparent);transform:skewX(-18deg);transition:left .55s ease;pointer-events:none}
.btn:hover::after{left:140%}
.route,.deliverable,.pack{transition:transform .25s ease,box-shadow .25s ease}
.route:hover,.deliverable:hover,.pack:hover{transform:translateY(-4px)}
.section{padding:clamp(64px,8vw,106px) 0;border-top:1px solid rgba(247,241,231,.12)}
.section.paper{background:#0c2c1e;color:rgba(247,241,231,.88);border-color:rgba(247,241,231,.1)}
.section.paper h2,.section.paper h3{color:#f7f1e7}
.section.paper .mini{color:var(--gold)}
.section.paper .lead,.section.paper p{color:rgba(247,241,231,.82)}
.section.green{background:var(--green-deep)}
.section.burgundy{background:var(--burgundy)}
.section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,420px);gap:34px;align-items:end;margin-bottom:30px}
.section-head p{font-size:var(--t-body-lg);color:rgba(247,241,231,.76)}
.paper .section-head p{color:rgba(247,241,231,.82)}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(247,241,231,.14);border:1px solid rgba(247,241,231,.14)}
.paper .grid3{background:rgba(247,241,231,.05);border-color:rgba(247,241,231,.1)}
.card{background:#11100d;min-height:220px;padding:28px;display:flex;flex-direction:column;justify-content:flex-end}
.paper .card{background:#071f16}
.card h3{margin:10px 0}
.card p{font-size:var(--t-body);color:rgba(247,241,231,.72)}
.paper .card p{color:rgba(247,241,231,.8)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(247,241,231,.14);border:1px solid rgba(247,241,231,.14)}
.split>div{background:#11100d;padding:34px}
.split img{width:100%;height:100%;min-height:360px;object-fit:cover}
.paper .split{background:rgba(247,241,231,.05);border-color:rgba(247,241,231,.1)}
.paper .split>div{background:#071f16}
.list{display:grid;gap:12px;margin-top:20px}
.list span{display:flex;align-items:flex-start;gap:12px;color:rgba(247,241,231,.78);font-size:18px}
.paper .list span{color:rgba(247,241,231,.82)}
.list span::before{content:"";width:7px;height:7px;background:var(--gold);margin-top:10px;flex:0 0 auto}
.cta{text-align:center}
.cta h2{max-width:18ch;margin:10px auto 18px}
.cta p{max-width:48ch;margin:0 auto 24px;color:rgba(247,241,231,.76);font-size:var(--t-body-lg)}
.footer{background:#060605;border-top:1px solid rgba(247,241,231,.12);padding:38px 0 24px;color:rgba(247,241,231,.62);font-size:var(--t-caption)}
.footer .footer-grid{display:grid;grid-template-columns:minmax(250px,1.2fr) minmax(210px,.8fr) auto;gap:34px;align-items:start}
.footer a{color:var(--gold-soft)}
.footer-brand{display:grid;gap:4px}
.footer-brand strong{font-family:var(--serif);font-size:22px;font-weight:500;color:var(--paper)}
.footer-nav{display:grid;gap:8px;font-family:var(--display);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.footer-social{display:flex;gap:9px}
.footer-social a{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(247,241,231,.2);color:var(--gold-soft)}
.footer-social a:hover{border-color:var(--gold)}
.footer-social svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5}
.footer-social svg .fill{fill:currentColor;stroke:none}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:26px;padding-top:18px;border-top:1px solid rgba(247,241,231,.1)}
.footer-legal{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--display);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.footer-nav a:hover,.footer-legal a:hover{color:var(--gold)}
.faq-filterbar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.faq-filterbar button{appearance:none;border:1px solid rgba(247,241,231,.2);background:#11100d;color:var(--paper);font-family:var(--display);font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:11px 14px;border-radius:999px;cursor:pointer}
.faq-filterbar button.active,.faq-filterbar button:hover{background:var(--gold);border-color:var(--gold);color:#170f08}
.faq-list .group-title{font-family:var(--display);text-transform:uppercase;letter-spacing:.22em;font-size:11px;color:var(--gold-soft);display:flex;gap:18px;align-items:center;margin:42px 0 16px}
.faq-list .group-title .bar{flex:1;height:1px;background:rgba(247,241,231,.16)}
.faq-list .faq-item{background:#11100d;border:1px solid rgba(247,241,231,.12);padding:24px;margin-bottom:12px}
.faq-list .faq-item h3{font-size:23px;margin-bottom:10px}
.faq-list .answer{color:rgba(247,241,231,.76);font-size:17px;line-height:1.65}
.faq-list .answer p+p{margin-top:10px}
.faq-item[hidden],.group-title[hidden]{display:none!important}
.embed{background:#000;border:1px solid rgba(199,162,74,.34);box-shadow:0 30px 70px -30px rgba(0,0,0,.8);overflow:hidden}
.embed iframe{display:block;width:100%;height:520px;border:0}
.formbox{background:#f7f1e7;color:var(--ink);padding:30px;border-top:3px solid var(--gold)}
.formbox label{display:grid;gap:7px;margin-bottom:14px;font-family:var(--display);text-transform:uppercase;letter-spacing:.14em;font-size:11px;color:var(--green)}
.formbox input,.formbox select,.formbox textarea{width:100%;padding:13px 14px;border:1px solid rgba(14,92,63,.18);font-family:var(--body);font-size:17px}
.formbox textarea{min-height:110px;resize:vertical}
@media(max-width:820px){
  .topbar{height:64px;padding:0 15px}
  .brand img{height:29px}
  .nav-buy{display:none}
  .top-actions{gap:8px}
  .top-actions .btn{min-height:40px;padding:9px 14px;font-size:10.5px;letter-spacing:.12em;gap:7px}
  .top-actions .btn .arrow{width:12px}
  .menu-toggle{width:42px;height:42px}
  .hero{min-height:100svh!important;padding:90px 0 46px}
  .section-head,.split{grid-template-columns:1fr}
  .grid3{grid-template-columns:1fr}
  .split img{min-height:280px}
  .wrap{width:min(100% - 32px,1160px)}
  h1{font-size:clamp(42px,16vw,78px)}
  .side-menu{width:100vw}
  .hero h1{font-size:clamp(29px,7vw,48px)!important}
  .embed iframe{height:430px}
  .footer .footer-grid{grid-template-columns:1fr}
  .footer-bottom{display:grid}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}

html.js-reveal .reveal{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
html.js-reveal .reveal.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html.js-reveal .reveal{opacity:1!important;transform:none!important}}
.hero h1,.hero .lead,.hero .mini{text-shadow:0 2px 16px rgba(0,0,0,.55)}
.btn:hover{box-shadow:0 8px 24px -6px rgba(199,162,74,.55)}
.footer-logo{height:30px;width:auto;margin-bottom:7px;opacity:.96}
/* aire */
.mini{display:inline-block;margin-bottom:13px}
h1+p,h2+p,h1+.lead,h2+.lead{margin-top:15px}
.section-head{margin-bottom:38px}
@media(max-width:720px){.section-head{margin-bottom:24px}.hero .lead{margin-bottom:24px}}
/* aperturas consistentes (panel de stats como el home) */
.hero-inner{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:36px;align-items:end}
.hero-copy{max-width:920px}
.hero-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px;border-left:1px solid rgba(247,241,231,.2);padding-left:22px}
.hero-stats .stat{border-top:1px solid rgba(247,241,231,.14);padding-top:12px}
.hero-stats .stat strong{display:block;font-family:var(--display);letter-spacing:.06em;font-size:25px;color:var(--gold-soft)}
.hero-stats .stat span{display:block;margin-top:2px;font-family:var(--display);text-transform:uppercase;letter-spacing:.16em;font-size:10px;color:rgba(247,241,231,.66)}
@media(max-width:860px){.hero-inner{grid-template-columns:1fr;gap:24px}.hero-stats{grid-template-columns:repeat(3,minmax(0,1fr));border-left:0;border-top:1px solid rgba(247,241,231,.2);padding-left:0;padding-top:14px}}
@media(max-width:520px){.hero-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* ===== CAPA DE PROFUNDIDAD v1 - 2026-06-28 (juego de cajas / cartas fisicas) ===== */
.grid3,.split{box-shadow:0 30px 64px -40px rgba(0,0,0,.85)}
.card,.split>div{position:relative}
.card::after,.split>div::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(247,241,231,.18),transparent);pointer-events:none}
.paper .card::after,.paper .split>div::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent)}
.card{transition:transform .34s cubic-bezier(.2,.7,.2,1),background .34s ease}
.grid3 .card:hover{transform:translateY(-5px);background:#16140f;z-index:2}
.paper .grid3 .card:hover{background:#13452f}.paper .grid3 .card:hover,.paper .grid3 .card:hover h2,.paper .grid3 .card:hover h3,.paper .grid3 .card:hover p,.paper .grid3 .card:hover li,.paper .grid3 .card:hover strong{color:#f7f1e7}
.route,.deliverable,.pack{box-shadow:0 18px 40px -30px rgba(0,0,0,.7)}
.route:hover,.deliverable:hover,.pack:hover{transform:translateY(-5px);box-shadow:0 26px 50px -24px rgba(0,0,0,.6),0 0 0 1px rgba(199,162,74,.35)}
.faq-list .faq-item{box-shadow:0 14px 32px -26px rgba(0,0,0,.6);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.faq-list .faq-item:hover{transform:translateY(-3px);border-color:rgba(199,162,74,.45);box-shadow:0 22px 42px -24px rgba(0,0,0,.65)}
.formbox{box-shadow:0 34px 76px -36px rgba(0,0,0,.6)}
/* ===== JERARQUIA DE MARCA: marcos dorados + escala de citas (compartido) 2026-06-29 ===== */
/* Separador dorado con corona: ritmo editorial entre zonas */
.mf-divider{display:flex;align-items:center;justify-content:center;gap:16px;padding:clamp(26px,3.6vw,44px) 0;background:#070706;border-top:1px solid rgba(247,241,231,.08);border-bottom:1px solid rgba(247,241,231,.08)}
.mf-divider::before,.mf-divider::after{content:"";height:1px;width:min(240px,26vw);background:linear-gradient(90deg,transparent,rgba(199,162,74,.5),transparent)}
.mf-divider img{width:30px;height:auto;opacity:.92;filter:drop-shadow(0 2px 6px rgba(199,162,74,.28))}
/* Marco dorado con 4 coronas en esquinas para enmarcar una zona clave */
.mf-framed{position:relative}
.mf-framed::before{content:"";position:absolute;inset:16px;border:1px solid rgba(199,162,74,.26);pointer-events:none;z-index:2;background-image:url(/assets/mf-crown.png),url(/assets/mf-crown.png),url(/assets/mf-crown.png),url(/assets/mf-crown.png);background-repeat:no-repeat;background-size:26px;background-position:6px 6px,calc(100% - 6px) 6px,6px calc(100% - 6px),calc(100% - 6px) calc(100% - 6px)}
.mf-framed>.wrap{position:relative;z-index:3}
@media(max-width:620px){.mf-framed::before{inset:9px;background-size:20px}}
/* Escala de citas unificada: dos niveles intencionales, no tamaños arbitrarios */
.pull{font-family:var(--serif);font-style:italic;font-size:var(--t-pull);line-height:1.4;color:var(--gold-soft);max-width:46ch}
.pull-xl{font-family:var(--serif);font-style:italic;font-size:var(--t-pull-xl);line-height:1.12;color:#f7f1e7;max-width:20ch}

/* Escala unificada del sitio (vara: minimo de la pagina con mas texto; David 2026-07-02) */
@media(min-width:981px) and (max-height:700px){
  .hero h1{font-size:clamp(28px,3.2vw,46px)!important}
  .hero .lead{font-size:15.5px!important}
}

/* dock superior: en movil el topbar suelta el boton Comprar (la barra flotante inferior ya vende) y deja aire al dock musica-dado-chat */
@media(max-width:820px){.top-actions > .btn{display:none}}

/* ============================================================
   CHROME VERDE DE LA CASA (David aprobo 2026-07-20) · SOLO COLOR DEL CHROME
   Menu/topbar + side-menu + footer al verde profundo #06291c con
   acentos oro e3c873/c7a24a y texto crema f7f1e7. Mismos valores que
   preview-verde.html (ya en prod, aprobado). No toca layout, fuentes,
   tamanos, heros de contenido ni el store-hero (clases aparte).
   ============================================================ */
.topbar{
  background:linear-gradient(180deg,rgba(6,41,28,.95),rgba(6,41,28,.72) 62%,rgba(6,41,28,0));
  border-bottom:1px solid rgba(227,200,115,.22);
}
.menu-toggle{
  background:rgba(4,25,15,.55);
  border-color:rgba(227,200,115,.42);
  color:var(--paper);
}
.side-menu{
  background:#06291c;
  border-left:1px solid rgba(227,200,115,.3);
}
.menu-close{border-color:rgba(227,200,115,.32)}
.menu-links{border-top:1px solid rgba(227,200,115,.24)}
.menu-links a{border-bottom:1px solid rgba(227,200,115,.16)}
.menu-foot{color:rgba(247,241,231,.7)}
/* footer verde profundo + oro (ladder 06291c -> 04190f) */
.footer{
  background:linear-gradient(180deg,#06291c,#04190f);
  border-top:2px solid rgba(199,162,74,.55);
}
.footer-social a{border-color:rgba(227,200,115,.35)}
.footer-bottom{border-top:1px solid rgba(227,200,115,.2)}