/* Kitchen & bathroom service pages — builds on style.css */
.svc-hero { position:relative; min-height:min(78vh,680px); display:flex; align-items:flex-end; overflow:hidden; color:#fff; border-bottom:4px solid var(--brass); background:var(--navy); }
.svc-hero > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform-origin:60% 40%; animation:kenburns 18s ease-out both; }
.svc-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,34,64,.15) 0%, rgba(20,34,64,.35) 45%, rgba(20,34,64,.92) 100%); }
.svc-hero .wrap { position:relative; z-index:2; width:100%; padding-top:120px; padding-bottom:64px; }
.svc-hero .crumbs { font-size:13px; color:#c3c9d8; margin-bottom:18px; }
.svc-hero .crumbs a:hover { color:var(--brass); }
.svc-hero h1 { font-size:clamp(44px,7vw,92px); line-height:.95; color:#fff; max-width:12ch; }
.svc-hero h1 .loc { display:block; font-size:.28em; line-height:1.3; letter-spacing:.06em; color:var(--brass); margin-top:14px; }
.svc-hero p.lede { color:#dfe3ec; font-size:18px; max-width:40ch; margin:18px 0 28px; }
.svc-hero .hero-actions { flex-wrap:wrap; }
.svc-hero .rise { animation:rise .8s cubic-bezier(.2,.7,.2,1) both; }
.svc-hero .rise:nth-child(2){animation-delay:.1s} .svc-hero .rise:nth-child(3){animation-delay:.22s} .svc-hero .rise:nth-child(4){animation-delay:.34s}
@keyframes kenburns { from { transform:scale(1.14); } to { transform:scale(1); } }
@keyframes rise { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:none; } }

/* Stats strip */
.svc-stats { background:var(--navy); color:#fff; }
.svc-stats .wrap { display:grid; grid-template-columns:repeat(4,1fr); }
.svc-stat { padding:34px 20px; text-align:center; border-left:1px solid rgba(255,255,255,.12); }
.svc-stat:first-child { border-left:none; }
.svc-stat .fig { font-family:var(--serif); font-weight:700; font-size:clamp(38px,4.4vw,54px); line-height:1; color:var(--brass); }
.svc-stat .lbl { font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:#c3c9d8; margin-top:8px; }
a.svc-stat:hover .lbl { color:#fff; }

/* Icon tiles */
.svc-tiles { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.svc-tile { background:#fff; border:1px solid var(--line); border-bottom:4px solid var(--navy); padding:30px 24px; display:flex; align-items:center; gap:18px; transition:transform .25s, border-color .25s, box-shadow .25s; }
.svc-tile svg { flex:none; width:52px; height:52px; stroke:var(--brass); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.svc-tile h3 { font-size:19px; color:var(--navy); }
.svc-tile:hover { transform:translateY(-6px); border-bottom-color:var(--brass); box-shadow:0 14px 30px rgba(20,34,64,.12); }

/* Photo duo */
.svc-photos { display:grid; grid-template-columns:1.4fr 1fr; gap:18px; }
.svc-photo { position:relative; overflow:hidden; margin:0; min-height:420px; background:var(--navy); }
.svc-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.svc-photo:hover img { transform:scale(1.06); }
.svc-photo figcaption { position:absolute; left:0; bottom:0; right:0; padding:60px 26px 22px; background:linear-gradient(180deg,transparent,rgba(20,34,64,.9)); color:#fff; font-family:var(--serif); font-weight:600; font-size:22px; text-transform:uppercase; letter-spacing:.02em; }

/* Process with drawing line */
.svc-steps { position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; list-style:none; }
.svc-steps::before { content:''; position:absolute; top:34px; left:12%; right:12%; height:4px; background:var(--line); }
.svc-steps::after { content:''; position:absolute; top:34px; left:12%; width:76%; height:4px; background:var(--brass); transform:scaleX(var(--p,1)); transform-origin:left; transition:transform 1.6s cubic-bezier(.4,0,.2,1); }
.svc-steps li { position:relative; z-index:1; text-align:center; }
.svc-steps .dot { width:72px; height:72px; margin:0 auto 18px; border-radius:50%; background:var(--navy); border:4px solid var(--brass); display:flex; align-items:center; justify-content:center; }
.svc-steps .dot svg { width:32px; height:32px; stroke:#fff; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.svc-steps h3 { font-size:18px; color:var(--navy); margin-bottom:6px; }
.svc-steps p { color:var(--text-muted); font-size:14px; max-width:22ch; margin:0 auto; }

/* FAQ */
.faq { max-width:820px; }
.faq details { border-bottom:1px solid var(--line); }
.faq summary { cursor:pointer; list-style:none; padding:22px 44px 22px 0; font-weight:600; font-size:18px; position:relative; color:var(--navy); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; position:absolute; right:4px; top:12px; font-family:var(--serif); font-size:32px; color:var(--brass); transition:transform .2s; }
.faq details[open] summary::after { transform:rotate(45deg); }
.faq details p { color:var(--text-muted); margin:0 0 24px; max-width:60ch; }

/* CTA */
.cta-band .phone-big { display:block; font-family:var(--serif); font-size:clamp(40px,7vw,72px); font-weight:700; color:#fff; line-height:1; margin:6px 0 28px; }
.cta-band .phone-big:hover { color:var(--brass); }
.cta-band .areas { font-size:13px; color:#8f97ab; margin:30px 0 0; }

/* Reveal on scroll (only when JS is running) */
.js .reveal { opacity:0; transform:translateY(34px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); transition-delay:calc(var(--i,0) * 90ms); }
.js .reveal.in { opacity:1; transform:none; }
.js .svc-steps:not(.in)::after { --p:0; }

@media (max-width:880px) {
  .svc-stats .wrap { grid-template-columns:1fr 1fr; }
  .svc-stat:nth-child(3) { border-left:none; }
  .svc-stat { border-top:1px solid rgba(255,255,255,.12); padding:26px 12px; }
  .svc-tiles { grid-template-columns:1fr 1fr; gap:12px; }
  .svc-tile { flex-direction:column; align-items:flex-start; padding:22px 18px; gap:12px; }
  .svc-tile h3 { font-size:16px; }
  .svc-photos { grid-template-columns:1fr; }
  .svc-photo { min-height:280px; }
  .svc-steps { grid-template-columns:1fr; gap:28px; }
  .svc-steps::before, .svc-steps::after { top:0; bottom:0; left:36px; right:auto; width:4px; height:auto; }
  .svc-steps::after { transform:scaleY(var(--p,1)); transform-origin:top; }
  .svc-steps li { display:grid; grid-template-columns:72px 1fr; gap:0 18px; text-align:left; align-items:center; }
  .svc-steps .dot { margin:0; grid-row:span 2; }
  .svc-steps p { margin:0; max-width:none; }
  .svc-hero .hero-actions .btn { flex:1; text-align:center; }
}
@media (prefers-reduced-motion:reduce) {
  .svc-hero > img, .svc-hero .rise { animation:none; }
  .js .reveal { opacity:1; transform:none; transition:none; }
  .svc-steps::after, .svc-tile, .svc-photo img { transition:none; }
  .js .svc-steps:not(.in)::after { --p:1; }
}