:root{
  --brand-navy:#03045e;
  --brand-blue:#175cb8;
  --brand-blue-dark:#001d3d;
  --brand-red:#e63946;
  --brand-green:#16a34a;
}

html, body { height: 100%; margin: 0; scrollbar-width: none; }
html::-webkit-scrollbar, body::-webkit-scrollbar { display: none; }

body{ font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; }
.font-display{ font-family:'Montserrat',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; }

section:not(#hero){
  content-visibility: auto;
  contain-intrinsic-size: 1px 900px;
}

.material-symbols-rounded{
  font-variation-settings:'FILL' 0,'wght' 550,'GRAD' 0,'opsz' 24;
}

.slide { opacity:0; transition: opacity 700ms ease; }
.slide.is-active { opacity:1; }

.logo-hidden { opacity:0; transform: translateY(-10px); pointer-events:none; }


.txt-shadow-strong { text-shadow: 0 14px 30px rgba(0,0,0,.85); }
.txt-shadow-soft { text-shadow: 0 10px 22px rgba(0,0,0,.70); }

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.call-vertical{
  writing-mode: vertical-rl;
  text-orientation: mixed;
  border-radius: 0.65rem 0 0 0.65rem;
  padding: 0.62rem 0.22rem;
  gap: 0.15rem;
  min-height: 8rem;
  min-width: 1.5rem;
  align-items: center;
  justify-content: center;
}

.call-vertical .material-symbols-rounded{
  transform: rotate(90deg);
  font-size: 0.82rem;
}

.call-vertical #callText{
  font-size: 0.75rem;
}

#callBtn{
  transform: translateY(-50%) translateX(0);
  transition: opacity 260ms ease, transform 320ms ease;
  will-change: transform, opacity;
  animation: callNudge 2.4s ease-in-out infinite;
}

#callBtn.call-hidden{
  opacity: 1;
  pointer-events: auto;
  animation: none;
  transform: translateY(-50%) translateX(78%);
}

#waBtn{
  transition: opacity 260ms ease;
  will-change: opacity;
}

#waBtn.wa-faded{
  opacity: 0;
  pointer-events: none;
}

@keyframes callNudge{
  0%, 100% { transform: translateY(-50%) translateX(0); }
  50% { transform: translateY(-50%) translateX(-4px); }
}

@media (max-width: 640px){
  .call-vertical{
    min-height: 5.8rem;
    min-width: 1.25rem;
    padding: 0.36rem 0.12rem;
    gap: 0.08rem;
  }

  .call-vertical #callText{
    font-size: 0.62rem;
  }

  .call-vertical .material-symbols-rounded{
    font-size: 0.74rem;
  }
}