/* Páginas interiores · franquiciaagenciadeviajes.com
   Se carga después de estilos.css. Estilo de revista de viajes: hero con video,
   bordes en curva, fotos en formas orgánicas y nada de recuadros. */

:root {
  --curva-1: 62% 38% 46% 54% / 48% 56% 44% 52%;
  --curva-2: 40% 60% 58% 42% / 55% 40% 60% 45%;
  --curva-3: 54% 46% 38% 62% / 42% 58% 42% 58%;
  --curva-4: 46% 54% 64% 36% / 60% 44% 56% 40%;
  --cielo: #eef0ff;
}

body.interior { background: #fbfaff; }
.interior .cabecera { background: rgba(251, 250, 255, .9); }

/* ---------- Hero con video ---------- */
.hv { position: relative; isolation: isolate; color: #fff; min-height: 640px; display: flex; align-items: center; padding: 70px 0 170px; overflow: hidden; }
.hv-video, .hv-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -3; }
.hv::before { content: ''; position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(7, 0, 58, .82) 0%, rgba(12, 0, 87, .55) 45%, rgba(12, 0, 87, .1) 100%), linear-gradient(0deg, rgba(7, 0, 58, .35), transparent 40%); }
.hv-ola { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: 120px; z-index: -1; display: block; }
.hv-in { display: grid; grid-template-columns: 1.15fr .85fr; gap: 40px; align-items: center; }
.migas { font-size: 13.5px; margin-bottom: 18px; color: rgba(255,255,255,.8); }
.migas a { color: #fff; text-decoration: none; }
.migas a:hover { text-decoration: underline; }
.migas span { margin: 0 6px; opacity: .6; }
.hv .ceja { color: var(--lila); letter-spacing: .12em; text-transform: uppercase; font-size: 13px; margin-bottom: 14px; }
.hv h1 { color: #fff; font-size: clamp(38px, 5vw, 62px); font-weight: 800; line-height: 1.05; margin-bottom: 20px; max-width: 640px; }
.hv h1 em { font-family: var(--mano); font-style: normal; font-weight: 700; color: var(--lila); font-size: 1.12em; display: inline-block; transform: rotate(-2deg); }
.hv .lead { color: rgba(255,255,255,.88); max-width: 540px; }
.hv .acciones { margin-bottom: 0; }
.btn-claro { background: rgba(255,255,255,.14); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.6); backdrop-filter: blur(6px); }
.btn-claro:hover { background: rgba(255,255,255,.24); }
.hv-ficha { justify-self: end; position: relative; width: min(320px, 100%); background: rgba(255,255,255,.96); color: var(--tinta); border-radius: 30px 30px 30px 8px; padding: 22px 24px; box-shadow: 0 30px 60px rgba(7,0,58,.35); animation: flotar 6s ease-in-out infinite; }
.hv-ficha .mano { color: var(--rojo); font-size: 22px; line-height: 1; }
.hv-ficha b { display: block; font: 800 34px/1.1 var(--titulo); color: var(--marino); margin: 2px 0 4px; }
.hv-ficha p { margin: 0; font-size: 14.5px; color: var(--suave); }
.hv-nota { position: absolute; top: -54px; right: 10px; font: 700 22px/1 var(--mano); color: #fff; transform: rotate(-6deg); display: flex; align-items: center; gap: 6px; }
.hv-nota svg { width: 90px; height: 40px; }
.hv-pausa { position: absolute; right: 22px; bottom: 120px; z-index: 2; width: 42px; height: 42px; border-radius: 50%; border: 0; background: rgba(255,255,255,.18); color: #fff; display: grid; place-items: center; cursor: pointer; backdrop-filter: blur(6px); }
.hv-pausa:hover { background: rgba(255,255,255,.3); }

/* ---------- Secciones ---------- */
.bloque { position: relative; padding: 90px 0; }
.bloque-cielo { background: var(--cielo); }
.ola-sep { display: block; width: 100%; height: 90px; margin-bottom: -1px; }
.ola-sep.abajo { margin: -1px 0 0; }
.cabeza-izq { max-width: 640px; margin-bottom: 40px; }
.cabeza-izq .ceja, .cabeza .ceja { letter-spacing: .1em; text-transform: uppercase; font-size: 13px; }
h2 em { font-family: var(--mano); font-style: normal; font-weight: 700; color: var(--rojo); font-size: 1.12em; }
.texto-suave { color: var(--suave); font-size: 17px; }

/* ---------- Collage de fotos en formas curvas ---------- */
.mision { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.collage { position: relative; height: 520px; }
.collage figure { position: absolute; margin: 0; overflow: hidden; box-shadow: 0 24px 50px rgba(12,0,87,.18); transition: transform .5s ease, border-radius 1.2s ease; }
.collage figure img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.collage figure:hover img { transform: scale(1.08); }
.collage .f1 { width: 56%; height: 64%; left: 0; top: 0; border-radius: var(--curva-1); }
.collage .f2 { width: 46%; height: 46%; right: 0; top: 6%; border-radius: var(--curva-2); }
.collage .f3 { width: 62%; height: 46%; right: 4%; bottom: 0; border-radius: var(--curva-3); }
.collage:hover .f1 { border-radius: var(--curva-4); }
.collage .garabato { position: absolute; left: 4%; bottom: 6%; width: 120px; height: 90px; color: var(--lila); }
.iconos-circ { list-style: none; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; text-align: center; }
.iconos-circ li { font: 600 14px/1.3 var(--texto); color: var(--marino); }
.iconos-circ .circ { display: grid; place-items: center; width: 66px; height: 66px; margin: 0 auto 10px; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1.5px var(--lila), var(--sombra-chica); color: var(--marino); transition: transform .3s ease, background .3s ease, color .3s ease; }
.iconos-circ li:hover .circ { transform: scale(1.12); background: var(--marino); color: #fff; }
.iconos-circ img { width: 40px; height: 40px; object-fit: contain; }

/* ---------- Tarjetas con foto curva (sin recuadro) ---------- */
.curvas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px 30px; }
.curvas.cuatro { grid-template-columns: repeat(4, 1fr); }
.curva { text-align: left; }
.curva figure { margin: 0 0 18px; aspect-ratio: 5 / 4; overflow: hidden; border-radius: var(--curva-2); box-shadow: 0 18px 40px rgba(12,0,87,.14); transition: border-radius 1s ease, transform .4s ease; }
.curva:nth-child(3n+2) figure { border-radius: var(--curva-3); }
.curva:nth-child(3n) figure { border-radius: var(--curva-1); }
.curva:hover figure { transform: translateY(-6px); border-radius: var(--curva-4); }
.curva figure img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.curva:hover figure img { transform: scale(1.07); }
.curva h3 { font-size: 20px; margin-bottom: 6px; }
.curva p { color: var(--suave); font-size: 15.5px; margin-bottom: 8px; }
.curva .precio-chico { font: 800 18px/1.2 var(--titulo); color: var(--rojo); }
.icono-flota { display: grid; place-items: center; width: 74px; height: 74px; border-radius: 50%; background: #fff; box-shadow: var(--sombra-chica); margin-bottom: 16px; }
.icono-flota img { width: 50px; height: 50px; object-fit: contain; }

/* ---------- Ruta curva de pasos ---------- */
.ruta { position: relative; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; counter-reset: r; }
.ruta::before { content: ''; position: absolute; left: 6%; right: 6%; top: 34px; height: 60px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 60' preserveAspectRatio='none'%3E%3Cpath d='M0 30 C 120 -10, 250 70, 375 30 S 625 -10, 750 30 S 900 70, 1000 30' fill='none' stroke='%23a9a3ff' stroke-width='3' stroke-dasharray='10 10'/%3E%3C/svg%3E") center / 100% 100% no-repeat; z-index: 0; }
.ruta li { position: relative; z-index: 1; text-align: center; }
.ruta li::before { counter-increment: r; content: counter(r); display: grid; place-items: center; width: 68px; height: 68px; margin: 0 auto 16px; border-radius: 50%; background: var(--marino); color: #fff; font: 800 24px/1 var(--titulo); box-shadow: 0 0 0 8px #fbfaff, 0 14px 26px rgba(12,0,87,.25); }
.bloque-cielo .ruta li::before { box-shadow: 0 0 0 8px var(--cielo), 0 14px 26px rgba(12,0,87,.25); }
.ruta li:nth-child(even)::before { background: var(--rojo); }
.ruta h3 { font-size: 18px; }
.ruta p { color: var(--suave); font-size: 15px; margin: 0; }

/* ---------- Listas suaves (sin cajas) ---------- */
.puntos-check { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.puntos-check li { display: flex; gap: 12px; align-items: flex-start; }
.puntos-check li::before { content: ''; flex: none; width: 26px; height: 26px; margin-top: 1px; border-radius: 50%; background: var(--lila-claro) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230c0057' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 14px no-repeat; }
.puntos-check b { color: var(--marino); }
.dos-col { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }

/* ---------- Planes en burbujas ---------- */
.burbujas { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; align-items: end; }
.burbuja { position: relative; text-align: center; padding: 40px 24px 30px; background: #fff; border-radius: 120px 120px 40px 40px; box-shadow: 0 20px 44px rgba(12,0,87,.10); transition: transform .35s ease, box-shadow .35s ease; }
.burbuja:hover { transform: translateY(-8px) scale(1.02); box-shadow: 0 28px 56px rgba(12,0,87,.18); }
.burbuja.destacada { background: linear-gradient(170deg, var(--marino), #2a1a99); color: #fff; padding-top: 54px; }
.burbuja.destacada h3, .burbuja.destacada .monto { color: #fff; }
.burbuja.destacada p, .burbuja.destacada small { color: rgba(255,255,255,.8); }
.burbuja .sello { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); background: var(--rojo); color: #fff; font: 700 12px/1 var(--texto); padding: 8px 14px; border-radius: 999px; white-space: nowrap; }
.burbuja h3 { font-size: 22px; margin-bottom: 4px; }
.burbuja .monto { font: 800 36px/1.1 var(--titulo); color: var(--marino); margin: 8px 0 0; }
.burbuja small { display: block; color: var(--suave); margin-bottom: 14px; }
.burbuja p { font-size: 14.5px; color: var(--suave); margin-bottom: 18px; }
.burbuja .btn { padding: 12px 20px; font-size: 14.5px; }

/* ---------- Tabla suave ---------- */
.tabla-suave { width: 100%; border-collapse: separate; border-spacing: 0 8px; font-size: 15px; min-width: 680px; }
.tabla-suave th, .tabla-suave td { padding: 14px 16px; text-align: center; background: #fff; }
.tabla-suave th:first-child, .tabla-suave td:first-child { text-align: left; border-radius: 999px 0 0 999px; padding-left: 26px; }
.tabla-suave th:last-child, .tabla-suave td:last-child { border-radius: 0 999px 999px 0; padding-right: 26px; }
.tabla-suave thead th { background: var(--marino); color: #fff; font: 700 14px/1.2 var(--titulo); }
.tabla-suave tbody th { font-weight: 600; color: var(--tinta); }
.tabla-suave .si { color: var(--wa-oscuro); font-weight: 800; }
.tabla-suave .no { color: #c0bdd6; }
.tabla-suave tr.nuestra td, .tabla-suave tr.nuestra th { background: var(--lila-claro); font-weight: 700; color: var(--marino); }
.desliza-x { overflow-x: auto; padding-bottom: 6px; }

/* ---------- Agencias con local ---------- */
.agencias { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 46px 50px; }
.agencia { display: grid; grid-template-columns: 86px 1fr; gap: 20px; align-items: start; }
.agencia .pin { display: grid; place-items: center; width: 86px; height: 86px; border-radius: 50% 50% 50% 8px; background: linear-gradient(150deg, var(--lila), #7d74f2); color: #fff; transform: rotate(-45deg); box-shadow: 0 14px 28px rgba(125,116,242,.35); transition: transform .35s ease; }
.agencia .pin span { transform: rotate(45deg); font: 800 15px/1 var(--titulo); text-align: center; }
.agencia:hover .pin { transform: rotate(-45deg) scale(1.08); }
.agencia h3 { font-size: 21px; margin-bottom: 2px; }
.agencia .ciudad { font: 700 18px/1 var(--mano); color: var(--rojo); display: block; margin-bottom: 8px; }
.agencia address { font-style: normal; color: var(--suave); font-size: 15px; margin-bottom: 10px; }
.agencia .contactos { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 14.5px; }
.agencia .contactos a { color: var(--marino); font-weight: 600; }

/* ---------- Línea del tiempo curva ---------- */
.tiempo { list-style: none; margin: 0; padding: 0; position: relative; }
.tiempo::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 60px; margin-left: -30px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 400' preserveAspectRatio='none'%3E%3Cpath d='M30 0 C 60 50, 0 100, 30 150 S 60 250, 30 300 S 0 370, 30 400' fill='none' stroke='%23a9a3ff' stroke-width='3' stroke-dasharray='9 9'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.tiempo li { position: relative; width: 50%; padding: 0 56px 40px 0; text-align: right; }
.tiempo li:nth-child(even) { margin-left: 50%; padding: 0 0 40px 56px; text-align: left; }
.tiempo li::after { content: ''; position: absolute; top: 4px; right: -11px; width: 22px; height: 22px; border-radius: 50%; background: var(--rojo); box-shadow: 0 0 0 6px var(--lila-claro); }
.tiempo li:nth-child(even)::after { right: auto; left: -11px; background: var(--marino); }
.tiempo b { display: block; font: 800 30px/1 var(--titulo); color: var(--marino); margin-bottom: 6px; }
.tiempo p { margin: 0; color: var(--suave); }

/* ---------- Cifras ---------- */
.cifras { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 26px; }
.cifras li { width: 190px; height: 190px; display: grid; place-content: center; text-align: center; border-radius: var(--curva-1); background: #fff; box-shadow: 0 18px 40px rgba(12,0,87,.1); padding: 18px; font-size: 14px; color: var(--suave); transition: border-radius 1s ease, transform .35s ease; }
.cifras li:nth-child(even) { border-radius: var(--curva-3); }
.cifras li:hover { border-radius: 50%; transform: scale(1.06); }
.cifras b { display: block; font: 800 36px/1.05 var(--titulo); color: var(--marino); margin-bottom: 4px; }

/* ---------- Persona en círculo ---------- */
.persona-circ { display: grid; grid-template-columns: 300px 1fr; gap: 50px; align-items: center; }
.persona-circ figure { margin: 0; position: relative; }
.persona-circ figure img { width: 300px; height: 300px; object-fit: cover; border-radius: var(--curva-1); box-shadow: 0 24px 50px rgba(12,0,87,.2); }
.persona-circ figure::after { content: ''; position: absolute; inset: -14px; border: 2px dashed var(--lila); border-radius: var(--curva-3); z-index: -1; }

/* ---------- Aviso suave ---------- */
.aviso-suave { display: flex; gap: 16px; align-items: flex-start; padding: 22px 26px; border-radius: 40px 40px 40px 12px; background: linear-gradient(120deg, rgba(249,0,0,.07), rgba(169,163,255,.18)); color: var(--tinta); }
.aviso-suave .ico { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #fff; color: var(--rojo); font: 800 20px/1 var(--titulo); }
.aviso-suave p { margin: 0; }

/* ---------- Preguntas sin cajas ---------- */
.faq-suave details { background: transparent; border: 0; box-shadow: none; border-bottom: 1.5px dashed var(--borde); border-radius: 0; margin: 0; }
.faq-suave summary { padding: 20px 50px 20px 0; }
.faq-suave summary::after { right: 0; }
.faq-suave details p { padding: 0 0 20px; }

/* ---------- Cierre con foto curva ---------- */
.cierre { display: grid; grid-template-columns: .9fr 1.1fr; gap: 50px; align-items: center; }
.cierre figure { margin: 0; aspect-ratio: 1 / 1; border-radius: var(--curva-4); overflow: hidden; box-shadow: 0 30px 60px rgba(12,0,87,.2); }
.cierre figure img { width: 100%; height: 100%; object-fit: cover; }
.cierre .datos a { color: var(--marino); }
.cierre .datos { color: var(--tinta); }
.cierre .datos svg { color: var(--rojo); }
.firma { font: 700 26px/1.1 var(--mano); color: var(--suave); transform: rotate(-4deg); display: inline-block; margin-top: 18px; }

/* ---------- 404 ---------- */
.hv-404 { min-height: 86vh; }
.hv-404 h1 { font-size: clamp(44px, 7vw, 86px); }
.enlaces-404 { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.enlaces-404 a { color: #fff; text-decoration: none; font-weight: 600; padding: 10px 16px; border-radius: 999px; background: rgba(255,255,255,.14); }
.enlaces-404 a:hover { background: rgba(255,255,255,.28); }

/* ---------- Responsivo ---------- */
@media (max-width: 1000px) {
  .burbujas, .curvas.cuatro { grid-template-columns: repeat(2, 1fr); row-gap: 36px; }
  .ruta { grid-template-columns: repeat(2, 1fr); row-gap: 40px; }
  .ruta::before { display: none; }
}
@media (max-width: 900px) {
  .hv { min-height: 0; padding: 50px 0 150px; }
  .hv-in, .mision, .dos-col, .cierre, .persona-circ { grid-template-columns: 1fr; }
  .hv-ficha { justify-self: start; }
  .hv-nota { display: none; }
  .collage { height: 420px; max-width: 520px; width: 100%; margin: 0 auto; }
  .curvas { grid-template-columns: 1fr 1fr; }
  .agencias { grid-template-columns: 1fr; }
  .cierre figure { max-width: 420px; }
  .persona-circ figure { justify-self: center; }
}
@media (max-width: 600px) {
  .hv { padding: 36px 0 120px; }
  .hv::before { background: linear-gradient(180deg, rgba(7,0,58,.78), rgba(12,0,87,.6)); }
  .hv-ola { height: 70px; }
  .hv-pausa { bottom: 80px; right: 14px; }
  .bloque { padding: 64px 0; }
  .ola-sep { height: 50px; }
  .collage { height: 340px; }
  .iconos-circ { grid-template-columns: repeat(2, 1fr); row-gap: 22px; }
  .curvas, .curvas.cuatro, .burbujas, .ruta { grid-template-columns: 1fr; }
  .burbuja { border-radius: 90px 90px 34px 34px; }
  .agencia { grid-template-columns: 64px 1fr; gap: 16px; }
  .agencia .pin { width: 64px; height: 64px; }
  .agencia .pin span { font-size: 12px; }
  .tiempo::before { left: 10px; margin-left: -30px; }
  .tiempo li, .tiempo li:nth-child(even) { width: 100%; margin-left: 0; padding: 0 0 32px 40px; text-align: left; }
  .tiempo li::after, .tiempo li:nth-child(even)::after { left: -1px; right: auto; }
  .cifras li { width: 150px; height: 150px; }
  .cifras b { font-size: 28px; }
  .persona-circ figure img { width: 240px; height: 240px; }
}
@media (prefers-reduced-motion: reduce) {
  .hv-video { display: none; }
}