/* Premier Construction + Design — site styles */
:root{
  --char:#26221F;      /* charred standing-seam */
  --ink:#2E2A26;       /* body text on light */
  --plaster:#F3F1EC;   /* page background */
  --paper:#FFFFFF;
  --maple:#C9A264;
  --cedar:#9A6238;
  --slate:#4E6A73;     /* links */
  --mute:#6F6A64;
  --line:#D9D4CB;
  --max:1240px;
  --gut:clamp(16px,4vw,48px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--plaster);color:var(--ink);font-family:"Barlow",system-ui,sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--slate);text-decoration-thickness:1px;text-underline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--maple);outline-offset:2px}
h1,h2,h3,h4{font-family:"Barlow Semi Condensed","Barlow",sans-serif;font-weight:600;line-height:1.05;margin:0 0 .4em;letter-spacing:-.01em;color:var(--char)}
h1{font-size:clamp(2.4rem,6vw,4.6rem)}
h2{font-size:clamp(1.9rem,4vw,3rem)}
h3{font-size:clamp(1.35rem,2.4vw,1.8rem)}
h4{font-size:1.15rem;font-weight:600}
p{margin:0 0 1em;max-width:62ch}
.lead{font-size:clamp(1.15rem,1.8vw,1.35rem);line-height:1.45;max-width:52ch}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
section{padding:clamp(56px,8vw,112px) 0}
.rule{border:0;border-top:3px solid var(--maple);width:64px;margin:0 0 1.2rem}
.btn{display:inline-block;font-family:"Barlow Semi Condensed",sans-serif;font-weight:600;font-size:1.05rem;letter-spacing:.01em;padding:.8em 1.5em;border:2px solid var(--char);color:var(--char);background:transparent;text-decoration:none;cursor:pointer;border-radius:2px}
.btn.solid{background:var(--char);color:var(--plaster)}
.btn.light{border-color:var(--plaster);color:var(--plaster)}
.btn.light.solid{background:var(--plaster);color:var(--char)}
.btn+.btn{margin-left:.6rem}

/* header */
header.site{position:absolute;top:0;left:0;right:0;z-index:10;padding:18px 0}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
header.site .brand img{height:64px;width:auto}
header.site nav a{color:var(--plaster);text-decoration:none;font-family:"Barlow Semi Condensed",sans-serif;font-weight:500;font-size:1.05rem;margin-left:1.4rem}
header.site nav a:hover{text-decoration:underline}
header.site.onlight{position:static;background:var(--char)}
header.site .call{display:none}
@media(min-width:900px){header.site .call{display:inline-block}}
.menu-btn{display:none;background:none;border:2px solid var(--plaster);color:var(--plaster);padding:.4em .8em;font:inherit;border-radius:2px}
@media(max-width:899px){
  header.site nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--char);padding:12px var(--gut) 20px}
  header.site nav.open{display:flex;flex-direction:column;gap:14px}
  header.site nav a{margin:0;font-size:1.25rem}
  .menu-btn{display:inline-block}
}

/* hero */
.hero{position:relative;min-height:min(92vh,860px);display:flex;align-items:flex-end;background:var(--char);color:var(--plaster);padding:0}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.92}
.hero .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(38,34,31,.55) 0%,rgba(38,34,31,0) 35%,rgba(38,34,31,.35) 60%,rgba(38,34,31,.92) 100%)}
.hero .wrap{position:relative;width:100%;padding-bottom:clamp(40px,6vw,80px);padding-top:140px}
.hero h1{color:var(--plaster);max-width:14ch;font-size:clamp(3rem,8.5vw,7rem);font-weight:700;line-height:.95;margin-bottom:.35em}
.hero .lead{color:#E9E4DB;max-width:46ch;margin-bottom:1.6em}
.hero .press{font-size:.95rem;color:#D7CFC2;margin-top:2.2em;max-width:60ch}
.hero .press b{color:var(--maple);font-weight:600}

/* project grid */
.work{background:var(--plaster)}
.grid{display:grid;gap:18px;grid-template-columns:repeat(12,1fr)}
.proj{position:relative;display:block;overflow:hidden;background:var(--char);color:var(--plaster);text-decoration:none;grid-column:span 12;min-height:320px}
.proj img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;opacity:.95}
.proj .cap{position:relative;z-index:1;padding:22px 24px;background:linear-gradient(0deg,rgba(38,34,31,.9),rgba(38,34,31,0));position:absolute;left:0;right:0;bottom:0}
.proj .cap h3{color:var(--plaster);margin:0 0 .15em}
.proj .cap span{color:#D7CFC2;font-size:.95rem}
.proj.ph{background:#DAD4C8;color:var(--char)}
.proj.ph .cap{background:none}.proj.ph .cap h3{color:var(--char)}.proj.ph .cap span{color:var(--mute)}
.proj.ph:before{content:"Photos coming";position:absolute;top:18px;left:22px;font-family:"Barlow Semi Condensed";font-weight:600;color:var(--cedar)}
@media(min-width:760px){
  .proj.big{grid-column:span 8;min-height:520px}
  .proj.tall{grid-column:span 4;min-height:520px}
  .proj.half{grid-column:span 6;min-height:400px}
}

/* two-column text blocks */
.cols{display:grid;gap:clamp(24px,5vw,72px);grid-template-columns:1fr}
@media(min-width:860px){.cols{grid-template-columns:5fr 7fr}.cols.rev{grid-template-columns:7fr 5fr}}
.dark{background:var(--char);color:#E9E4DB}
.dark h2,.dark h3,.dark h4{color:var(--plaster)}
.dark a{color:var(--maple)}
.dark .btn{border-color:var(--plaster);color:var(--plaster)}
.dark .btn.solid{background:var(--plaster);color:var(--char)}

/* process */
.steps{counter-reset:s;list-style:none;padding:0;margin:0;display:grid;gap:28px;grid-template-columns:1fr}
@media(min-width:760px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.steps{grid-template-columns:repeat(4,1fr)}}
.steps li{counter-increment:s;border-top:3px solid var(--maple);padding-top:16px}
.steps li:before{content:counter(s);display:block;font-family:"Barlow Semi Condensed";font-weight:700;font-size:2.4rem;color:var(--maple);line-height:1;margin-bottom:.25em}
.steps h3{font-size:1.4rem}
.steps small{display:block;color:var(--maple);margin-bottom:.5em;font-size:.95rem}
.steps p{font-size:1rem;max-width:34ch}

/* pricing tiers */
.tiers{display:grid;gap:22px;grid-template-columns:1fr}
@media(min-width:860px){.tiers{grid-template-columns:repeat(3,1fr)}}
.tier{background:var(--paper);border-top:4px solid var(--char);padding:26px 26px 30px}
.tier h3{font-size:1.5rem;margin-bottom:0}
.tier .price{font-family:"Barlow Semi Condensed";font-size:2.2rem;font-weight:700;color:var(--cedar);margin:.1em 0 .6em}
.tier ul{padding-left:1.1em;margin:0;font-size:1rem;color:var(--ink)}
.tier li{margin:.35em 0}
.note{font-size:.95rem;color:var(--mute);max-width:70ch}

/* lists */
.plain{list-style:none;padding:0;margin:0}
.plain li{padding:.55em 0;border-bottom:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:.6em 0}
.faq summary{cursor:pointer;font-family:"Barlow Semi Condensed";font-weight:600;font-size:1.25rem;color:var(--char)}
.faq p{margin:.6em 0 .2em;max-width:70ch}

/* service cards */
.svc{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:700px){.svc{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.svc{grid-template-columns:repeat(3,1fr)}}
.svc a{display:block;text-decoration:none;color:var(--ink);background:var(--paper);padding:24px;border-left:4px solid var(--maple)}
.svc a h3{margin-bottom:.3em;color:var(--char)}
.svc a:hover{border-left-color:var(--cedar)}
.svc a p{font-size:1rem;margin:0;color:var(--ink)}

/* area */
.areas{display:grid;gap:12px 32px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));font-family:"Barlow Semi Condensed";font-size:1.25rem;font-weight:500}
.areas span{border-bottom:1px solid var(--line);padding:.4em 0}

/* forms */
form.lead-form{display:grid;gap:16px;grid-template-columns:1fr;max-width:760px}
@media(min-width:640px){form.lead-form{grid-template-columns:1fr 1fr}form.lead-form .full{grid-column:1/-1}}
label{display:block;font-family:"Barlow Semi Condensed";font-weight:600;font-size:1.02rem;margin-bottom:.3em;color:var(--char)}
input,select,textarea{width:100%;font:inherit;padding:.7em .8em;border:1px solid #B9B2A6;background:var(--paper);border-radius:2px;color:var(--ink)}
textarea{min-height:140px}
fieldset{border:0;padding:0;margin:0}
fieldset legend{font-family:"Barlow Semi Condensed";font-weight:600;color:var(--char);margin-bottom:.4em}
.checks{display:flex;flex-wrap:wrap;gap:.5em 1.2em}
.checks label{font-weight:400;font-family:"Barlow";display:flex;align-items:center;gap:.4em;margin:0}
.checks input{width:auto}
.hp{position:absolute;left:-9999px}

/* project page */
.gallery{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.gallery img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.gallery img.tall{aspect-ratio:3/4;grid-row:span 2}
.facts{display:grid;gap:8px 32px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin:1.2em 0 2em;padding:0;list-style:none}
.facts li{border-top:1px solid var(--line);padding-top:.5em;font-size:1rem}
.facts b{display:block;font-family:"Barlow Semi Condensed";color:var(--mute);font-weight:500;font-size:.95rem}
blockquote{margin:1.5em 0;padding-left:1.2em;border-left:3px solid var(--maple);font-size:1.2rem;max-width:56ch}
blockquote cite{display:block;font-style:normal;color:var(--mute);font-size:.95rem;margin-top:.4em}

/* page head */
.pagehead{background:var(--char);color:var(--plaster);padding:120px 0 56px}
.pagehead h1{color:var(--plaster)}
.pagehead p{color:#D7CFC2;max-width:60ch}
.pagehead.img{min-height:60vh;display:flex;align-items:flex-end;position:relative;overflow:hidden}
.pagehead.img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.8}
.pagehead.img .wrap{position:relative}

/* cta band */
.cta{background:var(--maple);color:var(--char);padding:56px 0}
.cta h2{color:var(--char);margin-bottom:.2em}
.cta .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.cta p{margin:0;max-width:50ch}
.cta .btn{border-color:var(--char)}

/* footer */
footer.site{background:var(--char);color:#CFC7BA;padding:56px 0 32px;font-size:.98rem}
footer.site .wrap{display:grid;gap:32px;grid-template-columns:1fr}
@media(min-width:760px){footer.site .wrap{grid-template-columns:2fr 1fr 1fr 1fr}}
footer.site h4{color:var(--plaster);margin-bottom:.5em}
footer.site a{color:#E9E4DB;text-decoration:none}
footer.site a:hover{text-decoration:underline}
footer.site ul{list-style:none;padding:0;margin:0}
footer.site li{margin:.3em 0}
footer.site .legal{grid-column:1/-1;border-top:1px solid #3E3833;padding-top:18px;color:#8F867A;font-size:.9rem}
.estimator .q{margin-bottom:1.4em}
.estimator output{display:block;font-family:"Barlow Semi Condensed";font-size:clamp(2rem,5vw,3.4rem);font-weight:700;color:var(--cedar);margin:.3em 0}
