:root { --ink:#171717; --muted:#747474; --line:#cacaca; --paper:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
h1,h2,p { margin-top:0; }
h1 { font-family:Georgia,'Times New Roman',serif; font-size:clamp(2rem,3vw,3.4rem); font-weight:400; }
.site-header { height:92px; display:grid; grid-template-columns:150px 1fr 180px; align-items:center; gap:34px; max-width:1140px; margin:auto; padding:8px 28px; background:#fff; }
.brand { width:88px; height:74px; object-fit:contain; }
.lutron { width:145px; height:auto; justify-self:end; }
.site-header nav { display:flex; justify-content:center; gap:34px; font-family:Georgia,'Times New Roman',serif; letter-spacing:.06em; }
.site-header nav a { position:relative; padding:28px 0 22px; white-space:nowrap; }
.site-header nav a::before { content:''; position:absolute; top:13px; left:0; width:100%; border-top:1px solid transparent; }
.site-header nav a.active::before,.site-header nav a:hover::before { border-color:var(--ink); }
.hero-home { min-height:680px; background:url('/assets/hero-home.webp') center 53%/cover no-repeat; display:flex; justify-content:center; align-items:flex-start; }
.hero-copy { padding-top:82px; display:flex; flex-direction:column; align-items:center; color:#141414; text-align:center; text-shadow:0 1px 12px rgba(255,255,255,.6); }
.hero-copy p { font:clamp(1.5rem,2.2vw,2.25rem)/1.2 Georgia,'Times New Roman',serif; margin-bottom:25px; }
.button { display:inline-flex; justify-content:center; align-items:center; min-width:190px; padding:18px 30px; background:#171717; color:#fff; font-weight:700; text-transform:uppercase; letter-spacing:.04em; border:1px solid #171717; transition:.2s ease; }
.button:hover { background:#fff; color:#171717; }
.button-large { min-width:340px; font:2.5rem Georgia,'Times New Roman',serif; letter-spacing:.08em; }
.button-large span { font-size:3.6rem; line-height:.5; margin-left:16px; }
.hero-phone { margin-top:18px; font:700 2rem Georgia,'Times New Roman',serif; letter-spacing:.07em; }
.section-shell { width:min(1180px,calc(100% - 64px)); margin:0 auto; padding:72px 0 100px; }
.section-heading-row { display:flex; justify-content:space-between; align-items:center; gap:32px; }
.service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:92px 70px; margin-top:55px; }
.service-icon { display:block; height:52px; font:2.7rem Georgia,serif; }
.service h2 { max-width:185px; font-size:1rem; line-height:1.45; }
.team { padding-top:80px; text-align:center; }
.team h1 { text-align:left; max-width:900px; margin-inline:auto; }
.team img { width:min(900px,100%); margin:auto; aspect-ratio:1.88/1; object-fit:cover; }
.craft-section { background:url('/assets/craft-background.webp') center/cover no-repeat; color:#fff; }
.shade { min-height:820px; background:rgba(16,15,16,.67); display:flex; align-items:center; }
.craft-copy { width:min(1180px,calc(100% - 64px)); margin:auto; max-width:1180px; }
.craft-copy>p { max-width:470px; line-height:1.7; font-weight:600; }
.craft-copy h1 { margin:20px 0 16px; }
.stats { display:flex; gap:75px; margin:60px 0; }
.stats div { display:flex; flex-direction:column; gap:12px; border-bottom:1px solid #ddd; padding-bottom:30px; }
.stats b { font:3.7rem Georgia,serif; }
.stats span { font-size:.9rem; font-weight:700; }
.ceo { display:flex; flex-direction:column; gap:9px; line-height:1.4; }
.relationship { padding:55px 20px 20px; text-align:center; }
.relationship h1 { color:#666; }
.footer { border-top:1px solid var(--line); padding-top:70px; min-height:450px; position:relative; }
.footer-grid { display:grid; grid-template-columns:1.1fr 1.2fr .8fr 1fr auto; gap:55px; align-items:start; }
.footer-logo { width:120px; height:120px; object-fit:contain; }
.footer h2 { font:700 1.15rem Georgia,serif; }
.footer p { font:1rem/1.9 Georgia,serif; }
.footer section a { text-decoration:underline; text-underline-offset:3px; }
.footer-button { align-self:center; }
.go-up { position:absolute; right:0; bottom:20px; text-decoration:underline; font-weight:700; }

.page-title { padding-bottom:40px; }
.page-title>strong,.contact-heading>strong { display:block; margin:14px 0 22px; }
.page-title h1 { color:#1d2f51; }
.about-image { width:100%; height:min(620px,42vw); object-fit:cover; margin-top:50px; }
.about-grid { display:grid; grid-template-columns:minmax(280px,420px) minmax(300px,480px); gap:160px; padding-top:35px; }
.about-grid p { font:1rem/2 Georgia,serif; }
.serif { font:400 1.7rem Georgia,serif; color:#8a8a8a; }
.large-copy { font-size:2.6rem; margin-top:60px; }
.values article { position:relative; padding-top:30px; margin-bottom:34px; }
.values article::before { content:''; position:absolute; top:10px; left:0; width:40px; border-top:1px solid; }
.values h2 { font:700 1.2rem Georgia,serif; }

.work-intro { display:grid; grid-template-columns:360px 1fr; align-items:center; gap:170px; padding-top:35px; }
.work-intro img { width:360px; height:270px; object-fit:cover; }
.work-intro p { max-width:560px; font:1rem/1.65 Georgia,serif; }
.gallery { padding-top:0; display:grid; grid-template-columns:repeat(12,1fr); gap:30px; }
.gallery img { width:100%; height:340px; object-fit:cover; }
.gallery-1,.gallery-2 { grid-column:span 6; }
.gallery-3 { grid-column:span 3; }.gallery-4 { grid-column:span 6; }.gallery-5 { grid-column:span 3; }
.gallery-6,.gallery-7,.gallery-8 { grid-column:span 4; }

.contact { padding-top:50px; }
.contact-heading h1 { color:#888; margin-bottom:20px; }
.contact-layout { display:grid; grid-template-columns:minmax(320px,520px) 1fr; gap:120px; align-items:center; margin-top:70px; }
.contact-layout img { width:100%; height:580px; object-fit:cover; }
.contact form { display:flex; flex-direction:column; gap:22px; }
.contact form h2 { font-size:1.6rem; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.contact label { display:flex; flex-direction:column; gap:8px; font-size:.9rem; }
.contact input,.contact textarea { width:100%; border:0; border-bottom:2px solid #222; padding:10px 3px; background:transparent; font:1rem Arial,sans-serif; resize:vertical; }
.contact input:focus,.contact textarea:focus { outline:2px solid #555; outline-offset:4px; }
.contact button { width:140px; min-width:0; border-radius:24px; padding:12px 20px; }
.honeypot { position:absolute!important; left:-9999px!important; }

.careers-hero { min-height:680px; background:url('/assets/careers.webp') center/cover no-repeat; display:grid; place-items:center; padding:50px 20px; }
.careers-card { background:#fff; width:min(620px,100%); padding:65px; text-align:center; box-shadow:0 18px 60px rgba(0,0,0,.15); }
.careers-card>span { font:1.8rem Georgia,serif; }
.careers-card h1 { margin:35px 0 18px; }
.careers-card p { font-size:1.1rem; line-height:1.7; margin-bottom:28px; }
@media (max-width:800px) {
  .site-header { height:auto; grid-template-columns:1fr auto; gap:12px; padding:14px 22px; }
  .site-header nav { grid-column:1/-1; order:3; gap:18px; justify-content:flex-start; overflow-x:auto; font-size:.88rem; }
  .site-header nav a { padding:9px 0 14px; }.site-header nav a::before { top:2px; }
  .brand { width:72px; height:60px; }.lutron { width:125px; }
  .hero-home { min-height:520px; }.hero-copy { padding:54px 20px 0; }
  .button-large { min-width:0; width:min(310px,90vw); font-size:2rem; }.hero-phone { font-size:1.5rem; }
  .section-shell { width:min(100% - 36px,1180px); padding:52px 0 72px; }
  .section-heading-row { align-items:flex-start; }.section-heading-row .button { min-width:140px; padding:14px 16px; }
  .service-grid { grid-template-columns:repeat(2,1fr); gap:50px 28px; }
  .team { padding-top:35px; }
  .shade { min-height:680px; }.craft-copy { width:calc(100% - 36px); }.stats { gap:35px; flex-wrap:wrap; }.stats b { font-size:2.8rem; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:35px; }.footer-button { justify-self:start; }.go-up { right:18px; }
  .about-grid { grid-template-columns:1fr; gap:25px; }.about-image { height:55vw; }.large-copy { margin-top:45px; }
  .work-intro { grid-template-columns:1fr; gap:40px; }.work-intro img { width:100%; height:350px; }.gallery img { height:250px; }.gallery>* { grid-column:span 6!important; }
  .contact-layout { grid-template-columns:1fr; gap:60px; }.contact-layout img { height:400px; }
}
@media (max-width:520px) {
  .section-heading-row { flex-direction:column; }.service-grid { grid-template-columns:1fr 1fr; }
  .stats { display:grid; grid-template-columns:1fr 1fr; gap:25px; }.stats div:last-child { grid-column:1/-1; }
  .footer-grid { grid-template-columns:1fr; }.footer { min-height:0; padding-bottom:80px; }
  .gallery>* { grid-column:1/-1!important; }.gallery img { height:auto; }
  .form-row { grid-template-columns:1fr; }.contact-layout img { height:280px; }
  .careers-card { padding:45px 24px; }.careers-card>span { font-size:1.4rem; }
}
