/* Self-hosted fonts (latin subset, from Google Fonts, OFL) + metric-matched fallbacks to cut layout shift */
@font-face{font-family:'Barlow Condensed';font-style:italic;font-weight:700;font-display:swap;src:url(../assets/fonts/barlowcondensed-700-italic.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url(../assets/fonts/barlowcondensed-500.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(../assets/fonts/barlowcondensed-600.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(../assets/fonts/barlowcondensed-700.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:800;font-display:swap;src:url(../assets/fonts/barlowcondensed-800.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(../assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(../assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(../assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed Fallback';src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('Arial');font-weight:100 900;size-adjust:72.96%;ascent-override:137.06%;descent-override:27.41%;line-gap-override:0%}
@font-face{font-family:'Inter Fallback';src:local('Arial'),local('ArialMT'),local('Liberation Sans');size-adjust:104.93%;ascent-override:92.33%;descent-override:22.99%;line-gap-override:0%}
/* IndeeSource site. Accent red = official logo vector fill #DE252A (from logo.ai). */
:root{
  --bg:#0a0a0b; --bg2:#111215; --panel:#16171b; --line:#26282d; --line2:#34373d;
  --text:#ececee; --muted:#9a9ea6; --metal:#c4c9d0;
  --red:#de252a; --red-hover:#c41d22; --red2:#f2464b; --red-glow:rgba(222,37,42,.38);
  --radius:4px; --wrap:1200px;
  --f-display:"Barlow Condensed","Barlow Condensed Fallback","Arial Narrow",Impact,sans-serif;
  --f-body:Inter,"Inter Fallback",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.65 var(--f-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--f-display);font-weight:700;line-height:1;margin:0 0 .5em;letter-spacing:.005em;text-transform:uppercase}
h1{font-size:clamp(2.9rem,8.5vw,6.4rem);font-weight:800;letter-spacing:-.005em;line-height:.92}
h2{font-size:clamp(2.1rem,5vw,3.6rem)}
h3{font-size:1.45rem;letter-spacing:.02em}
p{margin:0 0 1em}
.wrap{width:min(100% - 2.5rem,var(--wrap));margin-inline:auto}
.accent{color:var(--red)}
.muted{color:var(--muted)}
.skip{position:absolute;left:-999px;top:0;background:var(--red);color:#fff;padding:.6rem 1rem;z-index:100}
.skip:focus{left:1rem}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--red2);outline-offset:3px}

/* carbon fiber texture (pure CSS) */
.carbon{
  background-color:#0d0d0f;
  background-image:
    linear-gradient(180deg,rgba(10,10,11,.0),rgba(10,10,11,.55)),
    linear-gradient(27deg,#151518 5px,transparent 5px),
    linear-gradient(207deg,#151518 5px,transparent 5px),
    linear-gradient(27deg,#1b1b1f 5px,transparent 5px),
    linear-gradient(207deg,#1b1b1f 5px,transparent 5px),
    linear-gradient(90deg,#141417 10px,transparent 10px),
    linear-gradient(#18181b 25%,#131316 25%,#131316 50%,transparent 50%,transparent 75%,#1c1c20 75%,#1c1c20);
  background-size:100% 100%,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px;
  background-position:0 0,0 5px,10px 0,0 10px,10px 5px,0 0,0 0;
}

/* buttons */
.btn{--h:52px;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;height:var(--h);padding:0 1.6rem;border:1px solid transparent;border-radius:var(--radius);font:700 1.05rem/1 var(--f-display);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:transform .25s var(--ease),background .25s,border-color .25s,box-shadow .25s,color .25s;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.5;transition:transform .25s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn-primary{background:var(--red);color:#fff}
.btn-primary:hover{background:var(--red-hover);box-shadow:0 10px 30px -8px var(--red-glow);transform:translateY(-2px)}
.btn-ghost{border-color:var(--line2);color:var(--text);background:rgba(255,255,255,.02)}
.btn-ghost:hover{border-color:var(--metal);background:rgba(255,255,255,.06);transform:translateY(-2px)}
.btn-dark{background:#0a0a0b;color:#fff}
.btn-dark:hover{background:#000;transform:translateY(-2px)}
.btn-sm{--h:42px;padding:0 1.1rem;font-size:.95rem}
.btn-block{width:100%}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(10,10,11,.72);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
.site-header.scrolled{border-color:var(--line);background:rgba(10,10,11,.9)}
.header-inner{display:flex;align-items:center;gap:1rem;height:68px}
.brand{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;margin-right:auto}
.nav{display:none}
.nav a{font:600 1rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--muted);transition:color .2s}
.nav a:not(.btn):hover{color:#fff}
.nav .nav-cta{color:#fff}
.nav-toggle{width:44px;height:44px;display:grid;place-content:center;gap:5px;background:none;border:1px solid var(--line2);border-radius:var(--radius);cursor:pointer}
.nav-toggle span{width:20px;height:2px;background:#fff;transition:transform .3s,opacity .3s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.header-cta{display:none}
.nav.open{display:flex;flex-direction:column;position:absolute;top:68px;left:0;right:0;background:#0a0a0b;border-bottom:1px solid var(--line);padding:1rem 1.25rem 1.5rem;gap:0}
.nav.open a:not(.btn){padding:1rem 0;border-bottom:1px solid var(--line);font-size:1.15rem}
.nav.open .btn{margin-top:1rem}
@media (min-width:600px){.header-cta{display:inline-flex}}
@media (min-width:960px){
  .nav{display:flex;align-items:center;gap:2rem}
  .nav-toggle,.header-cta{display:none}
}

/* hero */
.hero{position:relative;overflow:hidden;padding:4.5rem 0 5rem;display:flex;align-items:center;border-bottom:1px solid var(--line)}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(1000px 520px at 85% 40%,rgba(222,37,42,.16),transparent 60%),linear-gradient(90deg,rgba(10,10,11,.92) 30%,rgba(10,10,11,.35));pointer-events:none}
.hero-lines{position:absolute;inset:-20% -10%;background:repeating-linear-gradient(-62deg,transparent 0 46px,rgba(255,255,255,.035) 46px 47px,transparent 47px 140px,rgba(222,37,42,.12) 140px 141px);mask:linear-gradient(90deg,transparent 20%,#000 70%);-webkit-mask:linear-gradient(90deg,transparent 20%,#000 70%);animation:lines 18s linear infinite}
@keyframes lines{to{transform:translateX(-160px)}}
.hero-part{position:absolute;right:-140px;bottom:-120px;width:min(80vw,620px);opacity:.38;filter:drop-shadow(0 30px 60px #000)}
@keyframes spin{to{transform:rotate(360deg)}}
.hero-inner{position:relative}
.eyebrow{display:inline-flex;align-items:center;gap:.7rem;font:600 .9rem/1 var(--f-display);letter-spacing:.24em;text-transform:uppercase;color:var(--metal);margin-bottom:1.25rem}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--red)}
.lead{font-size:clamp(1.05rem,1.6vw,1.22rem);color:#c9ccd2;max-width:40rem;margin:1.5rem 0 2.25rem}
.hero h1 .accent{background:linear-gradient(90deg,var(--red),#f2464b);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.9rem}
.hero-tags{list-style:none;padding:0;margin:3rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem 1.5rem}
.hero-tags li{font:600 .9rem/1 var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:.5rem}
.hero-tags li::before{content:"";width:6px;height:6px;background:var(--red);transform:rotate(45deg)}
@media (min-width:960px){.hero{min-height:calc(100svh - 68px);padding:5.5rem 0}.hero-part{right:-70px;top:50%;bottom:auto;transform:translateY(-50%);opacity:.85;width:500px}.hero h1{max-width:none;font-size:5.6rem}}
@media (min-width:1300px){.hero-part{right:max(-40px,calc((100vw - 1440px)/2));width:540px}}
@media (max-width:599px){.hero-part{width:300px;right:-110px;bottom:-90px;opacity:.28}}

/* trusted */
.trusted{background:linear-gradient(180deg,#0f1013,#0a0a0b);border-bottom:1px solid var(--line)}

/* sections */
.section{padding:clamp(4.5rem,9vw,7.5rem) 0;position:relative}
.section-head{max-width:52rem;margin-bottom:3.25rem}
.sub{color:var(--muted);font-size:1.05rem;margin:0}
.grid{display:grid;gap:1.25rem}

/* cards */
.card{position:relative;background:linear-gradient(180deg,#17181c,#111215);border:1px solid var(--line);border-radius:var(--radius);transition:transform .35s var(--ease),border-color .35s,box-shadow .35s}
.card::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,var(--red),transparent);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.card:hover{transform:translateY(-4px);border-color:var(--line2);box-shadow:0 24px 50px -24px #000}
.card:hover::before{transform:scaleX(1)}
.services-grid{grid-template-columns:1fr}
@media (min-width:620px){.services-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:960px){.services-grid{grid-template-columns:repeat(3,1fr)}}
.service{padding:1.9rem 1.6rem 1.6rem}
.service p{color:var(--muted);font-size:.95rem;margin:0}
@media (max-width:619px){.service{display:grid;grid-template-columns:44px 1fr;column-gap:1rem;padding:1.4rem 1.25rem}.service .icon{grid-row:span 2;width:40px;height:40px;margin:0}.service h3{margin:.35rem 0 .4rem;font-size:1.3rem}}
.icon{width:46px;height:46px;fill:none;stroke:var(--metal);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;margin-bottom:1.25rem;transition:stroke .3s,transform .3s var(--ease)}
.card:hover .icon,.why-item:hover .icon{stroke:var(--red2);transform:translateY(-2px)}

/* capabilities */
.capabilities{border-block:1px solid var(--line)}
.equip{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media (min-width:720px){.equip{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.equip{grid-template-columns:repeat(3,1fr)}}
.equip li{display:flex;gap:1.1rem;padding:1.8rem 1.6rem;background:rgba(13,13,15,.92);transition:background .3s}
.equip li:hover{background:rgba(22,23,27,.95)}
.equip-num{flex:none;width:1.6rem;font:700 1rem/1 var(--f-display);color:var(--red2);letter-spacing:.1em;padding-top:.3rem}
.equip p{color:var(--muted);font-size:.95rem}
.equip dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1rem;margin:0;font-size:.85rem}
.equip dt{color:#6f747c;text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;padding-top:.15rem}
.equip dd{margin:0;color:var(--metal);font-family:ui-monospace,Menlo,monospace}

/* timeline */
.timeline{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:s;position:relative}
.timeline li{position:relative;padding:0 0 2.2rem 4.25rem}
.timeline li::before{content:"";position:absolute;left:21px;top:44px;bottom:0;width:2px;background:linear-gradient(var(--line2),var(--line))}
.timeline li:last-child::before{display:none}
.step{position:absolute;left:0;top:0;width:44px;height:44px;display:grid;place-items:center;font:700 1rem/1 var(--f-display);background:#0a0a0b;border:2px solid var(--red);color:#fff;transform:rotate(45deg)}
.step{transform:none;box-shadow:0 0 0 6px var(--bg)}
.timeline h3{margin:.55rem 0 .4rem}
.timeline p{color:var(--muted);margin:0;font-size:.95rem}
@media (min-width:960px){
  .timeline{grid-template-columns:repeat(5,1fr);gap:1.5rem}
  .timeline li{padding:4.5rem 0 0}
  .timeline li::before{left:44px;right:-1.5rem;top:21px;bottom:auto;width:auto;height:2px;background:linear-gradient(90deg,var(--red),var(--line2))}
  .timeline li:last-child::before{display:block;right:0;background:linear-gradient(90deg,var(--red),transparent)}
  .timeline h3{margin-top:0}
}

/* CTA band */
.cta-band{background:var(--red);color:#fff;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-62deg,transparent 0 22px,rgba(0,0,0,.1) 22px 24px);mask:linear-gradient(90deg,transparent 40%,#000);-webkit-mask:linear-gradient(90deg,transparent 40%,#000)}
.cta-band-inner{position:relative;display:flex;flex-direction:column;gap:1.5rem;padding:3.25rem 0}
.cta-band h2{font-size:clamp(1.9rem,4vw,3rem);margin-bottom:.35rem}
.cta-band p{margin:0;opacity:.92;max-width:40rem}
@media (min-width:860px){.cta-band-inner{flex-direction:row;align-items:center;justify-content:space-between}}

/* why */
.why-grid{grid-template-columns:1fr}
@media (min-width:620px){.why-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.why-grid{grid-template-columns:repeat(4,1fr)}}
.why-item{padding:1.6rem 0 0;border-top:1px solid var(--line2)}
.why-item p{color:var(--muted);font-size:.95rem;margin:0}

/* work */
#work{border-block:1px solid var(--line)}
.ph-badge{display:inline-block;font:700 .72rem/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:#111;background:#f5c518;padding:.3rem .5rem;border-radius:2px;margin-right:.4rem;vertical-align:middle}
.work-grid{grid-template-columns:1fr}
@media (min-width:860px){.work-grid{grid-template-columns:repeat(3,1fr)}}
.work{overflow:hidden;display:flex;flex-direction:column}
.work-art{aspect-ratio:16/10;background-color:#0e0f12;border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.work-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.55));}
.art-1::before{content:"";position:absolute;inset:24% 16%;border:3px solid #9aa0a8;border-radius:60px 14px 60px 14px;background:linear-gradient(135deg,rgba(196,201,208,.14),rgba(196,201,208,.02))}
.art-1{background-image:radial-gradient(circle at 35% 50%,transparent 38px,#9aa0a8 39px 42px,transparent 43px),radial-gradient(circle at 70% 50%,transparent 26px,#9aa0a8 27px 30px,transparent 31px),linear-gradient(100deg,transparent 30%,rgba(222,37,42,.22) 50%,transparent 70%),repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 1px,transparent 1px 24px),repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 24px)}
.art-2{background-image:radial-gradient(circle,#2b2e33 7px,transparent 8px),linear-gradient(135deg,#1b1d21,#0e0f12);background-size:28px 28px,100% 100%}
.art-2::before{content:"";position:absolute;inset:18% 22%;border:3px solid var(--red);clip-path:polygon(0 20%,20% 0,100% 0,100% 80%,80% 100%,0 100%);background:linear-gradient(135deg,rgba(196,201,208,.18),rgba(196,201,208,.04))}
.art-3{background-image:linear-gradient(32deg,transparent 46%,#8a9098 46% 50%,transparent 50%),linear-gradient(-32deg,transparent 46%,#8a9098 46% 50%,transparent 50%),linear-gradient(90deg,transparent 18%,#b5bac1 18% 21%,transparent 21% 79%,#b5bac1 79% 82%,transparent 82%),radial-gradient(circle at 50% 50%,rgba(222,37,42,.35),transparent 30%),linear-gradient(180deg,#14161a,#0d0e10)}
.work-body{padding:1.5rem 1.5rem 1.6rem;display:flex;flex-direction:column;flex:1}
.work-tag{font:600 .75rem/1.3 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:#f5c518;margin-bottom:.8rem}
.work-body p{color:var(--muted);font-size:.95rem}
.work-meta{list-style:none;padding:0;margin:auto 0 0;display:flex;flex-wrap:wrap;gap:.4rem}
.work-meta li{font:600 .8rem/1 var(--f-display);letter-spacing:.12em;text-transform:uppercase;padding:.45rem .6rem;border:1px solid var(--line2);color:var(--metal)}

/* industries */
.ind-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.75rem}
.ind-list li{font:700 clamp(1.2rem,2.4vw,1.6rem)/1 var(--f-display);text-transform:uppercase;letter-spacing:.06em;padding:1rem 1.4rem;border:1px solid var(--line2);background:linear-gradient(180deg,#15161a,#0f1013);clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);transition:border-color .25s,color .25s,background .25s}
.ind-list li:hover{border-color:var(--red);color:#fff;background:linear-gradient(180deg,#1d1012,#120c0d)}

/* about */
.about-grid{display:grid;gap:3rem}
@media (min-width:960px){.about-grid{grid-template-columns:1.25fr 1fr;align-items:start}}
.about-grid p{color:#c9ccd2}
.team{display:grid;gap:.75rem;margin-top:2rem}
@media (min-width:620px){.team{grid-template-columns:repeat(3,1fr)}}
.person{display:flex;align-items:center;gap:.8rem;padding:.9rem;border:1px dashed var(--line2);background:rgba(10,10,11,.6)}
.avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#1e2024;color:var(--muted);font-weight:600;flex:none}
.person strong{display:block;font-size:.95rem}
.person span{font-size:.8rem;color:var(--muted)}
.location{background:rgba(13,13,15,.9);border:1px solid var(--line);padding:1.25rem}
.map{width:100%;height:auto;margin-bottom:1.25rem;border:1px solid var(--line)}
.location address{font-style:normal;line-height:1.6}
.hours{color:var(--muted);font-size:.95rem;margin:.75rem 0 1.25rem}

/* quote */
.quote{background:radial-gradient(800px 400px at 0% 0%,rgba(222,37,42,.1),transparent 60%),var(--bg)}
.quote-grid{display:grid;gap:3rem}
@media (min-width:960px){.quote-grid{grid-template-columns:1fr 1.4fr;align-items:start}.quote-intro{position:sticky;top:110px}}
.quote-intro p{color:#c9ccd2}
.contact-list{list-style:none;padding:0;margin:2rem 0 0;border-top:1px solid var(--line)}
.contact-list li{display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.contact-list span{font:600 .85rem/1.6 var(--f-display);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.contact-list a{text-decoration:none;font-weight:500}
.contact-list a:hover{color:var(--red2)}
.quote-form{background:linear-gradient(180deg,#141518,#0f1013);border:1px solid var(--line);padding:clamp(1.25rem,3vw,2.25rem);position:relative}
.quote-form::before{content:"";position:absolute;top:-1px;left:-1px;width:60px;height:60px;border-top:2px solid var(--red);border-left:2px solid var(--red)}
.form-note{font-size:.85rem;color:#e8d48a;background:rgba(245,197,24,.08);border:1px solid rgba(245,197,24,.25);padding:.75rem .9rem;margin-bottom:1.5rem}
.row{display:grid;gap:0 1rem}
@media (min-width:620px){.row{grid-template-columns:1fr 1fr}}
.field{margin:0 0 1.1rem;border:0;padding:0;min-width:0}
.field label,.field legend{display:block;font:600 .85rem/1 var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:var(--metal);margin-bottom:.55rem;padding:0}
.req{color:var(--red2)}
input,select,textarea{width:100%;background:#0a0a0b;color:var(--text);border:1px solid var(--line2);border-radius:var(--radius);padding:.85rem .9rem;font:inherit;font-size:1rem;transition:border-color .2s,box-shadow .2s}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat}
input:hover,select:hover,textarea:hover{border-color:#4a4e55}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(222,37,42,.2)}
textarea{resize:vertical;min-height:130px}
.invalid input,.invalid textarea,.invalid select{border-color:var(--red2)}
.err{display:block;color:#ff6b6b;font-size:.8rem;min-height:1em;margin-top:.3rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chips label{margin:0;cursor:pointer;font:inherit;letter-spacing:0;text-transform:none;color:var(--text)}
.chips input{position:absolute;opacity:0;width:1px;height:1px}
.chips span{display:inline-block;padding:.55rem .85rem;border:1px solid var(--line2);font-size:.9rem;border-radius:999px;transition:all .2s}
.chips label:hover span{border-color:#5a5e66}
.chips input:checked+span{background:var(--red);border-color:var(--red);color:#fff}
.chips input:focus-visible+span{outline:2px solid var(--red2);outline-offset:2px}
.drop{display:flex !important;align-items:center;gap:.9rem;padding:1.3rem 1rem !important;border:1px dashed #4a4e55;border-radius:var(--radius);cursor:pointer;font:400 .92rem/1.4 var(--f-body) !important;letter-spacing:0 !important;text-transform:none !important;color:var(--muted) !important;transition:border-color .2s,background .2s}
.drop svg{width:26px;height:26px;fill:none;stroke:var(--red2);stroke-width:2;flex:none}
.drop:hover,.drop.drag{border-color:var(--red);background:rgba(222,37,42,.05)}
.form-status{margin:1rem 0 0;font-size:.95rem;min-height:1.2em}
.form-status.ok{color:#6ee7a0}
.form-status.bad{color:#ff6b6b}

/* footer */
.site-footer{border-top:1px solid var(--line);background:#070708;padding:4rem 0 6rem}
.footer-grid{display:grid;gap:2.5rem}
@media (min-width:860px){.footer-grid{grid-template-columns:2fr 1fr 1.3fr}.site-footer{padding-bottom:2rem}}
.site-footer h3{font-size:1rem;letter-spacing:.2em;color:var(--muted);margin-bottom:1rem}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;font-size:.95rem}
.site-footer a{text-decoration:none;color:#c9ccd2}
.site-footer a:hover{color:var(--red2)}
.site-footer .muted{margin-top:1rem;max-width:22rem}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);font-size:.85rem;color:#a3a8b0}

/* mobile sticky CTA */
.mobile-cta{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:40;box-shadow:0 12px 30px -6px rgba(0,0,0,.7);transform:translateY(150%);transition:transform .35s var(--ease)}
.mobile-cta.show{transform:none}
@media (min-width:600px){.mobile-cta{display:none}}

/* reveal */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important}
  .js .reveal{opacity:1;transform:none}
}
@media (max-width:959px){.br-lg{display:none}}
@media (min-width:960px) and (max-width:1199px){.hero h1{font-size:4.6rem}.hero-part{opacity:.45;width:440px;right:-120px}.lead{max-width:34rem}}

/* ===== Fixed forged-carbon background (?bg=a|b|c|weave; default a) =====
   ONE position:fixed full-viewport layer (body::before) sits behind all content and stays put
   while the page scrolls (no background-attachment:fixed, which janks/breaks on mobile).
   Layers (top -> bottom): pointer/scroll sheen, clear-coat gloss band, readability shade, texture tile.
   Sections no longer paint their own carbon; they sit on the fixed layer as translucent dark panels. */
html[data-bg]{--mx:70%;--my:30%;--tile:720px}
html[data-bg] body{background:#09090a}
html[data-bg] body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  will-change:transform;transform:translate3d(0,0,0);
  background-color:#09090a;
  background-image:
    radial-gradient(900px 620px at var(--mx) var(--my),rgba(255,255,255,var(--sheen,.09)),transparent 62%),
    linear-gradient(112deg,transparent 28%,rgba(255,255,255,var(--gloss,.05)) 42%,rgba(255,255,255,0) 52%,transparent 70%),
    linear-gradient(180deg,rgba(6,6,7,var(--shade-t,.30)),rgba(6,6,7,var(--shade-b,.55))),
    var(--tex);
  background-size:100% 100%,100% 100%,100% 100%,var(--tile) var(--tile);
  background-repeat:no-repeat,no-repeat,no-repeat,repeat;
}
html[data-bg="a"]{--tex:url(../assets/forged-a.webp);--sheen:.08;--gloss:.05;--shade-t:.34;--shade-b:.46}
html[data-bg="b"]{--tex:url(../assets/forged-b.webp);--sheen:.14;--gloss:.08;--shade-t:.30;--shade-b:.50;--tile:1024px}
html[data-bg="c"]{--tex:url(../assets/forged-c.webp);--sheen:.08;--gloss:.04;--shade-t:.24;--shade-b:.45}
html[data-bg="c"] body::before{
  background-image:
    radial-gradient(900px 620px at var(--mx) var(--my),rgba(255,255,255,var(--sheen)),transparent 62%),
    linear-gradient(112deg,transparent 30%,rgba(222,37,42,.16) 44%,rgba(255,60,60,.06) 50%,transparent 62%),
    linear-gradient(180deg,rgba(6,6,7,var(--shade-t)),rgba(6,6,7,var(--shade-b))),
    var(--tex);
}
/* weave: the original pure-CSS weave, now on the fixed layer too */
html[data-bg="weave"] body::before{
  background-color:#0d0d0f;
  background-image:
    linear-gradient(180deg,rgba(10,10,11,.0),rgba(10,10,11,.45)),
    linear-gradient(27deg,#151518 5px,transparent 5px),linear-gradient(207deg,#151518 5px,transparent 5px),
    linear-gradient(27deg,#1b1b1f 5px,transparent 5px),linear-gradient(207deg,#1b1b1f 5px,transparent 5px),
    linear-gradient(90deg,#141417 10px,transparent 10px),
    linear-gradient(#18181b 25%,#131316 25%,#131316 50%,transparent 50%,transparent 75%,#1c1c20 75%,#1c1c20);
  background-size:100% 100%,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px;
  background-position:0 0,0 5px,10px 0,0 10px,10px 5px,0 0,0 0;
  background-repeat:no-repeat,repeat,repeat,repeat,repeat,repeat,repeat;
}
@media (max-width:599px){html[data-bg="a"],html[data-bg="c"]{--tile:560px}html[data-bg="b"]{--tile:760px}}

/* Section panels over the fixed layer. ".carbon" sections are now windows onto it (light shade only);
   every other section is a translucent dark panel (.55-.82) so the rhythm still reads. */
html[data-bg] .carbon{background:linear-gradient(180deg,rgba(8,8,9,.36),rgba(8,8,9,.5))}
html[data-bg] .section:not(.carbon){background:rgba(10,10,11,.78)}
html[data-bg] .section.why,html[data-bg] .section.industries{background:linear-gradient(180deg,rgba(10,10,11,.82),rgba(10,10,11,.66))}
html[data-bg] .section.home-faq{background:rgba(10,10,11,.72)}
html[data-bg] .section.testimonial{background:rgba(8,8,9,.42)}
html[data-bg] .quote{background:radial-gradient(800px 400px at 0% 0%,rgba(222,37,42,.1),transparent 60%),rgba(10,10,11,.82)}
html[data-bg] .trusted{background:linear-gradient(180deg,rgba(15,16,19,.82),rgba(10,10,11,.74))}
html[data-bg] .fab-show{background:rgba(11,11,13,.70)}
html[data-bg] .site-footer{background:rgba(7,7,8,.9)}
html[data-bg] .section + .section{border-top:1px solid rgba(255,255,255,.04)}
html[data-bg] #about{background:rgba(8,8,9,.62)}

/* hero: let texture show on the right, keep copy side dark for contrast */
html[data-bg] .hero::before{
  background:radial-gradient(900px 520px at 85% 45%,rgba(222,37,42,.14),transparent 60%),
    linear-gradient(90deg,rgba(8,8,9,.86) 0%,rgba(8,8,9,.74) 38%,rgba(8,8,9,.22) 75%,rgba(8,8,9,.08))}
@media (max-width:959px){
  html[data-bg] .hero::before{background:linear-gradient(180deg,rgba(8,8,9,.40),rgba(8,8,9,.70) 50%,rgba(8,8,9,.50))}
}
html[data-bg="a"] .hero-lines,html[data-bg="b"] .hero-lines{opacity:.5}
html[data-bg] #work .section-head,html[data-bg] .capabilities .section-head,html[data-bg] .testimonial .section-head{text-shadow:0 2px 18px rgba(0,0,0,.85)}

/* tiny variant switcher (only shown when ?bg= is in the URL) */
.bg-switch{position:fixed;left:1rem;bottom:1rem;z-index:60;display:flex;gap:2px;padding:4px;background:rgba(10,10,11,.85);border:1px solid var(--line2);border-radius:999px;font:600 .8rem/1 var(--f-display);letter-spacing:.1em;backdrop-filter:blur(8px)}
.bg-switch a{padding:.45rem .7rem;border-radius:999px;text-decoration:none;color:var(--muted);text-transform:uppercase}
.bg-switch a[aria-current="true"]{background:var(--red);color:#fff}
@media (max-width:599px){.bg-switch{bottom:5rem}}

/* official logo */
.brand img{display:block;height:40px;width:auto}
@media (max-width:599px){.brand img{height:30px}}
.site-footer .brand img{height:96px}

/* ===== Hero triple clamp: blueprint -> laser sweep -> machined billet -> idle float ===== */
.clamp{aspect-ratio:640/440;filter:none}
.clamp-float{position:relative;width:100%;height:100%;transform:perspective(1400px) rotateX(10deg) rotateY(-8deg);transform-origin:50% 60%;will-change:transform;
  animation:clampFloat 10s ease-in-out 3.6s infinite}
.clamp-stage{position:absolute;inset:0;overflow:visible}
.clamp-bp,.clamp-metal{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.clamp-metal{filter:drop-shadow(0 18px 30px rgba(0,0,0,.55));clip-path:inset(-12% -12% -12% -12%);
  animation:clampReveal 1.9s cubic-bezier(.65,0,.35,1) 1.5s both}
/* blueprint: draws in, then settles to a faint technical overlay */
.clamp-bp{opacity:.32;animation:bpSettle .9s ease 3.4s both}
.bp-draw{stroke-dasharray:1;stroke-dashoffset:0;animation:bpDraw 1.3s cubic-bezier(.4,0,.2,1) .15s both}
.bp-outline,.bp-dim text,.bp-grid{animation:bpFade .9s ease .3s both}
.clamp-scan{position:absolute;inset:-10% -12%;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,transparent 0,rgba(143,227,255,.0) 70%,rgba(143,227,255,.10) 94%,rgba(255,255,255,.95) 99.4%,rgba(222,37,42,.9) 100%);
  transform:translateX(0);animation:clampScan 1.9s cubic-bezier(.65,0,.35,1) 1.5s both}
.clamp-scan::after{content:"";position:absolute;right:-2px;top:0;bottom:0;width:4px;box-shadow:0 0 18px 4px rgba(222,37,42,.75),0 0 40px 10px rgba(143,227,255,.25)}
.clamp-sheen{animation:clampSheen 7s ease-in-out 3.8s infinite}
@keyframes bpDraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes bpFade{from{opacity:0}to{opacity:1}}
@keyframes bpSettle{from{opacity:1}to{opacity:.32}}
@keyframes clampReveal{from{clip-path:inset(-12% 112% -12% -12%)}to{clip-path:inset(-12% -12% -12% -12%)}}
@keyframes clampScan{0%{opacity:1;transform:translateX(-100%)}92%{opacity:1}100%{opacity:0;transform:translateX(0)}}
@keyframes clampSheen{0%{transform:skewX(-18deg) translateX(0)}55%,100%{transform:skewX(-18deg) translateX(1100px)}}
@keyframes clampFloat{0%,100%{transform:perspective(1400px) rotateX(10deg) rotateY(-8deg) translateY(0)}50%{transform:perspective(1400px) rotateX(14deg) rotateY(5deg) translateY(-12px)}}
/* clamp placement (overrides wheel sizes) */
.hero-part.clamp{opacity:1;width:min(92vw,560px);right:-150px;bottom:-40px}
@media (min-width:960px){.hero-part.clamp{width:600px;right:-90px;opacity:1}}
@media (min-width:1300px){.hero-part.clamp{width:640px;right:max(-60px,calc((100vw - 1440px)/2 - 20px))}}
@media (min-width:960px) and (max-width:1199px){.hero-part.clamp{width:520px;right:-170px;opacity:.6}}
@media (max-width:599px){.hero-part.clamp{width:340px;right:-120px;bottom:-30px;opacity:.38}}
@media (prefers-reduced-motion:reduce){.clamp-scan{display:none}.clamp-bp{opacity:.32}}

/* ===== Real hero media (photo/video) slot: see README "Swap in real hero video" ===== */
.hero-media{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-media video,.hero-media img{width:100%;height:100%;object-fit:cover;object-position:70% 50%}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,8,9,.92) 0%,rgba(8,8,9,.75) 40%,rgba(8,8,9,.25) 80%),linear-gradient(0deg,rgba(8,8,9,.7),transparent 35%)}
@media (max-width:959px){.hero-media::after{background:linear-gradient(180deg,rgba(8,8,9,.55),rgba(8,8,9,.85) 55%,rgba(8,8,9,.7))}}
.hero:has(.hero-media) .hero-inner{z-index:1}
@media (min-width:960px){.hero-part.clamp{width:580px;right:-10px}}
@media (min-width:1300px){.hero-part.clamp{width:600px;right:max(0px,calc((100vw - 1440px)/2 + 10px))}}
@media (min-width:960px) and (max-width:1199px){.hero-part.clamp{width:500px;right:-150px;opacity:.6}}
@media (prefers-reduced-motion:reduce){.hero-media video{display:none}.hero-media{background:url(../assets/video/hero-clamp-landscape-poster.jpg) 70% 50%/cover no-repeat}}

/* capabilities groups */
.cap-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media (min-width:720px){.cap-grid{grid-template-columns:repeat(2,1fr)}.cap-card:last-child{grid-column:1/-1}}
@media (min-width:1080px){.cap-grid{grid-template-columns:repeat(6,1fr)}.cap-card{grid-column:span 2}.cap-card:nth-child(4),.cap-card:nth-child(5){grid-column:span 3}}
.cap-card{background:rgba(13,13,15,.92);padding:1.8rem 1.6rem 1.9rem;transition:background .3s}
.cap-card:hover{background:rgba(22,23,27,.95)}
.cap-card header{display:flex;align-items:baseline;gap:.9rem;margin-bottom:1.1rem}
.cap-card h3{margin:0}
.cap-list{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.cap-list li{display:flex;align-items:center;gap:.7rem;color:#c9ccd2;font-size:1rem}
.cap-list li::before{content:"";width:7px;height:7px;flex:none;background:var(--red);transform:rotate(45deg)}
.sw-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.sw-list li{font:700 1.15rem/1 var(--f-display);letter-spacing:.06em;text-transform:uppercase;padding:.7rem 1rem;border:1px solid var(--line2);background:linear-gradient(180deg,#1a1b1f,#111215);background-clip:padding-box;color:#e6e8eb}
.sw-list li:hover{border-color:var(--metal)}

/* ===== nav tabs + linked service cards ===== */
.nav .nav-tab{position:relative;color:#e6e8eb}
.nav .nav-tab::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;background:var(--red);transform:scaleX(0);transition:transform .25s var(--ease)}
.nav .nav-tab:hover::after,.nav .nav-tab[aria-current="page"]::after{transform:scaleX(1)}
.nav a[aria-current="page"]{color:#fff}
@media (min-width:960px) and (max-width:1179px){.nav{gap:1.15rem}.nav a{font-size:.92rem;letter-spacing:.1em}}
.card-link{text-decoration:none;color:inherit}
.card-link::after{content:"";position:absolute;inset:0;z-index:1}
.card-link:focus-visible{outline:none}
.card:has(.card-link:focus-visible){outline:2px solid var(--red2);outline-offset:3px}
.card-cta{display:inline-block;margin-top:1rem;font:700 .9rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:var(--red2);transition:transform .25s var(--ease)}
.card:hover .card-cta{transform:translateX(4px)}
@media (max-width:619px){.service .card-cta{grid-column:2}}

/* ===== Instant quote vs. project CTAs ===== */
.cta-hint{margin:1.4rem 0 0;max-width:40rem;font-size:.9rem;color:var(--muted);line-height:1.6}
.cta-hint strong{color:#d7dade;font-weight:600}
.cta-hint a{color:var(--red2);text-decoration:none;white-space:nowrap}
.cta-hint a:hover{text-decoration:underline}
.band-ctas{display:flex;flex-wrap:wrap;gap:.75rem}
.btn-outline-light{border-color:rgba(255,255,255,.7);color:#fff;background:transparent}
.btn-outline-light:hover{background:#fff;color:#111;transform:translateY(-2px)}
.instant-card{display:grid;gap:.35rem;margin:1.75rem 0 .5rem;padding:1.1rem 1.25rem;border:1px solid var(--line2);border-left:3px solid var(--red);background:linear-gradient(90deg,rgba(222,37,42,.10),rgba(255,255,255,.02));text-decoration:none;transition:border-color .25s,background .25s,transform .25s var(--ease)}
.instant-card:hover{border-color:var(--red);transform:translateY(-2px)}
.ic-k{font:600 .78rem/1 var(--f-display);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.ic-t{display:flex;align-items:center;gap:.5rem;font:700 1.35rem/1.1 var(--f-display);text-transform:uppercase;letter-spacing:.03em;color:#fff}
.ic-t svg{width:18px;height:18px;fill:none;stroke:var(--red2);stroke-width:2.5;transition:transform .25s var(--ease)}
.instant-card:hover .ic-t svg{transform:translateX(4px)}
.ic-s{font-size:.85rem;color:var(--muted)}

/* ===== Service landing pages (cnc-machining.html, 3d-printing.html) ===== */
.sub-hero{min-height:auto !important;padding:4.5rem 0 4.5rem !important}
.sub-hero-grid{position:relative;display:grid;gap:2.5rem;align-items:center}
@media (min-width:960px){.sub-hero-grid{grid-template-columns:1.35fr .9fr;gap:4rem}.sub-hero{padding:6rem 0 !important}}
.sub-hero h1{font-size:clamp(2.8rem,7.5vw,5.4rem) !important;max-width:none}
.btn-lg{--h:58px;padding:0 1.9rem;font-size:1.12rem}
.spec-panel{position:relative;background:rgba(10,10,11,.78);border:1px solid var(--line2);padding:1.6rem 1.6rem 1.4rem;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.spec-panel::before{content:"";position:absolute;top:-1px;left:-1px;width:56px;height:56px;border-top:2px solid var(--red);border-left:2px solid var(--red)}
.spec-k{font:600 .8rem/1 var(--f-display);letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-bottom:1rem}
.spec-panel ul{list-style:none;margin:0 0 1.2rem;padding:0}
.spec-panel li{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;padding:.85rem 0;border-bottom:1px solid var(--line)}
.spec-panel li span{font:600 .85rem/1 var(--f-display);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.spec-panel li strong{font:700 1.2rem/1.15 var(--f-display);text-transform:uppercase;letter-spacing:.03em;text-align:right;color:#f0f1f3}
.spec-link{display:inline-flex;align-items:center;gap:.5rem;font:700 .95rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:var(--red2);text-decoration:none}
.spec-link svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.5;transition:transform .25s var(--ease)}
.spec-link:hover svg{transform:translateX(4px)}
@media (min-width:1080px){.cap-grid-6 .cap-card{grid-column:span 2}.cap-grid-6 .cap-card:nth-child(4),.cap-grid-6 .cap-card:nth-child(5){grid-column:span 2}
  .cap-grid-3{grid-template-columns:repeat(3,1fr)}.cap-grid-3 .cap-card{grid-column:auto}}
@media (min-width:720px) and (max-width:1079px){.cap-grid-6 .cap-card:last-child{grid-column:auto}.cap-grid-3 .cap-card:last-child{grid-column:1/-1}}
.mat-list li{font-size:1rem;padding:.55rem .8rem}
.how-steps{list-style:none;margin:0;padding:0;display:grid;gap:1.25rem;counter-reset:h}
@media (min-width:860px){.how-steps{grid-template-columns:repeat(3,1fr)}}
.how-steps li{position:relative;padding:2rem 1.6rem 1.7rem;border:1px solid var(--line);background:linear-gradient(180deg,#16171b,#101114);overflow:hidden}
.how-steps li p{color:var(--muted);margin:0;font-size:.95rem}
.how-n{position:absolute;right:.9rem;top:-.6rem;font:800 6.5rem/1 var(--f-display);color:rgba(255,255,255,.045);pointer-events:none}
.how-steps .icon{stroke:var(--red2)}
.tips-grid{display:grid;gap:2rem}
@media (min-width:960px){.tips-grid{grid-template-columns:1fr 1.5fr;align-items:start}}
.tip-list{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.tip-list li{display:flex;gap:1rem;padding:1.4rem 1.4rem;background:rgba(13,13,15,.92)}
.tip-list svg{width:26px;height:26px;flex:none;fill:none;stroke:var(--red2);stroke-width:2.5;margin-top:.1rem}
.tip-list h3{font-size:1.25rem;margin-bottom:.3rem}
.tip-list p{margin:0;color:#c9ccd2;font-size:.95rem}
.faq-wrap{max-width:900px}
.faq{border-top:1px solid var(--line2)}
.faq details{border-bottom:1px solid var(--line2)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.2rem 0;font:700 1.3rem/1.2 var(--f-display);text-transform:uppercase;letter-spacing:.03em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 1.8rem/1 var(--f-body);color:var(--red2);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:#fff}
.faq-a p{color:#c9ccd2;margin:0 0 1.3rem;max-width:44rem}
.faq-a a{color:#fff;text-decoration:underline;text-decoration-color:var(--red2);text-underline-offset:3px}.faq-a a:hover{color:var(--red2)}
.cross{padding:3.5rem 0}
.cross-card{display:grid;gap:.5rem;padding:1.6rem 1.8rem;border:1px solid var(--line2);background:rgba(10,10,11,.8);text-decoration:none;transition:border-color .25s,transform .25s var(--ease)}
.cross-card:hover{border-color:var(--red);transform:translateY(-2px)}
.cross-card .ic-t{font-size:clamp(1.3rem,2.6vw,1.9rem)}
.tips-grid .section-head{margin-bottom:0}
.how-steps li::before{content:"";position:absolute;left:0;top:0;height:2px;width:48px;background:var(--red)}
@media (min-width:620px){.service{display:flex;flex-direction:column}.service .card-cta{margin-top:auto;padding-top:1.1rem}.service p{margin-bottom:0}}

/* =========================================================
   REAL SHOP MEDIA (video loops + photos)
   ========================================================= */
/* Hero video: mobile = full-bleed background, desktop = framed panel on the right */
.hero-video{position:absolute;inset:0;margin:0;z-index:0;overflow:hidden;background:#08080a}
.hero-video video{width:100%;height:100%;object-fit:cover;object-position:50% 26%;display:block}
.hero-video::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,8,9,.50) 0%,rgba(8,8,9,.70) 38%,rgba(8,8,9,.90) 62%,rgba(8,8,9,.97) 100%)}
.hv-cap{display:none}
.hero-inner{z-index:1}
@media (min-width:960px){
  .hero-video{inset:auto;top:50%;right:max(1.25rem,calc((100vw - 1200px)/2));transform:translateY(-50%);
    width:min(36vw,440px);aspect-ratio:4/5;border:1px solid var(--line2);border-radius:var(--radius);
    box-shadow:0 40px 90px -30px #000,0 0 0 1px rgba(255,255,255,.02) inset}
  .hero-video video{object-position:50% 30%}
  .hero-video::after{background:linear-gradient(180deg,rgba(8,8,9,0) 55%,rgba(8,8,9,.55) 100%),
    radial-gradient(120% 90% at 50% 40%,transparent 55%,rgba(8,8,9,.45) 100%)}
  .hero-video::before{content:"";position:absolute;z-index:2;left:-1px;top:-1px;width:44px;height:44px;
    border-left:2px solid var(--red);border-top:2px solid var(--red);pointer-events:none}
  .hv-cap{display:flex;align-items:center;gap:.55rem;position:absolute;z-index:2;left:1rem;bottom:.9rem;
    font:600 .72rem/1 var(--f-display);letter-spacing:.18em;text-transform:uppercase;color:#d9dce1}
  .hv-dot{width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(222,37,42,.18)}
  .hero h1,.hero .lead,.hero .cta-hint{max-width:min(46rem,calc(100vw - 560px))}
}
@media (min-width:960px) and (max-width:1199px){.hero-video{width:min(32vw,360px)}.hero h1{font-size:4.2rem}}
@media (prefers-reduced-motion:no-preference){.hero-video video{animation:hvIn 1.2s var(--ease) both}}
@keyframes hvIn{from{opacity:0}to{opacity:1}}

/* Service cards with a real photo behind the content */
.service.has-photo{overflow:hidden;isolation:isolate}
.svc-photo{position:absolute;inset:0;z-index:-1;border-radius:inherit;overflow:hidden}
.svc-photo img{width:100%;height:100%;object-fit:cover;opacity:.52;transform:scale(1.02);transition:opacity .5s var(--ease),transform .8s var(--ease)}
.svc-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,15,18,.35),rgba(14,15,18,.78) 45%,rgba(14,15,18,.94) 80%)}
.service.has-photo:hover .svc-photo img{opacity:.68;transform:scale(1.07)}
.service.has-photo p{color:#c3c7ce}

/* Case-study photos */
.work-art.has-photo picture,.work-art.has-photo img{display:block;width:100%;height:100%}
.work-art.has-photo img{object-fit:cover;transition:transform .8s var(--ease)}
.work:hover .work-art.has-photo img{transform:scale(1.04)}

/* Fabrication & welding showcase */
.fab-show{background:#0b0b0d;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fab-grid{display:grid;gap:2.5rem;align-items:center}
@media (min-width:960px){.fab-grid{grid-template-columns:1fr 1fr;gap:4rem}}
.fab-points{list-style:none;margin:1.2rem 0;padding:0;display:grid;gap:.55rem}
.fab-points li{position:relative;padding-left:1.4rem;color:#c9ccd2}
.fab-points li::before{content:"";position:absolute;left:0;top:.62em;width:.7rem;height:2px;background:var(--red)}
.fab-loops{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.fab-copy .btn{margin-top:.5rem}
.loop-tile{margin:0;position:relative;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#0e0f12}
.loop-tile video{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.loop-tile figcaption,.reel figcaption{position:absolute;left:.8rem;bottom:.7rem;font:600 .7rem/1 var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:#e4e6ea;text-shadow:0 1px 8px #000}


/* Shop reel (About) */
.reel{margin:0 0 1.25rem;position:relative;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#0e0f12}
.reel video{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.reel-toggle{position:absolute;right:.7rem;bottom:.7rem;width:40px;height:40px;border-radius:50%;border:1px solid var(--line2);
  background:rgba(8,8,9,.72);cursor:pointer;display:grid;place-items:center}
.reel-toggle span{width:12px;height:14px;border-left:4px solid #fff;border-right:4px solid #fff}
.reel-toggle[aria-pressed="true"] span{width:0;height:0;border:0;border-left:13px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:3px}
.reel-toggle:hover{border-color:var(--red2)}
@media (min-width:960px){.about-grid .location .reel{max-width:420px}}

/* CNC page: machining footage behind the sub-hero */
.sub-hero .sub-video{position:absolute;inset:0;z-index:0;overflow:hidden}
.sub-hero .sub-video video{width:100%;height:100%;object-fit:cover;object-position:60% 50%;opacity:.9}
.sub-hero .sub-video::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,8,9,.94) 0%,rgba(8,8,9,.80) 38%,rgba(8,8,9,.25) 72%,rgba(8,8,9,.35) 100%),linear-gradient(0deg,rgba(8,8,9,.8),transparent 35%)}
@media (max-width:959px){.sub-hero .sub-video::after{background:linear-gradient(180deg,rgba(8,8,9,.75),rgba(8,8,9,.92))}}
.sub-hero .sub-hero-grid{z-index:1}
.media-strip{display:grid;gap:1rem}
@media (min-width:860px){.media-strip{grid-template-columns:1.6fr 1fr}}
.media-strip figure{margin:0;position:relative;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#0e0f12}
.media-strip video,.media-strip img{display:block;width:100%;height:100%;object-fit:cover}
.media-strip .ms-wide video{aspect-ratio:16/9}
.media-strip figcaption{position:absolute;left:.8rem;bottom:.7rem;font:600 .7rem/1 var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:#e4e6ea;text-shadow:0 1px 8px #000}

/* ===== Case studies (home #work + work.html) ===== */
.stat-art{display:flex;flex-direction:column;justify-content:flex-end;padding:1.4rem 1.5rem;background:
  radial-gradient(420px 260px at 85% 15%,rgba(222,37,42,.28),transparent 65%),
  linear-gradient(135deg,rgba(22,23,27,.92),rgba(10,10,11,.96))}
.stat-art::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-35deg,transparent 0 22px,rgba(255,255,255,.025) 22px 23px)}
.stat-art::after{display:none}
.stat-big{position:relative;font:700 clamp(3rem,6vw,4.4rem)/.9 var(--f-display);letter-spacing:.01em;text-transform:uppercase;color:#fff}
.stat-big small{display:block;font:600 .9rem/1.4 var(--f-display);letter-spacing:.18em;color:var(--red);margin-top:.4rem}
.stat-cap{position:relative;margin-top:.7rem;font-size:.9rem;color:var(--metal)}
.work .work-tag{color:var(--red)}
.work h3 .card-link{color:inherit;text-decoration:none}
.work h3 .card-link::after{content:"";position:absolute;inset:0}
.work{position:relative}
.work h3 .card-link:focus-visible{outline:none}
.work:has(.card-link:focus-visible){outline:2px solid var(--red);outline-offset:3px}
.shop-floor-title{margin:3rem 0 1rem;font:600 .85rem/1 var(--f-display);letter-spacing:.2em;text-transform:uppercase;color:var(--metal)}
.shop-grid{grid-template-columns:1fr;gap:1rem}
@media (min-width:600px){.shop-grid{grid-template-columns:repeat(3,1fr)}}
.shop-tile{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--line);text-decoration:none;color:#fff}
.shop-tile picture,.shop-tile img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.shop-tile:hover img{transform:scale(1.04)}
.shop-tile span{position:absolute;left:0;right:0;bottom:0;padding:2.4rem 1rem .9rem;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.82) 48%,rgba(0,0,0,.9));text-shadow:0 1px 8px rgba(0,0,0,.8);font-size:.85rem;color:#d6d8dc}
.shop-tile strong{display:block;font:600 1.05rem/1.2 var(--f-display);letter-spacing:.04em;text-transform:uppercase;color:#fff}
.work-more{margin-top:2rem;text-align:center}

/* testimonial */
.review-grid{display:grid;gap:1.4rem;grid-template-columns:1fr;align-items:stretch}
@media (min-width:900px){.review-grid{grid-template-columns:1fr 1fr;gap:1.6rem}}
.review-card{margin:0;max-width:none;height:100%;display:flex;flex-direction:column;padding:2.4rem 2rem 2rem;position:relative;background:linear-gradient(180deg,rgba(18,19,22,.9),rgba(10,10,11,.92));border:1px solid var(--line2);border-left:4px solid var(--red);box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.review-card::before{content:"\201C";position:absolute;right:1.4rem;top:-.6rem;font:700 7rem/1 Georgia,serif;color:rgba(222,37,42,.35)}
.review-card .stars{display:flex;gap:.25rem;margin-bottom:1rem}
.review-card .stars svg{width:22px;height:22px;fill:var(--red)}
.review-card blockquote{margin:0;flex:1 1 auto}
.review-card blockquote p{font-size:clamp(1.05rem,1.6vw,1.25rem);line-height:1.7;color:#eceef1;margin:0}.review-card blockquote p+p{margin-top:.85rem}
.review-card figcaption{margin-top:1.3rem;font:500 .95rem/1.4 var(--f-body);letter-spacing:.02em;color:var(--metal)} /* stacked cards push caption down via flex */
.review-card figcaption .who{color:#fff;font-weight:600}
.testimonial .section-head{text-align:center;margin-left:auto;margin-right:auto}

/* work.html */
.work-filters{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 2rem}
.work-filters button{font:600 .8rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;padding:.65rem .9rem;background:rgba(10,10,11,.7);color:var(--metal);border:1px solid var(--line2);cursor:pointer}
.work-filters button[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}
.case{display:grid;gap:2rem;padding:2.2rem;margin-bottom:1.6rem;background:rgba(12,12,14,.84);border:1px solid var(--line);scroll-margin-top:90px}
.case[hidden]{display:none}
@media (min-width:960px){.case{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}}
.case-media{position:relative;overflow:hidden;border:1px solid var(--line)}
.case-media img{display:block;width:100%;height:auto}
.case-media.stat-art{aspect-ratio:4/3;min-height:240px}
.case h2{font-size:clamp(1.6rem,3vw,2.3rem);margin:.2rem 0 .6rem}
.case .lead-in{color:#e6e8eb;font-size:1.08rem}
.case h3{font:600 .85rem/1 var(--f-display);letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin:1.6rem 0 .6rem}
.case p,.case li{color:var(--muted)}
.case ul.did{padding-left:1.1rem;margin:0}
.case ul.did li{margin:.3rem 0}
.case .caps{margin-top:1.4rem;font-size:.9rem;color:var(--metal)}
.case .caps strong{color:#fff;font-weight:600}
.case-compact{grid-template-columns:1fr}
@media (min-width:960px){.case-compact{grid-template-columns:minmax(0,6fr) minmax(0,6fr)}}
#product-development,#reverse-engineering{scroll-margin-top:90px}
.work-hero-inner{position:relative;z-index:1}
.sub-hero .work-hero-inner .lead{max-width:44rem}

/* client logo strip: official logos, white monochrome, optically balanced (--h per logo) */
html[data-bg] .trusted{background:linear-gradient(180deg,rgba(12,12,14,.86),rgba(9,9,10,.8));border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.trusted-inner{display:flex;flex-direction:column;align-items:center;gap:1.6rem;padding:2.4rem 0 2.2rem;text-align:center}
.trusted-label{display:flex;align-items:center;gap:.9rem;margin:0;font:600 .82rem/1 var(--f-display);letter-spacing:.28em;text-transform:uppercase;color:var(--metal)}
.trusted-label::before,.trusted-label::after{content:"";width:2.2rem;height:2px;background:var(--red)}
.logo-strip{list-style:none;margin:0;padding:0;width:100%;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.4rem 2rem}
.logo-strip li{position:relative;display:flex;align-items:center;justify-content:center;height:64px;padding:0 .2rem}
.logo-strip img{display:block;height:calc(var(--h) * 1px);width:auto;opacity:.6;transition:opacity .3s var(--ease),filter .3s var(--ease)}
.logo-strip li::after{content:"";position:absolute;left:15%;right:15%;bottom:0;height:2px;background:#DE252A;transform:scaleX(0);transition:transform .3s var(--ease)}
.logo-strip li:hover img{opacity:1;filter:drop-shadow(0 0 10px rgba(222,37,42,.35))}
.logo-strip li:hover::after{transform:scaleX(1)}
@media (max-width:959px){
  .logo-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem .6rem;justify-items:center}
  .logo-strip li{height:58px;width:100%}
  .logo-strip img{height:calc(var(--h) * .74px);max-width:100%;object-fit:contain}
}
@media (prefers-reduced-motion:reduce){.logo-strip img,.logo-strip li::after{transition:none}}
@media (min-width:1200px){.logo-strip img{height:calc(var(--h) * 1.12px)}.trusted-label{font-size:.9rem}}
@media (max-width:599px){.trusted-label{font-size:.74rem;letter-spacing:.2em;gap:.6rem;white-space:nowrap}.trusted-label::before,.trusted-label::after{width:1.1rem}}
@media (min-width:960px){.logo-strip{flex-wrap:nowrap;gap:1rem 1.25rem}.logo-strip li{padding:0;flex:0 1 auto;min-width:0}.logo-strip img{max-width:100%}}

/* MotoBase case media: main photo + secondary, captions in the site's overlay caption style */
.case-media-stack{display:grid;gap:1rem;align-content:start}
.case-fig{margin:0}
.case-fig figcaption{position:absolute;left:0;right:0;bottom:0;padding:2.2rem .9rem .75rem;font:600 .72rem/1.35 var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:#e4e6ea;text-shadow:0 1px 8px #000;background:linear-gradient(180deg,transparent,rgba(0,0,0,.72))}
@media (min-width:600px) and (max-width:959px){.case-media-stack{grid-template-columns:1.6fr 1fr}}
@media (min-width:960px){.case-fig-2{max-width:62%}}
.mb-art img{object-position:50% 58%}
/* triple clamp loop (replaces the skewed still): centered crop at every width */
.shop-tile-video video,.case-video video{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.case-video{aspect-ratio:16/10}
.media-strip .ms-tall video{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 0%}
/* testimonial attribution with the reviewer's company logo */
.review-card figcaption{display:flex;align-items:center;gap:.8rem}
.review-logo{height:30px;width:auto;opacity:.85}
.review-ig{color:#fff;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;text-decoration-color:var(--red2)}
.review-ig:hover{color:var(--red2)}


/* ===== Pure carbon (owner, Oct 2026): no section bands, overlays or band hairlines on any page.
   Sections are transparent windows onto the fixed carbon layer; separation comes from spacing.
   Only cards / functional containers keep a (light) surface. ===== */
html[data-bg] .section,html[data-bg] .section:not(.carbon),html[data-bg] .carbon,html[data-bg] .section.why,html[data-bg] .section.industries,
html[data-bg] .section.home-faq,html[data-bg] .section.testimonial,html[data-bg] .quote,html[data-bg] .trusted,html[data-bg] .fab-show,
html[data-bg] #about,html[data-bg] .hero,html[data-bg] .sub-hero,html[data-bg] .site-footer,html[data-bg] .cta-band{
  background:none!important;border-top:0!important;border-bottom:0!important}
html[data-bg] .section + .section{border-top:0}
html[data-bg] .hero::before{content:none!important}
html[data-bg] .hero-lines{display:none}
/* the darker fixed layer carries legibility (evenly, whole page) */
html[data-bg="a"]{--sheen:.06;--gloss:.035;--shade-t:.52;--shade-b:.58}
html[data-bg="b"]{--sheen:.08;--gloss:.05;--shade-t:.56;--shade-b:.62}
html[data-bg="c"]{--sheen:.06;--gloss:.03;--shade-t:.52;--shade-b:.58}
/* soft shadow under copy so it reads on bright flakes */
html[data-bg] main p,html[data-bg] main li,html[data-bg] main h1,html[data-bg] main h2,html[data-bg] main h3,html[data-bg] .site-footer p,html[data-bg] .site-footer li,html[data-bg] .eyebrow,html[data-bg] .trusted-label{text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 14px rgba(0,0,0,.75)}
/* extra spacing replaces the bands */
html[data-bg] .section{padding-top:clamp(4.5rem,8vw,7.5rem);padding-bottom:clamp(4.5rem,8vw,7.5rem)}
html[data-bg] .trusted-inner{padding:3rem 0 1rem}
html[data-bg] .site-footer{padding-top:5rem}
/* CTA: a contained red card instead of a full-width band */
html[data-bg] .cta-band{overflow:visible;padding:clamp(2rem,5vw,4rem) 0}
html[data-bg] .cta-band::before{content:none}
html[data-bg] .cta-band-inner{background:var(--red);border-radius:var(--radius);padding:2.4rem clamp(1.4rem,4vw,3rem);box-shadow:0 30px 60px -30px rgba(0,0,0,.8);overflow:hidden}
html[data-bg] .cta-band-inner::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-62deg,transparent 0 22px,rgba(0,0,0,.1) 22px 24px);-webkit-mask:linear-gradient(90deg,transparent 40%,#000);mask:linear-gradient(90deg,transparent 40%,#000);pointer-events:none}
html[data-bg] .cta-band-inner>*{position:relative}
html[data-bg] .cta-band p,html[data-bg] .cta-band h2{text-shadow:none}
/* full-bleed hero videos (photo content) melt into the carbon instead of ending on a hard edge */
.sub-hero .sub-video{-webkit-mask:linear-gradient(180deg,transparent 0,#000 12%,#000 78%,transparent 100%);mask:linear-gradient(180deg,transparent 0,#000 12%,#000 78%,transparent 100%)}
@media (max-width:959px){.hero .hero-video{-webkit-mask:linear-gradient(180deg,#000 0,#000 70%,transparent 100%);mask:linear-gradient(180deg,#000 0,#000 70%,transparent 100%);background:none}}
/* functional containers: lighter, never full width */
html[data-bg] .card,html[data-bg] .cap-card,html[data-bg] .faq details,html[data-bg] .review-card,html[data-bg] .case{background:rgba(14,15,18,.62);border-color:rgba(255,255,255,.08)}
html[data-bg] .review-card{background:linear-gradient(180deg,rgba(20,21,24,.72),rgba(12,12,14,.72))}

/* ===== Blueprint illustrations (confidential e-moto case studies) ===== */
.bp-fig{margin:0;position:relative;display:flex;flex-direction:column;background:none!important;border:1px solid rgba(213,220,228,.14);border-radius:var(--radius);overflow:hidden}
.bp-fig::before,.bp-fig::after{content:none!important}
.bp-art{display:block;width:100%;height:auto;flex:1 1 auto}
.bp-note{padding:.55rem .9rem .7rem;font:600 .7rem/1.3 var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:#aeb6c0;border-top:1px solid rgba(213,220,228,.1)}
.work-art.bp-fig{aspect-ratio:auto;min-height:0}
.case-media.bp-fig{aspect-ratio:auto;min-height:0;align-self:start}
/* stroke-draw on scroll-in (cards are .reveal; JS adds .in). Off for reduced motion and no-JS. */
@media (prefers-reduced-motion:no-preference){
  html.js .reveal .bp-art .bp-line{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s cubic-bezier(.4,0,.2,1) .15s}
  html.js .reveal .bp-art .bp-fade,html.js .reveal .bp-art text,html.js .reveal .bp-art .bp-callout circle,html.js .reveal .bp-art .bp-title rect{opacity:0;transition:opacity .8s ease 1.1s}
  html.js .reveal.in .bp-art .bp-line{stroke-dashoffset:0}
  html.js .reveal.in .bp-art .bp-fade,html.js .reveal.in .bp-art text,html.js .reveal.in .bp-art .bp-callout circle,html.js .reveal.in .bp-art .bp-title rect{opacity:1}
}
.work-art.bp-fig{aspect-ratio:16/10;border:0;border-bottom:1px solid var(--line);border-radius:0}
.work-art.bp-fig .bp-art{min-height:0;height:100%}
.work-art.bp-fig .bp-note{padding:.4rem .9rem .5rem;font-size:.64rem}
/* contact form honeypot: off-screen, not display:none (some bots skip hidden fields) */
.hp-field{position:absolute!important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.form-status a{color:#fff;text-decoration:underline}
.btn[disabled]{opacity:.7;cursor:progress}

/* ===== B2B line, who-we-work-with row ===== */
.hero-for{margin:1rem 0 0;font:600 clamp(1rem,1.5vw,1.15rem)/1.4 var(--f-display);letter-spacing:.06em;text-transform:uppercase;color:#f1f2f4}
.hero-for + .lead{margin-top:.9rem}
.who-row{padding:1.5rem 0 0}
.who-label{font:600 .78rem/1 var(--f-display);letter-spacing:.2em;text-transform:uppercase;color:#aeb4bd;text-align:center;margin:0 0 1rem}
.who-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 1.8rem}
.who-list li{display:flex;align-items:center;gap:.55rem;font:600 1rem/1.2 var(--f-display);letter-spacing:.04em;color:#e4e6ea;text-transform:uppercase}
.who-list svg{width:20px;height:20px;fill:none;stroke:var(--red2);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:600px){.who-list{display:grid;grid-template-columns:1fr 1fr;gap:.8rem 1rem;justify-items:start;max-width:22rem;margin:0 auto}.who-list li{font-size:.86rem}}

/* ===== form: confidentiality note, NDA checkbox, consent ===== */
.file-note{display:flex;gap:.55rem;align-items:flex-start;margin:.7rem 0 0;font-size:.86rem;line-height:1.5;color:#c2c6cd}
.file-note svg{flex:none;width:18px;height:18px;margin-top:.1rem;fill:none;stroke:var(--red2);stroke-width:1.8;stroke-linejoin:round}
.file-note a{color:#fff;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.check-line{display:flex;gap:.7rem;align-items:flex-start;margin:0 0 1.2rem;padding:.85rem 1rem;border:1px solid var(--line2);border-radius:var(--radius);cursor:pointer;font:inherit;letter-spacing:0;text-transform:none;color:var(--text);font-size:.95rem}
.check-line input{width:18px;height:18px;flex:none;margin-top:.15rem;accent-color:var(--red)}
.check-line:hover{border-color:#5a5e66}
.form-consent{margin:.8rem 0 0;font-size:.82rem;color:#aeb4bd;text-align:center}
.form-consent a{color:#fff;text-decoration:underline}
.footer-legal{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}
.footer-legal a{color:inherit}
.footer-legal a:hover{color:#fff}

/* ===== confidentiality strip (CNC / 3D printing pages) ===== */
.conf-strip{padding:0 0 clamp(2rem,5vw,3.5rem)}
.conf-strip-inner{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.2rem;margin:0;padding:1.1rem 1.3rem;border:1px solid rgba(213,220,228,.16);border-left:3px solid var(--red);border-radius:var(--radius);background:rgba(14,15,18,.62);color:#d4d7dc;font-size:.95rem}
.conf-strip-inner svg{width:22px;height:22px;flex:none;fill:none;stroke:var(--red2);stroke-width:1.8;stroke-linejoin:round}
.conf-strip-inner span{flex:1 1 22rem}
.conf-strip-inner a{color:#fff;text-decoration:underline}
.conf-strip-inner .conf-link{text-decoration:none;font:600 .82rem/1 var(--f-display);letter-spacing:.12em;text-transform:uppercase;display:inline-flex;gap:.4rem;align-items:center;white-space:nowrap}
.conf-strip-inner .conf-link svg{width:16px;height:16px;stroke:currentColor;stroke-width:2}

/* ===== doc pages (confidentiality / privacy / terms) ===== */
.doc-hero h1{max-width:20ch}
.doc-grid{display:grid;gap:2rem}
@media (min-width:960px){.doc-grid{grid-template-columns:240px 1fr;gap:3.5rem;align-items:start}.doc-toc{position:sticky;top:110px}}
.doc-toc ol{margin:.6rem 0 0;padding-left:1.2rem;display:grid;gap:.45rem;font-size:.92rem}
.doc-toc a{color:#c9ccd2}.doc-toc a:hover{color:#fff}
.doc-body{max-width:46rem}
.doc-sec{padding:0 0 2rem;margin:0 0 2rem;border-bottom:1px solid rgba(255,255,255,.07)}
.doc-sec:last-child{border-bottom:0}
.doc-sec h2{font-size:clamp(1.4rem,2.4vw,1.85rem);margin:0 0 .8rem}
.doc-sec p,.doc-sec li{color:#d0d3d8;line-height:1.7}
.doc-sec ul{padding-left:1.2rem;display:grid;gap:.5rem}
.doc-sec a{color:#fff;text-decoration:underline;text-underline-offset:2px}
mark.confirm{background:rgba(255,196,0,.14);color:#ffd35c;border:1px dashed rgba(255,211,92,.55);border-radius:3px;padding:0 .3em;font-size:.88em;text-shadow:none;white-space:normal}

/* ===== OEM page ===== */
.oem-grid{display:grid;gap:1rem}
@media (min-width:700px){.oem-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.oem-grid{grid-template-columns:repeat(4,1fr)}}
.oem-card{padding:1.5rem}
.oem-card h3{font-size:1.3rem;margin:0 0 .5rem}
.oem-card p{margin:0;color:#c9ccd2;font-size:.95rem}
.oem-path{list-style:none;margin:0;padding:0;display:grid;gap:1rem;counter-reset:none}
@media (min-width:860px){.oem-path{grid-template-columns:repeat(3,1fr)}}
.oem-path li{position:relative;padding:1.5rem;border:1px solid var(--line);border-top:3px solid var(--red);border-radius:var(--radius);background:rgba(14,15,18,.62)}
.oem-path .step-num{font:700 2.4rem/1 var(--f-display);color:var(--red2);display:block;margin-bottom:.6rem}
.oem-path h3{font-size:1.4rem;margin:0 0 .4rem}
.oem-path p{margin:0;color:#c9ccd2}
.oem-steps{margin:0;padding:0 0 0 1.4rem;display:grid;gap:1.1rem;max-width:48rem}
.oem-steps li::marker{color:var(--red2);font:700 1.2rem var(--f-display)}
.oem-steps h3{font-size:1.2rem;margin:0 0 .2rem}
.oem-steps p{margin:0;color:#c9ccd2}
.oem-form-grid .section-head p{color:#c9ccd2}
.oem-form-grid .section-head a{color:#fff}
/* hero accent uses background-clip:text: the global copy text-shadow would show through it */
html[data-bg] .hero h1 .accent{text-shadow:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
/* 10 nav items: keep each on one line */
.nav a{white-space:nowrap}
@media (min-width:1180px) and (max-width:1499px){.nav{gap:1.3rem}.nav a{font-size:.9rem;letter-spacing:.1em}}
@media (min-width:960px) and (max-width:1279px){.nav .nav-opt{display:none}}
@media (min-width:960px) and (max-width:1179px){.nav{gap:.95rem}.nav a{font-size:.86rem;letter-spacing:.08em}}
.cta-open{margin:.5rem 0 0;font-size:.9rem;color:#d7dade}

/* at-a-glance two-line values (Inspection: Romer CMM + 3D scanning; Finishing: Vibratory tumbling (SLS)) */
.spec-panel li strong .v2{font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;white-space:nowrap}
@media (max-width:600px){.spec-panel li strong .v2{display:block}}
/* resale certificate filler */
.mode-switch{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.2rem;border:0;padding:0}
.mode-switch label{position:relative;cursor:pointer}
.mode-switch input{position:absolute;opacity:0;inset:0;cursor:pointer}
.mode-switch span{display:inline-block;padding:.55rem .95rem;border:1px solid rgba(255,255,255,.18);border-radius:999px;font-size:.88rem;color:#d4d7dc;background:rgba(255,255,255,.03);transition:border-color .2s,background .2s}
.mode-switch input:checked+span{border-color:#DE252A;background:rgba(222,37,42,.14);color:#fff}
.mode-switch input:focus-visible+span{outline:2px solid #DE252A;outline-offset:2px}
.mode-switch.small{margin:.4rem 0 .7rem}.mode-switch.small span{font-size:.82rem;padding:.4rem .8rem}
#resale-form fieldset{border:0;padding:0;margin:0 0 1rem}
#resale-form legend{font-size:.85rem;font-weight:600;color:#e7e9ec;margin-bottom:.2rem}
#resale-form .hint{font-size:.8rem;color:#a9adb4;margin:.35rem 0 1rem;line-height:1.5}
.sig-input{font-family:"Brush Script MT","Segoe Script","Snell Roundhand",cursive;font-size:1.35rem!important;letter-spacing:.02em}
.cert-text{margin:.2rem 0 1rem;font-size:.82rem;color:#b9bdc4;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:.7rem .9rem;background:rgba(255,255,255,.02)}
.cert-text summary{cursor:pointer;color:#e7e9ec;font-weight:600}
.cert-text p{margin:.6rem 0 0;line-height:1.55}
.btn-pair{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1rem}
.btn-pair .btn{flex:1 1 auto;justify-content:center}
[hidden]{display:none!important}

/* About: leadership card (Nathan Engel, President) */
.leader{margin:2rem 0 0;display:grid;grid-template-columns:minmax(0,300px) 1fr;gap:1.6rem;align-items:center;max-width:640px;padding:1rem;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);background:rgba(14,15,18,.62)}
.leader picture,.leader img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:calc(var(--radius) - 4px)}
.leader picture{position:relative}
.leader picture::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);pointer-events:none}
.leader figcaption strong{display:block;font:700 1.7rem/1.05 var(--f-display);text-transform:uppercase;letter-spacing:.01em;color:#fff}
.leader-role{display:block;font:600 .75rem/1 var(--f-display);letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:.6rem}
.leader-title{display:block;font:600 .9rem/1.2 var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:#c4c9d0;margin:.35rem 0 .9rem}
.leader figcaption p{margin:0 0 .6rem;font-size:.95rem}
.leader-note{font-size:.82rem}
@media (max-width:620px){.leader{grid-template-columns:1fr;max-width:360px;gap:1rem}.leader picture,.leader img{max-width:328px}}

/* ===== About: "Your fab team" pitch (owner, Oct 2026). Lives inside #about; no panels/bands, text on carbon. ===== */
.about-fab{grid-template-areas:"intro" "pitch" "list" "motto" "founder" "loc";gap:2.6rem}
.about-fab .ab-intro{grid-area:intro}.about-fab .ab-pitch{grid-area:pitch}.about-fab .ab-loc{grid-area:loc}
.about-fab .ab-list{grid-area:list}.about-fab .ab-founder{grid-area:founder;margin:0}.about-fab .ab-motto{grid-area:motto}
@media (min-width:960px){
  .about-fab{grid-template-columns:1.25fr 1fr;grid-template-areas:"intro loc" "pitch loc" "list list" "founder motto";column-gap:4rem;row-gap:2.4rem;align-items:start}
  .about-fab .ab-loc{align-self:start}
  .about-fab .ab-motto{align-self:center}
}
.fab-title{font-size:clamp(1.9rem,3.4vw,2.7rem);margin:0 0 1rem;color:#f1f2f4;position:relative;padding-top:1.1rem}
.fab-title::before{content:"";position:absolute;left:0;top:0;width:2.6rem;height:3px;background:var(--red)}
.fab-title span{color:var(--red2)}
.ab-pitch p{font-size:1.04rem;line-height:1.7}
.fab-list{list-style:none;margin:0;padding:0;display:grid;gap:0 2.4rem;grid-template-columns:1fr}
@media (min-width:620px){.fab-list{grid-template-columns:1fr 1fr}.fab-list li:last-child{grid-column:1/-1}}
@media (min-width:1100px){.fab-list{grid-template-columns:repeat(3,1fr)}.fab-list li:last-child{grid-column:auto}}
.fab-list li{display:grid;grid-template-columns:auto 1fr;gap:.9rem;padding:1.25rem 0;border-top:1px solid rgba(255,255,255,.14)}
.fab-num{font:700 1.2rem/1 var(--f-display);letter-spacing:.08em;color:var(--red2);padding-top:.02rem}
.fab-list h4{font:700 1.2rem/1.15 var(--f-display);text-transform:uppercase;letter-spacing:.02em;color:#f1f2f4;margin:0 0 .4rem}
.fab-list p{margin:0;font-size:.95rem;line-height:1.6}
.fab-list a{color:#fff;text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:3px;white-space:nowrap}
.fab-motto{border-left:3px solid var(--red);padding:.3rem 0 .3rem 1.4rem}
.fab-motto-line{font:800 clamp(2rem,4vw,3rem)/1 var(--f-display);text-transform:uppercase;letter-spacing:.005em;color:#f1f2f4!important;margin:0 0 1rem}
.fab-motto-line span{color:var(--red2)}
.fab-closer{font-size:.92rem;font-style:italic;color:#b9bec6!important;margin:0 0 1.4rem;max-width:34rem}
.fab-ctas{display:flex;flex-wrap:wrap;gap:.8rem}
html[data-bg] .fab-title span,html[data-bg] .fab-motto-line span{text-shadow:none;filter:drop-shadow(0 1px 2px rgba(0,0,0,.85))}
html[data-bg] .fab-list h4{text-shadow:0 1px 2px rgba(0,0,0,.9)}
/* Founder card beside motto column: longer bio (UTI story) -> top-align photo, wider text column */
@media (min-width:960px){.about-fab .ab-founder{grid-template-columns:240px 1fr;align-items:start;max-width:none;gap:1.5rem}}
/* Company overview (Nov 2026): replaces Meet the Team / portrait cards */
.about-fab{grid-template-areas:"intro" "pitch" "list" "overview" "motto" "loc"}
.about-fab .ab-overview{grid-area:overview}
.ab-overview p{font-size:1.04rem;line-height:1.7;max-width:46rem;margin:0}
.ab-overview .eyebrow{margin-bottom:1rem}
.ab-team .eyebrow{margin-bottom:1rem}
.team-cards{display:grid;gap:1.5rem;grid-template-columns:1fr}
.team-cards .leader{margin:0;max-width:none;align-items:start;grid-template-columns:240px 1fr;gap:1.5rem}
.leader figcaption strong{margin-top:.1rem}
@media (min-width:1180px){.team-cards{grid-template-columns:1fr 1fr}.team-cards .leader{grid-template-columns:200px 1fr;gap:1.3rem}}
@media (max-width:620px){.team-cards .leader{grid-template-columns:1fr;gap:1rem}.team-cards .leader picture,.team-cards .leader img{max-width:328px}}
@media (min-width:960px){
  .about-fab{grid-template-areas:"intro loc" "pitch loc" "list list" "overview overview" "motto motto"}
  .about-fab .ab-motto{display:grid;grid-template-columns:auto 1fr;column-gap:3rem;align-items:center;align-self:auto}
  .about-fab .ab-motto .fab-motto-line{margin:0;grid-row:1/3}
  .about-fab .ab-motto .fab-closer{margin:0 0 1rem;max-width:40rem}
}

/* SEO (Nov 2026): keyword line is the start of the H1 but looks exactly like the old eyebrow; the slogan keeps the H1 look */
h1 .h1-kw{display:flex;width:fit-content;max-width:100%;margin-bottom:1.25rem}
h1 .h1-slogan{display:block}
.serving{color:var(--muted);font-size:.95rem;line-height:1.5;margin:-.5rem 0 1.25rem}
.footer-serving{font-size:.9rem;margin-top:.6rem}
/* A11y: links inside running text are underlined, not colour-only */
main p a:not(.btn),main li p a:not(.btn),.faq-a a:not(.btn),.doc-body a:not(.btn),.cta-hint a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}

/* Stills instead of video (Nov 2026: faster loads). Same framing the videos had. */
.hero-video img.still{width:100%;height:100%;object-fit:cover;object-position:50% 26%;display:block}
.loop-tile img.still,.reel img.still{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.sub-hero .sub-video img.still{width:100%;height:100%;object-fit:cover;object-position:60% 50%;opacity:.9}
.media-strip .ms-wide img.still{aspect-ratio:16/9}
.shop-tile-video img.still,.case-video img.still{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.media-strip .ms-tall img.still{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 0%}
.reel-toggle{display:none}

/* logo never squeezes */
.brand,.brand img{flex-shrink:0}
/* header fit with the logo at full size: hamburger on narrow laptops, same nav size on big screens as mid */
@media (min-width:960px) and (max-width:1059px){
  .nav:not(.open){display:none}
  .nav-toggle{display:grid}.header-cta{display:inline-flex}
  .nav.open{align-items:stretch}
}
@media (min-width:1500px){.nav{gap:1.3rem}.nav a{font-size:.9rem;letter-spacing:.1em}}

/* Equipment & software strip (replaces the old Capabilities section; keeps #capabilities anchor) */
.equip-strip{margin-top:clamp(2rem,4vw,3rem);border-top:1px solid var(--line);padding-top:1.4rem}
.equip-head{margin:0 0 1rem;font-family:var(--f-display);text-transform:uppercase;letter-spacing:.16em;font-size:.82rem;color:var(--red)}
.equip-strip dl{margin:0;display:grid;gap:.9rem 2rem;grid-template-columns:1fr}
@media (min-width:620px){.equip-strip dl{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.equip-strip dl{grid-template-columns:repeat(5,1fr)}}
.equip-strip dt{font-family:var(--f-display);text-transform:uppercase;letter-spacing:.1em;font-size:.9rem;color:var(--text);margin-bottom:.25rem}
.equip-strip dd{margin:0;color:#aeb2b9;font-size:.92rem;line-height:1.5}

.nav a{white-space:nowrap}

/* Case study photo set (pit carts) */
.case-thumbs{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}
.case-thumbs .case-fig figcaption{font-size:.6rem;padding:1.4rem .6rem .5rem;letter-spacing:.1em}
@media (min-width:600px) and (max-width:959px){.case-media-stack:has(.case-thumbs){grid-template-columns:1fr}}