/* CARIBIAN · estilos globales: fuentes, variables de marca, reset, utilidades y base de ventanas.
   Paleta cerrada: azul #2B317B · rojo #C62F18 · blanco. Se carga ANTES que los CSS de módulo. */
@font-face{font-family:'Space Grotesk';src:url(../fonts/sg400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url(../fonts/sg500.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url(../fonts/sg700.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Yellowtail';src:url(../fonts/yellowtail.woff2) format('woff2');font-weight:400;font-display:swap}
:root{
  --navy:#2B317B; --navy-d:#1F244F; --red:#C62F18; --red-d:#A82611; --white:#fff;
  --tint:#EEF0F8; --ink:#1F244F; --mut:rgba(31,36,79,.7);
  --f-body:'Space Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-script:'Yellowtail',cursive;
  --ease:cubic-bezier(.16,1,.3,1);
  --pad:clamp(20px,5vw,64px);
  --hdr:76px;
            
  --script-thin:.011em;                           /* grosor que se le "resta" a Yellowtail (más fina) */
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--f-body);font-size:1rem;line-height:1.55;color:var(--ink);background:#fff;overflow-x:clip;-webkit-font-smoothing:antialiased}
body.no-scroll{overflow:hidden}
img,svg,video,iframe{max-width:100%}
img{display:block}
h1,h2,h3,h4,p,figure,dl,dd{margin:0}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.skip{position:fixed;left:12px;top:-60px;z-index:200;background:#fff;color:var(--navy);padding:10px 16px;border-radius:12px;font-weight:700;transition:top .2s}
.skip:focus{top:12px}
i[data-icon]{display:inline-flex;width:1.25em;height:1.25em}
i[data-icon] svg{width:100%;height:100%}
.script{font-family:var(--f-script);font-weight:400;font-style:normal;letter-spacing:0;-webkit-text-stroke:var(--script-thin) var(--sbg,transparent)}
.wrap{width:min(100% - 2*var(--pad),1120px);margin-inline:auto}
.center{text-align:center;margin-top:36px}
.kicker{color:var(--red);font-weight:700;margin-bottom:10px}
h2{font-size:clamp(2.3rem,10vw,4.4rem);line-height:.98;letter-spacing:-.03em;font-weight:700;color:var(--navy)}
h2 .script{color:var(--red);font-size:1.22em;line-height:.8}
.lede{color:var(--mut);font-size:1.08rem;max-width:44ch;margin-top:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 26px;border-radius:999px;border:2px solid transparent;font-weight:700;font-size:1rem;text-decoration:none;cursor:pointer;background:none;transition:transform .35s var(--ease),background-color .25s,color .25s,border-color .25s,box-shadow .25s;-webkit-tap-highlight-color:transparent}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn-red{background:var(--red);color:#fff;box-shadow:0 10px 24px rgba(198,47,24,.28)}
.btn-red:hover{background:var(--red-d)}
.btn-ghost{border-color:rgba(255,255,255,.55);color:#fff}
.btn-ghost:hover{background:#fff;color:var(--navy);border-color:#fff}
.btn-white{background:#fff;color:var(--navy)}
.btn-white:hover{background:var(--tint)}
.btn-outline{border-color:rgba(43,49,123,.28);color:var(--navy)}
.btn-outline:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-sm{min-height:42px;padding:0 18px;font-size:.92rem}
.btn-block{width:100%}
.eyebrow{display:flex;align-items:center;gap:10px;font-weight:500;font-size:.95rem;color:rgba(255,255,255,.82);animation-delay:0s}
.eyebrow::before{content:'';width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(198,47,24,.28)}
@keyframes draw{to{transform:scaleX(1)}}
.cta-row{display:flex;flex-wrap:wrap;gap:12px}
.head{margin-bottom:8px}
section{position:relative}
.reveal{}
html.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
html.js .reveal.in{opacity:1;transform:none}
.chips{display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0;list-style:none}
.chips li{padding:7px 14px;border-radius:999px;background:var(--tint);color:var(--navy);font-size:.92rem;font-weight:500}
.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-end;justify-content:center;visibility:hidden;pointer-events:none;transition:visibility .5s}
.modal.open{visibility:visible;pointer-events:auto}
.modal-backdrop{position:absolute;inset:0;background:rgba(15,18,50,.72);opacity:0;transition:opacity .4s}
.modal.open .modal-backdrop{opacity:1}
.sheet:focus{outline:none}
.sheet{position:relative;width:100%;max-height:92svh;background:#fff;color:var(--ink);border-radius:28px 28px 0 0;overflow:hidden;display:flex;flex-direction:column;transform:translateY(100%);transition:transform .55s var(--ease)}
.modal.open .sheet{transform:none}
.sheet-scroll{overflow-y:auto;overscroll-behavior:contain;padding-bottom:env(safe-area-inset-bottom);-webkit-overflow-scrolling:touch}
.close{position:absolute;z-index:5;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--navy);cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 14px rgba(15,18,50,.2)}
.close i{width:20px;height:20px}
@media (min-width:720px){
  .modal{align-items:center}
  .sheet{width:min(960px,92vw);border-radius:30px;transform:translateY(28px) scale(.97);opacity:0;transition:transform .55s var(--ease),opacity .4s}
  .modal.open .sheet{opacity:1;transform:none}
}
@media (min-width:960px){
  :root{--hdr:88px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  html.js .reveal{opacity:1;transform:none}
}
/* Patrón de marca: variable con valor de fábrica; si el admin sube uno propio,
   index.php/contacto.php inyectan --patron-url con la ruta real en el <head>. */
.patron::before{content:'';position:absolute;inset:0;background:var(--patron-url, url(../img/patron-tropical.svg)) 0 0/var(--patron-tamano, 300px);opacity:var(--patron-opacidad, .06);pointer-events:none}