/* Landing page template. Layout only; colours and fonts come from base.css. */
header.site{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:1px solid var(--rule)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);min-height:4rem}
.brand{font:600 1.25rem var(--font-display);color:var(--ink);text-decoration:none;letter-spacing:-.01em}
.nav{display:none;gap:var(--s4)}
.nav a{color:var(--muted);text-decoration:none;font-weight:500}
.nav a:hover{color:var(--ink)}
@media(min-width:48rem){.nav{display:flex}}

.hero{padding:var(--s7) 0 var(--s8);display:grid;gap:var(--s6)}
.hero .copy{animation:rise 500ms var(--ease) both}
.hero .lede{font-size:var(--text-lg);line-height:1.5;color:var(--muted);margin:var(--s4) 0 var(--s5)}
.actions{display:flex;flex-wrap:wrap;gap:var(--s3)}
@keyframes rise{from{opacity:0;transform:translateY(12px)}}
@media(min-width:60rem){
  .hero{grid-template-columns:repeat(12,1fr);column-gap:var(--s5);align-items:end}
  .hero .copy{grid-column:1/8}
  .ledger{grid-column:9/13}
}
.ledger{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:var(--s4)}
.status{display:flex;align-items:center;gap:var(--s2);font:600 var(--text-base) var(--font-text);margin:0 0 var(--s3)}
.status::before{content:"";width:.7rem;height:.7rem;border-radius:50%;background:var(--muted);flex:none}
.status.is-open::before{background:#2f9e6b;box-shadow:0 0 0 4px rgba(47,158,107,.18)}
.hours{list-style:none;margin:0 0 var(--s3);padding:0;font-size:var(--text-sm)}
.hours li{display:flex;justify-content:space-between;gap:var(--s3);padding:var(--s1) 0;border-bottom:1px solid var(--rule);color:var(--muted)}
.hours li[aria-current]{color:var(--ink);font-weight:600}
.ledger .area{margin:0;font-size:var(--text-sm);color:var(--muted)}

section{padding:var(--s7) 0;border-top:1px solid var(--rule)}
.split{display:grid;gap:var(--s4)}
@media(min-width:60rem){.split{grid-template-columns:repeat(12,1fr);column-gap:var(--s5)}.split>h2{grid-column:1/5}.split>:not(h2){grid-column:5/13}}
.rows{margin:0;padding:0;list-style:none}
.rows li{display:grid;gap:var(--s1);padding:var(--s4) 0;border-bottom:1px solid var(--rule)}
.rows li:first-child{padding-top:0}
.rows p{margin:0;color:var(--muted)}
.rows .price{font-weight:600;color:var(--ink)}
@media(min-width:40rem){.rows li{grid-template-columns:1fr auto;column-gap:var(--s5)}.rows li>div{grid-column:1}.rows .price{grid-column:2;grid-row:1}}

.steps{list-style:none;margin:0;padding:0;display:grid;gap:var(--s5);counter-reset:s}
.steps li{counter-increment:s;border-top:2px solid var(--ink);padding-top:var(--s3)}
.steps li::before{content:counter(s);display:block;font:600 var(--text-xl)/1 var(--font-display);color:var(--accent);margin-bottom:var(--s2)}
.steps p{margin:var(--s1) 0 0;color:var(--muted)}
@media(min-width:48rem){.steps{grid-template-columns:repeat(3,1fr);gap:var(--s5)}}
#how .head{margin-bottom:var(--s5)}

.dots{list-style:none;margin:var(--s3) 0 0;padding:0}
.dots li{padding:var(--s1) 0 var(--s1) var(--s4);position:relative}
.dots li::before{content:"";position:absolute;left:0;top:.8em;width:.45rem;height:.45rem;border-radius:50%;background:var(--accent)}

details{border-bottom:1px solid var(--rule);padding:var(--s3) 0}
details:first-of-type{border-top:1px solid var(--rule)}
summary{cursor:pointer;font:600 var(--text-base) var(--font-text);min-height:2.75rem;display:flex;align-items:center;justify-content:space-between;gap:var(--s3);list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:1.5rem;color:var(--accent);line-height:1}
details[open] summary::after{content:"\2212"}
details p{margin:var(--s2) 0 0;color:var(--muted)}

.contact{background:var(--accent);color:var(--on-accent);border-top:0;padding:var(--s8) 0}
.contact h2{font-size:clamp(1.75rem,1rem + 3vw,3rem)}
.contact p{color:#e3f1ea}
.contact a{color:var(--on-accent)}
.contact .btn{background:var(--on-accent);color:var(--accent-dark);border-color:var(--on-accent)}
.contact .btn:hover{background:var(--surface)}
.contact .btn.ghost{background:transparent;color:var(--on-accent);border-color:var(--on-accent)}
.contact .btn.ghost:hover{background:rgba(255,255,255,.12)}
.contact :focus-visible{outline-color:var(--on-accent)}
.contact address{font-style:normal;margin-top:var(--s5);color:#e3f1ea}

footer.site{padding:var(--s5) 0 var(--s6);font-size:var(--text-sm);color:var(--muted)}
footer.site .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2) var(--s5)}

.callbar{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:var(--s3) var(--s3) calc(var(--s3) + env(safe-area-inset-bottom,0px));background:var(--paper);border-top:1px solid var(--rule);opacity:0;visibility:hidden;transform:translateY(100%);transition:opacity 200ms var(--ease),transform 200ms var(--ease),visibility 0s linear 200ms}
.callbar.show{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.callbar .btn{width:100%}
@media(max-width:59.99rem){footer.site{padding-bottom:calc(var(--s6) + 4.5rem)}}
@media(min-width:60rem){.callbar{display:none}}