/* /book/: versión celeste y blanco (estilo aerolínea). Se carga después de /styles.css. */
:root{
  --ink:#0b1f44; --navy:#0b1f44; --muted:#5a6b85;
  --azure:#1677ff; --azure-d:#0b5ed7; --blue:#1677ff; --blue-2:#4fa3ff;
  --mist:#eef3f9; --sky:#e8f3ff; --sky-2:#cfe6ff; --ice:#f5faff; --line:#dce9f8;
  --red:#e5262f; --red-2:#c81e27; --gold:#ffb81c;
  --head:"Bricolage Grotesque","Manrope",system-ui,sans-serif;
}
body{background:#fff;color:var(--ink)}
.h2,.bk-h1{font-family:var(--head);font-weight:800;text-transform:none;letter-spacing:-.035em;line-height:1.02;color:var(--ink)}
.h2{font-size:clamp(34px,4.2vw,56px)}
.lead{color:var(--muted)}

/* ---------- header de vidrio blanco ---------- */
.site-header{position:fixed;top:12px;left:0;right:0;z-index:40;background:none}
.hdr{width:min(1240px,100% - 32px);margin-inline:auto;border-radius:20px;background:rgba(255,255,255,.6);-webkit-backdrop-filter:blur(20px) saturate(170%);backdrop-filter:blur(20px) saturate(170%);border:1px solid rgba(255,255,255,.8);box-shadow:0 10px 30px -12px rgba(11,31,68,.22);transition:background .3s var(--ease)}
.site-header.scrolled .hdr{background:rgba(255,255,255,.9)}
.hdr-main{display:flex;align-items:center;gap:30px;height:66px;padding:0 12px 0 18px}
.brand-name{color:var(--ink)}
.brand-name b{color:var(--red)}
.brand-name small{color:var(--muted)}
.brand-mark{background:var(--azure)}
.main-nav{margin-left:16px}
.main-nav a{color:var(--ink);text-transform:none;letter-spacing:0;font-size:15px;font-weight:700}
.main-nav a::after{background:var(--azure)}
.trust-row{display:flex;justify-content:center;align-items:center;gap:8px 24px;flex-wrap:wrap;border-top:1px solid rgba(11,31,68,.08);padding:7px 14px;font-size:13.5px;font-weight:600;color:var(--muted)}
.trust-row .stars{color:var(--gold);letter-spacing:2px}
.trust-row b{color:var(--ink);font-weight:800}
.trust-row .sep{width:4px;height:4px;border-radius:50%;background:#b7c6dc}

/* ---------- hero con foto de cielo ---------- */
.bk-hero{position:relative;overflow:hidden;isolation:isolate;min-height:max(860px,100svh);display:flex;flex-direction:column;justify-content:flex-end}
.bk-bg{display:block;position:absolute;inset:0;z-index:-2}
.bk-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 0%;transform-origin:50% 60%;animation:kenburns 30s ease-in-out infinite alternate}
.bk-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(234,245,255,.5) 0%,rgba(234,245,255,.12) 40%,rgba(234,245,255,0) 62%,rgba(11,31,68,.16) 100%)}
.bk-inner{position:relative;z-index:4;padding:190px 0 70px;text-align:center;display:flex;flex-direction:column;align-items:center}
.bk-h1{margin:0;font-size:clamp(48px,6vw,88px);max-width:14ch}
.bk-h1 .hl{color:var(--azure)}
.bk-sub{margin:18px auto 0;font-size:19px;line-height:1.55;color:#1f3358;max-width:34em;font-weight:600;text-shadow:0 1px 12px rgba(255,255,255,.7)}
.bk-sub b{color:var(--ink)}

.plane-m{width:min(30vw,470px);left:auto;right:2vw;top:120px;z-index:3}
.plane-m img{height:auto}
.show-m{display:none}

/* caja de llamada de vidrio */
.callcard{margin-top:34px;width:min(580px,100%);display:grid;grid-template-columns:1fr;gap:12px;text-align:left;padding:14px;border-radius:26px;background:rgba(255,255,255,.5);-webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);border:1px solid rgba(255,255,255,.85);box-shadow:0 30px 60px -24px rgba(11,31,68,.45)}
.cc-main{background:#fff;border-radius:18px;padding:18px 18px 14px}
.cc-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13.5px;font-weight:700;color:var(--muted)}
.cc-live{display:flex;align-items:center;gap:8px;color:#12804a}
.cc-top .dot{background:#22c06a}
.cc-title{margin:10px 0 14px;font-family:var(--head);font-weight:800;font-size:25px;letter-spacing:-.025em;line-height:1.1;color:var(--ink)}
.call-big{position:relative;overflow:hidden;width:100%;padding:16px 18px;border-radius:15px;box-shadow:none;gap:16px}
.call-big::before{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.38),rgba(255,255,255,0));transform:skewX(-20deg);animation:shine 3.6s ease-in-out 1.6s infinite}
@keyframes shine{0%{left:-40%}35%,100%{left:130%}}
.call-big small{text-transform:none;letter-spacing:0;font-size:13.5px;font-weight:700;opacity:.95}
.call-big .num{font-size:25px}
.call-big .ring-ico{width:34px!important;height:34px!important;margin-left:-14px}
.cc-note{display:flex;justify-content:center;gap:8px;align-items:center;margin:11px 0 0;font-size:13px;color:var(--muted)}
.cc-note{gap:7px;font-weight:600}
.cc-note .stars{color:var(--gold);letter-spacing:1.5px;font-size:14px}
.cc-note b{color:var(--ink);font-weight:800}
.cc-sep{width:4px;height:4px;border-radius:50%;background:#b7c6dc;margin:0 4px}

/* carrusel de aerolíneas */
.air-marquee{position:relative;overflow:hidden;padding:4px 0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 82%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 82%,transparent 100%)}
.air-track{display:flex;width:max-content}
.air-group{display:flex;flex:none;animation:marquee 18s linear infinite;will-change:transform;backface-visibility:hidden}
.air-track span{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-family:var(--head);font-weight:800;font-size:16px;letter-spacing:-.01em;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 16px 8px 10px;margin-right:10px}
.air-track img{width:22px;height:22px;flex:none}
@keyframes marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-100%,0,0)}}
@media (prefers-reduced-motion:reduce){.air-group{animation-duration:60s}}

/* tablero de rutas (ya no se usa) */
.board{border-radius:18px;background:linear-gradient(160deg,#123372,#0b1f44);padding:14px 16px 8px;color:#fff}
.board-head{display:flex;justify-content:space-between;font-size:11.5px;font-weight:800;letter-spacing:.08em;color:#8fb7f2;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.1)}
.board-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px dashed rgba(255,255,255,.12);perspective:400px}
.board-row:last-child{border-bottom:0}
.route{white-space:nowrap;display:flex;align-items:center;gap:9px;font-family:var(--head);font-weight:700;font-size:15.5px;letter-spacing:-.01em}
.route .code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:700;color:#0b1f44;background:#8fd0ff;border-radius:6px;padding:3px 6px;letter-spacing:.04em}
.route svg{width:14px;height:14px;color:#8fd0ff;transform:rotate(90deg)}
.status{font-size:12px;font-weight:800;color:#5ce39b;display:flex;align-items:center;gap:6px}
.status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.flip{animation:flip .6s var(--ease)}
@keyframes flip{0%{transform:rotateX(0);opacity:1}45%{transform:rotateX(90deg);opacity:0}55%{transform:rotateX(-90deg);opacity:0}100%{transform:rotateX(0);opacity:1}}

/* barra de ventajas */
.features{background:transparent}
.features{margin-top:-40px}
.feature-bar{border:0;background:#fff;box-shadow:0 24px 50px -28px rgba(11,31,68,.3)}
.feature{flex-direction:column;align-items:center;text-align:center;gap:12px}
.feature + .feature{border-left:0}
.f-ico,.feature .f-ico,.stamp .f-ico{background:var(--sky);color:var(--azure)}
.f-ico.red{background:#ffe9ea;color:var(--red)}
.feature:hover{background:transparent}
.feature strong{white-space:nowrap}

/* ---------- destinos ---------- */
.dest{padding:110px 0 100px;background:linear-gradient(180deg,#fff 0%,var(--ice) 100%)}
.dest-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:40px}
.dest-head .lead{margin-top:12px}
.link-arrow{color:var(--azure)}
.dest-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.dcard{display:flex;flex-direction:column;background:#fff;border-radius:22px;overflow:hidden;border:1px solid var(--line);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.dcard:hover{transform:translateY(-4px);box-shadow:0 24px 44px -24px rgba(22,119,255,.4)}
.dcard-img{position:relative;aspect-ratio:3/2;overflow:hidden}
.dcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.dcard:hover .dcard-img img{transform:scale(1.04)}
.badge{position:absolute;top:14px;left:14px;font-size:12.5px;font-weight:800;color:var(--ink);padding:6px 11px;border-radius:999px;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.badge::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--red);margin-right:7px;vertical-align:1px}
.badge.b-blue::before{background:var(--azure)}.badge.b-green::before{background:#14935a}.badge.b-gold::before{background:var(--gold)}
.dcard-body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.dcard-body h3{margin:0;font-family:var(--head);font-weight:800;font-size:23px;letter-spacing:-.02em;color:var(--ink)}
.dcard-body p{margin:6px 0 18px;color:var(--muted);font-size:15px;line-height:1.5}
.dcall{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:9px;padding:13px;border-radius:13px;background:var(--sky);color:var(--azure-d);font-weight:800;font-size:15px;transition:background .2s,color .2s,transform .18s var(--ease)}
.dcall svg{width:17px;height:17px}
.dcard:hover .dcall{background:var(--azure);color:#fff}
.dcall:active{transform:scale(.97)}
.dest-more{margin-top:28px;text-align:center;color:var(--muted);font-size:16px}
.dest-more a{color:var(--azure);font-weight:800}

/* ---------- reseñas (slider automático) ---------- */
.reviews{padding:70px 0 40px;background:#fff}
.rev-head{text-align:center;margin-bottom:34px}
.rev-score{display:flex;justify-content:center;align-items:center;gap:8px;margin:14px 0 0;color:var(--muted);font-weight:600}
.rev-score .stars{color:var(--gold);letter-spacing:2px}
.rev-score b{color:var(--ink)}
.rev-score .nw{white-space:nowrap}
.sample-note{margin:8px 0 0;font-size:12px;color:var(--muted)}
.rv-marquee{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:max(20px,calc((100vw - 1180px)/2));-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain}
.rv-marquee::-webkit-scrollbar{display:none}
.rv-track{display:flex;width:max-content;padding:4px max(20px,calc((100vw - 1180px)/2)) 8px}
.rv-group{display:flex;flex:none}
.rv{scroll-snap-align:start}
.rv-nav{display:flex;justify-content:center;gap:10px;margin-top:18px}
.rv-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:18px;cursor:pointer;transition:background .2s,transform .1s}
.rv-btn:hover{background:var(--sky)}
.rv-btn:active{transform:scale(.94)}
.rv-ver{margin-top:2px;display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:700;color:#14894b}
.rv-ver svg{width:14px;height:14px}
.rv{flex:none;width:340px;margin:0 16px 0 0;background:var(--ice);border:1px solid var(--line);border-radius:20px;padding:22px 22px 18px;display:flex;flex-direction:column}
.rv-stars{color:var(--gold);letter-spacing:2px;font-size:16px}
.rv blockquote{margin:10px 0 16px;font-size:15.5px;line-height:1.55;color:var(--ink);flex:1}
.rv figcaption{display:flex;align-items:center;gap:10px}
.rv-av{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--azure);color:#fff;font-weight:800}
.rv figcaption b{display:block;font-size:14.5px;color:var(--ink)}
.rv figcaption small{display:block;font-size:13px;color:var(--muted)}

/* ---------- resto ---------- */
.band{background:linear-gradient(135deg,#0b5ed7 0%,#1677ff 55%,#4fa3ff 100%)}
.band .lead{color:#e3efff}
.not-list{color:#d7e8ff}
#how{background:#fff}
.step{border-color:var(--line)}
.step-num{font-family:var(--head);font-weight:800;font-size:26px;background:var(--azure)}
.cta::after{background:linear-gradient(90deg,rgba(11,40,96,.9) 0%,rgba(11,40,96,.6) 45%,rgba(11,40,96,.05) 100%)}
.cta .h2{color:#fff;font-size:clamp(38px,4.8vw,64px)}
.faq summary{color:var(--ink)}
.faq summary .pm{background:var(--sky);color:var(--azure)}
.site-footer{background:#0b1f44}

/* ---------- tablet y celular ---------- */
@media (max-width:1080px){
  .dest-grid{grid-template-columns:1fr 1fr}
  .main-nav{display:none}
}
@media (max-width:760px){
  .site-header{top:8px}
  .hdr{width:calc(100% - 16px);border-radius:16px}
  .hdr-main{height:56px;padding:0 7px 0 10px;gap:10px}
  .site-header .brand-mark{width:34px;height:34px;border-radius:10px}
  .site-header .brand-mark svg{width:20px;height:20px}
  .site-header .brand-name{font-size:16px}
  .header-cta .btn-sm{padding:9px 12px;font-size:13.5px}
  .trust-row{font-size:12px;gap:4px 10px;padding:5px 8px;white-space:nowrap;flex-wrap:nowrap}
  .trust-row .hide-m{display:none}
  .bk-hero{min-height:auto;background:var(--mist)}
  .bk-hero::before{display:none}
  .bk-bg{position:relative;inset:auto;height:290px;overflow:hidden}
  .bk-bg::after{content:"";position:absolute;inset:auto 0 0 0;height:110px;background:linear-gradient(180deg,rgba(238,243,249,0),var(--mist) 92%)}
  .bk-bg img{object-position:50% 55%}
  .plane-m{display:block;width:62vw;left:19vw;top:118px;right:auto;z-index:3}
  .plane-m img{height:auto}
  .site-header{box-shadow:none}
  .bk-inner{padding:0 0 26px;margin-top:-34px}
  .bk-h1{font-size:clamp(36px,10.5vw,48px)}
  .bk-sub{font-size:15.5px;margin-top:10px;text-shadow:none}
  .bk-sub .hide-m{display:none}
  .bk-sub .show-m{display:inline}
  .callcard{grid-template-columns:1fr;margin-top:16px;padding:0;gap:6px;border:0;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
  .cc-main{padding:14px 14px 12px;border:1px solid var(--line);box-shadow:0 18px 40px -22px rgba(11,31,68,.4)}
  .cc-title{font-size:21px;margin:8px 0 12px}
  .call-big .num{font-size:22px}
  .air-track span{font-size:14.5px;padding:7px 13px 7px 9px}
  .air-track img{width:20px;height:20px}
  .air-group{animation-duration:15s}
  .status{font-size:0;gap:0}
  .board-head span:last-child{display:none}
  .features{margin-top:-1px;padding:7px 0 10px;background:var(--mist)}
  .feature-bar{background:transparent}
  .feature-bar{grid-template-columns:1fr 1fr;gap:4px 0;box-shadow:none;padding:0}
  .feature{gap:10px;padding:16px 10px}
  .feature + .feature{border-top:0}
  .feature .f-ico{width:40px;height:40px}
  .feature strong{font-size:15px}
  .feature span{font-size:13px}
  .feature strong{font-size:14.5px}
  .feature .f-ico,.feature .f-ico.red{background:#fff;box-shadow:0 6px 14px -8px rgba(11,31,68,.35)}
  .dest{padding:56px 0 56px;background:#fff}
  .dest-head{flex-direction:column;align-items:flex-start;margin-bottom:24px}
  .dest-grid{grid-template-columns:1fr;gap:16px}
  .reviews{padding:40px 0 10px;background:linear-gradient(180deg,var(--mist) 0%,#fff 60%)}
  .rv{width:280px;padding:18px}
  .rv{width:82vw;max-width:300px}
}
@media (prefers-reduced-motion:reduce){.call-big::before{display:none}}
@media (min-width:761px){.bk-h1 .hl{color:#fff;text-shadow:0 2px 18px rgba(11,31,68,.28)}}
.brand-logo{display:block;height:54px;width:auto}
@media (max-width:760px){.site-header .brand-logo{height:38px}}
/* "Cheap": a green dollar that rises and fades every few seconds, with a marker underline */
.cheap{position:relative;display:inline-block;isolation:isolate}
.cheap::after{content:"";position:absolute;left:-.04em;right:-.04em;bottom:.1em;height:.28em;border-radius:.12em;background:#22c55e;opacity:.5;z-index:-1;transform-origin:left;animation:cheapline .9s .5s cubic-bezier(.2,.8,.2,1) both}
.cheap-d{position:absolute;right:-.42em;top:-.32em;width:1.25em;height:1.25em;display:grid;place-items:center;border-radius:50%;background:#16a34a;color:#fff;font-size:.3em;font-weight:800;line-height:1;box-shadow:0 4px 12px rgba(22,163,74,.35);opacity:0;animation:cheapdollar 3.2s 1.2s ease-out infinite;pointer-events:none}
.cheap-d.d2{right:auto;left:38%;top:-.28em;font-size:.24em;animation-delay:2.8s}
@keyframes cheapline{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes cheapdollar{0%{opacity:0;transform:translateY(.5em) scale(.7)}15%{opacity:1;transform:translateY(0) scale(1)}60%{opacity:.85}100%{opacity:0;transform:translateY(-1.3em) scale(.9)}}
@media (prefers-reduced-motion:reduce){.cheap::after{animation:none}.cheap-d{display:none}}