/* ── FUENTES LOCALES ── */
@font-face {
  font-family: 'Adero Trial';
  src: url('../assets/fonts/AderoTrial-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Adero Trial';
  src: url('../assets/fonts/AderoTrial-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Adero Trial';
  src: url('../assets/fonts/AderoTrial-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Adero Trial';
  src: url('../assets/fonts/AderoTrial-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Adero Trial';
  src: url('../assets/fonts/AderoTrial-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Adero Trial';
  src: url('../assets/fonts/AderoTrial-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Adero Trial';
  src: url('../assets/fonts/AderoTrial-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* ── VARIABLES ── */
:root {
  --bg:    #EFEFEC;
  --white: #FFFFFF;
  --black: #000000;
  --red:   #861F21;
  --mid:   #666;
  --light: #F5F5F2;
  --bord:  rgba(0,0,0,.09);
  --font:  'Adero Trial', sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--black);overflow-x:hidden}

/* grain */
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.03;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ── NAV ── */
nav{position:sticky;top:0;z-index:500;background:rgba(239,239,236,.95);backdrop-filter:blur(12px);
    border-bottom:1px solid var(--bord);display:flex;align-items:center;justify-content:space-between;padding:1rem 3.5rem}
.nav-logo svg{height:34px;width:auto;display:block}
.nav-links{display:flex;align-items:center;gap:2rem}
.nav-links a{font-family:var(--font);font-size:.95rem;font-weight:600;
    letter-spacing:.06em;text-transform:uppercase;color:var(--mid);text-decoration:none;transition:color .2s}
.nav-links a:hover{color:var(--black)}
.nav-cta{color:var(--white)!important;background:var(--black);padding:.5rem 1.4rem;
    border-radius:40px;transition:background .2s!important}
.nav-cta:hover{background:var(--red)!important}

/* ── HERO ── */
.hero{min-height:90vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;
      padding:4rem 3.5rem;gap:3rem;overflow:hidden}
.hero-eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--font);
    font-size:.85rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:1.5rem}
.hero-eyebrow::before{content:'';display:block;width:22px;height:1.5px;background:var(--red)}
h1{font-family:var(--font);font-size:clamp(3.6rem,6.5vw,7rem);font-weight:900;
    line-height:.95;letter-spacing:-.02em;color:var(--black);margin-bottom:1.8rem}
h1 .red{color:var(--red)}
.hero-note{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font);
    font-size:.85rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--red);
    background:rgba(134,31,33,.07);padding:.5rem 1rem;border-radius:40px;margin-bottom:1.8rem}
.hero-note::before{content:'★';font-size:.8rem}
.hero-body{font-size:1rem;font-weight:300;line-height:1.85;color:var(--mid);max-width:400px;margin-bottom:2.5rem}
.hero-pills{display:flex;gap:.8rem;flex-wrap:wrap}
.pill{font-family:var(--font);font-size:.92rem;font-weight:700;letter-spacing:.04em;
    text-transform:uppercase;padding:.65rem 1.6rem;border-radius:40px;text-decoration:none;
    transition:all .2s;border:2px solid transparent;cursor:pointer}
.pill-solid{background:var(--black);color:var(--white);border-color:var(--black)}
.pill-solid:hover{background:var(--red);border-color:var(--red)}
.pill-outline{background:transparent;color:var(--black);border-color:var(--black)}
.pill-outline:hover{background:var(--black);color:var(--white)}

/* hero right */
.hero-right{display:flex;align-items:center;justify-content:center;position:relative}
.hero-visual{width:100%;max-width:480px;aspect-ratio:3/4;background:#141414;border-radius:20px;
    display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.hero-visual img{height:88%;object-fit:contain;position:relative;z-index:1;
    filter:drop-shadow(0 20px 50px rgba(0,0,0,.6))}
.hero-visual::before{content:'';position:absolute;bottom:-80px;left:50%;transform:translateX(-50%);
    width:300px;height:300px;background:var(--red);border-radius:50%;opacity:.15}
.hero-chip{position:absolute;bottom:1.4rem;left:1.4rem;background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(6px);padding:.8rem 1.1rem;
    border-radius:10px;z-index:2}
.hero-chip strong{font-family:var(--font);font-size:1.4rem;font-weight:900;
    color:var(--white);display:block;line-height:1}
.hero-chip small{font-size:.75rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
    color:rgba(255,255,255,.4);display:block;margin-top:.2rem}
.hero-chip2{position:absolute;top:1.2rem;right:1.2rem;background:var(--red);
    font-family:var(--font);font-size:.78rem;font-weight:800;
    letter-spacing:.08em;text-transform:uppercase;color:var(--white);padding:.4rem .9rem;
    border-radius:20px;z-index:2}

/* ── TICKER ── */
.ticker{background:var(--black);padding:.9rem 0;overflow:hidden;white-space:nowrap}
.ticker-inner{display:inline-flex;gap:2.5rem;animation:ticker 28s linear infinite}
.t-item{font-family:var(--font);font-size:.9rem;font-weight:700;
    letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.28)}
.t-dot{color:var(--red)}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── SECTION COMMONS ── */
section{padding:6rem 3.5rem}
.sec-label{font-family:var(--font);font-size:.85rem;font-weight:700;
    letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:.6rem}
h2{font-family:var(--font);font-size:clamp(2.6rem,4vw,4.5rem);font-weight:900;
    line-height:.97;letter-spacing:-.02em;color:var(--black);margin-bottom:1rem;text-transform:uppercase}
h2.on-dark{color:var(--white)}
.sec-intro{font-size:1rem;font-weight:300;line-height:1.8;color:var(--mid);max-width:500px;margin-bottom:3rem}
.sec-intro.on-dark{color:rgba(255,255,255,.45)}

/* ── BLOQUE 2: TODOS LOS MODELOS ── */
.all-models-header{display:grid;grid-template-columns:1fr 1fr;align-items:end;margin-bottom:3rem}
.all-models-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.model-card{background:var(--white);border:1.5px solid var(--bord);border-radius:16px;overflow:hidden;
    transition:transform .3s,box-shadow .3s}
.model-card:hover{transform:translateY(-5px);box-shadow:0 16px 48px rgba(0,0,0,.09)}
.model-card.feat-card{border-color:var(--red)}
.mc-top{background:#141414;height:220px;display:flex;align-items:center;justify-content:center;
    position:relative;overflow:hidden}
.mc-top::before{content:'';position:absolute;bottom:-50px;left:50%;transform:translateX(-50%);
    width:180px;height:180px;background:var(--red);border-radius:50%;opacity:.13}
.mc-top img{height:88%;object-fit:contain;position:relative;z-index:1;
    filter:drop-shadow(0 12px 30px rgba(0,0,0,.6))}
.mc-top .img-ph{font-family:var(--font);font-size:1.6rem;font-weight:900;
    color:rgba(255,255,255,.1);position:relative;z-index:1;text-align:center;letter-spacing:.03em}
.mc-badge{position:absolute;top:.8rem;right:.8rem;z-index:2;font-family:var(--font);
    font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
    padding:.28rem .75rem;border-radius:20px}
.badge-red{background:var(--red);color:var(--white)}
.badge-blk{background:var(--black);color:var(--white)}
.mc-body{padding:1.3rem 1.4rem 1.5rem}
.mc-name{font-family:var(--font);font-size:1.5rem;font-weight:900;
    text-transform:uppercase;color:var(--black);line-height:1;margin-bottom:.25rem}
.mc-sub{font-size:.88rem;font-weight:300;color:var(--mid);line-height:1.5;margin-bottom:1.1rem}
.mc-specs{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;margin-bottom:1.1rem}
.mcs{background:var(--bg);border-radius:7px;padding:.5rem .65rem}
.mcs-l{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
    color:var(--mid);display:block;margin-bottom:.12rem}
.mcs-v{font-family:var(--font);font-size:1rem;font-weight:800;color:var(--black)}
.mc-foot{display:flex;align-items:center;justify-content:space-between;
    padding-top:.9rem;border-top:1px solid var(--bord)}
.mc-price{font-family:var(--font);font-size:1.15rem;font-weight:900;color:var(--black)}
.mc-price sup{font-size:.72rem;font-weight:500;color:var(--mid);vertical-align:super}
.mc-vol{font-family:var(--font);font-size:.78rem;font-weight:800;letter-spacing:.06em;
    text-transform:uppercase;color:var(--red);background:rgba(134,31,33,.07);padding:.26rem .65rem;border-radius:20px}

/* demand divider */
.demand-row{display:flex;align-items:center;gap:1rem;margin:3rem 0 1.2rem}
.demand-pill{font-family:var(--font);font-size:.82rem;font-weight:800;
    letter-spacing:.1em;text-transform:uppercase;padding:.4rem 1rem;border-radius:6px}
.dp-high{background:var(--black);color:var(--white)}
.dp-low{background:var(--light);color:var(--mid);border:1px solid var(--bord)}
.demand-line{flex:1;height:1px;background:var(--bord)}

/* ── BLOQUE 3: DOS NIVELES ── */
.two-levels{background:var(--light)}
.seg-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--bord);
    border-radius:16px;overflow:hidden;margin-top:0}
.seg{background:var(--white);padding:2.5rem}
.seg:hover{background:#FAFAF8}
.seg-icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;
    justify-content:center;font-size:1.3rem;margin-bottom:1rem}
.seg-icon.low{background:rgba(0,0,0,.05)}
.seg-icon.hi{background:rgba(134,31,33,.08)}
.seg-title{font-family:var(--font);font-size:1.4rem;font-weight:800;
    text-transform:uppercase;color:var(--black);margin-bottom:.4rem}
.seg-desc{font-size:.92rem;font-weight:300;color:var(--mid);line-height:1.7;margin-bottom:1.2rem}
.seg-tags{display:flex;flex-wrap:wrap;gap:.4rem}
.stag{font-family:var(--font);font-size:.82rem;font-weight:700;
    letter-spacing:.04em;text-transform:uppercase;padding:.28rem .75rem;border-radius:20px;border:1.5px solid}
.stag-blk{border-color:var(--black);color:var(--black)}
.stag-red{border-color:var(--red);color:var(--red)}

/* ── BLOQUE 4: COMPARATIVO ── */
.compare-section{background:var(--black)}
.compare-section .sec-label{color:var(--red)}
.cmp-toggle{display:flex;gap:.6rem;margin-bottom:3rem;flex-wrap:wrap}
.cmp-btn{font-family:var(--font);font-size:.9rem;font-weight:800;
    letter-spacing:.08em;text-transform:uppercase;padding:.6rem 1.4rem;border-radius:6px;
    cursor:pointer;border:none;transition:all .2s}
.cmp-btn.active{background:var(--red);color:var(--white)}
.cmp-btn.inactive{background:rgba(255,255,255,.07);color:rgba(255,255,255,.4)}
.cmp-btn:hover{background:var(--red);color:var(--white)}
.cmp-panel{display:none}
.cmp-panel.active{display:block}
.cmp-tbl{width:100%;border-collapse:collapse;font-size:.92rem}
.cmp-tbl th{font-family:var(--font);font-size:.92rem;font-weight:800;
    letter-spacing:.04em;text-transform:uppercase;padding:1rem 1.2rem;text-align:left;
    border-bottom:2px solid rgba(255,255,255,.08);color:rgba(255,255,255,.35)}
.cmp-tbl th.hl{color:var(--white);border-bottom-color:var(--red)}
.cmp-tbl td{padding:.85rem 1.2rem;border-bottom:1px solid rgba(255,255,255,.05);
    color:rgba(255,255,255,.55);font-weight:300}
.cmp-tbl td:first-child{font-size:.82rem;font-weight:700;letter-spacing:.06em;
    text-transform:uppercase;color:rgba(255,255,255,.25)}
.cmp-tbl td.hl{color:var(--white);font-weight:600;background:rgba(134,31,33,.14)}
.cmp-tbl tr:last-child td{border-bottom:none}
.chk{color:#5DCB5D}
.crs{color:rgba(255,255,255,.15)}

/* ── BLOQUE 5: SPECS TABS ── */
.specs-section{}
.tabs-bar{display:flex;gap:0;border-bottom:1px solid var(--bord);margin-bottom:3rem;overflow-x:auto}
.tab-btn{font-family:var(--font);font-size:.92rem;font-weight:700;
    letter-spacing:.06em;text-transform:uppercase;padding:.9rem 1.3rem;background:none;
    border:none;cursor:pointer;color:var(--mid);border-bottom:2.5px solid transparent;
    margin-bottom:-1px;white-space:nowrap;transition:color .2s,border-color .2s}
.tab-btn.active{color:var(--black);border-bottom-color:var(--black)}
.tab-btn:hover{color:var(--black)}
.tab-panel{display:none}
.tab-panel.active{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.spec-row{display:flex;justify-content:space-between;align-items:baseline;
    padding:.85rem 0;border-bottom:1px solid var(--bord);gap:1rem}
.spec-row:last-child{border-bottom:none}
.sr-lbl{font-size:.9rem;font-weight:400;color:var(--mid);flex-shrink:0}
.sr-val{font-family:var(--font);font-size:1rem;font-weight:800;
    color:var(--black);text-align:right}
.spec-img{background:#141414;border-radius:14px;height:360px;display:flex;align-items:center;
    justify-content:center;position:relative;overflow:hidden}
.spec-img::before{content:'';position:absolute;bottom:-60px;left:50%;transform:translateX(-50%);
    width:220px;height:220px;background:var(--red);border-radius:50%;opacity:.1}
.spec-img img{height:82%;object-fit:contain;position:relative;z-index:1;
    filter:drop-shadow(0 16px 36px rgba(0,0,0,.6))}
.spec-ph{font-family:var(--font);font-size:3rem;font-weight:900;
    color:rgba(255,255,255,.08);position:relative;z-index:1}
.spec-colors{margin-top:1.4rem}
.spec-colors h5{font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--mid);margin-bottom:.65rem}
.color-row{display:flex;gap:.6rem}
.cdot{display:flex;flex-direction:column;align-items:center;gap:.3rem}
.cdot span{width:1.7rem;height:1.7rem;border-radius:50%;display:block;border:2px solid var(--bord)}
.cdot label{font-size:.7rem;color:var(--mid);letter-spacing:.04em}
.c-black{background:#111!important}
.c-white{background:#f0f0f0!important;border-color:#ccc!important}
.c-grey{background:#888!important}
.c-chrome{background:linear-gradient(135deg,#d4d4d4,#888,#d4d4d4)!important}
.spec-note{font-size:.88rem;font-weight:300;color:var(--mid);margin-top:1.4rem;line-height:1.75}
/* CTA bajo specs */
.specs-cta-bar{background:var(--light);border-top:1px solid var(--bord);padding:1.5rem 3.5rem;
    display:flex;align-items:center;justify-content:space-between;gap:2rem}
.specs-cta-bar p{font-size:.92rem;font-weight:300;color:var(--mid)}
.btn-cta{font-family:var(--font);font-size:.92rem;font-weight:800;
    letter-spacing:.06em;text-transform:uppercase;background:var(--black);color:var(--white);
    text-decoration:none;padding:.75rem 1.8rem;border-radius:40px;transition:background .2s;white-space:nowrap}
.btn-cta:hover{background:var(--red)}

/* ── BLOQUE 6: FEATURES ── */
.feats-section{background:var(--light)}
.feats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.feat-card{background:var(--white);border:1px solid var(--bord);border-radius:14px;padding:1.8rem;
    transition:border-color .2s,transform .2s}
.feat-card:hover{border-color:var(--red);transform:translateY(-3px)}
.feat-num{font-family:var(--font);font-size:2.5rem;font-weight:900;
    color:rgba(0,0,0,.05);line-height:1;margin-bottom:.35rem}
.feat-card h4{font-family:var(--font);font-size:1.05rem;font-weight:800;
    text-transform:uppercase;color:var(--black);margin-bottom:.45rem}
.feat-card p{font-size:.9rem;font-weight:300;line-height:1.75;color:var(--mid)}

/* ── BLOQUE 7: BRAND ── */
.brand-section{background:var(--black);display:grid;grid-template-columns:1fr 1fr;
    gap:5rem;align-items:start}
.brand-section .sec-label{color:var(--red)}
.brand-l p{font-size:.95rem;font-weight:300;line-height:1.9;
    color:rgba(255,255,255,.5);margin-top:1.2rem}
.brand-stats{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2.5rem}
.bstat{background:rgba(255,255,255,.07);border-radius:10px;padding:1.2rem}
.bstat-n{font-family:var(--font);font-size:2rem;font-weight:900;
    color:var(--white);line-height:1}
.bstat-l{font-size:.78rem;font-weight:300;color:rgba(255,255,255,.4);margin-top:.3rem}
.brand-points{display:flex;flex-direction:column;gap:1.4rem;padding-top:.5rem}
.bpt{display:flex;gap:1rem;align-items:flex-start}
.bpt-dot{width:7px;height:7px;background:var(--red);border-radius:50%;margin-top:.4rem;flex-shrink:0}
.bpt h4{font-family:var(--font);font-size:1rem;font-weight:800;
    text-transform:uppercase;color:var(--white);margin-bottom:.25rem}
.bpt p{font-size:.88rem;font-weight:300;color:rgba(255,255,255,.45);line-height:1.65}

/* ── FAQ ── */
.faq-section{}
.faq-inner{max-width:760px;margin:0 auto}
.faq-item{border-bottom:1px solid var(--bord)}
.faq-q{display:flex;justify-content:space-between;align-items:center;padding:1.2rem 0;
    cursor:pointer;gap:1rem;user-select:none}
.faq-q-txt{font-family:var(--font);font-size:1.05rem;font-weight:800;
    text-transform:uppercase;color:var(--black)}
.faq-ico{font-size:1.2rem;color:var(--red);transition:transform .3s;flex-shrink:0}
.faq-item.open .faq-ico{transform:rotate(45deg)}
.faq-a{display:none;padding:0 0 1.2rem;font-size:.92rem;font-weight:300;line-height:1.8;color:var(--mid)}
.faq-item.open .faq-a{display:block}

/* ── FOOTER ── */
footer{background:var(--black);padding:2.2rem 3.5rem;display:flex;align-items:center;
    justify-content:space-between;border-top:1px solid rgba(255,255,255,.05)}
.foot-logo svg{height:26px;display:block}
footer p{font-size:.8rem;color:rgba(255,255,255,.25)}
.foot-links{display:flex;gap:1.5rem}
.foot-links a{font-size:.8rem;color:rgba(255,255,255,.3);text-decoration:none;transition:color .2s}
.foot-links a:hover{color:var(--red)}

/* ── REVEAL ── */
.rv{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.rv.visible{opacity:1;transform:translateY(0)}
.rv1{transition-delay:.07s}
.rv2{transition-delay:.14s}
.rv3{transition-delay:.21s}

@media(max-width:960px){
  nav{padding:1rem 1.5rem}
  .nav-links{display:none}
  .hero{grid-template-columns:1fr;min-height:auto;padding:3rem 1.5rem}
  .hero-right{display:none}
  section,.compare-section,.specs-section,.feats-section,.brand-section,.faq-section{padding:4rem 1.5rem}
  .specs-cta-bar{padding:1.5rem}
  footer{padding:1.8rem 1.5rem;flex-direction:column;gap:1rem;text-align:center}
  h1{font-size:3.2rem}
  h2{font-size:2.4rem}
  .all-models-grid{grid-template-columns:1fr}
  .all-models-header{grid-template-columns:1fr}
  .seg-grid,.brand-section{grid-template-columns:1fr}
  .feats-grid{grid-template-columns:1fr}
  .tab-panel.active{grid-template-columns:1fr}
  .compare-grid{grid-template-columns:1fr}
}