/* Mobile-first refinements for the existing desktop design.
   This stylesheet only changes the UI at tablet and phone widths. */
.address-short,.menu-toggle{display:none}
.menu-toggle{border:1px solid #dbe7f4;border-radius:10px;background:#fff;
  width:46px;height:44px;padding:11px;align-items:center;justify-content:center;
  flex-direction:column;gap:5px;cursor:pointer}
.menu-toggle span{width:21px;height:2px;background:#0b3566;border-radius:3px;display:block}
.menu-toggle:focus-visible{outline:3px solid #ffb947;outline-offset:3px}
@media(max-width:1023px){
 .shell{width:calc(100% - 36px)}
 .topbar-inner{gap:10px}
 .top-left{gap:12px;flex-wrap:wrap}
 .top-right{min-width:0}
 .address-full{display:none}
 .address-short{display:inline}
 .header{height:auto;min-height:69px}
 .nav-inner{min-height:69px;height:auto;display:flex;align-items:center;
   justify-content:space-between;flex-wrap:wrap;gap:10px;padding:10px 0}
 .brand{font-size:16px}
 .brand-icon{width:43px;flex:0 0 43px}
 .menu-toggle{display:flex;order:3}
 .nav-inner nav{display:none;order:5;flex:0 0 100%;width:100%;margin:0;
   padding:8px 0 4px;max-width:none;overflow:visible;white-space:normal;
   flex-direction:column;align-items:stretch;gap:3px;border-top:1px solid #e8eef5}
 .nav-inner nav.is-open{display:flex}
 .nav-inner nav a{display:block;padding:12px 14px!important;border:0!important;
   border-radius:8px;font-size:14px;line-height:1.4;color:#173b69}
 .nav-inner nav a.active{background:#e9f4ff;color:#0863e9}
 .nav-inner nav a:hover{background:#f3f7fc;color:#075bd9}
 .nav-actions{display:flex;order:2;gap:0;margin-left:auto}
 .nav-actions .small{display:none}
 .nav-actions .search{font-size:26px;padding:6px 11px}
}
@media(max-width:760px){
 .shell{width:calc(100% - 32px)}
 .topbar{font-size:11px}
 .topbar-inner{display:flex;justify-content:space-between;align-items:center;
   flex-wrap:wrap;min-height:0;padding:9px 0;gap:6px}
 .top-left{display:flex;gap:6px 13px;flex-wrap:wrap;min-width:0}
 .top-left a{overflow-wrap:anywhere;font-size:11px}
 .top-right{display:block}
 .top-right a{color:#e4f0ff;font-size:11px}
 .hero{height:auto;min-height:0;background:#f2faff}
 .hero-inner{height:auto;min-height:0;display:block;padding:30px 0 215px}
 .hero-copy{max-width:100%}
 .hero-visual{background-image:
   linear-gradient(180deg,#f2faff 0%,#f2fafffc 37%,#f2faffef 52%,#f2faff54 73%,#f2faff00 100%),
   url('/assets/img/banner-home-2172.webp?v=20261021d')!important;
   background-repeat:no-repeat!important;
   background-position:center, right bottom!important;
   background-size:100% 100%, auto 238px!important}
 .hero .eyebrow{font-size:10px;letter-spacing:0;line-height:1.5}
 .hero h1{font-size:clamp(29px,6vw,37px);line-height:1.15;letter-spacing:-.7px;
   margin:13px 0 14px}
 .hero p{font-size:14px;line-height:1.55;max-width:580px}
 .hero-buttons{display:flex;flex-wrap:wrap;gap:11px;margin-top:18px}
 .hero-buttons .button{white-space:normal;min-height:45px;padding:12px 16px;
   flex:1 1 200px;text-align:center}
 .benefits{padding:19px 0}
 .benefit-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 15px}
 .benefit{min-width:0;align-items:flex-start;gap:10px}
 .benefit .round{height:41px;width:41px;flex:0 0 41px;font-size:19px}
 .benefit p{min-width:0}
 .benefit strong{font-size:12px;line-height:1.35}
 .benefit small{font-size:11px;line-height:1.45;margin-top:3px}
 .section{padding:29px 0 34px}
 .section h2{font-size:clamp(23px,4.7vw,29px);line-height:1.27}
 .heading-row{align-items:center}
 .carousel-controls{display:flex;flex:0 0 auto}
 .field-grid{display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;
   scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
   padding:2px 2px 14px}
 .field-card{flex:0 0 clamp(226px,66vw,292px);scroll-snap-align:start}
 .field-image{height:130px}
 .field-info{min-height:118px}
 .steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .steps article{min-height:110px;align-items:flex-start;padding:13px;gap:8px}
 .steps article .round{width:38px;height:38px;flex:0 0 38px;font-size:19px}
 .steps strong{font-size:12px}
 .steps p{font-size:11px}
 .closing-row{display:block}
 .closing .button{margin-top:18px}
 .footer-grid{gap:24px}
}
@media(max-width:540px){
 .topbar-inner{display:block;padding:8px 0}
 .top-left{justify-content:flex-start;gap:4px 16px}
 .top-right{margin-top:5px}
 .brand{font-size:14px}
 .brand strong{font-size:15px}
 .hero-inner{padding:27px 0 210px}
 .hero-visual{background-size:100% 100%,auto 220px!important}
 .hero h1{font-size:clamp(29px,7vw,34px)}
 .hero p{font-size:13px}
 .hero-buttons{flex-direction:column;align-items:stretch;gap:10px}
 .hero-buttons .button{width:100%;flex:auto;min-height:46px;padding:12px 14px}
 .benefit-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}
 .benefit{gap:7px}
 .benefit .round{width:38px;height:38px;flex:0 0 38px}
 .benefit strong{font-size:11px}
 .benefit small{font-size:10px}
 .field-card{flex-basis:min(78vw,290px)}
 .field-image{height:140px}
 .steps{grid-template-columns:1fr}
 .steps article{min-height:90px}
 .footer-grid{grid-template-columns:1fr}
 .footer-grid>div:first-child{grid-column:auto}
}
@media(max-width:360px){
 .shell{width:calc(100% - 24px)}
 .brand{font-size:13px}
 .brand strong{font-size:14px}
 .hero h1{font-size:28px}
 .benefit-list{grid-template-columns:1fr;gap:14px}
 .benefit strong{font-size:12px}
 .benefit small{font-size:11px}
 .nav-actions .search{padding:5px}
}
@media(prefers-reduced-motion:reduce){
 .field-grid{scroll-behavior:auto!important}
}
/* Keep the approved desktop headline on two lines at wide viewports. */
@media(min-width:1251px){
 .hero-copy{max-width:790px}
 .hero h1{max-width:790px}
}
