/* ============================================================
   CLUB DE EMPRENDEDORES — RUMBO Digital Studio
   styles.css — v2 premium
   ============================================================ */

/* ---- TOKENS ---- */
:root {
  --bg:            #05070d;
  --bg-card:       #0d1730;
  --bg-card2:      #101d3d;
  --bg-surface:    #0b152a;
  --bg-alt:        #080e1c;
  --orange:        #ff671b;
  --orange2:       #ff8a3d;
  --orange-glow:   rgba(255,103,27,.13);
  --orange-border: rgba(255,103,27,.30);
  --orange-glow-sm:rgba(255,103,27,.07);
  --white:         #f8f9fc;
  --body:          #c1c9da;
  --muted:         #7e8ba4;
  --dim:           #4e5d78;
  --line:          rgba(36,50,80,.9);
  --line-subtle:   rgba(36,50,80,.55);
  --green:         #39d98a;
  --red:           #ff6b6b;
  --blue-glow:     rgba(71,124,255,.12);
  --r-sm:   8px;
  --r-md:   14px;
  --r-lg:   22px;
  --r-xl:   32px;
  --r-full: 9999px;
  --font: 'Plus Jakarta Sans','Inter',system-ui,-apple-system,sans-serif;
  --t:       .22s cubic-bezier(.4,0,.2,1);
  --t-slow:  .4s  cubic-bezier(.4,0,.2,1);
  --shadow-card:   0 4px 24px rgba(0,0,0,.38);
  --shadow-lg:     0 20px 60px rgba(0,0,0,.55);
  --shadow-orange: 0 8px 32px rgba(255,103,27,.28);
  --shadow-orange-lg: 0 16px 48px rgba(255,103,27,.35);
}

/* ---- RESET ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--bg);color:var(--white);line-height:1.65;overflow-x:hidden;-webkit-font-smoothing:antialiased}
section{overflow-x:clip}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}
button{cursor:pointer;font-family:var(--font);border:none;background:none}

/* ---- GLOBALS ---- */
.container{max-width:1120px;margin:0 auto;padding:0 28px}
.section{padding:96px 0}
.section--sm{padding:56px 0}
.section--alt{background:var(--bg-alt)}
@media(max-width:768px){.section{padding:64px 0}.section--sm{padding:40px 0}}
@media(max-width:480px){.section{padding:48px 0}.section--sm{padding:28px 0}.container{padding:0 18px}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---- KICKER ---- */
.kicker{display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;color:var(--orange);margin-bottom:16px;position:relative}
.kicker::before{content:'';display:inline-block;width:14px;height:2px;background:var(--orange);border-radius:2px;vertical-align:middle;margin-right:8px;flex-shrink:0}

/* ---- SECTION HEADER ---- */
.section-header{margin-bottom:52px}
.section-header h2{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:900;line-height:1.08;letter-spacing:-.03em;margin-bottom:16px}
.section-header p{color:var(--body);font-size:1.05rem;max-width:620px;line-height:1.8}
.text-center{text-align:center}
.text-center .section-header p{margin:0 auto}

/* ---- BUTTONS ---- */
.btn{display:inline-flex;align-items:center;gap:9px;padding:13px 26px;border-radius:var(--r-md);font-weight:700;font-size:1rem;font-family:var(--font);border:1px solid transparent;transition:all var(--t);white-space:nowrap;position:relative;line-height:1}
.btn:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.btn svg{width:17px;height:17px;flex-shrink:0}

/* Primary */
.btn--primary{background:linear-gradient(135deg,var(--orange) 0%,var(--orange2) 100%);color:#111;box-shadow:var(--shadow-orange)}
.btn--primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-orange-lg)}
.btn--primary:active{transform:translateY(0)}

/* Glow extra */
.btn--glow{box-shadow:var(--shadow-orange),0 0 0 0 rgba(255,103,27,0)}
.btn--glow:hover{box-shadow:var(--shadow-orange-lg),0 0 40px rgba(255,103,27,.22)}

/* Secondary (ghost dark) */
.btn--secondary{background:rgba(255,255,255,.05);color:var(--white);border-color:rgba(255,255,255,.11);backdrop-filter:blur(8px)}
.btn--secondary:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.2);transform:translateY(-2px)}

/* Ghost */
.btn--ghost{background:transparent;color:var(--body);border-color:var(--line)}
.btn--ghost:hover{background:rgba(255,255,255,.04);color:var(--white);border-color:rgba(255,255,255,.18);transform:translateY(-2px)}

/* Sizes */
.btn--xl{padding:20px 40px;font-size:1.12rem;border-radius:var(--r-lg)}
.btn--lg{padding:16px 34px;font-size:1.08rem}
.btn--sm{padding:10px 20px;font-size:.88rem}

/* ---- CARD base ---- */
.card{background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 24px;transition:border-color var(--t),transform var(--t),box-shadow var(--t);position:relative;overflow:hidden}
.card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 0% 0%,var(--orange-glow),transparent 60%);opacity:0;transition:opacity var(--t);pointer-events:none}
.card:hover{border-color:var(--orange-border);transform:translateY(-3px);box-shadow:var(--shadow-card)}
.card:hover::before{opacity:1}
.card__icon{width:46px;height:46px;border-radius:var(--r-md);display:grid;place-items:center;background:var(--orange-glow);border:1px solid var(--orange-border);margin-bottom:18px;font-size:20px;flex-shrink:0}
.card h3{font-size:1.05rem;font-weight:700;margin-bottom:8px;line-height:1.25}
.card p{color:var(--body);font-size:.9rem;line-height:1.75;margin:0}

/* ================================================================
   NAVBAR
   ================================================================ */
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;padding:20px 0;transition:background var(--t-slow),backdrop-filter var(--t-slow),border-color var(--t),padding var(--t);border-bottom:1px solid transparent}
.navbar.scrolled{background:rgba(5,7,13,.90);backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5);border-bottom-color:var(--line-subtle);padding:13px 0}
.navbar__inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.navbar__logo{font-size:.97rem;font-weight:900;letter-spacing:.5px;flex-shrink:0}
.navbar__logo span{color:var(--orange)}
.navbar__nav{display:flex;align-items:center;gap:32px}
.navbar__nav a{font-size:.85rem;font-weight:600;color:var(--body);transition:color var(--t);position:relative;padding-bottom:2px}
.navbar__nav a::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:2px;background:var(--orange);transition:width var(--t);border-radius:2px}
.navbar__nav a:hover{color:var(--white)}
.navbar__nav a:hover::after{width:100%}
.navbar__nav a:focus-visible{outline:2px solid var(--orange);outline-offset:4px;border-radius:3px}
.navbar__toggle{display:none;flex-direction:column;justify-content:center;align-items:center;width:40px;height:40px;gap:5px;border-radius:var(--r-sm);background:rgba(255,255,255,.04);border:1px solid var(--line);padding:0}
.navbar__toggle span{display:block;width:20px;height:2px;background:var(--white);border-radius:2px;transition:all var(--t)}
.navbar__toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.navbar__toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.navbar__toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.navbar__mobile{display:none;flex-direction:column;padding:12px 28px 20px;border-top:1px solid var(--line);background:rgba(5,7,13,.97);backdrop-filter:blur(24px)}
.navbar__mobile.is-open{display:flex}
.navbar__mobile a{padding:13px 0;font-size:.95rem;font-weight:600;color:var(--body);border-bottom:1px solid var(--line-subtle);transition:color var(--t)}
.navbar__mobile a:last-of-type{border-bottom:none}
.navbar__mobile a:hover{color:var(--white)}
.navbar__mobile .btn{margin-top:14px;width:100%;justify-content:center}
@media(max-width:900px){.navbar__nav{display:none}.navbar__actions .btn--sm{display:none}.navbar__toggle{display:flex}}
@media(max-width:480px){.navbar__mobile{padding:12px 18px 20px}}
@media(max-width:360px){.navbar__logo{font-size:.82rem;letter-spacing:0}}

/* ================================================================
   HERO
   ================================================================ */
.hero{padding-top:136px;padding-bottom:96px;position:relative;overflow:hidden;min-height:100svh;display:flex;align-items:center}
.hero .container{width:100%}

/* backgrounds */
.hero__bg{position:absolute;inset:0;pointer-events:none;z-index:0}
.hero__bg-gradient{position:absolute;inset:0;background:
  radial-gradient(ellipse 90% 70% at 50% -15%,rgba(23,55,119,.7) 0%,transparent 65%),
  radial-gradient(ellipse 50% 40% at 80% 25%, rgba(255,103,27,.08) 0%,transparent 55%),
  radial-gradient(ellipse 60% 50% at -10% 60%, rgba(71,124,255,.06) 0%,transparent 60%)}
.hero__bg-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(36,50,80,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(36,50,80,.18) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse 70% 65% at 50% 0%,black 0%,transparent 80%);mask-image:radial-gradient(ellipse 70% 65% at 50% 0%,black 0%,transparent 80%)}
.hero__bg-glow-l{position:absolute;bottom:-80px;left:-120px;width:400px;height:400px;background:radial-gradient(circle,rgba(71,124,255,.07),transparent 70%);pointer-events:none}
.hero__bg-glow-r{position:absolute;top:80px;right:-80px;width:320px;height:320px;background:radial-gradient(circle,rgba(255,103,27,.06),transparent 70%);pointer-events:none}

.hero__inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}

/* Badge */
.hero__badge{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:var(--r-full);border:1px solid var(--orange-border);background:rgba(255,103,27,.07);color:#ff9b63;font-size:.7rem;font-weight:800;letter-spacing:2px;text-transform:uppercase;margin-bottom:24px}
.hero__badge-dot{width:6px;height:6px;border-radius:50%;background:var(--orange);animation:pulseDot 2s ease-in-out infinite;flex-shrink:0}
@keyframes pulseDot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}

/* H1 */
.hero h1{font-weight:900;line-height:1.0;letter-spacing:-.03em;margin-bottom:22px}
.hero__h1-pre{display:block;font-size:clamp(1.1rem,2.5vw,1.6rem);font-weight:600;color:var(--body);letter-spacing:-.01em;margin-bottom:4px}
.hero__h1-main{display:block;font-size:clamp(2.6rem,6vw,4.2rem);line-height:1.0}
.hero h1 .hl{color:var(--orange);font-style:normal;position:relative}
.hero h1 .hl::after{content:'';position:absolute;bottom:-3px;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--orange),var(--orange2));border-radius:2px;opacity:.5}

/* Sub */
.hero__sub{font-size:1.07rem;color:var(--body);line-height:1.8;margin-bottom:32px;max-width:480px}

/* CTAs */
.hero__ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:24px}

/* Pillars */
.hero__pillars{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.hero__pillar{display:flex;align-items:center;gap:6px;font-size:.78rem;font-weight:600;color:var(--muted)}
.hero__pillar-dot{width:5px;height:5px;border-radius:50%;background:var(--orange);opacity:.7;flex-shrink:0}
.hero__pillar-sep{color:var(--dim);font-size:.75rem}

.hero__disclaimer{font-size:.74rem;color:var(--dim);line-height:1.6;max-width:400px;padding-left:12px;border-left:2px solid var(--line)}

/* Visual */
.hero__visual{position:relative;display:flex;align-items:center;justify-content:center}
.hero__visual-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:420px;height:420px;background:radial-gradient(circle,rgba(255,103,27,.09),transparent 70%);pointer-events:none;z-index:0}

/* Mockup */
.hero__mockup{width:100%;max-width:480px;border-radius:var(--r-xl);background:linear-gradient(160deg,#111e3e,#0d1730);border:1px solid rgba(36,50,80,.95);box-shadow:var(--shadow-lg),0 0 0 1px rgba(255,255,255,.04),inset 0 1px 0 rgba(255,255,255,.06);overflow:hidden;position:relative;z-index:1}
.hero__mockup-chrome{border-bottom:1px solid var(--line)}
.hero__mockup-bar{display:flex;align-items:center;gap:7px;padding:12px 18px;background:rgba(255,255,255,.03)}
.hmd-red{width:11px;height:11px;border-radius:50%;background:#ff5f57;flex-shrink:0}
.hmd-yellow{width:11px;height:11px;border-radius:50%;background:#febc2e;flex-shrink:0}
.hmd-green{width:11px;height:11px;border-radius:50%;background:#28c840;flex-shrink:0}
.hero__mockup-url{flex:1;margin-left:10px;padding:5px 14px;background:rgba(255,255,255,.04);border-radius:var(--r-sm);border:1px solid var(--line);font-size:.7rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero__mockup-body{padding:18px;display:flex;flex-direction:column;gap:12px}

/* Mockup header */
.hm-header{display:flex;align-items:center;gap:10px;padding:10px 14px;background:rgba(255,255,255,.04);border-radius:var(--r-md);border:1px solid var(--line)}
.hm-avatar{width:36px;height:36px;flex-shrink:0;border-radius:var(--r-sm);background:linear-gradient(135deg,var(--orange),var(--orange2));display:grid;place-items:center;font-size:.72rem;font-weight:900;color:#111}
.hm-header-text{flex:1}
.hm-title{font-size:.82rem;font-weight:700;color:var(--white)}
.hm-sub{font-size:.68rem;color:var(--muted);margin-top:1px}
.hm-badge-live{font-size:.62rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--orange);background:var(--orange-glow);border:1px solid var(--orange-border);padding:3px 9px;border-radius:var(--r-full)}

/* Mockup progress */
.hm-progress-block{padding:10px 14px;background:rgba(255,255,255,.03);border-radius:var(--r-md);border:1px solid var(--line-subtle)}
.hm-progress-label{font-size:.65rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:7px}
.hm-progress-track{height:5px;background:rgba(36,50,80,.8);border-radius:3px;overflow:hidden;position:relative}
.hm-progress-fill{height:100%;background:linear-gradient(90deg,var(--orange),var(--orange2));border-radius:3px;animation:barGrow 1.6s ease-out both;animation-delay:.5s}
@keyframes barGrow{from{width:0!important}to{}}
.hm-progress-pct{font-size:.68rem;font-weight:700;color:var(--orange);text-align:right;margin-top:4px}

/* Mockup modules */
.hm-modules{display:flex;flex-direction:column;gap:5px}
.hm-module{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:var(--r-sm);background:rgba(255,255,255,.02);border:1px solid var(--line-subtle);font-size:.78rem;transition:border-color var(--t)}
.hm-module--active{border-color:var(--orange-border);background:rgba(255,103,27,.06)}
.hm-module--done{opacity:.65}
.hm-module--locked{opacity:.45}
.hm-mod-icon{font-size:13px;flex-shrink:0;width:20px;text-align:center}
.hm-mod-info{flex:1;min-width:0}
.hm-mod-name{font-size:.73rem;font-weight:600;color:var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-mod-track{height:3px;background:var(--line);border-radius:2px;margin-top:4px;overflow:hidden}
.hm-mod-fill{height:100%;background:linear-gradient(90deg,var(--orange),var(--orange2));border-radius:2px}
.hm-mod-status{font-size:.68rem;font-weight:700;color:var(--muted);flex-shrink:0}
.hm-done{color:var(--green)}
.hm-active-pct{color:var(--orange)}
.hm-locked{color:var(--dim);font-size:.8rem}

/* Mockup footer */
.hm-footer{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding-top:4px}
.hm-stat{text-align:center;padding:8px 4px;background:rgba(255,255,255,.03);border:1px solid var(--line-subtle);border-radius:var(--r-sm)}
.hm-stat-val{font-size:1rem;font-weight:800;color:var(--white);line-height:1}
.hm-stat-lbl{font-size:.6rem;color:var(--muted);margin-top:3px;text-transform:uppercase;letter-spacing:.5px}

/* Float card */
.hero__float-card{position:absolute;bottom:-12px;left:-20px;display:flex;align-items:center;gap:10px;padding:12px 16px;background:rgba(13,23,48,.92);border:1px solid var(--orange-border);border-radius:var(--r-lg);box-shadow:0 8px 32px rgba(0,0,0,.4);backdrop-filter:blur(12px);font-size:.82rem;z-index:2;animation:floatCard 3s ease-in-out infinite}
.hero__float-icon{font-size:1.1rem;flex-shrink:0}
.hero__float-title{font-weight:700;color:var(--white);line-height:1.2}
.hero__float-sub{font-size:.7rem;color:var(--orange);margin-top:1px}
@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

/* Hero responsive */
@media(max-width:1100px){.hero__inner{gap:40px}}
@media(max-width:900px){
  .hero{min-height:auto;padding-top:120px;padding-bottom:72px;align-items:flex-start}
  .hero__inner{grid-template-columns:1fr;text-align:center;gap:48px}
  .hero__sub,.hero__disclaimer{max-width:100%}
  .hero__ctas{justify-content:center}
  .hero__disclaimer{margin:0 auto;text-align:left}
  .hero__pillars{justify-content:center}
  .hero__visual{display:none}
}
@media(max-width:480px){
  .hero{padding-top:108px;padding-bottom:80px}
  .hero__h1-main{font-size:clamp(2.2rem,10vw,2.8rem)}
  .hero__ctas{flex-direction:column}
  .hero__ctas .btn{width:100%;justify-content:center}
}

/* ================================================================
   TRUST BAR
   ================================================================ */
.trust-bar{padding:56px 0;border-top:1px solid var(--line-subtle);border-bottom:1px solid var(--line-subtle);background:rgba(8,14,28,.6)}
.trust-bar__inner{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;align-items:start}
.trust-item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.trust-item__icon{width:52px;height:52px;border-radius:var(--r-md);display:grid;place-items:center;background:var(--orange-glow);border:1px solid var(--orange-border);font-size:22px;flex-shrink:0;transition:transform var(--t)}
.trust-item:hover .trust-item__icon{transform:scale(1.08)}
.trust-item h3{font-size:.97rem;font-weight:700;line-height:1.3}
.trust-item p{font-size:.84rem;color:var(--body);line-height:1.65}
@media(max-width:768px){.trust-bar__inner{grid-template-columns:repeat(2,1fr);gap:28px}}
@media(max-width:480px){.trust-bar__inner{grid-template-columns:1fr;gap:20px}}

/* ================================================================
   ABOUT
   ================================================================ */
.about__inner{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.about__list{display:flex;flex-direction:column;gap:10px;margin-top:28px}
.about__item{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:var(--r-md);border:1px solid var(--line-subtle);background:var(--bg-surface);transition:border-color var(--t),box-shadow var(--t)}
.about__item:hover{border-color:rgba(255,103,27,.22);box-shadow:0 4px 16px rgba(0,0,0,.2)}
.about__item-icon{width:36px;height:36px;flex-shrink:0;border-radius:var(--r-sm);background:var(--orange-glow);border:1px solid var(--orange-border);display:grid;place-items:center;font-size:15px}
.about__item h4{font-size:.93rem;font-weight:700;margin-bottom:3px}
.about__item p{font-size:.83rem;color:var(--body);line-height:1.65;margin:0}
.about__visual-card{background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));border:1px solid var(--line);border-radius:var(--r-xl);padding:28px;box-shadow:var(--shadow-lg),inset 0 1px 0 rgba(255,255,255,.05)}
.about__visual-head{display:flex;align-items:center;gap:14px;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.about__visual-logo{width:44px;height:44px;border-radius:var(--r-md);background:linear-gradient(135deg,var(--orange),var(--orange2));display:grid;place-items:center;font-size:18px;font-weight:900;color:#111;flex-shrink:0;box-shadow:0 4px 16px rgba(255,103,27,.3)}
.about__visual-title{font-size:.88rem;font-weight:700}
.about__visual-sub{font-size:.74rem;color:var(--muted);margin-top:2px}
.about__modules{display:flex;flex-direction:column;gap:8px}
.about__module{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r-md);background:rgba(255,255,255,.03);border:1px solid var(--line-subtle);font-size:.85rem;transition:border-color var(--t),background var(--t)}
.about__module:hover{border-color:var(--orange-border);background:var(--orange-glow)}
.about__module-icon{width:30px;height:30px;flex-shrink:0;border-radius:var(--r-sm);background:var(--orange-glow);display:grid;place-items:center;font-size:13px}
@media(max-width:768px){.about__inner{grid-template-columns:1fr;gap:40px}}
@media(max-width:480px){.about__visual-card{padding:20px}}

/* ================================================================
   BENTO GRID — qué incluye
   ================================================================ */
.bento{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:auto auto;
  gap:14px;
  margin-top:4px;
}
/* Featured: ocupa columna entera izquierda, 2 filas */
.bento__item--featured{grid-column:1;grid-row:1/3}
/* Tall: ocupa columna derecha, 2 filas */
.bento__item--tall{grid-column:3;grid-row:1/3}
/* Wide: ocupa 2 columnas del medio en segunda fila */
.bento__item--wide{grid-column:2/3;grid-row:2}
/* Accent */
.bento__item--accent{grid-column:3}

.bento__item{
  background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));
  border:1px solid var(--line);
  border-radius:var(--r-xl);
  padding:28px 24px;
  position:relative;
  overflow:hidden;
  transition:border-color var(--t),transform var(--t),box-shadow var(--t);
  display:flex;
  flex-direction:column;
  gap:10px;
}
.bento__item:hover{border-color:var(--orange-border);transform:translateY(-3px);box-shadow:var(--shadow-card)}
.bento__item-glow{position:absolute;top:-40px;left:-40px;width:180px;height:180px;background:radial-gradient(circle,rgba(255,103,27,.12),transparent 65%);pointer-events:none;transition:opacity var(--t)}
.bento__item-glow--blue{background:radial-gradient(circle,rgba(71,124,255,.1),transparent 65%)}
.bento__item:hover .bento__item-glow{opacity:1.4}
.bento__icon{font-size:2rem;line-height:1;flex-shrink:0}
.bento__label{font-size:.68rem;font-weight:900;letter-spacing:2px;color:var(--dim);text-transform:uppercase}
.bento__item h3{font-size:1.05rem;font-weight:800;line-height:1.2}
.bento__item p{color:var(--body);font-size:.87rem;line-height:1.75;flex:1}
.bento__tag{display:inline-block;font-size:.68rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--orange);background:var(--orange-glow);border:1px solid var(--orange-border);padding:4px 12px;border-radius:var(--r-full);margin-top:auto;align-self:flex-start}
/* Featured bigger text */
.bento__item--featured h3{font-size:1.25rem}
.bento__item--featured .bento__icon{font-size:2.4rem}

@media(max-width:900px){
  .bento{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .bento__item--featured{grid-column:1/3;grid-row:auto}
  .bento__item--tall{grid-column:auto;grid-row:auto}
  .bento__item--wide{grid-column:1/3;grid-row:auto}
  .bento__item--accent{grid-column:auto}
}
@media(max-width:540px){
  .bento{grid-template-columns:1fr}
  .bento__item--featured,.bento__item--wide{grid-column:1}
}

/* ================================================================
   MOMENTO DE VALOR
   ================================================================ */
.value-moment{background:linear-gradient(160deg,var(--bg-alt),#060c1e)}
.value-moment__inner{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.value-moment__copy h2{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:900;line-height:1.1;letter-spacing:-.03em;margin-bottom:16px}
.value-moment__copy p{color:var(--body);font-size:1.05rem;line-height:1.8;max-width:480px}

/* Diagram */
.value-moment__diagram{}
.vmd__grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin-bottom:24px}
.vmd__item{background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 14px;text-align:center;transition:border-color var(--t),box-shadow var(--t)}
.vmd__item:hover{border-color:var(--orange-border);box-shadow:0 0 24px rgba(255,103,27,.1)}
.vmd__item-icon{font-size:1.8rem;margin-bottom:8px;line-height:1}
.vmd__item-name{font-size:.65rem;font-weight:900;letter-spacing:1.8px;text-transform:uppercase;color:var(--muted)}
.vmd__plus{font-size:1.6rem;font-weight:900;color:var(--orange);text-align:center;line-height:1;flex-shrink:0}
.vmd__arrow{display:flex;justify-content:center;color:var(--orange);opacity:.7;margin-bottom:16px}
.vmd__result{background:linear-gradient(135deg,rgba(255,103,27,.14),rgba(255,103,27,.04));border:1px solid var(--orange-border);border-radius:var(--r-xl);padding:20px 32px;text-align:center;box-shadow:0 0 40px rgba(255,103,27,.08)}
.vmd__result-label{font-size:1rem;font-weight:800;color:var(--white);letter-spacing:.5px}

@media(max-width:900px){
  .value-moment__inner{grid-template-columns:1fr;gap:40px}
  .value-moment__copy p{max-width:100%}
}
@media(max-width:640px){
  .vmd__grid{grid-template-columns:1fr auto 1fr;gap:6px}
  .vmd__item{padding:14px 10px}
  .vmd__item-icon{font-size:1.4rem}
}
@media(max-width:440px){
  .vmd__grid{grid-template-columns:1fr 1fr;gap:8px}
  .vmd__plus{display:none}
}

/* ================================================================
   EXPERIENCIA — tabs + panels
   ================================================================ */
.experience .section-header{margin-bottom:32px}

.exp__tabs{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap}
.exp__tab{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:var(--r-full);font-size:.85rem;font-weight:700;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line);transition:all var(--t);cursor:pointer}
.exp__tab:hover{color:var(--white);background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.15)}
.exp__tab--active,.exp__tab[aria-selected="true"]{color:var(--orange);background:var(--orange-glow);border-color:var(--orange-border)}
.exp__tab:focus-visible{outline:2px solid var(--orange);outline-offset:3px}

.exp__stage{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-lg),0 0 0 1px rgba(255,255,255,.03)}
.exp__panel-wrap{display:none}
.exp__panel-wrap--active{display:block;animation:panelIn .28s ease both}
@keyframes panelIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.exp__panel--large{background:linear-gradient(160deg,#111e3e,#0d1730);display:flex;flex-direction:column}
.exp__panel-header{display:flex;align-items:center;gap:7px;padding:13px 20px;background:rgba(255,255,255,.04);border-bottom:1px solid var(--line);flex-shrink:0}
.exp__panel-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.exp__panel-dot--red{background:#ff5f57}
.exp__panel-dot--yellow{background:#febc2e}
.exp__panel-dot--green{background:#28c840}
.exp__panel-title{font-size:.74rem;color:var(--muted);margin-left:6px;font-weight:600}
.exp__panel-body{padding:24px;flex:1;display:flex;flex-direction:column;gap:14px}

/* Dashboard */
.exp__dash-welcome{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.exp__dash-avatar{width:40px;height:40px;flex-shrink:0;border-radius:var(--r-sm);background:linear-gradient(135deg,var(--orange),var(--orange2));display:grid;place-items:center;font-size:.74rem;font-weight:900;color:#111;box-shadow:0 4px 12px rgba(255,103,27,.3)}
.exp__dash-name{font-size:.9rem;font-weight:700}
.exp__dash-plan{font-size:.74rem;color:var(--orange)}
.exp__dash-progress-label{font-size:.72rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.exp__dash-bar{height:7px;background:rgba(36,50,80,.8);border-radius:4px;overflow:hidden;position:relative}
.exp__dash-fill{height:100%;background:linear-gradient(90deg,var(--orange),var(--orange2));border-radius:4px}
.exp__dash-pct{font-size:.72rem;color:var(--orange);font-weight:700;text-align:right;margin-top:2px}
.exp__dash-modules{display:flex;flex-direction:column;gap:7px}
.exp__dash-mod{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--r-md);background:rgba(255,255,255,.03);border:1px solid var(--line-subtle);font-size:.82rem;color:var(--body);transition:border-color var(--t)}
.exp__dash-mod:hover{border-color:var(--orange-border)}
.exp__dash-mod--active{border-color:var(--orange-border);background:rgba(255,103,27,.06)}
.exp__dash-mod--done{opacity:.55}
.exp__dash-tag{margin-left:auto;font-size:.67rem;font-weight:700;padding:3px 9px;border-radius:var(--r-full);background:rgba(255,255,255,.06);color:var(--muted);white-space:nowrap}
.exp__dash-tag.done{background:rgba(57,217,138,.12);color:var(--green)}
.exp__dash-tag.active{background:var(--orange-glow);color:var(--orange)}

/* Lesson */
.exp__panel-body--lesson{justify-content:flex-start}
.exp__lesson-tag{font-size:.7rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--orange)}
.exp__lesson-title{font-size:1.1rem;font-weight:800;color:var(--white);line-height:1.3}
.exp__lesson-desc{font-size:.87rem;color:var(--body);line-height:1.7;flex:1}
.exp__lesson-actions{display:flex;flex-direction:column;gap:10px;margin-top:auto}
.exp__lesson-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;background:linear-gradient(135deg,var(--orange),var(--orange2));color:#111;font-size:.87rem;font-weight:700;border-radius:var(--r-md);width:fit-content;box-shadow:var(--shadow-orange)}
.exp__lesson-progress{display:flex;align-items:center;gap:10px;font-size:.74rem;color:var(--muted)}
.exp__lesson-bar{flex:1;height:5px;background:var(--line);border-radius:3px;overflow:hidden}
.exp__lesson-fill{height:100%;background:var(--orange);border-radius:3px}
.exp__lesson-meta{display:flex;gap:14px;margin-top:8px;padding-top:14px;border-top:1px solid var(--line-subtle)}
.exp__lesson-meta-item{font-size:.74rem;color:var(--muted);display:flex;align-items:center;gap:5px}

/* Community */
.exp__panel-body--community{gap:10px}
.exp__comm-msg{display:flex;align-items:flex-start;gap:10px}
.exp__comm-msg--right{flex-direction:row-reverse}
.exp__comm-avatar{width:32px;height:32px;flex-shrink:0;border-radius:50%;background:linear-gradient(135deg,var(--bg-card2),var(--bg-surface));border:1px solid var(--line);display:grid;place-items:center;font-size:.74rem;font-weight:800;color:var(--muted)}
.exp__comm-avatar--b{background:linear-gradient(135deg,rgba(71,124,255,.15),var(--bg-surface))}
.exp__comm-bubble{background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px;flex:1;transition:border-color var(--t)}
.exp__comm-bubble:hover{border-color:rgba(255,255,255,.14)}
.exp__comm-user{font-size:.7rem;font-weight:700;color:var(--orange);margin-bottom:4px}
.exp__comm-text{font-size:.82rem;color:var(--body);line-height:1.55}
.exp__comm-note{font-size:.66rem;color:var(--dim);text-align:center;margin-top:6px;font-style:italic;padding-top:10px;border-top:1px solid var(--line-subtle)}

@media(max-width:640px){.exp__tabs{gap:6px}.exp__tab{padding:8px 14px;font-size:.8rem}}
@media(max-width:480px){.exp__panel-body{padding:16px}.exp__tab span{display:none}}

/* ================================================================
   HOW IT WORKS
   ================================================================ */
.how__inner{display:grid;grid-template-columns:1fr 400px;gap:72px;align-items:start}
.how__steps{position:relative}
.how__line{position:absolute;left:27px;top:0;bottom:0;width:2px;background:linear-gradient(to bottom,var(--orange) 0%,rgba(255,103,27,.12) 100%);border-radius:2px}
.how__step{display:flex;gap:28px;align-items:flex-start;padding-bottom:44px;position:relative}
.how__step:last-child{padding-bottom:0}
.how__step-num{width:56px;height:56px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;font-size:.8rem;font-weight:900;letter-spacing:.5px;background:var(--bg-card);border:2px solid var(--orange);color:var(--orange);position:relative;z-index:1;transition:background var(--t),color var(--t),box-shadow var(--t)}
.how__step:hover .how__step-num{background:var(--orange);color:#111;box-shadow:0 0 20px rgba(255,103,27,.35)}
.how__step-body{padding-top:12px;flex:1}
.how__step-label{font-size:.68rem;font-weight:800;letter-spacing:2px;color:var(--orange);text-transform:uppercase;margin-bottom:4px;display:block}
.how__step-title{font-size:1.12rem;font-weight:800;margin-bottom:8px}
.how__step-desc{font-size:.92rem;color:var(--body);line-height:1.75;max-width:480px}
.how__sidebar{position:sticky;top:100px}
.how__sidebar-card{background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));border:1px solid var(--line);border-radius:var(--r-xl);padding:28px;box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,.04)}
.how__sidebar-title{font-size:.7rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:18px}
.how__sidebar-flow{display:flex;flex-direction:column}
.how__sidebar-node{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:var(--r-md);background:rgba(255,255,255,.03);border:1px solid var(--line-subtle);font-size:.87rem;font-weight:600;transition:border-color var(--t),background var(--t),transform var(--t)}
.how__sidebar-node:hover{border-color:rgba(255,103,27,.25);background:var(--orange-glow);transform:translateX(2px)}
.how__sidebar-node-icon{width:30px;height:30px;flex-shrink:0;border-radius:var(--r-sm);background:var(--orange-glow);border:1px solid var(--orange-border);display:grid;place-items:center;font-size:13px}
.how__sidebar-conn{width:2px;height:14px;background:var(--line-subtle);margin:2px 0 2px 27px;border-radius:2px}
@media(max-width:900px){.how__inner{grid-template-columns:1fr;gap:36px}.how__sidebar{position:static;order:-1}}
@media(max-width:480px){.how__step{gap:16px}.how__step-num{width:46px;height:46px;font-size:.75rem}.how__line{left:22px}}

/* ================================================================
   HABILIDADES — layout asimétrico
   ================================================================ */
.skills__asymmetric{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:auto auto;
  gap:14px;
  margin-top:8px;
}
.skill-block__grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.skill-block--wide{grid-column:1/3}

.skill-block{
  background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));
  border:1px solid var(--line);
  border-radius:var(--r-xl);
  padding:28px 24px;
  position:relative;
  overflow:hidden;
  transition:border-color var(--t),transform var(--t),box-shadow var(--t);
}
.skill-block:hover{border-color:var(--orange-border);transform:translateY(-3px);box-shadow:var(--shadow-card)}
.skill-block::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 100% 100%,var(--orange-glow-sm),transparent 60%);opacity:0;transition:opacity var(--t);pointer-events:none}
.skill-block:hover::after{opacity:1}
.skill-block__num{display:block;font-size:.65rem;font-weight:900;letter-spacing:2px;color:var(--dim);text-transform:uppercase;margin-bottom:10px}
.skill-block__tag{display:inline-block;font-size:.68rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--orange);background:var(--orange-glow);border:1px solid var(--orange-border);padding:4px 12px;border-radius:var(--r-full);margin-bottom:14px}
.skill-block h3{font-size:1.05rem;font-weight:800;margin-bottom:8px}
.skill-block p{font-size:.87rem;color:var(--body);line-height:1.75;margin:0}
.skill-block--main h3{font-size:1.3rem}
.skill-block--sm h3{font-size:1rem}
.skill-block--wide{display:grid;grid-template-columns:auto auto 1fr;align-items:start;gap:0 20px}
.skill-block--wide .skill-block__num,.skill-block--wide .skill-block__tag{grid-column:1;align-self:start}
.skill-block--wide h3{grid-column:2;grid-row:1;font-size:1.12rem}
.skill-block--wide p{grid-column:3;grid-row:1;font-size:.87rem;align-self:center}
@media(max-width:900px){
  .skills__asymmetric{grid-template-columns:1fr}
  .skill-block--wide{grid-column:1;display:flex;flex-direction:column}
  .skill-block__grid{grid-template-columns:1fr 1fr}
}
@media(max-width:540px){.skill-block__grid{grid-template-columns:1fr}}

/* ================================================================
   MODELO COMERCIAL
   ================================================================ */
.model__inner{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start}
.model__cards{display:flex;flex-direction:column;gap:10px}
.model__card{background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));border:1px solid var(--line-subtle);border-radius:var(--r-lg);padding:18px 22px;display:flex;gap:16px;align-items:flex-start;transition:border-color var(--t),box-shadow var(--t)}
.model__card:hover{border-color:rgba(255,103,27,.25);box-shadow:0 4px 20px rgba(0,0,0,.2)}
.model__card-num{width:38px;height:38px;flex-shrink:0;border-radius:var(--r-md);background:var(--orange-glow);border:1px solid var(--orange-border);display:grid;place-items:center;font-size:.8rem;font-weight:900;color:var(--orange)}
.model__card h3{font-size:.95rem;font-weight:700;margin-bottom:5px}
.model__card p{font-size:.85rem;color:var(--body);line-height:1.7;margin:0}
.model__highlight{margin-top:20px;padding:22px;border-radius:var(--r-lg);background:linear-gradient(135deg,rgba(255,103,27,.1),rgba(17,30,60,.8));border:1px solid var(--orange-border)}
.model__highlight strong{display:block;font-size:1.05rem;font-weight:800;margin-bottom:10px}
.model__highlight p{color:var(--body);font-size:.9rem;line-height:1.75;margin:0}

/* Flujo mejorado */
.model__flow{position:sticky;top:100px}
.model__flow-card{background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));border:1px solid var(--line);border-radius:var(--r-xl);padding:28px;box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,.04)}
.model__flow-title{font-size:.7rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:20px}
.model__flow-steps{display:flex;flex-direction:column}
.model__flow-node{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:var(--r-md);transition:background var(--t),border-color var(--t);font-size:.87rem;font-weight:600;border:1px solid transparent}
.model__flow-node:hover{background:rgba(255,255,255,.03);border-color:var(--line-subtle)}
.model__flow-node-num{width:22px;height:22px;flex-shrink:0;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid var(--line);display:grid;place-items:center;font-size:.65rem;font-weight:900;color:var(--muted)}
.model__flow-node-icon{width:32px;height:32px;flex-shrink:0;border-radius:var(--r-sm);background:var(--orange-glow);border:1px solid var(--orange-border);display:grid;place-items:center;font-size:13px}
.model__flow-node--highlight{background:rgba(57,217,138,.04);border-color:rgba(57,217,138,.15)!important}
.model__flow-node--highlight .model__flow-node-num{background:rgba(57,217,138,.12);border-color:rgba(57,217,138,.25);color:var(--green)}
.model__flow-node--commission{background:var(--orange-glow);border-color:var(--orange-border)!important}
.model__flow-node--commission .model__flow-node-num{background:rgba(255,103,27,.2);border-color:var(--orange-border);color:var(--orange)}
.model__flow-conn{height:14px;width:2px;background:var(--line-subtle);margin:2px 0 2px 21px;border-radius:2px}
.model__flow-conn--orange{background:rgba(255,103,27,.3)}
.model__commission{margin-top:18px;padding:20px;border-radius:var(--r-lg);background:linear-gradient(135deg,rgba(255,103,27,.14),rgba(255,103,27,.04));border:1px solid var(--orange-border)}
.model__commission-val{font-size:2.6rem;font-weight:900;color:var(--orange);line-height:1;text-shadow:0 0 32px rgba(255,103,27,.4)}
.model__commission-label{font-size:.87rem;font-weight:700;margin-top:5px;margin-bottom:8px}
.model__commission-note{font-size:.75rem;color:var(--muted);line-height:1.6}
.model__disc{margin-top:14px;padding:12px 16px;border-radius:var(--r-md);background:rgba(255,255,255,.02);border:1px solid var(--line-subtle);font-size:.74rem;color:var(--muted);line-height:1.65;text-align:center}
@media(max-width:900px){.model__inner{grid-template-columns:1fr;gap:32px}.model__flow{position:static}}
@media(max-width:480px){.model__flow-card{padding:20px}.model__commission{padding:16px}.model__commission-val{font-size:2.1rem}}

/* ================================================================
   PARA QUIEN
   ================================================================ */
.forwhom__inner{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:40px}
.forwhom__col-title{font-size:1.05rem;font-weight:800;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.forwhom__list{display:flex;flex-direction:column;gap:8px}
.forwhom__item{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:var(--r-md);border:1px solid var(--line-subtle);background:var(--bg-surface);font-size:.88rem;line-height:1.65;transition:border-color var(--t),box-shadow var(--t)}
.forwhom__item:hover{border-color:rgba(255,103,27,.18);box-shadow:0 3px 14px rgba(0,0,0,.15)}
.forwhom__check{width:20px;height:20px;flex-shrink:0;margin-top:1px;border-radius:50%;display:grid;place-items:center;font-size:10px;font-weight:900}
.forwhom__check.y{background:rgba(57,217,138,.13);color:var(--green)}
.forwhom__check.n{background:rgba(255,80,80,.1);color:var(--red)}
@media(max-width:640px){.forwhom__inner{grid-template-columns:1fr;gap:24px;margin-top:28px}}
@media(max-width:480px){.forwhom__item{padding:12px 14px}}

/* ================================================================
   TRANSPARENCY
   ================================================================ */
.transparency__grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:40px}
.tr-col{border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--line)}
.tr-col__head{padding:18px 24px;display:flex;align-items:center;gap:12px;font-size:1.05rem;font-weight:800;border-bottom:1px solid var(--line)}
.tr-col--yes .tr-col__head{background:rgba(57,217,138,.07);color:var(--green);border-bottom-color:rgba(57,217,138,.14)}
.tr-col--no .tr-col__head{background:rgba(255,80,80,.07);color:var(--red);border-bottom-color:rgba(255,80,80,.12)}
.tr-col__body{padding:16px 24px;background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));display:flex;flex-direction:column}
.tr-item{display:flex;align-items:flex-start;gap:12px;padding:13px 0;border-bottom:1px solid var(--line-subtle);font-size:.88rem;line-height:1.65;color:var(--body)}
.tr-item:last-child{border-bottom:none;padding-bottom:0}
.tr-item-icon{width:20px;height:20px;flex-shrink:0;margin-top:1px;font-size:12px;display:grid;place-items:center}
@media(max-width:640px){.transparency__grid{grid-template-columns:1fr}}
@media(max-width:480px){.tr-col__head{padding:14px 16px}.tr-col__body{padding:12px 16px}.tr-item{padding:11px 0}}

/* ================================================================
   PREREQ — antes de empezar
   ================================================================ */
.prereq__grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  grid-template-rows:auto auto;
  gap:14px;
  margin-top:40px;
}
.prereq__item--large{grid-row:1/3;grid-column:1}
.prereq__item--accent{grid-column:3}
.prereq__item{
  background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));
  border:1px solid var(--line-subtle);
  border-radius:var(--r-xl);
  padding:24px;
  display:flex;
  flex-direction:column;
  gap:10px;
  transition:border-color var(--t),transform var(--t),box-shadow var(--t);
  position:relative;
  overflow:hidden;
}
.prereq__item:hover{border-color:var(--orange-border);transform:translateY(-3px);box-shadow:var(--shadow-card)}
.prereq__item--accent{background:linear-gradient(135deg,rgba(255,103,27,.07),var(--bg-card));border-color:var(--orange-border)}
.prereq__icon{font-size:1.8rem;line-height:1}
.prereq__item h3{font-size:1rem;font-weight:800}
.prereq__item p{font-size:.87rem;color:var(--body);line-height:1.75;margin:0}
.prereq__item--large h3{font-size:1.15rem}
.prereq__item--large p{font-size:.9rem}
@media(max-width:900px){
  .prereq__grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .prereq__item--large{grid-row:auto;grid-column:1/3}
  .prereq__item--accent{grid-column:auto}
}
@media(max-width:540px){
  .prereq__grid{grid-template-columns:1fr}
  .prereq__item--large{grid-column:1}
}

/* ================================================================
   CONDITIONS — sección de precios
   ================================================================ */
.conditions{border-radius:var(--r-xl);border:1px solid var(--line);overflow:hidden;background:linear-gradient(160deg,var(--bg-card2),var(--bg-card))}
.conditions__header{display:flex;align-items:center;gap:10px;padding:18px 24px;background:rgba(255,255,255,.03);border-bottom:1px solid var(--line);font-size:.8rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.conditions__header svg{flex-shrink:0;stroke:var(--dim)}
.conditions__status{margin-left:auto;font-size:.68rem;font-weight:700;letter-spacing:.5px;color:var(--orange);background:var(--orange-glow);border:1px solid var(--orange-border);padding:4px 12px;border-radius:var(--r-full)}
.conditions__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
.conditions__item{background:var(--bg-card);padding:20px 22px}
.conditions__item-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:10px}
.conditions__item-val{display:flex;align-items:center;gap:8px;font-size:.9rem;font-weight:700;color:var(--body)}
.conditions__pending-dot{width:7px;height:7px;border-radius:50%;background:var(--orange);opacity:.7;flex-shrink:0;animation:pulseDot 2.5s ease-in-out infinite}
.conditions__note{padding:16px 24px;font-size:.78rem;color:var(--dim);line-height:1.7;border-top:1px solid var(--line-subtle)}
@media(max-width:768px){.conditions__grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){
  .conditions__grid{grid-template-columns:1fr}
  .conditions__header{flex-wrap:wrap;gap:8px}
  .conditions__status{margin-left:0}
  .conditions__item{padding:16px 18px}
}

/* ================================================================
   TESTIMONIOS placeholder
   ================================================================ */
.testi__ph{margin-top:40px;padding:52px 28px;border-radius:var(--r-xl);border:1px solid var(--line);background:linear-gradient(160deg,var(--bg-card2),var(--bg-card));display:flex;flex-direction:column;align-items:center;gap:16px}
.testi__slots{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;width:100%;max-width:860px}
.testi__slot{border-radius:var(--r-lg);border:1px solid var(--line-subtle);padding:24px;display:flex;flex-direction:column;gap:12px;background:rgba(255,255,255,.02)}
.testi__slot-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--bg-card2),var(--bg-surface));border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:.87rem;font-weight:800;color:var(--orange)}
.testi__slot-lines{display:flex;flex-direction:column;gap:7px}
.testi__slot-line{height:9px;border-radius:5px;background:var(--line);animation:shimmer 2s ease-in-out infinite alternate}
.testi__slot-line--short{width:55%}
@keyframes shimmer{from{opacity:.4}to{opacity:.7}}
@media(max-width:640px){.testi__slots{grid-template-columns:1fr}}
@media(max-width:480px){.testi__ph{padding:36px 18px}}

/* ================================================================
   FAQ
   ================================================================ */
.faq__list{margin-top:40px;border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden}
.faq__item{border-bottom:1px solid var(--line-subtle)}
.faq__item:last-child{border-bottom:none}
.faq__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 28px;background:none;color:var(--white);font-family:var(--font);font-size:.97rem;font-weight:700;text-align:left;cursor:pointer;transition:background var(--t);border:none}
.faq__q:hover{background:rgba(255,255,255,.02)}
.faq__q:focus-visible{outline:2px solid var(--orange);outline-offset:-2px}
.faq__icon{width:28px;height:28px;flex-shrink:0;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg-surface);display:grid;place-items:center;transition:transform var(--t),background var(--t),border-color var(--t)}
.faq__icon svg{width:13px;height:13px;stroke:var(--muted);transition:stroke var(--t)}
.faq__item.open .faq__icon{transform:rotate(180deg);background:var(--orange-glow);border-color:var(--orange-border)}
.faq__item.open .faq__icon svg{stroke:var(--orange)}
.faq__a{display:none;padding:0 28px 24px;color:var(--body);font-size:.93rem;line-height:1.85}
.faq__item.open .faq__a{display:block;animation:fadeDown .24s ease forwards}
@keyframes fadeDown{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:480px){.faq__q{padding:18px 18px;font-size:.92rem}.faq__a{padding:0 18px 20px}}

/* ================================================================
   CTA FINAL
   ================================================================ */
.cta-final{
  margin:80px 0 52px;
  padding:88px 32px 72px;
  text-align:center;
  border-radius:var(--r-xl);
  background:linear-gradient(145deg,#112756 0%,#0a1020 60%);
  border:1px solid rgba(41,67,111,.75);
  position:relative;
  overflow:hidden;
}
.cta-final__bg-glow{position:absolute;top:-120px;left:50%;transform:translateX(-50%);width:700px;height:360px;background:radial-gradient(ellipse,rgba(255,103,27,.1),transparent 65%);pointer-events:none}
.cta-final h2{font-size:clamp(1.8rem,4.5vw,3rem);font-weight:900;letter-spacing:-.03em;margin-bottom:16px;max-width:700px;margin-left:auto;margin-right:auto;position:relative;z-index:1;line-height:1.08}
.cta-final__sub{font-size:1.05rem;color:var(--body);max-width:540px;margin:0 auto 36px;line-height:1.8;position:relative;z-index:1}
.cta-final__summary{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:40px;flex-wrap:wrap;position:relative;z-index:1}
.cta-final__summary-item{display:flex;align-items:center;gap:8px;padding:10px 18px;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:var(--r-full);font-size:.84rem;font-weight:600;color:var(--body)}
.cta-final__summary-icon{font-size:1rem}
.cta-final__summary-sep{font-size:1.2rem;font-weight:900;color:var(--orange);opacity:.8}
.cta-final__ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.cta-final__note{font-size:.75rem;color:var(--dim);position:relative;z-index:1}
@media(max-width:640px){.cta-final__summary{gap:8px}.cta-final__summary-item{padding:8px 14px;font-size:.78rem}}
@media(max-width:480px){
  .cta-final{padding:60px 20px 48px;margin:56px 0 36px}
  .cta-final__ctas{flex-direction:column;align-items:center}
  .cta-final__ctas .btn{width:100%;justify-content:center;max-width:340px}
  .cta-final__summary{flex-direction:column;gap:6px}
  .cta-final__summary-sep{transform:rotate(90deg)}
}

/* ================================================================
   REF SECTION
   ================================================================ */
.ref-section{padding:36px 0;border-top:1px solid var(--line-subtle);text-align:center}
.btn--ref{display:inline-flex;align-items:center;gap:9px;padding:14px 32px;border-radius:var(--r-md);font-weight:700;font-size:.88rem;letter-spacing:1.2px;text-transform:uppercase;font-family:var(--font);color:var(--orange);background:transparent;border:1px solid var(--orange-border);transition:all var(--t);text-decoration:none}
.btn--ref:hover{background:var(--orange-glow);border-color:var(--orange);color:var(--white);transform:translateY(-2px);box-shadow:0 8px 24px rgba(255,103,27,.15)}
.btn--ref:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
@media(max-width:480px){.btn--ref{width:100%;justify-content:center;font-size:.82rem}}

/* ================================================================
   FOOTER
   ================================================================ */
.footer{border-top:1px solid var(--line-subtle);padding:48px 0 24px}
.footer__inner{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:start}
.footer__brand{font-size:.97rem;font-weight:900}
.footer__brand span{color:var(--orange)}
.footer__tagline{font-size:.82rem;color:var(--muted);margin-top:4px}
.footer__disc{font-size:.74rem;color:var(--dim);line-height:1.65;max-width:540px;margin-top:14px}
.footer__credit{font-size:.74rem;color:var(--dim);text-align:right;line-height:1.7}
.footer__credit a{color:var(--orange);font-weight:700;transition:color var(--t)}
.footer__credit a:hover{color:var(--orange2)}
.footer__bottom{margin-top:24px;padding-top:16px;border-top:1px solid var(--line-subtle);text-align:center;font-size:.73rem;color:var(--dim)}
@media(max-width:640px){.footer__inner{grid-template-columns:1fr}.footer__credit{text-align:left}}
@media(max-width:480px){.footer{padding:32px 0 20px}.footer__bottom{font-size:.7rem}}

/* ================================================================
   STICKY CTA MOBILE
   ================================================================ */
.sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:900;padding:12px 16px;padding-bottom:max(12px,env(safe-area-inset-bottom));background:rgba(5,7,13,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--line);opacity:1;transition:opacity var(--t)}
.sticky-cta .btn{width:100%;justify-content:center;font-size:.97rem;padding:15px}
@media(max-width:768px){.sticky-cta{display:block}}

/* ================================================================
   SCROLL REVEAL
   ================================================================ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s cubic-bezier(.4,0,.2,1),transform .6s cubic-bezier(.4,0,.2,1)}
.reveal.visible{opacity:1;transform:translateY(0)}
.d1{transition-delay:.08s}
.d2{transition-delay:.16s}
.d3{transition-delay:.24s}
.d4{transition-delay:.32s}
.d5{transition-delay:.40s}

/* ================================================================
   REDUCED MOTION
   ================================================================ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none;transition:none}
  .hero__badge-dot,.hm-progress-fill,.conditions__pending-dot,.testi__slot-line{animation:none}
  .hero__float-card{animation:none}
}

/* ================================================================
   FOCUS / SCROLLBAR
   ================================================================ */
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:4px}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--dim)}

/* ================================================================
   BREAKPOINTS — ajustes finales
   ================================================================ */

/* 1440px — contenedor ligeramente más ancho */
@media(min-width:1400px){
  .container{max-width:1200px}
  .hero__h1-main{font-size:4.6rem}
  .hero__mockup{max-width:520px}
}

/* 1200px — sin cambios necesarios, el grid se adapta bien */

/* 360px — mínimo */
@media(max-width:360px){
  .navbar__logo{font-size:.8rem}
  .hero__h1-main{font-size:2rem}
  .btn--xl{padding:18px 28px;font-size:1rem}
  .cta-final{padding:48px 16px 40px}
}

/* ================================================================
   PATCH — clases de layout sin reglas explícitas necesarias
   hero__content y about__content son contenedores de grid
   (heredan layout del padre, no necesitan reglas propias)
   hero__mockup-dot: base shape para los dots del chrome
   ================================================================ */
.hero__mockup-dot{
  width:11px;
  height:11px;
  border-radius:50%;
  flex-shrink:0;
  display:inline-block;
}
.hero__content,.about__content{
  /* layout container — heredan del grid padre */
  min-width:0;
}


/* ================================================================
   MOBILE DESIGN — versión específica para teléfono
   Todos los estilos aquí están dentro de media queries.
   NO modifican el layout desktop en ningún caso.
   Breakpoints cubiertos: 768px · 480px · 414px · 390px · 375px · 360px
   ================================================================ */

/* ----------------------------------------------------------------
   0. TOKENS MOBILE — ajustes de base
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  /* Contenedor con padding lateral cómodo */
  .container {
    padding: 0 20px;
  }

  /* Secciones con ritmo vertical reducido pero presente */
  .section {
    padding: 56px 0;
  }
  .section--sm {
    padding: 36px 0;
  }

  /* Kicker más compacto */
  .kicker {
    font-size: .65rem;
    letter-spacing: 2px;
    margin-bottom: 12px;
  }

  /* Section header */
  .section-header {
    margin-bottom: 36px;
  }
  .section-header h2 {
    font-size: clamp(1.55rem, 6.5vw, 2rem);
    line-height: 1.1;
    margin-bottom: 12px;
  }
  .section-header p {
    font-size: .93rem;
    line-height: 1.75;
  }

  /* Botones móvil — táctiles y cómodos */
  .btn {
    font-size: .95rem;
    padding: 14px 24px;
    gap: 8px;
  }
  .btn--lg {
    padding: 15px 28px;
    font-size: 1rem;
  }
  .btn--xl {
    padding: 16px 32px;
    font-size: 1.05rem;
  }
  .btn--sm {
    padding: 11px 18px;
    font-size: .85rem;
  }
  .btn svg {
    width: 16px;
    height: 16px;
  }
}

/* ----------------------------------------------------------------
   1. HERO MOBILE — composición propia, no desktop apilado
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .hero {
    padding-top: 96px;
    padding-bottom: 56px;
    min-height: auto;
    align-items: flex-start;
  }

  .hero__inner {
    grid-template-columns: 1fr;
    gap: 0;
    text-align: left;
  }

  /* Badge compacto */
  .hero__badge {
    font-size: .62rem;
    letter-spacing: 1.5px;
    padding: 6px 12px;
    margin-bottom: 20px;
  }

  /* H1 con jerarquía fuerte */
  .hero h1 {
    margin-bottom: 18px;
  }
  .hero__h1-pre {
    font-size: 1rem;
    margin-bottom: 2px;
  }
  .hero__h1-main {
    font-size: clamp(2.4rem, 10vw, 3.2rem);
    line-height: 1.0;
  }

  /* Subtítulo más corto visualmente */
  .hero__sub {
    font-size: .95rem;
    line-height: 1.75;
    margin-bottom: 28px;
    max-width: 100%;
  }

  /* CTAs: columna, ancho completo */
  .hero__ctas {
    flex-direction: column;
    gap: 10px;
    margin-bottom: 28px;
    align-items: stretch;
  }
  .hero__ctas .btn {
    width: 100%;
    justify-content: center;
    min-height: 52px;
  }

  /* Pilares: horizontales en fila compacta */
  .hero__pillars {
    justify-content: flex-start;
    gap: 6px 10px;
    flex-wrap: wrap;
    margin-bottom: 20px;
  }
  .hero__pillar {
    font-size: .72rem;
  }
  .hero__pillar-sep {
    font-size: .68rem;
  }

  /* Disclaimer */
  .hero__disclaimer {
    font-size: .71rem;
    line-height: 1.6;
    max-width: 100%;
    padding-left: 10px;
  }

  /* Mockup: visible en mobile pero compacto y debajo del copy */
  .hero__visual {
    display: flex !important;
    margin-top: 36px;
    justify-content: center;
    align-items: flex-start;
  }

  .hero__visual-glow {
    width: 280px;
    height: 280px;
  }

  .hero__mockup {
    width: 100%;
    max-width: 340px;
    border-radius: 18px;
  }

  /* Mockup body más compacto */
  .hero__mockup-body {
    padding: 12px;
    gap: 9px;
  }
  .hero__mockup-bar {
    padding: 9px 14px;
  }
  .hero__mockup-url {
    font-size: .62rem;
  }

  /* Módulos del mockup: compactos */
  .hm-module {
    padding: 6px 8px;
    font-size: .72rem;
  }
  .hm-mod-name {
    font-size: .68rem;
  }
  .hm-mod-track {
    display: none; /* limpieza visual */
  }

  /* Float card reposicionada */
  .hero__float-card {
    bottom: -8px;
    left: -12px;
    padding: 9px 12px;
    font-size: .76rem;
    border-radius: 14px;
  }
  .hero__float-icon {
    font-size: .95rem;
  }
  .hero__float-title {
    font-size: .76rem;
  }
  .hero__float-sub {
    font-size: .64rem;
  }
}

/* ----------------------------------------------------------------
   2. TRUST BAR MOBILE — 2 columnas → formato editorial compacto
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .trust-bar {
    padding: 36px 0;
  }

  .trust-bar__inner {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

  .trust-item {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
    padding: 18px 12px;
    background: linear-gradient(160deg, var(--bg-card2), var(--bg-card));
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
  }

  .trust-item__icon {
    width: 44px;
    height: 44px;
    font-size: 19px;
  }

  .trust-item h3 {
    font-size: .9rem;
  }

  .trust-item p {
    font-size: .78rem;
    line-height: 1.6;
  }
}

@media (max-width: 480px) {
  .trust-bar__inner {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .trust-item p {
    display: none; /* en 360-480 mostramos solo ícono+título para no saturar */
  }
  .trust-item {
    padding: 16px 10px;
    gap: 8px;
  }
}

/* ----------------------------------------------------------------
   3. ABOUT / QUÉ ES MOBILE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .about__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  /* Visual card arriba como elemento de impacto */
  .about__visual {
    order: -1;
  }

  .about__visual-card {
    padding: 20px 18px;
    border-radius: var(--r-lg);
  }

  .about__visual-head {
    margin-bottom: 16px;
    padding-bottom: 14px;
  }

  .about__visual-logo {
    width: 38px;
    height: 38px;
    font-size: 15px;
  }

  .about__visual-title {
    font-size: .82rem;
  }

  .about__visual-sub {
    font-size: .68rem;
  }

  .about__modules {
    gap: 6px;
  }

  .about__module {
    padding: 9px 12px;
    font-size: .82rem;
  }

  .about__module-icon {
    width: 26px;
    height: 26px;
    font-size: 11px;
  }

  /* Lista de características */
  .about__list {
    gap: 8px;
    margin-top: 20px;
  }

  .about__item {
    padding: 14px 12px;
    gap: 12px;
  }

  .about__item-icon {
    width: 32px;
    height: 32px;
    font-size: 13px;
  }

  .about__item h4 {
    font-size: .88rem;
  }

  .about__item p {
    font-size: .8rem;
    line-height: 1.65;
  }
}

/* ----------------------------------------------------------------
   4. BENTO GRID MOBILE — composición editorial, no lista
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .bento {
    /* Layout editorial: 2 columnas con jerarquía */
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
    gap: 10px;
  }

  /* Featured ocupa toda la fila superior → impacto máximo */
  .bento__item--featured {
    grid-column: 1 / 3;
    grid-row: 1;
    flex-direction: row;
    align-items: flex-start;
    gap: 16px;
    padding: 22px 20px;
  }

  .bento__item--featured .bento__icon {
    font-size: 2rem;
    margin-top: 4px;
    flex-shrink: 0;
  }

  .bento__item--featured h3 {
    font-size: 1.1rem;
  }

  .bento__item--featured p {
    font-size: .85rem;
  }

  /* Herramientas + Acompañamiento: comparten fila, misma altura */
  .bento__item:not(.bento__item--featured):not(.bento__item--tall):not(.bento__item--wide):not(.bento__item--accent) {
    grid-column: auto;
    grid-row: auto;
  }

  /* Tall (Comunidad): columna izquierda fila 3 */
  .bento__item--tall {
    grid-column: 1;
    grid-row: 3;
    min-height: 160px;
  }

  /* Wide (Marketing): ocupa fila completa bajo las dos pequeñas */
  .bento__item--wide {
    grid-column: 1 / 3;
    grid-row: 4;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
  }

  .bento__item--wide .bento__icon {
    font-size: 1.8rem;
    flex-shrink: 0;
  }

  /* Accent (Visión): columna derecha fila 3 */
  .bento__item--accent {
    grid-column: 2;
    grid-row: 3;
    min-height: 160px;
  }

  /* Íconos y tipografía compactos */
  .bento__icon {
    font-size: 1.6rem;
  }

  .bento__label {
    font-size: .6rem;
    letter-spacing: 1.5px;
  }

  .bento__item h3 {
    font-size: .95rem;
  }

  .bento__item p {
    font-size: .82rem;
    line-height: 1.7;
  }

  .bento__tag {
    font-size: .62rem;
    padding: 3px 10px;
  }

  .bento__item {
    padding: 18px 16px;
    border-radius: var(--r-lg);
    gap: 8px;
  }
}

@media (max-width: 480px) {

  .bento {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  /* Featured sigue full-width */
  .bento__item--featured {
    flex-direction: column;
    padding: 18px 16px;
    gap: 10px;
  }

  .bento__item--featured .bento__icon {
    font-size: 1.8rem;
  }

  .bento__item--featured h3 {
    font-size: 1rem;
  }

  /* Wide sigue full-width pero vertical */
  .bento__item--wide {
    flex-direction: column;
    align-items: flex-start;
    padding: 16px;
    gap: 8px;
  }

  .bento__item {
    padding: 14px 14px;
  }

  .bento__item h3 {
    font-size: .9rem;
  }

  .bento__item p {
    font-size: .8rem;
  }
}

/* ----------------------------------------------------------------
   5. VALOR MOMENT MOBILE — momento visual importante
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .value-moment__inner {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .value-moment__copy h2 {
    font-size: clamp(1.55rem, 6.5vw, 2rem);
    line-height: 1.1;
    margin-bottom: 12px;
  }

  .value-moment__copy p {
    font-size: .93rem;
    max-width: 100%;
    line-height: 1.75;
  }

  .value-moment__copy .btn {
    margin-top: 20px !important;
    width: 100%;
    justify-content: center;
  }

  /* Diagrama: 4 tarjetas en 2x2 sin los "+" */
  .vmd__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 18px;
  }

  .vmd__plus {
    display: none;
  }

  .vmd__item {
    padding: 16px 12px;
    border-radius: var(--r-lg);
  }

  .vmd__item-icon {
    font-size: 1.5rem;
    margin-bottom: 6px;
  }

  .vmd__item-name {
    font-size: .58rem;
    letter-spacing: 1.2px;
  }

  .vmd__arrow {
    margin-bottom: 12px;
  }

  .vmd__result {
    padding: 16px 20px;
    border-radius: var(--r-lg);
  }

  .vmd__result-label {
    font-size: .92rem;
  }
}

/* ----------------------------------------------------------------
   6. EXPERIENCIA / TABS MOBILE — navegación perfecta
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .experience .section-header {
    margin-bottom: 24px;
  }

  /* Tabs: row completa, equi-espacio, mínimo 44px altura táctil */
  .exp__tabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    margin-bottom: 16px;
    flex-wrap: unset;
  }

  .exp__tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 10px 8px;
    border-radius: var(--r-md);
    font-size: .74rem;
    font-weight: 700;
    min-height: 56px;
    text-align: center;
    line-height: 1.2;
  }

  /* El ícono visible en todos los tabs */
  .exp__tab span[aria-hidden="true"] {
    display: block !important;
    font-size: 1.1rem;
  }

  /* Tab activo más pronunciado */
  .exp__tab--active,
  .exp__tab[aria-selected="true"] {
    background: var(--orange-glow);
    border-color: var(--orange-border);
    color: var(--orange);
    box-shadow: 0 0 12px rgba(255, 103, 27, .12);
  }

  /* Stage */
  .exp__stage {
    border-radius: var(--r-lg);
  }

  /* Panel body */
  .exp__panel-body {
    padding: 16px;
    gap: 12px;
  }

  /* Dashboard */
  .exp__dash-welcome {
    gap: 10px;
    margin-bottom: 4px;
  }

  .exp__dash-avatar {
    width: 36px;
    height: 36px;
  }

  .exp__dash-name {
    font-size: .85rem;
  }

  .exp__dash-plan {
    font-size: .7rem;
  }

  .exp__dash-mod {
    padding: 9px 10px;
    font-size: .78rem;
    gap: 8px;
  }

  .exp__dash-tag {
    font-size: .62rem;
    padding: 2px 7px;
  }

  /* Panel lección */
  .exp__lesson-title {
    font-size: 1rem;
  }

  .exp__lesson-desc {
    font-size: .83rem;
    line-height: 1.65;
  }

  .exp__lesson-btn {
    font-size: .82rem;
    padding: 9px 16px;
  }

  .exp__lesson-meta {
    margin-top: 6px;
    padding-top: 10px;
    gap: 10px;
  }

  .exp__lesson-meta-item {
    font-size: .7rem;
  }

  /* Panel comunidad */
  .exp__comm-msg {
    gap: 8px;
  }

  .exp__comm-avatar {
    width: 28px;
    height: 28px;
    font-size: .68rem;
  }

  .exp__comm-bubble {
    padding: 8px 12px;
  }

  .exp__comm-user {
    font-size: .65rem;
  }

  .exp__comm-text {
    font-size: .78rem;
    line-height: 1.5;
  }
}

/* ----------------------------------------------------------------
   7. CÓMO FUNCIONA MOBILE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .how__inner {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  /* Sidebar al frente como intro visual */
  .how__sidebar {
    position: static;
    order: -1;
  }

  .how__sidebar-card {
    padding: 20px;
    border-radius: var(--r-lg);
  }

  .how__sidebar-title {
    font-size: .65rem;
    margin-bottom: 14px;
  }

  .how__sidebar-node {
    padding: 9px 12px;
    font-size: .82rem;
    gap: 10px;
  }

  .how__sidebar-node-icon {
    width: 26px;
    height: 26px;
    font-size: 11px;
  }

  .how__sidebar-conn {
    height: 12px;
    margin: 1px 0 1px 23px;
  }

  /* Steps */
  .how__steps {
    padding-left: 0;
  }

  .how__line {
    left: 22px;
    width: 2px;
  }

  .how__step {
    gap: 18px;
    padding-bottom: 32px;
  }

  .how__step-num {
    width: 46px;
    height: 46px;
    font-size: .72rem;
    border-width: 2px;
  }

  .how__step-body {
    padding-top: 8px;
  }

  .how__step-label {
    font-size: .62rem;
    letter-spacing: 1.5px;
  }

  .how__step-title {
    font-size: 1rem;
    margin-bottom: 6px;
  }

  .how__step-desc {
    font-size: .86rem;
    line-height: 1.7;
    max-width: 100%;
  }
}

/* ----------------------------------------------------------------
   8. HABILIDADES MOBILE — jerarquía conservada
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .skills__asymmetric {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  /* Bloque principal grande */
  .skill-block--main {
    grid-column: 1;
    padding: 22px 18px;
  }

  .skill-block--main h3 {
    font-size: 1.2rem;
  }

  /* Grid 4 habilidades: 2 columnas */
  .skill-block__grid {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .skill-block--sm {
    padding: 16px 14px;
  }

  .skill-block--sm h3 {
    font-size: .92rem;
  }

  /* Wide horizontal */
  .skill-block--wide {
    grid-column: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    padding: 18px 18px;
    flex-wrap: wrap;
  }

  .skill-block--wide .skill-block__num,
  .skill-block--wide .skill-block__tag {
    /* Mantenemos posición natural */
  }

  .skill-block--wide h3 {
    font-size: 1rem;
    grid-column: auto;
  }

  .skill-block--wide p {
    font-size: .83rem;
    flex: unset;
    width: 100%;
  }

  /* Estilos comunes */
  .skill-block {
    border-radius: var(--r-lg);
    padding: 18px 16px;
  }

  .skill-block__num {
    font-size: .6rem;
    letter-spacing: 1.5px;
    margin-bottom: 6px;
  }

  .skill-block__tag {
    font-size: .62rem;
    padding: 3px 10px;
    margin-bottom: 10px;
  }

  .skill-block h3 {
    font-size: 1rem;
    margin-bottom: 6px;
  }

  .skill-block p {
    font-size: .83rem;
    line-height: 1.7;
  }
}

@media (max-width: 480px) {

  /* En 360-480px: main ocupa todo, grid 2 cols, wide simple */
  .skill-block--main h3 {
    font-size: 1.1rem;
  }

  .skill-block__grid {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }

  .skill-block--sm {
    padding: 14px 12px;
  }

  .skill-block--sm h3 {
    font-size: .87rem;
  }

  .skill-block--sm p {
    font-size: .78rem;
  }
}

/* ----------------------------------------------------------------
   9. MODELO COMERCIAL MOBILE — secuencia vertical visual
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .model__inner {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  /* Flujo primero: es el elemento visual protagonista */
  .model__flow {
    position: static;
    order: -1;
  }

  /* Flow card: secuencia visual con números y conectores */
  .model__flow-card {
    padding: 22px 18px;
    border-radius: var(--r-lg);
  }

  .model__flow-title {
    font-size: .65rem;
    letter-spacing: 1.5px;
    margin-bottom: 16px;
  }

  /* Nodos del flujo más grandes y táctiles */
  .model__flow-node {
    padding: 12px 14px;
    gap: 12px;
    font-size: .87rem;
    border-radius: var(--r-md);
    border: 1px solid var(--line-subtle);
  }

  .model__flow-node-num {
    width: 26px;
    height: 26px;
    font-size: .68rem;
    font-weight: 900;
    flex-shrink: 0;
  }

  .model__flow-node-icon {
    width: 30px;
    height: 30px;
    font-size: 13px;
  }

  .model__flow-conn {
    height: 16px;
    width: 2px;
    margin: 2px 0 2px 25px;
  }

  .model__flow-conn--orange {
    height: 16px;
  }

  /* Comisión: protagonista visual */
  .model__commission {
    margin-top: 16px;
    padding: 18px;
    border-radius: var(--r-lg);
  }

  .model__commission-val {
    font-size: 3rem;
    line-height: 1;
  }

  .model__commission-label {
    font-size: .85rem;
    margin-top: 4px;
    margin-bottom: 6px;
  }

  .model__commission-note {
    font-size: .72rem;
    line-height: 1.6;
  }

  /* Cards de modelo */
  .model__cards {
    gap: 8px;
  }

  .model__card {
    padding: 14px 16px;
    gap: 12px;
    border-radius: var(--r-md);
  }

  .model__card-num {
    width: 32px;
    height: 32px;
    font-size: .74rem;
    border-radius: var(--r-sm);
    flex-shrink: 0;
  }

  .model__card h3 {
    font-size: .9rem;
    margin-bottom: 3px;
  }

  .model__card p {
    font-size: .82rem;
    line-height: 1.65;
  }

  /* Highlight */
  .model__highlight {
    margin-top: 14px;
    padding: 16px 14px;
    border-radius: var(--r-md);
  }

  .model__highlight strong {
    font-size: .95rem;
    margin-bottom: 8px;
  }

  .model__highlight p {
    font-size: .83rem;
    line-height: 1.7;
  }

  /* Disclaimer */
  .model__disc {
    padding: 10px 14px;
    font-size: .71rem;
    line-height: 1.6;
    border-radius: var(--r-sm);
  }
}

/* ----------------------------------------------------------------
   10. PARA QUIÉN ES MOBILE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .forwhom__inner {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 24px;
  }

  .forwhom__col-title {
    font-size: .97rem;
    margin-bottom: 12px;
  }

  .forwhom__list {
    gap: 6px;
  }

  .forwhom__item {
    padding: 12px 14px;
    font-size: .85rem;
    gap: 10px;
    border-radius: var(--r-md);
  }

  .forwhom__check {
    width: 18px;
    height: 18px;
    font-size: 9px;
    flex-shrink: 0;
  }
}

/* ----------------------------------------------------------------
   11. TRANSPARENCIA MOBILE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .transparency__grid {
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 28px;
  }

  .tr-col {
    border-radius: var(--r-lg);
  }

  .tr-col__head {
    padding: 14px 18px;
    font-size: .97rem;
  }

  .tr-col__body {
    padding: 10px 18px;
  }

  .tr-item {
    padding: 11px 0;
    font-size: .84rem;
    gap: 10px;
  }

  .tr-item-icon {
    width: 18px;
    height: 18px;
    font-size: 11px;
  }

  /* Highlight */
  .model__highlight {
    margin-top: 14px;
    padding: 16px 14px;
  }
}

/* ----------------------------------------------------------------
   12. ANTES DE EMPEZAR + CONDICIONES MOBILE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  /* Prereq: layout editorial asimétrico mobile */
  .prereq__grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 10px;
    margin-top: 28px;
  }

  /* Large: fila completa arriba */
  .prereq__item--large {
    grid-column: 1 / 3;
    grid-row: 1;
    flex-direction: row;
    align-items: flex-start;
    gap: 14px;
  }

  .prereq__item--large .prereq__icon {
    font-size: 1.6rem;
    flex-shrink: 0;
    margin-top: 2px;
  }

  /* Las otras dos en fila */
  .prereq__item {
    padding: 18px 16px;
    border-radius: var(--r-lg);
    gap: 8px;
  }

  .prereq__item--large h3 {
    font-size: 1.05rem;
  }

  .prereq__item--large p {
    font-size: .84rem;
    line-height: 1.7;
  }

  .prereq__icon {
    font-size: 1.5rem;
  }

  .prereq__item h3 {
    font-size: .93rem;
  }

  .prereq__item p {
    font-size: .82rem;
    line-height: 1.65;
  }

  /* Conditions — filas limpias, como sección comercial */
  .conditions {
    border-radius: var(--r-lg);
    margin-top: 28px !important;
  }

  .conditions__header {
    padding: 14px 18px;
    font-size: .75rem;
    flex-wrap: wrap;
    gap: 8px;
  }

  .conditions__status {
    margin-left: 0;
    font-size: .64rem;
    padding: 3px 10px;
  }

  /* Grid: 1 columna — filas limpias tipo lista comercial */
  .conditions__grid {
    display: flex;
    flex-direction: column;
    background: transparent;
    gap: 0;
  }

  .conditions__item {
    padding: 14px 18px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--line-subtle);
    gap: 12px;
  }

  .conditions__item:last-child {
    border-bottom: none;
  }

  .conditions__item-label {
    font-size: .72rem;
    margin-bottom: 0;
    color: var(--muted);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    flex-shrink: 0;
  }

  .conditions__item-val {
    font-size: .88rem;
    font-weight: 700;
    color: var(--body);
    gap: 6px;
    justify-content: flex-end;
    text-align: right;
  }

  .conditions__note {
    padding: 12px 18px;
    font-size: .74rem;
  }
}

@media (max-width: 480px) {

  .prereq__grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .prereq__item--large {
    grid-column: 1;
    flex-direction: column;
    gap: 8px;
  }

  .prereq__item--accent {
    grid-column: 1;
  }

  .conditions__item {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 14px 16px;
  }

  .conditions__item-val {
    justify-content: flex-start;
    text-align: left;
    font-size: .9rem;
  }
}

/* ----------------------------------------------------------------
   13. TESTIMONIOS MOBILE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .testi__ph {
    padding: 36px 18px;
    border-radius: var(--r-lg);
    gap: 14px;
  }

  .testi__slots {
    grid-template-columns: 1fr;
    gap: 10px;
    max-width: 100%;
  }

  .testi__slot {
    padding: 18px 16px;
    border-radius: var(--r-md);
  }

  .testi__slot-avatar {
    width: 38px;
    height: 38px;
    font-size: .82rem;
  }
}

/* ----------------------------------------------------------------
   14. FAQ MOBILE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .faq__list {
    margin-top: 28px;
    border-radius: var(--r-lg);
  }

  .faq__q {
    padding: 18px 18px;
    font-size: .92rem;
    gap: 14px;
    min-height: 56px; /* cómodo para tocar */
  }

  .faq__icon {
    width: 26px;
    height: 26px;
    border-radius: var(--r-sm);
    flex-shrink: 0;
  }

  .faq__icon svg {
    width: 12px;
    height: 12px;
  }

  .faq__a {
    padding: 0 18px 20px;
    font-size: .88rem;
    line-height: 1.8;
  }
}

/* ----------------------------------------------------------------
   15. CTA FINAL MOBILE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .cta-final {
    margin: 48px 0 36px;
    padding: 56px 22px 48px;
    border-radius: var(--r-xl);
    text-align: center;
  }

  .cta-final h2 {
    font-size: clamp(1.6rem, 7vw, 2.2rem);
    line-height: 1.1;
    margin-bottom: 14px;
  }

  .cta-final__sub {
    font-size: .93rem;
    margin-bottom: 28px;
    line-height: 1.75;
  }

  /* Summary: 2x2 grid en lugar de fila */
  .cta-final__summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 28px;
    flex-wrap: unset;
    justify-content: unset;
    align-items: unset;
  }

  .cta-final__summary-item {
    padding: 10px 12px;
    font-size: .8rem;
    border-radius: var(--r-md);
    gap: 6px;
    justify-content: center;
    text-align: center;
    flex-direction: column;
  }

  .cta-final__summary-icon {
    font-size: .95rem;
  }

  /* Ocultar separadores "+" del summary en mobile (ya son grid) */
  .cta-final__summary-sep {
    display: none;
  }

  /* CTAs: columna */
  .cta-final__ctas {
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
  }

  .cta-final__ctas .btn {
    width: 100%;
    max-width: 360px;
    justify-content: center;
    min-height: 52px;
  }

  .cta-final__note {
    font-size: .72rem;
  }
}

/* ----------------------------------------------------------------
   16. STICKY CTA MOBILE — no tape contenido, zona táctil correcta
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .sticky-cta {
    padding: 10px 16px;
    padding-bottom: max(10px, env(safe-area-inset-bottom));
  }

  .sticky-cta .btn {
    font-size: .97rem;
    padding: 14px 20px;
    min-height: 50px;
    border-radius: var(--r-md);
  }

  /* Espacio para que el sticky CTA no tape el contenido final */
  body {
    padding-bottom: 72px;
  }

  /* Cuando la sección #contacto es visible, sticky se oculta via JS */
  /* (lógica ya implementada en initStickyCTA) */
}

/* ----------------------------------------------------------------
   17. NAVBAR MOBILE — ajustes finos
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .navbar {
    padding: 16px 0;
  }

  .navbar.scrolled {
    padding: 11px 0;
  }

  .navbar__logo {
    font-size: .9rem;
  }

  .navbar__toggle {
    width: 38px;
    height: 38px;
  }

  .navbar__mobile a {
    padding: 14px 0;
    font-size: .92rem;
  }
}

/* ----------------------------------------------------------------
   18. REF SECTION + FOOTER MOBILE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  .ref-section {
    padding: 28px 0;
  }

  .btn--ref {
    font-size: .82rem;
    padding: 13px 24px;
    border-radius: var(--r-md);
  }

  .footer {
    padding: 36px 0 20px;
  }

  .footer__inner {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .footer__brand {
    font-size: .92rem;
  }

  .footer__tagline {
    font-size: .78rem;
  }

  .footer__disc {
    font-size: .71rem;
    line-height: 1.6;
    margin-top: 10px;
  }

  .footer__credit {
    text-align: left;
    font-size: .72rem;
  }

  .footer__bottom {
    font-size: .68rem;
    margin-top: 18px;
  }
}

/* ----------------------------------------------------------------
   19. BREAKPOINT 480px — refinamientos adicionales
   ---------------------------------------------------------------- */
@media (max-width: 480px) {

  .container {
    padding: 0 16px;
  }

  .section {
    padding: 48px 0;
  }

  .section--sm {
    padding: 28px 0;
  }

  .section-header {
    margin-bottom: 28px;
  }

  .section-header h2 {
    font-size: clamp(1.4rem, 7.5vw, 1.8rem);
  }

  /* Hero */
  .hero {
    padding-top: 88px;
    padding-bottom: 48px;
  }

  .hero__h1-pre {
    font-size: .92rem;
  }

  .hero__h1-main {
    font-size: clamp(2rem, 10.5vw, 2.6rem);
  }

  .hero__sub {
    font-size: .88rem;
  }

  .hero__badge {
    font-size: .58rem;
    padding: 5px 10px;
  }

  /* Mockup más compacto */
  .hero__mockup {
    max-width: 300px;
  }

  .hm-footer {
    gap: 4px;
  }

  .hm-stat-val {
    font-size: .88rem;
  }

  .hm-stat-lbl {
    font-size: .52rem;
  }

  /* CTA final mobile */
  .cta-final {
    padding: 44px 18px 40px;
    margin: 40px 0 28px;
  }

  .cta-final h2 {
    font-size: clamp(1.45rem, 7.5vw, 1.9rem);
  }
}

/* ----------------------------------------------------------------
   20. BREAKPOINT 360px — mínimo garantizado
   ---------------------------------------------------------------- */
@media (max-width: 360px) {

  .container {
    padding: 0 14px;
  }

  .section {
    padding: 40px 0;
  }

  /* Navbar */
  .navbar__logo {
    font-size: .78rem;
    letter-spacing: 0;
  }

  /* Hero */
  .hero {
    padding-top: 80px;
    padding-bottom: 40px;
  }

  .hero__h1-pre {
    font-size: .85rem;
  }

  .hero__h1-main {
    font-size: 1.95rem;
    line-height: 1.0;
  }

  .hero__sub {
    font-size: .84rem;
    line-height: 1.7;
  }

  .hero__badge {
    font-size: .55rem;
    letter-spacing: 1px;
    padding: 5px 9px;
  }

  .hero__ctas .btn {
    padding: 13px 18px;
    font-size: .9rem;
    min-height: 48px;
  }

  .hero__mockup {
    max-width: 280px;
  }

  /* Section headers */
  .section-header h2 {
    font-size: 1.4rem;
  }

  .section-header p {
    font-size: .85rem;
  }

  /* Bento */
  .bento {
    grid-template-columns: 1fr 1fr;
    gap: 7px;
  }

  .bento__item--featured {
    flex-direction: column;
    padding: 14px;
  }

  .bento__item--featured h3 {
    font-size: .9rem;
  }

  .bento__item {
    padding: 12px 12px;
  }

  .bento__item h3 {
    font-size: .84rem;
  }

  .bento__item p {
    font-size: .76rem;
  }

  /* Tabs */
  .exp__tab {
    padding: 8px 4px;
    font-size: .68rem;
    min-height: 50px;
  }

  .exp__tab span[aria-hidden="true"] {
    font-size: .95rem;
  }

  /* Flow */
  .model__flow-node {
    padding: 10px 12px;
    font-size: .82rem;
  }

  .model__commission-val {
    font-size: 2.6rem;
  }

  /* Buttons */
  .btn {
    padding: 12px 18px;
    font-size: .88rem;
  }

  .btn--xl,
  .btn--lg {
    padding: 13px 20px;
    font-size: .92rem;
  }

  /* CTA final */
  .cta-final {
    padding: 40px 14px 36px;
    margin: 36px 0 24px;
    border-radius: var(--r-lg);
  }

  .cta-final h2 {
    font-size: 1.38rem;
  }

  .cta-final__summary {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }

  .cta-final__summary-item {
    padding: 8px 8px;
    font-size: .74rem;
  }

  /* Conditions */
  .conditions__item {
    padding: 12px 14px;
  }

  .conditions__item-label {
    font-size: .66rem;
  }

  .conditions__item-val {
    font-size: .84rem;
  }

  /* FAQ */
  .faq__q {
    padding: 16px 14px;
    font-size: .86rem;
    min-height: 50px;
  }

  .faq__a {
    padding: 0 14px 16px;
    font-size: .84rem;
  }

  /* Sticky CTA */
  .sticky-cta .btn {
    font-size: .9rem;
    padding: 12px 16px;
    min-height: 46px;
  }

  /* Overflow horizontal: garantía */
  .hero__float-card {
    left: -4px;
    max-width: calc(100% - 40px);
  }

  /* Skills */
  .skill-block__grid {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }

  .skill-block--sm {
    padding: 12px 10px;
  }

  .skill-block--sm h3 {
    font-size: .83rem;
  }

  .skill-block--sm p {
    font-size: .74rem;
  }

  /* Prereq */
  .prereq__item {
    padding: 14px 12px;
  }

  .prereq__item h3 {
    font-size: .87rem;
  }

  .prereq__item p {
    font-size: .78rem;
  }

  /* Footer */
  .footer {
    padding: 28px 0 16px;
  }

  .footer__brand {
    font-size: .84rem;
  }
}

/* ----------------------------------------------------------------
   21. OVERFLOW HORIZONTAL — garantía global mobile
   ---------------------------------------------------------------- */
@media (max-width: 768px) {

  /* Prevenir cualquier overflow horizontal en toda la página */
  html, body {
    overflow-x: hidden;
    max-width: 100%;
  }

  /* Secciones y contenedores */
  .hero,
  .trust-bar,
  .bento,
  .skills__asymmetric,
  .model__inner,
  .value-moment__inner,
  .forwhom__inner,
  .transparency__grid,
  .prereq__grid,
  .conditions__grid,
  .exp__tabs,
  .exp__stage,
  .how__inner,
  .cta-final__summary {
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Imágenes y videos */
  img, video, iframe {
    max-width: 100%;
  }

  /* Textos largos sin desbordamiento */
  h1, h2, h3, h4, p, span, a {
    word-break: break-word;
    overflow-wrap: break-word;
  }
}

/* ----------------------------------------------------------------
   22. BODY PADDING — espacio para sticky CTA al final de página
       Solo cuando el sticky está visible (antes del #contacto)
   ---------------------------------------------------------------- */
@media (min-width: 769px) {
  body {
    padding-bottom: 0 !important;
  }
}

/* ================================================================
   REFINAMIENTO FINAL — ajustes puntuales
   ================================================================ */

/* ---- Bloque 90%: label "Esquema de comisión" encima del número ---- */
.model__commission-scheme {
  font-size: .65rem;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 10px;
}

/* ---- Sección testimonios — estado intencional "próximamente" ---- */
.testi__coming {
  margin-top: 32px;
  padding: 48px 32px;
  border-radius: var(--r-xl);
  border: 1px solid var(--line);
  background: linear-gradient(160deg, var(--bg-card2), var(--bg-card));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}

.testi__coming-icon {
  width: 64px;
  height: 64px;
  border-radius: var(--r-lg);
  background: var(--orange-glow);
  border: 1px solid var(--orange-border);
  display: grid;
  place-items: center;
  color: var(--orange);
}

.testi__coming-text {
  font-size: .93rem;
  color: var(--muted);
  line-height: 1.75;
  max-width: 440px;
  margin: 0;
}

/* ---- SVG icons en trust-item__icon — centrado correcto ---- */
.trust-item__icon svg,
.about__item-icon svg,
.about__module-icon svg,
.bento__icon svg,
.vmd__item-icon svg,
.prereq__icon svg,
.cta-final__summary-icon svg,
.hm-mod-icon svg,
.hm-stat-val svg,
.hero__float-icon svg,
.how__sidebar-node-icon svg,
.model__flow-node-icon svg,
.exp__comm-avatar svg,
.exp__tab svg {
  display: block;
}

/* ---- Ajustes mobile para nuevas clases ---- */
@media (max-width: 768px) {
  .testi__coming {
    padding: 36px 20px;
    border-radius: var(--r-lg);
  }

  .testi__coming-icon {
    width: 52px;
    height: 52px;
  }

  .testi__coming-text {
    font-size: .86rem;
  }

  .model__commission-scheme {
    font-size: .62rem;
    letter-spacing: 1.5px;
    margin-bottom: 8px;
  }
}

@media (max-width: 360px) {
  .testi__coming {
    padding: 28px 16px;
  }
}