/*
* SECTIONS
*/
.main{ padding-bottom:2.25rem; }
.cards--container{ padding-inline:14px; }
.cards--container h3{ font-size:1.375rem; text-align:center; }

/*
* SPECIAL SECTIONS
*/
.sp-initial-content{ padding-top:25px; padding-inline:14px; }

/* 
*  MODAL -- COVER
*/
.cover{
  display:none; position:fixed; z-index:9999; left:0; top:0; height:100%; width:100%;
  overflow:auto; background-color:#fff;
}
.d-none{ display:none; }
.show{ display:flex !important; }
.cover--main{ width:100%; background-color:#1b1b1b; }
.cover--header{
  display:flex; color:#fff; align-items:baseline; justify-content:space-between;
  margin-block:5px; padding-inline:20px;
}
.cover--header img{ width:16px; }
.cover--body{
  background-color:#fff; height:100%;
  border-top-right-radius:15px; border-top-left-radius:15px;
  padding-top:25px; padding-inline:15px;
}

.search--input--container{ position:relative; }
.search--input{
  margin:0 0 12px 0; padding:21px 16px 7px 48px;
  background-color:transparent; border:1px solid #d9d9d9; border-bottom:2px solid transparent;
  border-radius:.25rem; box-sizing:border-box; min-height:52px; text-align:start; width:100%;
}
.search--input:focus{ outline:none; border:1px solid #d9d9d9; border-bottom:2px solid #34c759; }
.search--input--icon{ position:absolute; z-index:999; top:15px; left:15px; width:18px; }
.search--input--label{ position:absolute; z-index:998; top:8px; left:47px; font-size:11px; color:#7f7f7f; width:20px; }

.destination{ box-sizing:border-box; padding:16px 60px 15px 12px; border-bottom:1px solid #ccc; }
.destination:hover{ background-color:#f3f3f3; }
.destination :nth-child(1){ display:inline; font-size:16px; font-weight:700; margin-right:5px; }
.destination :nth-child(2){ display:inline; font-size:14px; margin-right:5px; }
.destination :nth-child(3){ display:inline; font-size:14px; }

/*
* FORMS
*/
.passenger-selector{
  display:flex; flex-wrap:nowrap; flex-direction:row; align-items:center; justify-content:space-between;
}
.passenger-btn{
  min-width:95px; display:flex; flex-wrap:nowrap; flex-direction:row; align-items:center; justify-content:space-between;
}
.passenger-btn img{ width:25px; height:25px; }
.passenger-btn h1{ font-size:26px; }

/*
* MAIN-CARD
*/
.main--card{
  padding-top:16px; border-radius:16px; background-color:rgba(255,255,255,.6);
  box-shadow:0 1px 3px rgba(0,0,0,.12);
}
.main--card--header{ display:flex; justify-content:center; }
.main--card--header form{
  display:flex; justify-content:space-between; min-width:14.6875rem; box-sizing:border-box;
  padding:10px 18px; background-color:#fff; border-radius:6.25rem; box-shadow:0 .125rem .75rem rgba(27,27,27,.15);
}
.main--card--header form label{ font-size:.875rem; }
.main--card--body{
  display:flex; flex-direction:column; justify-content:space-between;
  margin-top:16px; padding:20px 24px; border-radius:16px; background-color:#fff;
}

/* MAIN-INPUT-GROUP */
.main--input-group{
  position:relative; display:flex; flex-direction:row; border-radius:.25rem; border:1px solid #d9d9d9;
}
.main--input-group .fd-icon{
  position:absolute; inset:0; margin:auto; width:20px; max-width:100%; max-height:100%;
}
.btn-ig{
  position:relative; margin:0; padding:21px 16px 7px 48px; background-color:transparent;
  border:0; border-bottom:2px solid transparent; cursor:pointer; text-align:start; width:100%;
}
#btn-passengers{ padding:16px 21px 10px 48px !important; }
.btn-ig:hover{ border-bottom:2px solid #34c759; }
.btn-ig-icon{ position:absolute; z-index:999; top:15px; left:15px; width:20px; }
.btn-ig-label{ position:absolute; z-index:998; top:8px; left:47px; font-size:11px; color:#7f7f7f; width:20px; }
.btn-ig-text{ font-weight:700; }

/* MAIN-RADIOS */
.radio-wrapper{ display:inline-block; cursor:pointer; }
.radio-circle{
  width:16px; height:16px; border:1px solid #7f7f7f; border-radius:50%;
  position:relative; display:inline-block; vertical-align:middle; opacity:1;
}
.radio-circle:hover{ border:1px solid #34c759; }
.radio-dot{
  width:8px; height:8px; background-color:#fff; border-radius:50%;
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); opacity:0;
}
.radio-label{ padding-left:5px; vertical-align:middle; }
input[type="radio"]{ display:none; }
input[type="radio"]:checked + .radio-circle{ border-color:#34c759; opacity:1; }
input[type="radio"]:checked ~ .radio-label{ font-weight:700; }
input[type="radio"]:checked + .radio-circle .radio-dot{ border:5px solid #34c759; opacity:1; }

/*
* MAIN-BANNER (sección antigua, por si la sigues usando)
*/
.main--banner{ box-sizing:border-box; padding-inline:14px; padding-block:24px; width:100%; }
.main--banner--img{
  width:100%; height:300px; background-image:url("../assets/svg/main_banner_people.png");
  background-size:cover; background-position:center; border-top-left-radius:15px; border-top-right-radius:15px;
}
.main--banner--body{
  padding:24px 24px 32px; position:relative;
  background:linear-gradient(180deg,#F00 44.84%,#B50080 100%); color:#fff;
  border-bottom-left-radius:15px; border-bottom-right-radius:15px;
}
.main--banner--body h5{ margin:0; font-size:1.5rem; line-height:1; display:block; }
.main--banner--body p{ font-size:.875rem; font-weight:400; line-height:1.323; margin-bottom:110px; }
.main--banner--body img{ position:absolute; top:55px; right:10px; width:62px; }

/*
* CARD-TRAVEL fondos antiguos (se mantienen)
*/
.card--travel{
  height:12.75rem; border-radius:15px; margin-bottom:35px; position:relative; overflow:hidden;
}
.card--travel::before{
  content:''; position:absolute; bottom:0; width:100%; height:120px;
  background:linear-gradient(to bottom,transparent, rgb(0 0 0));
}
.card--travel--text{ text-align:left; position:absolute; bottom:15px; left:15px; color:#fff; }
.card--travel--text h4{ margin:0; font-size:2rem; }
.card--travel--text p{ margin:0; font-size:.875rem; }
.card--bg--per{ background-image:url('../assets/svg/pereira__banner.webp'); background-position:center; background-size:cover; }
.card--bg--bga{ background-image:url('../assets/svg/bucara__banner.webp'); background-position:center; background-size:cover; }
.card--bg--med{ background-image:url('../assets/svg/medellin__banner.webp'); background-position:center; background-size:cover; }
.card--bg--gua{ background-image:url('../assets/svg/guayaquil.jpg'); background-position:center; background-size:cover; }
.card--bg--cue{ background-image:url('../assets/svg/cuenca.jpg'); background-position:center; background-size:cover; }
.card--bg--glp{ background-image:url('../assets/svg/galapagos.jpg'); background-position:center; background-size:cover; }

/*
* NAVBAR
*/
.navbar{ display:flex; flex-direction:row; align-items:baseline; padding:.75rem .875rem; }
.navbar-hmenu{ align-self:center; }
.navbar--logo{ display:flex; width:100%; justify-content:center; align-items:center; }
.navbar--logo img{ width:128px; }

/*
* FORM
*/
.input-text-secondary{
  padding:11px 49px; height:26px; font-size:1rem; border-radius:100vh; border:0;
}
.input-text-secondary:focus-visible{ outline:none; }

/*
* FORM-ICONS
*/
.-i-mail{
  background-image:url("../assets/svg/i-mail.png"); background-repeat:no-repeat;
  background-position-x:20px; background-position-y:center; background-size:18px;
}

/*
* BUTTONS
*/
.btn{
  display:flex; align-items:center; justify-content:center;
  height:3rem; padding:.625rem 1.375rem; cursor:pointer;
  font-size:1.25rem; font-weight:700; line-height:1.2;
  border-radius:100vh; border-width:2px; border-style:solid;
  transition:all .06s linear; text-transform:none;
}
.btn-black{ background-color:#1b1b1b; padding-block:24px; color:#fff; }
.btn-black:hover{ border-color:#494949; background-color:#494949; color:#fff; }
.btn-red{ border-color:red; background-color:red; color:#fff; }
.btn-red:hover{ border-color:#D90000; background-color:#D90000; }

/*
* FOOTER (antiguo)
*/
.footer{ display:flex; flex-direction:column; justify-content:center; background-color:#1b1b1b; color:white; }
.footer--main{ display:flex; flex-direction:column; justify-content:center; padding-inline:.875rem; padding-top:2rem; line-height:1.5; }
.footer--logo{ text-align:center; margin-bottom:2.25rem; }
.footer--accordion-item{
  display:flex; flex-direction:row; align-items:center; justify-content:space-between;
  font-weight:700; font-size:14px; padding-block:12px;
}
.footer--accordion-item img{ width:15px; }
.footer--end{
  display:flex; flex-direction:row; flex-wrap:nowrap; justify-content:space-between;
  margin-top:1px; padding-block:20px; padding-inline:14px; font-size:12px;
}

/*
* TOOLKIT
*/
.loader{
  display:none; justify-content:center; align-items:center;
  position:fixed; z-index:10000; left:0; top:0; height:100vh; width:100vw; overflow:auto; background-color:#fff;
}
.loader img{ width:150px; height:150px; }
input[type="date"]{ -webkit-appearance:textfield; -moz-appearance:textfield; min-height:1.2em; }
.sb-hidden{ overflow-y:hidden; }
.text-normal{ font-size:1.125rem; }
.text-big{ font-size:18px; }
.text-thin{ font-size:12px; }
.bg-main-card{ background-image:url("../assets/svg/header_bg_blue.png"); background-size:cover; }
.link-blue{ color:#048fa0; }
.w-100{ width:100%; }

/* --- SIZING --- */
.vh-100{ height:100vh; }
.mt-0{ margin-top:0; } .mt-1{ margin-top:5px; } .mt-2{ margin-top:12px; } .mt-3{ margin-top:20px; }
.mt-4{ margin-top:25px; } .mt-5{ margin-top:35px; }
.mb-0{ margin-bottom:0; } .mb-1{ margin-bottom:5px; } .mb-2{ margin-bottom:12px; } .mb-3{ margin-bottom:20px; }
.mb-4{ margin-bottom:25px; } .mb-5{ margin-bottom:35px; }

/* =========================================================
   PROMO SPLIT
   ========================================================= */
.promo-split{
  display:grid; gap:0; border-radius:22px; overflow:hidden; background:#fff;
  box-shadow:0 14px 40px rgba(0,0,0,.14);
  max-width:1220px; margin:18px auto 28px;
  grid-template-columns:1fr;
}
.promo-split__img{
  position:relative; min-height:260px;
  background-repeat:no-repeat;
  background-size:cover;
  background-position:35% center;
}
.promo-badge{
  position:absolute; top:12px; left:12px; font-size:12px; color:#fff;
  background:rgba(0,0,0,.45); padding:6px 10px; border-radius:999px; backdrop-filter:blur(2px);
}
.promo-split__panel{
  background:#e01111; color:#fff; padding:22px 18px 22px;
  display:flex; flex-direction:column; justify-content:center;
}
.promo-split__panel-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.promo-kicker{ font-weight:800; font-size:20px; margin:0; }
.promo-title{ font-weight:900; font-size:36px; line-height:1.05; margin:.25rem 0 0; }
.promo-logo{ width:40px; filter:brightness(0) invert(1); }
.promo-copy{ margin:12px 0 18px; font-size:14px; line-height:1.35; opacity:.98; }
.promo-split__price-cta{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.promo-price{ margin:0; font-size:14px; font-weight:600; }
.price-xxl{ display:block; font-size:44px; font-weight:900; line-height:1; }
.btn.btn-light{
  background:#fff; color:#111; border:1px solid transparent; height:46px; padding:0 22px; border-radius:999px;
  font-weight:800; box-shadow:0 2px 8px rgba(0,0,0,.12); transition:transform .12s ease, box-shadow .12s ease; white-space:nowrap;
}
.btn.btn-light:hover{ transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.16); }

/* Desktop promo */
@media (min-width:992px){
  .promo-split{ grid-template-columns:1.35fr 1fr; min-height:420px; }
  .promo-split__img{ min-height:auto; background-position:50% center; }
  .promo-split__panel{ padding:36px 34px; }
  .promo-title{ font-size:48px; }
  .promo-copy{ font-size:15px; }
  .price-xxl{ font-size:72px; }
  .btn.btn-light{ height:50px; padding:0 26px; }
}

/* Alinear cards con el buscador antiguo */
.cards--container{ max-width:1220px; margin-left:auto; margin-right:auto; }

/* Ajuste de textos en cards pequeñas antiguas */
.card--travel--text h4{ margin:0; font-size:2rem; font-weight:800; }
.card--travel--text p{ margin:0; font-size:1rem; font-weight:600; }
@media (max-width:768px){
  .card--travel--text h4{ font-size:1.25rem; }
  .card--travel--text p{ font-size:.8rem; }
}

/* === Espaciado móvil para promo === */
@media (max-width: 768px){
  .promo-split{ margin: 16px 14px 28px; border-radius: 16px; }
  .promo-split__img{ border-top-left-radius: 16px; border-top-right-radius: 16px; overflow: hidden; }
  .main--banner{ padding-inline: 14px; }
  .main--banner--img, .main--banner--body{ border-radius: 16px; }
}

/* ===== NUEVO: Ofertas con "píldora" blanca ===== */
.offers-title{
  font-size: 2rem;
  text-align: center;
  margin: 28px 0 22px;
  font-weight: 900;
}

.offers-grid{
  display: grid;
  gap: 22px;
  grid-template-columns: 1fr;
  max-width: 1220px;
  margin: 0 auto 28px;
  padding: 0 14px;
}

.offer-card{
  position: relative;
  display: block;
  height: 260px;
  border-radius: 18px;
  overflow: hidden;
  background-position: center;
  background-size: cover;
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
  transition: transform .15s ease, box-shadow .15s ease;
}
.offer-card::after{
  content:"";
  position:absolute; inset:0 0 0 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 60%, rgba(0,0,0,.18) 100%);
  pointer-events:none;
}
.offer-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 36px rgba(0,0,0,.16);
}

.offer-pill{
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: #fff;
  color: #111;
  border-radius: 16px;
  padding: 14px 16px;
  box-shadow: 0 6px 18px rgba(0,0,0,.14);
}

.offer-city{
  font-size: 1.25rem;
  font-weight: 900;
  letter-spacing: .2px;
}

.offer-right{
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.offer-badge{
  font-size: .75rem;
  font-weight: 800;
  background: #f3f5f7;
  color: #222;
  border-radius: 999px;
  padding: 6px 10px;
  white-space: nowrap;
}

.offer-price{ text-align: right; }
.offer-price small{
  display:block;
  font-size: .75rem;
  opacity: .8;
  margin-bottom: 2px;
}
.offer-price strong{
  font-size: 1.125rem;
  font-weight: 900;
}

/* Desktop: 3 columnas */
@media (min-width: 992px){
  .offers-grid{
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
    padding: 0;
  }
  .offer-card{ height: 280px; }
  .offer-city{ font-size: 1.35rem; }
  .offer-price strong{ font-size: 1.2rem; }
}

/* Tablet: 2 columnas */
@media (min-width: 640px) and (max-width: 991px){
  .offers-grid{ grid-template-columns: repeat(2, 1fr); }
}

/* ======= FOOTER NUEVO (desktop + móvil) ======= */
.site-footer{ background:#111; color:#fff; }
.site-footer a{ color:#fff; text-decoration:none; opacity:.95; }
.site-footer a:hover{ opacity:1; text-decoration:underline; }

.sf__inner{ max-width:1220px; margin:0 auto; padding:28px 14px 24px; }

/* Fila superior: logo | newsletter | redes */
.sf__top{
  display:grid; gap:24px;
  grid-template-columns:1fr;           /* móvil */
  align-items:flex-start;
}

/* Marca */
.sf__logo{ width:170px; }

/* Newsletter */
.sf__newsletter{ text-align:center; }
.sf__title{ font-weight:800; font-size:20px; margin:0 0 6px; }
.sf__subtitle{ margin:0 0 14px; opacity:.9; }

.sf__form{
  display:grid; gap:10px; grid-template-columns:1fr; /* móvil */
  max-width:720px; margin:0 auto;
}
.sf__input{
  width:100%; height:48px; border-radius:999px; border:0;
  padding:0 18px 0 49px; background:#fff; color:#111;
}
.sf__btn{ height:48px; font-weight:800; border-radius:999px; }

.sf__legal{ margin:8px 0 0; opacity:.8; font-size:12px; }
.sf__link{ text-decoration:underline; }

/* Redes */
.sf__social{ text-align:center; }
.sf__title--social{ margin-bottom:10px; }
.sf__social-sprite{ display:inline-block; }

/* Fila de columnas */
.sf__cols{
  margin-top:26px;
  display:grid; gap:24px;
  grid-template-columns:1fr;            /* móvil */
}
.sf__col-title{ margin:0 0 10px; font-size:18px; font-weight:800; }
.sf__list{ list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.sf__list li a{ opacity:.9; }
.sf__list li a:hover{ opacity:1; }

/* Separador y bottom */
.sf__hr{ border:0; border-top:1px solid rgba(255,255,255,.12); margin:22px 0; }
.sf__bottom{
  display:flex; justify-content:space-between; align-items:center;
  color:#bbb; font-size:13px;
}

/* ===== Desktop ===== */
@media (min-width: 992px){
  .sf__top{
    grid-template-columns: 220px 1fr 240px; /* logo | newsletter | redes */
    align-items:center;
  }
  .sf__newsletter{ text-align:left; }
  .sf__form{ grid-template-columns: 1fr 180px; } /* input | botón */
  .sf__social{ text-align:right; }
  .sf__cols{
    grid-template-columns: repeat(4,1fr);
  }
}

/* =========================================================
   DESKTOP SEARCH – versión final única (no toca móvil)
   ========================================================= */
@media (min-width: 1024px){

  :root{
    --search-max-w: 1240px;  /* ancho total del buscador */
    --search-h: 56px;        /* altura de inputs/botón */
    --search-gap: 14px;      /* separación entre columnas */
    --pill-radius: 12px;     /* borde redondeado */
    --pill-border: 1px solid #e7e7e7;
    --pill-pad-x: 14px;
  }

  /* Tarjeta contenedora */
  .sp-initial-content .main--card{
    max-width: var(--search-max-w);
    margin: 0 auto;
    box-shadow: 0 10px 28px rgba(0,0,0,.06);
    border-radius: 18px;
  }

  /* Fila: Origen/Destino | Ida | Vuelta | Pax | Buscar */
  .main--card--body{
    display: grid !important;
    grid-template-columns: minmax(520px, 2fr) 1fr 1fr .9fr auto;
    gap: var(--search-gap);
    align-items: center;
    padding: 16px 18px 20px;
  }

  /* ---------- Origen / Destino (píldora) ---------- */
  #main-destinations-selector{
    grid-column: 1;
    display: grid;
    grid-template-columns: 1fr 36px 1fr;  /* Origen | ↔ | Destino */
    gap: 10px;
    align-items: center;
    height: var(--search-h);
    background: #fff;
    border: var(--pill-border);
    border-radius: var(--pill-radius);
    padding: 6px 8px;
  }
  #main-destinations-selector .fd-icon{
    position: static;
    margin: 0;
    width: 22px; height: 22px;
    opacity: .8;
  }
  #main-destinations-selector .btn-ig{
    height: calc(var(--search-h) - 12px); /* ~44px */
    border: 0;
    background: transparent;
    padding: 0 10px 0 38px;
  }
  #main-destinations-selector .btn-ig-icon{
    position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
    width: 18px; height: 18px; opacity: .9;
  }
  #main-destinations-selector .btn-ig-label{
    position: static;
    font-size: 11px; color: #8a8a8a; margin-right: 8px; font-weight: 600;
  }
  #main-destinations-selector .btn-ig-text{
    font-size: 14px; font-weight: 800;
  }

  /* ---------- Apariencia homogénea para TODOS los “inputs” ---------- */
  .main--card--body .btn-ig{
    display: flex;
    align-items: center;
    gap: 10px;
    height: var(--search-h);
    background: #fff;
    border: var(--pill-border) !important;
    border-radius: var(--pill-radius);
    padding: 0 var(--pill-pad-x);
    border-bottom: 0 !important; /* quita subrayado verde móvil */
  }
  .main--card--body .btn-ig .btn-ig-icon{
    position: static;
    width: 18px; height: 18px; opacity: .9; margin-right: 4px;
  }
  .main--card--body .btn-ig .btn-ig-label{
    position: static;
    font-size: 12px; font-weight: 600; color: #777;
  }
  .main--card--body .btn-ig .btn-ig-text{
    margin-left: auto; font-weight: 800; font-size: 14px;
  }

  /* ---------- Fechas (col 2 y 3) ---------- */
  .main--card--body > .main--input-group:nth-of-type(1){
    grid-column: 2 / span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;   /* Ida | Vuelta */
    gap: var(--search-gap);
    border: 0;                        /* oculta borde wrapper original */
  }
  /* Respetar “solo ida” */
  #btn-date-back.d-none{ display: none !important; }

  /* ---------- Pasajeros (col 4) ---------- */
  .main--card--body > .main--input-group:nth-of-type(2){
    grid-column: 4;
    border: 0;
  }
  #btn-passengers{ padding: 0 var(--pill-pad-x) 0 44px !important; }
  #btn-passengers .btn-ig-icon{ position: absolute; left: 14px; }

  /* ---------- Botón Buscar (col 5) ---------- */
  #search-flight{
    grid-column: 5;
    min-width: 160px;
    height: var(--search-h) !important;
    border-radius: var(--pill-radius);
    white-space: nowrap;
    box-shadow: 0 6px 14px rgba(0,0,0,.08);
  }

  /* Respira un poquito el header azul */
  .bg-main-card{ padding-top: 8px; }
}

/* ====== DESKTOP – Origen-Destino | Ida-Vuelta | Personas | Buscar ====== */
@media (min-width: 1024px){

  :root{
    --search-max-w: 1240px;   /* ancho total del buscador */
    --h: 56px;                /* alto uniforme de “inputs” y botón */
    --gap: 14px;              /* separación entre columnas */
    --r: 12px;                /* radio de esquinas */
    --b: 1px solid #e7e7e7;   /* borde de las píldoras */
    --px: 14px;               /* padding horizontal interno */
  }

  /* Contenedor principal del buscador */
  .sp-initial-content .main--card{
    max-width: var(--search-max-w);
    margin: 0 auto;
    border-radius: 18px;
    box-shadow: 0 10px 28px rgba(0,0,0,.06);
  }

  /* FILA FINAL:  OD | (Ida,Vuelta) | Pax | Buscar */
  .main--card--body{
    display: grid !important;
    grid-template-columns: minmax(520px, 2fr) 1.2fr .9fr auto; /* ← si quieres más o menos espacio, toca estos */
    gap: var(--gap);
    align-items: center;
    padding: 16px 18px 20px;
  }

  /* Apariencia homogénea para todos los “inputs” tipo botón */
  .main--card--body .btn-ig{
    display:flex; align-items:center; gap:10px;
    height: var(--h);
    background:#fff; border: var(--b) !important; border-radius: var(--r);
    padding: 0 var(--px);
    border-bottom:0 !important; /* quita la línea verde móvil */
  }
  .main--card--body .btn-ig .btn-ig-icon{ position:static; width:18px; height:18px; opacity:.9; }
  .main--card--body .btn-ig .btn-ig-label{ position:static; font-size:12px; font-weight:600; color:#777; }
  .main--card--body .btn-ig .btn-ig-text{ margin-left:auto; font-weight:800; font-size:14px; }

  /* ---- Col 1: Origen | ↔ | Destino (en una sola “píldora”) ---- */
  #main-destinations-selector{
    grid-column: 1;
    display:grid; grid-template-columns: 1fr 36px 1fr; gap:10px; align-items:center;
    height: var(--h); padding:6px 8px; background:#fff; border: var(--b); border-radius: var(--r);
  }
  #main-destinations-selector .fd-icon{ width:22px; height:22px; opacity:.8; justify-self:center; }
  #main-destinations-selector .btn-ig{
    height: calc(var(--h) - 12px); border:0; background:transparent; padding:0 10px 0 38px;
  }
  #main-destinations-selector .btn-ig-icon{
    position:absolute; left:12px; top:50%; transform:translateY(-50%);
  }
  #main-destinations-selector .btn-ig-label{ font-size:11px; color:#8a8a8a; margin-right:8px; }

  /* ---- Col 2: Fechas -> dos columnas dentro ---- */
  .main--card--body > .main--input-group:nth-of-type(1){
    grid-column: 2;
    display:grid; grid-template-columns: 1fr 1fr; gap: var(--gap);
    border:0; /* quita borde del wrapper original */
  }
  #btn-date-back.d-none{ display:none !important; } /* respeta 'solo ida' */

  /* ---- Col 3: Pasajeros ---- */
  .main--card--body > .main--input-group:nth-of-type(2){
    grid-column: 3; border:0;
  }
  #btn-passengers{ padding:0 var(--px) 0 44px !important; }
  #btn-passengers .btn-ig-icon{ position:absolute; left:14px; }

  /* ---- Col 4: Botón Buscar ---- */
  #search-flight{
    grid-column: 4;
    min-width: 160px; height: var(--h) !important;
    border-radius: var(--r); white-space:nowrap;
    box-shadow: 0 6px 14px rgba(0,0,0,.08);
  }

  /* un pelín de “aire” arriba */
  .bg-main-card{ padding-top: 8px; }
}

/* ================================
   PARCHE DESKTOP – buscador alineado
   (PÉGALO AL FINAL DE main.css)
   ================================ */
@media (min-width: 1024px){

  /* Tarjeta y respiración */
  .sp-initial-content .main--card{
    max-width: 1240px;
    margin: 0 auto;
    box-shadow: 0 10px 28px rgba(0,0,0,.06);
    border-radius: 18px;
  }

  /* Header: radios a la izquierda (dejaba centrado) */
  .main--card--header{
    justify-content: flex-start !important;
    padding: 8px 20px 0 !important;
  }
  .main--card--header form{
    margin: 0 !important;
  }

  /* Cuerpo del buscador en una sola fila:
     OD | Ida | Vuelta | Pax | Buscar */
  .main--card--body{
    display: grid !important;
    grid-template-columns: minmax(520px, 2fr) 1fr 1fr .9fr auto;
    gap: 14px;
    align-items: center;
    padding: 16px 18px 20px !important;
    background: #fff;
    border-radius: 16px;
  }

  /* ---------- Origen / Destino ---------- */
  #main-destinations-selector{
    grid-column: 1;
    display: grid;
    grid-template-columns: 1fr 36px 1fr;  /* Origen | ↔ | Destino */
    gap: 10px;
    align-items: center;
    height: 56px;
    background: #fff;
    border: 1px solid #e7e7e7;
    border-radius: 12px;
    padding: 6px 8px;
  }
  #main-destinations-selector .fd-icon{
    position: static !important;
    margin: 0;
    width: 22px; height: 22px; opacity: .8;
  }
  #main-destinations-selector .btn-ig{
    height: 44px; border: 0; background: transparent;
    padding: 0 10px 0 38px;
  }
  #main-destinations-selector .btn-ig-icon{
    position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
    width: 18px;
  }
  #main-destinations-selector .btn-ig-label{
    position: static; font-size: 11px; color: #8a8a8a; margin-right: 8px;
  }
  #main-destinations-selector .btn-ig-text{
    font-size: 14px; font-weight: 800;
  }

  /* ---------- Apariencia homogénea para todos los “inputs” ---------- */
  .main--card--body .btn-ig{
    display: flex; align-items: center; gap: 10px;
    height: 56px; width: 100%;
    border: 1px solid #e7e7e7 !important; border-radius: 12px;
    background: #fff; padding: 0 14px;
    border-bottom: 0 !important; /* anula subrayado verde viejo */
  }
  .main--card--body .btn-ig .btn-ig-icon{
    position: static !important; width: 18px; height: 18px; opacity: .9;
  }
  .main--card--body .btn-ig .btn-ig-label{
    position: static !important; font-size: 12px; font-weight: 600; color: #777;
  }
  .main--card--body .btn-ig .btn-ig-text{
    margin-left: auto; font-weight: 800; font-size: 14px;
  }

  /* ---------- Fechas (col 2 y 3) ---------- */
  .main--card--body > .main--input-group:nth-of-type(1){
    grid-column: 2 / span 2;
    display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
    border: 0 !important;
  }
  #btn-date-back.d-none{ display: none !important; } /* respeta "Solo ida" */

  /* ---------- Pasajeros (col 4) ---------- */
  .main--card--body > .main--input-group:nth-of-type(2){
    grid-column: 4; border: 0 !important;
  }
  #btn-passengers{ padding: 0 14px 0 44px !important; }
  #btn-passengers .btn-ig-icon{ position: absolute; left: 14px; }

  /* ---------- Botón Buscar (col 5) ---------- */
  #search-flight{
    grid-column: 5;
    min-width: 170px;
    height: 56px !important;
    border-radius: 12px !important;
    white-space: nowrap;
    box-shadow: 0 6px 14px rgba(0,0,0,.08);
    justify-self: end;                 /* empuja a la derecha */
  }

  /* Botón negro: altura y padding parejos */
  .btn.btn-black{
    height: 56px; padding: 0 26px; border: none; border-radius: 12px;
  }

  /* Un poquito menos de aire arriba del header azul */
  .bg-main-card{ padding-top: 8px !important; }
}

/* ===== PARCHE FINAL – Desktop (min-width:1024px) ===== */
@media (min-width:1024px){

  /* 1) Asegura los radios a la izquierda */
  .main--card--header{
    justify-content:flex-start !important;
    padding:8px 20px 0 !important;
  }

  /* 2) 5 columnas: OD | Ida | Vuelta | Pax | Buscar */
  .main--card--body{
    display:grid !important;
    grid-template-columns:minmax(520px,2fr) 1fr 1fr .9fr auto;
    gap:14px;
    align-items:center;
    padding:16px 18px 20px !important;
    background:#fff;
    border-radius:16px;
  }

  /* 3) Elimina BORDES del WRAPPER genérico (causaban las líneas) */
  .main--card--body .main--input-group{
    border:0 !important;
    background:transparent !important;
  }

  /* 4) Origen–↔–Destino como UNA píldora limpia */
  #main-destinations-selector{
    grid-column:1;
    display:grid;
    grid-template-columns:1fr 36px 1fr; /* Origen | ↔ | Destino */
    gap:10px;
    align-items:center;
    height:56px;
    background:#fff;
    border:1px solid #e7e7e7;
    border-radius:12px;
    padding:6px 8px;
  }
  /* si dentro tienes un .main--input-group, quítale todo para evitar doble marco */
  #main-destinations-selector .main--input-group{
    border:0 !important;
    background:transparent !important;
    padding:0 !important;
    box-shadow:none !important;
  }
  #main-destinations-selector .fd-icon{
    width:22px; height:22px; opacity:.8;
    margin:0; position:static !important;
  }
  #main-destinations-selector .btn-ig{
    height:44px; border:0; background:transparent;
    padding:0 10px 0 38px;
  }
  #main-destinations-selector .btn-ig-icon{
    position:absolute; left:12px; top:50%; transform:translateY(-50%);
    width:18px; height:18px; opacity:.9;
  }
  #main-destinations-selector .btn-ig-label{
    position:static; font-size:11px; color:#8a8a8a; margin-right:8px; font-weight:600;
  }
  #main-destinations-selector .btn-ig-text{
    font-size:14px; font-weight:800;
  }

  /* 5) Apariencia uniforme para TODOS los “inputs” tipo botón */
  .main--card--body .btn-ig{
    display:flex; align-items:center; gap:10px;
    height:56px; width:100%;
    border:1px solid #e7e7e7 !important; border-radius:12px;
    background:#fff; padding:0 14px;
    border-bottom:0 !important; /* mata el subrayado verde del modo móvil */
  }
  .main--card--body .btn-ig .btn-ig-icon{ position:static !important; width:18px; height:18px; opacity:.9; }
  .main--card--body .btn-ig .btn-ig-label{ position:static !important; font-size:12px; font-weight:600; color:#777; }
  .main--card--body .btn-ig .btn-ig-text{ margin-left:auto; font-weight:800; font-size:14px; }

  /* 6) Fechas – dos columnas dentro de su hueco (sin bordes extra) */
  .main--card--body > .main--input-group:nth-of-type(1){
    grid-column:2 / span 2;
    display:grid; grid-template-columns:1fr 1fr; gap:14px;
    border:0 !important;
  }
  #btn-date-back.d-none{ display:none !important; } /* respeta “Solo ida” */

  /* 7) Pasajeros – sin borde wrapper */
  .main--card--body > .main--input-group:nth-of-type(2){
    grid-column:4; border:0 !important;
  }
  #btn-passengers{ padding:0 14px 0 44px !important; }
  #btn-passengers .btn-ig-icon{ position:absolute; left:14px; }

  /* 8) Botón Buscar – derecha, alto parejo */
  #search-flight{
    grid-column:5;
    min-width:170px;
    height:56px !important;
    border-radius:12px !important;
    white-space:nowrap;
    box-shadow:0 6px 14px rgba(0,0,0,.08);
    justify-self:end;                   /* empuja a la derecha */
  }
  .btn.btn-black{ height:56px; padding:0 26px; border:none; border-radius:12px; }

  /* 9) Un poco menos de aire en el header azul */

/* ===== BUSCADOR DESKTOP (único) – OD | Ida | Vuelta | Pax | Buscar ===== */
@media (min-width:1024px){
  :root{
    --search-max-w:1240px;
    --h:56px;
    --gap:14px;
    --r:12px;
    --b:1px solid #e7e7e7;
    --px:14px;
  }

  /* Tarjeta contenedora (no toca el fondo azul) */
  .sp-initial-content .main--card{
    max-width:var(--search-max-w);
    margin:0 auto;
    border-radius:18px;
    box-shadow:0 10px 28px rgba(0,0,0,.06);
  }

  /* Radios arriba, a la izquierda */
  .main--card--header{
    justify-content:flex-start !important;
    padding:8px 20px 0 !important;
  }
  .main--card--header form{ margin:0 !important; }

  /* FILA: OD | Ida | Vuelta | Pax | Buscar */
  .main--card--body{
    display:grid !important;
    grid-template-columns:minmax(520px,2fr) 1fr 1fr .9fr auto; /* ← clave: 5 columnas */
    gap:var(--gap);
    align-items:center;
    padding:16px 18px 20px !important;
    background:#fff;
    border-radius:16px;
  }

  /* El wrapper genérico NO dibuja bordes (evita líneas dobles) */
  .main--card--body .main--input-group{
    border:0 !important;
    background:transparent !important;
  }

  /* ---------- Origen/Destino como una sola “píldora” ---------- */
  #main-destinations-selector{
    grid-column:1;
    display:grid; grid-template-columns:1fr 36px 1fr; gap:10px; align-items:center;
    height:var(--h);
    background:#fff; border:var(--b); border-radius:var(--r);
    padding:6px 8px;
  }
  #main-destinations-selector .fd-icon{
    position:static !important; margin:0; width:22px; height:22px; opacity:.8;
  }
  #main-destinations-selector .btn-ig{
    height:calc(var(--h) - 12px);
    border:0; background:transparent; padding:0 10px 0 38px;
  }
  #main-destinations-selector .btn-ig-icon{
    position:absolute; left:12px; top:50%; transform:translateY(-50%);
    width:18px; height:18px; opacity:.9;
  }
  #main-destinations-selector .btn-ig-label{
    position:static; font-size:11px; color:#8a8a8a; margin-right:8px; font-weight:600;
  }
  #main-destinations-selector .btn-ig-text{ font-size:14px; font-weight:800; }

  /* ---------- Apariencia homogénea para TODOS los “inputs” ---------- */
  .main--card--body .btn-ig{
    display:flex; align-items:center; gap:10px;
    height:var(--h); width:100%;
    background:#fff; border:var(--b) !important; border-radius:var(--r);
    padding:0 var(--px);
    border-bottom:0 !important; /* quita subrayado verde móvil */
  }
  .main--card--body .btn-ig .btn-ig-icon{ position:static; width:18px; height:18px; opacity:.9; }
  .main--card--body .btn-ig .btn-ig-label{ position:static; font-size:12px; font-weight:600; color:#777; }
  .main--card--body .btn-ig .btn-ig-text{ margin-left:auto; font-weight:800; font-size:14px; }

  /* ---------- Fechas (Ida | Vuelta) en 2 columnas internas ---------- */
  .main--card--body > .main--input-group:nth-of-type(1){
    grid-column:2 / span 2;
    display:grid; grid-template-columns:1fr 1fr; gap:var(--gap);
    border:0 !important;
  }
  #btn-date-back.d-none{ display:none !important; } /* respeta “Solo ida” */

  /* ---------- Pasajeros ---------- */
  .main--card--body > .main--input-group:nth-of-type(2){
    grid-column:4; border:0 !important;
  }
  #btn-passengers{ padding:0 var(--px) 0 44px !important; }
  #btn-passengers .btn-ig-icon{ position:absolute; left:14px; }

  /* ---------- Botón Buscar (a la derecha, misma altura) ---------- */
  #search-flight{
    grid-column:5;
    min-width:170px;
    height:var(--h) !important;
    border-radius:var(--r) !important;
    white-space:nowrap;
    box-shadow:0 6px 14px rgba(0,0,0,.08);
    justify-self:end; /* queda al lado de Pasajeros y pegado a la derecha */
  }
  .btn.btn-black{ height:var(--h); padding:0 26px; border:none; border-radius:var(--r); }

  /* Un pelín menos de aire arriba en el header azul */
  .bg-main-card{ padding-top:8px !important; }
}
