/* DCG · Destinations Connect Group · base compartida por todas las páginas.
   Marca de DCG: azul marino #1E3A69, crema #F2EDE8 y letra pesada en mayúsculas.
   Acentos: el azul cielo del logo de redes (#37B5FF / #C4E9FC) y bugambilia. Tipografía: Outfit (SIL OFL), local. */

@font-face{font-family:"Outfit";font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/outfit-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Outfit";font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/outfit-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --marino:#1E3A69;
  --marino-hondo:#132A50;
  --marino-noche:#0D1E3B;
  --crema:#F2EDE8;
  --crema-honda:#E6DCD0;
  --cielo:#37B5FF;
  --cielo-medio:#8FD3FF;
  --cielo-claro:#C4E9FC;
  --bugambilia:#D6336C;
  --bugambilia-honda:#B4245A;
  --estrella:#FFC93C;
  --blanco:#FFFFFF;
  --tinta:#16233D;

  --e1:8px; --e15:12px; --e2:16px; --e3:24px; --e4:40px; --e5:64px; --e6:96px; --e7:136px;
  --margen:clamp(16px,4.2vw,56px);
  --ancho:1320px;

  --r:12px;
  --r-grande:22px;
  --suave:cubic-bezier(.22,1,.36,1);
  --rebote:cubic-bezier(.34,1.45,.55,1);
  --sombra:0 30px 60px -30px rgb(13 30 59 / .55);

  --letra:"Outfit",system-ui,-apple-system,"Segoe UI",sans-serif;
  --t-titulo:clamp(2.25rem,1.35rem + 4.2vw,4.75rem);
  --t-rotulo:clamp(1.375rem,1.1rem + 1vw,2rem);
  --t-entrada:clamp(1.125rem,1.04rem + .4vw,1.375rem);
  --t-cuerpo:1.0625rem;
  --t-chico:.9375rem;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--crema);color:var(--tinta);font:400 var(--t-cuerpo)/1.55 var(--letra);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
p,h1,h2,h3,figure,dl,dd,ul,ol{margin:0}
ul[role=list],ol[role=list]{list-style:none;padding:0}
button{font:inherit;color:inherit}
address{font-style:normal}
:focus-visible{outline:3px solid var(--cielo);outline-offset:3px;border-radius:4px}
::selection{background:var(--cielo);color:var(--marino-noche)}

.solo-lector{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.salto{position:fixed;left:var(--e2);top:var(--e2);z-index:80;padding:var(--e15) var(--e2);border-radius:var(--r);background:var(--cielo);color:var(--marino-noche);font-weight:700;transform:translateY(-200%)}
.salto:focus{transform:none}

/* ---------- Botones: rectangulares, letra pesada en mayúsculas, con el avión del logo ---------- */

.boton{
  --b-fondo:var(--cielo); --b-texto:var(--marino-noche); --b-borde:transparent;
  position:relative;display:inline-flex;align-items:center;gap:.7em;min-height:54px;padding:.85em 1.35em;
  border:2px solid var(--b-borde);border-radius:var(--r);background:var(--b-fondo);color:var(--b-texto);
  font:800 .95rem/1.1 var(--letra);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;
  overflow:hidden;isolation:isolate;cursor:pointer;
  transition:transform .35s var(--rebote),box-shadow .35s var(--suave),background-color .25s;
}
.boton::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--b-ola,rgb(255 255 255 / .28));transform:translateX(-101%);transition:transform .5s var(--suave)}
.boton__avion{width:1.35em;height:1.35em;flex:none;fill:currentColor;transition:transform .55s var(--suave)}
.boton:hover{transform:translateY(-3px);box-shadow:0 14px 28px -14px rgb(13 30 59 / .6)}
.boton:hover::before{transform:none}
.boton:hover .boton__avion{transform:translateX(5px) rotate(-12deg)}
.boton:active{transform:translateY(0) scale(.98)}
.boton--marino{--b-fondo:var(--marino);--b-texto:var(--crema);--b-ola:rgb(55 181 255 / .35)}
.boton--bugambilia{--b-fondo:var(--bugambilia);--b-texto:var(--blanco);--b-ola:rgb(255 255 255 / .18)}
.boton--blanco{--b-fondo:var(--blanco);--b-texto:var(--bugambilia-honda);--b-ola:rgb(214 51 108 / .12)}
.boton--linea{--b-fondo:transparent;--b-texto:var(--crema);--b-borde:rgb(242 237 232 / .7);--b-ola:rgb(242 237 232 / .16)}
.boton--linea-marino{--b-fondo:transparent;--b-texto:var(--marino);--b-borde:var(--marino);--b-ola:rgb(30 58 105 / .1)}

.enlace{display:inline-flex;align-items:center;gap:.4em;font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.25em}
.enlace:hover{text-decoration-color:var(--cielo)}
.enlace svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2.4}

/* ---------- Barra ---------- */

.barra{position:sticky;top:0;z-index:50;background:var(--marino);color:var(--crema);transition:background-color .35s,box-shadow .35s,transform .35s}
.barra__dentro{display:flex;align-items:center;gap:var(--e3);max-width:calc(var(--ancho) + 2 * var(--margen));margin:0 auto;padding:12px var(--margen);min-height:76px}
.barra__logo{flex:none;display:block;border-radius:6px}
.barra__logo img{width:118px;height:auto}
.barra__nav{display:flex;align-items:center;gap:clamp(14px,1.6vw,28px);margin-left:auto;font-weight:600;font-size:1rem}
.barra__nav a{position:relative;text-decoration:none;padding:6px 0;white-space:nowrap}
.barra__nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px;background:var(--cielo);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--suave)}
.barra__nav a:hover::after,.barra__nav a[aria-current]::after{transform:none}
.barra__portal{display:inline-flex;align-items:center;gap:4px;color:var(--cielo-claro)}
.barra__portal svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.4}
.barra__whatsapp{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 16px;border-radius:var(--r);background:var(--cielo);color:var(--marino-noche);font-weight:800;text-decoration:none;white-space:nowrap;transition:transform .3s var(--rebote),background-color .25s}
.barra__whatsapp:hover{transform:translateY(-2px);background:var(--cielo-claro)}
.barra__whatsapp svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round}
.barra__menu{display:none;width:48px;height:48px;padding:0;border:2px solid rgb(242 237 232 / .5);border-radius:var(--r);background:none;cursor:pointer}
.barra__menu svg{width:24px;height:24px;margin:auto;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}

/* Sobre la foto de la portada la barra es transparente hasta que se baja. */
body:has(.escenario) .barra:not(.barra--compacta):not(.barra--abierta){background:transparent}
body:has(.escenario) .barra{position:fixed;left:0;right:0}
.barra--compacta{background:rgb(19 42 80 / .96);box-shadow:0 10px 30px -18px rgb(0 0 0 / .6)}
@supports (backdrop-filter:blur(10px)){.barra--compacta{background:rgb(19 42 80 / .86);backdrop-filter:blur(14px) saturate(1.4)}}

@media (min-width:1100px){
  .barra__logo img{width:148px}
}
@media (max-width:1099px){
  .barra__menu{display:block;order:3}
  .barra__whatsapp{margin-left:auto}
  .barra__nav{position:absolute;top:100%;left:0;right:0;display:grid;gap:0;margin:0;padding:8px var(--margen) 24px;background:var(--marino-hondo);font-size:1.25rem;font-weight:700;
    clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .45s var(--suave),visibility 0s .45s}
  .barra__nav a{padding:14px 0;border-bottom:1px solid rgb(242 237 232 / .14)}
  .barra__nav a::after{display:none}
  .barra--abierta .barra__nav{clip-path:inset(0);visibility:visible;transition:clip-path .45s var(--suave)}
}
@media (max-width:519px){
  .barra__whatsapp{width:48px;height:48px;padding:0;justify-content:center}
  .barra__whatsapp-texto{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}

/* ---------- Agenda tu cita (antes del pie, en todas las páginas) ---------- */

.cita{position:relative;background:var(--cielo);color:var(--marino-noche);overflow:clip}
.cita::before{content:"";position:absolute;right:-8vw;bottom:-14vw;width:56vw;height:56vw;max-width:760px;max-height:760px;border-radius:50%;background:var(--cielo-claro);opacity:.55}
.cita__dentro{position:relative;display:grid;gap:var(--e4);max-width:calc(var(--ancho) + 2 * var(--margen));margin:0 auto;padding:clamp(64px,9vw,128px) var(--margen)}
.cita__titulo{font:900 clamp(3rem,1.6rem + 7vw,7.5rem)/.88 var(--letra);letter-spacing:-.02em;text-transform:uppercase}
.cita__entrada{max-width:34ch;margin-top:var(--e3);font-size:var(--t-entrada);font-weight:500}
.cita__horario{display:inline-flex;flex-wrap:wrap;gap:4px 10px;margin-top:var(--e3);padding:10px 14px;border-radius:var(--r);background:var(--marino-noche);color:var(--crema);font-weight:500}
.cita__horario b{color:var(--cielo)}
.cita__solicitud{margin-top:var(--e3)}
.cita__solicitud .enlace{display:inline;color:var(--marino-noche);font-size:1.05rem}
.cita__solicitud .enlace svg{display:inline-block;margin-left:.3em;vertical-align:-.12em}
.cita__canales{display:grid;gap:var(--e2);align-content:center}
.canal a{display:grid;gap:4px;padding:22px 24px;border-radius:var(--r-grande);background:var(--marino);color:var(--crema);text-decoration:none;box-shadow:var(--sombra);transition:transform .4s var(--rebote),background-color .3s}
.canal--telefono a{background:var(--crema);color:var(--marino)}
.canal--cdmx a{background:var(--bugambilia);color:var(--blanco)}
.canal--cdmx .canal__tipo{opacity:1}   /* blanco al 85 % sobre la bugambilia queda bajo 4.5:1 */
.canal a:hover{transform:translateY(-4px) rotate(-1deg)}
.canal__tipo{font-size:.95rem;font-weight:600;opacity:.85}
.canal__numero{font:900 clamp(2rem,1.3rem + 2.8vw,3.25rem)/1 var(--letra);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.canal__accion{display:inline-flex;align-items:center;gap:8px;margin-top:6px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:.9rem}
.canal__accion svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;transition:transform .35s var(--suave)}
.canal a:hover .canal__accion svg{transform:translateX(6px)}
@media (min-width:900px){
  .cita__dentro{grid-template-columns:1.1fr .9fr;align-items:center}
}

/* ---------- Pie ---------- */

.pie{background:var(--marino-noche);color:var(--crema);font-size:var(--t-chico)}
.pie__dentro{display:grid;gap:var(--e4);max-width:calc(var(--ancho) + 2 * var(--margen));margin:0 auto;padding:var(--e5) var(--margen) var(--e4)}
.pie__marca img{width:170px}
.pie__marca p{max-width:34ch;margin-top:var(--e2);color:rgb(242 237 232 / .78)}
.pie__titulo{margin-bottom:10px;font:800 .8rem/1.3 var(--letra);letter-spacing:.12em;text-transform:uppercase;color:var(--cielo)}
.pie__titulo:not(:first-child){margin-top:var(--e3)}
.pie address{line-height:1.6}
.pie__nota{margin-top:10px;color:rgb(242 237 232 / .78)}
.pie ul{display:grid;gap:8px}
.pie a{text-decoration-color:rgb(242 237 232 / .35);text-underline-offset:.22em}
.pie a:hover{text-decoration-color:var(--cielo)}
.pie__rnt{display:flex;align-items:center;gap:14px;max-width:calc(var(--ancho) + 2 * var(--margen));margin:0 auto;padding:var(--e3) var(--margen);border-top:1px solid rgb(242 237 232 / .15)}
.pie__rnt-sello{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--cielo);color:var(--marino-noche);font-weight:900;font-size:.8rem;letter-spacing:.06em}
.pie__rnt b{color:var(--cielo-claro)}
.pie__legal{max-width:calc(var(--ancho) + 2 * var(--margen));margin:0 auto;padding:0 var(--margen) var(--e4);color:rgb(242 237 232 / .6)}
@media (min-width:760px){
  .pie__dentro{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pie__marca{grid-column:1 / -1}
}
@media (min-width:1100px){
  .pie__dentro{grid-template-columns:1.25fr 1.15fr .85fr .95fr .95fr}
  .pie__marca{grid-column:auto}
}

/* ---------- Lo que aparece al llegar ---------- */

.js [data-revela]{opacity:0;transform:translateY(28px);transition:opacity .8s var(--suave),transform .9s var(--suave);transition-delay:calc(var(--i,0) * 90ms)}
.js [data-revela].visto{opacity:1;transform:none}

/* ---------- Menos movimiento ---------- */

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0ms!important}
  .js [data-revela]{opacity:1;transform:none}
}