:root{ --bg:#0b0b0b; --bg2:#111; --text:#f5f2ea; --muted:#cfc7b9; --tan:#c8a46a; --tan2:#a88756; --line:rgba(200,164,106,.28); --card:rgba(255,255,255,.06); --shadow:0 18px 50px rgba(0,0,0,.55); --radius:18px; --wrap:1100px;
} *{box-sizing:border-box;}
html,body{height:100%;}
body{ margin:0; font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif; background:var(--bg); color:var(--text); line-height:1.5;
} img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
a:hover{text-decoration:underline;} .wrap{ width:min(var(--wrap), calc(100% - 2rem)); margin:0 auto;
} /* Header */
.site-header{ position:sticky; top:0; z-index:20; background:rgba(11,11,11,.86); backdrop-filter: blur(10px); border-bottom:1px solid var(--line);
}
.header-inner{ display:flex; align-items:center; gap:1rem; padding:.85rem 0;
}
.brand{display:flex;align-items:center;gap:.85rem;}
.brand-mark{ width:58px; height:58px; object-fit:cover; border-radius:14px; border:1px solid var(--line); background:var(--bg2);
}
.brand-name{font-weight:800;letter-spacing:.4px;}
.brand-sub{color:var(--tan);font-weight:700;font-size:.9rem;} .site-nav{margin-left:auto;}
.site-nav ul{display:flex;gap:1rem;list-style:none;margin:0;padding:0;}
.site-nav a{padding:.4rem .2rem;color:var(--muted);font-weight:600;}
.site-nav a:hover{color:var(--text);text-decoration:none;} .header-cta{display:flex;align-items:center;gap:.85rem;}
.phone{color:var(--tan);font-weight:800;white-space:nowrap;} /* Buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.75rem 1rem; border-radius:999px; border:1px solid var(--line); font-weight:800; letter-spacing:.2px; text-decoration:none;
}
.btn:hover{text-decoration:none;transform:translateY(-1px);}
.btn-primary{background:var(--tan);color:#111;border-color:transparent;box-shadow:var(--shadow);}
.btn-primary:hover{background:var(--tan2);}
.btn-ghost{background:transparent;color:var(--text);} /* Hero */
.hero{ padding:3rem 0 2rem; border-bottom:1px solid var(--line); background: radial-gradient(80% 70% at 20% 10%, rgba(200,164,106,.18), transparent 60%), radial-gradient(70% 60% at 80% 30%, rgba(200,164,106,.12), transparent 70%);
}
.hero-slim{padding:2.5rem 0 1.5rem;}
.hero-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:2rem; align-items:center;
}
.eyebrow{color:var(--tan);font-weight:900;letter-spacing:.14em;text-transform:uppercase;font-size:.78rem;}
.hero-title{font-size: clamp(2rem, 3.4vw, 3.1rem);margin:.35rem 0 .5rem;line-height:1.08;}
.hero-lead{color:var(--muted);max-width:52ch;font-size:1.05rem;margin:0 0 1rem;}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin:0 0 1rem;}
.hero-trust{display:flex;flex-wrap:wrap;gap:.5rem;}
.pill{border:1px solid var(--line);border-radius:999px;padding:.35rem .7rem;color:var(--muted);font-weight:700;font-size:.9rem;}
.hero-media img{ border-radius:var(--radius); border:1px solid var(--line); box-shadow:var(--shadow);
} /* Sections */
.section{padding:2.5rem 0;}
.section-dark{background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.section-title{font-size: clamp(1.4rem, 2.2vw, 2rem);margin:0 0 1rem;}
.section-lead{color:var(--muted);margin:0;max-width:70ch;} .cards{ display:grid; grid-template-columns: repeat(4, 1fr); gap:1rem;
}
.card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.1rem;
}
.card h3{margin:.1rem 0 .4rem;}
.card p{margin:0;color:var(--muted);} .cta{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;}
.cta-actions{display:flex;flex-wrap:wrap;gap:.7rem;} /* Post grid */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;}
.post-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.post-card-link{display:grid;grid-template-rows:auto 1fr;}
.post-card-img{width:100%;height:180px;object-fit:cover;}
.post-card-body{padding:1rem;}
.post-card-title{margin:.1rem 0 .4rem;}
.post-card-excerpt{margin:0;color:var(--muted);}
.post-card-meta{margin-top:.7rem;color:var(--tan);font-weight:800;font-size:.9rem;} /* Page hero & content */
.page-hero{padding:2.2rem 0 1.6rem;border-bottom:1px solid var(--line); background: radial-gradient(65% 80% at 20% 0%, rgba(200,164,106,.14), transparent 60%);
}
.page-title{margin:.3rem 0 0;font-size: clamp(1.8rem, 3vw, 2.7rem);}
.page-meta{margin:.6rem 0 0;color:var(--muted);} .content{padding:2rem 0 3rem;}
.content :where(h2,h3){margin-top:1.6rem;}
.content :where(p,ul,ol){color:var(--muted);}
.feature{margin:0 0 1.5rem;}
.feature img{border-radius:var(--radius);border:1px solid var(--line);}
.divider{border:0;border-top:1px solid var(--line);margin:2rem 0;}
.content-cta{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem;}
.content-cta h3{margin:.2rem 0 .4rem;}
.content-cta p{margin:0;color:var(--muted);} /* Koenig editor (Ghost) wide/full cards */
.content .kg-width-wide{ width: calc(100% + 10rem); max-width: calc(var(--wrap) + 10rem); margin-left: auto; margin-right: auto;
}
.content .kg-width-full{ width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
}
.content figure.kg-image-card,
.content figure.kg-card{ margin: 1.4rem 0;
}
.content figure.kg-image-card img{ border-radius: var(--radius); border: 1px solid var(--line); box-shadow: var(--shadow);
}
.content .kg-gallery-card{ margin: 1.4rem 0;
}
.content .kg-gallery-container{ display: grid; gap: .6rem;
}
.content .kg-gallery-row{ display: grid; grid-auto-flow: column; gap: .6rem;
}
.content .kg-gallery-image img{ width: 100%; height: auto; border-radius: 14px; border: 1px solid var(--line);
} /* About split */
.split{display:grid;grid-template-columns: .9fr 1.1fr;gap:1.5rem;align-items:center;}
.split-media img{border-radius:var(--radius);border:1px solid var(--line);background:var(--bg2);padding:.6rem;}
.split-copy h2{margin:.1rem 0 .6rem;}
.checklist{list-style:none;padding:0;margin:1rem 0 1.1rem;}
.checklist li{position:relative;padding-left:1.4rem;margin:.55rem 0;color:var(--muted);}
.checklist li:before{content:"✓";position:absolute;left:0;color:var(--tan);font-weight:900;} /* Contact form */
.form-grid{display:grid;grid-template-columns: 1fr 1fr;gap:1.5rem;align-items:start;}
.contact-cards{display:grid;grid-template-columns: repeat(3,1fr);gap:.8rem;margin-top:1rem;}
.contact-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:.9rem;}
.contact-k{color:var(--muted);font-size:.85rem;font-weight:700;}
.contact-v{margin-top:.2rem;font-weight:900;color:var(--tan);}
.lead-form{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem;}
.lead-form label{display:block;font-weight:800;margin:.65rem 0 .25rem;}
.lead-form input,.lead-form select,.lead-form textarea{ width:100%; margin-top:.35rem; padding:.75rem .9rem; border-radius:14px; border:1px solid var(--line); background:rgba(0,0,0,.35); color:var(--text);
}
.lead-form textarea{resize:vertical;}
.lead-form .two{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;}
.form-note{margin:.75rem 0 0;color:var(--muted);font-size:.9rem;} /* Footer */
.site-footer{border-top:1px solid var(--line);padding:2.2rem 0 1.2rem;background:rgba(255,255,255,.02);}
.footer-grid{display:grid;grid-template-columns: 1.2fr .8fr .8fr;gap:1.5rem;align-items:start;}
.footer-brand{font-weight:900;font-size:1.1rem;margin-bottom:.25rem;}
.footer-muted{color:var(--muted);}
.footer-contact{margin-top:.7rem;color:var(--muted);}
.footer-contact a{color:var(--tan);font-weight:900;}
.dot{opacity:.6;margin:0 .4rem;}
.footer-title{font-weight:900;margin-bottom:.6rem;}
.footer-links{list-style:none;padding:0;margin:0;color:var(--muted);}
.footer-links li{margin:.35rem 0;}
.footer-bottom{margin-top:1.2rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted);} /* Responsive */
@media (max-width: 980px){ .hero-grid{grid-template-columns:1fr;} .cards{grid-template-columns: repeat(2,1fr);} .post-grid{grid-template-columns: repeat(2,1fr);} .split{grid-template-columns:1fr;} .form-grid{grid-template-columns:1fr;} .contact-cards{grid-template-columns:1fr;} .content-cta{flex-direction:column;align-items:flex-start;}
}
@media (max-width: 640px){ .site-nav{display:none;} .header-inner{flex-wrap:wrap;} .header-cta{margin-left:0;width:100%;justify-content:space-between;} .cards{grid-template-columns:1fr;} .post-grid{grid-template-columns:1fr;}
} /* CTA Photo: No job is too big or too tall */
.cta-photo{padding:64px 0;border-top:1px solid rgba(226,195,122,.18);border-bottom:1px solid rgba(226,195,122,.18);background:rgba(0,0,0,.35)}
.cta-photo-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
.cta-photo-copy h2{margin:0 0 10px;font-size:34px;line-height:1.1;letter-spacing:.2px}
.cta-photo-copy p{margin:0 0 10px;max-width:56ch}
.cta-photo-sub{opacity:.9;margin-top:14px}
.cta-photo-media img{width:100%;height:auto;border-radius:18px;border:1px solid rgba(226,195,122,.28);box-shadow:0 18px 40px rgba(0,0,0,.45)}
@media (max-width: 860px){ .cta-photo-grid{grid-template-columns:1fr} .cta-photo-copy h2{font-size:28px}
}

/* Header logo sizing */
.site-logo{
  max-height:56px;
  width:auto;
}
@media (max-width: 860px){
  .site-logo{
    max-height:44px;
  }
}

/* Estimate form status */
.form-status{margin-top:12px;font-weight:600}


/* Video spotlight */
.trp-video-wrap{max-width:1100px;margin:0 auto;padding:0 20px;}
.trp-video-card{border:1px solid rgba(199,164,106,.22);border-radius:18px;overflow:hidden;background:rgba(255,255,255,.02);box-shadow:0 20px 60px rgba(0,0,0,.35);}
.trp-video-card video{width:100%;height:auto;display:block;background:#000;}
.trp-video-caption{padding:16px 18px;color:rgba(245,240,230,.78);font-size:15px;line-height:1.7;}
.trp-video-caption strong{color:#f5f0e6;}

/* Video with side caption */
.trp-video-grid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:24px;
  align-items:center;
}
@media (max-width: 900px){
  .trp-video-grid{
    grid-template-columns: 1fr;
  }
}
.trp-video-caption-side{
  padding:22px;
}
.trp-video-caption-side h3{
  margin:0 0 10px;
}

.trp-why-grid{
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:22px;
  margin-top:26px;
}
@media (max-width: 900px){
  .trp-why-grid{ grid-template-columns:1fr; }
}
.trp-why-card{
  padding:24px;
  border-radius:18px;
  border:1px solid rgba(199,164,106,.25);
  background: rgba(0,0,0,.35);
  box-shadow:0 18px 45px rgba(0,0,0,.35);
}
.trp-why-icon{
  width:44px;
  height:44px;
  border-radius:14px;
  background: linear-gradient(180deg,#c7a46a,#b99256);
  color:#0b0b0b;
  font-weight:1000;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:14px;
}
.trp-why-card h3{
  margin:0 0 10px;
}
.trp-why-card p{
  color:rgba(245,240,230,.8);
  line-height:1.7;
}


/* Why Choose Us – ultra compact */
.trp-why{
  background: linear-gradient(135deg, rgba(199,164,106,.06), rgba(0,0,0,.15));
  border-top:1px solid rgba(199,164,106,.2);
}
.trp-why-grid{
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:12px;
  margin-top:14px;
}
@media (max-width: 900px){
  .trp-why-grid{ grid-template-columns:1fr; }
}
.trp-why-card{
  padding:12px 14px;
  border-radius:12px;
  border:1px solid rgba(199,164,106,.18);
  background: rgba(0,0,0,.25);
}
.trp-why-icon{
  width:28px;
  height:28px;
  border-radius:8px;
  background: linear-gradient(180deg,#c7a46a,#b99256);
  color:#0b0b0b;
  font-weight:900;
  font-size:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:6px;
}
.trp-why-card h3{
  margin:0 0 4px;
  font-size:15px;
}
.trp-why-card p{
  font-size:13px;
  line-height:1.55;
}

/* Why Choose Us – margins aligned with other sections */
.section.trp-why{
  padding-top: 60px;
  padding-bottom: 60px;
}

/* Why Choose Us – narrower content width */
.section.trp-why .trp-container{
  max-width: 1000px; /* slightly narrower than main content */
}

/* Why Choose Us – centered narrower container */
.section.trp-why .trp-container{
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

/* Estimate form file upload */
.lead-form input[type="file"]{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(199,164,106,.22);
  background: rgba(0,0,0,.25);
  color: rgba(245,240,230,.85);
}
.lead-form small{color: rgba(245,240,230,.75);}

/* Reviews page layout */
body .trp-grid-2 .trp-card .trp-cardPad{min-height: 220px;}
@media (max-width: 900px){
  body .trp-grid-2 .trp-card .trp-cardPad{min-height: 0;}
}

/* ---------------------------------------------
   Mobile-friendly header (minimal changes)
   Keeps the navigation visible and wraps cleanly
---------------------------------------------- */
@media (max-width: 640px){
  /* Undo earlier rule that hides the nav on small screens */
  .site-nav{display:block;width:100%;margin-left:0;order:3;}

  /* Stack header pieces: brand -> phone -> nav */
  .header-inner{flex-wrap:wrap;justify-content:center;}
  .brand{width:100%;justify-content:center;text-align:center;}
  .brand-text{display:flex;flex-direction:column;align-items:center;}

  .header-cta{width:100%;justify-content:center;order:2;}
  .phone{font-size:1rem;}

  /* Nav wraps instead of overflowing */
  .site-nav ul{flex-wrap:wrap;justify-content:center;gap:.6rem;}
  .site-nav a{padding:.55rem .45rem;font-size:.95rem;}
}

@media (max-width: 380px){
  .site-nav a{font-size:.9rem;padding:.5rem .35rem;}
  .brand-name{font-size:1.05rem;}
}