/* =========================================================
   Go Explore Club — estilos
   Editorial moderno · azul marca · motion con propósito
   ========================================================= */
:root{
  --navy:#0C2A4D; --navy-2:#0f335e; --navy-soft:#123a66;
  --blue:#1E6FD9; --blue-bright:#0EA5E9; --blue-ink:#0c4a6e;
  --teal:#17A6A6; --lime:#8DC63F; --gold:#E0A64E; --gold-d:#B7852E;
  --bg:#eef5ff; --bg-2:#f7fbff; --surface:#ffffff;
  --ink:#0C2A4D; --muted:#5b7089; --line:#dbe6f5;
  --shadow-s:0 2px 10px rgba(12,42,77,.06);
  --shadow-m:0 14px 40px rgba(12,42,77,.12);
  --shadow-l:0 30px 70px rgba(12,42,77,.20);
  --r:18px; --r-lg:26px;
  --head:'Fraunces',Georgia,serif;
  --body:'Plus Jakarta Sans',system-ui,sans-serif;
  --maxw:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:var(--body); color:var(--ink);
  background:var(--bg-2); line-height:1.6; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit}
img{max-width:100%; display:block}
h1,h2,h3,h4{font-family:var(--head); font-weight:600; line-height:1.08; margin:0}
em{font-style:italic; color:var(--blue)}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px}

/* ---------- botones ---------- */
.btn{
  --bg:var(--blue); --fg:#fff;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--body); font-weight:700; font-size:16px; cursor:pointer;
  padding:14px 26px; border-radius:999px; border:2px solid transparent;
  background:var(--bg); color:var(--fg); text-decoration:none;
  transition:transform .15s ease, box-shadow .2s ease, background .2s; min-height:50px; touch-action:manipulation;
}
.btn:active{transform:translateY(1px) scale(.99)}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--blue-bright)); color:#fff; box-shadow:0 10px 26px rgba(30,111,217,.35)}
.btn-primary:hover{box-shadow:0 16px 40px rgba(30,111,217,.5); transform:translateY(-2px)}
.btn-ghost{background:transparent; border-color:rgba(255,255,255,.5); color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.btn-sm{padding:10px 20px; font-size:15px; min-height:42px}
.btn-block{width:100%}
.section .btn-ghost{border-color:var(--line); color:var(--navy)}
.section .btn-ghost:hover{background:var(--bg)}

/* ---------- NAV ---------- */
.nav{position:sticky; top:0; z-index:60; background:rgba(247,251,255,.82); backdrop-filter:blur(12px); border-bottom:1px solid transparent; transition:border-color .3s, box-shadow .3s, background .3s}
.nav.scrolled{border-color:var(--line); box-shadow:var(--shadow-s)}
.nav-in{max-width:var(--maxw); margin:0 auto; padding:0 22px; display:flex; align-items:center; gap:20px}
/* badge del logo: bloque azul redondeado que sobresale del header (profundidad + legibilidad) */
.brand{display:inline-flex; align-items:center; justify-content:center; padding:2px 22px; border-radius:0 0 20px 20px; text-decoration:none;
  background:linear-gradient(145deg,#0b2543 0%,#123a66 46%,#1f74de 100%);
  box-shadow:0 16px 30px -10px rgba(12,42,77,.55), 0 4px 10px rgba(12,42,77,.22), inset 0 1px 0 rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.14); position:relative; overflow:hidden; touch-action:manipulation;
  margin:0 0 -24px; will-change:transform;
  transition:transform .28s cubic-bezier(.2,.7,.2,1), box-shadow .28s ease}
.brand:hover{transform:scale(1.04); box-shadow:0 24px 46px -10px rgba(31,116,222,.6), inset 0 1px 0 rgba(255,255,255,.28)}
.brand::before{content:""; position:absolute; left:-40%; top:0; width:32%; height:100%; pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.34),transparent); transform:skewX(-18deg); animation:brandshine 7s ease-in-out infinite}
.brand::after{content:""; position:absolute; left:14px; right:14px; bottom:6px; height:2px; border-radius:2px;
  background:linear-gradient(90deg,transparent,var(--lime),var(--teal),transparent); opacity:.9}
@keyframes brandshine{0%,72%{left:-40%}87%{left:120%}100%{left:120%}}
.brand-logo{height:90px; width:auto; position:relative; z-index:1}
.nav-links{display:flex; gap:26px; margin-left:auto}
.nav-links a{text-decoration:none; font-weight:600; font-size:15px; color:var(--navy); position:relative; padding:4px 0}
.nav-links a::after{content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--blue); transition:width .25s}
.nav-links a:hover::after{width:100%}
.nav-cta{margin-left:8px}
.nav-burger{display:none; margin-left:auto; background:none; border:none; cursor:pointer; padding:8px; width:44px; height:44px}
.nav-burger span{display:block; width:24px; height:2.5px; background:var(--navy); border-radius:2px; margin:5px auto; transition:.3s}
.nav-burger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

/* ---------- HERO ---------- */
.hero{position:relative; overflow:hidden; color:#fff; background:linear-gradient(160deg,#0b2444 0%, #103a72 45%, #12508f 100%)}
.hero-bg{position:absolute; inset:0; z-index:0}
.orb{position:absolute; border-radius:50%; filter:blur(60px); opacity:.5}
.orb-1{width:460px; height:460px; background:#1E6FD9; top:-120px; right:-80px}
.orb-2{width:380px; height:380px; background:#17A6A6; bottom:-120px; left:-80px; opacity:.4}
.orb-3{width:300px; height:300px; background:#8DC63F; top:40%; left:40%; opacity:.18}
.route{position:absolute; inset:0; width:100%; height:100%}
#routePath{stroke-dasharray:1400; stroke-dashoffset:1400; animation:draw 3.5s ease forwards .4s}
@keyframes draw{to{stroke-dashoffset:0}}
.hero-in{position:relative; z-index:2; max-width:var(--maxw); margin:0 auto; padding:64px 22px 96px;
  display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:center; min-height:82vh}
.eyebrow{display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:#cfe6ff; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); padding:7px 14px; border-radius:999px}
.eyebrow .dot{width:8px; height:8px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 4px rgba(141,198,63,.25)}
.hero-title{font-size:clamp(38px,6.4vw,72px); font-weight:700; margin:18px 0 16px; letter-spacing:-.01em}
.hero-title em{color:var(--lime); font-style:italic}
.hero-lead{font-size:clamp(17px,2vw,20px); color:#dbeaff; max-width:52ch; margin:0 0 28px}
.hero-lead strong{color:#fff}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap}
.hero-stats{display:flex; gap:28px; margin-top:38px; flex-wrap:wrap}
.hero-stats .st{display:flex; flex-direction:column}
.hero-stats .st b{font-family:var(--head); font-size:30px; font-weight:700; color:#fff; font-variant-numeric:tabular-nums}
.hero-stats .st span{font-size:13.5px; color:#a9c6e8}

/* tarjetas flotantes del hero */
.hero-cards{position:relative; height:420px}
.fcard{position:absolute; background:rgba(255,255,255,.96); color:var(--navy); border-radius:18px; padding:16px 18px; width:210px; box-shadow:var(--shadow-l); backdrop-filter:blur(4px)}
.fcard b{display:block; font-family:var(--head); font-size:22px; margin-top:8px}
.fcard small{color:var(--muted); font-weight:600}
.fcard-tag{font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:var(--blue); background:#e8f1ff; padding:3px 9px; border-radius:999px}
.fcard-tag.gold{color:var(--gold-d); background:#fbf1dd}
.fcard-1{top:10px; left:0; animation:float1 6s ease-in-out infinite}
.fcard-2{top:150px; right:0; animation:float2 7s ease-in-out infinite}
.fcard-3{bottom:6px; left:36px; animation:float1 6.5s ease-in-out infinite .5s}
.hero-plane{position:absolute; top:96px; right:64px; font-size:34px; color:#fff; filter:drop-shadow(0 6px 12px rgba(0,0,0,.25)); animation:float2 5s ease-in-out infinite; transform:rotate(8deg)}
@keyframes float1{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes float2{0%,100%{transform:translateY(0) rotate(8deg)}50%{transform:translateY(-18px) rotate(4deg)}}

.scroll-hint{position:absolute; bottom:18px; left:50%; transform:translateX(-50%); width:26px; height:42px; border:2px solid rgba(255,255,255,.5); border-radius:14px; z-index:2}
.scroll-hint span{position:absolute; top:8px; left:50%; transform:translateX(-50%); width:4px; height:8px; background:#fff; border-radius:2px; animation:scrolldot 1.6s infinite}
@keyframes scrolldot{0%{opacity:0; top:8px}30%{opacity:1}60%{opacity:1; top:22px}100%{opacity:0; top:22px}}

/* ---------- TRUST ---------- */
.trust{background:var(--navy); color:#fff}
.trust-in{max-width:var(--maxw); margin:0 auto; padding:26px 22px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px}
.trust-item{display:flex; flex-direction:column; min-width:140px}
.trust-item b{font-family:var(--head); font-size:20px; color:var(--lime)}
.trust-item span{font-size:13.5px; color:#b9cbe4}

/* ---------- SECTION base ---------- */
.section{padding:88px 0}
.section-alt{background:var(--bg)}
.section-navy{background:linear-gradient(160deg,#0b2444,#123a66); color:#fff}
.head{max-width:720px; margin:0 auto 46px; text-align:center}
.kicker{display:inline-block; font-weight:800; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--blue); margin-bottom:12px}
.kicker.light{color:var(--lime)}
.head h2{font-size:clamp(28px,4.4vw,44px); letter-spacing:-.01em}
/* subrayado que se dibuja al revelar el título (solo transform, compositor-friendly) */
.head h2 em{position:relative; font-style:italic}
.head h2 em::after{content:""; position:absolute; left:0; right:0; bottom:-.12em; height:.09em; min-height:3px; border-radius:3px;
  background:linear-gradient(90deg,var(--lime),var(--teal)); transform:scaleX(0); transform-origin:left;
  transition:transform .75s cubic-bezier(.2,.7,.2,1) .25s}
.head.light h2 em::after{background:linear-gradient(90deg,var(--lime),var(--blue-bright))}
.head.reveal.in h2 em::after{transform:scaleX(1)}
.head.light h2, .section-navy .head h2{color:#fff}
.head-sub{color:var(--muted); font-size:17px; margin:14px 0 0}
.section-navy .head-sub{color:#bcd2ee}
.head-sub a{color:var(--blue); font-weight:700; text-decoration:none}

/* ---------- PASOS ---------- */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.step{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:30px; box-shadow:var(--shadow-s); position:relative; overflow:hidden}
.step::before{content:""; position:absolute; inset:0 auto auto 0; width:100%; height:5px; background:linear-gradient(90deg,var(--lime),var(--teal),var(--blue))}
.step-n{font-family:var(--head); font-size:44px; font-weight:700; color:var(--line)}
.step h3{font-size:22px; margin:6px 0 10px}
.step p{color:var(--muted); margin:0}

/* ---------- DESTINOS ---------- */
.filters{display:flex; justify-content:center; gap:10px; margin:0 0 32px; flex-wrap:wrap}
.chip{font-family:var(--body); font-weight:700; font-size:14.5px; padding:10px 20px; border-radius:999px; border:1.5px solid var(--line); background:#fff; color:var(--muted); cursor:pointer; transition:.18s; min-height:44px}
.chip:hover{border-color:var(--blue); color:var(--blue)}
.chip.is-active{background:var(--navy); color:#fff; border-color:var(--navy)}
.dgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.dcard{position:relative; border-radius:var(--r-lg); overflow:hidden; min-height:340px; display:flex; flex-direction:column; justify-content:flex-end; color:#fff; box-shadow:var(--shadow-s); border:1px solid rgba(12,42,77,.06); isolation:isolate; transition:transform .25s ease, box-shadow .25s ease}
.dcard:hover{transform:translateY(-6px); box-shadow:var(--shadow-m)}
.dcard-bg{position:absolute; inset:0; z-index:-2; overflow:hidden}
.dcard-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; transition:transform .5s ease}
.dcard:hover .dcard-img{transform:scale(1.06)}
.dcard-bg::after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(6,20,40,.30) 0%, rgba(6,20,40,0) 32%, rgba(6,20,40,.55) 62%, rgba(6,20,40,.9) 100%)}
.dcard-pat{position:absolute; inset:0; z-index:-1; opacity:.22; background-image:radial-gradient(circle at 30% 20%, #fff 1px, transparent 1.4px); background-size:26px 26px; mask-image:linear-gradient(180deg,#000,transparent 70%)}
.dcard-top{position:absolute; top:14px; left:14px; right:14px; display:flex; justify-content:space-between; align-items:flex-start; z-index:1}
.dcard-tag{font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; background:rgba(255,255,255,.92); color:var(--navy); padding:5px 10px; border-radius:999px}
.dcard-tag.gold{background:var(--gold); color:#3a2a08}
.dcard-fav{background:rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.35); color:#fff; border-radius:999px; padding:5px 10px; font-size:12px; font-weight:700}
.dcard-body{padding:20px; z-index:1}
.dcard-noches{font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:#dfeaff; opacity:.9}
.dcard h3{font-size:30px; margin:2px 0 2px; color:#fff}
.dcard-pais{font-size:14px; color:#cfe0f5; margin-bottom:14px}
.dcard-inc{display:flex; gap:8px; margin-bottom:16px}
.dcard-inc svg{width:18px; height:18px; stroke:#eaf3ff; fill:none; stroke-width:1.8; opacity:.9}
.dcard-price{display:flex; align-items:flex-end; justify-content:space-between; gap:10px}
.dcard-price .p{font-family:var(--head)}
.dcard-price .p b{font-size:30px; font-weight:700}
.dcard-price .p small{display:block; font-size:12px; color:#cfe0f5; font-family:var(--body); font-weight:600}
.dcard-price .pen{font-size:13px; color:#cfe0f5}
.dcard-cta{position:absolute; inset:0; z-index:2; background:transparent; border:none; cursor:pointer}
.dcard .go{position:absolute; right:18px; bottom:20px; z-index:3; width:44px; height:44px; border-radius:50%; background:#fff; color:var(--navy); display:grid; place-items:center; box-shadow:var(--shadow-m); transform:translateY(6px) scale(.9); opacity:0; transition:.25s; pointer-events:none; font-size:20px}
.dcard:hover .go{transform:translateY(0) scale(1); opacity:1}
.destinos-foot{text-align:center; margin-top:38px}
.destinos-foot p{color:var(--muted); margin:0 0 14px; font-weight:600}

/* ---------- INCLUYE ---------- */
.inc-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:16px}
.inc{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:22px 14px; text-align:center; box-shadow:var(--shadow-s); transition:transform .2s}
.inc:hover{transform:translateY(-4px)}
.inc-ic{width:52px; height:52px; margin:0 auto 12px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg,#e8f6f6,#e8f1ff)}
.inc-ic svg{width:26px; height:26px; stroke:var(--teal); fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round}
.inc b{font-size:14.5px}

/* ---------- MEMBRESÍA ---------- */
.tiers{display:grid; grid-template-columns:repeat(2,1fr); gap:24px; max-width:900px; margin:0 auto}
.tier{background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.14); border-radius:var(--r-lg); padding:32px; position:relative; backdrop-filter:blur(4px)}
.tier.pop{background:#fff; color:var(--navy); border-color:var(--gold); box-shadow:0 30px 70px rgba(0,0,0,.35); transform:translateY(-6px)}
.tier-badge{position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--gold); color:#3a2a08; font-weight:800; font-size:12px; letter-spacing:.04em; text-transform:uppercase; padding:6px 16px; border-radius:999px}
.tier-name{display:flex; align-items:center; gap:10px; font-family:var(--head); font-size:26px; font-weight:700}
.tier-dot{width:12px; height:12px; border-radius:50%}
.tier-sub{opacity:.8; margin:4px 0 16px; font-size:14.5px}
.tier .price{font-family:var(--head); font-size:26px; font-weight:700; margin-bottom:20px}
.tier.pop .price{color:var(--gold-d)}
.tier ul{list-style:none; margin:0 0 24px; padding:0; display:flex; flex-direction:column; gap:11px}
.tier li{display:flex; gap:10px; font-size:14.5px; align-items:flex-start}
.tier li.head{font-weight:800}
.tier li .ck{flex:none; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:12px; margin-top:1px}
.tier li .ck.y{background:rgba(141,198,63,.22); color:#9be04f}
.tier.pop li .ck.y{background:#e9f7d7; color:#4e7a1e}
.tier li .ck.n{background:rgba(255,255,255,.08); color:#7f97b6}
.tier.pop li .ck.n{background:#eef2f7; color:#9fb0c4}
.tier li.off{opacity:.55}
.tiers-note{text-align:center; color:#a9c1e0; font-size:13px; margin-top:24px; max-width:560px; margin-inline:auto}

/* ---------- TESTIMONIOS ---------- */
.tst-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.tst{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:24px; box-shadow:var(--shadow-s)}
.tst-stars{color:var(--gold); letter-spacing:2px; margin-bottom:10px}
.tst-txt{font-size:15px; color:var(--navy); margin:0 0 16px}
.tst-who{display:flex; align-items:center; gap:12px}
.tst-av{width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--teal),var(--blue)); color:#fff; display:grid; place-items:center; font-weight:800; font-family:var(--head)}
.tst-who b{display:block; font-size:14px}
.tst-who span{font-size:12.5px; color:var(--muted)}
.marquee{margin-top:40px; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex; gap:14px; width:max-content; animation:scrollx 26s linear infinite}
.marquee .m{white-space:nowrap; font-weight:700; color:var(--muted); background:#fff; border:1px solid var(--line); border-radius:999px; padding:10px 20px}
@keyframes scrollx{to{transform:translateX(-50%)}}

/* ---------- NOSOTROS ---------- */
.nos{display:grid; grid-template-columns:1.1fr .9fr; gap:44px; align-items:center}
.nos-copy p{color:var(--muted); font-size:16.5px}
.nos-copy h2{font-size:clamp(28px,4vw,40px); margin:10px 0 16px}
.nos-list{list-style:none; padding:0; margin:18px 0; display:flex; flex-direction:column; gap:10px}
.nos-list li{padding-left:28px; position:relative; font-weight:600}
.nos-list li::before{content:"✓"; position:absolute; left:0; color:#fff; background:var(--lime); width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:12px; top:3px}
.nos-addr{margin-top:18px; color:var(--navy); font-weight:600}
.nos-card{background:linear-gradient(160deg,var(--navy),#123a66); color:#fff; border-radius:var(--r-lg); padding:38px; box-shadow:var(--shadow-l); position:relative}
.nos-badge{display:inline-block; background:var(--lime); color:#12340a; font-weight:800; font-size:12px; letter-spacing:.05em; padding:6px 14px; border-radius:999px}
.nos-quote{font-family:var(--head); font-size:26px; font-weight:600; margin:20px 0 26px; line-height:1.25}
.nos-mini{display:flex; gap:24px}
.nos-mini b{font-family:var(--head); font-size:30px; display:block; color:var(--lime); font-variant-numeric:tabular-nums}
.nos-mini span{font-size:13px; color:#bcd2ee}

/* ---------- EQUIPO ---------- */
.team{display:grid; grid-template-columns:repeat(4,1fr); gap:22px}
.tm{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-s); transition:transform .22s ease, box-shadow .22s ease; position:relative}
.tm::before{content:""; position:absolute; top:0; left:0; right:0; height:5px; z-index:2; background:linear-gradient(90deg,var(--lime),var(--teal),var(--blue))}
.tm:hover{transform:translateY(-6px); box-shadow:var(--shadow-m)}
.tm-photo{position:relative; aspect-ratio:4/5; background:linear-gradient(165deg,#123a66,#0c2a4d); display:grid; place-items:center; overflow:hidden}
.tm-ini{font-family:var(--head); font-weight:700; font-size:52px; color:rgba(255,255,255,.85); letter-spacing:1px}
.tm-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top center; z-index:1}
.tm-photo::after{content:""; position:absolute; inset:0; z-index:2; background:linear-gradient(180deg,rgba(12,42,77,0) 55%, rgba(12,42,77,.35) 100%); pointer-events:none}
.tm-info{padding:18px 18px 20px}
.tm-info h3{font-size:18.5px; line-height:1.15}
.tm-rol{display:inline-block; color:var(--blue); font-weight:700; font-size:13px; margin-top:4px}
.tm-wsp{margin-top:14px; display:inline-flex; align-items:center; gap:7px; font-family:var(--body); font-weight:700; font-size:13.5px; color:var(--navy); background:var(--bg); border:1.5px solid var(--line); border-radius:999px; padding:9px 16px; cursor:pointer; transition:.18s; min-height:40px}
.tm-wsp:hover{border-color:#25D366; color:#128C4B; background:#eafaf0}
.tm-wsp svg{color:#25D366}

/* ---------- FEED ---------- */
.feed{display:grid; grid-template-columns:repeat(6,1fr); gap:12px}
.feed a{aspect-ratio:1; border-radius:16px; overflow:hidden; position:relative; display:flex; align-items:flex-end; padding:12px; color:#fff; text-decoration:none; box-shadow:var(--shadow-s); transition:transform .2s}
.feed a:hover{transform:scale(1.03)}
.feed-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; transition:transform .4s ease}
.feed a:hover .feed-img{transform:scale(1.08)}
.feed a::after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.55))}
.feed a b{position:relative; z-index:1; font-family:var(--head); font-size:16px; line-height:1.1}
.feed a .ig{position:absolute; top:10px; right:10px; z-index:1; opacity:.9}
.feed-foot{text-align:center; margin-top:30px}

/* ---------- CTA ---------- */
.cta{background:linear-gradient(135deg,#0b2444,#12508f); color:#fff}
.cta-in{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center}
.cta-copy h2{font-size:clamp(28px,4vw,42px); color:#fff; margin:10px 0 12px}
.cta-copy p{color:#cfe0f5; font-size:17px}
.cta-contacts{display:flex; flex-direction:column; gap:8px; margin-top:18px}
.cta-contacts a{color:#fff; font-weight:700; text-decoration:none; width:max-content; border-bottom:1px solid rgba(255,255,255,.35); cursor:pointer}
.cta-form{background:#fff; color:var(--navy); border-radius:var(--r-lg); padding:28px; box-shadow:var(--shadow-l)}
.field{margin-bottom:16px}
.field label{display:block; font-weight:700; font-size:13.5px; margin-bottom:6px}
.field input{width:100%; height:50px; border:1.5px solid var(--line); border-radius:12px; padding:0 14px; font-family:var(--body); font-size:16px; color:var(--navy); background:var(--bg-2); transition:.15s}
.field input:focus{outline:none; border-color:var(--blue); background:#fff; box-shadow:0 0 0 4px rgba(30,111,217,.14)}
.field input.err{border-color:#dc2626; box-shadow:0 0 0 4px rgba(220,38,38,.12)}
.form-hint{font-size:12.5px; color:var(--muted); text-align:center; margin:12px 0 0}
.form-hint a{color:var(--blue)}

/* ---------- FOOTER ---------- */
.footer{background:var(--navy); color:#c6d6ec}
.foot-grid{display:grid; grid-template-columns:1.6fr 1fr 1.4fr 1.2fr; gap:34px; padding:60px 22px 30px}
.foot-logo{height:54px; width:auto}
.foot-brand p{margin:16px 0; font-size:14.5px; max-width:34ch}
.foot-social{display:flex; gap:10px}
.soc{width:40px; height:40px; border-radius:12px; background:rgba(255,255,255,.08); display:grid; place-items:center; color:#fff; cursor:pointer; transition:.2s}
.soc:hover{background:var(--blue)}
.foot-col h4{color:#fff; font-family:var(--body); font-weight:800; font-size:14px; letter-spacing:.04em; text-transform:uppercase; margin:0 0 14px}
.foot-col a{display:block; color:#c6d6ec; text-decoration:none; font-size:14.5px; margin-bottom:10px; cursor:pointer; transition:.15s}
.foot-col a:hover{color:#fff; padding-left:3px}
.foot-addr{display:block; font-size:13px; color:#8ba6c7; margin-top:8px}
.foot-badges{display:flex; flex-wrap:wrap; gap:10px; padding:8px 22px 26px; border-top:1px solid rgba(255,255,255,.08)}
.badge{font-size:12px; font-weight:700; color:#bcd0ea; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); padding:6px 12px; border-radius:8px}
.badge.book{color:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.08)}
.foot-bottom-in{display:flex; justify-content:space-between; align-items:center; padding:18px 22px; font-size:13px; color:#8ba6c7; flex-wrap:wrap; gap:8px}
.foot-credit a{color:var(--lime); font-weight:700; text-decoration:none}

/* ---------- WhatsApp FAB ---------- */
.wsp-fab{position:fixed; right:20px; bottom:20px; z-index:80; display:flex; align-items:center; gap:0; background:#25D366; color:#fff; border-radius:999px; padding:14px; box-shadow:0 14px 34px rgba(37,211,102,.5); text-decoration:none; overflow:hidden; transition:transform .2s}
.wsp-fab:hover{transform:translateY(-3px) scale(1.03)}
.wsp-fab svg{flex:none}
.wsp-txt{max-width:0; opacity:0; white-space:nowrap; font-weight:800; transition:max-width .3s, opacity .3s, margin .3s}
.wsp-fab:hover .wsp-txt{max-width:220px; opacity:1; margin-left:10px; margin-right:6px}
.wsp-fab::after{content:""; position:absolute; inset:0; border-radius:999px; box-shadow:0 0 0 0 rgba(37,211,102,.5); animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.45)}70%{box-shadow:0 0 0 16px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}

/* ---------- REVEAL (motion on scroll) ---------- */
.reveal{opacity:0; transform:translateY(30px) scale(.985); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1; transform:none}
/* barra de progreso: ruta de vuelo con avión (scroll-driven, solo transform) */
.flightprog{position:fixed; top:0; left:0; right:0; height:3px; z-index:70; pointer-events:none; background:rgba(12,42,77,.08)}
.flightprog-fill{position:absolute; left:0; top:0; height:100%; width:100%; transform:scaleX(0); transform-origin:left;
  background:linear-gradient(90deg,var(--lime),var(--teal) 55%,var(--blue)); will-change:transform}
.flightprog-plane{position:absolute; top:4px; left:-2px; width:18px; height:18px; color:var(--blue);
  transform:translateX(0) rotate(45deg); will-change:transform; filter:drop-shadow(0 1px 2px rgba(12,42,77,.35))}
.flightprog-plane svg{display:block; width:100%; height:100%; transform-box:fill-box; transform-origin:center}
.stagger>*{opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease}
.stagger.in>*{opacity:1; transform:none}

/* ========== HERO PREMIUM (imagen cinematográfica) ========== */
.hero{background:#0a1f3a}
.hero-media{position:absolute; inset:0; z-index:0; overflow:hidden}
/* slideshow del hero: crossfade cinematográfico + Ken Burns (sin 3D) */
.hero-slides{position:absolute; inset:0}
.hero-slide{position:absolute; inset:0; opacity:0; overflow:hidden; transition:opacity 1.5s ease; will-change:opacity}
.hero-slide img{width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.06)}
.hero-slide.active{opacity:1}
.hero-slide.active img{animation:kenburns 6.5s ease-out forwards}
@keyframes kenburns{from{transform:scale(1.06) translate(0,0)}to{transform:scale(1.16) translate(-2%,-1.5%)}}
.hero-scrim{position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(6,20,40,.9) 0%, rgba(6,20,40,.66) 40%, rgba(6,20,40,.15) 78%, rgba(6,20,40,.05) 100%),
             linear-gradient(180deg, rgba(6,20,40,.35) 0%, rgba(6,20,40,0) 30%, rgba(6,20,40,.55) 100%)}
.hero-in{grid-template-columns:1fr; min-height:88vh; padding-top:72px; padding-bottom:104px}
.hero-copy{max-width:660px}
.eyebrow-btn{cursor:pointer; font-family:var(--body); transition:background .2s, border-color .2s}
.eyebrow-btn:hover{background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.35)}
.eyebrow-btn .chev{color:var(--lime); font-weight:800; margin-left:2px}
.btn-glass{background:rgba(255,255,255,.12); border:1.5px solid rgba(255,255,255,.4); color:#fff; backdrop-filter:blur(6px)}
.btn-glass:hover{background:rgba(255,255,255,.22)}

/* ========== SERVICIOS ========== */
.serv-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:18px}
.serv{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:24px; box-shadow:var(--shadow-s); transition:transform .2s ease, box-shadow .2s ease, border-color .2s; display:flex; flex-direction:column}
.serv:hover{transform:translateY(-5px); box-shadow:var(--shadow-m); border-color:var(--border-2)}
.serv-ic{width:54px; height:54px; border-radius:15px; display:grid; place-items:center; background:linear-gradient(135deg,#e8f6f6,#e6f0ff); margin-bottom:15px}
.serv-ic svg{width:27px; height:27px; stroke:var(--blue); fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.serv h3{font-size:18px; line-height:1.2}
.serv p{color:var(--muted); font-size:14.5px; margin:8px 0 16px; flex:1}
.serv-cta{align-self:flex-start; margin-top:auto; background:none; border:none; cursor:pointer; font-family:var(--body); font-weight:700; font-size:14.5px; color:var(--blue); display:inline-flex; align-items:center; gap:6px; padding:0}
.serv-cta span{transition:transform .2s}
.serv:hover .serv-cta span{transform:translateX(4px)}

/* ========== BENEFICIOS (afiliado) ========== */
.ben-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px}
.ben{background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14); border-radius:var(--r); padding:26px; text-align:center; backdrop-filter:blur(4px)}
.ben-ic{width:56px; height:56px; margin:0 auto 14px; border-radius:16px; display:grid; place-items:center; background:linear-gradient(135deg,rgba(141,198,63,.22),rgba(23,166,166,.22))}
.ben-ic svg{width:28px; height:28px; stroke:var(--lime); fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.ben h3{font-size:18px; color:#fff}
.ben p{color:#bcd2ee; font-size:14px; margin:8px 0 0}

/* botones "ver ficha" MINCETUR */
.trust-btn{cursor:pointer; font:inherit; color:inherit; text-align:left; background:none; border:none; padding:0}
.trust-btn:hover b{text-decoration:underline}
.trust-btn b{color:var(--lime)}
.badge-btn{cursor:pointer; font:inherit; color:#fff; transition:background .2s}
.badge-btn:hover{background:rgba(255,255,255,.14)}
.minc-link{display:block; background:none; border:none; cursor:pointer; font-family:var(--body); font-weight:700; color:var(--blue); padding:0; margin-bottom:8px; text-align:left}
.minc-link:hover{text-decoration:underline}

/* ========== MODAL MINCETUR ========== */
.modal{position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:20px}
.modal[hidden]{display:none}
.modal-scrim{position:absolute; inset:0; background:rgba(6,20,40,.6); backdrop-filter:blur(4px); animation:fade .25s ease}
.modal-card{position:relative; z-index:1; width:min(460px,100%); background:#fff; border-radius:22px; padding:28px; box-shadow:var(--shadow-l); animation:popin .28s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes popin{from{opacity:0; transform:translateY(14px) scale(.97)}to{opacity:1; transform:none}}
.modal-x{position:absolute; top:12px; right:14px; background:none; border:none; font-size:26px; color:var(--muted); cursor:pointer; line-height:1}
.minc-head{display:flex; align-items:center; gap:14px; margin-bottom:18px}
.minc-seal{flex:none; width:66px; height:66px; border-radius:14px; background:linear-gradient(135deg,var(--navy),var(--blue)); color:#fff; display:grid; place-items:center; font-family:var(--body); font-weight:800; font-size:10px; letter-spacing:.02em; text-align:center; padding:4px}
.minc-head h3{font-size:19px}
.minc-head p{font-size:12.5px; color:var(--muted); margin:2px 0 0}
.minc-list{list-style:none; margin:0 0 18px; padding:0; border-top:1px solid var(--line)}
.minc-list li{display:flex; justify-content:space-between; gap:14px; padding:11px 0; border-bottom:1px solid var(--line); font-size:14px}
.minc-list li span{color:var(--muted)}
.minc-list li b{color:var(--navy); text-align:right}
.minc-list li b.ok{color:var(--green)}
.minc-note{font-size:12px; color:var(--muted); text-align:center; margin:14px 0 0}

/* hero tagline (slogan) */
.hero-tagline{font-family:var(--head); font-style:italic; font-weight:500; font-size:clamp(19px,2.6vw,28px); color:#eaf3ff; margin:4px 0 16px; line-height:1.25; max-width:34ch}

/* dos botones de redes */
.feed-foot{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
.section .feed-foot .btn-ghost{border-color:var(--line); color:var(--navy)}

/* ========== REELS DE AFILIADOS ========== */
#afiliados .wrap{max-width:1360px}
.reels{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.reel{position:relative; aspect-ratio:9/16; border-radius:18px; overflow:hidden; background:#08172b; box-shadow:var(--shadow-m); cursor:pointer; border:1px solid rgba(255,255,255,.1)}
.reel-v{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.reel::after{content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(0,0,0,.18),transparent 26%,transparent 72%,rgba(0,0,0,.4))}
.reel-mute{position:absolute; bottom:12px; right:12px; z-index:2; width:38px; height:38px; border-radius:50%; border:none; background:rgba(0,0,0,.5); backdrop-filter:blur(4px); color:#fff; display:grid; place-items:center; cursor:pointer; transition:background .2s}
.reel-mute:hover{background:rgba(0,0,0,.75)}
.reel-mute .wave{opacity:0; transition:opacity .2s}
.reel-mute .slash{opacity:1; transition:opacity .2s}
.reel.on .reel-mute .wave{opacity:1}
.reel.on .reel-mute .slash{opacity:0}
.reel.on{outline:2px solid var(--lime); outline-offset:2px}

/* carrusel continuo de imágenes de afiliados */
.af-marquee{margin-top:26px; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.af-track{display:flex; gap:14px; width:max-content; animation:afscroll 60s linear infinite; will-change:transform}
@keyframes afscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.af-card{flex:none; width:172px; aspect-ratio:9/16; border-radius:14px; overflow:hidden; background:#08172b; box-shadow:var(--shadow-m); border:1px solid rgba(255,255,255,.1)}
.af-card img{width:100%; height:100%; object-fit:cover; display:block}
@media (max-width:560px){ .af-card{width:132px} }
.af-invite{text-align:center; margin-top:32px}
.af-invite p{color:#bcd2ee; font-size:15.5px; margin:0 0 16px}
.af-invite p strong{color:#fff}

/* ===================== MOTION / DINAMISMO (vuelos & vacaciones) ===================== */
/* capa decorativa flotante por sección */
.section, .cta, .hero, .trust{position:relative}
.wrap{position:relative; z-index:2}
.deco{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0}
.deco i{position:absolute; color:var(--blue); opacity:.09; display:block; line-height:0}
.section-navy .deco i, .cta .deco i{color:#fff; opacity:.14}
.deco .d-plane{top:16%; left:-14vw; animation:flyacross 30s linear infinite}
.deco .d-plane2{top:62%; left:-14vw; animation:flyacross 40s linear infinite; animation-delay:-16s}
.deco .d-cloud{top:22%; left:6%; animation:drift 22s ease-in-out infinite}
.deco .d-cloud2{top:58%; right:8%; left:auto; animation:drift 30s ease-in-out infinite reverse}
@keyframes flyacross{ from{ transform:translate(0,0) rotate(8deg);} to{ transform:translate(128vw,-30px) rotate(8deg);} }
@keyframes drift{ 0%,100%{ transform:translateX(0);} 50%{ transform:translateX(46px);} }

/* brillo que barre los botones primarios al hover */
.btn-primary{position:relative; overflow:hidden; isolation:isolate}
.btn-primary::after{content:""; position:absolute; inset:0 auto 0 -70%; width:45%; z-index:-1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent); transform:skewX(-20deg)}
.btn-primary:hover::after{animation:shine .85s ease}
@keyframes shine{ to{ left:130%; } }

/* iconos de servicio: bob al hover */
.serv-ic{transition:transform .28s cubic-bezier(.2,.7,.2,1)}
.serv:hover .serv-ic{transform:translateY(-5px) rotate(-8deg)}
.inc:hover .inc-ic{transform:translateY(-4px) rotate(6deg)}
.inc-ic{transition:transform .28s ease}

/* tilt 3D en tarjetas de destino (solo puntero fino) */
@media (hover:hover) and (pointer:fine){
  .dcard{transition:transform .2s cubic-bezier(.2,.7,.2,1), box-shadow .25s ease; transform-style:preserve-3d}
}

/* pequeño “vuelo” del ícono flotante de WhatsApp ya existe; añadimos latido al badge de afiliados */
.trust-item b{transition:transform .2s ease}
.trust-btn:hover b{transform:translateX(3px)}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1000px){
  .ben-grid{grid-template-columns:1fr 1fr}
  .reels{grid-template-columns:repeat(3,1fr)}
  .steps{grid-template-columns:1fr 1fr}
  .dgrid{grid-template-columns:1fr 1fr}
  .inc-grid{grid-template-columns:repeat(3,1fr)}
  .tst-grid{grid-template-columns:1fr 1fr}
  .team{grid-template-columns:1fr 1fr}
  .feed{grid-template-columns:repeat(4,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .nav-links{position:fixed; inset:64px 0 auto 0; flex-direction:column; background:#fff; padding:18px 22px; gap:4px; border-bottom:1px solid var(--line); box-shadow:var(--shadow-m); transform:translateY(-140%); transition:transform .32s ease; margin:0}
  .nav-links.open{transform:none}
  .nav-links a{padding:14px 4px; border-bottom:1px solid var(--line)}
  .nav-cta{display:none}
  .nav-burger{display:block; margin-left:auto}
  .hero-in{grid-template-columns:1fr; padding:44px 22px 72px; min-height:auto; gap:10px}
  .hero-cards{display:none}
  .hero-stats{gap:22px}
  .nos{grid-template-columns:1fr; gap:28px}
  .cta-in{grid-template-columns:1fr; gap:26px}
  .tiers{grid-template-columns:1fr}
  .tier.pop{transform:none}
}
@media (max-width:560px){
  .section{padding:64px 0}
  .dgrid{grid-template-columns:1fr}
  .inc-grid{grid-template-columns:1fr 1fr}
  .tst-grid{grid-template-columns:1fr}
  .ben-grid{grid-template-columns:1fr}
  .reels{grid-template-columns:repeat(2,1fr)}
  .hero-in{min-height:auto}
  .feed{grid-template-columns:repeat(3,1fr)}
  .foot-grid{grid-template-columns:1fr}
  .trust-in{gap:14px}
  .trust-item{min-width:44%}
  .btn{width:100%}
  .hero-actions{flex-direction:column}
  .wsp-txt{display:none}
  .foot-bottom-in{flex-direction:column; align-items:flex-start}
}

/* =========================================================
   Página "Quiénes somos" (nosotros.html)
   ========================================================= */
.pagehero{position:relative; overflow:hidden; text-align:center; color:#fff;
  background:linear-gradient(160deg,#0b2444 0%,#123a66 55%,#0e4f8a 100%); padding:130px 0 92px}
.pagehero .wrap{position:relative; z-index:2; max-width:900px}
.pagehero .deco i{color:#fff; opacity:.14}
.pagehero h1{font-size:clamp(34px,6vw,60px); letter-spacing:-.02em; margin:12px 0 0}
.pagehero h1 em{color:var(--lime)}
.pagehero .lead{font-size:clamp(16px,2vw,19px); color:#cfe0f5; max-width:690px; margin:20px auto 0}
.pagehero-cta{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:32px}
.pagehero-stats{display:flex; gap:40px; justify-content:center; flex-wrap:wrap; margin-top:44px}
.pagehero-stats b{display:block; font-family:var(--head); font-size:34px; color:#fff; font-variant-numeric:tabular-nums}
.pagehero-stats span{font-size:13px; color:#a9c4e6; letter-spacing:.02em}

.qs-lead{max-width:820px; margin:0 auto; text-align:center; font-size:18px; color:var(--muted)}
.qs-serv{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; max-width:820px; margin:26px auto 0}
.qs-serv span{background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:9px 17px; font-size:14px; font-weight:600; color:var(--navy); box-shadow:var(--shadow-s)}

.mv-grid{display:grid; grid-template-columns:1fr 1fr; gap:26px; max-width:1000px; margin:0 auto}
.mv-card{position:relative; background:var(--surface); border:1px solid var(--line); border-radius:22px; padding:40px 34px 36px; box-shadow:var(--shadow-s); overflow:hidden; transition:transform .3s ease, box-shadow .3s ease}
.mv-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-m)}
.mv-card::before{content:""; position:absolute; left:0; top:0; height:100%; width:5px; background:linear-gradient(180deg,var(--blue),var(--teal))}
.mv-ic{width:58px; height:58px; border-radius:16px; display:grid; place-items:center; color:#fff; margin-bottom:18px; box-shadow:0 10px 24px rgba(30,111,217,.3)}
.mv-card.mision .mv-ic{background:linear-gradient(145deg,var(--blue),var(--blue-bright))}
.mv-card.vision .mv-ic{background:linear-gradient(145deg,var(--teal),var(--lime))}
.mv-ic svg{width:28px; height:28px}
.mv-card h3{font-size:25px; margin:0 0 12px}
.mv-card p{color:var(--muted); font-size:16.5px; line-height:1.65; margin:0}

.vals{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:960px; margin:44px auto 0}
.val{text-align:center; padding:28px 22px; border-radius:18px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-s); transition:transform .3s ease}
.val:hover{transform:translateY(-4px)}
.val-ic{font-size:30px; line-height:1}
.val h4{font-size:19px; margin:14px 0 6px}
.val p{color:var(--muted); font-size:14.5px; margin:0; line-height:1.55}

@media (max-width:820px){
  .mv-grid{grid-template-columns:1fr}
  .vals{grid-template-columns:1fr}
  .pagehero{padding:108px 0 68px}
  .pagehero-stats{gap:28px}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important; scroll-behavior:auto !important}
  .reveal,.stagger>*{opacity:1 !important; transform:none !important}
}