:root{
  --orange:#E85A17;
  --yellow:#FFC83D;

  --blue-main:#2F6BFF;
  --blue-soft:#EAF5FF;
  --blue-line:#9fd1ff;
  --blue-dark:#0f2a5a;
  --border-soft:rgba(15,42,90,.08);

  --text-main:#0f1a2e;
  --text-sub:#4a566c;

  --shadow-card:0 24px 48px rgba(0,0,0,.06);
  --shadow-strong:0 24px 48px rgba(0,0,0,.12);
  --shadow-small:0 10px 24px rgba(0,0,0,.06);

  --line-fade: linear-gradient(
    90deg,
    rgba(47,155,255,0) 0%,
    rgba(47,155,255,.5) 20%,
    rgba(47,155,255,0) 80%
  );
}

/* RESET */
*{box-sizing:border-box}
html,body{
  margin:0;
  font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto;
  scroll-behavior:smooth;
  color:var(--text-main);
  background:#fff;
  overflow-x:hidden;
}
a{ color:var(--blue-main); text-decoration:none; }
img{ max-width:100%; display:block }
.container{ width:min(1120px,92%); margin-inline:auto }

/* Fondo general con arte sutil */
body{
  background:
    radial-gradient(circle at 20% 15%, rgba(159,209,255,.25) 0%, rgba(255,255,255,0) 60%),
    radial-gradient(circle at 80% 10%, rgba(255,200,61,.15) 0%, rgba(255,255,255,0) 60%),
    #ffffff;
  background-attachment: fixed;
}

/* Arte por sección */
.section-bg-art{ position:relative; isolation:isolate; overflow:hidden; }
.section-bg-art::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(circle at 15% 20%,rgba(47,107,255,.07)0%,rgba(0,0,0,0)60%),
    radial-gradient(circle at 80% 70%,rgba(255,200,61,.08)0%,rgba(0,0,0,0)70%);
  opacity:.6; pointer-events:none; z-index:-2;
}
.section-bg-art::after{
  content:""; position:absolute; inset:0;
  background-image:repeating-radial-gradient(circle at 10% 10%, rgba(47,107,255,.12)0 2px, transparent 2px 40px);
  opacity:.06; pointer-events:none; z-index:-1;
}

/* barra decorativa */
.accent-bar{ position:relative; padding-top:12px; margin-top:0; }
.accent-bar::before{
  content:""; position:absolute; top:0; left:0; width:120px; height:3px;
  border-radius:3px; background:var(--line-fade);
}

/* Splash */
.splash{ position:fixed; inset:0; display:grid; place-items:center; background:#fff; z-index:9999; animation:fadeOut .6s ease both; animation-delay:2s; }
.splash img{ width:min(280px,60vw) }
@keyframes fadeOut{ to{ opacity:0; visibility:hidden } }
.hidden{ display:none }

/* Selector idioma */
.lang-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.55); display:grid; place-items:center; z-index:9998; color:#000; }
.lang-card{ background:#fff; border-radius:12px; padding:28px; box-shadow:var(--shadow-card); text-align:center; width:min(520px,92%); border:1px solid var(--border-soft); }
.lang-card img{ width:150px; margin-inline:auto }
.lang-actions{ display:flex; gap:12px; justify-content:center; margin-top:16px }

/* Cookie bar */
.cookiebar{ position:fixed; left:0; right:0; bottom:0; background:#0f1a2e; color:#fff; z-index:9997; display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:center; padding:12px 16px; font-size:14px }
.cookiebar p{ margin:0 }

/* Botones */
.btn{ padding:10px 16px; border-radius:8px; border:2px solid transparent; cursor:pointer; font-weight:700; font-size:14px; line-height:1.2 }
.btn-primary{ background:var(--orange); color:#fff }
.btn-secondary{ background:var(--yellow); color:#111 }
.btn-outline{ background:#fff; border-color:var(--blue-main); color:var(--blue-main) }
.btn-outline:hover{ background:var(--blue-main); color:#fff }

/* HEADER */
.site-header.fixed{ position:sticky; top:0; z-index:100; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.04); border-bottom:1px solid var(--border-soft); color:var(--text-main) }
.header-inner{ min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:16px }
.brand{ display:flex; align-items:center; justify-content:center }
.brand img{ height:46px; filter:drop-shadow(0 4px 6px rgba(0,0,0,.15)) }

/* nav desktop */
.nav{ display:flex; gap:22px; align-items:center; transition:.25s ease }
.nav a{ font-weight:600; color:var(--text-main); font-size:14px }
.nav a:hover{ color:var(--orange) }

/* acciones header */
.header-actions{ display:flex; align-items:center; gap:12px }
.lang-switch{ border:1px solid var(--border-soft); background:#fff; color:var(--text-main); border-radius:8px; padding:6px 10px; cursor:pointer; font-size:14px; box-shadow:var(--shadow-small) }

/* burger mobile */
.burger{ display:none; flex-direction:column; gap:5px; background:transparent; border:0; cursor:pointer; width:32px; height:32px; position:relative; z-index:110 }
.burger span{ width:26px; height:3px; background:var(--text-main); border-radius:2px; transition:.25s ease; transform-origin:center; position:relative }
.burger.active span:nth-child(1){ transform:translateY(8px) rotate(45deg) }
.burger.active span:nth-child(2){ opacity:0 }
.burger.active span:nth-child(3){ transform:translateY(-8px) rotate(-45deg) }

/* HERO (se mantiene como la versión que ya acordamos) */
.hero-card{ padding:0; border-bottom:1px solid rgba(15,42,90,.06) }
.hero-wrapper{ width:100%; max-width:100%; padding:0; margin:0 auto; display:flex; flex-direction:column; align-items:center }
.hero-card-box{ width:100%; max-width:1280px; color:var(--text-main); position:relative; background:transparent; border:none; box-shadow:none; border-radius:0; overflow:visible }
.hero-media{ position:relative; left:50%; transform:translateX(-50%); width:100vw; min-height:60vh; max-height:80vh; display:flex; align-items:center; justify-content:center; background:
  radial-gradient(circle at 20% 15%, rgba(159,209,255,.25) 0%, rgba(255,255,255,0) 60%),
  radial-gradient(circle at 80% 10%, rgba(255,200,61,.15) 0%, rgba(255,255,255,0) 60%),
  #ffffff; border-radius:0; overflow:visible }
.hero-video{ width:100%; height:100%; max-height:80vh; object-fit:contain; object-position:center center; background:transparent; display:block }
.hero-info{ position:relative; z-index:5; width:min(1120px,92%); margin:24px auto; background:#fff; border:1px solid var(--border-soft); box-shadow:var(--shadow-card); border-radius:20px; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:16px 24px; padding:24px 28px 28px }
.hero-text{ flex:1; min-width:220px }
.hero-headline{ margin:0 0 8px; font-size:clamp(24px,2.2vw,32px); line-height:1.25; font-weight:700; color:var(--blue-dark); text-wrap:balance }
.hero-sub{ margin:0; font-size:clamp(15px,1vw,16px); line-height:1.4; color:var(--text-sub); font-weight:500 }
.hero-cta{ align-self:flex-start; background:var(--orange); color:#fff; font-size:16px; font-weight:600; padding:14px 18px; border-radius:10px; border:2px solid transparent; box-shadow:0 14px 28px rgba(232,90,23,.26); white-space:nowrap; min-width:180px; text-align:center }
.hero-cta:hover{ filter:brightness(.95) }

/* =============== TPA (sin cambios funcionales) =============== */
.tpa{ color:var(--text-main); padding:56px 0 }
.tpa-card{ display:grid; grid-template-columns:1.1fr .9fr; gap:32px; align-items:center; background:#fff; border-radius:20px; border:1px solid var(--border-soft); box-shadow:var(--shadow-card); padding:32px 28px; position:relative; overflow:hidden }
.tpa-card::before{ content:""; position:absolute; left:-80px; top:-60px; width:260px; height:260px; background:radial-gradient(circle at 20% 20%,rgba(159,209,255,.4)0%,rgba(255,255,255,0)70%); filter:blur(12px); pointer-events:none }
.tpa-card::after{ content:""; position:absolute; right:-60px; bottom:-60px; width:220px; height:220px; background:radial-gradient(circle at 30% 30%,rgba(255,200,61,.3)0%,rgba(255,255,255,0)70%); filter:blur(18px); pointer-events:none }
.tpa-text{ position:relative; z-index:2 }
.tpa-eyebrow{ display:inline-block; background:rgba(255,200,61,.15); border:1px solid rgba(255,200,61,.5); color:var(--orange); font-weight:700; font-size:12px; padding:6px 10px; border-radius:999px; line-height:1.2; text-transform:uppercase; letter-spacing:.04em; margin-bottom:12px }
.tpa-title{ margin:0 0 16px; font-size:clamp(22px,2vw,28px); font-weight:700; line-height:1.25; color:var(--blue-dark); text-wrap:balance }
.accent-strong{ color:var(--orange) }
.tpa-desc{ font-size:15px; line-height:1.5; color:var(--text-main); margin:0 0 16px; font-weight:500 }
.highlight-box{ background:#fffbe6; border-left:4px solid var(--yellow); padding:12px 16px; border-radius:8px; box-shadow:var(--shadow-small); font-weight:600; color:var(--text-main) }
.small-note{ font-size:13px; color:var(--text-sub); font-weight:400 }
.tpa-media{ position:relative; z-index:2 }
.tpa-img-frame{ background:#f8fbff; border-radius:16px; border:1px solid var(--border-soft); box-shadow:var(--shadow-card),0 0 40px rgba(159,209,255,.4); overflow:hidden }
.tpa-img-frame img{ width:100%; height:auto }
.tpa-badge-floating{ position:absolute; right:0; bottom:-10px; transform:translateY(100%); background:#fff; color:var(--blue-dark); border-radius:12px; box-shadow:var(--shadow-strong); padding:8px 12px; font-size:13px; font-weight:600; display:flex; align-items:center; gap:6px; border:2px solid var(--blue-main) }
.tpa-badge-icon{ font-size:14px; line-height:1 }
.tpa-badge-text{ white-space:nowrap }

/* SECCIONES GENERALES */
.section{ padding:56px 0; color:var(--text-main) }

/* QUIÉNES SOMOS */
.about-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:center; background:#fff; border:1px solid var(--border-soft); box-shadow:var(--shadow-card); border-radius:20px; padding:28px; position:relative }
.about-grid::after{ content:""; position:absolute; right:-60px; top:-40px; width:200px; height:200px; background:radial-gradient(circle at 20% 20%,rgba(159,209,255,.4)0%,rgba(255,255,255,0)70%); filter:blur(14px) }
.about-text h2{ color:var(--blue-dark); font-size:clamp(22px,2vw,28px); font-weight:700; line-height:1.25; margin:0 0 12px }
.about-text p{ color:var(--text-sub); font-size:15px; line-height:1.5; margin:0 }
.about-media img{ border-radius:10px; box-shadow:var(--shadow-card),0 0 40px rgba(159,209,255,.4); border:1px solid var(--border-soft) }

/* BENEFICIOS */
.benefits-inner{ background:#fff; border:1px solid var(--border-soft); box-shadow:var(--shadow-card); border-radius:20px; padding:28px; position:relative }
.benefits-inner::before{ content:""; position:absolute; left:-60px; bottom:-40px; width:220px; height:220px; background:radial-gradient(circle at 20% 20%,rgba(255,200,61,.25)0%,rgba(255,255,255,0)70%); filter:blur(20px) }
.eyebrow{ text-transform:uppercase; letter-spacing:.04em; font-weight:800; font-size:12px; display:inline-block; line-height:1.2; margin:0 0 8px }
.accent-chip{ background:var(--blue-soft); border:1px solid var(--blue-line); border-radius:999px; color:var(--blue-dark); padding:6px 10px }
.section-title{ font-size:clamp(22px,2vw,28px); margin:.2em 0 1em; line-height:1.25; font-weight:700; color:var(--blue-dark); text-wrap:balance }
.gradient-title{ background-image:linear-gradient(90deg,var(--blue-dark) 0%,#4a79ff 60%,#e18a00 100%); -webkit-background-clip:text; color:transparent }
.benefits-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px }
.card{ border-radius:12px; padding:16px }
.outline-card{ background:#fff; border:1px solid var(--border-soft); box-shadow:var(--shadow-small) }
.card-icon{ font-size:20px; margin-bottom:8px; font-weight:700; color:var(--orange) }
.outline-card h3{ margin:0 0 6px; font-size:16px; font-weight:600; color:var(--blue-dark) }
.outline-card p{ margin:0; font-size:14px; line-height:1.4; color:var(--text-sub) }

/* CONTACTO */
.contact-inner{ background:#fff; border:1px solid var(--border-soft); box-shadow:var(--shadow-card); border-radius:20px; padding:28px; position:relative }
.contact-inner::after{ content:""; position:absolute; right:-60px; bottom:-40px; width:200px; height:200px; background:radial-gradient(circle at 20% 20%,rgba(159,209,255,.4)0%,rgba(255,255,255,0)70%); filter:blur(16px) }
.section-title.accent-bar{ color:var(--blue-dark) }
.contact-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px }
.contact-card{ background:#fff; border:1px solid var(--border-soft); border-radius:12px; box-shadow:var(--shadow-small); padding:20px; display:flex; flex-direction:column; justify-content:space-between; min-height:150px }
.contact-icon{ font-size:28px; width:44px; height:44px; border-radius:10px; display:flex; align-items:center; justify-content:center; color:#fff; margin-bottom:12px; box-shadow:var(--shadow-small); border:1px solid rgba(255,255,255,.4) }
.contact-icon.insta{ background:radial-gradient(circle at 20% 20%, #ffdc80 0%, #f77737 30%, #c13584 60%, #5851db 100%) }
.contact-icon.wa{ background:#25D366 }
.contact-icon.mail{ background:var(--blue-main) }
.contact-info h3{ margin:0 0 4px; font-size:16px; font-weight:600; color:var(--blue-dark); word-break:break-word }
.contact-info p{ margin:0 0 16px; font-size:14px; font-weight:500; color:var(--text-sub) }
.contact-btn{ align-self:flex-start; background:#fff; border:2px solid var(--blue-main); color:var(--blue-dark); border-radius:8px; font-size:14px; font-weight:600; padding:8px 12px; text-decoration:none; box-shadow:var(--shadow-small) }
.contact-btn:hover{ background:var(--blue-main); color:#fff; border-color:var(--blue-main) }

/* ===== Scroll reveal ===== */
.reveal-left, .reveal-right{ opacity:0; transform:translateY(40px); transition:all .7s ease; will-change:opacity,transform }
.reveal-left{ transform:translate(-40px,40px) }
.reveal-right{ transform:translate(40px,40px) }
.reveal-left.visible, .reveal-right.visible{ opacity:1; transform:translate(0,0) }

/* =================== TURISMO =================== */
.tour{ padding:64px 0 }
.tour-head{ text-align:center; margin-bottom:24px }
.tour-eyebrow{ display:inline-block; background:rgba(47,107,255,.08); border:1px solid var(--blue-line); color:var(--blue-dark); font-weight:800; font-size:12px; padding:6px 12px; border-radius:999px; text-transform:uppercase; letter-spacing:.04em }
.tour-title{ font-size:clamp(24px,2.2vw,32px); line-height:1.25; margin:12px 0 6px; color:var(--blue-dark) }
.tour-sub{ color:var(--text-sub); margin:0 }

/* grid tipo collage */
.tour-grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  grid-auto-rows: 1fr;
  gap:14px;
}
.tour-card{
  grid-column: span 4;            /* base 3 por fila desktop */
  position:relative;
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-card);
  transition:transform .25s ease, box-shadow .25s ease;
  isolation:isolate;
}
.tour-card.large{ grid-column: span 6 }  /* algunos más grandes */
.tour-media{ position:relative; aspect-ratio: 4 / 3; background:#f6fbff }
.tour-media img{ width:100%; height:100%; object-fit:cover }
.tour-info{
  padding:14px 16px 16px;
  display:flex; flex-direction:column; gap:6px;
  background:linear-gradient(180deg, #fff 0%, #ffffff 70%, #f8fbff 100%);
}
.tour-info h3{ margin:0; font-size:16px; font-weight:700; color:var(--blue-dark) }
.tour-info p{ margin:0; font-size:14px; color:var(--text-sub) }
.tour-chip{
  position:absolute; top:10px; left:10px;
  background:rgba(255,200,61,.9);
  color:#111; font-weight:800; font-size:12px;
  padding:6px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.7);
  box-shadow:var(--shadow-small);
}
.tour-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-strong) }

.tour-cta{
  margin-top:18px; text-align:center;
}
.tour-cta a{ display:inline-block; padding:12px 16px; border-radius:10px; background:var(--orange); color:#fff; font-weight:700; box-shadow:0 14px 28px rgba(232,90,23,.26) }

/* =================== RESPONSIVE =================== */
@media (max-width: 960px){
  .about-grid{ grid-template-columns:1fr }
  .tpa-card{ grid-template-columns:1fr }
  .benefits-grid{ grid-template-columns:1fr 1fr }
  .contact-cards{ grid-template-columns:1fr }

  /* HERO vuelve en caja en móvil (como acordamos) */
  .hero-wrapper{ width:100%; max-width:1400px; padding-inline:12px; padding-top:0; margin:0 auto }
  .hero-card-box{ width:100%; max-width:1280px; border-radius:20px; box-shadow:var(--shadow-card); background:#fff; overflow:hidden; display:flex; flex-direction:column; border:1px solid var(--border-soft) }
  .hero-media{ position:relative; left:auto; transform:none; width:100%; min-height:300px; max-height:60vh; border-radius:0; overflow:hidden; background:#000 }
  .hero-video{ width:100%; height:100%; object-fit:cover; object-position:center center; max-height:none; background:#000 }
  .hero-info{ position:relative; width:100%; margin:0; background:#fff; border-top:1px solid var(--border-soft); border-radius:0; box-shadow:none; flex-direction:column; align-items:flex-start; padding:20px 20px 24px }
  .hero-headline{ font-size:clamp(20px,4vw,24px) }
  .hero-sub{ font-size:14px }
  .hero-cta{ width:100%; font-size:15px; padding:14px 16px; min-width:0 }

  /* TURISMO responsive: 2 por fila, algunos a ancho completo */
  .tour-grid{ grid-template-columns:repeat(6, 1fr) }
  .tour-card{ grid-column: span 3 }
  .tour-card.large{ grid-column: span 6 }
}

/* NAV móvil */
@media (max-width:760px){
  .nav{ position:fixed; inset:64px 0 auto 0; background:#fff; flex-direction:column; padding:24px; transform:translateY(-120%); transition:.25s ease; box-shadow:0 30px 60px rgba(0,0,0,.18); border-top:1px solid var(--border-soft); border-bottom:1px solid var(--border-soft); z-index:105 }
  .nav::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--blue-main) 0%,var(--yellow) 60%,var(--orange) 100%) }
  .nav a{ color:var(--text-main); font-size:16px; padding:12px 0; width:100%; border-bottom:1px solid rgba(15,42,90,.05); text-align:left }
  .nav a:last-child{ border-bottom:0 }
  .nav.open{ transform:translateY(0) }
  .burger{ display:flex }

  .benefits-grid{ grid-template-columns:1fr }
}

/* ultra wide desktop */
@media (min-width:1600px){
  .hero-media{ min-height:60vh; max-height:80vh }
  .hero-headline{ font-size:clamp(28px,1.5vw,36px) }
}


/* … todo tu CSS existente de la versión anterior … */

/* === mejoras TURISMO: nombre claro sobre la imagen y meta === */
.tour-name-tag{
  position:absolute; left:0; right:auto; bottom:0;
  padding:8px 12px;
  background:linear-gradient(90deg, rgba(15,42,90,.85) 0%, rgba(15,42,90,.65) 70%, rgba(15,42,90,0) 100%);
  color:#fff; font-weight:800; font-size:14px; letter-spacing:.2px;
  border-top-right-radius:12px;
}
.tour-meta{
  display:flex; gap:10px; flex-wrap:wrap; margin-top:6px;
}
.tour-pill{
  background:rgba(47,107,255,.08);
  border:1px solid var(--blue-line);
  color:var(--blue-dark);
  font-size:12px; font-weight:700;
  padding:4px 8px; border-radius:999px;
}

/* … el resto del CSS tal cual se envió en la respuesta anterior … */