  /* ============ DESIGN TOKENS ============ */
  :root{
    --teal: #6dc7da;          /* En esta versión el secundario claro ocupa el rol principal */
    --teal-dark: #3aaec8;     /* Celeste medio: rellenos y degradados */
    --sky-text: #1a7b91;      /* Celeste oscuro legible para texto sobre fondos claros */
    --teal-deep: #053d49;     /* Fondo oscuro de marca: secciones de alto impacto */
    --teal-light: #e2f4f8;
    --sky: #6dc7da;           /* Secundario claro: enlaces, bordes activos, detalles */
    --sky-soft: rgba(109,199,218,0.35);
    --sky-tint: #e2f4f8;      /* Secundario claro muy suave para fondos de íconos/insignias */
    --sky-ink: #0b5a6b;       /* Texto legible sobre --sky-tint */
    --orange: #ff7a59;        /* Acento cálido coral: llamadas a la acción (clic) */
    --orange-dark: #f0603d;
    --orange-soft: #ffe9e2;
    --on-accent: #1a2b32;     /* Texto sobre el acento coral */
    --nav-link: var(--sky-text);
    --nav-link-hover: var(--teal-deep);
    --ink: #1a2b32;           /* Texto principal */
    --ink-soft: #5c7379;      /* Gris de apoyo: subtítulos, fechas, textos secundarios */
    --bg: #f4f8f9;            /* Fondo claro / neutro */
    --surface: #ffffff;
    --surface-2: #eaf2f4;
    --border: #dce7ea;
    --border-strong: #c3d5da;
    --good: #1f9d63;
    --bad: #ef4444;           /* Error / alerta */
    --shadow: 0 20px 45px -22px rgba(26,43,50,0.28);
    --shadow-sm: 0 8px 20px -12px rgba(26,43,50,0.22);
    --radius-lg: 26px;
    --radius-md: 16px;
    --radius-sm: 10px;
    --font-display: "Poppins", -apple-system, "Segoe UI", Roboto, sans-serif;   /* Títulos y botones (igual que sunnyviewtravel.com) */
    --font-body: "Poppins", -apple-system, "Segoe UI", Roboto, sans-serif;        /* Texto general (tipografía de marca) */
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg: #031f26;
      --surface: #072b33;
      --surface-2: #09323b;
      --border: #12424d;
      --border-strong: #1b5260;
      --ink: #f4f8f9;
      --ink-soft: #a9c2c8;
      --teal-light: #0d4351;
      --orange-soft: #4a2a22;
    --sky-tint: rgba(109,199,218,0.14);
    --sky-ink: #6dc7da;
    --sky-text: #6dc7da;
      --sky-tint: rgba(109,199,218,0.14);
      --sky-ink: #6dc7da;
      --sky-text: #6dc7da;
      --nav-link: #6dc7da;
      --nav-link-hover: #ffffff;
      --shadow: 0 20px 45px -18px rgba(0,0,0,0.55);
      --shadow-sm: 0 8px 20px -12px rgba(0,0,0,0.5);
    }
  }
  :root[data-theme="dark"]{
    --bg: #031f26;
    --surface: #072b33;
    --surface-2: #09323b;
    --border: #12424d;
    --border-strong: #1b5260;
    --ink: #f4f8f9;
    --ink-soft: #a9c2c8;
    --teal-light: #0d4351;
    --orange-soft: #4a2a22;
    --sky-tint: rgba(109,199,218,0.14);
    --sky-ink: #6dc7da;
    --sky-text: #6dc7da;
    --nav-link: #6dc7da;
    --nav-link-hover: #ffffff;
    --shadow: 0 20px 45px -18px rgba(0,0,0,0.55);
    --shadow-sm: 0 8px 20px -12px rgba(0,0,0,0.5);
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  section[id]{scroll-margin-top:76px;} /* evita que el header fijo tape el inicio de la sección */
  body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:var(--font-body);
    font-size:15.5px;
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;}
  h1,h2,h3,h4{font-family:var(--font-display);color:var(--ink);margin:0;text-wrap:balance;letter-spacing:-0.01em;}
  p{margin:0;}
  ul{margin:0;padding:0;list-style:none;}
  button{font-family:inherit;cursor:pointer;}
  input,select{font-family:inherit;}
  :focus-visible{outline:3px solid var(--sky);outline-offset:2px;}
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
  }

  .wrap{max-width:1180px;margin:0 auto;padding-inline:20px;}
  .eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    font-size:12.5px;font-weight:700;letter-spacing:0.09em;text-transform:uppercase;
    color:var(--sky-text);
  }
  .eyebrow::before{content:"";width:22px;height:3px;border-radius:3px;background:var(--sky);flex:none;}
  .section{padding-block:88px;}
  @media (max-width:720px){ .section{padding-block:56px;} }
  .section-head{max-width:640px;margin-bottom:44px;}
  .section-head h2{font-size:clamp(1.7rem,3.4vw,2.5rem);font-weight:600;line-height:1.18;}
  .section-head p{margin-top:14px;color:var(--ink-soft);font-size:1.05rem;}
  .center{text-align:center;margin-inline:auto;}

  /* Buttons */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:10px;
    padding:14px 28px;border-radius:999px;border:2px solid transparent;
    font-family:var(--font-display);font-weight:600;font-size:0.95rem;text-decoration:none;white-space:nowrap;
    transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease;
  }
  .btn:hover{transform:translateY(-2px);}
  .btn svg{width:18px;height:18px;flex:none;}
  .btn-orange{background:var(--orange);color:#fff;font-weight:700;letter-spacing:0.01em;box-shadow:0 14px 28px -12px rgba(255,122,89,0.55);}
  .btn-orange:hover{background:var(--orange-dark);color:#fff;}
  .btn-outline{background:transparent;border-color:var(--sky);color:#fff;}
  .btn-outline:hover{background:var(--sky);border-color:var(--sky);color:var(--teal-deep);}
  .btn-ghost-dark{background:transparent;border-color:var(--sky);color:var(--sky-text);}
  .btn-ghost-dark:hover{background:var(--surface-2);}
  .btn-block{width:100%;}

  /* ============ HEADER ============ */
  header.site{
    position:sticky;top:env(safe-area-inset-top,0px);z-index:50;
    background:var(--bg);
    border-bottom:1px solid var(--border);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px;}
  /* El header ocupa todo el ancho de la pantalla (no se limita a 1180px como el contenido) */
  header.site .wrap.nav{max-width:none;padding-inline:clamp(20px,3vw,48px);}
  .nav .logo img{height:60px;width:auto;}
  .logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none;}
  .logo-mark{width:38px;height:38px;flex:none;}
  .logo-word{font-family:var(--font-display);font-weight:600;font-size:1.28rem;color:#fff;line-height:1;}
  .logo-word span{display:block;font-family:var(--font-body);font-weight:600;font-size:0.58rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--sky);margin-top:3px;}
  .nav-links{display:flex;align-items:center;gap:clamp(18px,2vw,30px);list-style:none;margin:0;padding:0;}
  .nav-links a{
    position:relative;display:inline-block;padding-block:6px;white-space:nowrap;
    font-size:0.86rem;font-weight:600;color:var(--nav-link);text-decoration:none;
    letter-spacing:0.01em;transition:color .2s ease;
  }
  /* Línea que se desliza bajo el texto al pasar el mouse y queda fija en la sección activa */
  .nav-links a::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px;
    background:var(--sky);transform:scaleX(0);transform-origin:right center;
    transition:transform .3s ease;
  }
  .nav-links a:hover,
  .nav-links a:focus-visible,
  .nav-links a.is-active{color:var(--nav-link-hover);}
  .nav-links a:hover::after,
  .nav-links a:focus-visible::after,
  .nav-links a.is-active::after{transform:scaleX(1);transform-origin:left center;}
  .nav-actions{display:flex;align-items:center;gap:10px;flex:none;}
  /* Botón secundario: outline sobre fondo blanco para que "Registra tu agencia" siga siendo el principal */
  .link-login{
    display:inline-flex;align-items:center;justify-content:center;
    padding:14px 24px;border-radius:999px;border:2px solid var(--sky);
    background:var(--surface);color:var(--nav-link);
    font-family:var(--font-display);font-size:0.95rem;font-weight:600;text-decoration:none;white-space:nowrap;
    transition:transform .15s ease, background-color .15s ease, color .15s ease, border-color .15s ease;
  }
  .link-login:hover{transform:translateY(-2px);background:var(--sky-tint);color:var(--nav-link-hover);border-color:var(--sky);}
  .nav-toggle{display:none;background:transparent;border:0;padding:8px;color:var(--nav-link);}
  @media (max-width:1180px){
    .nav-links{display:none;}
    .link-login{display:none;}
    .nav-actions .btn-orange{display:none;}
    .nav-toggle{display:inline-flex;}
  }
  @media (max-width:400px){
    .logo-word{font-size:1.05rem;}
  }
  .mobile-panel{
    display:none;flex-direction:column;gap:2px;background:var(--teal-deep);
    border-top:1px solid rgba(255,255,255,0.1);
  }
  .mobile-panel.open{display:flex;}
  .mobile-panel a{padding:14px 20px;color:#eaf6f7;text-decoration:none;font-weight:600;font-size:0.95rem;border-bottom:1px solid rgba(255,255,255,0.06);}
  .mobile-panel a.is-active{color:var(--sky);box-shadow:inset 4px 0 0 var(--sky);}
  .mobile-panel .btn{margin:14px 20px;}

  /* ============ HERO ============ */
  .hero{
    position:relative;overflow:hidden;
    background:radial-gradient(120% 140% at 100% 0%, rgba(109,199,218,0.75) 0%, var(--teal-deep) 50%, #032a32 100%);
    color:#fff;padding-block:64px 84px;
  }
  .hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;}
  @media (max-width:940px){ .hero-grid{grid-template-columns:1fr;gap:40px;} }
  .hero-badge{
    display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,0.1);
    border:1px solid var(--sky-soft);padding:7px 14px 7px 8px;border-radius:999px;
    font-size:0.78rem;font-weight:600;color:#eaf6f7;margin-bottom:22px;
  }
  .hero-badge b{background:var(--sky);color:var(--teal-deep);font-size:0.66rem;font-weight:800;letter-spacing:0.05em;text-transform:uppercase;padding:3px 9px;border-radius:999px;}
  .hero h1{font-size:clamp(2.3rem,4.6vw,3.4rem);font-weight:600;line-height:1.08;color:#fff;}
  .hero h1 em{font-style:normal;color:var(--sky);}
  .hero-sub{margin-top:20px;font-size:1.1rem;line-height:1.6;color:#cfe6e9;max-width:52ch;}
  .hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px;}
  .hero-checks{display:flex;flex-wrap:wrap;gap:22px;margin-top:28px;}
  .hero-checks span{display:flex;align-items:center;gap:8px;font-size:0.85rem;color:#dcedef;font-weight:500;}
  .hero-checks svg{width:17px;height:17px;color:var(--sky);flex:none;}
  .hero-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;}
  .hero-chip{
    display:flex;align-items:center;gap:8px;background:rgba(255,255,255,0.08);
    border:1px solid var(--sky-soft);padding:8px 14px;border-radius:999px;font-size:0.78rem;font-weight:600;color:#eaf6f7;
  }
  .hero-chip svg{width:15px;height:15px;color:var(--sky);}

  .hero-visual{position:relative;}
  .hero-photo-card{
    border-radius:var(--radius-lg);overflow:hidden;border:1px solid rgba(255,255,255,0.16);
    box-shadow:var(--shadow);position:relative;
  }
  .hero-photo-card img{width:100%;height:290px;/*object-fit:cover;*/}
  .hero-photo-tag{
    position:absolute;left:18px;bottom:18px;background:rgba(5,61,73,0.78);backdrop-filter:blur(6px);
    color:#fff;padding:9px 14px;border-radius:999px;font-size:0.78rem;font-weight:600;
    display:flex;align-items:center;gap:8px;
  }
  .hero-preview{
    margin-top:-46px;position:relative;z-index:2;margin-inline:18px;
    background:var(--surface);border-radius:var(--radius-md);box-shadow:0 24px 50px -20px rgba(0,0,0,0.45);
    overflow:hidden;border:1px solid rgba(255,255,255,0.5);
  }
  .hero-preview img{width:100%;display:block;}

  /* ============ STATS / TRUST ============ */
  .stats-band{background:var(--surface);border-bottom:1px solid var(--border);}
  .stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;padding-block:34px;}
  @media (max-width:860px){ .stats-grid{grid-template-columns:repeat(2,1fr);} }
  .stat{text-align:center;padding-inline:8px;}
  .stat b{display:block;font-family:var(--font-display);font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:600;color:var(--sky-text);font-variant-numeric:tabular-nums;}
  .stat span{display:block;margin-top:4px;font-size:0.82rem;color:var(--ink-soft);font-weight:600;}

  .providers-row{
    display:flex;flex-wrap:wrap;gap:14px 34px;align-items:center;justify-content:center;
    padding-block:26px;border-top:1px dashed var(--border);
  }
  .providers-row span{font-family:var(--font-display);font-weight:600;font-size:1.02rem;color:var(--ink-soft);opacity:0.8;letter-spacing:0.01em;}

  /* ============ PROBLEM SECTION ============ */
  .problem{background:var(--surface-2);}
  .problem-top{display:grid;grid-template-columns:0.85fr 1.15fr;gap:44px;align-items:center;margin-bottom:44px;}
  @media (max-width:900px){ .problem-top{grid-template-columns:1fr;gap:30px;} }
  .problem-badge{
    display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;
    background:var(--sky-tint);border:1px solid var(--sky);color:var(--sky-ink);
    font-size:0.8rem;font-weight:700;margin-bottom:18px;
  }
  .problem-badge svg{width:16px;height:16px;color:var(--orange-dark);flex:none;}
  .problem-intro h2{font-size:clamp(1.7rem,3.2vw,2.3rem);font-weight:600;line-height:1.16;}
  .problem-intro p{margin-top:14px;color:var(--ink-soft);font-size:1.02rem;line-height:1.6;max-width:38ch;}
  .problem-story{
    background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);
    padding:30px clamp(22px,4vw,38px);box-shadow:var(--shadow-sm);
  }
  .problem-story>p{color:var(--ink-soft);font-size:1rem;line-height:1.7;}
  .problem-story strong{color:var(--ink);}
  .reply-bubble{
    margin:18px 0;padding:16px 18px;border-radius:var(--radius-md);background:var(--surface-2);
    border:1px solid var(--border);display:flex;align-items:flex-start;gap:12px;
  }
  .bubble-icon{
    width:34px;height:34px;border-radius:50%;background:var(--sky-tint);color:var(--sky-ink);
    display:flex;align-items:center;justify-content:center;flex:none;
  }
  .reply-label{display:block;font-size:0.7rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);margin-bottom:3px;}
  .reply-quote{font-family:var(--font-display);font-style:italic;font-weight:600;color:var(--ink);font-size:1.02rem;}
  .punchline{padding-top:16px;border-top:1px solid var(--border);font-weight:700;color:var(--ink);font-size:1.02rem;}
  .underline-accent{
    position:relative;display:inline-block;color:var(--orange-dark);white-space:nowrap;
  }
  .underline-accent::after{
    content:"";position:absolute;left:0;bottom:-5px;width:100%;height:5px;background-repeat:no-repeat;background-size:100% 100%;
    background-image:url("data:image/svg+xml,%3Csvg width='120' height='8' viewBox='0 0 120 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 5.5C28.5 2 76.5 1.5 118 4.5' stroke='%23FF7A59' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E");
  }
  .chaos-label{
    display:flex;align-items:center;gap:10px;margin-bottom:18px;
    font-size:0.8rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--ink-soft);
  }
  .chaos-label .bar{width:6px;height:20px;border-radius:4px;background:var(--orange);flex:none;}
  /* Las tarjetas van escalonadas y unidas por una línea entrecortada (dibujada con JS)
     para transmitir un proceso fragmentado, de ida y vuelta entre proveedores */
  .chaos-list{
    position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:34px 28px;
    align-items:start;margin-bottom:36px;padding-bottom:34px;counter-reset:chaos;
  }
  @media (max-width:900px){ .chaos-list{grid-template-columns:repeat(3,1fr);} }
  @media (max-width:560px){ .chaos-list{grid-template-columns:repeat(2,1fr);gap:30px 22px;} }
  .chaos-path{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0;}
  .chaos-path path{
    fill:none;stroke:var(--orange-dark);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:7 8;
    animation:chaos-dash 1.6s linear infinite;
  }
  @keyframes chaos-dash{ to{ stroke-dashoffset:-30; } }
  /* Sin tarjeta: cada paso flota sobre el fondo de la sección, unido por la línea entrecortada */
  .chaos-item{
    position:relative;z-index:1;background:transparent;border:0;
    padding:6px 4px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;
    transition:transform .2s ease;
  }
  .chaos-item:nth-child(even){margin-top:34px;}
  .chaos-item:hover{transform:translateY(-3px);}
  .chaos-icon{
    position:relative;
    width:56px;height:56px;border-radius:16px;background:var(--surface);border:1.5px dashed var(--border-strong);
    display:flex;align-items:center;justify-content:center;color:var(--sky-text);box-shadow:var(--shadow-sm);
    transition:color .2s ease, border-color .2s ease;
  }
  /* número del paso sobre el icono */
  .chaos-icon::after{
    counter-increment:chaos;content:counter(chaos);
    position:absolute;top:-10px;right:-10px;width:24px;height:24px;border-radius:50%;
    background:var(--orange);color:var(--on-accent);font-family:var(--font-display);font-size:0.74rem;font-weight:700;
    display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);
  }
  .chaos-item:hover .chaos-icon{color:var(--orange-dark);border-color:var(--orange);border-style:solid;}
  /* los textos tapan la línea con el mismo color de fondo de la sección, así se leen limpios */
  .chaos-item b,
  .chaos-item > span:not(.chaos-icon){background:var(--surface-2);padding-inline:6px;border-radius:6px;}
  .chaos-item b{font-size:0.92rem;font-weight:700;color:var(--ink);}
  .chaos-item > span:not(.chaos-icon){font-size:0.76rem;color:var(--ink-soft);margin-top:-6px;}
  .problem-banner{
    background:linear-gradient(120deg, var(--teal-deep) 35%, #0e6a7e);color:#fff;border-left:6px solid var(--sky);border-radius:var(--radius-lg);
    padding:26px 30px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;
  }
  .banner-msg{display:flex;align-items:center;gap:14px;min-width:0;}
  .banner-msg .icon{
    width:44px;height:44px;border-radius:12px;background:rgba(255,122,89,0.18);border:1px solid rgba(255,122,89,0.35);
    color:var(--orange);display:flex;align-items:center;justify-content:center;flex:none;
  }
  .banner-msg>div{min-width:0;}
  .banner-msg p{color:#cfe6e9;font-size:0.92rem;margin:0;}
  .banner-msg strong{display:block;color:var(--orange);font-size:1.05rem;font-family:var(--font-display);font-weight:600;margin-top:2px;}
  .banner-metric{
    display:flex;align-items:center;gap:12px;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.16);
    padding:12px 16px;border-radius:12px;
  }
  .banner-metric .dot{width:9px;height:9px;border-radius:50%;background:var(--sky);flex:none;}
  .banner-metric span{font-size:0.82rem;color:#dcedef;font-weight:600;min-width:0;}
  .banner-metric b{background:rgba(255,122,89,0.92);color:var(--on-accent);font-size:0.85rem;font-weight:800;padding:6px 12px;border-radius:8px;white-space:nowrap;flex:none;}
  @media (max-width:560px){
    .problem-banner{flex-direction:column;align-items:stretch;}
    .banner-metric{justify-content:space-between;flex-wrap:wrap;row-gap:8px;}
  }
  /* ============ COMPARISON ============ */
  .compare{background:var(--teal-deep);color:#fff;}
  .compare .section-head p{color:#bfdde1;}
  .compare .section-head h2{color:#fff;}
  .compare-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center;}
  @media (max-width:820px){ .compare-grid{grid-template-columns:1fr;} .compare-arrow{transform:rotate(90deg);margin-inline:auto;} }
  .compare-card{border-radius:var(--radius-lg);padding:30px 26px;}
  .compare-card.old{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.14);}
  .compare-card.new{background:#fff;color:var(--ink);box-shadow:var(--shadow);}
  .compare-title{
    display:inline-flex;padding:9px 16px;border-radius:999px;font-weight:700;font-size:0.88rem;margin-bottom:20px;
  }
  .compare-card.old .compare-title{background:rgba(255,255,255,0.12);color:#fff;}
  .compare-card.new .compare-title{background:var(--good);color:#fff;}
  .compare-card li{display:flex;align-items:flex-start;gap:12px;padding-block:10px;font-size:0.96rem;border-top:1px solid rgba(255,255,255,0.08);}
  .compare-card.new li{border-top:1px solid var(--border);}
  .compare-card li:first-child{border-top:0;}
  .compare-card svg{width:19px;height:19px;flex:none;margin-top:2px;}
  .compare-card.old svg{color:#8fa8ac;}
  .compare-card.new svg{color:var(--good);}
  .compare-arrow{width:44px;height:44px;border-radius:50%;background:var(--sky);display:flex;align-items:center;justify-content:center;flex:none;}
  .compare-arrow svg{width:20px;height:20px;color:var(--teal-deep);}

  /* ============ HOW IT WORKS ============ */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:8px;}
  @media (max-width:820px){ .steps{grid-template-columns:1fr;} }
  .step{position:relative;padding:28px 22px 24px;background:var(--surface);border:1px solid var(--border);border-top:3px solid var(--sky);border-radius:var(--radius-md);}
  .step-num{
    width:38px;height:38px;border-radius:50%;background:var(--sky);color:var(--teal-deep);
    display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:1.05rem;margin-bottom:16px;
  }
  .step h3{font-size:1.12rem;font-weight:600;margin-bottom:8px;}
  .step p{color:var(--ink-soft);font-size:0.92rem;line-height:1.6;}

  .preview-panel{
    margin-top:56px;display:grid;grid-template-columns:0.95fr 1.05fr;gap:0;
    background:var(--sky);border-radius:var(--radius-lg);overflow:hidden;color:var(--teal-deep);
  }
  @media (max-width:900px){ .preview-panel{grid-template-columns:1fr;} }
  .preview-copy{padding:44px 40px;display:flex;flex-direction:column;justify-content:center;gap:14px;}
  .preview-copy .eyebrow{color:var(--teal-deep);}
  .preview-copy .eyebrow::before{background:var(--teal-deep);}
  .preview-copy h3{color:var(--teal-deep);font-size:1.6rem;font-weight:600;}
  .preview-copy p{color:#0d3b45;font-size:0.98rem;line-height:1.65;}
  .preview-media{background:#032a32;display:flex;align-items:center;justify-content:center;padding:30px;}
  .preview-media img{border-radius:12px;max-height:320px;width:auto;object-fit:contain;}

  /* ============ FEATURES GRID ============ */
  .feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
  @media (max-width:940px){ .feat-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:560px){ .feat-grid{grid-template-columns:1fr;} }
  .feat-card{
    background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);
    padding:24px 20px;transition:box-shadow .15s ease, transform .15s ease;
  }
  .feat-card:hover{box-shadow:var(--shadow-sm);transform:translateY(-3px);border-color:var(--sky);}
  .feat-icon{
    width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;
    background:var(--sky-tint);color:var(--sky-ink);margin-bottom:16px;
  }
  .feat-icon svg{width:22px;height:22px;}
  .feat-card.accent .feat-icon{background:var(--orange-soft);color:var(--orange-dark);}
  .feat-card h3{font-size:1.04rem;font-weight:700;margin-bottom:6px;}
  .feat-card p{font-size:0.87rem;color:var(--ink-soft);line-height:1.55;}

  /* ============ BRAND / WHITE LABEL ============ */
  .brand-split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
  @media (max-width:900px){ .brand-split{grid-template-columns:1fr;} .brand-split .order-photo{order:-1;} }
  .brand-photo{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);position:relative;}
  .brand-photo img{width:100%;height:380px;object-fit:cover;}
  .brand-note{
    position:absolute;top:22px;right:22px;background:#fff;color:var(--ink);padding:12px 16px;border-radius:14px;
    font-family:var(--font-display);font-size:0.92rem;font-weight:600;box-shadow:var(--shadow-sm);max-width:200px;line-height:1.35;
  }
  .brand-list{display:flex;flex-direction:column;gap:16px;margin-top:24px;}
  .brand-list li{display:flex;gap:14px;align-items:flex-start;}
  .brand-list svg{width:22px;height:22px;color:var(--sky);flex:none;margin-top:2px;}
  .brand-list b{display:block;font-size:0.98rem;color:var(--ink);}
  .brand-list span{display:block;font-size:0.88rem;color:var(--ink-soft);margin-top:2px;}

  /* ============ DESTINATIONS ============ */
  .dest-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;}
  @media (max-width:900px){ .dest-grid{grid-template-columns:repeat(3,1fr);} }
  @media (max-width:520px){ .dest-grid{grid-template-columns:repeat(2,1fr);} }
  .dest-card{border-radius:var(--radius-md);overflow:hidden;background:var(--surface);border:1px solid var(--border);transition:border-color .15s ease;}
  .dest-card:hover{border-color:var(--sky);}
  .dest-card img{width:100%;height:110px;object-fit:cover;}
  .dest-card-label{padding:12px 12px 14px;}
  .dest-card-label b{display:block;font-size:0.86rem;font-weight:700;}
  .dest-card-label span{display:block;font-size:0.74rem;color:var(--ink-soft);margin-top:2px;}

  /* ============ RATES / CTA ============ */
  .rates-section{padding-block:72px;}
  .rates{
    position:relative;overflow:hidden;isolation:isolate;
    background:radial-gradient(90% 120% at 100% 0%, rgba(109,199,218,0.8) 0%, #0b5a6b 42%, var(--teal-deep) 100%);
    color:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow);
    padding:clamp(32px,5vw,60px);display:grid;grid-template-columns:1.1fr 0.9fr;gap:clamp(32px,5vw,64px);align-items:center;
  }
  /* decoración: brillo amarillo y arco entrecortado (mismo recurso visual que la sección del problema) */
  .rates::before{
    content:"";position:absolute;z-index:-1;width:420px;height:420px;right:-120px;bottom:-200px;border-radius:50%;
    background:radial-gradient(circle, rgba(255,122,89,0.28) 0%, rgba(255,122,89,0) 70%);
  }
  .rates::after{
    content:"";position:absolute;z-index:-1;width:560px;height:560px;left:-260px;top:-300px;border-radius:50%;
    border:2px dashed rgba(255,255,255,0.14);
  }
  @media (max-width:900px){ .rates{grid-template-columns:1fr;} }
  .rates .eyebrow{color:var(--sky);}
  .rates h2{color:#fff;font-size:clamp(1.7rem,3.2vw,2.5rem);font-weight:600;line-height:1.15;margin-top:12px;}
  .rates h2 em{font-style:normal;color:var(--orange);}
  .rates-copy>p{color:#d6ebee;margin-top:16px;font-size:1.04rem;line-height:1.65;max-width:52ch;}
  .rates-points{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:28px;}
  @media (max-width:560px){ .rates-points{grid-template-columns:1fr;} }
  .rates-points li{
    background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.14);border-radius:var(--radius-sm);
    padding:14px 14px 16px;
  }
  .rates-points svg{width:22px;height:22px;color:var(--sky);display:block;margin-bottom:8px;}
  .rates-points b{display:block;font-family:var(--font-display);font-size:0.92rem;font-weight:600;color:#fff;}
  .rates-points span{display:block;font-size:0.8rem;color:#bcdade;margin-top:2px;line-height:1.45;}
  .rates-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:32px;}
  .rates-note{display:flex;align-items:center;gap:8px;font-size:0.82rem;color:#bcdade;}
  .rates-note svg{width:16px;height:16px;color:var(--sky);flex:none;}

  /* tarjeta de ejemplo: tarifa pública vs tarifa B2B */
  .rate-card{
    background:var(--surface);color:var(--ink);border-radius:var(--radius-md);padding:24px;
    box-shadow:0 30px 60px -25px rgba(0,0,0,0.55);rotate:1.5deg;transition:rotate .3s ease;
  }
  .rate-card:hover{rotate:0deg;}
  .rate-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px dashed var(--border-strong);}
  .rate-card-head b{font-family:var(--font-display);font-weight:600;font-size:1rem;}
  .rate-card-head small{display:block;color:var(--ink-soft);font-size:0.78rem;margin-top:2px;}
  .rate-tag{flex:none;background:var(--sky-tint);color:var(--sky-ink);font-size:0.7rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;padding:5px 10px;border-radius:999px;}
  .rate-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-block:14px;border-bottom:1px solid var(--border);font-size:0.9rem;color:var(--ink-soft);}
  .rate-row s{color:var(--ink-soft);font-variant-numeric:tabular-nums;}
  .rate-row strong{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--sky-text);font-variant-numeric:tabular-nums;}
  .rate-gain{
    display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;
    background:var(--orange-soft);border-radius:var(--radius-sm);padding:14px 16px;
  }
  .rate-gain span{font-size:0.86rem;font-weight:700;color:#8a2e17;}
  .rate-gain b{font-family:var(--font-display);font-size:1.2rem;font-weight:700;color:#8a2e17;font-variant-numeric:tabular-nums;}
  .rate-foot{margin-top:12px;font-size:0.72rem;color:var(--ink-soft);text-align:center;}

  /* ============ FAQ ============ */
  /* Ancho completo del contenedor en escritorio, fluido en pantallas pequeñas (sin desbordes) */
  .faq-section .section-head{max-width:1080px;}
  .faq-list{display:flex;flex-direction:column;gap:12px;width:100%;max-width:1080px;min-width:0;}
  .faq-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;min-width:0;}
  .faq-q{
    width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;
    background:transparent;border:0;padding:20px 22px;text-align:left;font-weight:700;font-size:1rem;color:var(--ink);
    cursor:pointer;min-height:44px;overflow-wrap:anywhere;-webkit-tap-highlight-color:transparent;
  }
  .faq-q:focus-visible{outline:2px solid var(--sky);outline-offset:-2px;border-radius:var(--radius-md);}
  .faq-q svg{width:20px;height:20px;color:var(--sky);flex:none;transition:transform .2s ease;}
  .faq-item[open]{border-color:var(--sky);}
  .faq-item[open] .faq-q svg{transform:rotate(45deg);}
  .faq-a{padding:0 22px 20px;color:var(--ink-soft);font-size:0.94rem;line-height:1.65;overflow-wrap:anywhere;}
  .faq-item summary{list-style:none;}
  .faq-item summary::-webkit-details-marker{display:none;}
  @media (max-width:560px){
    .faq-section .section-head{margin-bottom:28px;}
    .faq-list{gap:10px;}
    .faq-q{padding:16px;gap:12px;font-size:0.95rem;line-height:1.4;}
    .faq-a{padding:0 16px 16px;font-size:0.9rem;}
  }

  /* ============ REGISTRATION ============ */
  .font-hand{font-family:"Caveat", "Segoe Print", cursive;font-weight:600;}
  .reg-section{background:linear-gradient(180deg, var(--bg) 0%, var(--surface-2) 100%);}
  .reg-panel{
    display:grid;grid-template-columns:0.85fr 1.15fr;gap:0;background:var(--surface);border-radius:var(--radius-lg);
    overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--border);
  }
  @media (max-width:900px){ .reg-panel{grid-template-columns:1fr;} }
  .reg-photo{position:relative;min-height:340px;}
  .reg-photo img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;}
  .reg-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0) 40%, rgba(5,61,73,0.25) 100%);}
  .reg-photo-inner{position:relative;z-index:1;height:100%;padding:28px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;}
  .reg-hand{color:var(--teal-deep);font-size:clamp(1.6rem,2.6vw,2.1rem);line-height:1.05;transform:rotate(-6deg);max-width:11ch;margin:6px 0 0 8px;}
  .reg-hand svg{display:block;width:54px;height:40px;margin:6px 0 0 60px;color:var(--teal-deep);}
  .reg-chips{display:flex;flex-direction:column;gap:10px;align-items:flex-start;}
  .reg-chip{
    display:flex;align-items:center;gap:12px;background:rgba(255,255,255,0.94);color:var(--teal-deep);
    padding:10px 20px 10px 10px;border-radius:16px;font-size:0.92rem;font-weight:700;box-shadow:var(--shadow-sm);
  }
  .reg-chip i{width:38px;height:38px;border-radius:50%;background:var(--sky-tint);display:flex;align-items:center;justify-content:center;flex:none;}
  .reg-chip svg{width:19px;height:19px;color:var(--teal);}
  .reg-form{padding:clamp(26px,4vw,44px);}
  .reg-form h3{font-size:clamp(1.4rem,2.4vw,1.75rem);font-weight:700;color:var(--teal-deep);margin-top:8px;line-height:1.2;}
  .reg-form>p{color:var(--ink-soft);margin-top:8px;font-size:0.95rem;}
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 16px;margin-top:26px;}
  @media (max-width:560px){ .form-grid{grid-template-columns:1fr;} }
  .field{display:flex;flex-direction:column;gap:6px;min-width:0;}
  .field.full{grid-column:1/-1;}
  .field label{font-size:0.82rem;font-weight:700;color:var(--ink);}
  .field label .req{color:var(--bad);}
  .field .opt{font-weight:500;color:var(--ink-soft);}
  .field input, .field select{
    width:100%;padding:12px 14px;border-radius:var(--radius-sm);border:1.5px solid var(--border-strong);
    background:var(--bg);color:var(--ink);font-size:0.94rem;transition:border-color .15s ease, box-shadow .15s ease;
  }
  .field select{appearance:none;padding-right:40px;cursor:pointer;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%236dc7da' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 14px center;}
  .field select:invalid{color:#8aa0a6;}
  .field input::placeholder{color:#8aa0a6;}
  .field input:focus, .field select:focus{outline:none;border-color:var(--sky);box-shadow:0 0 0 3px var(--sky-soft);}
  .field-error{font-size:0.76rem;color:var(--bad);font-weight:600;min-height:0;}
  .field-error:empty{display:none;}
  /* Selector de país con banderas (intl-tel-input) */
  .field .iti{width:100%;}
  .iti{--iti-border-color:var(--border-strong);--iti-dropdown-bg:var(--surface);--iti-hover-color:var(--teal-light);--iti-dialcode-color:var(--ink-soft);}
  .iti__dropdown-content{border-radius:var(--radius-sm);box-shadow:var(--shadow);color:var(--ink);}
  .iti__search-input{padding:10px 12px;border:0;border-bottom:1px solid var(--border);background:var(--surface);color:var(--ink);font-size:0.9rem;}
  .captcha-box{margin-top:20px;min-height:65px;}
  .captcha-altcha{min-height:0;}
  .captcha-altcha altcha-widget{display:block;max-width:100%;--altcha-max-width:100%;--altcha-border-radius:12px;--altcha-color-active:var(--teal);}
  .form-check{display:flex;align-items:flex-start;gap:10px;margin-top:16px;font-size:0.82rem;color:var(--ink-soft);}
  .form-check input{margin-top:3px;accent-color:var(--teal);}
  .form-check a{color:var(--sky-text);font-weight:700;text-decoration-color:var(--sky);text-underline-offset:3px;}
  .reg-form .btn{margin-top:20px;}
  .form-note{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px;font-size:0.8rem;color:var(--ink-soft);text-align:center;}
  .form-note svg{width:15px;height:15px;color:var(--teal);flex:none;}
  .form-status{margin-top:12px;font-size:0.86rem;font-weight:600;text-align:center;}
  .form-status.ok{color:var(--good);}
  .form-status.err{color:var(--bad);}
  /* franja de confianza debajo del formulario */
  .reg-trust{
    display:grid;grid-template-columns:repeat(4,1fr);margin-top:24px;background:var(--surface);
    border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);
  }
  @media (max-width:820px){ .reg-trust{grid-template-columns:repeat(2,1fr);} }
  .reg-trust span{display:flex;align-items:center;justify-content:center;gap:10px;padding:18px 14px;font-size:0.84rem;font-weight:600;color:var(--ink);text-align:left;}
  .reg-trust span+span{border-left:1px solid var(--border);}
  @media (max-width:820px){ .reg-trust span:nth-child(3){border-left:0;} .reg-trust span:nth-child(n+3){border-top:1px solid var(--border);} }
  .reg-trust svg{width:26px;height:26px;color:var(--sky);flex:none;}

  /* ============ FINAL CTA ============ */
  .final-cta{
    position:relative;overflow:hidden;color:#fff;padding-block:64px;
    background:radial-gradient(80% 140% at 95% 10%, rgba(109,199,218,0.7) 0%, #0b5a6b 38%, var(--teal-deep) 100%);
  }
  .final-grid{display:grid;grid-template-columns:1fr 0.95fr 1.1fr;gap:clamp(28px,4vw,48px);align-items:center;}
  @media (max-width:1080px){ .final-grid{grid-template-columns:1fr 1fr;} .final-visual{grid-column:1/-1;max-width:560px;margin-inline:auto;width:100%;} }
  @media (max-width:680px){ .final-grid{grid-template-columns:1fr;} }
  .final-kicker{display:flex;align-items:center;gap:14px;font-size:1.05rem;color:#d6ebee;font-weight:500;}
  .final-kicker svg{width:34px;height:34px;color:#fff;flex:none;}
  .final-cta h2{color:#fff;font-size:clamp(1.6rem,2.8vw,2.2rem);font-weight:700;line-height:1.18;margin-top:10px;}
  .final-cta p{color:#d6ebee;margin-top:14px;font-size:1rem;line-height:1.6;}
  .final-checks{display:flex;flex-direction:column;gap:12px;}
  .final-checks li{display:flex;gap:12px;align-items:center;font-size:0.96rem;color:#eef7f8;}
  .final-checks svg{width:22px;height:22px;flex:none;}
  .final-cta .btn{margin-top:24px;}
  /* mockup: laptop + celular con la plataforma */
  .final-visual{position:relative;padding:40px 0 10px;}
  .final-hand{position:absolute;top:-6px;right:0;z-index:3;color:#fff;font-size:1.5rem;line-height:1;text-align:center;transform:rotate(-8deg);}
  .final-hand svg{display:block;width:40px;height:44px;margin:4px 0 0 34px;color:#fff;}
  .device-laptop{position:relative;width:86%;}
  .device-laptop .screen{background:#0b1418;border-radius:12px 12px 0 0;padding:8px 8px 10px;box-shadow:0 30px 60px -25px rgba(0,0,0,0.6);}
  .device-laptop .screen img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:left top;border-radius:4px;}
  .device-laptop .base{height:14px;margin-inline:-6%;background:linear-gradient(#d9e1e3,#9aa7ab);border-radius:0 0 14px 14px;}
  .device-laptop .base::before{content:"";display:block;width:18%;height:6px;margin:0 auto;background:#7d8b8f;border-radius:0 0 8px 8px;}
  .device-phone{
    position:absolute;right:0;bottom:0;width:26%;z-index:2;background:#0b1418;border-radius:18px;padding:6px;
    box-shadow:0 24px 40px -18px rgba(0,0,0,0.65);
  }
  .device-phone img{width:100%;aspect-ratio:9/18;object-fit:cover;object-position:6% top;border-radius:13px;}

  /* ============ FOOTER ============ */
  footer.site{background:var(--surface);color:var(--ink-soft);}
  .footer-main{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(24px,4vw,48px);align-items:center;padding-block:36px;}
  @media (max-width:980px){ .footer-main{grid-template-columns:1fr;text-align:center;justify-items:center;} }
  .footer-logo img{height:84px;width:auto;}
  .footer-about{padding-left:clamp(24px,4vw,48px);border-left:2px solid var(--border);}
  @media (max-width:980px){ .footer-about{padding-left:0;border-left:0;} }
  .footer-about h4{font-family:var(--font-display);font-size:1.05rem;font-weight:600;color:var(--sky-text);}
  .footer-about p{margin-top:6px;font-size:0.9rem;line-height:1.6;color:var(--sky-text);max-width:48ch;}
  .footer-badges{display:grid;grid-template-columns:repeat(4,minmax(96px,auto));padding-left:clamp(24px,4vw,48px);border-left:2px solid var(--border);}
  @media (max-width:980px){ .footer-badges{padding-left:0;border-left:0;} }
  @media (max-width:520px){ .footer-badges{grid-template-columns:repeat(2,1fr);row-gap:18px;width:100%;} }
  .footer-badges span{display:flex;flex-direction:column;align-items:center;gap:8px;padding-inline:14px;font-size:0.8rem;color:var(--sky-text);font-weight:600;text-align:center;line-height:1.3;}
  .footer-badges span+span{border-left:1px solid var(--border);}
  @media (max-width:520px){ .footer-badges span:nth-child(3){border-left:0;} }
  .footer-badges svg{width:30px;height:30px;color:var(--sky);}
  .footer-bar{background:var(--teal-deep);color:#cfe6e9;border-top:3px solid var(--sky);}
  .footer-bottom{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center;padding-block:20px;font-size:0.84rem;}
  .footer-bottom nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px 0;}
  .footer-bottom a{color:#e7f4f5;text-decoration:none;padding-inline:16px;}
  .footer-bottom a+a{border-left:1px solid rgba(255,255,255,0.3);}
  .footer-bottom a:last-child{padding-right:0;}
  .footer-bottom a:hover{color:var(--sky);}
  @media (max-width:560px){ .footer-bottom{justify-content:center;text-align:center;} .footer-bottom a:first-child{padding-left:0;} }
