:root {
  --red:#e10600;
  --red-dark:#b40400;
  --ink:#151515;
  --charcoal:#242424;
  --soft:#f4f4f4;
  --line:#dddddd;
  --white:#ffffff;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--ink);background:var(--white);line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(92%,var(--max));margin:0 auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom:1px solid #eee}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;min-height:96px;gap:24px}
.brand{display:flex;align-items:center;flex-shrink:0}
.brand img{width:210px;max-height:84px;object-fit:contain}
.site-nav{display:flex;align-items:center;gap:26px;font-weight:700;font-size:.95rem}
.site-nav a:hover{color:var(--red)}
.nav-cta{background:var(--red);color:#fff!important;padding:12px 18px;border-radius:999px}
.nav-toggle{display:none;border:0;background:transparent;padding:8px}
.nav-toggle span{display:block;width:26px;height:2px;background:var(--ink);margin:5px 0}
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#0d0d0d 0%,#222 58%,#111 100%);color:#fff;padding:96px 0 78px}
.hero:before{content:"";position:absolute;inset:-20% -10% auto auto;width:620px;height:620px;border:48px solid rgba(225,6,0,.25);transform:rotate(45deg)}
.hero-overlay{position:absolute;inset:0;background:radial-gradient(circle at 70% 35%,rgba(225,6,0,.18),transparent 35%)}
.hero-grid{position:relative;display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:center}
.eyebrow{margin:0 0 14px;color:var(--red);font-weight:900;letter-spacing:.16em;font-size:.76rem}
.hero h1,.section h2{margin:0;line-height:1.03;letter-spacing:-.035em}
.hero h1{font-size:clamp(3rem,7vw,6.4rem);max-width:850px}
.hero h1 span{color:var(--red)}
.motto{margin:20px 0 0;font-size:clamp(1.45rem,3vw,2.25rem);font-weight:900;font-style:italic;letter-spacing:-.02em;color:#fff;border-left:5px solid var(--red);padding-left:16px}
.hero-text{font-size:1.2rem;max-width:700px;color:#d5d5d5;margin:24px 0 30px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:15px 22px;font-weight:900;border:2px solid transparent;cursor:pointer}
.btn-primary{background:var(--red);color:#fff}
.btn-primary:hover{background:var(--red-dark)}
.btn-secondary{border-color:#fff;color:#fff}
.btn-secondary:hover{background:#fff;color:#111}
.trust-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.trust-row span{border:1px solid #474747;border-radius:999px;padding:8px 12px;color:#cfcfcf;font-size:.83rem}
.hero-card{background:#fff;color:#111;border-radius:24px;padding:24px;box-shadow:0 25px 70px rgba(0,0,0,.35);transform:rotate(1deg)}
.hero-card img{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;border-radius:16px}
.hero-card-copy{padding:16px 8px 4px;display:grid;gap:4px}
.hero-card-copy strong{font-size:1.15rem}
.hero-card-copy span{color:#444;font-weight:800}
.roofline-band{height:18px;background:linear-gradient(135deg,transparent 0 12%,var(--red) 12% 23%,transparent 23% 34%,var(--red) 34% 48%,transparent 48% 62%,var(--red) 62% 74%,transparent 74%)}
.section{padding:90px 0}
.section-heading{max-width:760px;margin-bottom:40px}
.section h2{font-size:clamp(2.2rem,5vw,4.4rem)}
.section-heading>p:last-child,.lead{font-size:1.12rem;color:#666}
.card-grid{display:grid;gap:20px}
.services-grid{grid-template-columns:repeat(3,1fr)}
.service-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px;min-height:240px;box-shadow:0 10px 30px rgba(0,0,0,.04)}
.service-card:before{content:"";position:absolute;top:0;left:0;width:76px;height:5px;background:var(--red);border-radius:20px 0 8px 0}
.service-card h3{font-size:1.45rem;margin:28px 0 8px}
.service-number{font-size:.8rem;font-weight:900;color:var(--red)}
.accent-card{background:var(--red);color:#fff;border-color:var(--red)}
.accent-card:before{background:#fff}
.accent-card .eyebrow,.accent-card a{color:#fff}
.accent-card a{font-weight:900}
.section-dark{background:#171717;color:#fff}
.section-dark .lead{color:#cfcfcf}
.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.reasons-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.reason{background:#232323;border:1px solid #373737;border-radius:18px;padding:24px;display:grid;gap:30px;min-height:150px}
.reason strong{color:var(--red);font-size:1.25rem}
.reason span{font-size:1.05rem;font-weight:800}
.row-heading{max-width:none;display:grid;grid-template-columns:1fr .8fr;gap:50px;align-items:end}
#projects{padding-bottom:56px}
#projects .section-heading{margin-bottom:28px}
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start}
.project-placeholder{min-height:330px;border-radius:20px;display:flex;align-items:end;padding:24px;font-size:1.3rem;font-weight:900;color:#fff;background:linear-gradient(135deg,#2a2a2a,#111);position:relative;overflow:hidden}
.project-placeholder:after{content:"";position:absolute;width:180px;height:180px;border:24px solid rgba(225,6,0,.5);right:-35px;top:-35px;transform:rotate(45deg)}
.service-area{background:var(--soft)}
.area-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.area-list span{background:#fff;border-left:5px solid var(--red);padding:18px 20px;border-radius:10px;font-weight:800;box-shadow:0 8px 22px rgba(0,0,0,.04)}
.estimate-section{background:#fff}
.estimate-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}
.estimate-form{background:#f7f7f7;border:1px solid #e2e2e2;border-radius:22px;padding:28px;display:grid;gap:16px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{font-weight:800;font-size:.92rem;display:grid;gap:7px}
input,select,textarea{width:100%;border:1px solid #ccc;background:#fff;border-radius:10px;padding:13px 14px;font:inherit;color:#111}
textarea{resize:vertical}
.form-note{margin:0;color:#777;font-size:.86rem}
.site-footer{background:#111;color:#fff;padding:54px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:50px}
.footer-brand img{width:220px;background:#fff;border-radius:14px;padding:8px}
.footer-brand p{color:#fff;font-weight:900;font-style:italic}
.footer-grid>div:not(.footer-brand){display:grid;align-content:start;gap:8px}
.footer-grid strong{margin-bottom:5px}
.footer-grid a{color:#bbb}
.footer-grid a:hover{color:#fff}
.footer-bottom{border-top:1px solid #2f2f2f;margin-top:40px;padding-top:22px;display:flex;justify-content:space-between;gap:20px;color:#888;font-size:.9rem}
@media(max-width:900px){
  .nav-toggle{display:block}
  .site-nav{display:none;position:absolute;top:96px;left:0;right:0;background:#fff;padding:24px;flex-direction:column;align-items:flex-start;border-bottom:1px solid #ddd}
  .site-nav.open{display:flex}
  .hero-grid,.split-grid,.estimate-grid,.row-heading{grid-template-columns:1fr}
  .services-grid,.project-grid{grid-template-columns:1fr 1fr}
  .hero-card{max-width:520px}
}
@media(max-width:620px){
  .section{padding:68px 0}
  #projects{padding-bottom:40px}
  .hero{padding:72px 0 58px}
  .brand img{width:160px;max-height:72px}
  .services-grid,.project-grid,.reasons-grid,.area-list,.form-row,.footer-grid{grid-template-columns:1fr}
  .project-placeholder{min-height:240px}
  .footer-bottom{flex-direction:column}
}
