/* Aubiasi: estilos comunes tomados de aubiasi-website (Nunito, Baloo 2, coral #EB624D, azul marino #0E2240, dorado #D6A860) */
* { -webkit-tap-highlight-color: transparent; }
body { font-family: 'Nunito', system-ui, sans-serif; background: #F4F7FC; color: #1e293b; }
.font-display { font-family: 'Baloo 2', sans-serif; }
:focus-visible { outline: 3px solid #EB624D; outline-offset: 3px; }

/* Los titulares del sitio usan Baloo 2 */
h1, h2 { font-family: 'Baloo 2', sans-serif; }

/* HERO ilustrado: el cielo de la ilustración se prolonga; el titular va sobre cielo liso */
.hero-d { --H: clamp(260px, 36vw, 560px); background: #3aace0; position: relative; padding-top: 78px; }
.hero-d .titular { position: absolute; left: 0; right: 0; top: 0; height: calc(78px + var(--H) * 0.40); z-index: 2; display: flex; flex-direction: column; justify-content: center; text-align: center; padding: 0 16px; max-width: 900px; margin: 0 auto; }
.hero-d h1 { font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: clamp(34px, 5.6vw, 68px); line-height: 1.02; color: #0e2343; animation: baja .9s cubic-bezier(.2,.7,.2,1) both; }
.hero-d .titular p { margin-top: 12px; font-weight: 700; font-size: clamp(15px, 1.6vw, 19px); color: #0b2a4d; }
.escena { display: block; width: 100%; height: var(--H); object-fit: cover; object-position: center bottom;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 20%); mask-image: linear-gradient(to bottom, transparent 0, #000 20%); }
.busca-d { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, calc(100% - 78px)); width: min(1240px, calc(100% - 32px)); z-index: 3; }
@keyframes baja { from { opacity: 0; transform: translateY(-18px); } }
@media (prefers-reduced-motion: reduce) { .hero-d h1 { animation: none; } }
@media (max-width: 1279px) { .busca-d { transform: translate(-50%, calc(100% - 60px)); } }
@media (max-width: 760px) {
  .hero-d { padding-top: 0; padding-bottom: 28px; background: linear-gradient(#3aace0 calc(100% - 88px), #fff 0); }
  .hero-d .titular { position: relative; top: auto; height: auto; padding-top: 32px; }
  .escena { object-position: 18% bottom; height: 260px; margin-top: -44px; -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 30%); mask-image: linear-gradient(to bottom, transparent 0, #000 30%); }
  .busca-d { position: relative; left: auto; bottom: auto; transform: none; margin: -14px auto 0; }
}

/* Selectores con flecha de la marca */
select.flecha-au {
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23EB624D' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
  background-repeat: no-repeat; background-position: right 0 center; background-size: 1rem; padding-right: 1.5rem;
}

/* Stepper de pasajeros */
.step-btn { width: 36px; height: 36px; border-radius: 10px; background: #EEF2F8; font-weight: 700; color: #0E2240; transition: background .2s; }
.step-btn:hover { background: #dfe6f1; }

/* Encabezado de las páginas interiores: banda coral con titular grande, como en el diseño original */
.banda-au { background: #EB624D; color: #fff; }
.banda-au h1 { font-weight: 800; letter-spacing: -.01em; line-height: 1.05; }
.banda-au .etiqueta { font-family: 'Baloo 2', sans-serif; font-weight: 800; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: #fff; opacity: .95; }

/* Tarjetas y botones de la marca */
.tarjeta-au { background: #fff; border-radius: 1.5rem; box-shadow: 0 20px 45px -15px rgba(14, 34, 64, 0.08); border: 1px solid rgba(226, 232, 240, .8); }
.boton-au { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .85rem 1.5rem; border-radius: .9rem; background: #EB624D; color: #fff; font-family: 'Baloo 2', sans-serif; font-weight: 800; transition: background .2s; box-shadow: 0 12px 30px -8px rgba(235, 98, 77, 0.45); }
.boton-au:hover { background: #D44A36; }
.boton-au.marino { background: #0E2240; box-shadow: none; }
.boton-au.marino:hover { background: #EB624D; }

/* Titulares, cifras y botones destacados en Baloo 2, como en el diseño original */
h3, h4, .font-black, .font-extrabold { font-family: 'Baloo 2', sans-serif; }