:root{--yellow:#f6b800;--yellow-d:#c48f00;--ink:#151515;--bone:#f3efe6;--steel:#3a3d40;--mute:#5d5f61;--display:'Big Shoulders Display','Arial Narrow',Impact,sans-serif;--body:'Work Sans',system-ui,sans-serif}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{font-family:var(--body);font-size:1.06rem;line-height:1.65;color:var(--ink);background:var(--bone)}
h1,h2,h3,h4,.display{font-family:var(--display);font-weight:800;text-transform:uppercase;line-height:.95;letter-spacing:.01em}
h2{font-size:clamp(2.4rem,6vw,4.2rem)}
a{color:inherit}
.eyebrow{font-weight:700;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--yellow-d);margin-bottom:.6rem}
.dark .eyebrow,.hero .eyebrow{color:var(--yellow)}
.util{background:var(--ink);color:#fff;font-size:.9rem;padding:.4rem 0}
.util a{text-decoration:none;font-weight:600}.util .acc{color:var(--yellow)}
.navbar{background:#fff;border-bottom:4px solid var(--yellow);padding:.5rem 0}
.brand-name{font-family:var(--display);font-weight:900;font-size:1.7rem;text-transform:uppercase;line-height:.9;color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:.6rem}
.brand-name img{width:52px;height:52px;object-fit:contain}
.brand-name small{display:block;font-family:var(--body);font-weight:600;font-size:.62rem;letter-spacing:.22em;color:var(--mute)}
.nav-link{font-weight:600;text-transform:uppercase;font-size:.88rem;letter-spacing:.08em;color:var(--ink)!important}
.nav-link:hover{color:var(--yellow-d)!important}
.btn-hat{background:var(--yellow);color:var(--ink);font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:1.2rem;border:2px solid var(--ink);border-radius:0;padding:.55rem 1.4rem;box-shadow:4px 4px 0 var(--ink)}
.btn-hat:hover{background:#ffc928;color:var(--ink);transform:translate(-1px,-1px);box-shadow:6px 6px 0 var(--ink)}
.btn-ghost{background:transparent;color:#fff;font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:1.2rem;border:2px solid #fff;border-radius:0;padding:.55rem 1.4rem}
.btn-ghost:hover{background:#fff;color:var(--ink)}
.tape{height:28px;background:var(--yellow);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);position:relative;background-image:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 12px),repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 60px);background-size:12px 9px,60px 17px;background-repeat:repeat-x;background-position:0 0,0 0}
.hero{position:relative;color:#fff;background:#222 url(img/hero.webp) center/cover;min-height:clamp(560px,86vh,820px);display:flex;align-items:center}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,10,.9) 0%,rgba(10,10,10,.78) 45%,rgba(10,10,10,.25) 100%)}
.hero .container{position:relative;padding-top:3rem;padding-bottom:3rem}
.hero h1{font-size:clamp(3.2rem,9vw,7rem);margin-bottom:1rem}
.hero h1 span{color:var(--yellow)}
.hero p.lead{max-width:34rem;font-size:1.2rem;color:#f1f1f1}
.hero-tags{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:1.15rem;color:var(--yellow);margin-bottom:1.5rem}
.family{display:flex;align-items:center;gap:.9rem;margin-top:2rem}
.family .faces{display:flex}
.family img{width:54px;height:54px;border-radius:50%;object-fit:cover;object-position:50% 20%;border:3px solid var(--yellow);margin-left:-12px;background:#fff}
.family .faces img:first-child{margin-left:0}
.family span{font-size:.95rem;color:#e8e8e8;max-width:15rem;line-height:1.3}
section{padding:5rem 0}
.sec-head{display:flex;align-items:flex-end;gap:1rem;margin-bottom:2.5rem}
.sec-head .tape{flex:1;min-width:40px;margin-bottom:.6rem}
.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0;border-top:3px solid var(--ink)}
.svc{padding:1.8rem 1.6rem;border-bottom:3px solid var(--ink);border-right:3px solid var(--ink);background:#fff}
.svc h3{font-size:2rem;margin-bottom:.8rem}
.svc ul{list-style:none;padding:0;margin:0;columns:2;font-weight:500}
.svc li{padding:.15rem 0;break-inside:avoid}
.svc li::before{content:"▸ ";color:var(--yellow-d)}
.svc.hi{background:var(--yellow)}.svc.hi li::before{color:var(--ink)}
.detail-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem 2.5rem;margin-top:3rem}
.detail-list h4{font-size:1.5rem;border-left:6px solid var(--yellow);padding-left:.7rem;margin-bottom:.4rem}
.detail-list p{margin:0;color:var(--steel);font-size:.98rem}
.dark{background:var(--ink);color:#fff}
.proj{position:relative;overflow:hidden;background:#000;height:100%}
.proj img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:4/3}
.proj figcaption{position:absolute;left:0;bottom:0;background:var(--yellow);color:var(--ink);padding:.5rem .9rem;font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:1.15rem;line-height:1.05}
.proj figcaption small{display:block;font-family:var(--body);font-weight:600;font-size:.7rem;letter-spacing:.12em}
.status{position:absolute;top:.6rem;right:.6rem;background:var(--ink);color:var(--yellow);font-size:.68rem;font-weight:700;letter-spacing:.16em;padding:.2rem .5rem}
.strip{display:flex;gap:.8rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.8rem}
.strip figure{flex:0 0 min(78vw,340px);height:360px;margin:0;scroll-snap-align:start}
.strip img{width:100%;height:100%;object-fit:cover}
.ba{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2.5rem}
.ba figure{margin:0;position:relative}.ba img{width:100%;aspect-ratio:4/3;object-fit:cover}
.ba figcaption{background:var(--yellow);color:var(--ink);font-weight:700;font-size:.9rem;padding:.7rem 1rem}
.ba b{font-family:var(--display);text-transform:uppercase;font-size:1.2rem;display:block;line-height:1}
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem}
.step{border-top:6px solid var(--yellow);padding-top:1rem}
.step b{font-family:var(--display);font-size:3.2rem;color:var(--yellow);line-height:1;display:block}
.step h3{font-size:1.6rem;margin:.2rem 0 .4rem}
.team-card{text-align:center}
.team-card img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%;border:3px solid var(--ink);box-shadow:8px 8px 0 var(--yellow);background:#fff}
.team-card h3{font-size:1.5rem;margin-top:1.3rem}
.about-photo{border:3px solid var(--ink);box-shadow:10px 10px 0 var(--yellow);width:100%;aspect-ratio:4/3;object-fit:cover}
.stat{font-family:var(--display);font-weight:900;font-size:4.5rem;line-height:1;color:var(--yellow-d)}
.hiring{background:var(--yellow);border:3px solid var(--ink);padding:1.5rem 1.8rem;margin-top:3rem}
.hiring h3{font-size:2rem;margin:0 0 .3rem}
.phone-big{font-family:var(--display);font-weight:900;font-size:clamp(2.8rem,8vw,4.8rem);line-height:1;color:var(--yellow);text-decoration:none}
.contact-row{display:flex;gap:1rem;margin-bottom:1.2rem;font-size:1.1rem}
.contact-row b{font-family:var(--display);text-transform:uppercase;letter-spacing:.08em;color:var(--yellow);min-width:5.5rem;font-size:1.15rem}
.contact-row a{text-decoration:none;overflow-wrap:anywhere}
.map-wrap iframe{width:100%;height:100%;min-height:360px;border:3px solid var(--yellow);filter:grayscale(.3)}
footer{background:#0b0b0b;color:#cfcfcf;padding:3rem 0 2rem;border-top:6px solid var(--yellow)}
footer .logo-chip{background:#fff;display:inline-block;padding:.5rem;margin-bottom:1rem}
footer .logo-chip img{width:120px;height:120px;object-fit:contain;display:block}
footer a{color:var(--yellow);text-decoration:none}
@media(max-width:767px){section{padding:3.5rem 0}.hero::before{background:linear-gradient(180deg,rgba(10,10,10,.82),rgba(10,10,10,.7))}.ba{grid-template-columns:1fr}.svc ul{columns:1}.brand-name{font-size:1.35rem}.brand-name img{width:42px;height:42px}.util .hide-s{display:none}}
