/* Shared styles for the service, suburb, help-article and product pages.
   Matches the look of the homepage (index.html), which keeps its own inline copy. */
:root{
  --ink:#182420; --ink-soft:#4A5A54; --paper:#FFFFFF; --paper-raised:#F7F7F4;
  --brass:#A9711F; --brass-deep:#8A5B18; --moss:#3F5D4E; --moss-soft:#EDF1EA;
  --line:rgba(24,36,32,0.13); --shadow:rgba(24,36,32,0.08); --focus:#1F6F5C;
  --font-display:'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --wrap:1120px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-body); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;}
img,svg{max-width:100%; display:block;}
a{color:inherit;}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 28px;}
h1,h2,h3{font-family:var(--font-display); font-weight:600; margin:0; line-height:1.12; letter-spacing:-0.01em;}
p{margin:0;}
:focus-visible{outline:2px solid var(--focus); outline-offset:3px; border-radius:2px;}
@media (prefers-reduced-motion: reduce){ *{transition-duration:0.001ms !important; scroll-behavior:auto !important;} }

/* header */
header{position:sticky; top:0; z-index:40; background:rgba(10,10,11,0.94); backdrop-filter:blur(10px); border-bottom:1px solid rgba(245,243,233,0.10);}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:var(--wrap); margin:0 auto;}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
.brand-logo{height:34px; width:auto; flex:none;}
.nav-links{display:flex; align-items:center; gap:28px; list-style:none; margin:0; padding:0;}
.nav-links a{text-decoration:none; font-size:0.96rem; color:rgba(245,243,233,0.68); transition:color .15s ease;}
.nav-links a:hover, .nav-links a[aria-current]{color:#F5F3E9;}
.nav-right{display:flex; align-items:center; gap:18px;}
.phone-link{display:flex; align-items:center; gap:8px; text-decoration:none; font-size:0.95rem; color:#F5F3E9; white-space:nowrap;}
.phone-link svg{width:16px; height:16px; stroke:var(--brass);}
.menu-toggle{display:none; background:none; border:none; cursor:pointer; padding:6px;}
.menu-toggle span{display:block; width:22px; height:2px; background:#F5F3E9; margin:5px 0;}
@media (max-width:900px){
  .nav-links{position:fixed; inset:64px 0 auto 0; margin:0; padding:18px 28px 26px; flex-direction:column; align-items:flex-start; gap:16px;
    background:rgba(10,10,11,0.98); border-bottom:1px solid rgba(245,243,233,0.10); transform:translateY(-12px); opacity:0; pointer-events:none; transition:transform .18s ease, opacity .18s ease;}
  .nav-links.open{transform:translateY(0); opacity:1; pointer-events:auto;}
  .phone-link{display:none;}
  .menu-toggle{display:block;}
}

/* buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; padding:11px 22px; border-radius:3px; font-family:var(--font-body); font-weight:600; font-size:0.95rem; text-decoration:none; cursor:pointer; border:1px solid transparent; transition:transform .15s ease, background .15s ease, border-color .15s ease; white-space:nowrap;}
.btn-primary{background:var(--moss); color:#F5F3E9;}
.btn-primary:hover{transform:translateY(-1px); background:var(--focus);}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line);}
.btn-ghost:hover{border-color:var(--ink-soft);}
.btn-brass{background:var(--brass); color:#171412;}
.btn-brass:hover{transform:translateY(-1px); background:var(--brass-deep);}
header .btn-primary{background:var(--brass); color:#171412;}
header .btn-primary:hover{background:var(--brass-deep);}

/* page hero */
.crumbs{font-size:0.86rem; color:var(--ink-soft); padding-top:28px;}
.crumbs ol{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px;}
.crumbs li+li::before{content:"/"; margin-right:6px; color:var(--line);}
.crumbs a{text-decoration:none;}
.crumbs a:hover{color:var(--moss);}
.page-hero{padding:34px 0 56px; border-bottom:1px solid var(--line);}
.kicker{font-family:var(--font-display); font-style:italic; color:var(--moss); font-size:1.05rem; margin-bottom:12px;}
.page-hero h1{font-size:clamp(2.1rem, 4.2vw, 3.3rem); max-width:22ch;}
.page-hero .lede{margin-top:20px; font-size:1.12rem; color:var(--ink-soft); max-width:58ch; line-height:1.65;}
.page-hero .actions{display:flex; gap:12px; flex-wrap:wrap; margin-top:28px;}
.page-hero .meta{margin-top:18px; font-size:0.9rem; color:var(--ink-soft);}

/* layout */
.page-body{padding:64px 0 80px;}
.page-grid{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:64px; align-items:start;}
@media (max-width:900px){ .page-grid{grid-template-columns:1fr; gap:40px;} }

.prose{max-width:68ch;}
.prose h2{font-size:1.7rem; margin:44px 0 14px;}
.prose h2:first-child{margin-top:0;}
.prose h3{font-size:1.2rem; margin:28px 0 10px;}
.prose p{color:var(--ink-soft); font-size:1.04rem; line-height:1.75; margin-bottom:16px;}
.prose ul, .prose ol{color:var(--ink-soft); font-size:1.02rem; line-height:1.7; padding-left:22px; margin:0 0 18px;}
.prose li{margin-bottom:6px;}
.prose strong{color:var(--ink);}
.prose a{color:var(--moss); font-weight:600;}
.prose figure{margin:28px 0; border-radius:6px; overflow:hidden; border:1px solid var(--line);}
.prose figure img{width:100%; height:auto;}
.prose figcaption{padding:10px 14px; font-size:0.86rem; color:var(--ink-soft); background:var(--paper-raised);}

/* sidebar card */
.side-card{position:sticky; top:96px; background:var(--paper-raised); border:1px solid var(--line); border-radius:6px; padding:26px 24px;}
.side-card h2{font-size:1.25rem; margin-bottom:14px;}
.side-card dl{margin:0 0 20px; font-size:0.94rem;}
.side-card dt{font-size:0.8rem; color:var(--ink-soft); margin-top:12px;}
.side-card dd{margin:0;}
.side-card a{color:var(--moss);}
.side-card .btn{width:100%; margin-top:10px;}
.side-card .btn-primary{color:#F5F3E9;}
.side-card .btn-ghost{color:var(--ink);}
@media (max-width:900px){ .side-card{position:static;} }

/* faq */
.faq{margin-top:44px; border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line); padding:18px 0;}
.faq summary{cursor:pointer; font-family:var(--font-display); font-size:1.1rem; font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:16px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; color:var(--moss); font-size:1.3rem; line-height:1;}
.faq details[open] summary::after{content:"–";}
.faq details p{margin-top:10px; color:var(--ink-soft);}

/* link cards */
.band{padding:72px 0; background:var(--paper-raised); border-top:1px solid var(--line);}
.band h2{font-size:clamp(1.6rem,2.8vw,2.1rem); margin-bottom:28px;}
.card-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:20px;}
.link-card{display:flex; flex-direction:column; gap:8px; text-decoration:none; background:var(--paper); border:1px solid var(--line); border-radius:6px; padding:22px; transition:transform .15s ease, box-shadow .15s ease;}
.link-card:hover{transform:translateY(-2px); box-shadow:0 14px 30px -20px var(--shadow);}
.link-card h3{font-size:1.12rem;}
.link-card p{color:var(--ink-soft); font-size:0.93rem;}
.link-card .go{margin-top:auto; padding-top:6px; font-weight:600; font-size:0.9rem; color:var(--moss);}
.chip-list{display:flex; flex-wrap:wrap; gap:10px; list-style:none; margin:0; padding:0;}
.chip-list a{display:inline-block; padding:8px 14px; border:1px solid var(--line); border-radius:20px; text-decoration:none; font-size:0.92rem; background:var(--paper);}
.chip-list a:hover{border-color:var(--moss); color:var(--moss);}

/* cta band */
.cta-band{margin-top:48px; padding:26px 28px; border-radius:6px; background:var(--moss-soft); border:1px solid var(--line); display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between;}
.cta-band h2, .cta-band h3{font-size:1.3rem; margin:0;}
.cta-band p{color:var(--ink-soft); font-size:0.95rem; margin:4px 0 0;}
.cta-band .cta-actions{display:flex; gap:12px; flex-wrap:wrap;}

/* product page */
.product-layout{display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:start;}
@media (max-width:860px){ .product-layout{grid-template-columns:1fr; gap:32px;} }
.product-photo{border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--moss-soft); aspect-ratio:4/3; display:grid; place-items:center;}
.product-photo img{width:100%; height:100%; object-fit:cover;}
.product-photo svg{width:96px; height:96px; stroke:var(--moss);}
.price{font-family:var(--font-display); font-size:2rem; margin-top:18px;}
.price small{font-family:var(--font-body); font-size:0.85rem; color:var(--ink-soft); margin-left:8px;}
.badge{display:inline-block; font-family:var(--font-display); font-style:italic; font-size:0.92rem; color:var(--moss); background:var(--moss-soft); padding:4px 12px; border-radius:20px; margin-top:14px;}
.badge.gone{color:var(--brass-deep);}
.spec-list{list-style:none; margin:22px 0 0; padding:0; border-top:1px solid var(--line);}
.spec-list li{padding:10px 0; border-bottom:1px solid var(--line); font-size:0.96rem;}

/* footer */
footer{padding:56px 0 40px; border-top:1px solid var(--line);}
.footer-top{display:flex; justify-content:space-between; align-items:flex-start; gap:40px; flex-wrap:wrap; padding-bottom:36px; border-bottom:1px solid var(--line);}
.footer-logo{height:30px; width:auto;}
.footer-note{margin-top:14px; color:var(--ink-soft); font-size:0.92rem; max-width:34ch;}
.footer-links{display:flex; gap:48px; flex-wrap:wrap;}
.footer-col h4{font-size:0.85rem; color:var(--ink-soft); font-weight:600; margin:0 0 12px;}
.footer-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px;}
.footer-col a{text-decoration:none; font-size:0.94rem; color:var(--ink);}
.footer-col a:hover{color:var(--moss);}
.footer-col address{font-style:normal; font-size:0.94rem; line-height:1.7;}
.footer-bottom{display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:26px; font-size:0.85rem; color:var(--ink-soft);}

/* mobile action bar */
.action-bar{display:none;}
@media (max-width:860px){
  .action-bar{position:fixed; left:0; right:0; bottom:0; z-index:45; display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:8px; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); background:rgba(10,10,11,0.96); border-top:1px solid rgba(245,243,233,0.12);}
  .action-bar .btn{padding:11px 8px; font-size:0.9rem;}
  .action-bar .btn-ghost{color:#F5F3E9; border-color:rgba(245,243,233,0.3);}
  body{padding-bottom:72px;}
}
