/* ─── TOKENS ─────────────────────────────── */
:root {
  --ivory:     #F6F1EC;
  --cream:     #EEE5DA;
  --champagne: #E8D5C0;
  --rose:      #C4868F;
  --mauve:     #7D4555;
  --taupe:     #785F55;
  --leather:   #6E4E46;
  --dark:      #2E2220;
  --white:     #FDFAF7;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Jost',sans-serif;background:var(--ivory);color:var(--dark);font-weight:300;line-height:1.7;font-size:15px}

/* ─── TYPE ───────────────────────────────── */
.serif{font-family:'Cormorant Garamond',serif;font-weight:300}
.serif-i{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:300}
.eyebrow{font-size:10px;letter-spacing:4px;text-transform:uppercase;color:var(--taupe);font-weight:400}

/* ─── NAV ────────────────────────────────── */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 32px;height:64px;
  background:rgba(246,241,236,0.92);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--champagne);
  gap:16px;
}
.nav-logo{font-family:'Cormorant Garamond',serif;font-size:20px;color:var(--leather);letter-spacing:1px;flex-shrink:0;white-space:nowrap}
.nav-links{display:flex;gap:20px;list-style:none;flex-shrink:1;overflow:hidden}
.nav-links a{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--taupe);text-decoration:none;transition:color .2s;white-space:nowrap}
.nav-links a:hover{color:var(--mauve)}
.nav-cta{
  font-size:10px;letter-spacing:2px;text-transform:uppercase;
  background:var(--leather);color:var(--ivory);
  padding:10px 20px;text-decoration:none;
  transition:background .2s;flex-shrink:0;white-space:nowrap;
}
.nav-cta:hover{background:var(--mauve)}
.nav-actions{display:flex;gap:8px;flex-shrink:0}
.nav-cta-ghost{background:transparent;border:1px solid var(--taupe);color:var(--taupe)}
.nav-cta-ghost:hover{background:transparent;border-color:var(--mauve);color:var(--mauve)}
.nav-mobile-right{display:none;align-items:center;gap:8px;flex-shrink:0}
.nav-cta-sm{padding:8px 14px;font-size:11px;letter-spacing:1.5px}
.nav-mobile-toggle{background:none;border:none;cursor:pointer;color:var(--leather);font-size:22px;flex-shrink:0}

/* ─── HERO ───────────────────────────────── */
#hero{
  min-height:100vh;padding-top:64px;
  display:grid;grid-template-columns:1fr 1fr;
}
.hero-img{
  position:relative;overflow:hidden;
}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.hero-img-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to right,transparent 55%,var(--champagne) 100%);
}
.hero-copy{
  background:var(--champagne);
  display:flex;flex-direction:column;justify-content:center;
  padding:80px 64px;position:relative;overflow:hidden;
}
.hero-wm{
  position:absolute;top:24px;right:24px;
  font-family:'Cormorant Garamond',serif;font-size:160px;font-weight:300;
  color:var(--rose);opacity:.07;line-height:1;pointer-events:none;user-select:none;
}
.hero-tag{font-size:10px;letter-spacing:5px;text-transform:uppercase;color:var(--mauve);margin-bottom:20px;font-weight:500}
.hero-name{font-size:clamp(48px,5.5vw,76px);color:var(--leather);line-height:1.05;margin-bottom:10px}
.hero-handle{font-size:16px;color:var(--leather);margin-bottom:28px;letter-spacing:1px}
.hero-badge{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--mauve);color:white;
  font-size:10px;letter-spacing:3px;text-transform:uppercase;
  padding:10px 22px;margin-bottom:36px;font-weight:500;width:fit-content;
}
.hero-pillars{display:flex;flex-direction:column;gap:9px;margin-bottom:44px}
.hero-pillar{
  display:flex;align-items:center;gap:14px;
  font-size:13px;color:var(--leather);letter-spacing:.5px;
}
.hero-pillar::before{content:'';width:24px;height:1px;background:var(--rose);flex-shrink:0}
.hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--taupe);border:1px solid var(--taupe)}
.hstat{background:var(--champagne);padding:18px 12px;text-align:center}
.hstat-n{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--leather);display:block;line-height:1}
.hstat-l{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--leather);display:block;margin-top:5px}
.hero-cta-row{display:flex;gap:12px;margin-top:28px}
.btn-primary{
  font-size:10px;letter-spacing:3px;text-transform:uppercase;
  background:var(--leather);color:var(--ivory);
  padding:14px 28px;text-decoration:none;font-weight:500;transition:background .2s;
}
.btn-primary:hover{background:var(--mauve)}
.btn-ghost{
  font-size:10px;letter-spacing:3px;text-transform:uppercase;
  border:1px solid var(--taupe);color:var(--taupe);
  padding:14px 28px;text-decoration:none;font-weight:400;transition:all .2s;
}
.btn-ghost:hover{border-color:var(--mauve);color:var(--mauve)}

/* ─── SECTION BASE ───────────────────────── */
section{padding:100px 48px}
.si{max-width:1080px;margin:0 auto}
.sh{margin-bottom:64px}
.sh-num{font-family:'Cormorant Garamond',serif;font-size:13px;color:var(--mauve);letter-spacing:3px;display:block;margin-bottom:8px}
.sh-title{font-size:clamp(34px,4vw,52px);color:var(--leather);line-height:1.1;margin-bottom:16px}
.sh-sub{font-size:15px;color:var(--taupe);max-width:540px;line-height:1.85}

/* ─── DIVIDER ────────────────────────────── */
.div-line{height:1px;background:linear-gradient(to right,transparent,var(--rose),transparent);margin:0 0 64px}

/* ─── 01 OPORTUNIDAD ─────────────────────── */
#oportunidad{background:var(--ivory)}
.oport-pull{
  font-family:'Cormorant Garamond',serif;font-size:clamp(20px,2.4vw,28px);
  font-style:italic;font-weight:300;color:var(--leather);
  line-height:1.6;max-width:760px;
  border-left:2px solid var(--rose);padding-left:32px;
  margin:48px 0;
}
.oport-body{font-size:15px;color:var(--dark);line-height:1.9;max-width:720px;margin-bottom:64px}
.pain-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--champagne)}
.pain-card{background:var(--ivory);padding:40px 36px}
.pain-icon{font-size:24px;margin-bottom:16px;display:block}
.pain-title{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--leather);font-weight:500;margin-bottom:12px}
.pain-text{font-size:14px;color:var(--taupe);line-height:1.75}
.oport-close{
  background:var(--leather);color:var(--ivory);
  padding:48px 56px;margin-top:64px;
  display:flex;align-items:center;gap:48px;
}
.oport-close-quote{
  font-family:'Cormorant Garamond',serif;font-size:clamp(18px,2vw,24px);
  font-style:italic;font-weight:300;line-height:1.6;flex:1;
}
.oport-close-label{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--champagne);margin-top:16px}

/* ─── 02 AUDIENCIA ───────────────────────── */
#audiencia{background:var(--cream)}
.aud-intro{font-size:15px;color:var(--taupe);line-height:1.9;max-width:660px;margin-bottom:64px}
.aud-platform{margin-bottom:64px}
.platform-header{
  display:flex;align-items:center;gap:20px;margin-bottom:40px;
  padding-bottom:20px;border-bottom:1px solid var(--champagne);
}
.platform-name{font-size:13px;letter-spacing:4px;text-transform:uppercase;color:var(--leather);font-weight:500}
.platform-tag{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--taupe)}
.aud-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--taupe);margin-bottom:40px}
.aud-kpi{background:var(--white);padding:32px 24px;text-align:center}
.aud-kpi.featured{background:var(--leather)}
.aud-kpi.featured .kpi-n,.aud-kpi.featured .kpi-l{color:var(--champagne)}
.kpi-n{font-family:'Cormorant Garamond',serif;font-size:42px;color:var(--leather);line-height:1;display:block}
.kpi-l{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--taupe);display:block;margin-top:8px}
.kpi-s{font-size:11px;color:var(--mauve);display:block;margin-top:6px}
.aud-demo-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;margin-bottom:32px}
.demo-card{background:var(--white);padding:36px 28px;border:1px solid var(--champagne)}
.demo-title{font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--taupe);margin-bottom:28px;display:flex;align-items:center;gap:10px}
.demo-title::after{content:'';flex:1;height:1px;background:var(--champagne)}
/* gender */
.gender-item{margin-bottom:20px}
.gender-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px}
.gender-name{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--leather);font-weight:500}
.gender-pct{font-family:'Cormorant Garamond',serif;font-size:32px;color:var(--mauve);font-weight:300}
.bar{height:2px;background:var(--champagne);margin-top:4px}
.bar-f{height:100%;background:linear-gradient(to right,var(--rose),var(--mauve))}
/* age */
.age-row{display:flex;align-items:center;gap:12px;margin-bottom:13px}
.age-label{font-size:11px;color:var(--taupe);width:44px;flex-shrink:0}
.age-bar{flex:1;height:2px;background:var(--champagne)}
.age-bar-f{height:100%;background:var(--rose)}
.age-pct{font-size:12px;color:var(--leather);width:36px;text-align:right;font-weight:500}
.age-highlight{color:var(--mauve)!important;font-weight:600}
.age-label-hl{color:var(--leather)!important;font-weight:500}
/* cities */
.city-row{margin-bottom:16px}
.city-top{display:flex;justify-content:space-between;margin-bottom:6px}
.city-name{font-size:13px;color:var(--leather)}
.city-pct{font-size:12px;color:var(--taupe)}
.city-bar{height:2px;background:var(--champagne)}
.city-bar-f{height:100%;background:var(--rose)}
/* countries */
.countries-wide{background:var(--white);padding:36px 36px;border:1px solid var(--champagne)}
.country-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:24px}
.country-item{}
.country-name{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--taupe)}
.country-num{font-family:'Cormorant Garamond',serif;font-size:40px;color:var(--leather);font-weight:300;line-height:1.1}
.country-bar{height:2px;background:var(--champagne);margin-top:6px}
.country-bar-f{height:100%;background:var(--rose)}

/* insight box */
.insight-box{
  background:var(--leather);color:var(--ivory);
  padding:40px 48px;margin-top:32px;
  display:flex;align-items:flex-start;gap:24px;
}
.insight-icon{font-size:24px;flex-shrink:0;margin-top:2px}
.insight-text{font-size:14px;line-height:1.85;color:var(--champagne)}
.insight-text strong{color:var(--ivory);font-weight:500}

/* personas */
.personas-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.persona-card{background:var(--white);padding:36px 28px;border:1px solid var(--champagne);position:relative}
.persona-num{
  position:absolute;top:20px;right:20px;
  font-family:'Cormorant Garamond',serif;font-size:60px;font-weight:300;
  color:var(--champagne);line-height:1;
}
.persona-icon{font-size:28px;margin-bottom:16px;display:block}
.persona-name{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--leather);font-weight:500;margin-bottom:4px}
.persona-age{font-size:12px;color:var(--mauve);margin-bottom:16px}
.persona-desc{font-size:14px;color:var(--taupe);line-height:1.75}

/* ─── 03 POR QUÉ CAROLINA ────────────────── */
#porque{background:var(--ivory)}
.pq-quote-block{
  background:var(--champagne);padding:56px 64px;margin-bottom:64px;
  display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;
}
.pq-quote{
  font-family:'Cormorant Garamond',serif;font-size:clamp(20px,2.2vw,26px);
  font-style:italic;font-weight:300;color:var(--leather);line-height:1.7;
}
.pq-attr{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--taupe);margin-top:16px}
.pq-photo{width:160px;height:200px;object-fit:cover;object-position:center top;flex-shrink:0}
.reasons-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--champagne);margin-bottom:48px}
.reason-card{background:var(--ivory);padding:40px 36px;display:flex;gap:24px}
.reason-num{
  font-family:'Cormorant Garamond',serif;font-size:48px;font-weight:300;
  color:var(--champagne);line-height:1;flex-shrink:0;
}
.reason-icon{font-size:22px;margin-bottom:12px;display:block}
.reason-title{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--leather);font-weight:500;margin-bottom:10px}
.reason-text{font-size:14px;color:var(--taupe);line-height:1.75}
.content-split-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--champagne)}
.csm-card{background:var(--white);padding:32px 20px;text-align:center}
.csm-n{font-family:'Cormorant Garamond',serif;font-size:40px;color:var(--leather);display:block;line-height:1}
.csm-l{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--taupe);display:block;margin-top:8px}
.formats-breakdown{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.fmt-card{background:var(--white);padding:36px 28px;border-left:3px solid var(--rose)}
.fmt-pct{font-family:'Cormorant Garamond',serif;font-size:52px;color:var(--mauve);font-weight:300;line-height:1;display:block;margin-bottom:4px}
.fmt-name{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--leather);font-weight:500;margin-bottom:10px}
.fmt-arrow{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--mauve);margin-top:16px}
.fmt-desc{font-size:13px;color:var(--taupe);line-height:1.7;margin-bottom:12px}

/* ─── 04 FORMATOS ────────────────────────── */
#formatos{background:var(--cream)}
.formats-grid{display:flex;flex-direction:column;gap:2px}
.format-row{
  background:var(--white);
  display:grid;grid-template-columns:auto 1fr auto;
  align-items:stretch;cursor:pointer;
  transition:background .2s;
}
.format-row:hover{background:var(--ivory)}
.format-row.open{background:var(--ivory)}
.format-tag{
  background:var(--leather);
  width:64px;display:flex;align-items:center;justify-content:center;
  font-size:10px;letter-spacing:3px;text-transform:uppercase;
  color:var(--champagne);writing-mode:vertical-rl;text-orientation:mixed;
  padding:20px 0;flex-shrink:0;
}
.format-main{padding:28px 32px}
.format-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.format-name-col{}
.format-name{font-size:15px;font-weight:500;color:var(--leather);margin-bottom:4px}
.format-sub{font-size:12px;color:var(--taupe);letter-spacing:.5px}
.format-price-col{text-align:right;flex-shrink:0}
.format-price{font-family:'Cormorant Garamond',serif;font-size:36px;color:var(--mauve);font-weight:300;line-height:1;display:block}
.format-toggle{
  width:48px;display:flex;align-items:flex-start;justify-content:center;
  padding-top:28px;font-size:18px;color:var(--taupe);
  transition:transform .3s;flex-shrink:0;
}
.format-detail{
  display:none;padding:0 32px 28px;
  border-top:1px solid var(--champagne);margin-top:16px;
}
.format-detail.visible{display:block}
.format-when{
  font-size:11px;letter-spacing:3px;text-transform:uppercase;
  color:var(--mauve);margin-bottom:12px;margin-top:20px;
}
.format-detail-text{font-size:14px;color:var(--taupe);line-height:1.8;max-width:640px}

/* ─── 05 INVERSIÓN ───────────────────────── */
#inversion{background:var(--leather)}
#inversion .eyebrow{color:var(--champagne)}
#inversion .sh-num{color:var(--champagne)}
#inversion .sh-title{color:var(--ivory)}
#inversion .sh-sub{color:var(--champagne)}
.inv-pull{
  font-family:'Cormorant Garamond',serif;font-size:clamp(18px,2vw,24px);
  font-style:italic;font-weight:300;color:var(--ivory);
  line-height:1.7;max-width:700px;
  border-left:2px solid var(--rose);padding-left:32px;
  margin:0 0 64px;opacity:.9;
}
.tarifa-table{width:100%;border-collapse:collapse;margin-bottom:48px}
.tarifa-table th{
  text-align:left;font-size:11px;letter-spacing:4px;text-transform:uppercase;
  color:var(--champagne);padding:0 28px 20px;
  border-bottom:1px solid rgba(255,255,255,.1);font-weight:400;
}
.tarifa-table td{
  padding:20px 28px;color:var(--ivory);font-size:14px;
  border-bottom:1px solid rgba(255,255,255,.06);vertical-align:middle;
}
.tarifa-table tr:hover td{background:rgba(255,255,255,.04)}
.t-name{font-weight:500;letter-spacing:.3px}
.t-sub{font-size:12px;color:var(--champagne);margin-top:3px}
.t-price{font-family:'Cormorant Garamond',serif;font-size:30px;color:var(--champagne);font-weight:300;white-space:nowrap}
/* paquetes */
.packs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:rgba(255,255,255,.08);margin-bottom:48px}
.pack-card{background:rgba(255,255,255,.04);padding:40px 32px;position:relative}
.pack-card.featured{background:rgba(255,255,255,.1)}
.pack-badge{
  position:absolute;top:-1px;right:24px;
  background:var(--mauve);color:white;
  font-size:11px;letter-spacing:3px;text-transform:uppercase;
  padding:6px 16px;font-weight:500;
}
.pack-name{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--champagne);margin-bottom:16px}
.pack-contents{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}
.pack-line{font-size:13px;color:var(--champagne);display:flex;align-items:center;gap:10px}
.pack-line::before{content:'—';color:var(--champagne);flex-shrink:0}
.pack-price{font-family:'Cormorant Garamond',serif;font-size:52px;color:var(--ivory);font-weight:300;line-height:1;display:block;margin-bottom:4px}
.pack-saving{font-size:11px;color:var(--champagne);letter-spacing:1px}
.pack-ideal{font-size:13px;color:var(--champagne);margin-top:16px;line-height:1.7;font-style:italic}
/* addons */
.addons-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.addon-card{border:1px solid rgba(255,255,255,.12);padding:28px}
.addon-name{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--champagne);margin-bottom:8px}
.addon-price{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--ivory);font-weight:300;margin-bottom:10px}
.addon-desc{font-size:13px;color:var(--champagne);line-height:1.65}
.inv-note{
  font-size:12px;color:var(--champagne);
  border-top:1px solid rgba(255,255,255,.1);padding-top:24px;margin-top:24px;
  line-height:1.8;
}

/* ─── 06 HABLEMOS ────────────────────────── */
#hablemos{background:var(--ivory)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.contact-card{background:var(--white);padding:56px 48px;border:1px solid var(--champagne)}
.contact-name{font-size:clamp(36px,4vw,56px);color:var(--leather);line-height:1.05;margin-bottom:6px}
.contact-handle{font-size:15px;color:var(--mauve);margin-bottom:40px;letter-spacing:1px}
.contact-items{display:flex;flex-direction:column;gap:18px;margin-bottom:40px}
.contact-item{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--taupe);text-decoration:none;transition:color .2s}
.contact-item:hover{color:var(--mauve)}
.contact-item-icon{font-size:16px;width:24px;flex-shrink:0}
.process-card{background:var(--white);padding:48px;border:1px solid var(--champagne)}
.process-title{font-size:10px;letter-spacing:4px;text-transform:uppercase;color:var(--taupe);margin-bottom:32px}
.process-steps{display:flex;flex-direction:column;gap:0}
.step{display:flex;gap:24px;padding:24px 0;border-bottom:1px solid var(--champagne)}
.step:last-child{border-bottom:none}
.step-num{
  font-family:'Cormorant Garamond',serif;font-size:36px;color:var(--champagne);
  font-weight:300;line-height:1;flex-shrink:0;width:32px;
}
.step-title{font-size:11px;font-weight:500;letter-spacing:2px;color:var(--leather);margin-bottom:6px;text-transform:uppercase}
.step-desc{font-size:13px;color:var(--taupe);line-height:1.7}

/* ─── FOOTER ─────────────────────────────── */
footer{background:var(--dark);text-align:center;padding:32px}
footer p{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--champagne)}

/* ─── RESPONSIVE ─────────────────────────── */
@media(max-width:960px){
  nav{padding:0 16px}
  .nav-links{display:none}
  .nav-actions{display:none}
  .nav-mobile-right{display:flex}
  #hero{grid-template-columns:1fr}
  .hero-img{height:70vw;min-height:320px}
  .hero-img-overlay{background:linear-gradient(to bottom,transparent 78%,var(--champagne) 100%)}
  .hero-copy{padding:56px 32px}
  .hero-stats{grid-template-columns:repeat(4,1fr)}
  section{padding:72px 24px}
  .pain-grid{grid-template-columns:1fr}
  .aud-kpis{grid-template-columns:repeat(2,1fr)}
  .aud-demo-grid{grid-template-columns:1fr}
  .country-grid{grid-template-columns:repeat(2,1fr)}
  .personas-grid{grid-template-columns:1fr}
  .pq-quote-block{grid-template-columns:1fr;gap:24px}
  .pq-photo{width:100%;height:200px}
  .reasons-grid{grid-template-columns:1fr}
  .content-split-metrics{grid-template-columns:repeat(2,1fr)}
  .formats-breakdown{grid-template-columns:1fr}
  .format-row{grid-template-columns:auto 1fr auto}
  .packs-grid{grid-template-columns:1fr}
  .addons-grid{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .oport-close{flex-direction:column;gap:24px;padding:36px 32px}
}
@media(max-width:600px){
  section{padding:56px 20px}
  .hero-copy{padding:40px 20px}
  .hero-stats{grid-template-columns:repeat(2,1fr)}
  .aud-kpis{grid-template-columns:repeat(2,1fr)}
  .content-split-metrics{grid-template-columns:repeat(2,1fr)}
  .tarifa-table th:nth-child(2),.tarifa-table td:nth-child(2){display:none}
  .format-row{grid-template-columns:auto 1fr auto}
  .format-tag{width:44px;font-size:9px}
  .contact-card,.process-card{padding:36px 24px}
}
