/* ============================================================
   SPRINT DRIVING SCHOOL — full website layer
   Extends sprint.css with multi-page components:
   site nav active state, mobile nav, breadcrumb, page hero,
   suburb pages, regions grid, service pages, contact, etc.
   ============================================================ */

body.sprint-site{padding-top:0}

/* ---------- link-card reset ----------
   Any <a> used as a content card (feat / pcard / svc-mini / region tile)
   must NOT inherit default link blue/underline. Children inherit ink. */
a.feat, a.svc-mini, a.pcard,
a.glass, a.glass-soft{color:var(--ink); text-decoration:none}
a.feat *, a.svc-mini *, a.pcard *,
a.glass:not(.btn) *, a.glass-soft *{color:inherit}
/* keep the orange "Learn more" accent + headings legible inside link cards */
a.feat h3, a.pcard h3{color:var(--ink)}
a.feat:hover h3, a.pcard:hover h3, a.svc-mini:hover b{color:var(--org-hi)}

/* ---------- section bands (replace video-behind-everything) ----------
   Lightweight, CSS-only section treatments. Used to give rhythm to the
   page instead of an ambient video behind every block. */
.band{position:relative}
.band>.wrap{position:relative; z-index:1}

/* panel: a softly raised glass slab with a faint orange-to-navy wash */
.band-panel{background:
  radial-gradient(120% 100% at 50% 0%, rgba(251,112,0,.05), transparent 55%),
  linear-gradient(180deg, rgba(255,255,255,.022), rgba(255,255,255,0) 30%);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
body.t-light .band-panel{background:
  radial-gradient(120% 100% at 50% 0%, rgba(251,112,0,.06), transparent 55%),
  linear-gradient(180deg, rgba(22,49,63,.025), rgba(22,49,63,0) 30%)}

/* glow: a single warm radial bloom centred at the top of the section */
.band-glow::before{content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(60% 55% at 50% -5%, rgba(251,112,0,.13), transparent 60%)}

/* grid: faint engineering grid, very subtle, fades top & bottom */
.band-grid::before{content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent);
          mask-image:linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent)}
body.t-light .band-grid::before{background-image:linear-gradient(rgba(22,49,63,.05) 1px, transparent 1px),linear-gradient(90deg, rgba(22,49,63,.05) 1px, transparent 1px)}

/* dots: subtle dotted field, used sparingly */
.band-dots::before{content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.6;
  background-image:radial-gradient(rgba(251,112,0,.12) 1px, transparent 1.4px);
  background-size:30px 30px;
  -webkit-mask-image:radial-gradient(75% 60% at 50% 40%, #000, transparent 75%);
          mask-image:radial-gradient(75% 60% at 50% 40%, #000, transparent 75%)}

/* hairline rule between plain sections, so the rhythm still reads */
.band-rule{border-top:1px solid var(--line)}

/* inline body links inside prose/content default to the brand orange,
   never browser blue. Card/nav/footer/button links are handled above. */
.local-main a:not(.btn):not([class]),
.prose a:not(.btn):not([class]),
.side-quote a:not(.btn){color:var(--org-hi); text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px}
.local-main a:hover, .prose a:hover{color:var(--org)}

/* nav active link */
.site-nav nav a.on{color:var(--ink); background:rgba(251,112,0,.16)}

/* ---------- mobile nav ---------- */
.mnav-toggle{display:none; position:fixed; top:20px; right:18px; z-index:95;
  width:46px; height:46px; border-radius:14px; border:1px solid var(--line);
  background:linear-gradient(135deg,rgba(15,39,51,.9),rgba(9,26,35,.82));
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  flex-direction:column; align-items:center; justify-content:center; gap:5px; cursor:pointer}
.mnav-toggle span{display:block; width:20px; height:2px; border-radius:2px; background:var(--ink); transition:transform .35s var(--ease), opacity .25s}
.mnav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mnav-toggle.open span:nth-child(2){opacity:0}
.mnav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mnav{position:fixed; inset:0; z-index:94; background:rgba(7,18,24,.97);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  opacity:0; pointer-events:none; transition:opacity .35s var(--ease)}
.mnav.open{opacity:1; pointer-events:auto}
.mnav a{font-family:'Sora'; font-weight:700; font-size:1.45rem; color:var(--ink-soft); text-decoration:none; padding:.5rem 1rem}
.mnav a:hover{color:var(--org)}
.mnav .btn{margin-top:14px; font-size:1.05rem}
@media(max-width:840px){
  .site-nav nav{display:none}
  .mnav-toggle{display:flex}
  .site-nav .btn{display:none}
}

/* ---------- breadcrumb ---------- */
.crumb{display:flex; align-items:center; gap:.5em; flex-wrap:wrap;
  padding-top:104px; padding-bottom:0; font-size:.82rem; color:var(--ink-mute)}
.crumb a{color:var(--ink-mute); text-decoration:none; transition:color .3s}
.crumb a:hover{color:var(--org)}
.crumb span{color:var(--ink-soft); font-weight:600}
.crumb svg{width:.85em; height:.85em; color:var(--ink-mute); opacity:.6; flex:none}
@media(max-width:600px){.crumb{padding-top:92px}}

/* ---------- page hero (inner pages) ---------- */
.page-hero{padding-top:clamp(40px,6vw,64px); padding-bottom:clamp(40px,6vw,70px); text-align:center}
.page-hero .shead{max-width:820px}

/* ---------- suburb hero (CSS-only, no video) ---------- */
.sub-hero{position:relative; padding-top:clamp(34px,5vw,54px); padding-bottom:clamp(44px,6vw,72px); overflow:hidden}
.sub-hero::before{content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(70% 80% at 8% 0%, rgba(251,112,0,.14), transparent 55%),
            radial-gradient(60% 70% at 100% 100%, rgba(44,91,114,.22), transparent 60%)}
.sub-hero .wrap{position:relative; z-index:1}

/* ---------- local content layout ---------- */
.sec-local{padding-top:clamp(40px,6vw,72px)}
.local-grid{display:grid; grid-template-columns:1.6fr .9fr; gap:clamp(28px,4vw,52px); align-items:start}
.local-main h2{font-size:clamp(1.7rem,3.2vw,2.3rem); margin-bottom:16px}
.local-main h3{margin:30px 0 12px; font-size:1.2rem}
.local-main p{color:var(--ink-soft); font-size:1.02rem}
.local-main>p:first-of-type{font-size:1.08rem}
@media(max-width:900px){.local-grid{grid-template-columns:1fr}}

/* nearest test centre card */
.centre-card{display:flex; gap:18px; padding:24px 26px; margin:26px 0; align-items:flex-start}
.centre-card .centre-ic{width:48px;height:48px;border-radius:14px;flex:none;display:flex;align-items:center;justify-content:center;
  background:rgba(251,112,0,.14); border:1px solid var(--line-org)}
.centre-card .centre-ic svg{width:24px;height:24px;color:var(--org)}
.centre-card .centre-lbl{display:block; font:700 .68rem/1 'Inter'; letter-spacing:.2em; text-transform:uppercase; color:var(--org); margin-bottom:6px}
.centre-card b{display:block; font-family:'Sora'; font-weight:800; font-size:1.3rem; color:var(--ink); margin-bottom:6px}
.centre-card p{margin:0; color:var(--ink-soft); font-size:.96rem}

/* tick list */
.tick-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px}
.tick-list li{position:relative; padding-left:30px; color:var(--ink-soft); font-size:1rem; line-height:1.5}
.tick-list li::before{content:""; position:absolute; left:0; top:3px; width:19px; height:19px; border-radius:6px;
  background:rgba(55,224,139,.16); border:1px solid rgba(55,224,139,.4)}
.tick-list li::after{content:""; position:absolute; left:6px; top:7px; width:7px; height:4px;
  border-left:2px solid var(--green); border-bottom:2px solid var(--green); transform:rotate(-45deg)}

/* sidebar */
.local-side{position:sticky; top:96px; display:flex; flex-direction:column; gap:16px}
.side-card{padding:24px 24px}
.side-card h4{font-family:'Sora'; font-weight:800; font-size:1.1rem; margin-bottom:14px}
.side-dl{margin:0 0 18px; display:flex; flex-direction:column; gap:0}
.side-dl div{display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--line)}
.side-dl div:last-child{border-bottom:0}
.side-dl dt{color:var(--ink-mute); font-size:.86rem; font-weight:600}
.side-dl dd{margin:0; color:var(--ink); font-size:.9rem; font-weight:700; text-align:right}
.side-quote .stars{color:var(--org); letter-spacing:.2em; margin-bottom:10px}
.side-quote p{color:var(--ink-soft); font-style:italic; font-size:.96rem; margin-bottom:10px}
.side-quote .side-who{color:var(--ink-mute); font-size:.82rem; font-weight:600}
@media(max-width:900px){.local-side{position:static}}

/* ---------- service mini grid ---------- */
.sec-svc-strip{padding-top:clamp(44px,6vw,80px)}
.svc-mini-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:clamp(26px,4vw,40px)}
.svc-mini{padding:22px 24px; text-decoration:none; color:var(--ink); display:flex; flex-direction:column; gap:6px}
.svc-mini b{font-family:'Sora'; font-weight:700; font-size:1.08rem}
.svc-mini span{color:var(--ink-soft); font-size:.92rem}
@media(max-width:820px){.svc-mini-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.svc-mini-grid{grid-template-columns:1fr}}

/* ---------- nearby suburbs ---------- */
.sec-near{padding-top:clamp(44px,6vw,80px)}
.sub-near{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:clamp(24px,4vw,38px)}
.sub-near-link{font:600 .9rem/1 'Inter'; color:var(--ink-soft); background:var(--glass-flat);
  border:1px solid var(--line); border-radius:999px; padding:.7rem 1.2rem; text-decoration:none; transition:all .3s var(--ease)}
.sub-near-link:hover{color:#fff; background:var(--grad-org); border-color:transparent; transform:translateY(-2px)}
.sub-near-all{color:var(--org-hi); border-color:var(--line-org)}

/* ---------- FAQ section spacing ---------- */
.sec-faq{padding-top:clamp(44px,6vw,80px)}
.sec-cta{padding-top:clamp(44px,6vw,80px)}

/* ---------- regions grid (hub) ---------- */
.sec-regions{padding-top:clamp(30px,4vw,50px)}
.region-block{margin-bottom:clamp(34px,5vw,56px)}
.region-block h3{font-family:'Sora'; font-weight:800; font-size:1.5rem; margin-bottom:18px;
  padding-bottom:12px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:.5em}
.region-block h3::before{content:""; width:10px; height:10px; border-radius:3px; background:var(--grad-org)}
.region-subs{display:grid; grid-template-columns:repeat(4,1fr); gap:12px}
.region-subs a{display:flex; flex-direction:column; gap:3px; padding:16px 18px; text-decoration:none;
  background:var(--glass-flat); border:1px solid var(--line); border-radius:var(--radius-sm); transition:all .35s var(--ease)}
.region-subs a:hover{border-color:var(--line-org); transform:translateY(-3px); box-shadow:var(--inner),var(--glow)}
.region-subs a span{font-family:'Sora'; font-weight:700; font-size:1.02rem; color:var(--ink)}
.region-subs a small{font-size:.76rem; color:var(--ink-mute); font-weight:600}
@media(max-width:1000px){.region-subs{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.region-subs{grid-template-columns:repeat(2,1fr)}}
@media(max-width:440px){.region-subs{grid-template-columns:1fr}}

/* ---------- generic prose / service pages ---------- */
.prose{max-width:760px; margin:0 auto}
.prose h2{font-size:clamp(1.6rem,3vw,2.2rem); margin:36px 0 14px}
.prose h3{margin:26px 0 10px; font-size:1.2rem}
.prose p{color:var(--ink-soft); font-size:1.04rem}
.prose ul{padding-left:0; list-style:none; display:flex; flex-direction:column; gap:11px; margin:14px 0}
.prose ul li{position:relative; padding-left:30px; color:var(--ink-soft)}
.prose ul li::before{content:""; position:absolute; left:0; top:3px; width:19px; height:19px; border-radius:6px;
  background:rgba(55,224,139,.16); border:1px solid rgba(55,224,139,.4)}
.prose ul li::after{content:""; position:absolute; left:6px; top:7px; width:7px; height:4px;
  border-left:2px solid var(--green); border-bottom:2px solid var(--green); transform:rotate(-45deg)}

/* split section: text + image */
.split{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px,4vw,56px); align-items:center}
.split.rev .split-img{order:-1}
.split-txt h2{font-size:clamp(1.7rem,3.2vw,2.4rem); margin-bottom:14px}
.split-txt p{color:var(--ink-soft); font-size:1.04rem}
.split-img{position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);
  box-shadow:var(--shadow); aspect-ratio:4/3}
.split-img img{width:100%; height:100%; object-fit:cover; display:block}
@media(max-width:860px){.split{grid-template-columns:1fr}.split.rev .split-img{order:0}}

/* contact */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,44px); margin-top:clamp(26px,4vw,40px)}
.contact-card{padding:30px 30px}
.contact-rows{display:flex; flex-direction:column; gap:0}
.contact-rows a, .contact-rows div{display:flex; gap:14px; align-items:center; padding:16px 0; border-bottom:1px solid var(--line); text-decoration:none; color:var(--ink)}
.contact-rows a:last-child, .contact-rows div:last-child{border-bottom:0}
.contact-rows .cic{width:42px;height:42px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;
  background:rgba(251,112,0,.14); border:1px solid var(--line-org)}
.contact-rows .cic svg{width:20px;height:20px;color:var(--org)}
.contact-rows .clbl{display:block; font:600 .7rem/1 'Inter'; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:4px}
.contact-rows b{font-family:'Sora'; font-weight:700; font-size:1.02rem; color:var(--ink)}
.contact-form label{display:block; font:600 .74rem/1 'Inter'; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute); margin:14px 0 6px}
.contact-form input,.contact-form select,.contact-form textarea{width:100%; font:500 1rem/1.4 'Inter'; color:var(--ink);
  background:rgba(127,127,127,.1); border:1px solid var(--line); border-radius:12px; padding:.8rem 1rem; outline:none; font-family:'Inter'}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--line-org)}
.contact-form .btn{width:100%; margin-top:18px}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}

/* footer (full) */
.site-foot{border-top:1px solid var(--line); padding:clamp(48px,6vw,72px) 0 130px; color:var(--ink-mute); font-size:.92rem}
.foot-grid{display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:clamp(24px,3vw,44px); text-align:left}
.foot-brand .foot-logo{height:54px; width:auto; margin:0 0 16px; display:block}
.foot-brand p{color:var(--ink-mute); font-size:.92rem; max-width:320px}
.foot-contact{display:flex; flex-direction:column; gap:7px; margin-top:16px}
.foot-contact a, .foot-contact span{color:var(--ink-soft); text-decoration:none; font-size:.9rem}
.foot-contact a:hover{color:var(--org)}
.foot-col h4{font-family:'Sora'; font-weight:800; font-size:.95rem; color:var(--ink); margin-bottom:14px; text-transform:none; letter-spacing:0}
.foot-col a{display:block; color:var(--ink-mute); text-decoration:none; font-size:.9rem; padding:5px 0; transition:color .3s}
.foot-col a:hover{color:var(--org)}
.foot-bottom{border-top:1px solid var(--line); margin-top:clamp(34px,4vw,48px); padding-top:24px;
  display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap}
.foot-bottom .disclaimer{font-size:.74rem; max-width:680px; margin:0; opacity:.8; text-align:left}
.foot-bottom .built-by{margin-top:0; flex:none}
@media(max-width:880px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.foot-grid{grid-template-columns:1fr}.foot-bottom{flex-direction:column; align-items:flex-start}}

/* misc helpers */
.center{text-align:center}
.mt0{margin-top:0}
.lead-c{max-width:680px; margin-left:auto; margin-right:auto}