:root{--navy:#062c49;--navy2:#05243d;--orange:#ff5b17;--blue:#087cf0;--ink:#0b2d4f;--muted:#516478;--line:#dfe7ef;--pale:#f8fafc}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff}a{text-decoration:none;color:inherit}.container{width:min(1160px,calc(100% - 48px));margin:auto}
.site-header{height:82px;background:var(--navy);color:#fff}.navrow{height:82px;display:flex;align-items:center}.logo{width:295px;flex:0 0 295px}.logo img{display:block;width:100%;height:auto}.navlinks{display:flex;align-items:stretch;height:100%;gap:30px;margin-left:auto}.navlinks a{display:flex;align-items:center;font-size:12px;font-weight:600;border-bottom:3px solid transparent}.navlinks a.active{border-color:var(--orange)}.phone{margin-left:27px;font-size:13px;font-weight:700;white-space:nowrap}.phone .orange{font-size:19px}.support{margin-left:24px;background:var(--orange);padding:14px 20px;border-radius:4px;font-size:12px;font-weight:700}
.hero{position:relative;height:460px;background-size:cover;background-position:center;color:#fff}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,40,68,.96) 0%,rgba(4,40,68,.80) 34%,rgba(4,40,68,.25) 67%,rgba(4,40,68,.04) 100%)}.hero-inner{position:relative;z-index:1;padding-top:47px}.kicker{text-transform:uppercase;letter-spacing:3.3px;font-size:10px;font-weight:700}.hero h1{font-size:49px;line-height:1.02;letter-spacing:-1.9px;margin:11px 0 13px;max-width:650px;font-weight:800}.orange{color:var(--orange)}.lead{font-size:14px;line-height:1.55;max-width:610px;margin:0;color:#fff}.actions{display:flex;gap:15px;margin-top:21px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 25px;border-radius:4px;background:var(--orange);border:2px solid var(--orange);color:#fff;font-size:12px;font-weight:700}.btn.outline{background:transparent;border-color:#fff}.benefits{position:absolute;left:0;right:0;bottom:22px;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}.benefit{display:grid;grid-template-columns:35px 1fr;gap:10px;align-items:center}.benefit svg{width:31px;height:31px;stroke:#fff;fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.benefit svg.filled{fill:#fff;stroke:none}.benefit b{font-size:12px;display:block}.benefit span{font-size:9px;display:block;margin-top:4px;opacity:.9}
.section{padding:49px 0}.section-head{text-align:center;max-width:770px;margin:0 auto 31px}.section-head .kicker{color:var(--orange)}.section-head h2{font-size:32px;letter-spacing:-.8px;margin:8px 0 8px;font-weight:700}.section-head p{font-size:12px;line-height:1.55;color:var(--muted);margin:0}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.cards.three{grid-template-columns:repeat(3,1fr)}.card{border:1px solid var(--line);border-radius:5px;padding:22px 24px 19px;min-height:210px;background:#fff;box-shadow:0 6px 18px rgba(10,45,75,.07)}.card svg{width:42px;height:42px;stroke:var(--blue);fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:13px}.card svg.filled{fill:var(--blue);stroke:none}.card h3{font-size:15px;margin:0 0 8px;font-weight:700}.card p{font-size:12px;line-height:1.5;color:var(--muted);margin:0 0 15px}.learn{font-size:11px;color:var(--orange);font-weight:700}
.split{display:grid;grid-template-columns:1.1fr .9fr;min-height:390px}.split-photo{background-size:cover;background-position:center}.split-copy{padding:42px 50px}.split-copy .kicker{color:var(--orange)}.split-copy h2{font-size:34px;line-height:1.08;letter-spacing:-1px;margin:10px 0 13px}.split-copy p,.checks{font-size:12px;line-height:1.55;color:var(--muted)}.checks{list-style:none;padding:0;margin:14px 0 18px}.checks li{margin:8px 0}.checks li:before{content:"✓";display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;background:var(--orange);color:#fff;font-size:10px;font-weight:700;margin-right:8px}
.cta{position:relative;background:linear-gradient(90deg,#062d4b,#0a4167);color:#fff;padding:32px 0}.cta-row{display:grid;grid-template-columns:1.2fr 1fr;gap:45px;align-items:center}.cta h2{font-size:28px;line-height:1.15;margin:7px 0 0}.cta p{font-size:12px;line-height:1.55;margin:0 0 12px}.site-footer{background:#052944;color:#fff;padding:24px 0 13px}.footer-main{display:grid;grid-template-columns:250px 1fr auto;gap:30px;align-items:center}.footer-main img{width:210px}.footer-nav{display:flex;gap:22px;justify-content:center;font-size:10px}.footer-contact{font-size:12px;font-weight:600}.footer-bottom{border-top:1px solid #ffffff25;margin-top:20px;padding-top:13px;display:flex;justify-content:space-between;font-size:8px;opacity:.82}
.inner-hero{height:300px}.inner-hero .hero-inner{padding-top:43px}.inner-hero h1{font-size:43px}.inner-hero .benefits{bottom:18px}.compact .card{min-height:168px}.formwrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:55px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.full{grid-column:1/-1}label{display:block;font-size:11px;font-weight:700;margin-bottom:6px}input,select,textarea{width:100%;padding:12px;border:1px solid #cad6e2;border-radius:4px;font:12px Inter}textarea{min-height:130px}.contact-note{font-size:12px;color:var(--muted);line-height:1.6}
@media(max-width:1000px){.site-header,.navrow{height:auto}.navrow{padding:12px 0;flex-wrap:wrap}.logo{width:240px;flex-basis:240px}.navlinks{order:3;width:100%;height:40px;margin:5px 0 0;overflow:auto}.phone{margin-left:auto}.hero{height:auto;min-height:530px}.benefits{position:relative;margin-top:35px;bottom:auto}.cards{grid-template-columns:repeat(2,1fr)}.cards.three{grid-template-columns:repeat(2,1fr)}.split{grid-template-columns:1fr}.split-photo{min-height:320px}.footer-main{grid-template-columns:1fr;text-align:center}.footer-main img{margin:auto}.footer-nav{flex-wrap:wrap}.footer-bottom{flex-direction:column;text-align:center;gap:6px}}
@media(max-width:650px){.container{width:calc(100% - 30px)}.support{padding:10px 12px}.phone{display:none}.hero h1{font-size:38px}.lead{font-size:13px}.benefits{grid-template-columns:1fr 1fr}.cards,.cards.three{grid-template-columns:1fr}.section-head h2{font-size:28px}.split-copy{padding:35px 25px}.cta-row{grid-template-columns:1fr}.formwrap{grid-template-columns:1fr}.formgrid{grid-template-columns:1fr}.full{grid-column:auto}}


/* ===== FINAL HEADER + HERO GEOMETRY OVERRIDE ===== */
.site-header{
  height:64px !important;
  min-height:64px !important;
  background:#062d4b !important;
}
.navrow{
  height:64px !important;
  min-height:64px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:18px !important;
}
.logo{
  width:190px !important;
  flex:0 0 190px !important;
  height:58px !important;
  display:flex !important;
  align-items:center !important;
  overflow:hidden !important;
}
.logo img{
  width:190px !important;
  height:auto !important;
  max-height:56px !important;
  object-fit:contain !important;
  display:block !important;
}
.navlinks{
  margin-left:auto !important;
  height:64px !important;
  display:flex !important;
  align-items:center !important;
  gap:19px !important;
}
.navlinks a{
  height:64px !important;
  display:flex !important;
  align-items:center !important;
  padding:0 !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
.phone{
  font-size:11px !important;
  line-height:1 !important;
  white-space:nowrap !important;
  display:flex !important;
  align-items:center !important;
}
.support{
  padding:11px 16px !important;
  font-size:11px !important;
  line-height:1.1 !important;
  white-space:nowrap !important;
  margin-left:2px !important;
}

.hero{
  min-height:430px !important;
}
.hero-inner{
  padding-top:48px !important;
  padding-bottom:22px !important;
}
.hero h1{
  font-size:45px !important;
  line-height:1.02 !important;
  max-width:600px !important;
  margin:12px 0 14px !important;
}
.hero .lead{
  max-width:610px !important;
  font-size:13px !important;
  line-height:1.55 !important;
}
.actions{
  margin-top:20px !important;
  gap:12px !important;
  position:relative !important;
  z-index:3 !important;
}
.actions .btn{
  min-height:42px !important;
  padding:10px 20px !important;
}
.benefits{
  margin-top:34px !important;
  padding-top:0 !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:28px !important;
  position:relative !important;
  clear:both !important;
}
.benefit{
  min-width:0 !important;
  grid-template-columns:24px minmax(0,1fr) !important;
  gap:9px !important;
}
.benefit svg{
  width:20px !important;
  height:20px !important;
}
.benefit b{
  font-size:10px !important;
  line-height:1.25 !important;
  white-space:normal !important;
}
.benefit span{
  display:block !important;
  margin-top:3px !important;
  font-size:8.5px !important;
  line-height:1.3 !important;
}

@media (max-width:1100px){
  .navrow{gap:13px !important}
  .logo{width:175px !important;flex-basis:175px !important}
  .logo img{width:175px !important}
  .navlinks{gap:13px !important}
  .navlinks a,.phone,.support{font-size:10px !important}
}
@media (max-width:900px){
  .site-header{height:auto !important}
  .navrow{height:auto !important;min-height:64px !important;padding:8px 0 !important;flex-wrap:wrap !important}
  .navlinks{order:3;width:100% !important;height:38px !important;margin:0 !important;overflow-x:auto !important}
  .navlinks a{height:38px !important}
  .hero{min-height:500px !important}
  .benefits{grid-template-columns:repeat(2,1fr) !important;gap:18px 28px !important}
}
@media (max-width:650px){
  .logo{width:170px !important;flex-basis:170px !important}
  .logo img{width:170px !important}
  .support{padding:9px 11px !important}
  .hero h1{font-size:37px !important}
  .hero .lead{font-size:13px !important}
  .benefits{grid-template-columns:1fr 1fr !important;gap:16px !important}
}

/* ===== APPROVED HOME-PAGE PROPORTION LOCK ===== */
html{background:#eef2f5}
body{background:#eef2f5}
.site-shell{
  width:100%;
  max-width:1280px;
  margin:0 auto;
  background:#fff;
  box-shadow:0 0 28px rgba(0,28,52,.08);
  overflow:hidden;
}
.container{width:min(1120px,calc(100% - 64px))!important}

/* Restore the logo/header scale from the approved mockup */
.site-header{height:86px!important;min-height:86px!important}
.navrow{height:86px!important;min-height:86px!important;gap:19px!important}
.logo{width:250px!important;flex:0 0 250px!important;height:78px!important;overflow:visible!important}
.logo img{width:250px!important;max-height:76px!important;object-fit:contain!important}
.navlinks{height:86px!important;gap:18px!important}
.navlinks a{height:86px!important;font-size:11px!important}
.phone{font-size:11px!important}
.support{font-size:11px!important;padding:12px 17px!important}

/* Approved hero proportions */
.hero{min-height:500px!important}
.hero-inner{padding-top:53px!important;padding-bottom:0!important}
.hero h1{font-size:48px!important;line-height:1.01!important;max-width:610px!important}
.hero .lead{font-size:14px!important;line-height:1.55!important;max-width:610px!important}
.actions{margin-top:20px!important}

/* Compact benefit strip like approved mockup */
.benefits{
  height:72px!important;
  margin-top:28px!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:24px!important;
  align-items:center!important;
}
.benefit{
  display:grid!important;
  grid-template-columns:34px 1fr!important;
  gap:9px!important;
  align-items:center!important;
  height:54px!important;
}
.benefit svg{
  width:29px!important;
  height:29px!important;
  stroke:#fff!important;
  stroke-width:2.4!important;
}
.benefit b{font-size:11px!important;line-height:1.15!important}
.benefit span{font-size:8.5px!important;line-height:1.25!important;margin-top:4px!important}

/* Stronger service icons and cards */
.card svg{width:34px!important;height:34px!important;stroke-width:2.35!important}
.cards{gap:15px!important}
.card{padding:24px 22px!important}

/* Keep the lower approved composition from becoming excessively wide */
.section{padding:52px 0!important}
.split{max-width:1280px;margin:0 auto}
.cta{max-width:1280px;margin:0 auto}
.site-footer{max-width:1280px;margin:0 auto}

@media(max-width:1180px){
  .container{width:min(100% - 42px,1120px)!important}
  .logo{width:220px!important;flex-basis:220px!important}
  .logo img{width:220px!important}
  .navlinks{gap:13px!important}
}
@media(max-width:980px){
  .site-shell{max-width:none;box-shadow:none}
  .site-header{height:auto!important}
  .navrow{height:auto!important;min-height:76px!important;padding:8px 0!important;flex-wrap:wrap!important}
  .logo{width:205px!important;flex-basis:205px!important;height:66px!important}
  .logo img{width:205px!important;max-height:64px!important}
  .navlinks{order:3;width:100%!important;height:38px!important;margin:0!important;overflow-x:auto!important}
  .navlinks a{height:38px!important}
  .hero{min-height:560px!important}
  .benefits{height:auto!important;grid-template-columns:repeat(2,1fr)!important;gap:10px 22px!important}
}
@media(max-width:650px){
  .container{width:calc(100% - 30px)!important}
  .logo{width:185px!important;flex-basis:185px!important}
  .logo img{width:185px!important}
  .hero h1{font-size:39px!important}
  .benefits{grid-template-columns:1fr 1fr!important}
}

/* ===== POLISH PASS: APPROVED LOGO / BENEFIT POSITION / APPROVED PHOTO ===== */

/* The logo is now the user's original transparent artwork, so there is no
   rectangular background patch to mismatch the header/footer. */
.logo{
  width:245px!important;
  flex:0 0 245px!important;
  height:82px!important;
  overflow:visible!important;
}
.logo img{
  width:245px!important;
  height:auto!important;
  max-height:76px!important;
  object-fit:contain!important;
  background:transparent!important;
}
.footer-main img{
  width:220px!important;
  height:auto!important;
  background:transparent!important;
}

/* Keep the approved header proportions without shrinking the logo. */
.site-header{height:88px!important;min-height:88px!important}
.navrow{height:88px!important;min-height:88px!important}
.navlinks{height:88px!important}
.navlinks a{height:88px!important}

/* Move Local & Responsive / Proactive / Team / Success lower on every page.
   The row remains compact; only its vertical position changes. */
.benefits{
  margin-top:46px!important;
  height:66px!important;
  align-items:center!important;
}
.benefit{
  height:52px!important;
  align-items:center!important;
}
.benefit svg{
  width:30px!important;
  height:30px!important;
}

/* Give the hero enough room for the lowered benefit strip. */
.hero{min-height:530px!important}
.hero-inner{padding-bottom:18px!important}

/* Exact approved golf/Coachella Valley artwork: avoid browser enlargement blur. */
.split-photo{
  background-image:url('assets/desert-golf-approved.jpg')!important;
  background-size:cover!important;
  background-position:center center!important;
  image-rendering:auto;
}

/* Maintain the approved centered page width. */
.site-shell{max-width:1280px!important}
.container{width:min(1120px,calc(100% - 64px))!important}

@media(max-width:1180px){
  .logo{width:220px!important;flex-basis:220px!important}
  .logo img{width:220px!important}
}
@media(max-width:980px){
  .site-header{height:auto!important}
  .navrow{height:auto!important}
  .logo{width:205px!important;flex-basis:205px!important;height:68px!important}
  .logo img{width:205px!important;max-height:66px!important}
  .benefits{margin-top:38px!important;height:auto!important}
  .hero{min-height:590px!important}
}
@media(max-width:650px){
  .logo{width:190px!important;flex-basis:190px!important}
  .logo img{width:190px!important}
  .benefits{margin-top:34px!important}
}

/* ===== V5 IMAGE QUALITY + MICROSOFT 365 VISUAL RESTORATION ===== */

/* Let remote 3000px imagery render at native browser quality. */
.hero,.split-photo{
  background-repeat:no-repeat!important;
  background-size:cover!important;
  image-rendering:auto!important;
}

/* Remove the forced low-resolution local golf image from the previous revision. */
.split-photo{
  background-image:var(--section-image, none);
}

/* Microsoft 365 floating application visual */
.hero-inner{position:relative}
.m365-float{
  position:absolute;
  z-index:2;
  right:2%;
  top:62px;
  width:430px;
  height:310px;
  pointer-events:none;
}
.m365-float .app{
  position:absolute;
  width:72px;
  height:72px;
  border-radius:17px;
  display:grid;
  place-items:center;
  color:#fff;
  font:900 34px/1 "Segoe UI",Arial,sans-serif;
  box-shadow:0 18px 35px rgba(0,20,45,.25);
  border:1px solid rgba(255,255,255,.28);
  backdrop-filter:blur(3px);
}
.app-word{background:#185abd;left:15px;top:105px;transform:rotate(-8deg)}
.app-excel{background:#107c41;right:25px;top:18px;transform:rotate(7deg)}
.app-powerpoint{background:#d24726;left:78px;bottom:8px;transform:rotate(6deg)}
.app-outlook{background:#0078d4;right:30px;bottom:24px;transform:rotate(-7deg)}
.app-teams{background:#6264a7;left:180px;top:18px;transform:rotate(5deg)}
.app-onedrive{background:#1686d9;left:215px;bottom:0;font-size:29px}
.app-office{
  width:94px!important;height:94px!important;border-radius:26px!important;
  left:170px;top:105px;background:linear-gradient(135deg,#7b2cff,#e54ad4);
  font-size:55px!important;transform:rotate(-5deg)
}

/* Keep hero copy readable beside the restored app graphic. */
body:has(.m365-float) .hero .lead,
body:has(.m365-float) .hero h1{max-width:590px!important}

@media(max-width:980px){
  .m365-float{opacity:.38;right:-80px;transform:scale(.82);transform-origin:top right}
}
@media(max-width:650px){
  .m365-float{display:none}
}

/* ===== V6: LOCKED MOCKUP CORRECTIONS ===== */
.managed-coachella{
  background-position:center 47%!important;
  background-size:cover!important;
}

/* Hide the old V5 generic app-tile treatment completely. */
.m365-float{display:none!important}

/* Microsoft 365 hero artwork rebuilt to follow the approved mockup composition:
   large dimensional Teams / Outlook / SharePoint / OneDrive graphics, not letter tiles. */
.m365-approved-art{
  position:absolute;
  z-index:4;
  right:15px;
  top:42px;
  width:520px;
  height:275px;
  pointer-events:none;
  filter:drop-shadow(0 13px 15px rgba(0,28,65,.22));
}
.ms-teams,.ms-outlook,.ms-sharepoint,.ms-onedrive{position:absolute}
.ms-teams{left:5px;top:54px;width:150px;height:125px}
.ms-teams .t-main{
  position:absolute;left:0;top:30px;width:62px;height:70px;border-radius:12px;
  display:grid;place-items:center;background:linear-gradient(145deg,#7b83eb,#5457c8);
  color:white;font:800 38px/1 Arial,sans-serif;box-shadow:7px 8px 0 rgba(68,70,176,.38)
}
.ms-teams:after{
  content:"";position:absolute;left:55px;top:34px;width:82px;height:67px;border-radius:13px;
  background:linear-gradient(145deg,#777bea,#5b5fc7)
}
.ms-teams .person{position:absolute;border-radius:50%;background:#7d83ed;z-index:3}
.ms-teams .p1{width:32px;height:32px;left:62px;top:0}
.ms-teams .p2{width:27px;height:27px;left:99px;top:9px}
.ms-teams .p3{width:23px;height:23px;left:126px;top:19px}

.ms-outlook{left:142px;top:17px;width:145px;height:135px}
.ms-outlook .o-front{
  position:absolute;z-index:3;left:0;top:34px;width:62px;height:76px;border-radius:8px;
  display:grid;place-items:center;background:linear-gradient(145deg,#1473e6,#0758b8);
  color:#fff;font:700 39px/1 Arial,sans-serif
}
.ms-outlook .o-envelope{
  position:absolute;left:43px;top:0;width:96px;height:116px;border-radius:9px;
  background:linear-gradient(145deg,#2997f0,#0b65c8);transform:skewY(5deg)
}
.ms-outlook .o-envelope:after{
  content:"";position:absolute;left:8px;right:8px;bottom:12px;height:55px;
  background:linear-gradient(35deg,transparent 48%,rgba(255,255,255,.35) 49% 52%,transparent 53%),
             linear-gradient(-35deg,transparent 48%,rgba(255,255,255,.25) 49% 52%,transparent 53%)
}

.ms-sharepoint{left:290px;top:50px;width:140px;height:120px}
.ms-sharepoint .sp{position:absolute;border-radius:50%;background:linear-gradient(145deg,#22b7aa,#087d79)}
.ms-sharepoint .c1{width:74px;height:74px;left:35px;top:20px}
.ms-sharepoint .c2{width:55px;height:55px;left:76px;top:46px}
.ms-sharepoint .c3{width:45px;height:45px;left:65px;top:0}
.ms-sharepoint span{
  position:absolute;z-index:3;left:5px;top:39px;width:58px;height:62px;border-radius:8px;
  display:grid;place-items:center;background:#087d79;color:white;font:700 35px/1 Arial,sans-serif
}

.ms-onedrive{right:0;bottom:22px;width:145px;height:95px}
.ms-onedrive i,.ms-onedrive b,.ms-onedrive em{position:absolute;background:#1884e8;border-radius:50%;font-style:normal}
.ms-onedrive i{width:78px;height:78px;left:10px;top:0;background:#1b6fd1}
.ms-onedrive b{width:70px;height:70px;right:5px;top:18px;background:#178de7}
.ms-onedrive em{
  width:126px;height:52px;left:5px;bottom:0;border-radius:38px 38px 28px 28px;
  background:linear-gradient(180deg,#238ff0,#0872d2)
}

/* Leave the left-side approved copy unobstructed. */
body:has(.m365-approved-art) .hero h1,
body:has(.m365-approved-art) .hero .lead{max-width:565px!important}

@media(max-width:1050px){
  .m365-approved-art{right:-35px;transform:scale(.84);transform-origin:top right}
}
@media(max-width:780px){
  .m365-approved-art{opacity:.28;right:-130px}
}
@media(max-width:650px){
  .m365-approved-art{display:none}
}

/* ===== V7 FINAL HERO BENEFIT POSITION ===== */
/* One rule for every page: benefit strip sits exactly 18px above hero bottom. */
.hero{
  position:relative!important;
  min-height:530px!important;
}
.hero-inner{
  position:relative!important;
  min-height:530px!important;
  box-sizing:border-box!important;
  padding-bottom:112px!important;
}
.hero .benefits{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:18px!important;
  margin:0!important;
  height:72px!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  align-items:center!important;
  gap:24px!important;
}
.hero .benefit{
  height:54px!important;
  margin:0!important;
  align-items:center!important;
}

/* Microsoft 365: no floating Microsoft application artwork. */
.m365-approved-art,.m365-float{display:none!important}

/* Managed IT intentionally shares the Home hero photograph. */
.managed-coachella{background-position:center center!important}

@media(max-width:980px){
  .hero{min-height:610px!important}
  .hero-inner{min-height:610px!important;padding-bottom:155px!important}
  .hero .benefits{
    bottom:18px!important;
    height:128px!important;
    grid-template-columns:repeat(2,1fr)!important;
    gap:8px 22px!important;
  }
}
@media(max-width:650px){
  .hero{min-height:680px!important}
  .hero-inner{min-height:680px!important;padding-bottom:190px!important}
  .hero .benefits{
    bottom:18px!important;
    height:166px!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px 14px!important;
  }
}

/* ===== V8 GO-LIVE HERO SPACING =====
   Desktop hero uses a three-row grid:
   1) copy
   2) actions
   3) benefit row centered in the remaining space to the bottom of the image.
   This keeps the visual gap balanced on every page even when headline lengths differ.
*/
@media(min-width:981px){
  .hero{
    min-height:530px!important;
  }
  .hero .hero-inner{
    min-height:530px!important;
    height:530px!important;
    box-sizing:border-box!important;
    padding-top:52px!important;
    padding-bottom:18px!important;
    display:flex!important;
    flex-direction:column!important;
  }
  .hero .actions{
    flex:0 0 auto!important;
  }
  .hero .benefits{
    position:static!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    margin-top:auto!important;
    margin-bottom:auto!important;
    transform:translateY(13px)!important;
    width:100%!important;
    height:72px!important;
    min-height:72px!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:24px!important;
    align-items:center!important;
  }
}
/* Keep vector artwork razor-sharp at every scale. */
svg{shape-rendering:geometricPrecision}
.logo img,.footer-main img{image-rendering:auto}

/* ===== V9 READABILITY PASS: HERO BENEFIT TEXT =====
   Applied identically across every page. */
.hero .benefit b{
  font-size:14px!important;
  line-height:1.22!important;
  font-weight:800!important;
  letter-spacing:-0.1px!important;
}
.hero .benefit span{
  font-size:11px!important;
  line-height:1.35!important;
  font-weight:500!important;
  margin-top:4px!important;
}
.hero .benefit{
  grid-template-columns:34px minmax(0,1fr)!important;
  gap:11px!important;
}
.hero .benefit svg{
  width:30px!important;
  height:30px!important;
}

@media(max-width:1180px){
  .hero .benefit b{font-size:13px!important}
  .hero .benefit span{font-size:10.5px!important}
}
@media(max-width:650px){
  .hero .benefit b{font-size:12.5px!important}
  .hero .benefit span{font-size:10px!important}
}