:root{
  --petroleo:#073e47;
  --petroleo-2:#0a515a;
  --fucsia:#e72d72;
  --texto:#12333c;
  --wa:#25D366;
  /* Escala maestra para las páginas interiores 3:2.
     Se amplían proporcionalmente dentro del marco 16:9 para acercar
     el porte visual a “Nosotros”, sin deformar fotografías ni tarjetas. */
  --standard-scale:90.32924641%;
  --standard-margin:4.835376794%;
  --standard-height:107%;
  --standard-top:-3.5%;
}

*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;background:#fff;font-family:Arial,Helvetica,sans-serif;overflow:hidden}
button,input,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}

/* =========================================================
   ESTRUCTURA GENERAL — un único marco 16:9 para las 7 pestañas
   ========================================================= */
.page{
  display:none;
  position:fixed;
  inset:0;
  background:#fff;
  align-items:flex-start;
  justify-content:center;
}
.page.active{display:flex}

.stage{
  position:relative;
  flex:0 0 auto;
  width:min(100vw,calc(100vh * 1.776833));
  aspect-ratio:1672/941;
  overflow:hidden;
  background:#fff;
  box-shadow:0 0 0 1px rgba(0,0,0,.025);
  isolation:isolate;
}
.stage-wide,.stage-standard{width:min(100vw,calc(100vh * 1.776833));aspect-ratio:1672/941}

.stage>img{
  position:absolute;
  top:0;
  height:100%;
  display:block;
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
  z-index:1;
}
.stage-wide>img{left:0;width:100%;object-fit:fill}

/* Las páginas creadas originalmente en 1536×1024 conservan su proporción 3:2.
   Se muestran completas dentro del mismo marco 16:9 sin ensanchar fotos, rostros,
   iconos ni tarjetas. Los laterales se integran con una extensión desenfocada. */
.stage-standard::before{
  content:"";
  position:absolute;
  inset:-2%;
  z-index:0;
  background-image:var(--page-bg);
  background-size:cover;
  background-position:center;
  filter:blur(16px) saturate(.94) brightness(.90);
  opacity:.62;
  transform:scale(1.025);
  pointer-events:none;
}
.stage-standard>img{
  left:var(--standard-margin);
  top:var(--standard-top);
  width:var(--standard-scale);
  height:var(--standard-height);
  object-fit:fill;
  box-shadow:-10px 0 24px rgba(4,43,50,.07),10px 0 24px rgba(4,43,50,.07);
}
#servicios .stage-standard{--page-bg:url("servicios.webp")}
#como-trabajamos .stage-standard{--page-bg:url("como-trabajamos.webp")}
#porque-elegirnos .stage-standard{--page-bg:url("porque-elegirnos.webp")}
#equipo .stage-standard{--page-bg:url("equipo.webp")}

.hotspot{position:absolute;border:0;background:transparent;padding:0;z-index:20;cursor:pointer}
.nav-hotspots{pointer-events:none!important}
.nav-hotspots .hotspot{pointer-events:none!important}

/* =========================================================
   CABECERA — limpia, uniforme y con jerarquía más fina
   ========================================================= */
.fixed-header{
  position:fixed;
  left:0;
  right:0;
  top:0;
  height:clamp(88px,7.25vw,145px);
  background:#fff;
  z-index:90;
  box-shadow:0 1px 0 rgba(7,58,66,.10),0 5px 18px rgba(7,58,66,.025);
}
.fixed-header::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-2px;height:3px;
  background:#fff;
  pointer-events:none;
}
.fixed-header-inner{
  width:min(1530px,94vw);
  height:100%;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:clamp(18px,1.8vw,34px);
}
.brand-button{
  flex:0 0 clamp(235px,20vw,350px);
  width:clamp(235px,20vw,350px);
  height:78%;
  border:0;
  padding:0;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  cursor:pointer;
}
.brand-button img{
  width:clamp(225px,18.8vw,330px);
  height:auto;
  max-height:86px;
  object-fit:contain;
  object-position:left center;
  display:block;
}
.fixed-nav{
  margin-left:auto;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:clamp(14px,1.75vw,34px);
  white-space:nowrap;
}
.fixed-nav button{
  position:relative;
  border:0;
  background:transparent;
  padding:9px 0;
  color:var(--texto);
  font-size:clamp(10.5px,.78vw,13.5px);
  font-weight:700;
  letter-spacing:.01em;
  cursor:pointer;
  transition:color .18s ease,transform .18s ease;
}
.fixed-nav button::after{
  content:"";
  position:absolute;
  left:8%;right:8%;bottom:-9px;
  height:2px;
  border-radius:999px;
  background:var(--fucsia);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .2s ease;
}
.fixed-nav button:hover{color:#0a5962}
.fixed-nav button.active::after,.fixed-nav button:hover::after{transform:scaleX(1)}
.fixed-nav button:focus-visible,.brand-button:focus-visible{outline:2px solid var(--fucsia);outline-offset:4px;border-radius:4px}

/* =========================================================
   INICIO — CTA principal con feedback, sin alterar la composición
   ========================================================= */
.home-evaluation{left:4.45%;top:56.0%;width:30.0%;height:6.4%;border-radius:8px;transition:box-shadow .18s ease,transform .18s ease,background .18s ease}
.home-how{left:4.55%;top:65.2%;width:17.2%;height:4.6%;border-radius:7px;transition:background .18s ease,transform .18s ease}
.home-evaluation:hover,.home-evaluation:focus-visible{background:rgba(231,45,114,.08);box-shadow:0 9px 24px rgba(0,0,0,.14);transform:translateY(-1px)}
.home-how:hover,.home-how:focus-visible{background:rgba(255,255,255,.07);transform:translateY(-1px)}

/* =========================================================
   WHATSAPP — idéntico en todas las pestañas
   ========================================================= */
.whatsapp-hotspot{
  right:2.35%!important;
  bottom:3.10%!important;
  width:5.90%!important;
  height:10.50%!important;
  display:grid!important;
  place-items:center!important;
  background:var(--wa)!important;
  border-radius:50%!important;
  box-shadow:0 8px 22px rgba(0,0,0,.21)!important;
  overflow:visible!important;
  z-index:35!important;
  transition:transform .16s ease,box-shadow .16s ease!important;
}
.whatsapp-hotspot:hover,.whatsapp-hotspot:focus-visible{transform:scale(1.045)!important;box-shadow:0 11px 27px rgba(0,0,0,.25)!important}
.whatsapp-hotspot::before{
  content:""!important;
  position:absolute!important;
  inset:18%!important;
  background:transparent center/contain no-repeat url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23fff' d='M27.1 4.9A15.42 15.42 0 0 0 16.12.3C7.56.3.6 7.25.6 15.81c0 2.74.72 5.41 2.08 7.77L0 31.7l8.33-2.61a15.46 15.46 0 0 0 7.79 2.11h.01c8.56 0 15.51-6.96 15.52-15.52A15.42 15.42 0 0 0 27.1 4.9ZM16.13 28.58h-.01a12.8 12.8 0 0 1-6.53-1.79l-.47-.28-4.95 1.55 1.61-4.83-.31-.5a12.78 12.78 0 0 1-1.96-6.9c0-7.04 5.73-12.77 12.78-12.77 3.41 0 6.62 1.33 9.03 3.74a12.69 12.69 0 0 1 3.73 9.03c0 7.05-5.73 12.78-12.78 12.78Zm7.01-9.57c-.38-.19-2.22-1.09-2.56-1.22-.34-.12-.59-.19-.84.19-.25.37-.96 1.22-1.18 1.47-.22.25-.43.28-.81.09-.37-.19-1.57-.58-2.99-1.85-1.1-.98-1.84-2.19-2.06-2.56-.22-.38-.02-.58.17-.76.17-.17.38-.43.56-.65.19-.22.25-.37.37-.62.12-.25.06-.47-.03-.65-.09-.19-.84-2.03-1.15-2.78-.31-.75-.62-.65-.84-.66l-.71-.01c-.25 0-.65.09-.99.47-.34.37-1.31 1.28-1.31 3.12s1.34 3.62 1.53 3.87c.19.25 2.63 4.01 6.38 5.62.89.38 1.58.61 2.13.78.9.28 1.71.24 2.35.14.72-.11 2.22-.9 2.53-1.78.31-.87.31-1.62.22-1.78-.09-.16-.34-.25-.72-.44Z'/></svg>")!important;
  border:0!important;
  pointer-events:none!important;
  z-index:1!important;
}
.whatsapp-hotspot::after{content:none!important;display:none!important}
.whatsapp-hotspot .wa-tooltip{
  position:absolute!important;
  right:122%!important;
  bottom:53%!important;
  width:138px!important;
  max-width:138px!important;
  padding:9px 11px!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#173943!important;
  font-size:clamp(10px,.78vw,13px)!important;
  line-height:1.2!important;
  font-weight:600!important;
  text-align:center!important;
  box-shadow:0 8px 20px rgba(0,0,0,.15)!important;
  opacity:0!important;
  visibility:hidden!important;
  transform:translateY(6px)!important;
  transition:opacity .16s ease,transform .16s ease,visibility .16s ease!important;
  pointer-events:none!important;
  z-index:40!important;
  white-space:normal!important;
}
.whatsapp-hotspot .wa-tooltip::after{
  content:"";
  position:absolute;
  right:-5px;top:50%;width:10px;height:10px;
  background:#fff;
  transform:translateY(-50%) rotate(45deg);
}
.whatsapp-hotspot:hover .wa-tooltip,.whatsapp-hotspot:focus-visible .wa-tooltip{opacity:1!important;visibility:visible!important;transform:translateY(0)!important}

/* =========================================================
   INTERACCIONES DE TARJETAS — mismo acabado visual
   Coordenadas adaptadas al contenido 3:2 centrado, sin deformación.
   ========================================================= */
.section-hotspot{
  position:absolute;
  z-index:18;
  border:1px solid transparent;
  background:transparent;
  border-radius:16px;
  padding:0;
  transition:background .18s ease,box-shadow .18s ease,border-color .18s ease,transform .18s ease;
}
.section-hotspot:hover,.section-hotspot:focus-visible{
  background:rgba(255,255,255,.055);
  border-color:rgba(231,45,114,.38);
  box-shadow:0 10px 24px rgba(0,0,0,.11),inset 0 0 0 1px rgba(255,255,255,.08);
  transform:translateY(-2px);
  outline:none;
}

.service-hit{top:51.07%;height:35.524%;width:13.18775%}
.s1{left:7.455%}.s2{left:20.733%}.s3{left:34.102%}.s4{left:47.471%}.s5{left:60.839%}.s6{left:74.209%}
.method-hit{top:55.029%;height:34.026%;width:16.07889%;border-radius:12px}
.m1{left:7.726%}.m2{left:24.076%}.m3{left:40.425%}.m4{left:56.774%}.m5{left:73.124%}
.why-hit{top:48.93%;height:31.458%;width:13.09787%}
.w1{left:8.358%}.w2{left:21.998%}.w3{left:35.637%}.w4{left:49.278%}.w5{left:62.917%}.w6{left:76.556%}

.service-detail{
  position:absolute;
  z-index:60;
  left:50%;top:43%;transform:translate(-50%,-50%);
  width:min(590px,70%);
  padding:18px 52px 18px 22px;
  border-radius:14px;
  color:#fff;
  background:rgba(4,55,65,.965);
  border:1px solid rgba(255,255,255,.25);
  box-shadow:0 18px 45px rgba(0,0,0,.26);
  backdrop-filter:blur(8px);
}
.service-detail strong{display:block;margin-bottom:7px;font-size:18px;color:#fff}
.service-detail p{margin:0;font-size:14px;line-height:1.55;color:#e4eff0}
.detail-close{position:absolute;right:12px;top:9px;width:30px;height:30px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:22px;line-height:1;cursor:pointer}

/* =========================================================
   CONTACTO — un solo panel visual y un solo formulario HTML real
   ========================================================= */
.contact-panel{
  position:absolute;
  left:42.55%;
  top:20.90%;
  width:50.25%;
  height:64.45%;
  z-index:11;
  border-radius:21px;
  background:#09363f;
  border:1.5px solid rgba(215,231,233,.86);
  box-shadow:0 10px 26px rgba(0,0,0,.16);
  pointer-events:none;
}
.contact-form{position:absolute;inset:0;z-index:14;pointer-events:none}
.contact-form .field,.contact-form .send-button{position:absolute;pointer-events:auto}
.field{
  border:1px solid rgba(205,224,226,.74);
  border-radius:10px;
  background:rgba(5,49,58,.84);
  color:#fff;
  outline:none;
  padding:0 18px;
  font-size:clamp(10px,1.02vw,17px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.field::placeholder{color:rgba(255,255,255,.82)}
.field:focus,.field.has-value{background:rgba(4,45,54,.96);border-color:var(--fucsia);box-shadow:0 0 0 2px rgba(231,45,114,.14)}
.f-name{left:45.88%;top:25.95%;width:20.95%;height:6.85%}
.f-condominio{left:67.93%;top:25.95%;width:20.95%;height:6.85%}
.f-email{left:45.88%;top:35.70%;width:20.95%;height:6.85%}
.f-telefono{left:67.93%;top:35.70%;width:20.95%;height:6.85%}
.f-mensaje{left:45.88%;top:45.40%;width:43.00%;height:25.35%;padding-top:14px;resize:none}
.send-button{
  left:45.88%;top:73.85%;width:43.00%;height:6.95%;
  border:0;border-radius:8px;background:#db2360;color:#fff;
  font-size:clamp(10px,1.02vw,17px);font-weight:700;letter-spacing:.015em;
  cursor:pointer;box-shadow:0 7px 18px rgba(96,10,43,.18);
  transition:filter .18s ease,transform .18s ease,box-shadow .18s ease;
}
.send-button:hover,.send-button:focus-visible{filter:brightness(1.055);transform:translateY(-1px);box-shadow:0 10px 22px rgba(96,10,43,.24)}

/* El archivo base aún conserva un globo antiguo de WhatsApp. Se integra con el
   fondo mediante un parche orgánico desenfocado, sin crear otra tarjeta/ventana. */
#contacto .contact-stage::after{
  content:"";
  position:absolute;
  right:.05%;
  bottom:10.9%;
  width:10.1%;
  height:10.4%;
  z-index:10;
  pointer-events:none;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  background:rgba(5,49,55,.52);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 47%,rgba(0,0,0,.75) 62%,transparent 82%);
  mask-image:radial-gradient(ellipse at center,#000 47%,rgba(0,0,0,.75) 62%,transparent 82%);
}

#toast{
  position:fixed;left:50%;bottom:18px;transform:translate(-50%,20px);opacity:0;
  background:#063d47;color:#fff;padding:11px 18px;border-radius:9px;z-index:100;
  font-size:13px;box-shadow:0 10px 24px rgba(0,0,0,.16);transition:.25s;pointer-events:none
}
#toast.show{opacity:1;transform:translate(-50%,0)}

.hotspot:focus-visible{outline:3px solid var(--fucsia);outline-offset:-3px}
.send-button:focus-visible,.field:focus-visible{outline:none}

/* =========================================================
   AJUSTES DE TAMAÑO — conserva la cabecera en una sola línea
   ========================================================= */
@media(max-width:1280px){
  .fixed-header-inner{width:96vw;gap:15px}
  .brand-button{flex-basis:275px;width:275px}
  .brand-button img{width:260px}
  .fixed-nav{gap:18px}
  .fixed-nav button{font-size:10.5px}
}
@media(max-width:980px){
  .fixed-header{height:76px}
  .fixed-header-inner{width:98vw;gap:10px;overflow-x:auto;scrollbar-width:none}
  .fixed-header-inner::-webkit-scrollbar{display:none}
  .brand-button{flex:0 0 205px;width:205px;position:sticky;left:0;z-index:2;padding-right:8px}
  .brand-button img{width:198px}
  .fixed-nav{flex:0 0 auto;gap:12px;padding-right:12px}
  .fixed-nav button{font-size:9px}
  .whatsapp-hotspot .wa-tooltip{width:126px!important;max-width:126px!important}
}
@media(max-width:700px){
  #toast{font-size:11px;bottom:8px}
}


/* =========================================================
   V1.16 — PUBLICACIÓN, ACCESIBILIDAD Y MÓVIL
   El diseño de escritorio aprobado se conserva sin cambios.
   ========================================================= */
.mobile-menu-toggle,.mobile-content,.mobile-wa,.site-footer{display:none}
.brand-button picture{display:flex;align-items:center;width:100%;height:100%}

/* Ayudas para lectores de pantalla y movimiento reducido */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}

@media(max-width:800px){
  html,body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto;background:#f4f6f6}
  body.menu-open{overflow:hidden}

  .fixed-header{height:72px;box-shadow:0 1px 0 rgba(7,58,66,.10),0 5px 18px rgba(7,58,66,.07)}
  .fixed-header-inner{width:100%;padding:0 16px;overflow:visible;gap:0;justify-content:space-between}
  .brand-button{position:relative;left:auto;flex:0 0 205px;width:205px;height:64px;padding:0;background:#fff;z-index:102}
  .brand-button img{width:200px;max-height:58px}
  .mobile-menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:46px;height:46px;border:0;background:#fff;border-radius:10px;padding:10px;z-index:103;cursor:pointer}
  .mobile-menu-toggle span{display:block;width:24px;height:2px;background:var(--petroleo);border-radius:99px;transition:transform .2s ease,opacity .2s ease}
  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .fixed-nav{position:fixed;inset:72px 0 auto 0;height:calc(100dvh - 72px);background:#fff;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:18px 22px 36px;margin:0;transform:translateX(100%);transition:transform .22s ease;overflow-y:auto;z-index:101;box-shadow:-10px 0 30px rgba(7,58,66,.08)}
  .fixed-nav.open{transform:translateX(0)}
  .fixed-nav button{font-size:15px;text-align:left;padding:17px 8px;border-bottom:1px solid #e8eded;color:var(--petroleo)}
  .fixed-nav button::after{left:8px;right:auto;bottom:5px;width:48px;height:2px;transform:scaleX(0);transform-origin:left}

  .page{position:relative;inset:auto;display:none;min-height:100dvh;padding-top:72px;background:#f4f6f6;align-items:stretch;justify-content:flex-start}
  .page.active{display:block}
  .stage{display:none!important}
  .mobile-content{display:block;color:#12333c;background:#f4f6f6;min-height:calc(100dvh - 72px)}

  .mobile-hero{position:relative;padding:52px 22px 46px;color:#fff;background-color:#073e47;background-size:cover;background-position:center;isolation:isolate;overflow:hidden}
  .mobile-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,43,52,.96) 0%,rgba(2,43,52,.84) 62%,rgba(2,43,52,.54) 100%);z-index:-1}
  .mobile-hero-home{background-image:url("inicio.webp");background-position:65% center}
  .mobile-hero-nosotros{background-image:url("nosotros.webp");background-position:67% center}
  .mobile-hero-servicios{background-image:url("servicios.webp");background-position:64% center}
  .mobile-hero-metodo{background-image:url("como-trabajamos.webp");background-position:68% center}
  .mobile-hero-porque{background-image:url("porque-elegirnos.webp");background-position:68% center}
  .mobile-hero-equipo{background-image:url("equipo.webp");background-position:68% center}
  .mobile-hero-contacto{background-image:url("contacto-limpio.webp");background-position:62% center}
  .mobile-eyebrow{margin:0 0 10px;color:#ff4d85;font-weight:800;letter-spacing:.10em;font-size:12px}
  .mobile-hero h1{max-width:560px;margin:0 0 16px;font-size:clamp(30px,9vw,46px);line-height:1.03;letter-spacing:-.025em}
  .mobile-hero p:not(.mobile-eyebrow){max-width:620px;margin:0;font-size:17px;line-height:1.6;color:#ecf4f5}
  .mobile-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
  .mobile-primary,.mobile-secondary{min-height:48px;border-radius:9px;padding:12px 17px;font-weight:800;font-size:14px;cursor:pointer}
  .mobile-primary{border:0;background:var(--fucsia);color:#fff;box-shadow:0 8px 20px rgba(124,11,54,.22)}
  .mobile-secondary{border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.08);color:#fff}

  .mobile-section{padding:26px 18px 42px;max-width:720px;margin:0 auto}
  .mobile-section>h2{font-size:25px;margin:0 0 18px;color:var(--petroleo)}
  .mobile-grid{display:grid;gap:12px}
  .mobile-grid.two-col{grid-template-columns:1fr 1fr}
  .mobile-card,.mobile-feature,.mobile-profile,.mobile-service,.mobile-step,.mobile-contact-links>*{background:#fff;border:1px solid #e1e8e9;border-radius:16px;box-shadow:0 8px 24px rgba(7,62,71,.055)}
  .mobile-card{padding:17px 15px;display:flex;flex-direction:column;gap:7px;min-height:122px}
  .mobile-card strong{font-size:16px;color:var(--petroleo)}
  .mobile-card span{font-size:13px;line-height:1.45;color:#5b6f75}
  .mobile-feature{padding:22px;margin-bottom:14px}
  .mobile-kicker{display:block;color:var(--fucsia);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
  .mobile-feature h2,.mobile-profile h2{margin:0 0 10px;color:var(--petroleo);font-size:23px;line-height:1.18}
  .mobile-feature p,.mobile-profile p{margin:10px 0 0;color:#50646b;line-height:1.6;font-size:15px}
  .mobile-stack,.mobile-steps{display:grid;gap:12px}
  .mobile-service,.mobile-step{display:flex;gap:14px;padding:18px}
  .mobile-service>span,.mobile-step>b{flex:0 0 38px;width:38px;height:38px;border:2px solid var(--fucsia);color:var(--fucsia);border-radius:50%;display:grid;place-items:center;font-size:13px}
  .mobile-service h2,.mobile-step h2{margin:1px 0 6px;color:var(--petroleo);font-size:18px}
  .mobile-service p,.mobile-step p{margin:0;color:#607278;font-size:14px;line-height:1.5}
  .mobile-profile{padding:21px;margin-top:14px}
  .mobile-profile strong{color:var(--fucsia);font-size:14px}

  .mobile-contact-links{display:grid;gap:10px;margin-bottom:18px}
  .mobile-contact-links>*{display:flex;flex-direction:column;gap:3px;padding:15px;text-decoration:none;color:var(--texto)}
  .mobile-contact-links strong{color:var(--petroleo);font-size:14px}
  .mobile-contact-links span{font-size:15px;overflow-wrap:anywhere}
  .mobile-form{background:#073e47;border-radius:18px;padding:20px;box-shadow:0 12px 30px rgba(7,62,71,.12)}
  .mobile-form label{display:block;color:#fff;font-weight:700;font-size:13px;margin-bottom:13px}
  .mobile-form input,.mobile-form textarea{display:block;width:100%;margin-top:7px;border:1px solid rgba(255,255,255,.34);background:#0a4a54;color:#fff;border-radius:9px;padding:12px;font-size:16px;outline:none}
  .mobile-form input:focus,.mobile-form textarea:focus{border-color:#ff5e92;box-shadow:0 0 0 3px rgba(231,45,114,.18)}
  .mobile-form .mobile-primary{width:100%}
  .form-note{margin:11px 2px 0;color:#c9dadd;font-size:11px;line-height:1.4}

  .mobile-wa{display:grid;place-items:center;position:fixed;right:16px;bottom:17px;width:55px;height:55px;border-radius:50%;background:#25D366;color:transparent;z-index:80;box-shadow:0 10px 24px rgba(0,0,0,.22);text-decoration:none}
  .mobile-wa::before{content:"";position:absolute;inset:14px;background:center/contain no-repeat url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23fff' d='M27.1 4.9A15.42 15.42 0 0 0 16.12.3C7.56.3.6 7.25.6 15.81c0 2.74.72 5.41 2.08 7.77L0 31.7l8.33-2.61a15.46 15.46 0 0 0 7.79 2.11h.01c8.56 0 15.51-6.96 15.52-15.52A15.42 15.42 0 0 0 27.1 4.9ZM16.13 28.58h-.01a12.8 12.8 0 0 1-6.53-1.79l-.47-.28-4.95 1.55 1.61-4.83-.31-.5a12.78 12.78 0 0 1-1.96-6.9c0-7.04 5.73-12.77 12.78-12.77 3.41 0 6.62 1.33 9.03 3.74a12.69 12.69 0 0 1 3.73 9.03c0 7.05-5.73 12.78-12.78 12.78Z'/></svg>")}
  .site-footer{display:flex;flex-direction:column;gap:5px;padding:24px 70px 28px 18px;background:#052f37;color:#dce9eb;font-size:12px;line-height:1.4}
  .site-footer strong{color:#fff;font-size:14px}
  #toast{left:12px;right:12px;bottom:84px;transform:translateY(20px);text-align:center;font-size:12px;padding:12px 14px}
  #toast.show{transform:translateY(0)}
}

@media(max-width:430px){
  .brand-button{flex-basis:184px;width:184px}.brand-button img{width:178px}
  .mobile-grid.two-col{grid-template-columns:1fr}
  .mobile-card{min-height:auto}
  .mobile-hero{padding:44px 18px 39px}
  .mobile-section{padding-left:14px;padding-right:14px}
}