/* ============================================================
   Mobile fixes for Web Designs Rockhampton
   v5 - 16 May 2026
   Covers: home page (index.php) + existing service pages
   Includes: BBD banner styling, CQ map sizing, compact footer
   v5 adds: BBD banner at top of page (desktop+mobile),
            desktop footer text readability fix,
            aggressive mobile footer trim,
            locations section spacing reduced 50%,
            slider gradient (dark left, clear right)
   ============================================================ */

/* ---------- BBD BANNER (above slider on home page) ---------- */
.bbd-ribbon { background:#2C3E50; color:#fff; border-top:1px solid #C8861A; border-bottom:3px solid #C8861A; padding:8px 14px; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.bbd-ribbon-text { font-size:11px; line-height:1.3; }
.bbd-ribbon-label { color:#F4D58A; font-size:9px; letter-spacing:1.5px; font-weight:500; margin-bottom:1px; text-transform:uppercase; }
.bbd-ribbon-label .bbd-star { display:inline-block; }
.bbd-ribbon-name { color:#fff; font-size:13px; font-weight:700; display:block; }
.bbd-ribbon-sub { color:#aaa; font-size:9px; margin-top:1px; }
.bbd-ribbon-btn { background:#C8861A; color:#fff !important; font-size:11px; padding:7px 13px; border-radius:3px; font-weight:500; white-space:nowrap; text-decoration:none; display:inline-block; }
.bbd-ribbon-btn:hover { background:#A06D14; color:#fff !important; }

@media (prefers-reduced-motion: no-preference) {
  @keyframes bbdPulse { 0%,100% { transform:scale(1); box-shadow:0 0 0 0 rgba(200,134,26,0.5); } 50% { transform:scale(1.05); box-shadow:0 0 0 6px rgba(200,134,26,0); } }
  .bbd-ribbon-btn { animation:bbdPulse 2.5s ease-in-out infinite; }
  @keyframes bbdStarTwinkle { 0%,100% { opacity:1; transform:rotate(0deg); } 50% { opacity:0.7; transform:rotate(10deg); } }
  .bbd-ribbon-label .bbd-star { animation:bbdStarTwinkle 3s ease-in-out infinite; }
}

@media (max-width:767px) {
  .bbd-ribbon { padding:7px 12px; }
  .bbd-ribbon-name { font-size:12px; }
}

/* ---------- CQ MAP CONTAINER (under locations) ---------- */
.cq-map-wrap { margin:16px 0 0; padding:0; }
.cq-map-wrap svg { display:block; width:100%; max-width:540px; height:auto; margin:0 auto; border-radius:6px; }
@media (max-width:767px) {
  .cq-map-wrap { margin:12px 0 0; max-width:90%; margin-left:auto; margin-right:auto; }
}

/* ---------- EXISTING SERVICE PAGE RULES (unchanged) ---------- */
@media (max-width:767px){html,body{overflow-x:hidden !important;}body .container,body .auto-container{padding-left:15px !important;padding-right:15px !important;}}
@media (max-width:991px){body .bbd-banner{padding:14px 0 !important;margin:0 !important;}body .bbd-banner-inner{flex-direction:column !important;text-align:center !important;gap:10px !important;padding:12px 16px !important;}body .bbd-banner-heading{font-size:20px !important;line-height:1.25 !important;margin:4px 0 !important;}body .bbd-banner-tag{font-size:12px !important;margin-bottom:2px !important;}body .bbd-banner-sub{font-size:13px !important;line-height:1.4 !important;margin:0 !important;}body .bbd-banner-btn{padding:10px 18px !important;font-size:14px !important;margin-top:4px !important;display:inline-block !important;}}
@media (max-width:767px){body .page-title{padding:60px 0 40px !important;}body .page-title .title{font-size:28px !important;line-height:1.2 !important;}}
@media (max-width:991px){body .services-details{padding:40px 0 !important;}body .services-details .service-sidebar{margin-bottom:30px !important;}body .services-details__content{padding:0 !important;}body .wd-section{margin-top:32px !important;}body .wd-section-title{font-size:22px !important;line-height:1.25 !important;margin-bottom:10px !important;}body .wd-section-lead{font-size:14px !important;line-height:1.5 !important;margin-bottom:18px !important;}body .services-page-kicker{font-size:12px !important;letter-spacing:1.2px !important;}body .website-design-intro h2{font-size:24px !important;line-height:1.25 !important;}body .website-design-intro p{font-size:14px !important;line-height:1.55 !important;}}
@media (max-width:767px){body .wd-stats-strip{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;padding:14px !important;margin-top:20px !important;}body .wd-stats-strip .wd-stat-item{padding:10px 6px !important;text-align:center !important;}body .wd-stats-strip .wd-stat-item strong{font-size:16px !important;display:block !important;}body .wd-stats-strip .wd-stat-item span{font-size:11px !important;line-height:1.3 !important;}}
@media (max-width:767px){body .wd-services-grid,body .wd-process-grid,body .wd-why-grid{display:grid !important;grid-template-columns:1fr !important;gap:14px !important;margin:0 !important;padding:0 !important;width:100% !important;}body .wd-services-grid .wd-service-card,body .wd-service-card{width:100% !important;max-width:100% !important;margin:0 !important;padding:18px !important;box-sizing:border-box !important;float:none !important;}body .wd-service-card h4{font-size:17px !important;margin:10px 0 6px !important;line-height:1.3 !important;}body .wd-service-card p{font-size:14px !important;line-height:1.5 !important;margin-bottom:10px !important;}body .wd-service-card-top{margin-bottom:8px !important;}body .wd-service-icon{width:42px !important;height:42px !important;font-size:18px !important;}body .wd-service-label{font-size:11px !important;letter-spacing:1px !important;}body .wd-card-link{font-size:13px !important;}body .wd-process-grid .wd-process-step,body .wd-process-step{width:100% !important;max-width:100% !important;margin:0 !important;padding:18px !important;box-sizing:border-box !important;float:none !important;}body .wd-process-step h4{font-size:17px !important;margin:8px 0 6px !important;}body .wd-process-step p{font-size:14px !important;line-height:1.5 !important;margin:0 !important;}body .wd-process-step-num{font-size:28px !important;}body .wd-process-icon{width:42px !important;height:42px !important;font-size:18px !important;margin-bottom:6px !important;}body .wd-why-grid .wd-why-card,body .wd-why-card{width:100% !important;max-width:100% !important;margin:0 !important;padding:16px !important;box-sizing:border-box !important;display:flex !important;flex-direction:row !important;gap:12px !important;align-items:flex-start !important;float:none !important;}body .wd-why-card .wd-why-icon{width:40px !important;height:40px !important;min-width:40px !important;font-size:16px !important;margin:0 !important;}body .wd-why-card .wd-why-content strong{font-size:15px !important;display:block !important;margin-bottom:4px !important;}body .wd-why-card .wd-why-content p{font-size:13px !important;line-height:1.5 !important;margin:0 !important;}}
@media (max-width:767px){body .wd-features-grid{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;margin:0 !important;padding:0 !important;width:100% !important;}body .wd-features-grid .wd-feature-item,body .wd-feature-item{width:100% !important;max-width:100% !important;margin:0 !important;padding:12px 10px !important;flex-direction:column !important;text-align:center !important;box-sizing:border-box !important;min-height:96px !important;float:none !important;}body .wd-feature-item .wd-feature-icon{width:36px !important;height:36px !important;font-size:15px !important;margin:0 auto 6px !important;}body .wd-feature-item span{font-size:12px !important;line-height:1.3 !important;text-align:center !important;display:block !important;}}
@media (max-width:380px){body .wd-features-grid{grid-template-columns:1fr !important;}}
@media (max-width:767px){body .accordion-box{margin:0 !important;padding:0 !important;}body .accordion-box .accordion{margin-bottom:8px !important;padding:0 !important;}body .accordion-box .acc-btn{padding:12px 40px 12px 14px !important;font-size:14px !important;line-height:1.35 !important;position:relative !important;}body .accordion-box .acc-btn .icon{right:12px !important;top:50% !important;transform:translateY(-50%) !important;width:22px !important;height:22px !important;font-size:11px !important;line-height:22px !important;}body .accordion-box .acc-content .content{padding:10px 14px 14px !important;}body .accordion-box .acc-content .text{font-size:13px !important;line-height:1.55 !important;margin:0 !important;}}
@media (max-width:767px){body .wd-cta-panel{flex-direction:column !important;text-align:center !important;padding:22px 18px !important;gap:14px !important;margin-top:28px !important;}body .wd-cta-panel h2{font-size:20px !important;line-height:1.25 !important;margin:6px 0 !important;}body .wd-cta-panel p{font-size:14px !important;line-height:1.5 !important;}body .wd-cta-actions{flex-direction:column !important;gap:10px !important;width:100% !important;}body .wd-cta-actions .theme-btn,body .wd-cta-actions .wd-cta-call{width:100% !important;text-align:center !important;}}
@media (max-width:991px){body .main-footer .widgets-section{padding:36px 0 12px !important;}body .main-footer .footer-column{margin-bottom:22px !important;}body .main-footer .footer-widget{margin-bottom:0 !important;}body .main-footer .widget-title{font-size:15px !important;margin-bottom:12px !important;padding-bottom:8px !important;}body .main-footer .about-widget .logo{margin-bottom:12px !important;}body .main-footer .about-widget .logo img{max-width:200px !important;height:auto !important;}body .main-footer .about-widget .text{font-size:13px !important;line-height:1.5 !important;margin-bottom:12px !important;}body .main-footer .user-links li{margin-bottom:6px !important;padding:0 !important;}body .main-footer .user-links li a{font-size:13px !important;line-height:1.4 !important;padding:2px 0 !important;}body .main-footer .contacts-widget .text{font-size:13px !important;line-height:1.45 !important;margin-bottom:8px !important;}body .main-footer .contact-info li{font-size:13px !important;margin-bottom:4px !important;}body .main-footer .social-icon-two{margin-top:6px !important;}body .main-footer .social-icon-two li{margin-right:8px !important;}body .main-footer .social-icon-two li a{width:32px !important;height:32px !important;line-height:32px !important;font-size:13px !important;}body .main-footer .footer-email-row{padding:10px 0 !important;margin-top:8px !important;}body .main-footer .footer-email-row a{font-size:13px !important;word-break:break-all !important;}body .main-footer .footer-bottom{padding:14px 15px !important;flex-direction:column !important;gap:6px !important;text-align:center !important;}body .main-footer .footer-bottom span,body .main-footer .footer-bottom a{font-size:12px !important;line-height:1.4 !important;}body .main-footer .footer-bottom-links{gap:12px !important;}}
@media (max-width:480px){body .main-footer .widgets-section{padding:28px 0 8px !important;}body .main-footer .footer-column{margin-bottom:18px !important;}body .main-footer .about-widget .logo img{max-width:180px !important;}}
@media (max-width:767px){body .clients-section{padding:30px 0 !important;}body .clients-shell{flex-direction:column !important;gap:16px !important;text-align:center !important;}body .clients-title{font-size:14px !important;line-height:1.4 !important;margin:0 !important;}}
@media (max-width:991px){body .service-sidebar .sidebar-service-list ul li a{padding:12px 14px !important;font-size:14px !important;}body .service-sidebar .service-details-help{padding:24px 20px !important;margin-top:18px !important;}body .service-sidebar .service-details-help .help-title{font-size:18px !important;line-height:1.3 !important;}}

/* ============================================================
   NEW: HOME PAGE FIXES (index.php)
   Targets the home-* and site-footer classes used on index.php
   ============================================================ */

/* ---------- Section padding (all home sections breathe less on mobile) ---------- */
@media (max-width:767px){
  body.home-page-body .home-page-intro,
  body.home-page-body .home-growth-section,
  body.home-page-body .home-services-section,
  body.home-page-body .home-strategy-section,
  body.home-page-body .home-cq-locations,
  body.home-page-body .home-portfolio-preview,
  body.home-page-body .home-agency-section,
  body.home-page-body .home-contact-section,
  body.home-page-body .home-final-cta{padding:30px 0 !important;}
  body.home-page-body .home-section-title{font-size:22px !important;line-height:1.25 !important;margin-bottom:10px !important;}
  body.home-page-body .home-kicker{font-size:11px !important;letter-spacing:1.2px !important;}
  body.home-page-body .home-title{font-size:24px !important;line-height:1.25 !important;margin-bottom:12px !important;}
  body.home-page-body .home-lead{font-size:14px !important;line-height:1.55 !important;margin-bottom:14px !important;}
}

/* ---------- 1) "Generate more leads" - Web Design + Local Support: 2 columns ---------- */
@media (max-width:767px){
  body.home-page-body .home-metric-grid{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;margin:14px 0 0 !important;}
  body.home-page-body .home-metric-card{padding:12px 10px !important;margin:0 !important;text-align:center !important;}
  body.home-page-body .home-metric-card strong{font-size:14px !important;display:block !important;margin-bottom:4px !important;}
  body.home-page-body .home-metric-card span{font-size:12px !important;line-height:1.4 !important;}
  body.home-page-body .home-quote-card{padding:14px !important;margin-bottom:12px !important;}
  body.home-page-body .home-quote-card p{font-size:14px !important;line-height:1.5 !important;margin:6px 0 0 !important;}
}

/* ---------- 2) "Strategy First / Professional Positioning / Long-Term Support" cards ---------- */
@media (max-width:767px){
  body.home-page-body .home-intro-proof-strip{margin-top:16px !important;}
  body.home-page-body .home-intro-proof-strip > [class*="col-"]{margin-bottom:10px !important;}
  body.home-page-body .home-proof-card{padding:14px !important;margin:0 !important;}
  body.home-page-body .home-proof-card .home-proof-label{font-size:11px !important;letter-spacing:1px !important;margin-bottom:6px !important;display:block !important;}
  body.home-page-body .home-proof-card h3{font-size:16px !important;line-height:1.3 !important;margin:4px 0 6px !important;}
  body.home-page-body .home-proof-card p{font-size:13px !important;line-height:1.5 !important;margin:0 !important;}
}

/* ---------- 3) "What Web Services Are We Offering" - 4 service cards: 2 columns ---------- */
@media (max-width:767px){
  body.home-page-body .home-services-head{margin-bottom:14px !important;}
  body.home-page-body .home-section-summary-card{padding:14px !important;margin-top:10px !important;}
  body.home-page-body .home-section-summary-card p{font-size:13px !important;line-height:1.5 !important;margin:6px 0 0 !important;}
  body.home-page-body .home-services-grid{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;margin:0 !important;}
  body.home-page-body .home-services-grid > [class*="col-"]{width:100% !important;max-width:100% !important;padding:0 !important;margin:0 !important;flex:0 0 100% !important;}
  body.home-page-body .home-service-card{padding:14px 12px !important;margin:0 !important;height:100% !important;}
  body.home-page-body .home-service-card .home-service-icon{width:38px !important;height:38px !important;font-size:18px !important;margin-bottom:8px !important;}
  body.home-page-body .home-service-card h3{font-size:14px !important;line-height:1.25 !important;margin:6px 0 6px !important;}
  body.home-page-body .home-service-card .home-service-title-line{display:block !important;}
  body.home-page-body .home-service-card p{font-size:12px !important;line-height:1.45 !important;margin-bottom:8px !important;}
  body.home-page-body .home-service-card .home-inline-link{font-size:12px !important;}
  body.home-page-body .home-services-footnote{margin-top:14px !important;text-align:center !important;}
  body.home-page-body .home-services-footnote p{font-size:13px !important;margin-bottom:10px !important;}
}
/* Very narrow phones: drop service cards to 1 column so text doesn't squash */
@media (max-width:360px){
  body.home-page-body .home-services-grid{grid-template-columns:1fr !important;}
}

/* ---------- 4) "Call us to enable business to grow" - shrink that big title ---------- */
@media (max-width:767px){
  body.home-page-body .home-strategy-section .home-section-title{font-size:20px !important;line-height:1.3 !important;margin-bottom:10px !important;}
  body.home-page-body .home-strategy-section .home-section-head > p{font-size:13px !important;line-height:1.5 !important;margin-bottom:12px !important;}
  body.home-page-body .home-service-area-list{display:flex !important;flex-wrap:wrap !important;gap:6px !important;margin:10px 0 16px !important;}
  body.home-page-body .home-service-area-chip{padding:6px 12px !important;font-size:12px !important;}
}

/* ---------- 5) Local Response / Outcomes ROI / Free Audit / Discuss Strategy: 2 columns ---------- */
@media (max-width:767px){
  body.home-page-body .home-strategy-section .row.g-4{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;margin:0 !important;}
  body.home-page-body .home-strategy-section .row.g-4 > [class*="col-"]{width:100% !important;max-width:100% !important;padding:0 !important;margin:0 !important;flex:0 0 100% !important;}
  body.home-page-body .home-strategy-card{padding:14px 10px !important;margin:0 !important;height:100% !important;text-align:center !important;}
  body.home-page-body .home-strategy-card .home-strategy-number{font-size:22px !important;display:block !important;margin-bottom:4px !important;}
  body.home-page-body .home-strategy-card h3{font-size:13px !important;line-height:1.25 !important;margin:4px 0 4px !important;}
  body.home-page-body .home-strategy-card p{font-size:11px !important;line-height:1.4 !important;margin:0 !important;}
}

/* ---------- 6) Rockhampton / Emerald / Gladstone / Yeppoon: 2 columns ---------- */
@media (max-width:767px){
  body.home-page-body .home-location-grid{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;margin:14px 0 0 !important;}
  body.home-page-body .home-location-grid > [class*="col-"]{width:100% !important;max-width:100% !important;padding:0 !important;margin:0 !important;flex:0 0 100% !important;}
  body.home-page-body .home-location-card{padding:0 !important;margin:0 !important;height:100% !important;overflow:hidden !important;}
  body.home-page-body .home-location-card .home-location-media{display:block !important;}
  body.home-page-body .home-location-card .home-location-media img{width:100% !important;height:auto !important;display:block !important;}
  body.home-page-body .home-location-card .home-location-body{padding:10px !important;}
  body.home-page-body .home-location-card .home-location-body h3{font-size:14px !important;line-height:1.2 !important;margin:0 0 4px !important;}
  body.home-page-body .home-location-card .home-location-body p{font-size:11px !important;line-height:1.4 !important;margin:0 0 6px !important;}
  body.home-page-body .home-location-card .home-inline-link{font-size:11px !important;}
}

/* ---------- 7) "Full Service Rockhampton Agency" + "How We Work" panels ---------- */
@media (max-width:767px){
  body.home-page-body .portfolio-insights-panel{padding:0 !important;}
  body.home-page-body .portfolio-insight-card{padding:16px !important;margin-bottom:12px !important;}
  body.home-page-body .portfolio-insight-card .portfolio-section-title{font-size:18px !important;line-height:1.3 !important;margin:6px 0 8px !important;}
  body.home-page-body .portfolio-insight-card p{font-size:13px !important;line-height:1.5 !important;margin-bottom:8px !important;}
  body.home-page-body .portfolio-process-list{margin-top:8px !important;}
  body.home-page-body .portfolio-process-step{padding:8px 0 !important;gap:10px !important;}
  body.home-page-body .portfolio-process-step .portfolio-process-number{font-size:18px !important;min-width:28px !important;}
  body.home-page-body .portfolio-process-step h3{font-size:14px !important;line-height:1.25 !important;margin:0 0 3px !important;}
  body.home-page-body .portfolio-process-step p{font-size:12px !important;line-height:1.45 !important;margin:0 !important;}
}

/* ---------- 8) Contact form - tighter, less long ---------- */
@media (max-width:767px){
  body.home-page-body .home-contact-shell{padding:0 !important;}
  body.home-page-body .home-contact-form-panel{padding:16px !important;margin-bottom:14px !important;}
  body.home-page-body .home-contact-form-panel .home-section-title{font-size:18px !important;line-height:1.3 !important;margin-bottom:12px !important;}
  body.home-page-body .home-contact-form-panel .form-group{margin-bottom:8px !important;}
  body.home-page-body .home-contact-form-panel .form-control{padding:10px 12px !important;font-size:14px !important;min-height:42px !important;}
  body.home-page-body .home-contact-form-panel textarea.form-control{min-height:90px !important;}
  body.home-page-body .home-form-actions{margin-top:10px !important;display:flex !important;flex-direction:column !important;gap:8px !important;align-items:flex-start !important;}
  body.home-page-body .home-contact-side{padding:0 !important;}
  body.home-page-body .home-contact-image img{max-height:160px !important;object-fit:cover !important;width:100% !important;}
  body.home-page-body .home-contact-note{padding:14px !important;}
  body.home-page-body .home-contact-note h3{font-size:14px !important;line-height:1.4 !important;margin:6px 0 8px !important;}
  body.home-page-body .home-contact-points li{font-size:12px !important;line-height:1.45 !important;margin-bottom:4px !important;}
}

/* ---------- "Ready to Grow" final CTA card ---------- */
@media (max-width:767px){
  body.home-page-body .home-final-cta-card{padding:20px 16px !important;text-align:center !important;display:flex !important;flex-direction:column !important;gap:12px !important;}
  body.home-page-body .home-final-cta-card h2{font-size:18px !important;line-height:1.3 !important;margin:6px 0 0 !important;}
  body.home-page-body .home-final-cta-card .home-actions{flex-direction:column !important;gap:8px !important;width:100% !important;}
  body.home-page-body .home-final-cta-card .home-actions .theme-btn{width:100% !important;}
}

/* ---------- Home intro and growth section spacing ---------- */
@media (max-width:767px){
  body.home-page-body .home-intro-shell .row{margin:0 !important;}
  body.home-page-body .home-intro-shell .row > [class*="col-"]{padding:0 !important;}
  body.home-page-body .home-intro-panel{margin-top:14px !important;}
  body.home-page-body .home-actions{display:flex !important;flex-direction:column !important;gap:8px !important;}
  body.home-page-body .home-actions .theme-btn{width:100% !important;text-align:center !important;}
  body.home-page-body .home-growth-panel{padding:18px !important;}
  body.home-page-body .home-growth-panel .row{margin:0 !important;}
  body.home-page-body .home-growth-panel .row > [class*="col-"]{padding:0 !important;}
  body.home-page-body .home-growth-card{padding:16px !important;margin-top:14px !important;}
  body.home-page-body .home-growth-card .tick-list li{font-size:13px !important;line-height:1.5 !important;margin-bottom:4px !important;}
}

/* ---------- Portfolio project cards on home (LockTEK / OPAL / Rods) ---------- */
@media (max-width:767px){
  body.home-page-body .home-portfolio-preview .sec-title h2{font-size:20px !important;line-height:1.3 !important;}
  body.home-page-body .home-portfolio-preview .sec-title .sub-title{font-size:11px !important;letter-spacing:1.2px !important;}
  body.home-page-body .portfolio-project-grid{gap:12px !important;}
  body.home-page-body .portfolio-project-card{padding:0 !important;margin:0 !important;}
  body.home-page-body .portfolio-project-body{padding:14px !important;}
  body.home-page-body .portfolio-project-title{font-size:16px !important;margin:6px 0 4px !important;}
  body.home-page-body .portfolio-project-subtitle{font-size:12px !important;margin-bottom:8px !important;}
  body.home-page-body .portfolio-project-points li{font-size:12px !important;line-height:1.45 !important;margin-bottom:3px !important;}
  body.home-page-body .portfolio-project-result{padding:8px !important;margin:8px 0 !important;}
  body.home-page-body .portfolio-project-result strong{font-size:11px !important;}
  body.home-page-body .portfolio-project-result span{font-size:12px !important;line-height:1.4 !important;}
  body.home-page-body .portfolio-project-actions{flex-direction:column !important;align-items:flex-start !important;gap:4px !important;}
  body.home-page-body .portfolio-project-link{font-size:13px !important;}
  body.home-page-body .portfolio-project-domain{font-size:11px !important;}
}

/* ============================================================
   HOME PAGE FOOTER (.site-footer) - the HUGE one
   This footer has inline styles that need overriding with !important
   ============================================================ */
@media (max-width:767px){
  body.home-page-body .site-footer{padding:0 !important;}
  body.home-page-body .site-footer .footer-top{padding:14px 16px 10px !important;}
  body.home-page-body .site-footer .footer-logo img{max-width:140px !important;height:auto !important;}
  body.home-page-body .site-footer .footer-top > div:last-child{font-size:11px !important;line-height:1.4 !important;margin-top:4px !important;}

  /* Accordion buttons - tighter */
  body.home-page-body .site-footer .acc-item{border-top:1px solid #1e1e1e !important;}
  body.home-page-body .site-footer .acc-btn{padding:10px 16px !important;min-height:auto !important;}
  body.home-page-body .site-footer .acc-btn h6{font-size:11px !important;letter-spacing:0.08em !important;}
  body.home-page-body .site-footer .acc-arrow{font-size:11px !important;}

  /* Accordion body links - smaller line height */
  body.home-page-body .site-footer .acc-body a{font-size:12px !important;line-height:1.9 !important;padding:0 16px !important;}

  /* Contact row in footer */
  body.home-page-body .site-footer > div:nth-last-child(2){padding:10px 16px !important;gap:3px !important;}
  body.home-page-body .site-footer > div:nth-last-child(2) a[href^="tel:"]{font-size:14px !important;}
  body.home-page-body .site-footer > div:nth-last-child(2) a[href^="mailto:"]{font-size:12px !important;}
  body.home-page-body .site-footer > div:nth-last-child(2) span{font-size:12px !important;}

  /* Copyright row */
  body.home-page-body .site-footer > div:last-child{padding:8px 16px !important;gap:4px !important;flex-direction:column !important;text-align:center !important;}
  body.home-page-body .site-footer > div:last-child span{font-size:11px !important;}
  body.home-page-body .site-footer > div:last-child a{font-size:11px !important;}
}

/* ---------- Clients/sponsors strip ---------- */
@media (max-width:767px){
  body.home-page-body .clients-section{padding:24px 0 !important;}
  body.home-page-body .clients-shell{flex-direction:column !important;gap:14px !important;text-align:center !important;}
  body.home-page-body .clients-title{font-size:13px !important;line-height:1.4 !important;margin:0 !important;}
  body.home-page-body .client-logo-frame img{max-height:50px !important;width:auto !important;}
}

/* ---------- Hide the desktop slider on mobile, show mobile-hero (already in template but reinforce) ---------- */
@media (max-width:767px){
  body.home-page-body .main-slider{display:none !important;}
  body.home-page-body .mobile-hero{display:block !important;padding:24px 0 !important;}
  body.home-page-body .mobile-hero-content h2{font-size:22px !important;line-height:1.25 !important;margin-bottom:10px !important;}
  body.home-page-body .mobile-hero-content .mobile-hero-label{font-size:11px !important;letter-spacing:1.2px !important;}
  body.home-page-body .mobile-hero-content .mobile-hero-support{font-size:13px !important;line-height:1.5 !important;margin-bottom:12px !important;}
  body.home-page-body .mobile-hero-actions{display:flex !important;flex-direction:column !important;gap:8px !important;}
  body.home-page-body .mobile-hero-actions .theme-btn{width:100% !important;text-align:center !important;}
}

/* ============================================================
   v5 ADDITIONS - 16 May 2026
   ============================================================ */

/* ---------- 1) BBD BANNER AT VERY TOP OF PAGE (desktop + mobile) ----------
   Option B: lighter navy, gold directory name, stars flank "WE PROUDLY SUPPORT".
   The banner now sits ABOVE the header, not inside <main>. */
.bbd-ribbon{
  width:100% !important;
  margin:0 !important;
  border-top:none !important;
  border-bottom:3px solid #C8861A !important;
  background:#3B5168 !important;
  position:relative !important;
  z-index:5 !important;
  padding:9px 16px !important;
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:14px !important;
}
.bbd-ribbon-text{ font-size:12px !important; line-height:1.3 !important; color:#fff !important; }
.bbd-ribbon-label{ color:#F4D58A !important; font-size:9px !important; letter-spacing:1.6px !important; font-weight:500 !important; margin-bottom:2px !important; text-transform:uppercase !important; }
.bbd-ribbon-label .bbd-star{ display:inline-block !important; color:#F4D58A !important; }
/* Add a second star AFTER "WE PROUDLY SUPPORT" using ::after */
.bbd-ribbon-label::after{ content:" \2605"; color:#F4D58A; margin-left:4px; display:inline-block; }
.bbd-ribbon-name{ color:#F4D58A !important; font-size:14px !important; font-weight:700 !important; display:block !important; }
.bbd-ribbon-sub{ color:#d5d5d5 !important; font-size:10px !important; margin-top:1px !important; }
.bbd-ribbon-btn{ background:#C8861A !important; color:#fff !important; font-size:11px !important; padding:7px 14px !important; border-radius:3px !important; font-weight:600 !important; white-space:nowrap !important; text-decoration:none !important; display:inline-block !important; }
.bbd-ribbon-btn:hover{ background:#A06D14 !important; color:#fff !important; }

/* Desktop sizing - give it more room to breathe */
@media (min-width:768px){
  .bbd-ribbon{ padding:11px 28px !important; gap:20px !important; }
  .bbd-ribbon-text{ font-size:13px !important; }
  .bbd-ribbon-label{ font-size:10px !important; letter-spacing:1.8px !important; }
  .bbd-ribbon-name{ font-size:15px !important; }
  .bbd-ribbon-sub{ font-size:11px !important; }
  .bbd-ribbon-btn{ font-size:13px !important; padding:8px 18px !important; }
}

/* Mobile keeps smaller padding */
@media (max-width:767px){
  .bbd-ribbon{ padding:8px 12px !important; gap:10px !important; }
  .bbd-ribbon-name{ font-size:13px !important; }
}

/* ---------- 2) DESKTOP FOOTER - TEXT READABILITY FIX ----------
   Lift the grey text on the black background so people can actually read it.
   Was: text #555 on bg #111 (failing WCAG contrast).
   Now: text #bbb on bg #111 (clearly readable).
   Section headings (the small SERVICES / AGENCY LOCATIONS labels) stay
   muted gold for hierarchy. */
@media (min-width:768px){
  /* All links and grey text in the footer - lift to readable light grey */
  body.home-page-body .site-footer .footer-col a{ color:#bbb !important; }
  body.home-page-body .site-footer .footer-col a:hover{ color:#fff !important; }
  /* The "Leading the way..." tagline directly under the logo */
  body.home-page-body .site-footer .footer-top > div:last-child{ color:#bbb !important; }
  /* Email and address in the contact row */
  body.home-page-body .site-footer a[href^="mailto:"]{ color:#bbb !important; }
  body.home-page-body .site-footer a[href^="mailto:"]:hover{ color:#fff !important; }
  body.home-page-body .site-footer > div:nth-last-child(2) span{ color:#bbb !important; }
  /* Copyright row */
  body.home-page-body .site-footer > div:last-child span{ color:#aaa !important; }
  body.home-page-body .site-footer > div:last-child a{ color:#bbb !important; }
  body.home-page-body .site-footer > div:last-child a:hover{ color:#fff !important; }
  /* Section headings - lift slightly so they're not nearly invisible */
  body.home-page-body .site-footer .footer-col h6{ color:#C8861A !important; }
}

/* ---------- 3) MOBILE FOOTER - AGGRESSIVE TRIM ----------
   Hide the tagline, hide the long address, tighten every gap.
   Goal: roughly half the height of the current mobile footer. */
@media (max-width:767px){
  /* Hide the "Leading the way..." tagline under the logo */
  body.home-page-body .site-footer .footer-top > div:last-child{ display:none !important; }
  /* Hide the street address line in the contact block */
  body.home-page-body .site-footer > div:nth-last-child(2) span{ display:none !important; }
  /* Tighten the footer-top (logo block) */
  body.home-page-body .site-footer .footer-top{ padding:10px 16px 4px !important; }
  body.home-page-body .site-footer .footer-logo img{ max-width:120px !important; }
  /* Tighten accordion buttons further */
  body.home-page-body .site-footer .acc-btn{ padding:8px 16px !important; }
  /* Tighten the contact row */
  body.home-page-body .site-footer > div:nth-last-child(2){ padding:8px 16px !important; gap:2px !important; }
  body.home-page-body .site-footer > div:nth-last-child(2) a[href^="tel:"]{ font-size:15px !important; line-height:1.2 !important; }
  body.home-page-body .site-footer > div:nth-last-child(2) a[href^="mailto:"]{ font-size:12px !important; line-height:1.3 !important; word-break:break-all !important; }
  /* Tighten copyright row */
  body.home-page-body .site-footer > div:last-child{ padding:6px 16px !important; gap:3px !important; }
  /* Also make sure the recaptcha badge isn't pushing footer content */
  .grecaptcha-badge{ visibility:hidden !important; }
}

/* ---------- 4) CQ LOCATIONS SECTION - WHITE SPACE REDUCED AGGRESSIVELY ----------
   Apply on ALL screens. Reduces top/bottom padding and heading gap. */
body.home-page-body .home-cq-locations{ padding-top:24px !important; padding-bottom:24px !important; }
body.home-page-body .home-cq-locations .home-cq-locations-shell{ padding:18px !important; }
body.home-page-body .home-cq-locations .home-section-head{ margin-bottom:12px !important; }
body.home-page-body .home-cq-locations .home-section-head .home-kicker{ margin-bottom:4px !important; display:block !important; }
body.home-page-body .home-cq-locations .home-section-head .home-section-title{ margin-bottom:0 !important; }
body.home-page-body .home-cq-locations .home-location-grid{ margin-top:0 !important; }
body.home-page-body .home-cq-locations .cq-map-wrap{ margin-top:14px !important; }
/* Mobile - same tight spacing carries over */
@media (max-width:767px){
  body.home-page-body .home-cq-locations{ padding-top:18px !important; padding-bottom:18px !important; }
  body.home-page-body .home-cq-locations .home-cq-locations-shell{ padding:12px !important; }
  body.home-page-body .home-cq-locations .home-section-head{ margin-bottom:10px !important; }
}

/* ---------- 5) SLIDER GRADIENT - DARK LEFT, CLEAR RIGHT ----------
   Replace the flat dark overlay with a left-to-right gradient so the
   building shows through on the right and the text reads on the dark left.
   Matches the homepage-hero-mockup.jpg you provided. */
#rev_slider_one_wrapper .tp-dottedoverlay{
  background: linear-gradient(90deg,
    rgba(15, 27, 46, 0.92) 0%,
    rgba(15, 27, 46, 0.85) 25%,
    rgba(15, 27, 46, 0.55) 55%,
    rgba(15, 27, 46, 0.15) 85%,
    rgba(15, 27, 46, 0.05) 100%) !important;
  background-image: linear-gradient(90deg,
    rgba(15, 27, 46, 0.92) 0%,
    rgba(15, 27, 46, 0.85) 25%,
    rgba(15, 27, 46, 0.55) 55%,
    rgba(15, 27, 46, 0.15) 85%,
    rgba(15, 27, 46, 0.05) 100%) !important;
}

/* Mobile hero - apply the same left-to-right gradient principle
   (mobile-hero already has a top-to-bottom darken; layer the side gradient too) */
@media (max-width:767px){
  .mobile-hero::before{
    background: linear-gradient(90deg,
      rgba(0,0,0,0.85) 0%,
      rgba(0,0,0,0.75) 40%,
      rgba(0,0,0,0.45) 75%,
      rgba(0,0,0,0.25) 100%) !important;
  }
}

/* ============================================================
   HOME PAGE - BOOTSTRAP GUTTER FIX (26 June 2026)
   Resets Bootstrap's row/column gutter spacing (g-3, g-4, g-5 etc.)
   site-wide on mobile, so stacked columns don't leave empty
   gutter padding behind as visible gaps.
   ============================================================ */
@media (max-width:767px){
  body.home-page-body .row[class*="g-"]{
    margin:0 !important;
  }
  body.home-page-body .row[class*="g-"] > [class*="col-"]{
    padding:0 !important;
    margin-bottom:0 !important;
  }
}
@media (max-width: 767px) {
  body.home-page-body .home-page-intro { padding-bottom: 15px !important; }
  body.home-page-body .home-cq-locations { padding-top: 15px !important; }
  body.home-page-body .home-portfolio-preview { padding-bottom: 10px !important; }
  body.home-page-body .home-agency-section { padding-top: 10px !important; }
  body.home-page-body .home-intro-shell { padding-top: 20px !important; }
}/* ==========================================================
   GUTTER FIX REPAIR (3 July 2026)
   Completes the 26 June gutter fix. That fix removed the
   row's negative margin but left Bootstrap's positive top
   margin on the columns, creating dead space above the
   first column of every row on mobile. This removes that
   dead space and sets a consistent 16px gap between
   stacked items.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .row[class*="g-"] > [class*="col-"] {
    margin-top: 16px !important;
  }
  body.home-page-body .row[class*="g-"] > [class*="col-"]:first-child {
    margin-top: 0 !important;
  }
}/* ==========================================================
   GRID ALIGNMENT REPAIR (3 July 2026)
   The 16px gutter repair above assumed stacked columns.
   The location grid and project grid manage their own
   spacing, so exempt them - restores the level 2-across
   location cards and lets the project grid use its own
   12px gap.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .row[class*="g-"].home-location-grid > [class*="col-"] {
    margin-top: 0 !important;
  }
  body.home-page-body .row[class*="g-"].portfolio-project-grid > [class*="col-"] {
    margin-top: 0 !important;
  }
}
/* ==========================================================
   GAP 1 FIX (3 July 2026)
   Tick-list to CQ Locations. Trims the four stacked layers:
   white card bottom padding, both section paddings, and
   dark card top padding. Approx 78px down to approx 42px
   while keeping the two cards visually distinct.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .home-intro-shell { padding-bottom: 12px !important; }
  body.home-page-body .home-page-intro { padding-bottom: 8px !important; }
  body.home-page-body .home-cq-locations { padding-top: 8px !important; }
  body.home-page-body .home-cq-locations-shell { padding-top: 14px !important; }
}
/* ==========================================================
   GAP 2 FIX (3 July 2026)
   Tightens internal spacing in all three project cards:
   RESULT box to View Website link, approx 38px down to
   approx 14px.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .portfolio-project-body { gap: 8px !important; }
  body.home-page-body .portfolio-project-result { margin: 8px 0 0 !important; }
  body.home-page-body .portfolio-project-actions { margin-top: 6px !important; }
}
/* ==========================================================
   CONTACT AREA FIXES (3 July 2026)
   1) Halves the grey gap between What We Offer and the
      contact card.
   2) Shortens the form: message box approx 3 lines, slimmer
      fields, tighter stacking.
   3) Photo frame matched to photo (was 220px frame around a
      160px photo) and gap to Local Support panel halved.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .home-services-section { padding-bottom: 15px !important; }
  body.home-page-body .home-contact-section { padding-top: 15px !important; }
  body.home-page-body .home-contact-form-panel .form-control { min-height: 38px !important; padding: 8px 12px !important; }
  body.home-page-body .home-contact-form-panel textarea.form-control { height: 84px !important; min-height: 84px !important; }
  body.home-page-body .home-contact-form-panel .form-group { margin-bottom: 6px !important; }
  body.home-page-body .home-contact-image { height: 160px !important; }
  body.home-page-body .home-contact-side { gap: 10px !important; }
}
/* ==========================================================
   FOOTER SLIM + SIDE-BY-SIDE BARS (3 July 2026)
   Mobile only. SERVICES and AGENCY LOCATIONS share one row,
   stale indent rule neutralised, logo block and copyright
   block slimmed, tagline hidden on mobile.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .site-footer { display: flex !important; flex-wrap: wrap !important; padding: 0 !important; }
  body.home-page-body .site-footer .footer-top { width: 100% !important; padding: 10px 16px 8px !important; }
  body.home-page-body .site-footer .footer-logo img { max-width: 120px !important; }
  body.home-page-body .site-footer .footer-top > div:last-child { display: none !important; }
  body.home-page-body .site-footer > div.acc-item { width: 50% !important; padding: 0 !important; box-sizing: border-box !important; }
  body.home-page-body .site-footer .acc-btn { padding: 8px 14px !important; }
  body.home-page-body .site-footer > div:last-child { width: 100% !important; padding: 6px 12px !important; gap: 2px !important; }
  body.home-page-body .site-footer > div:last-child span { font-size: 10px !important; }
  body.home-page-body .site-footer > div:last-child a { font-size: 10px !important; }
}
/* ==========================================================
   FOOTER BAR LEVELLING (3 July 2026)
   Forces the two side-by-side bars to identical height,
   text and arrows aligned, matching top border on both.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .site-footer > div.acc-item { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; border-top: 1px solid #1e1e1e !important; margin: 0 !important; }
  body.home-page-body .site-footer .acc-btn { min-height: 38px !important; align-items: center !important; margin: 0 !important; }
}/* ==========================================================
   FOOTER ARROW PLACEMENT (3 July 2026)
   Sits each bar's triangle directly after its own heading
   instead of pushed to the far edge of the half-width bar.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .site-footer .acc-btn { justify-content: flex-start !important; gap: 6px !important; }
  body.home-page-body .site-footer .acc-arrow { flex-shrink: 0 !important; }
}
/* ==========================================================
   AGENCY LOCATIONS ARROW RESTORE (3 July 2026)
   A stale rule at ~line 349 (written for the old footer's
   contact block) hides spans in the second-last footer
   child - which is now the Agency Locations bar, so it was
   hiding its triangle. This outranks it. The stale rule
   can be deleted at final cleanup.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .site-footer > div:nth-last-child(2) .acc-arrow { display: inline-block !important; }
}
/* ==========================================================
   LOCATION CARD PHOTO SPACE FIX (3 July 2026)
   Same phantom as the contact photo: theme gives the photo
   frame a fixed 200px height on mobile while the photo
   inside renders ~115px. Frame now shrink-wraps its photo.
   ========================================================== */
@media (max-width: 767px) {
  body.home-page-body .home-location-card .home-location-media { height: auto !important; }
}