:root{--yellow:#ffdb00;--blue:#123fca;--black:#0b0b0a;--white:#f7f7f2;--grey:#d7d7d1;--max:1260px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;background:var(--white);color:var(--black);font-family:"IBM Plex Sans Condensed",Arial,sans-serif;font-size:18px;line-height:1.45}
a{color:inherit}
img{display:block;max-width:100%}
.wrap{width:min(var(--max),calc(100% - 48px));margin:auto}
.label{font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;font-weight:700}
.header{height:74px;background:var(--black);color:#fff;border-bottom:7px solid var(--yellow)}
.nav{height:100%;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:"Archivo Black",sans-serif;text-transform:uppercase}
.logo-mark{display:grid;grid-template-columns:repeat(3,8px);gap:3px}
.logo-mark i{height:30px;background:var(--yellow)}
.logo-mark i:nth-child(2){height:20px}
.logo-mark i:nth-child(3){height:10px}
.nav nav{display:flex;gap:28px;align-items:center}
.nav nav a{text-decoration:none;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}
.nav .contact-link{background:var(--yellow);color:var(--black);padding:10px 15px}
.hero{background:var(--yellow);min-height:720px;border-bottom:8px solid var(--black);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.18fr .82fr;min-height:720px}
.hero-copy{padding:82px 55px 70px 0;display:flex;flex-direction:column;justify-content:space-between}
.hero h1{font-family:"Archivo Black",sans-serif;text-transform:uppercase;font-size:clamp(4.4rem,9vw,9.8rem);line-height:.78;letter-spacing:-.06em;margin:22px 0}
.hero h1 span{display:block;color:var(--blue)}
.hero-lead{font-size:1.22rem;max-width:630px;border-left:12px solid var(--black);padding-left:22px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.button{display:inline-flex;min-height:52px;padding:0 20px;align-items:center;text-decoration:none;text-transform:uppercase;font-weight:700;background:var(--black);color:#fff;border:2px solid var(--black)}
.button.alt{background:transparent;color:var(--black)}
.hero-visual{position:relative;background:var(--blue);clip-path:polygon(18% 0,100% 0,100% 100%,0 100%)}
.hero-visual img{width:100%;height:100%;object-fit:cover;object-position:32% center;mix-blend-mode:multiply}
.hero-visual:after{content:"SIGNAL / GESTION";position:absolute;right:18px;bottom:20px;color:#fff;writing-mode:vertical-rl;font-size:.65rem;letter-spacing:.2em}
.board{padding:90px 0;background:var(--white)}
.board-title{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-bottom:45px}
.board h2,.routes h2,.limits h2,.contact h2{font-family:"Archivo Black",sans-serif;text-transform:uppercase;font-size:clamp(3rem,6vw,6.6rem);line-height:.86;letter-spacing:-.04em;margin:0}
.board-title p{font-size:1.2rem;max-width:600px;margin:0}
.signals{border:5px solid var(--black)}
.signal-row{display:grid;grid-template-columns:55px .75fr 1.25fr;gap:24px;align-items:center;padding:23px 25px;border-bottom:3px solid var(--black)}
.signal-row:last-child{border:0}
.lamp{width:18px;height:18px;background:var(--yellow);border:3px solid var(--black);border-radius:50%}
.signal-row:nth-child(even) .lamp{background:var(--blue)}
.signal-row h3,.signal-row p{margin:0}
.signal-row h3{text-transform:uppercase;font-size:1.25rem}
.signal-row p{color:#4c4c48}
.services{display:grid;grid-template-columns:repeat(4,1fr);border-top:6px solid var(--black);border-bottom:6px solid var(--black)}
.service{min-height:590px;padding:32px 24px;border-right:3px solid var(--black);display:flex;flex-direction:column;justify-content:space-between;transition:background .2s,color .2s}
.service:last-child{border:0}
.service:hover,.service:focus-within{background:var(--blue);color:#fff}
.service:nth-child(2){background:var(--yellow);color:var(--black)}
.service img{width:100%;height:190px;object-fit:cover;border:3px solid var(--black)}
.service h3{font-family:"Archivo Black",sans-serif;font-size:2rem;line-height:.9;text-transform:uppercase;margin:25px 0 12px}
.service p{font-size:.92rem}
.service ul{padding-left:18px;font-size:.82rem}
.switchyard{background:var(--black);color:#fff}
.switch-image{height:530px;position:relative}
.switch-image img{width:100%;height:100%;object-fit:cover}
.switch-caption{position:absolute;left:0;bottom:0;background:var(--yellow);color:var(--black);padding:28px;width:min(530px,80%)}
.switch-caption h2{font-family:"Archivo Black",sans-serif;text-transform:uppercase;font-size:2.5rem;line-height:.9;margin:0 0 10px}
.switch-caption p{margin:0}
.routes{padding:100px 0;background:var(--blue);color:white}
.routes-head{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-bottom:55px}
.routes-head p{font-size:1.15rem}
.route-map{display:grid;grid-template-columns:repeat(4,1fr);position:relative;border-top:5px solid var(--yellow)}
.route-map:after{content:"";position:absolute;top:-15px;left:0;right:0;height:25px;background:repeating-linear-gradient(90deg,transparent 0 13%,var(--yellow) 13% 15%,transparent 15% 25%)}
.route{padding:42px 22px 20px;border-right:1px solid rgba(255,255,255,.4)}
.route h3{font-size:1.3rem;text-transform:uppercase;margin:0 0 12px}
.route p{font-size:.9rem;color:#dce3ff}
.variance{padding:100px 0}
.variance-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center}
.variance img{width:100%;height:620px;object-fit:cover}
.variance-copy h2{font-family:"Archivo Black",sans-serif;text-transform:uppercase;font-size:4.6rem;line-height:.86;margin:0 0 25px}
.variance-callout{background:var(--yellow);padding:24px;margin-top:30px;border:3px solid var(--black)}
.limits{background:var(--black);color:#fff;padding:100px 0;border-top:20px repeating-linear-gradient(45deg,var(--yellow) 0 20px,var(--black) 20px 40px)}
.hazard{height:26px;background:repeating-linear-gradient(135deg,var(--yellow) 0 22px,var(--black) 22px 44px);margin-bottom:60px}
.limits-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px}
.scope-table{border:3px solid #fff}
.scope-table section{padding:28px}
.scope-table section+section{border-top:3px solid #fff;background:var(--yellow);color:var(--black)}
.scope-table h3{font-family:"Archivo Black";text-transform:uppercase;margin:0 0 18px}
.scope-table ul{display:grid;grid-template-columns:1fr 1fr;gap:10px 30px;list-style:none;padding:0}
.scope-table li{border-top:1px solid currentColor;padding-top:8px;font-size:.86rem}
.expert{margin-top:25px;border-left:10px solid var(--blue);padding:18px 22px;background:#20201d}
.modes{padding:85px 0;background:var(--grey)}
.mode-line{display:grid;grid-template-columns:180px 1fr 1fr;padding:20px 0;border-top:2px solid var(--black)}
.mode-line:last-child{border-bottom:2px solid var(--black)}
.mode-line p{margin:0}
.contact{background:var(--yellow);padding:95px 0}
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:70px}
.contact-panel{background:var(--white);border:5px solid var(--black);padding:30px;box-shadow:16px 16px 0 var(--blue)}
.contact-panel dl{margin:0}
.contact-panel dt{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;margin-top:12px}
.contact-panel dd{margin:0;font-weight:700}
.email{overflow-wrap:anywhere}
.copy{margin-top:20px;background:var(--black);color:#fff;border:0;padding:11px 16px;text-transform:uppercase;font-weight:700;cursor:pointer}
.footer{background:var(--black);color:#fff;padding:28px 0;border-top:8px solid var(--blue)}
.footer-row{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer nav{display:flex;gap:20px;flex-wrap:wrap}
.footer a{text-decoration:none;border-bottom:2px solid var(--yellow)}
.legal{background:var(--grey)}
.legal-main{width:min(920px,calc(100% - 44px));margin:auto;background:var(--white);padding:70px;margin-top:55px;margin-bottom:55px;border:5px solid var(--black);box-shadow:18px 18px 0 var(--yellow)}
.legal-main h1{font-family:"Archivo Black";text-transform:uppercase;font-size:clamp(3.3rem,7vw,6.6rem);line-height:.84;margin:0 0 30px}
.legal-main h2{font-family:"Archivo Black";text-transform:uppercase;font-size:1.55rem;margin-top:42px}
.legal-main .identity{background:var(--blue);color:white;padding:24px}
.legal-back{display:inline-block;margin-top:45px;font-weight:700}
@media(max-width:820px){.wrap{width:min(100% - 28px,var(--max))}
.variance-grid>*{min-width:0}
.variance-copy h2{overflow-wrap:anywhere}
.nav nav a:not(.contact-link){display:none}
.hero-grid,.board-title,.routes-head,.variance-grid,.limits-grid,.contact-grid{grid-template-columns:1fr}
.hero-grid{min-height:0}
.hero-copy{padding:55px 0}
.hero h1{font-size:4.6rem}
.hero-visual{height:380px;clip-path:polygon(0 13%,100% 0,100% 100%,0 100%)}
.signal-row{grid-template-columns:28px 1fr}
.signal-row p{grid-column:2}
.services{grid-template-columns:1fr}
.service{min-height:0;border-right:0;border-bottom:3px solid var(--black)}
.service img{height:250px}
.route-map{grid-template-columns:1fr 1fr}
.route:nth-child(2){border-right:0}
.route:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.4)}
.board,.routes,.variance,.limits,.contact{padding:70px 0}
.variance img{height:450px}
.scope-table ul{grid-template-columns:1fr}
.mode-line{grid-template-columns:1fr;gap:7px}
.legal-main{padding:32px 22px;margin-top:25px;box-shadow:8px 8px 0 var(--yellow)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.service{transition:none}
}

