@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700;800&family=Mulish:wght@400;500;600;700&display=swap');

:root{
  --ink:#201D1A;
  --ink-2:#2A2621;
  --ink-3:#35302A;
  --paper:#F5F1EA;
  --paper-2:#EAE3D6;
  --emerald:#1F4D3E;
  --emerald-light:#2E6E58;
  --stone:#8B7F6E;
  --text-on-ink:#F3EFE6;
  --muted-on-ink:#A79E90;
  --text-on-paper:#221F1B;
  --muted-on-paper:#6B6255;
  --rule-on-ink:rgba(243,239,230,0.16);
  --rule-on-paper:rgba(34,31,27,0.14);
  --max:1180px;
  --radius:6px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--text-on-paper);
  font-family:'Mulish', sans-serif;
  font-size:17px;
  line-height:1.64;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4{
  font-family:'Playfair Display', serif;
  font-weight:600;
  line-height:1.14;
  margin:0 0 0.5em 0;
  letter-spacing:-0.01em;
}
h1{font-size:clamp(2.4rem,4.6vw,4.1rem); font-weight:700;}
h2{font-size:clamp(1.8rem,3vw,2.5rem);}
h3{font-size:1.3rem;}
p{margin:0 0 1em 0;}
a{color:inherit;}
img{max-width:100%; display:block;}

.wrap{max-width:var(--max); margin:0 auto; padding:0 32px;}
@media (max-width:640px){ .wrap{padding:0 20px;} }

a.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 27px;
  font-family:'Mulish', sans-serif;
  font-weight:700;
  font-size:0.96rem;
  text-decoration:none;
  border:1px solid transparent;
  border-radius:var(--radius);
  transition:background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.btn-emerald{background:var(--emerald); color:var(--text-on-ink);}
.btn-emerald:hover{background:var(--emerald-light);}
.btn-outline-ink{border-color:var(--rule-on-ink); color:var(--text-on-ink);}
.btn-outline-ink:hover{border-color:var(--emerald-light); color:var(--emerald-light);}
.btn-outline-paper{border-color:var(--stone); color:var(--text-on-paper);}
.btn-outline-paper:hover{border-color:var(--emerald); color:var(--emerald);}

.eyebrow{
  font-family:'Mulish', sans-serif;
  font-size:0.85rem;
  font-weight:700;
  color:var(--emerald);
  margin:0 0 0.9em 0;
  letter-spacing:0.03em;
}
.section-ink .eyebrow{color:#7FC2A9;}

hr.rule{border:none; border-top:1px solid var(--rule-on-paper); margin:0;}

/* ---------- Header ---------- */
header.site-header{
  position:sticky; top:0; z-index:50;
  background:var(--paper);
  border-bottom:1px solid var(--rule-on-paper);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 32px;
  max-width:var(--max); margin:0 auto;
  gap:24px;
}
.logo{
  font-family:'Playfair Display', serif;
  font-weight:700;
  font-size:1.28rem;
  color:var(--text-on-paper);
  text-decoration:none;
  display:flex; align-items:center; gap:10px;
  white-space:nowrap;
}
.logo .mark{
  width:32px; height:32px;
  background:var(--emerald);
  color:var(--text-on-ink);
  display:flex; align-items:center; justify-content:center;
  font-size:0.85rem; font-weight:700;
  border-radius:var(--radius);
  flex-shrink:0;
  font-family:'Playfair Display', serif;
}
nav.main-nav{display:flex; gap:26px; align-items:center; flex-wrap:wrap;}
nav.main-nav a{
  color:var(--muted-on-paper);
  text-decoration:none;
  font-size:0.95rem;
  font-weight:600;
  transition:color 0.15s ease;
}
nav.main-nav a:hover, nav.main-nav a.active{color:var(--emerald);}
.header-cta{display:flex; align-items:center; gap:18px; flex-shrink:0;}
.header-phone{color:var(--muted-on-paper); font-size:0.9rem; text-decoration:none; white-space:nowrap;}
.header-phone strong{color:var(--text-on-paper); font-weight:700;}
.nav-toggle{display:none;}

@media (max-width:980px){
  nav.main-nav{
    display:none;
    position:absolute; top:100%; left:0; right:0;
    background:var(--paper);
    flex-direction:column; align-items:flex-start;
    padding:14px 32px 22px;
    border-bottom:1px solid var(--rule-on-paper);
    gap:16px;
  }
  nav.main-nav.open{display:flex;}
  .header-phone{display:none;}
  .nav-toggle{
    display:inline-flex; background:none; border:1px solid var(--stone);
    color:var(--text-on-paper); border-radius:var(--radius); padding:8px 12px; font-size:0.85rem; cursor:pointer;
  }
}

/* ---------- Hero ---------- */
.hero{
  background:var(--ink);
  color:var(--text-on-ink);
  padding:92px 0 100px;
  position:relative;
  overflow:hidden;
}
.hero-grid{
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center;
  position:relative; z-index:1;
}
.hero h1{color:var(--text-on-ink);}
.hero .tagline{
  font-family:'Mulish', sans-serif; letter-spacing:0.04em;
  color:#7FC2A9; font-size:1rem; font-weight:700; margin-bottom:14px; text-transform:uppercase;
}
.hero .lede{font-size:1.14rem; color:var(--muted-on-ink); max-width:48ch;}
.hero-cta-row{display:flex; align-items:center; gap:22px; margin-top:30px; flex-wrap:wrap;}

.marble-panel{
  aspect-ratio:4/5;
  border-radius:var(--radius);
  position:relative;
  background:
    radial-gradient(120% 90% at 15% 10%, rgba(255,255,255,0.10), transparent 55%),
    linear-gradient(128deg, transparent 42%, rgba(255,255,255,0.10) 43%, rgba(255,255,255,0.10) 44%, transparent 45%),
    linear-gradient(96deg, transparent 60%, rgba(255,255,255,0.07) 61%, transparent 63%),
    linear-gradient(160deg, transparent 25%, rgba(127,194,169,0.14) 26%, transparent 28%),
    linear-gradient(150deg, #2E6E58, #1F4D3E 55%, #14332A);
  box-shadow:0 24px 60px rgba(0,0,0,0.35);
}
.marble-panel .label{
  position:absolute; left:22px; bottom:22px; color:var(--text-on-ink);
  font-family:'Mulish',sans-serif; font-size:0.82rem; font-weight:700; letter-spacing:0.04em;
  text-transform:uppercase; background:rgba(20,18,15,0.45); padding:8px 14px; border-radius:var(--radius);
}
@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr; gap:36px;}
  .marble-panel{aspect-ratio:16/9;}
}

/* ---------- Sections ---------- */
section{padding:88px 0;}
.section-alt{background:var(--paper-2);}
.section-ink{background:var(--ink); color:var(--text-on-ink);}
.section-ink h2{color:var(--text-on-ink);}
.section-head{max-width:660px; margin-bottom:52px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}

.two-col{display:grid; grid-template-columns:1fr 1fr; gap:56px;}
@media (max-width:760px){.two-col{grid-template-columns:1fr;}}

.panel{
  border:1px solid var(--rule-on-paper);
  padding:32px;
  border-radius:var(--radius);
  background:var(--paper);
}
.section-ink .panel{border-color:var(--rule-on-ink); background:var(--ink-2);}

.service-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.service-cell{border:1px solid var(--rule-on-paper); border-radius:var(--radius); padding:30px 26px; background:var(--paper);}
.service-cell .icon-wrap{width:46px; height:46px; border-radius:var(--radius); background:var(--paper-2); display:flex; align-items:center; justify-content:center; margin-bottom:16px;}
@media (max-width:860px){ .service-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .service-grid{grid-template-columns:1fr;} }

.feature-list{list-style:none; margin:0; padding:0; columns:2; column-gap:40px;}
.feature-list li{
  break-inside:avoid;
  padding:10px 0;
  border-bottom:1px solid var(--rule-on-paper);
  font-size:0.98rem;
}
.section-ink .feature-list li{border-bottom:1px solid var(--rule-on-ink);}
@media (max-width:640px){ .feature-list{columns:1;} }

.feature-block{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; padding:52px 0;}
.feature-block + .feature-block{border-top:1px solid var(--rule-on-paper);}
@media (max-width:760px){.feature-block{grid-template-columns:1fr; gap:22px;}}
.feature-num{font-family:'Mulish', sans-serif; color:var(--emerald); font-size:0.9rem; margin-bottom:14px; font-weight:700; letter-spacing:0.03em;}

/* Material swatches (CSS-rendered, not photos) */
.material-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
@media (max-width:900px){.material-grid{grid-template-columns:1fr 1fr;}}
.material-card{border-radius:var(--radius); overflow:hidden; border:1px solid var(--rule-on-paper); background:var(--paper);}
.swatch{aspect-ratio:1/1; position:relative;}
.swatch.granite{background:
  radial-gradient(circle at 20% 30%, rgba(0,0,0,0.35) 0 3px, transparent 4px),
  radial-gradient(circle at 60% 15%, rgba(255,255,255,0.25) 0 2px, transparent 3px),
  radial-gradient(circle at 80% 60%, rgba(0,0,0,0.3) 0 3px, transparent 4px),
  radial-gradient(circle at 35% 70%, rgba(255,255,255,0.2) 0 2px, transparent 3px),
  radial-gradient(circle at 55% 45%, rgba(0,0,0,0.25) 0 2px, transparent 3px),
  radial-gradient(circle at 10% 80%, rgba(255,255,255,0.18) 0 2px, transparent 3px),
  linear-gradient(135deg,#4A4640,#2A2621);}
.swatch.quartz{background:
  linear-gradient(120deg, transparent 46%, rgba(255,255,255,0.5) 47%, rgba(255,255,255,0.5) 48%, transparent 49%),
  linear-gradient(100deg, transparent 65%, rgba(31,77,62,0.18) 66%, transparent 68%),
  linear-gradient(150deg, transparent 20%, rgba(255,255,255,0.3) 21%, transparent 23%),
  linear-gradient(160deg,#F5F1EA,#E4DCC9);}
.swatch.marble{background:
  linear-gradient(115deg, transparent 40%, rgba(90,90,85,0.35) 41%, rgba(90,90,85,0.35) 42%, transparent 43%),
  linear-gradient(70deg, transparent 55%, rgba(90,90,85,0.25) 56%, transparent 58%),
  linear-gradient(20deg, transparent 30%, rgba(31,77,62,0.12) 31%, transparent 33%),
  linear-gradient(160deg,#FBF9F4,#E9E4D8);}
.swatch.quartzite{background:
  linear-gradient(125deg, transparent 30%, rgba(31,77,62,0.3) 31%, rgba(31,77,62,0.3) 32%, transparent 33%),
  linear-gradient(80deg, transparent 60%, rgba(255,255,255,0.25) 61%, transparent 63%),
  linear-gradient(150deg,#D8DED6,#8B9C90);}
.material-body{padding:18px 20px 22px;}
.material-body h3{margin-bottom:4px; font-size:1.1rem;}
.material-body p{font-size:0.9rem; color:var(--muted-on-paper); margin:0;}

/* Project gallery cards */
.project-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
@media (max-width:900px){.project-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:640px){.project-grid{grid-template-columns:1fr;}}
.project-card{border-radius:var(--radius); overflow:hidden; border:1px solid var(--rule-on-paper); background:var(--paper);}
.project-photo{
  aspect-ratio:4/3; position:relative; display:flex; align-items:flex-end;
  background:linear-gradient(160deg,#3A352E,#201D1A);
}
.project-photo.alt{background:linear-gradient(160deg,#2E6E58,#14332A);}
.project-photo.alt2{background:linear-gradient(160deg,#8B9C90,#4E5A50);}
.project-photo span{
  color:var(--text-on-ink); font-size:0.78rem; font-weight:700; letter-spacing:0.04em; text-transform:uppercase;
  padding:14px 16px; font-family:'Mulish',sans-serif;
}
.project-body{padding:20px 20px 24px;}
.project-body .tag{font-family:'Mulish',sans-serif; color:var(--emerald); font-size:0.78rem; text-transform:uppercase; letter-spacing:0.05em; margin-bottom:6px; display:block; font-weight:700;}

.testimonial-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
@media (max-width:900px){.testimonial-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:640px){.testimonial-grid{grid-template-columns:1fr;}}
.testimonial{border-top:3px solid var(--emerald); background:var(--paper); padding:28px 26px; border-radius:0 var(--radius) var(--radius) var(--radius);}
.testimonial p{font-size:1rem; color:var(--text-on-paper);}
.testimonial cite{font-style:normal; display:block; margin-top:14px; font-weight:700; font-size:0.9rem;}
.testimonial cite span{display:block; font-weight:400; color:var(--muted-on-paper); font-size:0.87rem; margin-top:2px;}

/* Pricing */
.pricing-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:900px){.pricing-grid{grid-template-columns:1fr;}}
.price-card{
  border:1px solid var(--rule-on-paper);
  border-radius:var(--radius);
  padding:34px 30px;
  display:flex; flex-direction:column;
  background:var(--paper);
}
.price-card.featured{border-color:var(--emerald); border-width:2px; background:var(--ink); color:var(--text-on-ink);}
.price-card.featured h3{color:var(--text-on-ink);}
.price-card .plan-name{color:var(--emerald); font-weight:700; font-size:0.85rem; margin-bottom:8px; letter-spacing:0.03em; text-transform:uppercase;}
.price-card.featured .plan-name{color:#7FC2A9;}
.price-amount{font-family:'Playfair Display', serif; font-size:2rem; font-weight:700; margin:6px 0 4px;}
.price-amount span.from{font-size:0.85rem; font-weight:600; font-family:'Mulish',sans-serif; text-transform:uppercase; letter-spacing:0.03em; color:var(--muted-on-paper); display:block; margin-bottom:4px;}
.price-card.featured .price-amount span.from{color:var(--muted-on-ink);}
.price-note{font-size:0.88rem; color:var(--muted-on-paper); margin-bottom:22px;}
.price-card.featured .price-note{color:var(--muted-on-ink);}
.price-list{list-style:none; margin:0 0 26px 0; padding:0; flex-grow:1;}
.price-list li{
  padding:9px 0 9px 22px;
  border-bottom:1px solid var(--rule-on-paper);
  position:relative;
  font-size:0.94rem;
}
.price-card.featured .price-list li{border-bottom:1px solid var(--rule-on-ink);}
.price-list li::before{content:"—"; position:absolute; left:0; color:var(--emerald);}
.price-card.featured .price-list li::before{color:#7FC2A9;}

.guarantee-strip{
  display:flex; align-items:center; gap:28px;
  border:1px solid var(--rule-on-paper); border-radius:var(--radius);
  padding:26px 32px;
  margin-top:40px;
}
.guarantee-strip .num{font-family:'Playfair Display', serif; font-size:2rem; color:var(--emerald); flex-shrink:0; font-weight:700;}
@media (max-width:600px){ .guarantee-strip{flex-direction:column; align-items:flex-start; gap:10px;} }

/* Steps */
.steps{counter-reset:step; list-style:none; margin:0; padding:0;}
.steps li{
  counter-increment:step;
  display:grid; grid-template-columns:56px 1fr; gap:20px;
  padding:26px 0; border-bottom:1px solid var(--rule-on-paper);
}
.steps li::before{
  content: counter(step);
  font-family:'Playfair Display', serif; font-size:1.5rem; color:var(--emerald); font-weight:700;
}

/* FAQ */
.faq-item{border-bottom:1px solid var(--rule-on-paper);}
.faq-q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  padding:22px 0; font-family:'Mulish', sans-serif; font-weight:700; font-size:1.02rem;
  display:flex; justify-content:space-between; align-items:center; gap:20px; color:var(--text-on-paper);
}
.faq-q .icon{font-family:'Playfair Display', serif; font-size:1.3rem; color:var(--emerald); flex-shrink:0;}
.faq-a{max-height:0; overflow:hidden; transition:max-height 0.25s ease;}
.faq-a p{padding-bottom:22px; color:var(--muted-on-paper); max-width:70ch;}
.faq-item.open .faq-a{max-height:600px;}

/* CTA band */
.cta-band{
  background:var(--emerald); color:var(--text-on-ink); text-align:center; padding:80px 0;
}
.cta-band h2{color:var(--text-on-ink);}

/* Contact / forms */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px;}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr;}}
.field{margin-bottom:20px;}
.field label{display:block; font-size:0.88rem; font-weight:700; margin-bottom:7px;}
.field input, .field textarea, .field select{
  width:100%; padding:13px 14px; border:1px solid var(--rule-on-paper); background:var(--paper);
  font-family:'Mulish', sans-serif; font-size:0.98rem; border-radius:var(--radius); color:var(--text-on-paper);
}
.field input:focus, .field textarea:focus, .field select:focus{outline:2px solid var(--emerald); outline-offset:1px;}
.contact-info-list{list-style:none; margin:0; padding:0;}
.contact-info-list li{padding:16px 0; border-bottom:1px solid var(--rule-on-paper);}
.contact-info-list b{display:block; font-size:0.82rem; color:var(--muted-on-paper); margin-bottom:4px; font-weight:700; letter-spacing:0.03em; text-transform:uppercase;}
.hours-table{width:100%; border-collapse:collapse; margin-top:6px;}
.hours-table td{padding:6px 0; font-size:0.92rem; border-bottom:1px solid var(--rule-on-paper);}
.hours-table td:first-child{color:var(--muted-on-paper); width:90px;}
.social-row{display:flex; gap:12px; margin-top:22px;}
.social-row a{
  width:38px; height:38px; border:1px solid var(--rule-on-paper); border-radius:var(--radius);
  display:flex; align-items:center; justify-content:center; text-decoration:none; color:var(--text-on-paper);
  font-size:0.82rem; font-weight:700;
}
.social-row a:hover{border-color:var(--emerald); color:var(--emerald);}

/* Legal pages */
.legal-body{max-width:74ch;}
.legal-body h2{font-size:1.32rem; margin-top:2em;}
.legal-body h3{font-size:1.06rem; margin-top:1.6em;}
.legal-body p, .legal-body li{color:var(--muted-on-paper); font-size:0.98rem;}
.legal-body ul{padding-left:1.2em;}
.legal-updated{color:var(--emerald); font-weight:700; font-size:0.9rem;}

/* Footer */
footer.site-footer{background:var(--ink); color:var(--muted-on-ink); padding:72px 0 0;}
.footer-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:56px;}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr; row-gap:36px;}}
@media (max-width:500px){.footer-grid{grid-template-columns:1fr;}}
.footer-grid h4{color:var(--text-on-ink); font-family:'Mulish', sans-serif; font-size:0.85rem; font-weight:700; margin-bottom:16px; letter-spacing:0.03em;}
.footer-grid ul{list-style:none; margin:0; padding:0;}
.footer-grid li{margin-bottom:11px;}
.footer-grid a{color:var(--muted-on-ink); text-decoration:none; font-size:0.94rem;}
.footer-grid a:hover{color:#7FC2A9;}
.footer-brand p{max-width:32ch; font-size:0.94rem;}
.footer-bottom{
  border-top:1px solid var(--rule-on-ink);
  padding:22px 0 28px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  font-size:0.85rem;
}
.footer-bottom a{color:var(--muted-on-ink); text-decoration:none;}

.skip-link{
  position:absolute; left:-999px; top:0; background:var(--emerald); color:var(--text-on-ink); padding:10px 16px; z-index:100; border-radius:var(--radius);
}
.skip-link:focus{left:12px; top:12px;}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{transition:none !important; animation:none !important;}
}
