:root{
    --navy:#16264A;
    --navy-dark:#0E1930;
    --gold:#B08D57;
    --gold-light:#D8C39A;
    --white:#FFFFFF;
    --ink:#2B2B2B;
    --gray:#6B7280;
    --mist:#EEF1F6;
    --mist-dark:#E3E8F0;
    --serif: 'Cambria','Georgia','Times New Roman',serif;
    --sans: 'Calibri','Segoe UI','Helvetica Neue',Arial,sans-serif;
  }
  *{ margin:0; padding:0; box-sizing:border-box; }
  .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;
  }
  html{ scroll-behavior:smooth; }
  body{
    font-family:var(--sans);
    color:var(--ink);
    background:var(--white);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{ max-width:100%; display:block; }
  a{ color:inherit; text-decoration:none; }
  .container{ max-width:1140px; margin:0 auto; padding:0 28px; }
  .eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    background:var(--gold-light); color:var(--navy);
    font-weight:700; font-size:12.5px; letter-spacing:2.2px; text-transform:uppercase;
    padding:9px 20px; border-radius:30px;
  }
  .eyebrow .dot{ width:6px; height:6px; border-radius:50%; background:var(--navy); }
  h1,h2,h3{ font-family:var(--serif); color:var(--navy); font-weight:700; }
  .section-label{
    font-family:var(--sans); font-weight:700; font-size:13px; letter-spacing:2px;
    text-transform:uppercase; color:var(--gold); display:flex; align-items:center; gap:10px; margin-bottom:14px;
  }
  .section-label::before{ content:""; width:26px; height:1.5px; background:var(--gold); display:inline-block; }
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    font-weight:700; font-size:15.5px; padding:15px 30px; border-radius:10px;
    cursor:pointer; border:none; transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
    font-family:var(--sans);
  }
  .btn-gold{ background:var(--gold); color:var(--navy-dark); }
  .btn-gold:hover{ transform:translateY(-2px); box-shadow:0 14px 28px -12px rgba(176,141,87,0.55); }
  .btn-outline{ background:transparent; color:var(--white); border:1.5px solid rgba(255,255,255,0.5); }
  .btn-outline:hover{ background:rgba(255,255,255,0.08); border-color:var(--white); }
  .btn-outline-navy{ background:transparent; color:var(--navy); border:1.5px solid var(--navy); }
  .btn-outline-navy:hover{ background:var(--navy); color:var(--white); }

  /* reveal-on-scroll */
  .reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s ease; }
  .reveal.in{ opacity:1; transform:translateY(0); }
  .reveal-delay-1{ transition-delay:.1s; }
  .reveal-delay-2{ transition-delay:.2s; }
  .reveal-delay-3{ transition-delay:.3s; }

  /* ---------------- NAV ---------------- */
  header.nav{
    position:fixed; top:0; left:0; right:0; z-index:100;
    background:rgba(255,255,255,0.0);
    backdrop-filter:blur(0px);
    transition:background .35s ease, backdrop-filter .35s ease, box-shadow .35s ease, padding .35s ease;
    padding:22px 0;
  }
  header.nav.scrolled{
    background:rgba(255,255,255,0.92);
    backdrop-filter:blur(10px);
    box-shadow:0 6px 24px -12px rgba(22,38,74,0.18);
    padding:14px 0;
  }
  .nav-inner{ display:flex; align-items:center; justify-content:space-between; }
  .nav-logo{ display:flex; align-items:center; gap:12px; }
  .nav-logo img{ width:42px; height:42px; }
  .nav-logo .lock{ line-height:1.1; }
  .nav-logo .lock .name{ font-family:var(--serif); font-weight:700; font-size:17px; letter-spacing:1.4px; color:var(--navy); }
  .nav-logo .lock .tag{ font-size:8.5px; letter-spacing:1.2px; color:var(--gold); text-transform:uppercase; font-weight:700; }
  nav.links{ display:flex; align-items:center; gap:34px; }
  nav.links a:not(.nav-cta){ position:relative; font-size:14.5px; font-weight:600; color:var(--navy); opacity:.82; transition:opacity .2s; }
  nav.links a:not(.nav-cta)::after{
    content:""; position:absolute; left:0; bottom:-4px; width:0; height:1.5px; background:var(--gold);
    transition:width .25s ease;
  }
  nav.links a:not(.nav-cta):hover{ opacity:1; }
  nav.links a:not(.nav-cta):hover::after{ width:100%; }
  nav.links a.nav-cta{ font-size:14.5px; font-weight:600; }
  .nav-cta{ font-size:14px; padding:11px 22px; }
  .nav-toggle{ display:none; }

  /* ---------------- HERO ---------------- */
  .hero{
    position:relative; background:var(--navy); color:var(--white);
    padding:168px 0 120px 0; overflow:hidden;
  }
  .hero::before, .hero::after{
    content:""; position:absolute; border-radius:50%; border:1.5px solid var(--gold); opacity:.18;
  }
  .hero::before{ width:620px; height:620px; top:-260px; right:-180px; animation:spin 90s linear infinite; }
  .hero::after{ width:420px; height:420px; bottom:-220px; right:60px; opacity:.12; animation:spin 70s linear infinite reverse; }
  @keyframes spin{ from{ transform:rotate(0deg);} to{ transform:rotate(360deg);} }
  .hero-emblem-bg{
    position:absolute; right:-60px; top:50%; transform:translateY(-50%);
    width:520px; height:520px; opacity:.06; pointer-events:none;
  }
  .hero-inner{ position:relative; z-index:2; max-width:680px; }
  .hero .eyebrow{ background:rgba(216,195,154,0.16); color:var(--gold-light); border:1px solid rgba(216,195,154,0.35); }
  .hero .eyebrow .dot{ background:var(--gold-light); }
  .hero h1{
    color:var(--white); font-size:56px; line-height:1.1; margin-top:26px; letter-spacing:.2px;
  }
  .hero h1 em{ font-style:normal; color:var(--gold-light); }
  .hero p.lead{
    font-size:18.5px; color:rgba(255,255,255,0.78); margin-top:20px; line-height:1.6; max-width:540px;
  }
  .hero-ctas{ display:flex; gap:16px; margin-top:38px; flex-wrap:wrap; }
  .hero-stats{
    display:flex; gap:0; margin-top:56px; border-top:1px solid rgba(255,255,255,0.14); padding-top:28px;
    max-width:600px;
  }
  .hero-stat{ flex:1; padding-right:20px; }
  .hero-stat .val{ font-family:var(--serif); font-size:26px; font-weight:700; color:var(--gold-light); }
  .hero-stat .lbl{ font-size:12px; color:rgba(255,255,255,0.6); text-transform:uppercase; letter-spacing:1px; margin-top:4px; }

  /* ---------------- HERO LIGHT (banner con imagen) ---------------- */
  .hero.hero-light{ background:var(--white); color:var(--ink); }
  .hero.hero-light::before,
  .hero.hero-light::after,
  .hero.hero-light .hero-emblem-bg{ display:none; }
  .hero.hero-light .hero-inner{ max-width:none; }
  .hero-banner-img{
    width:calc(100% + 56px); max-width:calc(100% + 56px); margin:0 -28px;
    height:auto; display:block;
  }
  .hero.hero-light .hero-ctas{
    margin-top:32px; justify-content:center;
  }
  .hero.hero-light .hero-ctas .btn{ padding:13px 28px; font-size:14.5px; }
  .hero.hero-light .hero-stats{
    border-top:1px solid var(--mist-dark); max-width:640px;
    margin-left:auto; margin-right:auto; justify-content:center; padding-top:24px; margin-top:40px;
    flex-wrap:wrap; row-gap:20px;
  }
  .hero.hero-light .hero-stat{
    flex:none; padding:0 26px; text-align:center; border-right:1px solid var(--mist-dark);
  }
  .hero.hero-light .hero-stat:last-child{ border-right:none; }
  .hero.hero-light .hero-stat .val{ color:var(--navy); font-size:22px; }
  .hero.hero-light .hero-stat .lbl{ color:var(--gray); font-size:11px; }

  /* ---------------- MARQUEE STRIP ---------------- */
  .strip{ background:var(--gold); overflow:hidden; padding:13px 0; }
  .strip-track{ display:flex; gap:56px; white-space:nowrap; animation:marquee 26s linear infinite; width:max-content; }
  .strip-track span{ font-family:var(--serif); font-weight:700; font-size:14.5px; color:var(--navy-dark); letter-spacing:.5px; display:inline-flex; align-items:center; gap:14px; }
  .strip-track span::after{ content:"◆"; font-size:9px; color:var(--navy-dark); opacity:.55; margin-left:14px; }
  @keyframes marquee{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

  /* ---------------- SECTION GENERIC ---------------- */
  section{ padding:96px 0; }
  .section-head{ max-width:640px; margin-bottom:52px; }
  .section-head h2{ font-size:38px; line-height:1.18; }
  .section-head p{ color:var(--gray); font-size:16.5px; margin-top:14px; line-height:1.6; }

  /* ---------------- CAROUSEL ---------------- */
  .carousel-wrap{ position:relative; }
  .carousel-viewport{ overflow:hidden; border-radius:22px; }
  .carousel-track{ display:flex; transition:transform .55s cubic-bezier(.65,0,.35,1); cursor:grab; }
  .carousel-track.dragging{ transition:none; cursor:grabbing; }
  .slide{
    flex:0 0 100%; display:grid; grid-template-columns:1fr 1fr; min-height:400px;
    background:var(--navy); position:relative; overflow:hidden;
  }
  .slide .ring-deco{ position:absolute; border-radius:50%; border:1.5px solid var(--gold); opacity:.15; }
  .slide .ring-deco.r1{ width:280px; height:280px; top:-100px; left:-100px; }
  .slide .ring-deco.r2{ width:180px; height:180px; bottom:-90px; left:120px; opacity:.1;}
  .slide-media{
    position:relative; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(160deg, var(--navy-dark), var(--navy));
    padding:40px;
  }
  .slide-media .icon-circle{
    width:168px; height:168px; border-radius:50%; border:1.5px solid var(--gold);
    display:flex; align-items:center; justify-content:center; position:relative; z-index:2;
    background:rgba(216,195,154,0.06);
    transition:transform .4s ease, background .4s ease;
  }
  .slide:hover .icon-circle{ transform:scale(1.06) rotate(-3deg); background:rgba(216,195,154,0.12); }
  .slide-list li{ transition:transform .25s ease, color .25s ease; }
  .slide-list li:hover{ transform:translateX(4px); color:var(--white); }
  .slide-list li:hover svg{ stroke:var(--gold-light); }
  .slide-number{
    position:absolute; top:26px; left:32px; font-family:var(--serif); font-size:15px; color:var(--gold-light);
    letter-spacing:1px; z-index:2;
  }
  .slide-content{ padding:52px 56px; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2; }
  .slide-content .stag{ font-size:12.5px; letter-spacing:2px; text-transform:uppercase; color:var(--gold-light); font-weight:700; }
  .slide-content h3{ color:var(--white); font-size:30px; margin-top:10px; line-height:1.2; }
  .slide-list{ margin-top:22px; display:flex; flex-direction:column; gap:13px; }
  .slide-list li{ list-style:none; display:flex; align-items:flex-start; gap:12px; color:rgba(255,255,255,0.86); font-size:16px; line-height:1.4; }
  .slide-list li svg{ flex-shrink:0; margin-top:3px; }

  .carousel-controls{ display:flex; align-items:center; justify-content:space-between; margin-top:28px; }
  .carousel-dots{ display:flex; gap:9px; }
  .cdot{ width:9px; height:9px; border-radius:50%; background:var(--mist-dark); border:none; cursor:pointer; transition:background .25s, transform .25s; padding:0; }
  .cdot.active{ background:var(--gold); transform:scale(1.25); }
  .carousel-arrows{ display:flex; gap:10px; }
  .carrow{
    width:46px; height:46px; border-radius:50%; border:1.5px solid var(--mist-dark); background:var(--white);
    display:flex; align-items:center; justify-content:center; cursor:pointer; transition:border-color .2s, transform .2s;
  }
  .carrow:hover{ border-color:var(--gold); transform:translateY(-2px); }

  /* ---------------- CLASS PROGRAM LIST ---------------- */
  .class-list{ display:flex; flex-direction:column; gap:14px; }
  .class-item{
    display:flex; align-items:flex-start; gap:26px; background:var(--white);
    border:1px solid var(--mist-dark); border-radius:16px; padding:26px 30px;
    transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  }
  .class-item:hover{
    transform:translateY(-4px); border-color:var(--gold);
    box-shadow:0 20px 40px -24px rgba(22,38,74,0.28);
  }
  .class-num{
    font-family:var(--serif); font-weight:700; font-size:26px; color:var(--gold);
    min-width:52px; transition:transform .3s ease, color .3s ease;
  }
  .class-item:hover .class-num{ transform:scale(1.12); color:var(--navy); }
  .class-body h3{ font-size:19px; line-height:1.3; }
  .class-body p{ color:var(--gray); font-size:14.5px; margin-top:8px; line-height:1.55; }
  .class-item-more{ border-style:dashed; opacity:.85; }
  .class-item-more .class-num{ color:var(--gray); }

  /* ---------------- DETAILS / SCHEDULE ---------------- */
  .details-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--mist-dark); border-radius:20px; overflow:hidden; }
  .detail-cell{ background:var(--white); padding:32px 26px; transition:background .3s ease, transform .3s ease; position:relative; z-index:1; }
  .detail-cell:hover{ background:var(--mist); transform:translateY(-3px); z-index:2; }
  .detail-cell .icon-badge{
    width:46px; height:46px; border-radius:12px; background:var(--mist); display:flex; align-items:center; justify-content:center; margin-bottom:18px;
    transition:transform .3s ease, background .3s ease;
  }
  .detail-cell:hover .icon-badge{ transform:scale(1.1) rotate(-4deg); background:var(--gold-light); }
  .detail-cell .dlabel{ font-size:12px; letter-spacing:1.4px; text-transform:uppercase; color:var(--gold); font-weight:700; }
  .detail-cell .dvalue{ font-family:var(--serif); font-size:19px; color:var(--navy); margin-top:6px; font-weight:700; line-height:1.3; }

  .price-section{ background:var(--mist); }
  .price-grid{ display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:22px; margin-top:8px; }
  .price-card{ background:var(--white); border-radius:18px; padding:34px 30px; text-align:center; border:1px solid var(--mist-dark); transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
  .price-card:hover{ transform:translateY(-5px); border-color:var(--gold); box-shadow:0 20px 40px -24px rgba(22,38,74,0.25); }
  .price-cta{ transition:transform .3s ease; }
  .price-cta:hover{ transform:translateY(-5px); }
  .price-card .plabel{ font-size:13px; text-transform:uppercase; letter-spacing:1.4px; color:var(--gray); font-weight:700; }
  .price-card .pval{ font-family:var(--serif); font-size:40px; color:var(--navy); font-weight:700; margin-top:10px; }
  .price-cta{ background:var(--navy); border-radius:18px; padding:34px 30px; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; position:relative; overflow:hidden; }
  .price-cta .ring-deco{ position:absolute; border-radius:50%; border:1.5px solid var(--gold); opacity:.18; width:200px; height:200px; top:-80px; right:-80px; }
  .price-cta h4{ color:var(--white); font-family:var(--serif); font-size:22px; position:relative; z-index:2; }
  .price-cta p{ color:rgba(255,255,255,0.65); font-size:13.5px; position:relative; z-index:2; }

  /* ---------------- EXPOSITOR ---------------- */
  .expositor{ display:grid; grid-template-columns:220px 1fr; gap:44px; align-items:center; }
  .exp-avatar{
    width:190px; height:190px; border-radius:50%; background:var(--navy);
    display:flex; align-items:center; justify-content:center; position:relative; border:2px solid var(--gold);
  }
  .exp-avatar .ring-deco{ position:absolute; width:230px; height:230px; border-radius:50%; border:1px solid var(--gold); opacity:.3; }
  .exp-name{ font-family:var(--serif); font-size:28px; color:var(--navy); }
  .exp-role{ color:var(--gold); font-weight:700; font-size:14px; letter-spacing:.5px; margin-top:4px; }
  .exp-desc{ color:var(--gray); margin-top:16px; font-size:16px; line-height:1.65; max-width:560px; }

  /* ---------------- FAQ ---------------- */
  .faq-list{ max-width:820px; display:flex; flex-direction:column; gap:14px; }
  .faq-item{
    background:var(--white); border:1px solid var(--mist-dark); border-radius:14px;
    padding:22px 26px; transition:border-color .2s ease, box-shadow .2s ease;
  }
  .faq-item[open]{ border-color:var(--gold); box-shadow:0 10px 28px -18px rgba(22,38,74,0.25); }
  .faq-item summary{
    cursor:pointer; list-style:none; font-family:var(--serif); font-weight:700; font-size:17px;
    color:var(--navy); display:flex; align-items:center; justify-content:space-between; gap:16px;
  }
  .faq-item summary::-webkit-details-marker{ display:none; }
  .faq-item summary::after{
    content:"+"; flex-shrink:0; font-family:var(--sans); font-size:22px; font-weight:700; color:var(--gold);
    transition:transform .25s ease;
  }
  .faq-item[open] summary::after{ content:"−"; }
  .faq-item p{ color:var(--gray); font-size:15.5px; line-height:1.65; margin-top:14px; }

  /* ---------------- FINAL CTA ---------------- */
  .final-cta{ background:var(--navy-dark); color:var(--white); text-align:center; position:relative; overflow:hidden; }
  .final-cta .ring-deco{ position:absolute; border-radius:50%; border:1.5px solid var(--gold); opacity:.12; }
  .final-cta .ring-deco.r1{ width:500px; height:500px; top:-260px; left:50%; transform:translateX(-70%); }
  .final-cta .ring-deco.r2{ width:340px; height:340px; bottom:-200px; right:10%; }
  .final-cta-inner{ position:relative; z-index:2; max-width:640px; margin:0 auto; }
  .final-cta h2{ color:var(--white); font-size:38px; }
  .final-cta p{ color:rgba(255,255,255,0.7); margin-top:16px; font-size:17px; line-height:1.6; }
  .final-ctas{ display:flex; gap:16px; justify-content:center; margin-top:36px; flex-wrap:wrap; }

  /* ---------------- FOOTER ---------------- */
  footer{ background:var(--white); padding:48px 0 34px 0; border-top:1px solid var(--mist-dark); }
  .footer-inner{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:24px; }
  .footer-logo{ display:flex; align-items:center; gap:12px; }
  .footer-logo img{ width:36px; height:36px; }
  .footer-logo .name{ font-family:var(--serif); font-weight:700; color:var(--navy); font-size:15px; letter-spacing:1px; }
  .footer-links{ display:flex; gap:28px; flex-wrap:wrap; }
  .footer-links a{ display:flex; align-items:center; gap:8px; font-size:14px; color:var(--navy); font-weight:600; transition:transform .25s ease, color .25s ease; }
  .footer-links a:hover{ transform:translateY(-2px); color:var(--gold); }
  .footer-links a:hover svg{ stroke:var(--gold); }
  .footer-copy{ margin-top:30px; padding-top:24px; border-top:1px solid var(--mist); text-align:center; font-size:12.5px; color:var(--gray); }

  /* ---------------- RESPONSIVE ---------------- */
  @media (max-width: 900px){
    nav.links{ display:none; }
    .hero h1{ font-size:40px; }
    .hero-emblem-bg{ display:none; }
    .details-grid{ grid-template-columns:1fr 1fr; }
    .price-grid{ grid-template-columns:1fr; }
    .slide{ grid-template-columns:1fr; }
    .slide-media{ display:none; }
    .expositor{ grid-template-columns:1fr; text-align:center; justify-items:center; }
    .exp-desc{ margin-left:auto; margin-right:auto; }
    .footer-inner{ flex-direction:column; align-items:flex-start; }
  }
  @media (max-width: 560px){
    .hero{ padding:140px 0 90px; }
    .hero h1{ font-size:32px; }
    .hero-ctas{ flex-direction:column; align-items:stretch; }
    .hero-ctas .btn{ width:100%; }
    .hero.hero-light .hero-stats{ flex-wrap:wrap; row-gap:20px; }
    .hero.hero-light .hero-stat{ flex:0 0 50%; padding:0 10px; border-right:none; }
    section{ padding:70px 0; }
    .section-head h2{ font-size:28px; }
    .details-grid{ grid-template-columns:1fr; }
    .slide-content{ padding:36px 28px; }
    .final-cta h2{ font-size:28px; }
    .final-ctas{ flex-direction:column; }
    .final-ctas .btn{ width:100%; }
  }

  /* ---------------- FLOATING WHATSAPP BUTTON ---------------- */
  .wa-float{
    position:fixed; right:26px; bottom:26px; z-index:200;
    width:62px; height:62px; border-radius:50%;
    background:#25D366; display:flex; align-items:center; justify-content:center;
    box-shadow:0 10px 26px -8px rgba(0,0,0,0.4);
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .wa-float:hover{ transform:translateY(-4px) scale(1.06); box-shadow:0 16px 32px -10px rgba(0,0,0,0.45); }
  .wa-float::before{
    content:""; position:absolute; inset:0; border-radius:50%; background:#25D366;
    animation:wa-pulse 2.2s ease-out infinite;
    z-index:-1;
  }
  .wa-tooltip{
    position:absolute; right:74px; top:50%; transform:translateY(-50%) translateX(6px);
    background:var(--navy); color:var(--white); font-size:13px; font-weight:600;
    padding:9px 14px; border-radius:8px; white-space:nowrap;
    opacity:0; pointer-events:none; transition:opacity .25s ease, transform .25s ease;
  }
  .wa-float:hover .wa-tooltip{ opacity:1; transform:translateY(-50%) translateX(0); }
  @keyframes wa-pulse{
    0%{ transform:scale(1); opacity:.55; }
    100%{ transform:scale(1.7); opacity:0; }
  }
  @media (max-width:560px){
    .wa-float{ right:16px; bottom:16px; width:56px; height:56px; }
    .wa-tooltip{ display:none; }
  }

  /* ---------------- UTILITY CLASSES (moved out of inline style="" for strict CSP) ---------------- */
  .bg-mist{ background:var(--mist); }
  .pt-0{ padding-top:0; }
  .btn-relative{ position:relative; z-index:2; }
  .eyebrow-dark{ background:rgba(216,195,154,0.16); color:#D8C39A; border:1px solid rgba(216,195,154,.35); }
  .dot-gold-light{ background:#D8C39A; }
  .mt-22{ margin-top:22px; }

  @media (prefers-reduced-motion: reduce){
    *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  }
