/* GarageNest – public website pages (builder A: home 01, services 02 + 03, garages 04 + 05, about & contact 10,
   CMS pages, "List your garage"). base.css is the approved design; this file holds the design's inline layout bits
   and the small additions of the Laravel pages. Colours only through the design tokens. */

/* home */
.hero h1{overflow-wrap:anywhere}
.qb .in{min-width:0;width:100%}
.qb-g>.fld{min-width:0}
.plan .pl-note{margin:0}
.faq-g{gap:48px;align-items:start}
.faq-g .sec-h{margin-bottom:20px}
.team .tm-r{margin:4px 0 0}
.gc-tags{gap:6px}
.gc-meta{display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px dashed var(--line-2);flex-wrap:wrap;gap:8px}
.badge-top{display:flex;gap:6px;flex-wrap:wrap}

/* install-app block */
.ab-hint{max-width:260px}
.ab-art{justify-content:center;gap:28px}
.ab-dot{width:26px;height:26px;border-radius:50%;background:var(--red)}
.ab-list{padding:14px;display:grid;gap:10px}
.ab-b{display:block}
.ab-s{display:block;font-size:14px}
.ab-tags{gap:6px}
.ab-qr{width:150px;text-align:center}
.ab-qr svg{display:block;width:100%;height:auto;border-radius:8px}
.ab-qr .xs{display:block}

/* services list + service page */
.sv-bar{margin-bottom:24px;gap:16px}
.sv-bar .chips{min-width:0}
.sv-bar .chip{text-decoration:none}
.search.sv-search{background:var(--sunk);border-color:var(--line);color:var(--ink-3);width:260px;max-width:100%}
.search.sv-search input{color:var(--ink)}
.search.sv-search input::placeholder{color:var(--ink-3)}
.sv-diag{align-items:center;gap:40px}
.sv-diag .sec-h{margin-bottom:20px}
.sv-h2{font-size:28px}
.sv-h3{font-size:16px}
.sv-p{margin:6px 0 0}
.sv-tags{gap:8px}
.opt .pr{white-space:nowrap}

/* garage search */
.gs-h1{font-size:clamp(28px,3.2vw,40px)}
.gs-h2{font-size:26px}
.seg a{min-height:38px;padding:0 16px;border-radius:999px;font-weight:700;font-size:14px;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.seg a .ic{width:17px;height:17px}
.seg a[aria-pressed=true]{background:var(--char);color:var(--band-ink);box-shadow:var(--sh-1)}
.filters>.in-ic{flex:1 1 200px;min-width:0}
.filters>.in-ic .in{width:100%}
.gs-chips{gap:12px}
.gs-chips .chips{min-width:0}
.chips a.chip{text-decoration:none}
.gs-sort{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.gs-sort a{color:var(--ink-2);text-decoration:underline;text-underline-offset:2px}
.gs-side{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}
.gs-mapp{padding:10px}
.gs-mapp .map{border-radius:calc(var(--r-lg) - 6px)}
.grow-row{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;padding:14px;color:inherit;text-decoration:none}
.grow-row .ph{align-self:start}
.gr-b{min-width:0}
.gr-t{gap:6px}
.gr-t b{font-size:16px}
.gr-tags{gap:6px}
.gs-selr{gap:10px;min-width:0}
.gs-thumb{width:54px;flex:0 0 54px;border-radius:12px}
.gs-cmp td:first-child{font-weight:700;color:var(--ink-2);white-space:nowrap}
.gs-cmp th,.gs-cmp td{vertical-align:top}
.gs-ex{gap:6px}
.live-map>.medot{display:none}

/* garage page */
.gal.gal-1{grid-template-columns:1fr;grid-template-rows:360px}
.gal.gal-2{grid-template-columns:1fr 1fr;grid-template-rows:320px}
.gal.gal-2 .ph:first-child,.gal.gal-1 .ph:first-child{grid-row:auto}
.gal.gal-3{grid-template-columns:2fr 1fr}
.gal.gal-4 .ph:last-child{grid-column:2/4}
.gp-head{gap:16px}
.gp-id{gap:16px;min-width:0}
.gp-logo{width:76px;height:76px;flex:0 0 76px;border-radius:50%;border:3px solid var(--yel);object-fit:cover;font-size:24px}
.gp-name{gap:8px}
.gp-name h1{font-size:clamp(26px,3vw,38px);overflow-wrap:anywhere}
.gp-open{color:var(--blue-ink)}
.gp-h2{font-size:26px}
.gp-facts .card b{display:block}
.gp-facts .itile{margin:0 auto}
.gp-rate{grid-template-columns:200px minmax(0,1fr);align-items:center}
.gp-big{font-size:54px;font-weight:800;line-height:1}
.gp-bars{--g:8px}
.gp-bar{gap:10px;flex-wrap:nowrap}
.gp-bar .xs:first-child{width:14px}
.gp-bar .xs:last-child{width:34px;text-align:right}
.gp-slots{grid-template-columns:repeat(3,minmax(0,1fr))}
.gp-prices .btn{white-space:nowrap}

/* about, apply, status, pages */
.ab-story{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ab-stats{margin-bottom:0}
.ab-stats>div{background:var(--sunk);border-color:var(--line)}
.ab-stats b{color:var(--red-ink)}
.ab-stats span{color:var(--ink-2)}
.ab-h2{font-size:30px}
.fld .err{display:block;margin-top:6px;color:var(--red-ink);font-size:13px;font-weight:600}
.ap-cats{display:flex;flex-wrap:wrap;gap:10px 18px}
.as-panel{max-width:860px;margin:0 auto}
.as-h1{font-size:clamp(30px,3.6vw,46px)}
.as-panel .lead{max-width:560px;margin-left:auto;margin-right:auto}
.as-g{text-align:left}
.as-b{display:block;font-size:18px}
.as-row{justify-content:center}
.as-note{text-align:left;max-width:560px;margin-left:auto;margin-right:auto}
.prose{max-width:760px;line-height:1.7;color:var(--ink-2)}
.prose h2,.prose h3{color:var(--ink);margin:28px 0 10px}
.prose p,.prose ul,.prose ol{margin:0 0 14px}
.prose ul,.prose ol{padding-left:22px}
.prose a{color:var(--red-ink);text-decoration:underline}

@media (max-width:980px){
 .gs-side{grid-template-columns:minmax(0,1fr)}
 .gs-map{position:static;order:-1}
 .gs-map .map{min-height:340px!important}
 .ab-story{grid-template-columns:minmax(0,1fr)}

 .gal.gal-3{grid-template-columns:1fr 1fr;grid-template-rows:220px 130px}
 .gal.gal-3 .ph:first-child{grid-column:1/3;grid-row:auto}
}
@media (max-width:640px){
 .search.sv-search{width:100%}
 .sv-bar{flex-direction:column;align-items:stretch}
 .gs-sort{margin-left:0}
 .grow-row{grid-template-columns:88px minmax(0,1fr);gap:12px;padding:12px}
 .gp-logo{width:56px;height:56px;flex-basis:56px;font-size:18px}
 .gal.gal-1{grid-template-rows:220px}
 .gal.gal-2{grid-template-rows:200px}
 .gp-slots{grid-template-columns:repeat(3,minmax(0,1fr))}
 .faq-g{gap:24px}
}
@media (max-width:420px){
 .why-stats b{white-space:nowrap;font-size:clamp(18px,5.4vw,24px)}
}
.gs-cmpw{overflow-x:auto;-webkit-overflow-scrolling:touch}
.gs-cmp{min-width:640px}