/* ============ BOTÓN DE IDIOMA (28-sep) ============
   Píldora de cristal (liquid glass, misma receta que .lg: borde degradado con máscara, brillo especular,
   blur + saturación) colgando bajo el header, alineada bajo "Start your visit" y pegada bajo el menú al
   hacer scroll. Sin franja de fondo: el contenedor mide 0 de alto y sólo el botón recibe clics.
   La crea assets/lang-v4.js, que publica el alto que ocupa (--lang-h), su ancho (--lang-w) y el alto del
   menú (--nav-box). */
:root{--lang-h:0px;--lang-w:0px}
/* z-index bajo el del menú (50): el menú móvil desplegado la tapa */
.lang{position:sticky;top:var(--nav-box,62px);z-index:49;height:0;pointer-events:none;font-family:'Figtree',system-ui,sans-serif}
.lang__in{display:flex;justify-content:flex-end;width:min(1280px,94vw);margin:0 auto;padding-top:10px}
.lang__btn{pointer-events:auto;position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:.55rem;
  min-height:38px;max-width:calc(100vw - 24px);margin:0;padding:.4rem 1.1rem .4rem .8rem;border:0;border-radius:999px;cursor:pointer;
  color:#fff;font:600 .8rem/1.2 'Figtree',system-ui,sans-serif;letter-spacing:.01em;text-align:left;
  text-shadow:0 1px 3px rgba(3,8,22,.6);
  /* cristal con tinte del navy de marca + el fondo oscurecido: el texto blanco pasa 4.5:1 también sobre
     el cielo claro de la foto del home y sobre la hoja blanca de las páginas legales */
  background-color:rgba(60,80,137,.5);
  background-image:linear-gradient(135deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.02) 50%,rgba(143,205,238,.12) 100%);
  -webkit-backdrop-filter:blur(16px) saturate(1.8) brightness(.36);backdrop-filter:blur(16px) saturate(1.8) brightness(.36);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(3,8,22,.25),inset 0 0 14px rgba(189,225,245,.16),
             0 10px 30px rgba(3,8,22,.4);
  transition:transform .4s cubic-bezier(.22,.68,0,1),box-shadow .4s cubic-bezier(.22,.68,0,1)}
/* borde de cristal: filete degradado (blanco → cyan) recortado con máscara, como .lg::before */
.lang__btn::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:-1;
  background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(143,205,238,.5) 35%,rgba(255,255,255,.14) 65%,rgba(189,225,245,.7));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
/* brillo especular arriba a la izquierda */
.lang__btn::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:radial-gradient(80% 55% at 24% -18%,rgba(255,255,255,.32),transparent 60%)}
.lang__btn:hover{transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -1px 0 rgba(3,8,22,.25),inset 0 0 18px rgba(189,225,245,.24),
             0 14px 36px rgba(3,8,22,.45),0 0 0 4px rgba(143,205,238,.16)}
.lang__btn:focus-visible{outline:2px solid #BDE1F5;outline-offset:3px}
.lang__btn[disabled]{cursor:progress}
.lang__btn svg{flex:0 0 auto;color:#BDE1F5}
.lang__btn[disabled] svg{animation:lang-spin 1.4s linear infinite}
@keyframes lang-spin{to{transform:rotate(360deg)}}
.lang__tx{display:flex;flex-direction:column;min-width:0}
.lang__tx b{font-weight:800;border-bottom:1px solid rgba(189,225,245,.75);padding-bottom:1px}
.lang__tx small{margin-top:.15rem;font-size:.68rem;font-weight:500;color:#E4F3FB;opacity:.9;white-space:normal}

/* lo que se pega bajo el header deja sitio a la píldora */
section[id],[id="top"]{scroll-margin-top:calc(var(--nav-h) + var(--lang-h) + 18px)}
.faqx__ph{top:calc(var(--nav-h) + var(--lang-h) + 28px)}
.pdp-hero__col{top:calc(var(--nav-h) + var(--lang-h) + 20px)}
.faq__head{top:calc(var(--nav-h) + var(--lang-h) + 28px)}
/* landings: la frase de las pestañas se corre a la izquierda de la píldora */
@media(min-width:901px){.pdp-tabs .wrap{padding-right:calc(var(--lang-w) + 28px)}}
@media(max-width:900px){
  /* landings: las pestañas bajan lo que ocupa la píldora; home: el rótulo "Illustrative image" también */
  .pdp-tabs{padding-top:var(--lang-h)}
  .hero__ph{top:calc(12px + var(--lang-h))}
}

@media(prefers-reduced-motion:reduce){.lang__btn{transition:none}.lang__btn[disabled] svg{animation:none}}
@media print{.lang{display:none}}

/* Google Translate: sin su barra superior ni el globo de "texto original"; el aviso de traducción
   automática va en el botón. Su selector queda oculto (lo maneja lang-v4.js). */
body{top:0!important}
iframe.skiptranslate,.goog-te-banner-frame,#goog-gt-tt,.goog-te-balloon-frame,.goog-tooltip{display:none!important}
.goog-text-highlight{background:none!important;box-shadow:none!important}
#gt-el{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
