/* KMX COMPANY — base: tokens, fonts, reset, typography */
@font-face{font-family:Manrope;font-weight:400;font-display:swap;src:url(../fonts/manrope-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Manrope;font-weight:500;font-display:swap;src:url(../fonts/manrope-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Manrope;font-weight:600;font-display:swap;src:url(../fonts/manrope-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Manrope;font-weight:700;font-display:swap;src:url(../fonts/manrope-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Manrope;font-weight:800;font-display:swap;src:url(../fonts/manrope-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"Plex Arabic";font-weight:300;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-300-normal.woff2) format("woff2")}
@font-face{font-family:"Plex Arabic";font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2) format("woff2")}
@font-face{font-family:"Plex Arabic";font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2) format("woff2")}
@font-face{font-family:"Plex Arabic";font-weight:600 800;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format("woff2")}
:root{
  --ink:#04122A; --navy-900:#061A33; --navy-800:#0A2647; --navy:#0A2E5C; --navy-600:#16467F;
  --steel:#8C939B; --steel-600:#5E6670; --steel-300:#C3C9D0; --steel-100:#E3E7EB; --paper:#F3F5F7; --white:#fff;
  --c-hvac:#22A9E0; --c-fire:#D3222A; --c-water:#19B6D2; --c-plumb:#2F9E6A; --c-steel:#9AA3AD;
  --font:"Manrope","Plex Arabic",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1360px; --gut:clamp(1.25rem,4vw,3rem); --header-h:76px; --r:2px;
  --ease:cubic-bezier(.2,.7,.1,1); --ease-io:cubic-bezier(.65,0,.35,1);
}
html[lang="ar"]{--font:"Plex Arabic","Manrope",system-ui,Tahoma,sans-serif}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--font);font-size:16px;line-height:1.7;color:var(--navy-900);background:var(--white);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg,picture{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
h1,h2,h3,h4{line-height:1.12;font-weight:800;letter-spacing:-.02em}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{letter-spacing:0;line-height:1.3;font-weight:600}
.t-display{font-size:clamp(2.5rem,6.2vw,5.6rem);line-height:1.02;letter-spacing:-.035em}
html[lang="ar"] .t-display{font-size:clamp(2.2rem,5.2vw,4.6rem);line-height:1.22}
.t-h1{font-size:clamp(2.2rem,4.6vw,4rem)}
.t-h2{font-size:clamp(1.8rem,3.4vw,3rem)}
.t-h3{font-size:clamp(1.25rem,1.8vw,1.55rem);letter-spacing:-.01em}
.t-lead{font-size:clamp(1.05rem,1.35vw,1.22rem);line-height:1.75;color:var(--steel-600);max-width:62ch}
.t-small{font-size:.875rem}
.dark{background:var(--navy-900);color:#C9D2DC}
.dark h1,.dark h2,.dark h3{color:#fff}
.dark .t-lead{color:#AEB9C5}
.label{display:inline-flex;align-items:center;gap:.7rem;font-size:.82rem;font-weight:600;color:var(--navy-600);letter-spacing:.01em}
.label::before{content:"";width:28px;height:2px;background:currentColor}
.dark .label{color:var(--c-hvac)}
:focus-visible{outline:2px solid var(--c-hvac);outline-offset:3px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;top:-60px;inset-inline-start:1rem;z-index:300;background:var(--c-hvac);color:var(--ink);padding:.6rem 1rem;font-weight:700}
.skip:focus{top:1rem}
[dir=rtl] .flip-rtl{transform:scaleX(-1)}
