/* ============================================================
   CT HOME IMPROVEMENTS — palette pulled directly from the logo:
   black background, chrome/silver, brand blue #1a5098.
   ============================================================ */
:root{
  --ink:#0a0d12;          /* near-black from the logo background */
  --ink-2:#11151d;        /* slightly lifted panel black */
  --paper:#f3f5f8;        /* cool light background for content sections */
  --white:#ffffff;
  --line:#e1e5ea;         /* light borders on paper */
  --line-dark:rgba(255,255,255,.14); /* borders on dark sections */
  --muted:#5b6472;        /* body copy on light background */
  --muted-dark:#aab3c0;   /* body copy on dark background */
  --blue:#1a5098;         /* brand blue, straight from the logo */
  --blue-deep:#0e3762;    /* darker blue for hover/gradient */
  --blue-bright:#3d84d6;  /* lighter blue for accents on dark bg */
  --silver-a:#ffffff;
  --silver-b:#c7cdd6;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
.wrap{width:min(1120px,calc(100% - 44px));margin:auto}

/* chrome/metallic text treatment, used only on dark backgrounds */
.chrome-text{
  background:linear-gradient(180deg,var(--silver-a) 0%,var(--silver-b) 45%,var(--silver-a) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* ---------- topbar ---------- */
.topbar{background:var(--ink);color:#cfd4db;font-size:12px;letter-spacing:.02em;border-bottom:1px solid var(--line-dark)}
.top-inner{height:36px;display:flex;align-items:center;justify-content:space-between}
.top-inner a{color:var(--white);text-decoration:none;font-weight:700}
.top-inner a:hover{color:var(--blue-bright)}

/* ---------- nav ---------- */
.nav{height:82px;display:flex;align-items:center;justify-content:space-between;background:var(--white);border-bottom:1px solid var(--line)}
.brand,.footer-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-weight:800;letter-spacing:.12em;font-size:13px}
.brand-icon{height:42px;width:auto;border-radius:8px;display:block}
.links{display:flex;align-items:center;gap:28px}
.links a{color:var(--ink);font-size:13px;font-weight:700;text-decoration:none}
.links a:not(.nav-quote):hover{color:var(--blue)}
.nav-quote{background:var(--blue);color:var(--white)!important;padding:12px 18px;border-radius:4px;transition:background .15s ease}
.nav-quote:hover{background:var(--blue-deep)}
.menu{display:none;background:none;border:0;font-size:25px;color:var(--ink)}

/* ---------- hero ---------- */
.hero-outer{background:var(--ink);color:var(--white)}
.hero{
  min-height:500px;display:grid;grid-template-columns:1.5fr .8fr;gap:70px;align-items:center;
}
.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:800;margin:0 0 16px;color:var(--blue-bright)}
.hero h1{font-size:clamp(48px,6.5vw,84px);line-height:.94;letter-spacing:-.04em;margin:0 0 28px;font-weight:800}
.hero h1 em{font-style:normal;font-weight:800;color:var(--blue-bright)}
.lead{font-size:17px;line-height:1.65;max-width:680px;color:var(--muted-dark)}
.hero-actions{display:flex;gap:24px;align-items:center;margin-top:30px;flex-wrap:wrap}
.button{display:inline-block;border:0;text-decoration:none;cursor:pointer;padding:15px 22px;font-weight:800;font-size:13px;border-radius:4px;transition:background .15s ease,transform .1s ease}
.button:active{transform:translateY(1px)}
.primary{background:var(--blue);color:var(--white)}
.primary:hover{background:var(--blue-deep)}
.phone{font-weight:800;color:var(--white);text-decoration:none}
.phone:hover{color:var(--blue-bright)}
.hero-card{
  background:linear-gradient(165deg,var(--ink-2),#080a0e);
  border:1px solid var(--line-dark);
  min-height:290px;padding:35px;border-radius:10px;
  display:flex;flex-direction:column;justify-content:flex-end;gap:14px;
}
.hero-logo{width:100%;max-width:230px;height:auto;margin-bottom:auto;display:block}
.hero-card strong{font-size:18px;line-height:1.2;color:var(--white)}
.hero-card a{color:var(--blue-bright);font-weight:800;text-decoration:none}

/* ---------- trust strip ---------- */
.trust-outer{background:var(--ink-2);border-bottom:1px solid var(--line-dark)}
.trust{
  display:grid;grid-template-columns:repeat(4,1fr);
}
.trust div{padding:24px 18px;border-right:1px solid var(--line-dark);font-size:11px;letter-spacing:.14em;color:var(--muted-dark);text-align:center}
.trust div b{color:var(--white)}
.trust div:last-child{border-right:0}

/* ---------- generic sections ---------- */
.section{padding:105px 0;border-bottom:1px solid var(--line);position:relative}
.section-num{
  position:absolute;left:0;top:32px;
  width:34px;height:34px;border-radius:8px;
  background:var(--blue);color:var(--white);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:800;
}
.section-head{margin-left:70px}
.section-head h2,.quote-section h2{font-size:54px;letter-spacing:-.03em;line-height:1;margin:0 0 38px;font-weight:800;color:var(--ink)}

/* services */
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-left:70px}
.service-grid article{padding:10px 45px 15px 0;border-right:1px solid var(--line);margin-right:35px}
.service-grid article:last-child{border:0}
.service-grid h3{font-size:14px;letter-spacing:.15em;margin:0 0 24px;color:var(--blue);font-weight:800}
.service-grid ul{list-style:none;padding:0;margin:0;color:var(--muted);line-height:2}
.service-grid li:before{content:'— ';color:var(--blue-bright)}

/* why */
.why-content{margin-left:70px}
.reasons{display:grid;grid-template-columns:1fr 1fr;gap:20px 60px;max-width:850px}
.reasons div{display:flex;gap:15px;align-items:center;padding:16px 0;border-top:1px solid var(--line)}
.reasons strong{
  width:28px;height:28px;border-radius:7px;flex:none;
  background:var(--blue);color:var(--white);
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;
}
.reasons span{font-weight:700;color:var(--ink)}
.body-copy{max-width:850px;color:var(--muted);line-height:1.75;font-size:16px;margin-top:38px}

/* service area chips */
.chips{display:flex;flex-wrap:wrap;gap:9px;margin-left:70px;margin-top:25px;max-width:850px}
.chips span{border:1px solid var(--line);padding:10px 13px;font-size:12px;font-weight:700;background:var(--white);color:var(--ink);border-radius:4px;transition:border-color .15s ease,color .15s ease}
.chips span:hover{border-color:var(--blue);color:var(--blue)}

/* ---------- quote section ---------- */
.quote-section{background:var(--ink);padding:105px 0;color:var(--white)}
.quote-section h2{color:var(--white)}
.quote-layout{display:grid;grid-template-columns:.75fr 1fr;gap:100px;position:relative}
.quote-layout>.section-num{position:absolute;left:0;top:-70px}
.quote-section .eyebrow,.quote-section h2,.quote-section>div>p:not(.eyebrow){margin-left:70px}
.quote-section h2{margin-bottom:12px}
.quote-section>div>p:not(.eyebrow){font-size:11px;font-weight:800;letter-spacing:.15em;color:var(--muted-dark)}
.quote-call{margin:65px 0 0 70px;display:flex;flex-direction:column;gap:8px}
.quote-call span{color:var(--muted-dark)}
.quote-call a{color:var(--blue-bright);font-weight:800;text-decoration:none}
.quote-form{background:var(--white);padding:35px;display:grid;gap:18px;border-radius:10px;color:var(--ink)}
.quote-form label{font-size:11px;letter-spacing:.1em;font-weight:800;display:grid;gap:8px;color:var(--ink)}
.quote-form input,.quote-form select,.quote-form textarea{width:100%;border:1px solid var(--line);background:var(--white);padding:13px;font:inherit;font-size:14px;outline:none;border-radius:4px;color:var(--ink)}
.quote-form input:focus,.quote-form select:focus,.quote-form textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(26,80,152,.15)}
.quote-form .button{justify-self:start}
.form-note{font-size:12px!important;color:var(--muted)!important;margin:0!important;letter-spacing:0!important}
.honeypot{display:none!important}

/* ---------- footer ---------- */
footer{background:var(--ink);color:var(--white)}
.footer-inner{min-height:150px;display:flex;align-items:center;gap:28px;flex-wrap:wrap;padding:20px 0}
.footer-brand{color:var(--white)}
.footer-inner>a{color:var(--blue-bright);text-decoration:none;font-weight:800}
.footer-inner span{font-size:12px;color:var(--muted-dark)}
.footer-inner small{margin-left:auto;color:#6b7280;font-size:10px}
.links.open{display:flex}

/* ---------- responsive ---------- */
@media(max-width:760px){
  .wrap{width:min(100% - 30px,1120px)}
  .top-inner{height:auto;padding:10px 0;gap:15px;flex-wrap:wrap}
  .nav{height:70px}
  .links{display:none;position:absolute;z-index:5;left:0;right:0;top:70px;background:var(--white);padding:20px 15px;border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start}
  .menu{display:block}
  .hero{grid-template-columns:1fr;gap:30px;padding:55px 0}
  .hero h1{font-size:52px}
  .hero-card{min-height:220px}
  .trust{grid-template-columns:1fr 1fr}
  .trust div:nth-child(2){border-right:0}
  .trust div{border-bottom:1px solid var(--line-dark)}
  .section{padding:80px 0}
  .section-head,.service-grid,.why-content,.chips{margin-left:0}
  .section-num{position:static;margin-bottom:18px}
  .section-head h2,.quote-section h2{font-size:42px}
  .service-grid{grid-template-columns:1fr;gap:35px}
  .service-grid article{border-right:0;border-bottom:1px solid var(--line);padding:0 0 30px;margin:0}
  .reasons{grid-template-columns:1fr;gap:14px}
  .quote-layout{grid-template-columns:1fr;gap:45px}
  .quote-section .eyebrow,.quote-section h2,.quote-section>div>p:not(.eyebrow){margin-left:0}
  .quote-layout>.section-num{position:static}
  .quote-call{margin:35px 0 0}
  .footer-inner{padding:30px 0;align-items:flex-start;flex-direction:column;gap:14px}
  .footer-inner small{margin-left:0}
  .chips{margin-top:20px}
}