@import url('https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,400..900&family=JetBrains+Mono:wght@500&display=swap');

:root{
  --ink:#0e0d0d;
  --ink-2:#161414;
  --ink-3:#1f1c1c;
  --line:rgba(255,255,255,.12);
  --paper:#f4f2f0;
  --mute:#9a9492;
  --red:#e3121b;
  --red-d:#b80d14;
  --wrap:1280px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--paper);font-family:'Archivo',sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 40px}
.mono{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.display{font-stretch:125%;font-weight:900;text-transform:uppercase;line-height:.92;letter-spacing:-.01em}
.red{color:var(--red)}
p{text-wrap:pretty}

/* ---------- header ---------- */
.topbar{background:var(--red);color:#fff}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:36px}
.topbar .mono{font-size:11px}
.topbar a:hover{text-decoration:underline}
header.site{position:sticky;top:0;z-index:50;background:rgba(14,13,13,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
header.site .logo img{height:52px;width:auto}
nav.main{display:flex;gap:28px;align-items:center}
header.site .logo{flex-shrink:0}
nav.main a{font-stretch:112%;font-weight:700;text-transform:uppercase;font-size:14px;letter-spacing:.04em;position:relative;padding:6px 0}
nav.main a:not(.btn)::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:3px;background:var(--red);transition:right .25s}
nav.main a:not(.btn):hover::after,nav.main a.active::after{right:0}
.menu-btn{display:none;background:none;border:1px solid var(--line);color:#fff;width:44px;height:44px;font-size:20px;cursor:pointer}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:12px;background:var(--red);color:#fff;font-stretch:115%;font-weight:800;text-transform:uppercase;font-size:14px;letter-spacing:.05em;padding:16px 26px;border:0;white-space:nowrap;cursor:pointer;transition:background .2s,transform .2s;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%)}
.btn:hover{background:var(--red-d)}
.btn .arr{display:inline-block;transition:transform .2s}
.btn:hover .arr{transform:translateX(4px)}
.btn.ghost{background:transparent;box-shadow:inset 0 0 0 2px #fff;clip-path:none}
.btn.ghost:hover{background:#fff;color:var(--ink)}
.btn.sm{padding:12px 22px;font-size:13px}

/* ---------- sections ---------- */
section{position:relative}
.sec{padding:120px 0}
.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:64px}
.sec-head h2{font-size:clamp(40px,5vw,72px)}
.sec-head p{color:var(--mute);max-width:46ch;justify-self:end}
.eyebrow{display:flex;align-items:center;gap:12px;color:var(--red);margin-bottom:22px}
.eyebrow::before{content:"";width:28px;height:3px;background:var(--red)}

/* placeholder slots */
image-slot{display:block;background:repeating-linear-gradient(135deg,#1b1818 0 14px,#211d1d 14px 28px);color:var(--mute)}

/* ---------- page hero (subpages) ---------- */
.page-hero{padding:110px 0 80px;border-bottom:1px solid var(--line);overflow:hidden}
.page-hero h1{font-size:clamp(40px,9vw,140px);overflow-wrap:anywhere;hyphens:auto}
.page-hero p{color:var(--mute);max-width:52ch;margin-top:28px;font-size:19px}
.page-hero .stripes{position:absolute;right:-40px;top:50%;transform:translateY(-50%);display:flex;gap:18px;opacity:.9}
.stripes i{display:block;width:90px;height:260px;background:var(--red);clip-path:polygon(0 0,40% 0,100% 50%,40% 100%,0 100%,60% 50%)}
.stripes i:nth-child(2){opacity:.6}.stripes i:nth-child(3){opacity:.3}

/* ---------- CTA band ---------- */
.cta-band{background:var(--red);color:#fff;overflow:hidden}
.cta-band .wrap{display:flex;justify-content:space-between;align-items:center;gap:40px;padding-top:80px;padding-bottom:80px}
.cta-band h2{font-size:clamp(36px,4.6vw,68px)}
.cta-band .phone{font-stretch:125%;font-weight:900;font-size:clamp(26px,2.6vw,38px);white-space:nowrap;border-bottom:3px solid #fff;padding-bottom:4px}
.cta-band .btn{background:var(--ink)}
.cta-band .btn:hover{background:#000}

/* ---------- footer ---------- */
footer.site{background:#080707;border-top:1px solid var(--line);padding:80px 0 32px}
footer.site .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px}
footer.site h4{font-family:'JetBrains Mono',monospace;font-weight:500;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:18px}
footer.site li{list-style:none;margin-bottom:8px;color:#cfcac8;overflow-wrap:anywhere}
footer.site li a:hover{color:#fff;text-decoration:underline}
footer.site .logo img{height:64px;width:auto;margin-bottom:18px}
footer.site .fine{display:flex;justify-content:space-between;margin-top:64px;padding-top:24px;border-top:1px solid var(--line);color:var(--mute)}
footer.site .fine a{margin-left:24px}

/* ---------- responsive ---------- */
@media (max-width:1240px){
  nav.main{display:none;position:absolute;top:84px;left:0;right:0;flex-direction:column;align-items:flex-start;background:var(--ink);padding:24px max(22px,calc((100vw - var(--wrap))/2 + 40px));border-bottom:1px solid var(--line);gap:18px}
  nav.main.open{display:flex}
  .menu-btn{display:block}
}
@media (max-width:900px){
  .wrap{padding:0 22px}
  .sec{padding:80px 0}
  .sec-head{grid-template-columns:1fr;gap:20px}
  .sec-head p{justify-self:start}
  .topbar .hide-m{display:none}
  .cta-band .wrap{flex-direction:column;align-items:flex-start}
  footer.site .cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  footer.site .fine{flex-wrap:wrap;gap:12px}
  footer.site .fine a{margin-left:0;margin-right:20px}
  .page-hero .stripes{display:none}
}