/* ==========================================================
   Estilos compartidos (header.php / footer.php)
   Navbar, botones, modales de marca, accesibilidad, footer, WhatsApp
   ========================================================== */
:root{
  --teal:#00afb8;
  --teal-dark:#00868d;
  --teal-light:#4dd0d8;
  --orange:#93487c;
  --orange-light:#b467a0;
  --radius-lg:26px;
  --shadow-soft:0 12px 34px rgba(15,58,99,.12);
  --rosa:#fc8284;
  --rosa-light:#fd9fa1;
  --rosa-dark:#e2686b;
  --naranja:#f9914b;
  --beige:#c7b299;
  --purple:#fc8284;
  --dark:#222;
}
html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--teal) #eef2f5;}
::-webkit-scrollbar{width:11px;height:11px;}
::-webkit-scrollbar-track{background:#eef2f5;}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--teal),var(--rosa));border-radius:20px;border:2px solid #eef2f5;}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--teal-dark),var(--rosa-dark));}
.fa-arrow-right::before{color:#fff;}
body{font-family:'Inter',sans-serif;color:var(--dark);background:#fff;}
h1,h2,h3,h4,h5{font-family:'Bebas Neue',sans-serif;letter-spacing:.5px;}
.fw-bold{font-weight:500 !important;}
::selection{background:var(--teal);color:#fff;}

/* NAVBAR */
.navbar-brand{font-weight:800;letter-spacing:1px;padding:0;}
.navbar-brand img{height:68px;max-width:100%;transition:height .35s ease;}
.navbar.scrolled .navbar-brand img{height:54px;}
.navbar{overflow:visible;}
.navbar .container{overflow:visible;}
.navbar{
  transition:background .35s ease,box-shadow .35s ease,padding .35s ease,border-color .35s ease;
  position:absolute;top:0;left:0;width:100%;z-index:1030;
  background:transparent !important;
  padding-top:.7rem;padding-bottom:.7rem;
}
.navbar.scrolled{
  position:fixed;
  background:linear-gradient(90deg,rgba(61,174,183,.85),rgba(75,178,187,.85)) !important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 8px 26px rgba(15,58,99,.18);padding-top:.3rem;padding-bottom:.3rem;
}
.navbar .navbar-collapse{
  background:linear-gradient(120deg,var(--teal) 0%,var(--teal-light) 100%);
  box-shadow:0 14px 34px rgba(0,175,184,.35);
  border-radius:16px;margin-top:.8rem;padding:.8rem 1rem;
  max-height:calc(100vh - 100px);overflow-y:auto;
}
.navbar .navbar-toggler{border-color:rgba(255,255,255,.6);padding:.35rem .6rem;}
.navbar .nav-link{
  text-transform:lowercase;color:#fff;font-weight:400;position:relative;
  transition:opacity .2s;font-family:'Bebas Neue',sans-serif;letter-spacing:.2px;font-size:19px;padding-bottom:4px;
}
.navbar .nav-link::after{
  content:'';position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--orange);
  border-radius:2px;transition:width .3s ease;
}
.navbar .nav-link:hover{color:#fff;opacity:1;}
.navbar .nav-link.active::after{width:100%;}
.navbar .nav-link.active::after{background:#f9914b;}
.lang-dropdown .dropdown-toggle::after{display:none;}
.lang-menu{
  border:none;border-radius:16px;padding:.6rem;min-width:210px;margin-top:.4rem !important;
  background:rgba(255,255,255,.75);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:0 14px 40px rgba(15,58,99,.25);
  animation:langPop .22s cubic-bezier(.34,1.56,.64,1);
}
@keyframes langPop{from{opacity:0;transform:translateY(-8px) scale(.96);}to{opacity:1;transform:translateY(0) scale(1);}}
.lang-item{
  display:flex;align-items:center;gap:.7rem;padding:.55rem .7rem;border-radius:10px;
  font-family:'Bebas Neue',sans-serif;font-size:1rem;letter-spacing:.3px;color:#0f3a63;
  transition:background .2s ease,transform .2s ease;
}
.lang-item img{width:24px;height:18px;object-fit:cover;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.25);}
.lang-item small{font-size:.75rem;opacity:.65;}
.lang-item:hover{background:linear-gradient(90deg,rgba(249,145,75,.18),rgba(249,145,75,.05));color:#e8702a;transform:translateX(3px);}
.navbar .nav-item.dropdown .dropdown-toggle::after{display:none;}
.navbar .nav-item.dropdown .dropdown-toggle{display:flex;align-items:center;gap:6px;}
.navbar .nav-item.dropdown .dropdown-toggle::before{
  content:'\f078';font-family:'Font Awesome 6 Free';font-weight:900;font-size:.65rem;
  transition:transform .25s ease;order:2;
}
.navbar .nav-item.dropdown.show .dropdown-toggle::before{transform:rotate(180deg);}
.navbar .dropdown-menu{
  border:none;border-radius:16px;padding:.5rem;min-width:220px;margin-top:.4rem !important;
  background:rgba(255,255,255,.85);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:0 14px 40px rgba(15,58,99,.25);
  animation:langPop .22s cubic-bezier(.34,1.56,.64,1);
}
.navbar .dropdown-item{
  font-family:'Bebas Neue',sans-serif;font-size:1rem;letter-spacing:.3px;color:#0f3a63;
  padding:.55rem .8rem;border-radius:10px;transition:background .2s ease,transform .2s ease,color .2s ease;
}
.navbar .dropdown-item:hover,.navbar .dropdown-item:focus{
  background:linear-gradient(90deg,rgba(249,145,75,.18),rgba(249,145,75,.05));
  color:#e8702a;transform:translateX(3px);
}
@media (min-width:992px){
  .navbar .navbar-collapse{background:none;box-shadow:none;border-radius:0;margin-top:0;padding:0;max-height:none;overflow:visible;}
  .navbar .navbar-toggler{display:none;}
  .navbar .dropdown-menu,.lang-menu{margin-top:14px !important;}
  .navbar .nav-item.dropdown{position:relative;}
  .navbar .nav-item.dropdown::after{content:'';position:absolute;left:0;right:0;top:100%;height:18px;}
  .navbar .nav-item.dropdown .dropdown-menu{
    display:block;opacity:0;visibility:hidden;pointer-events:none;
    transform:translateY(-8px) scale(.96);
  }
  .navbar .nav-item.dropdown:hover .dropdown-menu{
    opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1);
  }
  .navbar .nav-item.dropdown:hover .dropdown-toggle::before{transform:rotate(180deg);}
}

/* BOTONES */
.btn-teal{background:linear-gradient(135deg,var(--teal),var(--teal-light));color:#fff;border:none;border-radius:50px;padding:.65rem 1.8rem;font-weight:700;transition:transform .25s,box-shadow .25s,background .25s;}
.btn-teal:hover{background:linear-gradient(135deg,var(--teal-dark),var(--teal));color:#fff;transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,175,184,.4);}
.btn-naranja{
  background:var(--naranja);color:#fff;border:none;border-radius:50px;padding:.6rem 1.6rem;
  font-family:'Bebas Neue',sans-serif;letter-spacing:.5px;font-size:1.1rem;
  box-shadow:0 8px 20px rgba(249,145,75,.35);transition:transform .25s,box-shadow .25s,background .25s;
}
.btn-naranja:hover{background:#e97a2e;color:#fff;transform:translateY(-3px);box-shadow:0 12px 26px rgba(249,145,75,.5);}

/* SCROLL REVEAL */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in-view{opacity:1;transform:translateY(0);}
body.a11y-reduce-motion .reveal{opacity:1;transform:none;}

/* MODALES DE LA MARCA */
.brand-modal-content{
  border:none;border-radius:26px;overflow:hidden;background:#fff;color:#0f3a63;
  box-shadow:0 30px 70px rgba(0,175,184,.35);
}
.brand-modal-content .modal-header{background:linear-gradient(120deg,var(--teal) 0%,var(--teal-light) 100%);padding:1.5rem 1.6rem;}
.brand-modal-content .modal-title{font-family:'Bebas Neue',sans-serif;letter-spacing:.5px;font-size:1.6rem;color:#fff;}
.brand-modal-content .btn-close{filter:brightness(0) invert(1);opacity:.9;}
.brand-modal-content .btn-close:hover{opacity:1;}
.brand-modal-content .modal-body{padding:1.6rem;}

/* MODAL ACCESIBILIDAD */
.a11y-subtitle{color:#5a7086;font-size:.92rem;margin-bottom:1.4rem;}
.a11y-group{
  display:flex;align-items:center;justify-content:space-between;background:rgba(0,175,184,.1);
  border-radius:16px;padding:.9rem 1.1rem;margin-bottom:1.1rem;
}
.a11y-group-label{font-weight:700;font-size:.9rem;font-family:'Inter',sans-serif;}
.a11y-fontsize-controls{display:flex;gap:.5rem;}
.a11y-btn{
  width:38px;height:38px;border-radius:50%;border:none;background:var(--teal);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:800;transition:transform .2s ease;
}
.a11y-btn:hover{transform:scale(1.08);}
.a11y-options-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem;margin-bottom:1.3rem;}
/* ≥480px (móvil grande en adelante): 3 columnas de opciones; en móvil chico quedan 2 */
@media(min-width:480px){.a11y-options-grid{grid-template-columns:repeat(3,1fr);}}
.a11y-option{
  display:flex;flex-direction:column;align-items:center;gap:.5rem;background:#fff;
  border:1px solid #d5ecf2;border-radius:16px;padding:1rem .6rem;font-size:.82rem;font-weight:600;
  color:#0f3a63;font-family:'Inter',sans-serif;transition:transform .2s ease,background .2s ease,color .2s ease,border-color .2s ease;
}
.a11y-option i{font-size:1.4rem;color:var(--teal);transition:color .2s ease;}
.a11y-option:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(0,175,184,.2);}
.a11y-option.active{background:var(--teal);border-color:var(--teal);color:#fff;}
.a11y-option.active i{color:#fff;}
.a11y-reset-btn{
  width:100%;border-radius:14px;padding:.8rem;background:transparent;color:var(--teal);
  font-weight:700;font-family:'Inter',sans-serif;border:1.5px dashed #a9d6de;transition:background .2s ease,color .2s ease;
}
.a11y-reset-btn:hover{background:var(--teal);color:#fff;border-color:var(--teal);}
body.a11y-contrast{background:#000;color:#fff;filter:contrast(1.15);}
body.a11y-contrast a{color:#ffd580;}
body.a11y-contrast .navbar,body.a11y-contrast section,body.a11y-contrast footer{background:#000!important;color:#fff!important;}
body.a11y-grayscale{filter:grayscale(1);}
body.a11y-readable-font,body.a11y-readable-font *{font-family:Arial,Helvetica,sans-serif!important;letter-spacing:normal!important;}
body.a11y-underline-links a{text-decoration:underline!important;}
body.a11y-big-cursor,body.a11y-big-cursor *{cursor:url('https://cdn.jsdelivr.net/gh/twbs/icons@1.11.3/icons/cursor-fill.svg') 0 0,auto!important;}
body.a11y-reduce-motion,body.a11y-reduce-motion *{animation:none!important;transition:none!important;scroll-behavior:auto!important;}

/* FOOTER */
footer{background:linear-gradient(180deg,#1f2d33,#161616);color:#cfd8dc;position:relative;font-family:'Montserrat',sans-serif;}
.footer-brands{border-bottom:1px solid rgba(255,255,255,.1);padding:.8rem 0;}
.footer-brands .brand-item{display:flex;align-items:center;gap:.5rem;color:#fff;}
.footer-brands img{width:auto;}
.footer-brands .fb-sm{height:30px;}
.footer-brands .fb-lg{height:46px;}
.footer-brands .brand-divider{width:1px;align-self:stretch;background:rgba(255,255,255,.25);}
.footer-a11y{
  position:fixed;right:16px;bottom:82px;z-index:1050;width:46px;height:46px;border-radius:50%;
  background:linear-gradient(135deg,var(--rosa),var(--rosa-light));color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(252,130,132,.5);border:none;font-size:1.1rem;transition:transform .25s ease;
}
/* ≥480px: botón de accesibilidad en tamaño original */
@media (min-width:480px){.footer-a11y{right:24px;bottom:96px;width:52px;height:52px;font-size:1.3rem;}}
.footer-a11y:hover{transform:scale(1.08);color:#fff;}
.footer-contact h6{color:#fff;font-weight:800;text-transform:uppercase;font-size:.68rem;letter-spacing:.4px;margin-bottom:.3rem;}
.footer-contact p{color:#b8c2c9;font-size:.72rem;font-weight:600;margin-bottom:.15rem;overflow-wrap:anywhere;}
.footer-contact p a{color:#b8c2c9;}
.footer-contact p a:hover{color:#fff;}
.footer-contact .contact-block{margin-bottom:0;}
footer h5,footer h6{font-family:'Montserrat',sans-serif;letter-spacing:.3px;}
footer a{color:#cfd8dc;text-decoration:none;transition:color .2s;}
footer a:hover{color:#fff;}
.footer-social{display:flex;}
.footer-social a{
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.4);background:transparent;border-radius:50%;
  transition:background .2s ease,transform .2s ease,border-color .2s ease;
}
.footer-social a:hover{background:#fff;color:#161616;transform:translateY(-3px);border-color:#fff;}
.footer-bottom{color:#fff;text-transform:uppercase;letter-spacing:.5px;font-size:.7rem;font-weight:500;}
@media (min-width:768px){.footer-bottom{font-size:.85rem;}}
footer img{max-width:100%;object-fit:contain;}
.footer-bottom{padding:0 3.5rem;}  /* deja libres los botones flotantes en móvil */
@media (min-width:768px){.footer-bottom{padding:0;}}
footer ul li{margin-bottom:.5rem;}
.footer-social{gap:.6rem;}
.footer-social a{width:34px;height:34px;font-size:.85rem;}

/* WHATSAPP FLOTANTE */
.wa-float{
  position:fixed;right:16px;bottom:16px;z-index:1050;width:54px;height:54px;border-radius:50%;
  background:var(--teal);display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:26px;text-decoration:none;box-shadow:0 6px 20px rgba(0,175,184,.5);
  transition:transform .25s ease,box-shadow .25s ease;animation:wa-pulse 2.4s ease-in-out infinite;
}
.wa-float:hover{transform:scale(1.1) translateY(-2px);color:#fff;box-shadow:0 10px 26px rgba(0,175,184,.6);}
.wa-float::before{content:'';position:absolute;inset:0;border-radius:50%;background:rgba(0,175,184,.5);animation:wa-ring 2.4s ease-out infinite;}
.wa-float i{position:relative;z-index:1;}
@keyframes wa-pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.06);}}
@keyframes wa-ring{0%{transform:scale(1);opacity:.6;}100%{transform:scale(1.7);opacity:0;}}
/* ≥480px: botón de WhatsApp en tamaño original */
@media (min-width:480px){.wa-float{right:24px;bottom:24px;width:60px;height:60px;font-size:30px;}}

/* Tamaños de escritorio del logo y del navbar (desde 768px va creciendo) */
@media (min-width:768px){
  .navbar-brand img{height:88px;}
  .navbar.scrolled .navbar-brand img{height:68px;}
  .navbar{padding-top:1rem;padding-bottom:1rem;}
}
@media (min-width:1024px){
  .navbar-brand img{height:105px;}
  .navbar.scrolled .navbar-brand img{height:82px;}
  .navbar{padding-top:1.2rem;padding-bottom:1.2rem;}
}
@media (min-width:1024px){.navbar.scrolled{padding-top:.3rem;padding-bottom:.3rem;}}

/* Footer: valores originales desde 768px */
@media (min-width:768px){
  .footer-brands{padding:1.6rem 0;}
  .footer-brands .brand-item{gap:.9rem;}
  .footer-brands .fb-sm{height:48px;}
  .footer-brands .fb-lg{height:72px;}
  .footer-contact h6{font-size:.8rem;letter-spacing:.6px;margin-bottom:.6rem;}
  .footer-contact p{font-size:.85rem;margin-bottom:.3rem;}
  .footer-contact .contact-block{margin-bottom:1.6rem;}
  .footer-social{gap:.9rem;}
  .footer-social a{width:40px;height:40px;}
}

/* FOOTER COMPACTO (base móvil): logos en una sola fila */
footer .footer-brands .row{flex-wrap:nowrap;}
/* ≥768px (tablet y escritorio): los logos pueden volver a partirse en filas como en el original */
@media (min-width:768px){
  footer .footer-brands .row{flex-wrap:wrap;}
  footer .footer-social a{font-size:inherit;}
}

/* ==========================================================
   BASE RESPONSIVE MOBILE-FIRST (compartida por todas las páginas)
   Breakpoints: 480px (móvil grande), 768px (tablet), 1024px (escritorio).
   ========================================================== */
/* Base (móvil): medios fluidos, nunca más anchos que su contenedor */
img,video,iframe,svg,canvas{max-width:100%;}
/* Base (móvil): aire lateral para que el contenido no quede pegado al borde */
.container,.container-fluid,.container-sm,.container-md,.container-lg,.container-xl,.container-xxl{padding-left:1.25rem;padding-right:1.25rem;}
/* Base (móvil): palabras largas o URLs no desbordan la pantalla */
h1,h2,h3,h4,h5,h6,p,li,a{overflow-wrap:break-word;}
/* ≥768px (tablet y escritorio): se restaura el padding original de Bootstrap */
@media (min-width:768px){
  .container,.container-fluid,.container-sm,.container-md,.container-lg,.container-xl,.container-xxl{
    padding-left:calc(var(--bs-gutter-x) * .5);padding-right:calc(var(--bs-gutter-x) * .5);
  }
}

/* Evitar scroll horizontal */
html{overflow-x:clip;}
.lang-dropdown .dropdown-menu{left:auto;right:0;}
