/* Country band — replaces the animated stats strip; teal-on-white editorial divider */
.cband{background:var(--teal);color:#fff;padding:clamp(22px,3vw,30px) 0}
.cband__inner{display:flex;flex-wrap:wrap;align-items:baseline;gap:clamp(10px,2vw,18px);justify-content:center;text-align:center}
.cband__pre{font-family:var(--fb);font-size:12px;font-weight:300;color:rgba(255,255,255,.7);letter-spacing:.08em;text-transform:uppercase}
.cband__list{font-family:var(--fd);font-size:clamp(16px,2.4vw,24px);font-weight:500;letter-spacing:.04em;text-transform:uppercase}
@media(max-width:640px){.cband__inner{flex-direction:column;gap:6px}.cband__list{font-size:clamp(14px,4.5vw,18px)}}

/* Hero on mobile — content was overflowing the 380px min-height image.
   Give the image enough room, shrink type, stack CTAs full-width. */
@media(max-width:640px){
  .hero__img{height:560px;animation:none}
  .hero__ov{background:linear-gradient(180deg,rgba(0,0,0,.1) 0%,rgba(0,0,0,.72) 100%)}
  .hero__c{padding:0 var(--g) 28px}
  .hero h1{font-size:32px;line-height:1.08;letter-spacing:-.02em}
  .hero__sub{font-size:14px;line-height:1.55;margin-top:12px}
  .hero__ctas{margin-top:20px;flex-direction:column;align-items:stretch;gap:10px}
  .hero__ctas .btn{justify-content:center;width:100%}
  .hero__elig{font-size:12px;margin-top:14px;line-height:1.55}
}

/* FAQ intro: site.css declares position:sticky after the mobile media query,
   so on phones the intro slides over the questions. Override here. */
@media(max-width:860px){
  .faq__intro{position:static;top:auto}
}
