/*
Theme Name: ConnectFix Ready v71
Theme URI: https://connectfix.co.uk/
Author: ConnectFix
Description: Custom ConnectFix theme for local and international remote IT support.
Version: 71.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: connectfix-ready-v71
*/
:root{
  --navy:#06285f;
  --navy-deep:#06182f;
  --blue:#078cff;
  --cyan:#11baff;
  --text:#0a1730;
  --muted:#5d6a7e;
  --bg:#f6f9fd;
  --white:#fff;
  --line:#e4ebf4;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:#fff;line-height:1.5}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
.wrap{width:min(1220px,calc(100% - 42px));margin:auto}
.kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:900;color:var(--blue)}
.kicker.light{color:#69caff}

.site-header{position:fixed;top:0;left:0;right:0;width:100%;z-index:9999;background:linear-gradient(90deg,#05275d,#063676);color:#fff;border-bottom:1px solid rgba(255,255,255,.1)}
.header-inner{height:76px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;flex:0 0 auto}
.brand img{display:none}
.nav{display:flex;align-items:center;gap:24px;margin-left:auto;font-weight:800;font-size:14px;white-space:nowrap}
.nav a{opacity:.95}
.nav a:hover{color:#55ceff}
.header-cta{margin-left:8px;padding:14px 22px;border-radius:11px;background:linear-gradient(135deg,#13b7ff,#078cff);font-weight:900;box-shadow:0 10px 24px rgba(0,142,255,.25)}
.mobile-toggle{display:none;border:0;background:none;color:#fff;font-size:28px;margin-left:auto}

.hero{background:linear-gradient(90deg,#06285f 0%,#0861c7 48%,#0f8ee4 100%);color:#fff}
.hero-grid{display:grid;grid-template-columns:minmax(420px,44%) 1fr;min-height:430px;width:100%;margin:0}
.hero-copy{display:flex;flex-direction:column;justify-content:center;padding:30px clamp(24px,3vw,52px);padding-left:clamp(24px,4vw,64px)}
.hero h1{font-size:clamp(42px,4.2vw,64px);line-height:.98;margin:0 0 20px;letter-spacing:-.035em}
.hero h1 span{color:#1bc5ff}
.hero p{font-size:18px;color:#f0f7ff;max-width:610px;margin:0 0 26px}
.actions{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:14px 24px;border-radius:10px;font-weight:900;transition:.18s;border:1px solid transparent}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,#14b8ff,#087cff);color:#fff;box-shadow:0 10px 24px rgba(0,136,255,.2)}
.btn-outline{background:rgba(0,32,79,.26);border-color:rgba(255,255,255,.85);color:#fff}
.btn-light{background:#fff;border-color:#ccd8e7;color:var(--text)}
.hero-media{min-height:430px;background:
  linear-gradient(90deg,#0861c7 0%,rgba(8,97,199,.12) 15%,rgba(8,97,199,0) 36%),
  url('assets/images/hero.jpg') center/cover no-repeat}

.service-strip{background:#fff;border-bottom:1px solid var(--line)}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.service-item{display:grid;grid-template-columns:58px 1fr;gap:18px;padding:30px 28px;border-right:1px solid var(--line);scroll-margin-top:92px}
.service-item:last-child{border-right:0}
.service-icon{width:54px;height:54px;border-radius:50%;background:#eaf4ff;display:grid;place-items:center;font-size:27px}
.service-item h3{font-size:20px;margin:0 0 8px}
.service-item p{font-size:15px;color:var(--muted);margin:0 0 10px}
.service-item a{color:#0785f6;font-weight:800;font-size:14px}

.local-section{padding:36px 0 52px;background:#fff}
.local-card{background:#f7f9fc;border:1px solid #edf1f6;border-radius:18px;padding:18px;display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center}
.city-photo img{width:100%;height:245px;object-fit:cover;border-radius:14px}
.local-copy{padding:12px 30px 12px 0}
.local-copy h2{font-size:42px;line-height:1.02;margin:10px 0 16px;letter-spacing:-.025em}
.local-copy p{font-size:18px;color:var(--muted);margin:0}
.pills{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}
.pills span{background:#eaf3fb;color:#34516f;padding:8px 12px;border-radius:999px;font-size:13px;font-weight:800}

.remote-band{background:linear-gradient(135deg,#06285f,#0a4f9d);color:#fff;padding:54px 0}
.remote-band-inner{display:flex;align-items:center;justify-content:space-between;gap:38px}
.remote-band h2{font-size:38px;margin:7px 0 10px}
.remote-band p{max-width:760px;color:#dcecff;font-size:17px;margin:0}

.support-section{padding:72px 0;background:#f6f9fd;scroll-margin-top:80px}
.support-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:42px;align-items:start}
.support-intro h2{font-size:46px;line-height:1.05;margin:10px 0 18px}
.support-intro p{font-size:18px;color:var(--muted)}
.contact-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}
.support-form-card{background:#fff;border:1px solid var(--line);box-shadow:0 14px 40px rgba(20,45,80,.08);border-radius:18px;padding:28px}
.support-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.support-form label{display:flex;flex-direction:column;gap:7px;font-weight:800;font-size:14px}
.support-form .full{grid-column:1/-1}
.support-form input,.support-form select,.support-form textarea{width:100%;border:1px solid #cfd9e6;border-radius:9px;padding:12px 13px;font:inherit;color:var(--text);background:#fff}
.support-form textarea{resize:vertical}
.submit-btn{border:0;cursor:pointer}
.form-message{padding:12px 14px;border-radius:9px;margin-bottom:18px;font-weight:800}
.form-message.success{background:#e6f8ec;color:#176c37}
.form-message.error{background:#fff0f0;color:#9b2626}

.footer{background:#071b36;color:#d5e0ef;padding:46px 0 20px}
.footer-grid{display:grid;grid-template-columns:1.45fr .7fr .8fr 1fr;gap:36px}
.footer-logo-box{background:transparent;border-radius:0;padding:0;display:block;max-width:360px}
.footer-logo-box img{width:330px;height:auto}
.footer-brand p{max-width:390px;color:#b8c8dc;margin:18px 0 0}
.footer h4{color:#fff;margin:0 0 14px;font-size:17px}
.footer-grid>div:not(.footer-brand){display:flex;flex-direction:column;gap:8px}
.footer-grid a{color:#d5e0ef}
.footer-grid a:hover{color:#5bcaff}
.footer-grid span{color:#b8c8dc}
.footer-bottom{margin-top:34px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:20px;font-size:13px;color:#94a9c2}

@media(max-width:1050px){
  .brand img{width:270px}
  .nav{gap:16px;font-size:13px}
  .header-cta{padding:12px 16px}
  .hero-grid{grid-template-columns:minmax(360px,46%) 1fr}
  .service-item{padding:26px 18px;grid-template-columns:48px 1fr}
  .service-icon{width:46px;height:46px}
}

@media(max-width:900px){
  .header-inner{height:72px}
  .mobile-toggle{display:block}
  .header-cta{display:none}
  .nav{display:none;position:absolute;left:0;right:0;top:72px;background:#06285f;padding:18px 22px;flex-direction:column;align-items:flex-start;gap:14px}
  .nav.open{display:flex}
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{padding:34px 28px}
  .hero-media{min-height:360px}
  .service-grid{grid-template-columns:1fr 1fr}
  .service-item:nth-child(2){border-right:0}
  .service-item{border-bottom:1px solid var(--line)}
  .local-card{grid-template-columns:1fr}
  .local-copy{padding:8px 12px 18px}
  .remote-band-inner{flex-direction:column;align-items:flex-start}
  .support-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:600px){
  .wrap{width:min(100% - 28px,1220px)}
  .brand img{width:220px;height:48px;max-height:48px}
  .hero h1{font-size:44px}
  .hero p{font-size:17px}
  .hero-media{min-height:295px}
  .actions .btn{width:100%}
  .service-grid{grid-template-columns:1fr}
  .service-item{border-right:0}
  .local-copy h2{font-size:34px}
  .city-photo img{height:190px}
  .remote-band h2{font-size:32px}
  .support-intro h2{font-size:38px}
  .support-form{grid-template-columns:1fr}
  .support-form .full{grid-column:auto}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column}
}

/* v5 responsive refinements */
.hero,
.hero-grid{
  width:100%;
  max-width:none;
}
.hero-copy{
  margin:0;
}
@media (min-width:1400px){
  .hero-grid{grid-template-columns:42% 58%}
  .hero-copy{padding-left:clamp(28px,3vw,56px)}
}
@media (max-width:899px){
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{padding:32px 24px 28px}
  .hero-media{min-height:300px}
}
@media (max-width:599px){
  .hero-copy{padding:28px 18px 24px}
  .hero h1{font-size:40px}
  .hero-media{min-height:240px}
}

/* v8 header-logo correction only */
.brand{
  display:flex;
  align-items:center;
  overflow:visible;
  flex:0 0 auto;
  min-width:0;
}
.site-header,
.header-inner{
  overflow:visible;
}

/* v10 - final header logo correction */
.brand{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  overflow:visible !important;
  line-height:1;
  flex:0 0 auto;
}
.brand img{
  overflow:visible !important;
  clip-path:none !important;
}
.site-header,
.header-inner{
  overflow:visible !important;
}
@media(max-width:1050px){
  .brand img{width:255px;max-height:48px;}
}
@media(max-width:600px){
  .brand img{width:205px;max-height:44px;}
}

/* v11 - robust header logo rendering */
.brand{
  width:300px;
  height:52px;
  flex:0 0 300px;
  display:block;
  background-image:url('assets/images/logo-header.png');
  background-repeat:no-repeat;
  background-position:left center;
  background-size:contain;
  overflow:visible !important;
}
.header-inner{
  min-height:76px;
  align-items:center;
  overflow:visible !important;
}
.site-header{
  overflow:visible !important;
}
@media(max-width:1050px){
  .brand{
    width:265px;
    height:48px;
    flex-basis:265px;
  }
}
@media(max-width:600px){
  .brand{
    width:210px;
    height:44px;
    flex-basis:210px;
  }
}


/* v12 — header correction */
.site-header{
  position:fixed !important;
  top:0 !important;
  left:0;
  right:0;
  width:100%;
  z-index:9999;
}

/* WordPress admin toolbar is 32px high on desktop.
   Without this, the toolbar sits on top of the header and visually cuts the logo. */
.admin-bar .site-header{
  top:32px !important;
}

/* Keep page content below the fixed header. */
body{
  padding-top:76px;
}

/* Logo stays fully inside the header and is moved slightly upward. */
.brand{
  background-size:97% auto !important;
  background-position:left calc(50% - 2px) !important;
  overflow:visible !important;
}

/* Mobile WordPress toolbar uses 46px. */
@media (max-width:782px){
  .admin-bar .site-header{
    top:46px !important;
  }
}

@media (max-width:600px){
  body{
    padding-top:72px;
  }
}


/* =========================================================
   ConnectFix Ready v15 — HEADER ONLY
   Final clean override. No footer/banner/content changes.
   ========================================================= */

.site-header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:9999 !important;
  overflow:visible !important;
}

.admin-bar .site-header{
  top:32px !important;
}

.header-inner{
  height:74px !important;
  min-height:74px !important;
  display:flex !important;
  align-items:center !important;
  overflow:visible !important;
}

.brand{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex:0 0 auto !important;
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  overflow:visible !important;
  background:none !important;
  line-height:1 !important;
}

.brand img{
  display:block !important;
  width:auto !important;
  height:48px !important;
  max-width:none !important;
  max-height:48px !important;
  object-fit:contain !important;
  object-position:left center !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
  clip-path:none !important;
  overflow:visible !important;
}

body{
  padding-top:74px !important;
}

@media(max-width:1050px){
  .brand img{
    height:46px !important;
    max-height:46px !important;
  }
}

@media(max-width:900px){
  .header-inner{
    height:70px !important;
    min-height:70px !important;
  }

  .brand img{
    height:44px !important;
    max-height:44px !important;
  }

  .nav{
    top:70px !important;
  }

  body{
    padding-top:70px !important;
  }
}

@media(max-width:782px){
  .admin-bar .site-header{
    top:46px !important;
  }
}

@media(max-width:600px){
  .brand img{
    height:42px !important;
    max-height:42px !important;
  }
}


/* =========================================================
   ConnectFix Ready v16 — FOOTER ONLY
   Footer logo artwork unchanged; transparent top space removed
   so the visible logo starts at the same height as Quick Links.
   ========================================================= */
.footer-logo-box{
  margin-top:0 !important;
  padding-top:0 !important;
}
.footer-logo-box img{
  display:block !important;
  margin-top:0 !important;
}


/* =========================================================
   ConnectFix Ready v17 — HEADER ONLY
   Remove logo from the header. Everything else unchanged.
   ========================================================= */
.site-header .brand,
.site-header .brand img{
  display:none !important;
}


/* =========================================================
   ConnectFix Ready v17.1 — DISTRIBUTION ONLY
   Keeps header/footer/banner exactly as v17.
   Widens ONLY the services row and Canterbury local section.
   ========================================================= */

/* Services row: use more of the screen width without changing the cards themselves */
.service-strip .service-grid{
  width:min(1480px,calc(100% - 28px)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Local Canterbury section: wider, better balanced image/text proportions */
.local-section .local-card{
  width:min(1480px,calc(100% - 28px)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  grid-template-columns:1.15fr .85fr !important;
  gap:38px !important;
  padding:20px !important;
}

.local-section .city-photo img{
  height:300px !important;
}

.local-section .local-copy{
  padding:14px 34px 14px 0 !important;
}

@media(max-width:900px){
  .service-strip .service-grid,
  .local-section .local-card{
    width:min(100% - 28px,1220px) !important;
  }

  .local-section .local-card{
    grid-template-columns:1fr !important;
    gap:22px !important;
  }

  .local-section .city-photo img{
    height:245px !important;
  }

  .local-section .local-copy{
    padding:8px 12px 18px !important;
  }
}

@media(max-width:600px){
  .service-strip .service-grid,
  .local-section .local-card{
    width:min(100% - 20px,1220px) !important;
  }

  .local-section .city-photo img{
    height:190px !important;
  }
}


/* =========================================================
   ConnectFix Ready v17.2 — remote blue band distribution only
   Keeps all v17.1 changes intact.
   Makes the blue remote band wider and a bit thinner.
   ========================================================= */
.remote-band{padding:30px 0 !important;}
.remote-band .remote-band-inner{
  width:min(1480px,calc(100% - 28px)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  gap:24px !important;
  align-items:center !important;
}
.remote-band h2{
  font-size:32px !important;
  margin:4px 0 8px !important;
  line-height:1.12 !important;
}
.remote-band p{
  max-width:980px !important;
  font-size:16px !important;
}
.remote-band .btn{
  padding:12px 20px !important;
  white-space:nowrap !important;
}
@media(max-width:900px){
  .remote-band{padding:24px 0 !important;}
  .remote-band .remote-band-inner{
    width:min(100% - 28px,1480px) !important;
    gap:18px !important;
  }
  .remote-band h2{font-size:28px !important;}
}
@media(max-width:600px){
  .remote-band{padding:22px 0 !important;}
  .remote-band .remote-band-inner{
    width:min(100% - 20px,1480px) !important;
    gap:16px !important;
  }
  .remote-band h2{font-size:24px !important;}
  .remote-band p{font-size:15px !important;}
}


/* =========================================================
   ConnectFix Ready v18 — support section + footer distribution only
   Keeps all earlier header/banner/row changes intact.
   Makes the support request section and footer use more screen width
   and feel less centered / more balanced.
   ========================================================= */
.support-section{
  padding:64px 0 !important;
}
.support-section .support-grid{
  width:min(1480px,calc(100% - 28px)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  grid-template-columns:.9fr 1.1fr !important;
  gap:34px !important;
  align-items:start !important;
}
.support-intro{
  max-width:620px !important;
}
.support-intro h2{
  font-size:54px !important;
  line-height:1.03 !important;
  margin:10px 0 16px !important;
}
.support-intro p{
  max-width:560px !important;
}
.support-form-card{
  max-width:none !important;
}
.footer{
  padding:38px 0 18px !important;
}
.footer .footer-grid,
.footer .footer-bottom{
  width:min(1480px,calc(100% - 28px)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.footer-grid{
  grid-template-columns:1.3fr .8fr .9fr 1fr !important;
  gap:34px !important;
}
.footer-brand p{
  max-width:420px !important;
}
@media(max-width:1100px){
  .support-section .support-grid{
    grid-template-columns:1fr !important;
    gap:26px !important;
  }
  .support-intro{
    max-width:none !important;
  }
  .support-intro h2{
    font-size:42px !important;
  }
  .footer-grid{
    grid-template-columns:1fr 1fr !important;
  }
}
@media(max-width:700px){
  .support-section{
    padding:48px 0 !important;
  }
  .support-section .support-grid,
  .footer .footer-grid,
  .footer .footer-bottom{
    width:min(100% - 20px,1480px) !important;
  }
  .support-intro h2{
    font-size:34px !important;
  }
  .footer-grid{
    grid-template-columns:1fr !important;
    gap:24px !important;
  }
}


/* =========================================================
   ConnectFix Ready v19 — FOOTER POLISH ONLY
   Keeps all v18 sections unchanged.
   ========================================================= */

/* Give the logo/description column a little more breathing room
   before Quick Links without changing the footer structure. */
.footer .footer-brand{
  padding-right:26px !important;
}

/* Slightly refine spacing between footer columns. */
.footer .footer-grid{
  column-gap:40px !important;
}

/* Lift the copyright/service line slightly from the very bottom. */
.footer{
  padding-bottom:28px !important;
}

.footer .footer-bottom{
  margin-top:28px !important;
  padding-top:16px !important;
}

/* Keep mobile comfortable and avoid unnecessary extra gaps. */
@media(max-width:1100px){
  .footer .footer-brand{
    padding-right:0 !important;
  }
  .footer .footer-grid{
    column-gap:30px !important;
  }
}

@media(max-width:700px){
  .footer{
    padding-bottom:24px !important;
  }
  .footer .footer-bottom{
    margin-top:24px !important;
  }
}


/* =========================================================
   ConnectFix Ready v20 — HEADER LOGO ONLY
   Uses the latest approved ConnectFix logo without tagline.
   Positioned further left and vertically centered.
   All V19 content/footer changes remain unchanged.
   ========================================================= */

.site-header .header-inner{
  width:min(1480px,calc(100% - 28px)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  display:flex !important;
  align-items:center !important;
  overflow:visible !important;
}

.site-header .brand{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex:0 0 auto !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
}

.site-header .brand img{
  display:block !important;
  width:auto !important;
  height:50px !important;
  max-width:330px !important;
  max-height:50px !important;
  object-fit:contain !important;
  object-position:left center !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
  clip-path:none !important;
}

/* Keep nav to the right of the logo with balanced spacing. */
.site-header .nav{
  margin-left:auto !important;
}

@media(max-width:1050px){
  .site-header .header-inner{
    width:min(100% - 24px,1480px) !important;
  }

  .site-header .brand img{
    height:46px !important;
    max-height:46px !important;
    max-width:285px !important;
  }
}

@media(max-width:900px){
  .site-header .header-inner{
    width:min(100% - 20px,1480px) !important;
  }

  .site-header .brand img{
    height:40px !important;
    max-height:40px !important;
    max-width:245px !important;
  }
}

@media(max-width:600px){
  .site-header .brand img{
    height:37px !important;
    max-height:37px !important;
    max-width:225px !important;
  }
}


/* =========================================================
   ConnectFix Ready v21 — MOBILE FOOTER ONLY
   Desktop/tablet layout remains exactly as V20.
   ========================================================= */

@media (max-width:700px){

  .footer{
    padding:30px 0 22px !important;
  }

  .footer .footer-grid{
    width:min(100% - 20px,1480px) !important;
    grid-template-columns:1fr !important;
    gap:26px !important;
  }

  .footer .footer-brand{
    padding-right:0 !important;
    margin-bottom:6px !important;
  }

  .footer-logo-box{
    max-width:100% !important;
  }

  .footer-logo-box img{
    width:280px !important;
    max-width:88% !important;
    height:auto !important;
    display:block !important;
  }

  .footer-brand p{
    margin-top:14px !important;
    max-width:100% !important;
    line-height:1.6 !important;
  }

  .footer-grid > div:not(.footer-brand){
    gap:7px !important;
  }

  .footer h4{
    margin-bottom:10px !important;
  }

  .footer .footer-bottom{
    width:min(100% - 20px,1480px) !important;
    margin-top:26px !important;
    padding-top:18px !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px !important;
    text-align:left !important;
  }
}


/* =========================================================
   ConnectFix Ready v22 — MOBILE FOOTER REDESIGN
   Desktop remains unchanged. This creates a clearly different,
   cleaner stacked footer on phones.
   ========================================================= */

@media (max-width:700px){

  .footer{
    padding:26px 0 20px !important;
  }

  .footer .footer-grid{
    width:calc(100% - 28px) !important;
    max-width:none !important;
    margin:0 auto !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:0 !important;
  }

  .footer .footer-brand{
    padding:0 0 22px !important;
    margin:0 0 22px !important;
    border-bottom:1px solid rgba(255,255,255,.12) !important;
  }

  .footer-logo-box{
    width:100% !important;
    max-width:none !important;
    margin:0 0 12px !important;
    padding:0 !important;
  }

  .footer-logo-box img{
    width:245px !important;
    max-width:82% !important;
    height:auto !important;
    display:block !important;
    margin:0 !important;
  }

  .footer-brand p{
    max-width:100% !important;
    margin:10px 0 0 !important;
    font-size:14px !important;
    line-height:1.55 !important;
  }

  .footer-grid > div:not(.footer-brand){
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
    padding:0 0 20px !important;
    margin:0 0 20px !important;
    border-bottom:1px solid rgba(255,255,255,.10) !important;
  }

  .footer-grid > div:not(.footer-brand):last-child{
    margin-bottom:0 !important;
  }

  .footer h4{
    margin:0 0 8px !important;
    font-size:16px !important;
  }

  .footer-grid a,
  .footer-grid span{
    font-size:14px !important;
    line-height:1.45 !important;
  }

  .footer .footer-bottom{
    width:calc(100% - 28px) !important;
    max-width:none !important;
    margin:22px auto 0 !important;
    padding:16px 0 0 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    gap:8px !important;
    text-align:left !important;
    font-size:12px !important;
  }
}


/* =========================================================
   ConnectFix Ready v23 — MOBILE FOOTER LAYOUT
   Desktop/tablet remain unchanged.
   ========================================================= */

@media (max-width:700px){

  .footer{
    padding:24px 0 18px !important;
  }

  .footer .footer-grid{
    width:calc(100% - 28px) !important;
    max-width:none !important;
    margin:0 auto !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    column-gap:22px !important;
    row-gap:0 !important;
    align-items:start !important;
  }

  /* Brand takes the full first row */
  .footer .footer-brand{
    grid-column:1 / -1 !important;
    padding:0 0 18px !important;
    margin:0 0 18px !important;
    border-bottom:1px solid rgba(255,255,255,.12) !important;
  }

  .footer-logo-box{
    width:100% !important;
    max-width:none !important;
    margin:0 0 10px !important;
    padding:0 !important;
  }

  .footer-logo-box img{
    width:245px !important;
    max-width:82% !important;
    height:auto !important;
    display:block !important;
    margin:0 !important;
  }

  .footer-brand p{
    margin:10px 0 0 !important;
    max-width:100% !important;
    font-size:13.5px !important;
    line-height:1.5 !important;
  }

  /* Quick Links + Our Services side by side */
  .footer .footer-grid > div:nth-child(2),
  .footer .footer-grid > div:nth-child(3){
    display:flex !important;
    flex-direction:column !important;
    gap:7px !important;
    padding:0 0 18px !important;
    margin:0 !important;
    border:0 !important;
  }

  /* Support Area full width below */
  .footer .footer-grid > div:nth-child(4){
    grid-column:1 / -1 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:7px !important;
    padding:18px 0 0 !important;
    margin:0 !important;
    border-top:1px solid rgba(255,255,255,.10) !important;
    border-bottom:0 !important;
  }

  .footer h4{
    margin:0 0 8px !important;
    font-size:15px !important;
  }

  .footer-grid a,
  .footer-grid span{
    font-size:13.5px !important;
    line-height:1.4 !important;
  }

  .footer .footer-bottom{
    width:calc(100% - 28px) !important;
    max-width:none !important;
    margin:20px auto 0 !important;
    padding:14px 0 0 !important;
    border-top:1px solid rgba(255,255,255,.12) !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:7px !important;
    text-align:left !important;
    font-size:11.5px !important;
    line-height:1.4 !important;
  }
}


/* =========================================================
   ConnectFix Ready v24 — MOBILE HEADER LOGO ONLY
   +10% on phones, keeping the same left position and vertical centering.
   Everything else remains exactly as V23.
   ========================================================= */

@media (max-width:600px){

  .site-header .header-inner{
    align-items:center !important;
  }

  .site-header .brand{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    margin:0 !important;
    padding:0 !important;
  }

  .site-header .brand img{
    height:41px !important;
    max-height:41px !important;
    width:auto !important;
    max-width:248px !important;
    margin:0 !important;
    transform:none !important;
    object-fit:contain !important;
    object-position:left center !important;
  }
}


/* =========================================================
   ConnectFix Ready v25 — MOBILE ONLY
   +5% header logo vs v24
   More spacing above and inside Support Area in footer
   ========================================================= */

@media (max-width:600px){

  /* Header logo +5% over v24 */
  .site-header .brand img{
    height:43px !important;
    max-height:43px !important;
    width:auto !important;
    max-width:260px !important;
    margin:0 !important;
    transform:none !important;
    object-fit:contain !important;
    object-position:left center !important;
  }

  /* Keep logo left-aligned and vertically centered */
  .site-header .header-inner,
  .site-header .brand{
    align-items:center !important;
  }

  .site-header .brand{
    justify-content:flex-start !important;
  }

  /* More breathing room for Support Area */
  .footer .footer-grid > div:nth-child(4){
    padding-top:24px !important;
    margin-top:4px !important;
    gap:9px !important;
  }

  .footer .footer-grid > div:nth-child(4) h4{
    margin-bottom:10px !important;
  }

  .footer .footer-grid > div:nth-child(4) a,
  .footer .footer-grid > div:nth-child(4) span{
    line-height:1.55 !important;
  }
}


/* =========================================================
   ConnectFix Ready v31
   Base: current published V26 layout
   Visual direction: third approved reference
   ========================================================= */

:root{
  --cf-page:#eef7ff;
  --cf-card:#f8fbff;
  --cf-card-border:#cfe5fb;
  --cf-navy:#082d63;
  --cf-blue:#0d8cff;
  --cf-cyan:#18c0f7;
}

/* Modern pale-blue canvas instead of flat white */
.service-strip,
.local-section{
  background:
    radial-gradient(circle at 8% 15%, rgba(25,171,255,.09), transparent 28%),
    radial-gradient(circle at 92% 85%, rgba(22,120,255,.07), transparent 30%),
    var(--cf-page) !important;
}

/* Modern service cards */
.service-strip{
  padding:22px 0 26px !important;
  border-bottom:1px solid rgba(32,120,205,.12) !important;
}

.service-strip .service-grid{
  gap:14px !important;
}

.service-item{
  position:relative !important;
  display:grid !important;
  grid-template-columns:66px 1fr !important;
  gap:16px !important;
  padding:22px 22px 20px !important;
  border:1px solid var(--cf-card-border) !important;
  border-radius:18px !important;
  background:
    radial-gradient(circle at 100% 100%, rgba(26,186,255,.10), transparent 42%),
    var(--cf-card) !important;
  box-shadow:0 12px 30px rgba(14,67,124,.08) !important;
  overflow:hidden !important;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}

.service-item:last-child{
  border-right:1px solid var(--cf-card-border) !important;
}

.service-item:hover{
  transform:translateY(-3px) !important;
  border-color:#9ccfff !important;
  box-shadow:0 18px 38px rgba(14,67,124,.13) !important;
}

.service-icon{
  width:56px !important;
  height:56px !important;
  border-radius:16px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:27px !important;
  background:linear-gradient(145deg,#e8f6ff,#d7edff) !important;
  box-shadow:inset 0 0 0 1px rgba(21,136,240,.07) !important;
}

.service-item:nth-child(2) .service-icon{
  background:linear-gradient(145deg,#e3fbff,#d5f5ff) !important;
}

.service-item:nth-child(3) .service-icon{
  background:linear-gradient(145deg,#eeeeff,#dfe6ff) !important;
}

.service-item:nth-child(4) .service-icon{
  background:linear-gradient(145deg,#e2fbff,#d4f5ff) !important;
}

.service-item h3{
  color:#0c2452 !important;
  font-size:19px !important;
  margin:2px 0 7px !important;
}

.service-item p{
  color:#49627f !important;
  line-height:1.5 !important;
  margin-bottom:12px !important;
}

.service-item a{
  color:#087ef0 !important;
  font-weight:800 !important;
  text-decoration:none !important;
}

/* Small round arrow for a more app-like feel */
.service-item::after{
  content:"›" !important;
  position:absolute !important;
  right:15px !important;
  bottom:14px !important;
  width:34px !important;
  height:34px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#0a82f4 !important;
  background:#fff !important;
  border:1px solid #d3e8fb !important;
  font-size:24px !important;
  font-weight:500 !important;
}

/* Modern Canterbury section matching the approved reference direction */
.local-section{
  padding:34px 0 50px !important;
}

.local-modern{
  width:min(1480px,calc(100% - 28px)) !important;
  display:grid !important;
  grid-template-columns:1.12fr .78fr .46fr !important;
  gap:30px !important;
  align-items:center !important;
  padding:20px !important;
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(193,222,247,.9) !important;
  border-radius:24px !important;
  box-shadow:0 16px 38px rgba(17,70,120,.07) !important;
  backdrop-filter:blur(8px) !important;
}

.modern-photo{
  position:relative !important;
}

.modern-photo img{
  width:100% !important;
  height:300px !important;
  object-fit:cover !important;
  border-radius:18px !important;
  display:block !important;
}

.photo-badge{
  position:absolute !important;
  left:16px !important;
  bottom:14px !important;
  background:rgba(4,31,67,.86) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:12px !important;
  padding:9px 12px !important;
  font-size:13px !important;
  font-weight:700 !important;
  backdrop-filter:blur(6px) !important;
}

.modern-local-copy{
  padding:8px 0 !important;
}

.modern-local-copy .kicker{
  color:#087ef0 !important;
  letter-spacing:.13em !important;
}

.modern-local-copy h2{
  color:#0a2150 !important;
  font-size:clamp(30px,3vw,46px) !important;
  line-height:1.02 !important;
  letter-spacing:-.03em !important;
}

.modern-local-copy h2 br + *{
  color:#0a2150 !important;
}

.modern-local-copy p{
  color:#526981 !important;
  font-size:16px !important;
  line-height:1.55 !important;
}

.local-benefits{
  display:flex !important;
  flex-direction:column !important;
  gap:16px !important;
  padding-left:22px !important;
  border-left:1px solid #d8e9f8 !important;
}

.local-benefit{
  display:grid !important;
  grid-template-columns:46px 1fr !important;
  gap:12px !important;
  align-items:start !important;
}

.benefit-icon{
  width:42px !important;
  height:42px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#e6f4ff !important;
  font-size:20px !important;
}

.local-benefit strong{
  display:block !important;
  color:#0a2859 !important;
  font-size:15px !important;
  margin-bottom:3px !important;
}

.local-benefit span{
  display:block !important;
  color:#657a91 !important;
  font-size:12.5px !important;
  line-height:1.35 !important;
}

/* Keep current V26 blue remote band, just refine it slightly */
.remote-band{
  box-shadow:inset 0 1px rgba(255,255,255,.06) !important;
}

@media(max-width:1050px){
  .local-modern{
    grid-template-columns:1fr 1fr !important;
  }
  .local-benefits{
    grid-column:1 / -1 !important;
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    border-left:0 !important;
    border-top:1px solid #d8e9f8 !important;
    padding:20px 0 0 !important;
  }
}

@media(max-width:900px){
  .service-strip .service-grid{
    grid-template-columns:1fr 1fr !important;
  }
  .local-modern{
    grid-template-columns:1fr !important;
  }
  .modern-photo img{
    height:250px !important;
  }
  .local-benefits{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:600px){
  .service-strip{
    padding:14px 0 18px !important;
  }

  .service-strip .service-grid{
    width:calc(100% - 20px) !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .service-item{
    grid-template-columns:54px 1fr !important;
    padding:17px 18px !important;
    border-radius:15px !important;
  }

  .service-icon{
    width:48px !important;
    height:48px !important;
    border-radius:14px !important;
    font-size:23px !important;
  }

  .service-item::after{
    width:30px !important;
    height:30px !important;
    bottom:12px !important;
    right:12px !important;
  }

  .local-section{
    padding:18px 0 30px !important;
  }

  .local-modern{
    width:calc(100% - 20px) !important;
    padding:12px !important;
    gap:20px !important;
    border-radius:18px !important;
  }

  .modern-photo img{
    height:190px !important;
    border-radius:14px !important;
  }

  .photo-badge{
    left:10px !important;
    bottom:9px !important;
    font-size:11px !important;
    padding:7px 9px !important;
  }

  .modern-local-copy h2{
    font-size:32px !important;
  }
}

/* =========================================================
   V33 — ONLY the Canterbury title typography.
   Keep the original wording, its place at the right of
   the photo, and all other V32 sections unchanged.
   ========================================================= */

/* Desktop: make the existing two-line title fit its column. */
.local-section .modern-local-copy h2{
  font-size:clamp(24px, 2.25vw, 33px) !important;
  line-height:1.22 !important;
  letter-spacing:-.015em !important;
  margin-bottom:23px !important;
}

/* On tablet the photo and text each occupy a wider column. */
@media (min-width:901px) and (max-width:1050px){
  .local-section .modern-local-copy h2{
    font-size:clamp(28px, 3vw, 32px) !important;
  }
}

/* Mobile: keep both lines readable without squeezing letters. */
@media (max-width:900px){
  .local-section .modern-local-copy h2{
    font-size:clamp(27px, 3.8vw, 34px) !important;
    line-height:1.2 !important;
  }
}
@media (max-width:600px){
  .local-section .modern-local-copy h2{
    font-size:clamp(22px, 6.4vw, 30px) !important;
    line-height:1.24 !important;
    margin-bottom:19px !important;
  }
}


/* =========================================================
   ConnectFix Ready v34 — links and interactive service details.
   V33 visual layout unchanged until a service is opened.
   ========================================================= */
.service-detail-panel{display:none;scroll-margin-top:100px;margin-top:12px;margin-bottom:24px;padding:28px 32px;
 background:#f8fbff;border:1px solid #bddcf8;border-radius:18px;
 box-shadow:0 14px 34px rgba(10,67,124,.09)}
.service-detail-panel:target{display:block}
.service-detail-panel .detail-kicker{font-size:12px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#087ef0;margin:0 0 8px}
.service-detail-panel h2{font-size:clamp(26px,2.7vw,38px);color:#0a2859;line-height:1.16;margin:0 0 12px}
.service-detail-panel .detail-lead{font-size:16px;color:#4e6380;line-height:1.62;max-width:920px;margin:0 0 18px}
.service-detail-panel .detail-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 26px;margin:0 0 25px;padding:0;list-style:none}
.service-detail-panel .detail-list li{display:flex;align-items:flex-start;gap:10px;color:#193c6a;font-weight:650;line-height:1.48}
.service-detail-panel .detail-list li::before{content:'✓';color:#067ef1;background:#e4f2ff;border-radius:50%;width:23px;height:23px;flex:none;text-align:center;font-weight:900}
.service-detail-panel .detail-buttons{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.service-detail-panel .detail-close{font-weight:800;color:#31577f;padding:12px 6px}
.service-detail-panel .detail-close:hover,.service-detail-panel .detail-close:focus-visible{color:#087ef0;text-decoration:underline}
.service-item a:focus-visible,.service-detail-panel a:focus-visible{outline:3px solid #1798ff;outline-offset:4px}
@media(max-width:700px){
  .service-detail-panel{padding:22px 18px;margin:12px 10px 22px}
  .service-detail-panel .detail-list{grid-template-columns:1fr}
  .service-detail-panel .detail-buttons{flex-direction:column;align-items:stretch}
  .service-detail-panel .detail-buttons .btn,.service-detail-panel .detail-close{width:100%;text-align:center}
}


/* ===========================================================
   V35 — IT SUPPORT EDITABLE SERVICE PAGE ONLY
   Homepage, footer and brand design remain from V34.
   =========================================================== */
.cf-it-page{background:#fff;color:#0b1d3c}
.cf-it-page .cf-it-hero{background:linear-gradient(135deg,#f8fcff,#edf6ff)}
.cf-it-hero-main{width:min(1480px,100%);margin:auto;display:grid;grid-template-columns:52% 48%;align-items:stretch;min-height:440px}
.cf-it-hero-content{padding:49px clamp(24px,4vw,65px) 44px;display:flex;flex-direction:column;justify-content:center}
.cf-it-breadcrumb{display:flex;align-items:center;gap:11px;color:#516580;font-size:13px;font-weight:700;margin:0 0 24px}
.cf-it-breadcrumb a:hover{text-decoration:underline;color:#0d79ed}
.cf-it-hero h1{font-size:clamp(39px,4.1vw,64px);letter-spacing:-.043em;line-height:1.04;margin:0 0 18px;color:#081c3e;max-width:690px}
.cf-it-hero h1 span{color:#0876ed}
.cf-it-lead{font-size:clamp(16px,1.45vw,19px);line-height:1.62;color:#43536d;max-width:610px;margin:0 0 26px}
.cf-it-trust-chips{display:flex;flex-wrap:wrap;gap:11px 18px;font-size:13px;color:#314765;font-weight:750;margin-bottom:27px}
.cf-it-trust-chips span{display:inline-flex;gap:7px;align-items:center}
.cf-it-trust-chips i{display:grid;place-items:center;font-size:12px;font-style:normal;color:#fff;background:#078cff;width:19px;height:19px;border-radius:50%}
.cf-it-hero-buttons,.cf-it-cta-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.cf-it-btn{display:inline-flex;justify-content:center;align-items:center;gap:15px;min-height:49px;padding:12px 22px;border-radius:10px;font-size:14px;font-weight:850;border:1px solid #bdd6f6;transition:transform .2s ease,background .2s ease;white-space:normal}
.cf-it-btn:hover{transform:translateY(-2px)}
.cf-it-btn-primary{background:linear-gradient(100deg,#087fff,#0567e9);color:#fff;border-color:#087fff;box-shadow:0 12px 24px rgba(0,118,235,.13)}
.cf-it-btn-secondary{background:#fff;color:#075fcc}
.cf-it-hero-photo{position:relative;min-height:440px;overflow:hidden;background:#0a2f62}
.cf-it-hero-photo::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(224,241,255,.13),transparent 45%);pointer-events:none}
.cf-it-hero-photo img{height:100%;width:100%;object-fit:cover;object-position:center;display:block}
.cf-it-photo-label{position:absolute;bottom:24px;right:26px;z-index:2;padding:11px 16px;background:rgba(7,31,61,.81);color:#fff;font-weight:760;border:1px solid rgba(255,255,255,.2);border-radius:11px;font-size:13px;backdrop-filter:blur(8px)}
.cf-it-photo-label span{color:#6ed3ff;margin-right:7px}
.cf-it-blocks{width:min(1270px,calc(100% - 42px));margin:auto}
.cf-it-content-section{padding:51px 0 34px}
.cf-it-eyebrow{color:#0678ec !important;font-size:12px !important;letter-spacing:.19em !important;font-weight:900 !important;margin:0 0 8px !important}
.cf-it-content-section h2,.cf-it-trust-section h2{font-size:clamp(27px,2.9vw,37px);line-height:1.16;color:#0a1f44;letter-spacing:-.032em;margin:0 0 9px;font-weight:850}
.cf-it-section-intro{color:#516781;font-size:16px;max-width:680px;line-height:1.55;margin:0 0 25px}
.cf-it-page .cf-it-card-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:0 0 15px}
.cf-it-card-row>.wp-block-column{margin:0 !important;min-width:0}
.cf-it-service-card{display:flex;flex-direction:column;align-items:flex-start;min-height:175px;height:100%;padding:20px 22px;border-radius:17px;background:linear-gradient(142deg,#f8fcff,#f0f7fe);border:1px solid #dfebf8;box-shadow:0 8px 21px rgba(5,55,114,.025)}
.cf-it-service-card .cf-it-card-icon{color:#0783ef;font-size:26px;display:grid;place-items:center;margin:0 0 9px;width:40px;height:40px;background:#e4f2ff;border-radius:12px}
.cf-it-service-card h3{font-size:17px;line-height:1.25;color:#0b2147;margin:0 0 8px;font-weight:800}
.cf-it-service-card p:not(.cf-it-card-icon){font-size:14px;color:#536982;line-height:1.53;margin:0}
.cf-it-trust-section{margin:4px 0 28px;padding:24px !important;background:linear-gradient(120deg,#082c56,#071d3a) !important;border-radius:21px;color:#fff;box-shadow:0 14px 33px rgba(9,39,77,.12);overflow:hidden}
.cf-it-page .cf-it-trust-columns{display:grid;grid-template-columns:1fr .92fr;gap:20px;margin:0;align-items:stretch}
.cf-it-trust-columns>.wp-block-column{margin:0 !important;min-width:0}
.cf-it-trust-copy{padding:24px 14px 20px 18px}
.cf-it-trust-copy h2{color:#fff;margin-bottom:21px}
.cf-it-trust-copy .cf-it-eyebrow{color:#62d6ff !important}
.cf-it-trust-copy .cf-it-trust-item{color:#e6f3ff;font-size:15px;margin:0 0 12px;line-height:1.48}
.cf-it-trust-visual{height:100%;min-height:260px}
.cf-it-trust-photo{margin:0 !important;width:100%;height:100%}
.cf-it-trust-photo img{border-radius:14px;display:block;width:100%;height:100%;min-height:260px;object-fit:cover}
.cf-it-process-section{padding-top:34px;padding-bottom:42px}
.cf-it-page .cf-it-steps-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:19px;margin:22px 0 0}
.cf-it-steps-row>.wp-block-column{margin:0 !important;min-width:0}
.cf-it-step{padding:10px 10px 7px;border-top:1px solid #dbe8f6}
.cf-it-step-number{width:39px;height:39px;border-radius:50%;background:#087ffa;color:white;display:grid;place-items:center;font-size:19px;font-weight:900;margin:0 0 14px}
.cf-it-step h3{font-size:16px;margin:0 0 8px;color:#0d2450}
.cf-it-step p:not(.cf-it-step-number){font-size:14px;line-height:1.5;color:#5a7088;margin:0}
.cf-it-bottom-cta{width:min(1270px,calc(100% - 42px));margin:0 auto 55px;border-radius:18px;background:linear-gradient(110deg,#eaf5ff,#eef7ff);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 34px}
.cf-it-bottom-cta h2{font-size:26px;line-height:1.2;margin:0 0 5px;color:#0a2148}
.cf-it-bottom-cta p{margin:0;color:#4d627e;font-size:15px;max-width:520px}
@media(max-width:1000px){
 .cf-it-hero-main{grid-template-columns:1fr 1fr}
 .cf-it-hero-content{padding:38px 24px}
 .cf-it-hero-photo{min-height:380px}
 .cf-it-hero h1{font-size:clamp(33px,4vw,50px)}
 .cf-it-page .cf-it-card-row{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cf-it-page .cf-it-steps-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
 .cf-it-hero-main{grid-template-columns:1fr}
 .cf-it-hero-content{padding:28px 21px 32px}
 .cf-it-breadcrumb{margin:0 0 18px}
 .cf-it-hero h1{font-size:clamp(35px,9.2vw,47px)}
 .cf-it-lead{font-size:16px}
 .cf-it-hero-photo{min-height:260px;max-height:340px}
 .cf-it-photo-label{bottom:14px;right:14px;font-size:11px}
 .cf-it-hero-buttons .cf-it-btn{width:100%}
 .cf-it-blocks{width:calc(100% - 30px)}
 .cf-it-content-section{padding:31px 0 16px}
 .cf-it-page .cf-it-card-row{grid-template-columns:1fr;gap:12px;margin:0 0 12px}
 .cf-it-service-card{min-height:0;padding:17px 18px}
 .cf-it-trust-section{padding:14px !important}
 .cf-it-page .cf-it-trust-columns{grid-template-columns:1fr;gap:12px}
 .cf-it-trust-copy{padding:17px 12px 6px}
 .cf-it-trust-visual{min-height:190px}
 .cf-it-trust-photo img{min-height:190px}
 .cf-it-page .cf-it-steps-row{grid-template-columns:1fr 1fr;gap:12px}
 .cf-it-step{padding:10px 4px}
 .cf-it-bottom-cta{width:calc(100% - 30px);flex-direction:column;align-items:stretch;margin-bottom:29px;padding:22px}
 .cf-it-bottom-cta .cf-it-btn{width:100%}
}
@media(max-width:370px){.cf-it-page .cf-it-steps-row{grid-template-columns:1fr}}


/* =========================================================
   ConnectFix Ready v36: real Request Support page and form.
   The IT Support design from V35 is intentionally untouched.
   ========================================================= */
.cf-request-page{background:#f0f7ff;min-height:70vh;color:#0a2148}
.cf-request-wrap{width:min(1130px,calc(100% - 36px));margin:auto}
.cf-request-hero{background:linear-gradient(115deg,#f5faff,#e8f4ff);padding:44px 0 32px;border-bottom:1px solid #dbe9f7}
.cf-request-breadcrumb{font-size:13px;font-weight:750;color:#526885;margin-bottom:22px}
.cf-request-breadcrumb a{color:#0a70d9}
.cf-request-breadcrumb span{padding:0 7px}
.cf-request-eyebrow{font-size:12px;letter-spacing:.19em;font-weight:900;color:#006fea;margin:0 0 6px}
.cf-request-hero h1{font-size:clamp(35px,4vw,54px);line-height:1.09;margin:0 0 12px;letter-spacing:-.035em}
.cf-request-intro{max-width:750px;color:#3b5873;font-size:17px;line-height:1.65}
.cf-request-intro p{margin:0}
.cf-request-helper{font-size:13px;color:#4e6886;margin:14px 0 0}
.cf-request-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(250px,.85fr);gap:27px;align-items:start;padding-top:33px;padding-bottom:55px}
.cf-request-form-card,.cf-request-side{background:#fff;border:1px solid #d4e5f7;border-radius:20px;box-shadow:0 14px 35px rgba(10,49,105,.07)}
.cf-request-form-card{padding:31px}
.cf-request-form-card h2,.cf-request-side h2{font-size:25px;letter-spacing:-.02em;margin:0 0 8px}
.cf-request-form-card>p{color:#59718c;margin:0 0 25px}
.cf-request-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.cf-request-form label{display:flex;flex-direction:column;gap:7px;font-weight:750;font-size:14px;color:#19345b}
.cf-request-form input:not([type=checkbox]),.cf-request-form select,.cf-request-form textarea{width:100%;padding:12px 13px;border:1px solid #bdcfe0;border-radius:9px;font:inherit;color:#0a2148;background:#fff;min-width:0}
.cf-request-form input:focus,.cf-request-form select:focus,.cf-request-form textarea:focus{outline:2px solid #0e84f2;outline-offset:1px}
.cf-request-form textarea{resize:vertical;min-height:140px}
.cf-request-span{grid-column:1/-1}
.cf-request-form .cf-request-consent{flex-direction:row;align-items:flex-start;gap:10px;font-weight:500;line-height:1.5}
.cf-request-consent input{margin-top:5px;accent-color:#087fff}
.cf-request-submit{padding:14px 22px;background:linear-gradient(100deg,#079bff,#0067e8);color:white;font-weight:850;border:0;border-radius:10px;cursor:pointer;min-height:51px;font-size:15px}
.cf-request-submit:hover{filter:brightness(.96)}
.cf-request-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.cf-request-notice{padding:14px;border-radius:9px;margin:0 0 20px;font-weight:700}
.cf-request-notice.success{background:#e5f9ed;color:#185c31}
.cf-request-notice.error{background:#fff0f0;color:#962b2b}
.cf-request-side{padding:30px}
.cf-request-side h2{margin-bottom:23px}
.cf-request-next{display:flex;gap:13px;margin:0 0 22px}
.cf-request-next>span{display:grid;place-items:center;background:#0b81f5;color:#fff;font-weight:900;width:35px;height:35px;border-radius:50%;flex:0 0 35px}
.cf-request-next strong{font-size:15px}
.cf-request-next p{font-size:13px;color:#56708a;line-height:1.5;margin:5px 0 0}
.cf-request-contact{padding-top:22px;border-top:1px solid #deebf7;font-size:14px}
.cf-request-contact p{line-height:1.6;color:#56708a}
.cf-request-contact a{color:#087be7;overflow-wrap:anywhere;font-weight:750}
@media(max-width:800px){.cf-request-layout{grid-template-columns:1fr}.cf-request-side{padding:24px}}
@media(max-width:560px){.cf-request-hero{padding:28px 0 24px}.cf-request-layout{padding-top:18px;padding-bottom:26px}.cf-request-form-card{padding:20px}.cf-request-form{grid-template-columns:1fr;gap:15px}.cf-request-span{grid-column:auto}.cf-request-submit{width:100%}.cf-request-side{padding:20px}}


/* ConnectFix v37: Direct WhatsApp channel. Other V36 layout remains unchanged. */
.cf-it-btn-whatsapp, .cf-whatsapp-btn{
  display:inline-flex;align-items:center;justify-content:center;
  gap:8px;min-height:49px;padding:12px 22px;border-radius:10px;
  background:#137b47 !important;color:#fff !important;
  border:1px solid #137b47 !important;font-weight:800 !important;
  box-shadow:0 10px 22px rgba(15,101,55,.13);text-decoration:none !important;
  transition:background .2s ease,transform .2s ease;
}
.cf-it-btn-whatsapp:hover,.cf-whatsapp-btn:hover{
  background:#0c6739 !important;color:#fff !important;transform:translateY(-1px);
}
.cf-request-whatsapp{
  padding:19px 18px;border-radius:14px;background:#eaf9f0;
  border:1px solid #b9e5c7;margin:22px 0 19px;
}
.cf-request-whatsapp strong{display:block;margin:0 0 4px;color:#14542e;}
.cf-request-whatsapp p{font-size:14px;line-height:1.5;margin:5px 0 12px;color:#416752;}
.cf-request-whatsapp .cf-whatsapp-btn{width:100%;text-align:center;}
.cf-request-whatsapp small{display:block;margin-top:10px;line-height:1.4;color:#436650;}
@media(max-width:560px){.cf-it-hero-buttons .cf-it-btn-whatsapp,.cf-it-bottom-cta .cf-it-btn-whatsapp{width:100%;}}

/* ============================================================
   V38: IT Support page only — expanded desktop width.
   Keep the same images, copy, buttons, footer and homepage.
   ============================================================ */

/* Bring the page much closer to the left/right screen edges. */
@media (min-width: 1101px) {
  .cf-it-page .cf-it-hero-main {
    width: min(1760px, calc(100% - 64px)) !important;
    max-width: none !important;
    grid-template-columns: 51% 49% !important;
    min-height: 425px !important;
  }
  .cf-it-page .cf-it-hero-content {
    padding: 36px clamp(26px, 3.1vw, 60px) !important;
  }
  .cf-it-page .cf-it-blocks,
  .cf-it-page .cf-it-bottom-cta {
    width: min(1760px, calc(100% - 64px)) !important;
    max-width: none !important;
  }
  .cf-it-page .cf-it-hero-photo {
    min-height: 425px !important;
  }
}

/* On standard-sized desktop/laptop screens still use the space. */
@media (min-width: 701px) and (max-width: 1100px) {
  .cf-it-page .cf-it-hero-main {
    width: calc(100% - 36px) !important;
    max-width: none !important;
    grid-template-columns: 51% 49% !important;
  }
  .cf-it-page .cf-it-blocks,
  .cf-it-page .cf-it-bottom-cta {
    width: calc(100% - 36px) !important;
    max-width: none !important;
  }
}

/* Don't cut off the ConnectFix wordmark printed on the shirt. */
.cf-it-page .cf-it-hero-photo img {
  object-fit: cover !important;
  object-position: right center !important;
}

/* Preserve the existing stacked mobile layout and comfortable gutters. */
@media (max-width: 700px) {
  .cf-it-page .cf-it-hero-main {
    width: 100% !important;
    grid-template-columns: 1fr !important;
  }
  .cf-it-page .cf-it-blocks,
  .cf-it-page .cf-it-bottom-cta {
    width: calc(100% - 30px) !important;
  }
}


/* ============================================================
   V39 — IT SUPPORT finishing details (from V38)
   Scoped to .cf-it-page so homepage and other pages stay intact.
   No content, photos or links are changed.
   ============================================================ */
.cf-it-page {
  --cf-it-soft:#f4f9ff;
  --cf-it-line:#dceaf9;
  --cf-it-ink:#0a234b;
  --cf-it-muted:#516a87;
}
.cf-it-page .cf-it-hero {
  background:linear-gradient(115deg,#fafcff 0%,#f0f7ff 100%);
  border-bottom:1px solid #e0ebf7;
}
.cf-it-page .cf-it-hero-main {
  box-sizing:border-box;
  align-items:stretch;
}
.cf-it-page .cf-it-hero h1 {
  font-size:clamp(35px,3.65vw,58px);
  line-height:1.105;
  letter-spacing:-.026em;
  text-wrap:balance;
  margin-bottom:18px;
}
.cf-it-page .cf-it-lead {
  font-size:clamp(16px,1.16vw,18px);
  line-height:1.65;
  letter-spacing:0;
  max-width:670px;
  margin-bottom:22px;
}
.cf-it-page .cf-it-breadcrumb {margin-bottom:20px}
.cf-it-page .cf-it-trust-chips {gap:10px 18px;margin-bottom:23px}
.cf-it-page .cf-it-trust-chips span {line-height:1.4}
.cf-it-page .cf-it-hero-photo {background:#143e69}
.cf-it-page .cf-it-hero-photo img {
  height:100%;width:100%;
  object-fit:cover;
  object-position:right 42% !important;
}
.cf-it-page .cf-it-photo-label {
  bottom:18px;left:20px;right:auto;
  padding:9px 13px;font-size:12px;
  background:rgba(8,36,73,.82);
}
.cf-it-page .cf-it-btn {
  min-height:50px;
  border-radius:11px;
  padding:12px 20px;
  line-height:1.35;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.cf-it-page .cf-it-btn-primary:hover {
  color:white;
  box-shadow:0 14px 30px rgba(6,101,227,.22);
}
.cf-it-page a:focus-visible {
  outline:3px solid #24a9ff;
  outline-offset:4px;
}
.cf-it-page .cf-it-services-section {padding-top:51px;padding-bottom:40px}
.cf-it-page .cf-it-content-section h2,
.cf-it-page .cf-it-trust-section h2 {
  line-height:1.19;
  letter-spacing:-.02em;
  text-wrap:balance;
}
.cf-it-page .cf-it-section-intro {
  line-height:1.65;
  margin-bottom:28px;
}
.cf-it-page .cf-it-card-row {
  column-gap:18px;
  row-gap:18px;
  margin-bottom:18px;
}
.cf-it-page .cf-it-service-card {
  padding:24px 23px;
  min-height:187px;
  border-radius:17px;
  border:1px solid #d7e7f8;
  background:linear-gradient(148deg,#fff 0%,#f1f8ff 100%);
  box-shadow:0 9px 25px rgba(15,72,132,.055);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.cf-it-page .cf-it-service-card .cf-it-card-icon {
  display:grid;
  place-items:center;
  width:48px;height:48px;
  font-size:26px;
  border-radius:13px;
  background:linear-gradient(135deg,#e4f3ff,#d3eaff);
  margin:0 0 13px;
  line-height:1;
}
.cf-it-page .cf-it-service-card h3 {
  font-size:18px;
  line-height:1.32;
  margin-bottom:8px;
}
.cf-it-page .cf-it-service-card p:not(.cf-it-card-icon) {
  font-size:15px;
  line-height:1.58;
  color:#4b647f;
  max-width:62ch;
}
@media (hover:hover) and (pointer:fine) {
  .cf-it-page .cf-it-service-card:hover {
    transform:translateY(-3px);
    border-color:#a9d2f8;
    box-shadow:0 15px 30px rgba(15,72,132,.11);
  }
}
.cf-it-page .cf-it-trust-section {
  margin:14px 0 27px;
  padding:28px !important;
  border-radius:22px;
  background:linear-gradient(115deg,#092e59,#071f40) !important;
  box-shadow:0 16px 35px rgba(7,34,72,.13);
}
.cf-it-page .cf-it-trust-columns {grid-template-columns:1.04fr .96fr;gap:27px}
.cf-it-page .cf-it-trust-copy {padding:20px 18px}
.cf-it-page .cf-it-trust-copy .cf-it-trust-item {font-size:15px;line-height:1.58;margin-bottom:11px}
.cf-it-page .cf-it-trust-photo img {border-radius:15px;object-fit:cover;min-height:280px}
.cf-it-page .cf-it-process-section {padding:40px 0 44px}
.cf-it-page .cf-it-steps-row {gap:17px;margin-top:26px}
.cf-it-page .cf-it-step {
  height:100%;padding:21px 20px 19px;
  border:1px solid var(--cf-it-line);
  border-radius:16px;
  background:linear-gradient(160deg,#fff 0%,#f6faff 100%);
  box-shadow:0 5px 18px rgba(10,56,112,.035);
}
.cf-it-page .cf-it-step-number {margin-bottom:15px}
.cf-it-page .cf-it-step h3 {font-size:17px;line-height:1.35;margin-bottom:8px}
.cf-it-page .cf-it-step p:not(.cf-it-step-number) {font-size:14px;line-height:1.62}
.cf-it-page .cf-it-bottom-cta {
  margin-bottom:52px;
  padding:30px 34px;
  border:1px solid #d8e9f9;
  border-radius:19px;
  box-shadow:0 9px 30px rgba(13,70,126,.045);
}
.cf-it-page .cf-it-bottom-cta h2 {line-height:1.27}
.cf-it-page .cf-it-bottom-cta p {line-height:1.6}
.cf-it-page .cf-it-cta-actions {gap:12px}

/* Tablet: keep text legible and buttons accessible without squashing. */
@media (min-width:701px) and (max-width:1100px) {
  .cf-it-page .cf-it-hero h1 {font-size:clamp(32px,3.7vw,44px)}
  .cf-it-page .cf-it-hero-content {padding:34px 26px}
  .cf-it-page .cf-it-service-card {padding:20px;min-height:170px}
  .cf-it-page .cf-it-trust-columns {grid-template-columns:1fr 1fr;gap:17px}
  .cf-it-page .cf-it-trust-section {padding:19px !important}
  .cf-it-page .cf-it-trust-copy {padding:15px 8px}
  .cf-it-page .cf-it-steps-row {grid-template-columns:repeat(2,minmax(0,1fr))}
  .cf-it-page .cf-it-bottom-cta {gap:15px;padding:24px}
}
/* Phones: no squeezed cards, title or hard-to-tap buttons. */
@media (max-width:700px) {
  .cf-it-page .cf-it-hero-main {width:100% !important;grid-template-columns:1fr !important}
  .cf-it-page .cf-it-hero-content {padding:29px 20px 30px}
  .cf-it-page .cf-it-hero h1 {font-size:clamp(32px,8.4vw,44px);line-height:1.15;letter-spacing:-.025em}
  .cf-it-page .cf-it-breadcrumb {font-size:12px;margin-bottom:16px}
  .cf-it-page .cf-it-lead {font-size:16px;line-height:1.6;margin-bottom:20px}
  .cf-it-page .cf-it-trust-chips {gap:9px 13px;font-size:12px;margin-bottom:23px}
  .cf-it-page .cf-it-hero-photo {height:clamp(235px,57vw,315px);min-height:0;max-height:none}
  .cf-it-page .cf-it-hero-photo img {width:100%;height:100%;object-position:right 40% !important}
  .cf-it-page .cf-it-photo-label {left:12px;bottom:12px;right:auto;font-size:11px;padding:7px 10px}
  .cf-it-page .cf-it-hero-buttons {gap:10px}
  .cf-it-page .cf-it-hero-buttons .cf-it-btn {width:100%;min-height:52px;padding:13px 15px;font-size:14px}
  .cf-it-page .cf-it-blocks {width:calc(100% - 28px) !important}
  .cf-it-page .cf-it-services-section {padding:34px 0 23px}
  .cf-it-page .cf-it-content-section h2,.cf-it-page .cf-it-trust-section h2 {font-size:clamp(27px,7.4vw,34px);line-height:1.22}
  .cf-it-page .cf-it-section-intro {font-size:15px;line-height:1.6;margin-bottom:20px}
  .cf-it-page .cf-it-card-row {grid-template-columns:1fr;gap:12px;margin-bottom:12px}
  .cf-it-page .cf-it-service-card {min-height:0;padding:20px 19px;border-radius:15px}
  .cf-it-page .cf-it-service-card h3 {font-size:17px}
  .cf-it-page .cf-it-service-card p:not(.cf-it-card-icon) {font-size:14px;line-height:1.57}
  .cf-it-page .cf-it-trust-section {margin:25px 0 20px;padding:13px !important;border-radius:18px}
  .cf-it-page .cf-it-trust-columns {grid-template-columns:1fr;gap:12px}
  .cf-it-page .cf-it-trust-copy {padding:18px 13px 10px}
  .cf-it-page .cf-it-trust-copy .cf-it-trust-item {font-size:14px}
  .cf-it-page .cf-it-trust-visual,.cf-it-page .cf-it-trust-photo img {min-height:190px}
  .cf-it-page .cf-it-trust-photo img {max-height:240px}
  .cf-it-page .cf-it-process-section {padding:22px 0 28px}
  .cf-it-page .cf-it-steps-row {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:19px}
  .cf-it-page .cf-it-step {min-height:170px;padding:16px 14px}
  .cf-it-page .cf-it-step h3 {font-size:15px}
  .cf-it-page .cf-it-bottom-cta {width:calc(100% - 28px) !important;margin-bottom:30px;padding:23px 19px;gap:19px}
  .cf-it-page .cf-it-bottom-cta h2 {font-size:24px}
  .cf-it-page .cf-it-cta-actions {width:100%;gap:10px;flex-direction:column}
  .cf-it-page .cf-it-cta-actions .cf-it-btn {width:100%;min-height:52px}
}
@media (max-width:520px) {
  .cf-it-page .cf-it-steps-row {grid-template-columns:1fr}
  .cf-it-page .cf-it-step {min-height:auto}
}
@media (prefers-reduced-motion:reduce) {
  .cf-it-page .cf-it-btn,.cf-it-page .cf-it-service-card {transition:none !important;transform:none !important}
}


/* =============================================================
   CONNECTFIX V40 — FINISHING TOUCHES TO IT SUPPORT PAGE ONLY
   Based on V39; all content, photos, forms, buttons and links
   are preserved. The homepage and other pages are unchanged.
   ============================================================= */

/* A tighter, more balanced services section. */
.cf-it-page .cf-it-services-section {
  padding-top:39px;
  padding-bottom:24px;
}
.cf-it-page .cf-it-services-section .cf-it-section-intro {
  margin-bottom:20px;
}
.cf-it-page .cf-it-card-row {
  column-gap:12px;
  row-gap:12px;
  margin-bottom:12px;
}

/* Grid card: icon on left, title/description at right. */
.cf-it-page .cf-it-service-card {
  box-sizing:border-box;
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  grid-template-rows:auto 1fr;
  column-gap:14px;
  row-gap:5px;
  align-content:center;
  align-items:start;
  min-height:154px;
  height:100%;
  padding:18px 19px;
  border-radius:15px;
  border-color:#d7e7f8;
}
.cf-it-page .cf-it-service-card .cf-it-card-icon {
  grid-column:1;
  grid-row:1 / span 2;
  margin:0;
  width:46px;
  height:46px;
  font-size:25px;
  line-height:1;
  align-self:start;
}
.cf-it-page .cf-it-service-card h3 {
  grid-column:2;
  grid-row:1;
  font-size:18px;
  line-height:1.34;
  color:#08234a;
  margin:0;
  overflow-wrap:break-word;
}
.cf-it-page .cf-it-service-card p:not(.cf-it-card-icon) {
  grid-column:2;
  grid-row:2;
  font-size:15px;
  line-height:1.48;
  color:#405a77;
  margin:0;
  max-width:none;
  overflow-wrap:break-word;
}

/* Compact gaps between major sections without changing the
   existing dark trust-section composition or photos. */
.cf-it-page .cf-it-trust-section {
  margin-top:8px;
  margin-bottom:20px;
}
.cf-it-page .cf-it-process-section {
  padding-top:29px;
  padding-bottom:31px;
}
.cf-it-page .cf-it-process-section .cf-it-section-intro {
  margin-bottom:13px;
}
.cf-it-page .cf-it-steps-row {
  gap:13px;
  margin-top:18px;
}
.cf-it-page .cf-it-step {
  min-height:0;
  padding:17px 17px 15px;
  border-radius:15px;
}
.cf-it-page .cf-it-step-number {
  width:37px;
  height:37px;
  font-size:18px;
  margin-bottom:10px;
}
.cf-it-page .cf-it-step h3 {
  font-size:17px;
  line-height:1.38;
  margin-bottom:6px;
  color:#0a2854;
}
.cf-it-page .cf-it-step p:not(.cf-it-step-number) {
  font-size:15px;
  line-height:1.53;
  color:#45617e;
}
.cf-it-page .cf-it-bottom-cta {
  padding:24px 29px;
  margin-bottom:42px;
  gap:20px;
}

/* Tablet: 2 columns, cards may grow naturally for descriptions. */
@media (min-width:701px) and (max-width:1100px) {
  .cf-it-page .cf-it-card-row {
    gap:12px;
    margin-bottom:12px;
  }
  .cf-it-page .cf-it-service-card {
    min-height:153px;
    padding:17px;
    column-gap:12px;
  }
  .cf-it-page .cf-it-service-card h3 {font-size:17px;}
  .cf-it-page .cf-it-service-card p:not(.cf-it-card-icon) {font-size:14.5px;}
  .cf-it-page .cf-it-process-section {padding-top:27px;padding-bottom:29px;}
  .cf-it-page .cf-it-bottom-cta {padding:22px 24px;}
}

/* Mobile: stacked cards with icon LEFT of copy,  readable text,
   touch-friendly buttons and no horizontal overflow. */
@media (max-width:700px) {
  .cf-it-page .cf-it-services-section {padding:29px 0 20px;}
  .cf-it-page .cf-it-services-section .cf-it-section-intro {margin-bottom:17px;}
  .cf-it-page .cf-it-card-row {gap:10px;margin-bottom:10px;}
  .cf-it-page .cf-it-service-card {
    grid-template-columns:42px minmax(0,1fr);
    column-gap:13px;
    row-gap:4px;
    min-height:0;
    padding:16px;
    border-radius:14px;
  }
  .cf-it-page .cf-it-service-card .cf-it-card-icon {
    width:42px;
    height:42px;
    font-size:23px;
  }
  .cf-it-page .cf-it-service-card h3 {font-size:17px;line-height:1.34;}
  .cf-it-page .cf-it-service-card p:not(.cf-it-card-icon) {
    font-size:14.5px;
    line-height:1.47;
  }
  .cf-it-page .cf-it-trust-section {margin-top:16px;margin-bottom:16px;}
  .cf-it-page .cf-it-process-section {padding-top:21px;padding-bottom:23px;}
  .cf-it-page .cf-it-steps-row {gap:10px;margin-top:15px;}
  .cf-it-page .cf-it-step {padding:16px 15px;min-height:0;}
  .cf-it-page .cf-it-step h3 {font-size:16px;}
  .cf-it-page .cf-it-step p:not(.cf-it-step-number) {font-size:14.5px;line-height:1.5;}
  .cf-it-page .cf-it-bottom-cta {padding:22px 19px;margin-bottom:28px;gap:17px;}
}


/* ============================================================
   CONNECTFIX V41 - critical fix: V40 squeezed card text.
   Apply ONLY inside the IT Support services cards. The grid
   used for card interiors in V40 is intentionally overridden.
   Keep the six cards compact while preventing letter-by-letter
   wrapping on desktop, tablet and phone.
   ============================================================ */

.cf-it-page .cf-it-card-row {
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
  align-items:stretch !important;
  margin-bottom:12px !important;
}
.cf-it-page .cf-it-card-row > .wp-block-column {
  min-width:0 !important;
  width:100% !important;
  margin:0 !important;
}
.cf-it-page .cf-it-card-row .cf-it-service-card {
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:0 !important;
  grid-template-columns:none !important;
  grid-template-rows:none !important;
  min-width:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  padding:15px 18px 16px !important;
  box-sizing:border-box !important;
  border-radius:14px !important;
}
.cf-it-page .cf-it-card-row .cf-it-service-card .cf-it-card-icon {
  display:flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  justify-content:center !important;
  grid-column:auto !important;
  grid-row:auto !important;
  width:36px !important;
  height:36px !important;
  margin:0 0 8px 0 !important;
  font-size:21px !important;
  line-height:1 !important;
}
.cf-it-page .cf-it-card-row .cf-it-service-card h3,
.cf-it-page .cf-it-card-row .cf-it-service-card p:not(.cf-it-card-icon) {
  display:block !important;
  flex:0 0 auto !important;
  grid-column:auto !important;
  grid-row:auto !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  padding:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
  text-align:left !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  hyphens:none !important;
}
.cf-it-page .cf-it-card-row .cf-it-service-card h3 {
  margin-top:0 !important;
  margin-bottom:6px !important;
  color:#102c54 !important;
  font-size:16px !important;
  font-weight:750 !important;
  line-height:1.3 !important;
}
.cf-it-page .cf-it-card-row .cf-it-service-card p:not(.cf-it-card-icon) {
  margin-top:0 !important;
  margin-bottom:0 !important;
  color:#425d77 !important;
  font-size:14px !important;
  line-height:1.45 !important;
}
@media (min-width:701px) and (max-width:1100px) {
  .cf-it-page .cf-it-card-row {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:700px) {
  .cf-it-page .cf-it-card-row {
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
    margin-bottom:10px !important;
  }
  .cf-it-page .cf-it-card-row .cf-it-service-card {
    padding:16px 17px !important;
  }
  .cf-it-page .cf-it-card-row .cf-it-service-card h3 {
    font-size:16px !important;
  }
  .cf-it-page .cf-it-card-row .cf-it-service-card p:not(.cf-it-card-icon) {
    font-size:14px !important;
  }
}


/* ============================================================
   ConnectFix V43 — uniform colours ONLY for the six
   "How we can help" cards on the IT Support page.
   Compact sizing, grid, typography and every other section
   remain as in V42.
   ============================================================ */

/* The two rows and all six cards use the exact same colours. */
.cf-it-page .cf-it-services-section .cf-it-card-row .cf-it-service-card,
.cf-it-page .cf-it-services-section .cf-it-card-row .cf-it-service-card:hover,
.cf-it-page .cf-it-services-section .cf-it-card-row .cf-it-service-card:focus-within {
  background: #f3f7fc !important;
  background-image: none !important;
  background-color: #f3f7fc !important;
  border: 1px solid #cfdeee !important;
  box-shadow: 0 5px 14px rgba(18,63,112,.055) !important;
}

/* Consistent blue icons and legible typography. */
.cf-it-page .cf-it-services-section .cf-it-card-row .cf-it-service-card .cf-it-card-icon {
  color: #1175d5 !important;
  background: #e3f0fc !important;
  background-image: none !important;
  border: 1px solid #d1e5f7 !important;
}
.cf-it-page .cf-it-services-section .cf-it-card-row .cf-it-service-card h3 {
  color: #123253 !important;
}
.cf-it-page .cf-it-services-section .cf-it-card-row .cf-it-service-card p:not(.cf-it-card-icon) {
  color: #405b75 !important;
}


/* ============================================================
   V44 | Unified IT Support design below the six service cards.
   Six approved V43 cards and all other site content stay intact.
   ============================================================ */

/* Make "Our simple process" match the pale-blue compact service cards. */
.cf-it-page .cf-it-process-section {
  padding-top: 23px !important;
  padding-bottom: 21px !important;
}
.cf-it-page .cf-it-process-section > h2 {
  color: #123253 !important;
  font-weight: 750 !important;
}
.cf-it-page .cf-it-process-section .cf-it-section-intro {
  color: #405b75 !important;
}
.cf-it-page .cf-it-process-section .cf-it-steps-row {
  display: grid !important;
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  gap: 12px !important;
  margin-top: 17px !important;
  margin-bottom: 0 !important;
  align-items: stretch !important;
}
.cf-it-page .cf-it-process-section .cf-it-steps-row > .wp-block-column {
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
}
.cf-it-page .cf-it-process-section .cf-it-step {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 16px 18px !important;
  background: #f3f7fc !important;
  background-image: none !important;
  border: 1px solid #cfdeee !important;
  border-radius: 14px !important;
  box-shadow: 0 5px 14px rgba(18,63,112,.055) !important;
}
.cf-it-page .cf-it-process-section .cf-it-step .cf-it-step-number {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  width: 34px !important;
  height: 34px !important;
  margin: 0 0 10px !important;
  font-size: 16px !important;
  line-height: 1 !important;
  background: #1175d5 !important;
  color: #fff !important;
  border-radius: 50% !important;
}
.cf-it-page .cf-it-process-section .cf-it-step h3 {
  width: 100% !important;
  margin: 0 0 7px !important;
  color: #123253 !important;
  font-size: 16px !important;
  line-height: 1.3 !important;
  font-weight: 750 !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}
.cf-it-page .cf-it-process-section .cf-it-step p:not(.cf-it-step-number) {
  width: 100% !important;
  margin: 0 !important;
  color: #405b75 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

/* Match the final "Need IT Support?" strip to that same palette. */
.cf-it-page .cf-it-bottom-cta {
  box-sizing: border-box !important;
  background: #eaf4ff !important;
  background-image: none !important;
  border: 1px solid #cfdeee !important;
  border-radius: 16px !important;
  box-shadow: 0 5px 14px rgba(18,63,112,.045) !important;
  padding: 20px 26px !important;
  margin-top: 4px !important;
  margin-bottom: 32px !important;
  gap: 20px !important;
}
.cf-it-page .cf-it-bottom-cta h2 {
  color: #123253 !important;
  font-size: clamp(21px,2vw,25px) !important;
  line-height: 1.2 !important;
  margin-bottom: 6px !important;
}
.cf-it-page .cf-it-bottom-cta p {
  color: #405b75 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}
.cf-it-page .cf-it-bottom-cta .cf-it-cta-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
}
/* Tablet and mobile: avoid thin squeezed columns. */
@media (min-width:701px) and (max-width:1000px) {
  .cf-it-page .cf-it-process-section .cf-it-steps-row {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:700px) {
  .cf-it-page .cf-it-process-section .cf-it-steps-row {
    grid-template-columns: minmax(0,1fr) !important;
    gap: 10px !important;
  }
  .cf-it-page .cf-it-process-section .cf-it-step {
    padding: 15px 17px !important;
  }
  .cf-it-page .cf-it-bottom-cta {
    padding: 19px 17px !important;
    margin-bottom: 26px !important;
  }
  .cf-it-page .cf-it-bottom-cta .cf-it-cta-actions {
    justify-content: flex-start !important;
    width: 100% !important;
  }
}

/* V45 Networking & Wi-Fi: use identical V44 service layout; no IT Support restyling. */
.cf-network-page .cf-it-hero-photo img{object-position: 57% center !important;}
@media (max-width:700px){.cf-network-page .cf-it-hero-photo img{object-position:60% center !important;}}


/* =============================================================
   ConnectFix V46 — Networking & Wi-Fi page only.
   Shorter top photo and much shorter second blue/photo section.
   All original V45 card colours, typography, contact functions,
   IT Support, homepage and footer are preserved.
   ============================================================= */

/* Make the top image follow the natural content height instead of
   forcing the tall V38 shared-page minimum. */
@media (min-width:1101px) {
  .cf-network-page .cf-it-hero-main {
    min-height:365px !important;
    height:auto !important;
  }
  .cf-network-page .cf-it-hero-content {
    padding:25px clamp(23px,2.9vw,46px) !important;
  }
  .cf-network-page .cf-it-hero h1 {
    font-size:clamp(34px,3vw,43px) !important;
    line-height:1.13 !important;
    margin-bottom:12px !important;
  }
  .cf-network-page .cf-it-breadcrumb {margin-bottom:12px !important;}
  .cf-network-page .cf-it-lead {
    font-size:16px !important;
    line-height:1.5 !important;
    margin-bottom:14px !important;
  }
  .cf-network-page .cf-it-trust-chips {margin-bottom:16px !important;}
  .cf-network-page .cf-it-hero-photo {
    min-height:365px !important;
  }
}
@media (min-width:701px) and (max-width:1100px) {
  .cf-network-page .cf-it-hero-main {min-height:350px !important;}
  .cf-network-page .cf-it-hero-photo {min-height:350px !important;}
  .cf-network-page .cf-it-hero-content {padding:25px 24px !important;}
  .cf-network-page .cf-it-hero h1 {font-size:clamp(30px,3.8vw,39px) !important;}
  .cf-network-page .cf-it-breadcrumb {margin-bottom:12px !important;}
  .cf-network-page .cf-it-lead {font-size:15px !important;line-height:1.5 !important;margin-bottom:14px !important;}
  .cf-network-page .cf-it-trust-chips {margin-bottom:14px !important;}
}
/* Use a clean, deliberate crop rather than stretching the photo. */
@media (min-width:701px) {
  .cf-network-page .cf-it-hero-photo {position:relative;overflow:hidden;}
  .cf-network-page .cf-it-hero-photo img {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:52% 49% !important;
  }
}

/* This original portrait image otherwise makes the entire blue
   "Networking support you can trust" section excessively tall. */
@media (min-width:701px) {
  .cf-network-page .cf-it-trust-section {
    padding:20px !important;
    margin-top:9px !important;
    margin-bottom:22px !important;
  }
  .cf-network-page .cf-it-trust-columns {
    align-items:center !important;
    height:auto !important;
  }
  .cf-network-page .cf-it-trust-copy {
    padding:12px 16px !important;
  }
  .cf-network-page .cf-it-trust-copy h2 {
    font-size:clamp(26px,2.6vw,36px) !important;
    line-height:1.2 !important;
    margin-bottom:14px !important;
  }
  .cf-network-page .cf-it-trust-copy .cf-it-trust-item {
    font-size:14px !important;
    line-height:1.45 !important;
    margin-bottom:8px !important;
  }
  .cf-network-page .cf-it-trust-visual,
  .cf-network-page .cf-it-trust-photo {
    height:290px !important;
    min-height:0 !important;
    max-height:290px !important;
    margin:0 !important;
    overflow:hidden !important;
  }
  .cf-network-page .cf-it-trust-photo img {
    display:block !important;
    width:100% !important;
    height:290px !important;
    min-height:0 !important;
    max-height:290px !important;
    object-fit:cover !important;
    object-position:center 53% !important;
    border-radius:14px !important;
  }
}
@media (max-width:700px) {
  /* On phones let the full hero text breathe and avoid cropping
     the image too aggressively. Only the picture height changes. */
  .cf-network-page .cf-it-hero-photo {
    height:220px !important;
    min-height:0 !important;
    max-height:220px !important;
  }
  .cf-network-page .cf-it-hero-photo img {
    object-fit:cover !important;
    object-position:52% center !important;
  }
  .cf-network-page .cf-it-trust-visual,
  .cf-network-page .cf-it-trust-photo,
  .cf-network-page .cf-it-trust-photo img {
    height:205px !important;
    min-height:0 !important;
    max-height:205px !important;
  }
  .cf-network-page .cf-it-trust-photo img {
    object-fit:cover !important;
    object-position:center center !important;
  }
}


/* ============================================================
   ConnectFix V47: Networking & Wi-Fi photo framing refinements
   Only this service page is affected. Preserve V46 compact photo
   heights and all other layout, cards, buttons, footer and content.
   ============================================================ */

/* Main photo: favour the laptop + visible wireless router, with
   a less abrupt crop at the top of the image. */
@media (min-width: 701px) {
  .cf-network-page .cf-it-hero-photo img {
    object-fit: cover !important;
    object-position: 62% 44% !important;
  }

  /* Blue Why Choose band: enlarge the router so it's the focus,
     while reducing the distracting mug and notebook at the edges.
     Scale doesn't alter the band's compact 290px height. */
  .cf-network-page .cf-it-trust-photo {
    overflow: hidden !important;
    border-radius: 14px !important;
  }
  .cf-network-page .cf-it-trust-photo img {
    width: 100% !important;
    height: 290px !important;
    object-fit: cover !important;
    object-position: 48% 43% !important;
    transform: scale(1.14) !important;
    transform-origin: 44% 45% !important;
  }
}

/* Phones: display router and laptop in the shorter 220px/205px
   photo frames while preserving all mobile text and CTA styles. */
@media (max-width: 700px) {
  .cf-network-page .cf-it-hero-photo img {
    object-fit: cover !important;
    object-position: 64% 44% !important;
  }
  .cf-network-page .cf-it-trust-photo {
    overflow: hidden !important;
    border-radius: 14px !important;
  }
  .cf-network-page .cf-it-trust-photo img {
    width: 100% !important;
    height: 205px !important;
    object-fit: cover !important;
    object-position: 49% 43% !important;
    transform: scale(1.07) !important;
    transform-origin: 44% 45% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cf-network-page .cf-it-trust-photo img { transition: none !important; }
}


/* ============================================================
   ConnectFix V49: Networking photo framing final adjustment
   Goal: avoid the "photo eaten" effect while preserving the
   compact V47 layout. Only the Networking page is affected.
   ============================================================ */
@media (min-width: 701px) {
  /* Top hero photo: show more complete laptop/router/mug scene */
  .cf-network-page .cf-it-hero-photo img {
    object-fit: cover !important;
    object-position: 58% 46% !important;
    transform: none !important;
  }

  /* Blue trust band photo: much softer crop, no aggressive zoom */
  .cf-network-page .cf-it-trust-photo {
    overflow: hidden !important;
    border-radius: 14px !important;
  }
  .cf-network-page .cf-it-trust-photo img {
    width: 100% !important;
    height: 290px !important;
    object-fit: cover !important;
    object-position: 57% 46% !important;
    transform: scale(1.02) !important;
    transform-origin: center center !important;
  }
}

@media (max-width: 700px) {
  .cf-network-page .cf-it-hero-photo img {
    object-fit: cover !important;
    object-position: 60% 46% !important;
    transform: none !important;
  }
  .cf-network-page .cf-it-trust-photo {
    overflow: hidden !important;
    border-radius: 14px !important;
  }
  .cf-network-page .cf-it-trust-photo img {
    width: 100% !important;
    height: 205px !important;
    object-fit: cover !important;
    object-position: 56% 46% !important;
    transform: scale(1.01) !important;
    transform-origin: center center !important;
  }
}


/* ===========================================================
   ConnectFix V50 — complete Networking image in the blue band
   (fix the original portrait-in-landscape problem, not a zoom)
   The new wide picture is substituted in page-networking.php
   only when the original default attachment remains in use.
   =========================================================== */
.cf-network-page .cf-it-trust-photo {
  overflow: hidden !important;
  background: #082c56 !important;
  border-radius: 14px !important;
}
.cf-network-page .cf-it-trust-photo img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
  transform-origin: center center !important;
  background: #082c56 !important;
  border-radius: 14px !important;
}
@media (min-width:701px) {
  .cf-network-page .cf-it-trust-photo img {
    height: 290px !important;
    min-height: 0 !important;
    max-height: 290px !important;
  }
}
@media (max-width:700px) {
  .cf-network-page .cf-it-trust-photo img {
    height: 205px !important;
    min-height: 0 !important;
    max-height: 205px !important;
  }
}


/* =========================================================
   ConnectFix V51 — user-selected wide router photo in the
   Networking trust band. Preserve every other page/section.
   ========================================================= */
.cf-network-page .cf-it-trust-visual,
.cf-network-page .cf-it-trust-photo {
  overflow: hidden !important;
  width: 100% !important;
  background: #082c56 !important;
  border-radius: 14px !important;
}
.cf-network-page .cf-it-trust-photo img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: none !important;
  background: transparent !important;
  border-radius: 14px !important;
}
@media (min-width:701px) {
  .cf-network-page .cf-it-trust-visual,
  .cf-network-page .cf-it-trust-photo,
  .cf-network-page .cf-it-trust-photo img {
    height: 290px !important;
    min-height: 0 !important;
    max-height: 290px !important;
  }
}
@media (max-width:700px) {
  .cf-network-page .cf-it-trust-visual,
  .cf-network-page .cf-it-trust-photo,
  .cf-network-page .cf-it-trust-photo img {
    height: 205px !important;
    min-height: 0 !important;
    max-height: 205px !important;
  }
}

/* V52: top Networking hero only; display the selected landscape photo.
   The rest of Networking, the trust band and all other pages are unchanged. */
.cf-network-page .cf-it-hero-photo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 51% 48% !important;
  transform: none !important;
}
@media (max-width: 700px) {
  .cf-network-page .cf-it-hero-photo img {
    object-position: 49% 46% !important;
  }
}


/* ================================================================
   ConnectFix V53 — IT Support photo proportions follow Networking.
   Photo height and surrounding image sections only.
   Homepage, Networking, service cards, forms and contact untouched.
   ================================================================ */
@media (min-width: 1101px) {
  .cf-it-support-page .cf-it-hero-main {
    min-height: 365px !important;
    height: auto !important;
  }
  .cf-it-support-page .cf-it-hero-content {
    padding: 25px clamp(23px, 2.9vw, 46px) !important;
  }
  .cf-it-support-page .cf-it-hero h1 {
    font-size: clamp(34px,3vw,43px) !important;
    line-height: 1.13 !important;
    margin-bottom: 12px !important;
  }
  .cf-it-support-page .cf-it-breadcrumb {margin-bottom:12px !important;}
  .cf-it-support-page .cf-it-lead {
    font-size: 16px !important;
    line-height:1.5 !important;
    margin-bottom:14px !important;
  }
  .cf-it-support-page .cf-it-trust-chips {margin-bottom:16px !important;}
  .cf-it-support-page .cf-it-hero-photo {
    min-height:365px !important;
  }
}
@media (min-width: 701px) and (max-width: 1100px) {
  .cf-it-support-page .cf-it-hero-main {min-height:350px !important;height:auto !important;}
  .cf-it-support-page .cf-it-hero-photo {min-height:350px !important;}
  .cf-it-support-page .cf-it-hero-content {padding:25px 24px !important;}
  .cf-it-support-page .cf-it-hero h1 {
    font-size:clamp(30px,3.8vw,39px) !important;
    margin-bottom:12px !important;
  }
  .cf-it-support-page .cf-it-breadcrumb {margin-bottom:12px !important;}
  .cf-it-support-page .cf-it-lead {
    font-size:15px !important;
    line-height:1.5 !important;
    margin-bottom:14px !important;
  }
  .cf-it-support-page .cf-it-trust-chips {margin-bottom:14px !important;}
}
@media (min-width: 701px) {
  .cf-it-support-page .cf-it-hero-photo {position:relative; overflow:hidden;}
  .cf-it-support-page .cf-it-hero-photo img {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:right 43% !important;
  }
  /* Match the Networking blue/photo band: 290px image high. */
  .cf-it-support-page .cf-it-trust-section {
    padding:20px !important;
    margin-top:9px !important;
    margin-bottom:22px !important;
  }
  .cf-it-support-page .cf-it-trust-columns {
    align-items:center !important;
    height:auto !important;
  }
  .cf-it-support-page .cf-it-trust-copy {padding:12px 16px !important;}
  .cf-it-support-page .cf-it-trust-copy h2 {
    font-size:clamp(26px,2.6vw,36px) !important;
    line-height:1.2 !important;
    margin-bottom:14px !important;
  }
  .cf-it-support-page .cf-it-trust-copy .cf-it-trust-item {
    font-size:14px !important;
    line-height:1.45 !important;
    margin-bottom:8px !important;
  }
  .cf-it-support-page .cf-it-trust-visual,
  .cf-it-support-page .cf-it-trust-photo {
    height:290px !important;
    min-height:0 !important;
    max-height:290px !important;
    margin:0 !important;
    overflow:hidden !important;
  }
  .cf-it-support-page .cf-it-trust-photo img {
    display:block !important;
    width:100% !important;
    height:290px !important;
    min-height:0 !important;
    max-height:290px !important;
    object-fit:cover !important;
    object-position:44% center !important;
    transform:none !important;
    border-radius:14px !important;
  }
}
@media (max-width:700px) {
  /* Same compact photo height as the Networking page on phones. */
  .cf-it-support-page .cf-it-hero-photo {
    height:220px !important;
    min-height:0 !important;
    max-height:220px !important;
  }
  .cf-it-support-page .cf-it-hero-photo img {
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:right 44% !important;
  }
  .cf-it-support-page .cf-it-trust-visual,
  .cf-it-support-page .cf-it-trust-photo,
  .cf-it-support-page .cf-it-trust-photo img {
    height:205px !important;
    min-height:0 !important;
    max-height:205px !important;
  }
  .cf-it-support-page .cf-it-trust-photo {
    margin:0 !important;
    overflow:hidden !important;
  }
  .cf-it-support-page .cf-it-trust-photo img {
    width:100% !important;
    object-fit:cover !important;
    object-position:44% center !important;
    transform:none !important;
  }
}

/* V58: Remote Support uses the same compact hero and blue band dimensions as IT Support V55. */
.cf-remote-page .cf-it-hero-photo img { object-position:center 53% !important; }
.cf-remote-page .cf-it-trust-photo img {object-position:center 52% !important;}

/* ==============================================================
   V60 — REMOTE SUPPORT PHOTO: display complete original photo.
   The V59 image must not be cropped by the compact hero panel.
   This is scoped to the Remote Support page only. No other
   pages, photos, layouts, or banner dimensions are changed.
   ============================================================== */
.cf-remote-page .cf-it-hero-photo {
  isolation: isolate;
  background: #0b2b53;
}
/* Softly extended background fills leftover space as screen ratio changes. */
.cf-remote-page .cf-it-hero-photo::after {
  content: "";
  position: absolute;
  inset: -24px;
  z-index: 0;
  pointer-events: none;
  background: #0b2b53 url('assets/images/remote-support-hero.jpg') center center / cover no-repeat;
  filter: blur(16px) brightness(.72);
}
.cf-remote-page .cf-it-hero-photo img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  z-index: 1;
}


/* ============================================================
   ConnectFix V61 — Remote Support hero without side bars.
   Preserve full photograph at its intrinsic 16:9 aspect ratio.
   The image expands the hero row naturally instead of forcing
   object-fit:contain inside a short, wide panel. No blurred fill.
   Scoped to Remote Support. All other pages stay as V60.
   ============================================================ */
.cf-remote-page .cf-it-hero-main {
  align-items: center !important;
}
.cf-remote-page .cf-it-hero-photo {
  position: relative !important;
  display: block !important;
  align-self: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  isolation: auto !important;
  overflow: hidden !important;
  background: transparent !important;
}
.cf-remote-page .cf-it-hero-photo::after {
  content: none !important;
  display: none !important;
  background: none !important;
  filter: none !important;
}
.cf-remote-page .cf-it-hero-photo img {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}
@media (max-width: 700px) {
  .cf-remote-page .cf-it-hero-photo {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }
}


/* ============================================================
   ConnectFix V62 — Remote Support hero back to Cyber Security /
   IT Support compact standard. Keep the new Remote Support image,
   but restore the same top-card height and behavior.
   No blurred side fill, no auto-expanded thick hero.
   ============================================================ */
.cf-remote-page .cf-it-hero-main {
  align-items: stretch !important;
  min-height: 440px !important;
}
.cf-remote-page .cf-it-hero-photo {
  position: relative !important;
  display: block !important;
  align-self: stretch !important;
  width: 100% !important;
  height: auto !important;
  min-height: 440px !important;
  max-height: none !important;
  overflow: hidden !important;
  isolation: auto !important;
  background: #143e69 !important;
}
.cf-remote-page .cf-it-hero-photo::after {
  content: none !important;
  display: none !important;
  background: none !important;
  filter: none !important;
}
.cf-remote-page .cf-it-hero-photo img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: none !important;
}
@media (max-width: 1100px) {
  .cf-remote-page .cf-it-hero-main { grid-template-columns: 1fr 1fr !important; min-height: 380px !important; }
  .cf-remote-page .cf-it-hero-photo { min-height: 380px !important; }
}
@media (max-width: 700px) {
  .cf-remote-page .cf-it-hero-main { min-height: 0 !important; }
  .cf-remote-page .cf-it-hero-photo {
    height: clamp(235px,57vw,315px) !important;
    min-height: 0 !important;
    max-height: none !important;
  }
  .cf-remote-page .cf-it-hero-photo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }
}


/* ============================================================
   ConnectFix V63 — Remote Support hero matches Cyber Security
   exactly in structure/height behavior.
   This restores the same compact top card standard.
   ============================================================ */
.cf-remote-page .cf-it-hero-main{
  width:min(1480px,100%) !important;
  margin:auto !important;
  display:grid !important;
  grid-template-columns:52% 48% !important;
  align-items:stretch !important;
  min-height:440px !important;
}
.cf-remote-page .cf-it-hero-content{
  padding:49px clamp(24px,4vw,65px) 44px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
.cf-remote-page .cf-it-hero-photo{
  position:relative !important;
  min-height:440px !important;
  height:auto !important;
  max-height:none !important;
  overflow:hidden !important;
  background:#0a2f62 !important;
  align-self:stretch !important;
  width:auto !important;
}
.cf-remote-page .cf-it-hero-photo::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  background:linear-gradient(90deg,rgba(224,241,255,.13),transparent 45%) !important;
  pointer-events:none !important;
}
.cf-remote-page .cf-it-hero-photo::after{
  content:none !important;
  display:none !important;
  background:none !important;
  filter:none !important;
}
.cf-remote-page .cf-it-hero-photo img{
  position:static !important;
  inset:auto !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:440px !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  transform:none !important;
}
@media(max-width:1100px){
  .cf-remote-page .cf-it-hero-main{grid-template-columns:1fr 1fr !important; min-height:auto !important;}
  .cf-remote-page .cf-it-hero-content{padding:38px 24px !important;}
  .cf-remote-page .cf-it-hero-photo{min-height:380px !important;}
  .cf-remote-page .cf-it-hero-photo img{min-height:380px !important;}
}
@media(max-width:700px){
  .cf-remote-page .cf-it-hero-main{grid-template-columns:1fr !important; min-height:auto !important; width:100% !important;}
  .cf-remote-page .cf-it-hero-content{padding:28px 21px 32px !important;}
  .cf-remote-page .cf-it-hero-photo{min-height:260px !important; max-height:340px !important; height:auto !important;}
  .cf-remote-page .cf-it-hero-photo img{min-height:260px !important; height:100% !important; object-position:center center !important;}
}


/* ================================================================
   ConnectFix V64 — Remote Support top block matches V55 exactly.
   Uses the same compact hero sizing standard as IT Support V55.
   Top block only.
   ================================================================ */
@media (min-width: 1101px) {
  .cf-remote-page .cf-it-hero-main {
    min-height: 365px !important;
    height: auto !important;
  }
  .cf-remote-page .cf-it-hero-content {
    padding: 25px clamp(23px, 2.9vw, 46px) !important;
  }
  .cf-remote-page .cf-it-hero h1 {
    font-size: clamp(34px,3vw,43px) !important;
    line-height: 1.13 !important;
    margin-bottom: 12px !important;
  }
  .cf-remote-page .cf-it-breadcrumb {margin-bottom:12px !important;}
  .cf-remote-page .cf-it-lead {
    font-size: 16px !important;
    line-height:1.5 !important;
    margin-bottom:14px !important;
  }
  .cf-remote-page .cf-it-trust-chips {margin-bottom:16px !important;}
  .cf-remote-page .cf-it-hero-photo {
    min-height:365px !important;
  }
}
@media (min-width: 701px) and (max-width: 1100px) {
  .cf-remote-page .cf-it-hero-main {min-height:350px !important;height:auto !important;}
  .cf-remote-page .cf-it-hero-photo {min-height:350px !important;}
  .cf-remote-page .cf-it-hero-content {padding:25px 24px !important;}
  .cf-remote-page .cf-it-hero h1 {
    font-size:clamp(30px,3.8vw,39px) !important;
    margin-bottom:12px !important;
  }
  .cf-remote-page .cf-it-breadcrumb {margin-bottom:12px !important;}
  .cf-remote-page .cf-it-lead {
    font-size:15px !important;
    line-height:1.5 !important;
    margin-bottom:14px !important;
  }
  .cf-remote-page .cf-it-trust-chips {margin-bottom:14px !important;}
}
@media (min-width: 701px) {
  .cf-remote-page .cf-it-hero-photo {position:relative !important; overflow:hidden !important;}
  .cf-remote-page .cf-it-hero-photo::before {
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    z-index:1 !important;
    background:linear-gradient(90deg,rgba(224,241,255,.13),transparent 45%) !important;
    pointer-events:none !important;
  }
  .cf-remote-page .cf-it-hero-photo::after {content:none !important; display:none !important;}
  .cf-remote-page .cf-it-hero-photo img {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
    object-position:center center !important;
  }
}
@media (max-width:700px) {
  .cf-remote-page .cf-it-hero-main {grid-template-columns:1fr !important; min-height:auto !important; width:100% !important;}
  .cf-remote-page .cf-it-hero-content {padding:28px 21px 32px !important;}
  .cf-remote-page .cf-it-hero h1 {font-size:clamp(35px,9.2vw,47px) !important;}
  .cf-remote-page .cf-it-hero-photo {
    height:220px !important;
    min-height:0 !important;
    max-height:220px !important;
  }
  .cf-remote-page .cf-it-hero-photo::before {
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    z-index:1 !important;
    background:linear-gradient(90deg,rgba(224,241,255,.13),transparent 45%) !important;
    pointer-events:none !important;
  }
  .cf-remote-page .cf-it-hero-photo img {
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
    object-position:center center !important;
  }
}


/* ============================================================
   ConnectFix V66 — About, pared down to the essentials.
   No portrait, biography timeline, duplicate service cards or
   full-width credential panels. Scoped to About only.
   ============================================================ */
.cf-about-simple .cf-it-hero-main{
  display:block !important;
  grid-template-columns:none !important;
  width:min(1280px,100%) !important;
  min-height:0 !important;
  height:auto !important;
  margin:auto !important;
}
.cf-about-simple .cf-it-hero-content{
  max-width:970px;
  min-height:0 !important;
  padding:42px clamp(24px,4vw,54px) 39px !important;
  display:block !important;
}
.cf-about-simple .cf-it-breadcrumb{margin:0 0 18px !important;}
.cf-about-simple .cf-it-hero h1{
  font-size:clamp(34px,3.6vw,47px) !important;
  line-height:1.13 !important;
  margin:0 0 12px !important;
  max-width:none;
}
.cf-about-simple .cf-it-lead{
  font-size:clamp(16px,1.5vw,18px) !important;
  line-height:1.55 !important;
  max-width:760px !important;
  margin:0 0 12px !important;
}
.cf-about-simple .cf-about-location{
  display:inline-flex;
  align-items:center;
  padding:6px 11px;
  background:#e4f1ff;
  color:#16528b;
  border-radius:999px;
  font-size:12px;
  font-weight:750;
  margin:0;
}
.cf-about-simple-body{width:min(930px,calc(100% - 44px));margin:0 auto;padding:45px 0 35px;}
.cf-about-simple-body h2{
  color:#0b2348;
  font-size:clamp(29px,3vw,36px);
  line-height:1.2;
  letter-spacing:-.025em;
  margin:0 0 20px;
}
.cf-about-person>p:not(.cf-it-eyebrow){font-size:16px;line-height:1.75;color:#4d6078;max-width:850px;margin:0 0 17px;}
.cf-about-simple .cf-it-eyebrow{margin:0 0 9px !important;}
.cf-about-study{
  display:flex;
  align-items:flex-start;
  gap:15px;
  background:#f2f8ff;
  border:1px solid #dceafb;
  border-radius:14px;
  padding:19px 20px;
  margin:25px 0 0;
  max-width:850px;
}
.cf-about-study-mark{
  width:42px;
  height:42px;
  flex:0 0 42px;
  border-radius:11px;
  display:grid;
  place-items:center;
  font-size:22px;
  background:#e0efff;
}
.cf-about-study strong{display:block;font-size:16px;color:#0b315c;margin:0 0 3px;}
.cf-about-study p{color:#51647c;font-size:14px;line-height:1.55;margin:0;}
.cf-about-simple .cf-about-simple-cta{width:min(930px,calc(100% - 44px));margin:3px auto 52px;padding:25px 26px;}
.cf-about-simple .cf-about-simple-cta h2{font-size:24px;}
@media(max-width:700px){
  .cf-about-simple .cf-it-hero-main{display:block !important;min-height:0 !important;}
  .cf-about-simple .cf-it-hero-content{padding:28px 22px 31px !important;}
  .cf-about-simple .cf-it-hero h1{font-size:clamp(32px,8.3vw,41px) !important;}
  .cf-about-simple-body{padding:31px 0 27px;}
  .cf-about-person>p:not(.cf-it-eyebrow){font-size:15px;line-height:1.67;}
  .cf-about-study{padding:16px;gap:11px;}
  .cf-about-simple .cf-about-simple-cta{padding:22px 20px;}
}


/* ============================================================
   ConnectFix V67 — Contact page. Simple, independent page,
   scoped styles; no impact on existing service and About layouts.
   ============================================================ */
.cf-contact-page{background:#fff;color:#0b2348;min-height:60vh;}
.cf-contact-shell{width:min(1000px,calc(100% - 44px));margin:0 auto;}
.cf-contact-hero{background:linear-gradient(120deg,#062451,#083a79 67%,#0756a5);color:#fff;}
.cf-contact-hero .cf-contact-shell{padding:32px 10px 49px;text-align:center;}
.cf-contact-breadcrumb{display:flex;justify-content:center;align-items:center;gap:11px;font-size:12px;color:#bfd9f4;margin:0 0 20px;}
.cf-contact-breadcrumb a:hover{text-decoration:underline;color:#fff;}
.cf-contact-eyebrow{font-size:12px;letter-spacing:.15em;font-weight:800;color:#78ceff;margin:0 0 9px;}
.cf-contact-hero h1{font-size:clamp(34px,4.1vw,49px);letter-spacing:-.03em;line-height:1.14;margin:0 0 13px;color:#fff;}
.cf-contact-hero p:not(.cf-contact-eyebrow){font-size:16px;line-height:1.6;color:#dbeaf9;max-width:595px;margin:0 auto;}
.cf-contact-main{padding:32px 0 52px;}
.cf-contact-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.cf-contact-option{background:#fff;border:1px solid #dce8f5;border-radius:18px;padding:27px 28px;box-shadow:0 9px 29px rgba(14,56,105,.045);display:flex;flex-direction:column;align-items:flex-start;min-height:236px;}
.cf-contact-icon{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;margin:0 0 16px;}
.cf-contact-icon svg,.cf-contact-support-icon svg{width:23px;height:23px;display:block;}
.cf-contact-icon-whatsapp{background:#e3f8ed;color:#117e4d;}
.cf-contact-icon-email{background:#e6f1ff;color:#1173ca;}
.cf-contact-option h2{font-size:22px;font-weight:800;letter-spacing:-.02em;color:#0a2b5a;line-height:1.25;margin:0 0 7px;}
.cf-contact-option p{font-size:14px;line-height:1.6;color:#526982;margin:0 0 14px;}
.cf-contact-link{font-size:14px;font-weight:800;color:#0874d1;margin-top:auto;display:inline-flex;align-items:center;gap:7px;}
.cf-contact-link:hover{text-decoration:underline;}
.cf-contact-mail-address{color:#2e587e;font-size:14px;margin:-3px 0 9px;overflow-wrap:anywhere;}
.cf-contact-mail-address:hover{text-decoration:underline;}
.cf-contact-unavailable{font-size:14px;color:#66788d;}
.cf-contact-support{margin:19px 0 0;background:#f3f8fe;border:1px solid #d9e9fa;border-radius:18px;padding:23px 25px;display:flex;gap:18px;align-items:center;}
.cf-contact-support-icon{flex:none;background:#e1efff;color:#0874d1;width:47px;height:47px;border-radius:12px;display:grid;place-items:center;}
.cf-contact-support-copy{flex:1;min-width:0;}
.cf-contact-support h2{font-size:19px;font-weight:800;color:#0a2b5a;letter-spacing:-.02em;margin:0 0 5px;line-height:1.25;}
.cf-contact-support p{font-size:14px;line-height:1.6;color:#526982;margin:0;max-width:530px;}
.cf-contact-support-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#0784e8;color:white;font-size:14px;font-weight:800;padding:14px 20px;border-radius:11px;white-space:nowrap;min-height:45px;}
.cf-contact-support-btn:hover{background:#006aca;}
.cf-contact-coverage{display:flex;align-items:center;justify-content:center;gap:9px;color:#667c94;font-size:13px;line-height:1.6;text-align:center;padding:25px 6px 0;}
.cf-contact-coverage svg{width:17px;height:17px;flex:none;color:#0d7bc9;}
.cf-contact-page a:focus-visible{outline:3px solid #59bbff;outline-offset:3px;}
@media(max-width:700px){
  .cf-contact-shell{width:calc(100% - 32px);}
  .cf-contact-hero .cf-contact-shell{padding:25px 3px 36px;}
  .cf-contact-hero h1{font-size:clamp(31px,8.5vw,40px);}
  .cf-contact-hero p:not(.cf-contact-eyebrow){font-size:15px;}
  .cf-contact-main{padding:23px 0 36px;}
  .cf-contact-options{grid-template-columns:1fr;gap:13px;}
  .cf-contact-option{padding:21px 22px;min-height:0;}
  .cf-contact-support{padding:22px;align-items:flex-start;gap:11px;flex-wrap:wrap;}
  .cf-contact-support-icon{width:40px;height:40px;}
  .cf-contact-support-copy{flex:1 1 calc(100% - 56px);}
  .cf-contact-support-btn{flex:1 1 100%;margin-top:4px;}
  .cf-contact-coverage{padding-top:22px;align-items:flex-start;}
}


/* V68 — Home hero on phones ONLY.
   Desktop and tablet (>= 768px) retain the exact V67 layout and imagery.
   Visual order on phones: heading > photo > description > support buttons. */
.hero-mobile-photo { display: none; }
@media screen and (max-width: 767px) {
  .cf-home-hero .hero-grid {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }
  .cf-home-hero .hero-copy {
    padding: 24px 18px 27px;
    justify-content: flex-start;
    min-width: 0;
  }
  .cf-home-hero .hero-copy h1 {
    font-size: clamp(34px, 9.8vw, 40px);
    line-height: 1.03;
    margin: 0 0 20px;
  }
  .cf-home-hero .hero-mobile-photo {
    display: block;
    position: relative;
    width: calc(100% + 36px);
    aspect-ratio: 16 / 10;
    min-height: 0;
    margin: 0 -18px 21px;
    background: url('assets/images/hero.jpg') center 52% / cover no-repeat;
  }
  .cf-home-hero .hero-grid > .hero-media {
    display: none;
  }
  .cf-home-hero .hero-copy > p {
    font-size: 16px;
    line-height: 1.55;
    margin: 0 0 19px;
    max-width: none;
  }
  .cf-home-hero .hero-copy > .actions {
    gap: 10px;
  }
  .cf-home-hero .hero-copy > .actions .btn {
    width: 100%;
    min-height: 52px;
    padding: 12px 15px;
    font-size: 15px;
  }
}


/* ConnectFix V70 — Only Networking & Wi-Fi, top hero image on desktop/tablet.
   Keep the V55/V68 compact hero dimensions; preserve the V52 photo for phones.
   A wider photographic crop-free composition removes the clipped screen/desk
   while filling the full hero area, without side bars or forced panel growth. */
@media (min-width: 701px) {
  .cf-network-page .cf-it-hero-photo img {
    object-position: center center !important;
    object-fit: cover !important;
    transform: none !important;
  }
}


/* ================================================================
   ConnectFix V71 — Remote Support: top hero COPY aligned left.
   The heading, intro, trust notes and CTAs use the same left inset
   as the service content. This is only the Remote Support top hero;
   no photography, hero height, column widths, mobile styles, or
   other page templates are modified.
   ================================================================ */
@media screen and (min-width: 701px) {
  .cf-remote-page .cf-it-hero-main > .cf-it-hero-content {
    /* Match the compact, left-aligned service-page heading gutters. */
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: clamp(18px, 2.2vw, 32px) !important;
    padding-right: clamp(20px, 2.8vw, 40px) !important;
    align-items: stretch !important;
    text-align: left !important;
  }
  .cf-remote-page .cf-it-hero-content > .cf-it-breadcrumb,
  .cf-remote-page .cf-it-hero-content > h1,
  .cf-remote-page .cf-it-hero-content > .cf-it-lead,
  .cf-remote-page .cf-it-hero-content > .cf-it-trust-chips,
  .cf-remote-page .cf-it-hero-content > .cf-it-hero-buttons {
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
  }
}
