/* Oxmoor Commercial | master-brand family, oxblood-led page treatment.
   Both logo images reference EXACT path geometry from CommercialArtwork.svg.
   The live emergency utility and all core form functionality are retained. */
:root{--oxblood:#7b1e2d;--oxblood-dark:#541b29}
.commercialSiteHeader{
  position:sticky;top:0;z-index:50;
  background:#fffbfc;
  border-top:5px solid var(--oxblood);
  border-bottom:1px solid #e8cfd6;
  box-shadow:0 7px 22px rgba(48,18,30,.095);
  backdrop-filter:blur(12px);
}
.commercialSiteHeader .nav{
  min-height:106px;height:auto;
  display:grid;grid-template-columns:minmax(325px,335px) minmax(0,1fr) auto;
  align-items:center;gap:22px;padding:11px 0;
}
.commercialSiteHeader .commercial-brand{
  display:inline-flex;align-items:center;gap:11px;min-width:0;max-width:100%;
}
.commercialBrandIcon{display:block;flex:0 0 105px;width:105px;height:auto;max-height:61px;object-fit:contain}
.commercialBrandWordmark{display:block;flex:0 1 207px;width:207px;max-width:calc(100% - 116px);height:auto;object-fit:contain}
.commercialSiteHeader .links{display:flex;align-items:center;justify-content:center;gap:19px;white-space:nowrap}
.commercialSiteHeader .links a{padding:18px 0;font-size:.81rem;font-weight:800;color:#263c4d}
.commercialSiteHeader .links a:hover,.commercialSiteHeader .links a[aria-current="page"]{color:var(--oxblood)}
.commercialSiteHeader .links a:after{bottom:10px;background:var(--oxblood);height:3px}
.commercialSiteHeader .links a[aria-current="page"]:after{transform:scaleX(1)}
.commercialSiteHeader .nav-actions{display:flex;align-items:center;gap:9px}
.commercialSiteHeader .nav-actions>.btn{min-height:44px;padding:12px 14px;font-size:.76rem;white-space:nowrap}
.commercialSiteHeader .nav-actions>.btn:not(.dark){background:var(--oxblood);border-color:var(--oxblood)}
/* Header actions: explicit button styling so links cannot inherit plain navigation appearance. */
.commercialSiteHeader .nav .nav-actions>a.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:46px;box-sizing:border-box;padding:11px 16px;
  border-style:solid;border-width:2px;border-radius:6px;
  text-align:center;text-decoration:none;
  font-family:'DM Sans',Arial,sans-serif;font-size:.77rem;line-height:1.15;
  font-weight:800;letter-spacing:.025em;white-space:nowrap;
  box-shadow:0 3px 9px rgba(40,18,30,.09);
  transition:background-color .18s,color .18s,border-color .18s,box-shadow .18s,transform .18s;
}
.commercialSiteHeader .nav .nav-actions>a.btn.dark{
  background:#fff;color:#082c47;border-color:#174e73;
}
.commercialSiteHeader .nav .nav-actions>a.btn:not(.dark){
  background:#7b1e2d;color:#fff;border-color:#7b1e2d;
  box-shadow:0 5px 14px rgba(123,30,45,.20);
}
.commercialSiteHeader .nav .nav-actions>a.btn.dark:hover{
  background:#e9f2f7;color:#082c47;border-color:#084a7a;
  box-shadow:0 6px 16px rgba(8,74,122,.16);transform:translateY(-1px)
}
.commercialSiteHeader .nav .nav-actions>a.btn:not(.dark):hover{
  background:#641827;color:#fff;border-color:#641827;
  box-shadow:0 7px 19px rgba(123,30,45,.26);transform:translateY(-1px)
}
.commercialSiteHeader .nav .nav-actions>a.btn:active{transform:translateY(0);box-shadow:none}
.commercialSiteHeader .nav .nav-actions>a.btn:focus-visible{
  outline:3px solid #c6922e;outline-offset:3px
}
.commercialSiteHeader .mobile-menu a.mobile-quote{
  display:flex;align-items:center;justify-content:center;
  min-height:46px;padding:12px 16px;margin-top:14px;
  background:#7b1e2d;color:#fff;border:2px solid #7b1e2d;
  border-radius:6px;text-decoration:none;box-shadow:0 4px 12px rgba(123,30,45,.18)
}
.commercialSiteHeader .mobile-menu a.mobile-quote:hover{background:#641827;border-color:#641827}
.commercialSiteHeader .menu-button{color:var(--oxblood);border-color:#d4b7c0}
.commercialSiteHeader .commercialEmergency{
  background:linear-gradient(90deg,#4b1727 0%,#672336 100%);
  color:#f7eaed;border-top:1px solid rgba(255,255,255,.13)
}
.commercialSiteHeader .commercialEmergency .wrap{
  min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:16px;
  font-size:.72rem
}
.commercialSiteHeader .commercialEmergency .wrap>span{
  display:block;opacity:.95;line-height:1.4;white-space:normal
}
.commercialSiteHeader .commercialEmergency button{
  background:#c6922e!important;color:#17120a!important;
  border:1px solid #e7bd67!important;border-radius:5px;
  display:inline-flex;gap:7px;align-items:center;justify-content:center;
  text-align:center;min-height:32px;white-space:normal
}
.commercialSiteHeader .commercialEmergency button strong,
.commercialSiteHeader .commercialEmergency button span{color:#17120a!important}
.commercialSiteHeader .mobile-menu{
  position:absolute;left:0;right:0;top:100%;
  background:#fff9fa;border-top:1px solid #ead1d8;
  box-shadow:0 20px 38px rgba(42,13,27,.17);z-index:60
}
.commercialSiteHeader .mobile-menu{display:none}
.commercialSiteHeader .mobile-menu.open{display:grid;gap:0;padding:12px max(20px,calc((100% - 1180px)/2)) 22px}
.commercialSiteHeader .mobile-menu a{padding:14px 5px;border-bottom:1px solid #ead5db;font-weight:800;color:#263c4d}
.commercialSiteHeader .mobile-menu a[aria-current="page"]{color:var(--oxblood)}
.commercialSiteHeader .mobile-menu .mobile-quote{background:var(--oxblood);color:#fff}
section{scroll-margin-top:172px}
.hero{background:#451928}
.hero-media:after{
  background:linear-gradient(90deg,rgba(56,15,29,.96) 0%,rgba(60,21,35,.89) 37%,rgba(35,29,39,.52) 67%,rgba(7,26,44,.10) 100%)
}
.hero .eyebrow{color:#ffd5de}
.hero h1{text-shadow:0 4px 20px rgba(17,5,10,.20)}
.hero .hero-actions>.btn:not(.hero-call){background:var(--oxblood);border-color:#aa5166}
.hero .hero-actions>.hero-call{background:rgba(7,26,44,.26);border-color:rgba(255,255,255,.58)}
.capability-strip{background:#fcf5f6;border-bottom-color:#eed7dd}
.commercialSiteHeader .nav a:focus-visible,
.commercialSiteHeader .nav button:focus-visible{
  outline:3px solid #aa5265;outline-offset:3px
}
.commercial-footer-logo{
  display:inline-flex;align-items:center;gap:10px;padding:9px 14px;
  width:max-content;max-width:100%;border-radius:7px;background:#fff;
  box-shadow:0 5px 18px rgba(0,0,0,.13)
}
.commercial-footer-logo .commercialBrandIcon{width:64px;flex-basis:64px;max-height:47px}
.commercial-footer-logo .commercialBrandWordmark{width:160px;flex:0 1 160px;max-width:calc(100% - 74px)}
@media(max-width:1120px){
  .commercialSiteHeader .nav{grid-template-columns:auto 1fr auto;gap:15px}
  .commercialSiteHeader .links{display:none}
  .commercialSiteHeader .nav .nav-actions>a.btn.dark{display:none}
  .commercialSiteHeader .menu-button{display:inline-grid;place-items:center}
}
@media(max-width:700px){
  .commercialSiteHeader .nav{min-height:77px;padding:8px 0;gap:8px}
  .commercialBrandIcon{width:70px;flex-basis:70px;max-height:45px}
  .commercialBrandWordmark{width:156px;flex-basis:156px;max-width:calc(100% - 78px)}
  .commercialSiteHeader .commercial-brand{gap:8px}
  .commercialSiteHeader .nav .nav-actions>a.btn:not(.dark){display:none}
  .commercialSiteHeader .menu-button{display:inline-grid;width:40px;height:40px;place-items:center}
  .commercialSiteHeader .commercialEmergency .wrap{min-height:48px;gap:9px}
  .commercialSiteHeader .commercialEmergency .wrap>span{
    display:block;opacity:1;max-width:43%;font-size:.59rem;line-height:1.28
  }
  .commercialSiteHeader .commercialEmergency .wrap>span strong{display:block}
  .commercialSiteHeader .commercialEmergency button{
    max-width:57%;padding:7px 8px;gap:4px;flex-wrap:wrap;
    font-size:.57rem!important;line-height:1.2
  }
  .commercialSiteHeader .commercialEmergency button strong,
  .commercialSiteHeader .commercialEmergency button span{font-size:.58rem!important}
  section{scroll-margin-top:152px}
  .hero{background:linear-gradient(125deg,#471827 0%,#5c2033 52%,#2a2134 100%)}
  .hero-media:after{background:linear-gradient(180deg,rgba(71,23,40,.24),rgba(71,23,40,.02))}
  .commercial-footer-logo .commercialBrandIcon{width:56px;flex-basis:56px}
  .commercial-footer-logo .commercialBrandWordmark{width:149px;flex-basis:149px;max-width:calc(100% - 66px)}
}
@media(max-width:380px){
  .commercialBrandIcon{width:58px;flex-basis:58px}
  .commercialBrandWordmark{width:138px;flex-basis:138px;max-width:calc(100% - 66px)}
}

/* Commercial hero: remove ONLY the tiled mechanical/clipart monogram.
   Keep real rotating hero photography, gradient for text, and exact vector logo. */
.hero .hero-inner::before{
  content:none;
  display:none;
  background:none;
}
