:root{--spanish-gray:hsl(0, 0%, 60%);--sonic-silver:hsl(0, 0%, 47%);--eerie-black:hsl(0, 0%, 13%);--salmon-pink:#00796b;--sandy-brown:hsl(29, 90%, 65%);--ocean-green:hsl(152, 51%, 52%);--davys-gray:hsl(0, 0%, 33%);--cultured:hsl(0, 0%, 93%);--white:hsl(0, 100%, 100%);--onyx:hsl(0, 0%, 27%);--fs-1:1.563rem;--fs-2:1.375rem;--fs-3:1.25rem;--fs-4:1.125rem;--fs-5:1rem;--fs-6:0.938rem;--fs-7:0.875rem;--fs-8:0.813rem;--fs-9:0.75rem;--fs-10:0.688rem;--fs-11:0.625rem;--weight-300:300;--weight-400:400;--weight-500:500;--weight-600:600;--weight-700:700;--border-radius-medium:10px;--border-radius-small:5px;--transition-timing:0.2s ease}*,::after,::before{margin:0;padding:0;box-sizing:border-box;list-style:none}a{text-decoration:none}header a{display:block}span{display:inline-block}.desktop-navigation-menu,.header-top{display:none}.category{margin-bottom:30px}@media (min-width:480px){:root{--fs-1:1.875rem}.header-top{display:block;padding:10px 0;border-bottom:1px solid var(--cultured)}.header-social-container{display:none}.cta-content{padding:40px}.cta-content .discount{--fs-11:0.875rem;padding:5px 10px}.cta-title{--fs-5:1.5rem}.cta-text{--fs-7:1rem}.cta-btn{--fs-9:1rem}}@media (min-width:570px){.header-top .container{display:flex;justify-content:space-between;align-items:center}.header-logo{margin-bottom:0}.cta-container{aspect-ratio:6/5}}@media (min-width:768px){:root{--fs-1:2.375rem}}@media (min-width:1030px){:root{--fs-1:2.625rem;--fs-2:1.125rem}.header-social-container{display:flex;align-items:center;gap:5px}.header-social-container .social-link{padding:2px 5px 3px;width:25px;height:25px;background:var(--salmon-pink);border-radius:var(--border-radius-small);color:var(--white);transition:var(--transition-timing)}.header-social-container .social-link:hover{background:#ededed;color:var(--sonic-silver)}.desktop-navigation-menu{display:block}.desktop-menu-category-list{position:relative;display:flex;justify-content:center;align-items:center;gap:30px}.desktop-menu-category-list .menu-category:not(:nth-child(3)){position:relative}.active{text-decoration:underline;text-underline-offset:18.5px;text-decoration-thickness:2px}.active-2{color:var(--salmon-pink)!important}.desktop-menu-category-list .menu-category:last-child .menu-title-2{border-radius:100px;overflow:hidden;padding:10px 15px;text-transform:uppercase;font-size:var(--fs-7);font-weight:var(--weight-600);color:var(--white)!important;background-color:var(--salmon-pink);border:2px solid #fff!important;transition:var(--transition-timing)!important}.desktop-menu-category-list .menu-category:last-child .menu-title-2:hover{color:#fff!important;border:2px solid #fff;color:var(--salmon-pink)!important;background-color:var(--white)!important;border:2px solid var(--salmon-pink)!important}.desktop-menu-category-list .menu-category:last-child .menu-title-2.scrolled{color:#fff!important;background-color:var(--salmon-pink);border:2px solid #fff}.desktop-menu-category-list .menu-category:last-child .menu-title-2.scrolled:hover{color:var(--salmon-pink)!important;background-color:var(--white);border:2px solid #fff}.desktop-menu-category-list .menu-category>.menu-title{position:relative;color:var(--white);font-size:var(--fs-7);font-weight:var(--weight-600);text-transform:uppercase;padding:15px 0;transition:var(--transition-timing)}.desktop-menu-category-list .menu-category>.menu-title:hover{color:#e8e8e8}.desktop-menu-category-list .menu-category>.menu-title::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--white);transform:scaleX(0);transform-origin:left;transition:var(--transition-timing)}.desktop-menu-category-list .menu-category>.menu-title:hover::after{transform:scaleX(1)}.desktop-menu-category-list .menu-category:hover>.dropdown-list,.desktop-menu-category-list .menu-category:hover>.dropdown-panel{transform:translateY(0);opacity:1;visibility:visible;pointer-events:all}.dropdown-panel{position:absolute;top:100%;right:0;background:var(--white);width:1100px!important;display:grid;grid-template-columns:repeat(4,1fr);gap:30px;padding:30px 30px 30px 0;border:1px solid var(--cultured);box-shadow:0 3px 5px rgba(0,0,0,.1);border-radius:var(--border-radius-medium);transform:translateY(50px);opacity:0;visibility:hidden;pointer-events:none;transition:var(--transition-timing);z-index:5}.dropdown-panel-list .menu-title a{color:var(--onyx);font-size:var(--fs-7);font-weight:var(--weight-600);padding-bottom:10px;border-bottom:1px solid var(--cultured);margin-bottom:10px}.panel-list-item a{color:var(--sonic-silver);font-size:var(--fs-7);text-transform:capitalize;transition:var(--transition-timing)}.dropdown-list .dropdown-item a:hover,.panel-list-item a:hover{color:var(--salmon-pink)}.panel-list-item:not(:last-child) a{padding:4px 0}.panel-list-item:last-child{margin-top:20px}.panel-list-item img{width:100%;height:auto;border-radius:var(--border-radius-small)}.dropdown-list{position:absolute;top:100%;left:0;width:200px;background:var(--white);padding:20px 0;border-radius:var(--border-radius-medium);border:1px solid var(--cultured);box-shadow:0 3px 3px rgba(0,0,0,.1);transform:translateY(50px);opacity:0;visibility:hidden;pointer-events:none;transition:var(--transition-timing);z-index:5}.dropdown-list .dropdown-item a{color:var(--sonic-silver);font-size:var(--fs-7);text-transform:capitalize;padding:4px 20px;transition:var(--transition-timing)}.cta-container{min-width:calc(50% - 15px);width:calc(50% - 15px);margin-bottom:0}.service{width:100%}.blog-container{padding-top:20px}}@media (min-width:1200px){.desktop-menu-category-list{gap:45px}.service{min-width:calc(25% - 20px);width:calc(25% - 20px)}.cta-container{min-width:calc(50% - 20px);width:calc(50% - 20px);aspect-ratio:unset}.blog{margin-bottom:50px}footer{padding-top:50px}}.filament-btn{background-color:var(--salmon-pink);padding:5px 10px 4px;border-radius:2px;color:var(--white);outline:0;font-size:var(--fs-9);font-weight:var(--weight-700);border:2px solid #fff;transition:var(--transition-timing);margin-right:10px}.filament-btn:hover{background-color:#fff;border:2px solid var(--salmon-pink);color:var(--salmon-pink)}.offcanvas-list .offcanvas-list-items:first-child{margin-top:10px}.offcanvas-list .offcanvas-list-items:not(:last-child){border-bottom:1px solid #ddd;padding-bottom:15px;margin-bottom:15px}.offcanvas-list .offcanvas-list-items a{color:var(--onyx);font-size:var(--fs-7);text-transform:uppercase;transition:var(--transition-timing)}.accordion-list{list-style:none;margin:0;padding:0}.accordion-list li{padding:10px 0;border-bottom:1px solid #ddd}.accordion-list li:last-child{border-bottom:none}.accordion-list .d-block{text-decoration:none;color:var(--salmon-pink);font-size:14px;display:block;padding:5px 10px;transition:background-color .3s ease,color .3s ease}.accordion-list .d-block:hover{color:var(--salmon-pink);border-radius:3px}.accordion-button{font-size:var(--fs-8)!important;text-transform:uppercase}.offcanvas-body::-webkit-scrollbar{width:8px}.offcanvas-body::-webkit-scrollbar-thumb{background-color:#888;border-radius:4px;border:2px solid #f0f0f0}.offcanvas-body::-webkit-scrollbar-track{background-color:#f0f0f0}.offcanvas-body::-webkit-scrollbar-thumb:hover{background-color:#555}.header-padding{padding:15px 0;transition:padding .3s ease}.header-padding.scrolled{padding:5px 0}.header-logo{width:80px;height:50px;object-fit:contain}@media screen and (max-width:768px){.header-logo{width:60px;height:40px;object-fit:contain}}

/* =========================================================================
   Compact header pass  —  tighter top bar / nav / dropdowns on every page,
   one consistent header colour, and a stronger "Get a Quote" CTA.
   (Later rules here intentionally override the ones above.)
   ========================================================================= */

/* --- Top utility bar (desktop, >=1200px) --- */
.header-top{padding:5px 0;border-bottom:1px solid #e9e7e3;background:#f5f4f2}
.header-top .m-p{font-size:12px!important}
.header-top a p{transition:color .2s ease}
.header-top a:hover p,.header-top a:hover p i{color:var(--salmon-pink)!important}

/* --- Main nav bar: one colour everywhere + a little depth --- */
.main__header{box-shadow:0 2px 12px rgba(0,0,0,.10)}
.main__header.bg-white{background-color:var(--secondary-blue)!important}   /* index used bg-white -> white-on-white links */
.header-padding{padding:12px 0}
.header-padding.scrolled{padding:6px 0}
.header-logo{width:76px;height:42px}
@media screen and (max-width:768px){.header-logo{width:58px;height:36px}}

/* --- Tablet / mobile bar (<1200px): trim vertical padding --- */
@media (max-width:1199.98px){
  .d-xl-none .container.d-flex.py-2{padding-top:.3rem!important;padding-bottom:.3rem!important}
}

/* --- Desktop nav items: tighter rhythm --- */
@media (min-width:1030px){
  .desktop-menu-category-list{gap:22px}
  .desktop-menu-category-list .menu-category>.menu-title{padding:9px 0;letter-spacing:.02em}
  .active{text-underline-offset:9px;text-decoration-thickness:2px}
}
@media (min-width:1200px){.desktop-menu-category-list{gap:30px}}

/* Fix: the desktop nav AND the mobile bar both rendered between 1030-1199px */
@media (max-width:1199.98px){.desktop-navigation-menu{display:none!important}}

/* --- "Get a Quote" pill: solid accent so the CTA actually stands out --- */
@media (min-width:1030px){
  .desktop-menu-category-list .menu-category:last-child .menu-title-2,
  .desktop-menu-category-list .menu-category:last-child .menu-title-2.scrolled{
    background-color:var(--main-yellow)!important;color:#1a1a1a!important;
    border:2px solid var(--main-yellow)!important;padding:7px 16px!important}
  .desktop-menu-category-list .menu-category:last-child .menu-title-2:hover,
  .desktop-menu-category-list .menu-category:last-child .menu-title-2.scrolled:hover{
    background-color:#fff!important;color:var(--secondary-blue)!important;border-color:#fff!important}
}

/* --- Mega dropdown: trim the generous padding --- */
@media (min-width:1030px){
  .dropdown-panel{gap:20px;padding:18px 24px 20px 0}
  .dropdown-panel-list .menu-title a{padding-bottom:7px;margin-bottom:7px}
  .dropdown-panel .panel-list-item a{padding:3px 0}
  .dropdown-panel .panel-list-item:last-child{margin-top:0}
}

/* --- Offcanvas (mobile menu): denser list --- */
.offcanvas-header{padding-top:12px;padding-bottom:12px}
.offcanvas-list .offcanvas-list-items:first-child{margin-top:4px}
.offcanvas-list .offcanvas-list-items:not(:last-child){padding-bottom:9px;margin-bottom:9px}
.offcanvas-body .accordion-list li{padding:6px 0}
.offcanvas-body .accordion-button{padding-top:10px;padding-bottom:10px}
/* --- Nav IA rework (2026-09-04): mega + compact dropdowns --- */
/* Every top item anchors its own dropdown... */
.desktop-menu-category-list .menu-category{position:relative}
/* ...except the mega "Services" panel, which spans under the whole nav. */
.desktop-menu-category-list .menu-category.has-mega{position:static}

/* Compact list dropdowns (Industries / Work / Company) */
.desktop-menu-category-list .menu-category.has-menu>.dropdown-panel.menu{
  right:auto;left:0;width:auto!important;min-width:210px;max-width:280px;
  display:block;grid-template-columns:none;gap:0;padding:12px 0;
}
.dropdown-panel.menu .dropdown-panel-list{list-style:none;margin:0;padding:0}
.dropdown-panel.menu .panel-list-item{margin:0}
.dropdown-panel.menu .panel-list-item:last-child{margin-top:0}
.dropdown-panel.menu .panel-list-item a{display:block;padding:8px 22px!important;white-space:nowrap}
.dropdown-panel.menu .panel-list-item a:hover{background:var(--cultured)}

/* mega column header is a label, not a link */
.dropdown-panel.mega .menu-title a{pointer-events:none}

/* --- Nav dropdowns: centred text + clearer hover (2026-09-07) --- */
/* Mega "Services" columns */
.dropdown-panel.mega .dropdown-panel-list,
.dropdown-panel.mega .dropdown-panel-list li,
.dropdown-panel.mega .dropdown-panel-list a{text-align:center!important}
.dropdown-panel.mega .dropdown-panel-list .menu-title a{display:block}
.dropdown-panel.mega .panel-list-item a{display:block;border-radius:6px;padding-left:6px;padding-right:6px;transition:color var(--transition-timing),background-color var(--transition-timing)}
.dropdown-panel.mega .panel-list-item a:hover{color:var(--salmon-pink);background:var(--cultured)}

/* Promo tile (image + link to a project / blog post) at the foot of a column */
.dropdown-panel.mega .panel-promo{margin-top:auto;padding-top:14px}
.dropdown-panel.mega .dropdown-panel-list{display:flex;flex-direction:column}
.dropdown-panel.mega .panel-promo a{padding:0!important;background:none!important;border-radius:8px}
.dropdown-panel.mega .panel-promo img{width:100%;height:104px;object-fit:cover;border-radius:8px;display:block}
.dropdown-panel.mega .panel-promo span{display:block;margin-top:7px;font-size:var(--fs-8);font-weight:var(--weight-600);color:var(--onyx);line-height:1.35}
.dropdown-panel.mega .panel-promo a:hover span{color:var(--salmon-pink)}

/* Compact dropdowns (Industries / Work / Company) */
.dropdown-panel.menu .dropdown-panel-list,
.dropdown-panel.menu .dropdown-panel-list li,
.dropdown-panel.menu .dropdown-panel-list a{text-align:center!important}
.dropdown-panel.menu .panel-list-item a{transition:color var(--transition-timing),background-color var(--transition-timing)}
.dropdown-panel.menu .panel-list-item a:hover{color:var(--salmon-pink);background:var(--cultured)}

/* Centre the compact panel horizontally under its trigger (Industries / Work / Company) */
.desktop-menu-category-list .menu-category.has-menu>.dropdown-panel.menu{
  left:50%;right:auto;transform:translate(-50%,50px)
}
.desktop-menu-category-list .menu-category.has-menu:hover>.dropdown-panel.menu{
  transform:translate(-50%,0)
}

/* --- Breadcrumb trail (master/breadcrumb.php) --- */
.pl-breadcrumb{background:#f4f8f7;border-bottom:1px solid #e4ecea;padding:10px 0}
.pl-breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:6px;list-style:none;margin:0;padding:0;font-size:.82rem}
.pl-breadcrumb li{display:flex;align-items:center;gap:6px;color:#6b7572;white-space:nowrap}
.pl-breadcrumb li:not(:last-child)::after{content:"\f105";font-family:"Font Awesome 6 Free";font-weight:900;color:#b7c2bf;margin-left:6px;font-size:.72rem}
.pl-breadcrumb a{color:#00796b;text-decoration:none;font-weight:500;display:inline-flex;align-items:center;gap:5px}
.pl-breadcrumb a:hover{text-decoration:underline}
.pl-breadcrumb li[aria-current="page"] span{color:#0f4d47;font-weight:600}
.pl-breadcrumb i.fa-house{font-size:.78rem}
@media (max-width:575.98px){.pl-breadcrumb{padding:8px 0}.pl-breadcrumb ol{font-size:.76rem;flex-wrap:nowrap;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none}.pl-breadcrumb ol::-webkit-scrollbar{display:none}}
