/* Chulaposviajeros · estilo común a la web y a las herramientas.
   Mismo estilo que los Reels: fondo marfil con puntos, dorado, terracota y azul marino, todo en Montserrat. */
:root{
  --marfil:#F4EEE3; --marfil-2:#EBE2D2; --papel:#FFFDF8; --punto:#ddd2bf;
  --dorado:#C9A45C; --dorado-osc:#8a6a2c; --terracota:#C4553A; --terracota-osc:#a8432c; --coral:#F2A07B;
  --marino:#1d2440; --marino-2:#2b3358; --tinta:#2b2d42; --gris:#74685a; --finde:#e4dccd;
  --verde:#5d7d4a; --ambar:#b97a12;
  --f:'Montserrat',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --sombra:0 18px 40px rgba(58,47,34,.14);
  --lado-i:max(16px,env(safe-area-inset-left,0px)); --lado-d:max(16px,env(safe-area-inset-right,0px));
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--marfil);color:var(--tinta);font-family:var(--f);font-size:16px;line-height:1.55;font-weight:500;
  background-image:radial-gradient(var(--punto) 1.4px,transparent 1.6px);background-size:28px 28px;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--f);color:var(--marino);margin:0;text-wrap:balance;letter-spacing:-.015em;line-height:1.08}
p{margin:0}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--terracota);outline-offset:3px;border-radius:6px}
.wrap{max-width:1120px;margin-inline:auto;padding-left:var(--lado-i);padding-right:var(--lado-d)}
.wrap.estrecho{max-width:980px}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gris)}
.solo-lector{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Cabecera */
.cabecera{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(244,238,227,.93);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--marfil-2)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--marfil)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:8px 20px;padding-block:12px;flex-wrap:wrap}
.logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;font-weight:900;color:var(--marino);font-size:18px;letter-spacing:-.02em}
.logo svg{width:26px;height:26px;flex:none}
.logo b{color:var(--terracota);font-weight:900}
.enlaces{display:flex;gap:6px 22px;font-weight:700;font-size:14px;flex-wrap:wrap}
.enlaces a{text-decoration:none;color:var(--marino);padding-block:4px;border-bottom:2px solid transparent}
.enlaces a:hover,.enlaces a[aria-current]{border-bottom-color:var(--dorado)}
@media (max-width:760px){.nav .btn{display:none}.enlaces{order:3;flex-basis:100%;gap:4px 18px;font-size:13.5px}}

/* Botones y pastillas */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;font-family:var(--f);font-weight:800;font-size:15px;text-decoration:none;border-radius:999px;padding:12px 22px;transition:transform .15s ease,background .15s ease}
.btn:hover{transform:translateY(-2px)}
.btn-marino{background:var(--marino);color:var(--marfil)}
.btn-marino:hover{background:var(--marino-2)}
.btn-dorado{background:var(--dorado);color:var(--marino)}
.btn-borde{background:transparent;color:var(--marino);box-shadow:inset 0 0 0 2px var(--marino)}
.btn-chico{padding:9px 16px;font-size:13px}
.pastilla{display:inline-block;background:var(--marino);color:#fff;font-weight:800;padding:10px 20px;border-radius:999px}
.pastilla em{font-style:normal;color:var(--coral)}

/* Tarjeta con filete dorado, como las de los Reels */
.filete{background:var(--papel);border-radius:18px;outline:2px solid var(--dorado);outline-offset:-11px;box-shadow:var(--sombra)}

/* Pie */
.pie{background:var(--marino);color:#cfc6b6;padding-block:40px;font-size:14px;margin-top:72px}
.pie .wrap{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));gap:28px}
.pie .logo{color:var(--marfil)}.pie .logo b{color:var(--coral)}
.pie h3{color:var(--dorado);font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;margin-bottom:10px}
.pie ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.pie a{color:#e9e2d4;text-decoration:none;font-weight:600}
.pie a:hover{color:var(--coral)}
.pie .legal{grid-column:1/-1;border-top:1px solid rgba(201,164,92,.3);padding-top:16px;font-size:12.5px;color:#a9a091}
@media (max-width:760px){.pie .wrap{grid-template-columns:1fr 1fr}.pie .wrap>div:first-child{grid-column:1/-1}}

/* Dibujos */
.chulapo-svg{display:block;filter:drop-shadow(0 14px 18px rgba(58,47,34,.18))}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}