/* Subpage styles (services, about) — matches the main site design system. */
:root{
  --ink:#17191C; --ink-2:#1F2227; --ink-3:#272B31; --bone:#ECEAE4; --bone-dim:#A4AAB2;
  --line:rgba(236,234,228,0.10); --line-strong:rgba(236,234,228,0.20);
  --clay:#C2632E; --clay-soft:#D07A44; --ember:#FF8217;
  --r-md:10px; --r:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--ink); color:var(--bone);
  font-family:"IBM Plex Sans",system-ui,-apple-system,sans-serif;
  line-height:1.7; -webkit-font-smoothing:antialiased;
}
a{color:var(--ember); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:760px; margin:0 auto; padding:0 22px}

/* header */
.site-head{
  position:sticky; top:0; z-index:10; background:rgba(23,25,28,.85);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--line);
}
.site-head .wrap{display:flex; align-items:center; justify-content:space-between; height:64px; gap:20px; max-width:1140px}
.brand{display:flex; align-items:center; gap:11px; color:var(--bone)}
.brand:hover{text-decoration:none}
.brand img{width:34px; height:34px; border-radius:7px}
.brand b{font-family:"Archivo",sans-serif; font-weight:700; letter-spacing:.02em; text-transform:uppercase; font-size:.95rem}
.nav-links{display:flex; align-items:center; gap:26px}
.nav-links a.link{font-size:14px; color:var(--bone-dim); transition:color .2s ease; white-space:nowrap}
.brand b{white-space:nowrap}
.nav-links a.link:hover{color:var(--bone); text-decoration:none}
.nav-cta{display:flex; align-items:center; gap:14px}
.menu-toggle{display:none; background:none; border:0; color:var(--bone); cursor:pointer; padding:6px}
.menu-toggle svg{width:24px; height:24px; display:block}
.mobile-menu{display:none; position:fixed; inset:64px 0 auto 0; z-index:55; background:var(--ink-2); border-bottom:1px solid var(--line); transform:translateY(-12px); opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s ease}
.mobile-menu.open{opacity:1; transform:none; pointer-events:auto}
.mobile-menu a{display:block; padding:14px 22px; border-bottom:1px solid var(--line); font-size:15px; color:var(--bone)}
.mobile-menu a:last-child{border-bottom:0}
@media (max-width:960px){
  .nav-links{display:none}
  .menu-toggle{display:block}
  .mobile-menu{display:block}
}
.book-btn{
  background:var(--clay); color:#fff; padding:9px 16px; border-radius:var(--r-md);
  font-weight:600; font-size:.9rem; white-space:nowrap;
  display:inline-block; transition:transform .15s ease, background .2s ease, box-shadow .2s ease;
}
.book-btn:hover{background:var(--clay-soft); transform:translateY(-3px); box-shadow:0 10px 22px rgba(194,99,46,0.30); text-decoration:none}

/* article */
main{padding:48px 0 24px}
.crumb{font-family:"IBM Plex Mono",monospace; font-size:.78rem; color:var(--bone-dim); margin-bottom:18px}
.crumb a{color:var(--bone-dim)}
.crumb a:hover{color:var(--ember)}
.crumb span{margin:0 6px; opacity:.6}
.eyebrow{
  font-family:"IBM Plex Mono",monospace; font-size:.72rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ember);
}
article h1{
  font-family:"Archivo",sans-serif; font-weight:800; line-height:1.15;
  font-size:clamp(1.9rem,5vw,2.7rem); margin:.5rem 0 1.2rem;
}
article h2{font-family:"Archivo",sans-serif; font-weight:700; font-size:1.5rem; margin:2.2rem 0 .8rem}
article h3{font-family:"Archivo",sans-serif; font-weight:600; font-size:1.2rem; margin:1.8rem 0 .6rem}
article p{margin:0 0 1.2rem}
article p.lead{font-size:1.08rem; color:var(--bone-dim)}
article p.lead a{color:var(--ember)}
article ul,article ol{margin:0 0 1.2rem; padding-left:1.3rem}
article li{margin:.4rem 0}
article strong{color:#fff}
article img.about-photo{max-width:340px; width:100%; height:auto; border-radius:14px; border:1px solid var(--line-strong); margin:0 0 1.6rem}
.pricing-note{border-left:3px solid var(--clay); padding:.4rem 0 .4rem 1.1rem; color:var(--bone-dim)}
.pricing-note strong{color:var(--bone)}

/* FAQ */
.faq{border-top:1px solid var(--line); margin-bottom:1.6rem}
details.qa{border-bottom:1px solid var(--line)}
details.qa summary{
  list-style:none; cursor:pointer; padding:18px 0; display:flex; justify-content:space-between; gap:20px; align-items:center;
  font-family:"Archivo",sans-serif; font-weight:600; font-size:1.05rem;
}
details.qa summary::-webkit-details-marker{display:none}
details.qa summary .pl{font-family:"IBM Plex Mono",monospace; color:var(--clay-soft); transition:transform .2s ease; flex:none}
details.qa[open] summary .pl{transform:rotate(45deg)}
details.qa .ans{padding:0 0 20px; color:var(--bone-dim); max-width:680px}

/* CTA */
.cta{
  margin:2.6rem 0 1rem; padding:24px; border-radius:14px;
  background:linear-gradient(180deg,rgba(194,99,46,.12),rgba(194,99,46,.04));
  border:1px solid var(--line);
}
.cta h3{margin:.2rem 0 .5rem; font-family:"Archivo",sans-serif}
.cta p{margin:0 0 1rem; color:var(--bone-dim)}

/* related cards */
.related{margin-top:2.4rem}
.rel-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px; margin-top:1rem}
.rel-card{
  display:block; border:1px solid var(--line); border-radius:12px; padding:18px; background:var(--ink-2);
  color:var(--bone); transition:transform .18s ease, border-color .18s ease;
}
.rel-card:hover{transform:translateY(-3px); border-color:var(--clay); text-decoration:none}
.rel-kicker{display:block; font-family:"IBM Plex Mono",monospace; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--bone-dim); margin-bottom:8px}
.rel-card b{font-family:"Archivo",sans-serif; font-weight:700}

/* services index cards */
.svc-list{display:grid; gap:16px; margin:1.8rem 0}
.svc-card{
  display:block; border:1px solid var(--line-strong); border-radius:14px; padding:24px; background:var(--ink-2);
  color:var(--bone); transition:transform .18s ease, border-color .18s ease;
}
.svc-card:hover{transform:translateY(-3px); border-color:var(--clay); text-decoration:none}
.svc-card b{font-family:"Archivo",sans-serif; font-weight:700; font-size:1.2rem}
.svc-card p{margin:.5rem 0 .6rem; color:var(--bone-dim)}
.read{font-family:"IBM Plex Mono",monospace; font-size:.82rem; color:var(--clay-soft)}

/* sticky mobile book bar */
.mobile-book{display:none}
@media (max-width:560px){
  body{padding-bottom:72px}
  .mobile-book{
    display:flex; position:fixed; bottom:0; left:0; right:0; z-index:70;
    gap:10px; padding:12px 16px; background:rgba(23,25,28,.95); backdrop-filter:blur(10px);
    border-top:1px solid var(--line);
  }
  .mobile-book a{flex:1; text-align:center; padding:12px; border-radius:10px; font-weight:600; font-size:15px}
  .mobile-book a:hover{text-decoration:none}
  .mobile-book .mb-ghost{border:1px solid var(--line-strong); color:var(--bone)}
  .mobile-book .mb-solid{background:var(--clay); color:#fff}
}

/* footer */
.site-foot{border-top:1px solid var(--line); margin-top:40px; padding:36px 0; color:var(--bone-dim); font-size:.9rem}
.foot-cols{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:26px; margin-bottom:26px}
.foot-cols h4{font-family:"IBM Plex Mono",monospace; font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--bone-dim); margin:0 0 12px; font-weight:500}
.foot-cols a{display:block; color:var(--bone); font-size:.88rem; margin-bottom:8px}
.foot-cols a:hover{color:var(--ember)}
.foot-nap{font-family:"IBM Plex Mono",monospace; font-size:.75rem; letter-spacing:.02em; border-top:1px solid var(--line); padding-top:20px; margin:0 0 8px}
.foot-credit{font-size:.78rem; margin:0}
.foot-credit a{color:var(--clay-soft)}