
:root{color-scheme:dark;--gold:#ddb45d;--ink:#111416}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:#f5f1e9;font-family:Arial,sans-serif}a{color:inherit}header{display:flex;align-items:center;justify-content:space-between;padding:15px 4%;border-bottom:1px solid #ffffff20;background:#101214}header strong{font-family:Georgia,serif;font-size:22px;color:var(--gold)}nav{display:flex;gap:25px;font-size:14px}nav a{text-decoration:none}.hero{margin:0;position:relative}.hero img{display:block;width:100%;height:auto}.intro{text-align:center;padding:55px 20px 38px;max-width:820px;margin:auto}.eyebrow{color:var(--gold);text-transform:uppercase;font-size:12px;letter-spacing:3px}h1,h2{font-family:Georgia,serif;font-weight:normal}h1{font-size:clamp(32px,4vw,53px);margin:14px 0}p{color:#bfc0bd;line-height:1.7}.button{display:inline-block;background:var(--gold);color:#151515;border:0;text-decoration:none;padding:14px 23px;font-weight:bold;cursor:pointer}.browse{padding:20px 4% 65px;max-width:1450px;margin:auto}.section-title{display:flex;justify-content:space-between;align-items:baseline}h2{font-size:32px}.categories{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.category{border:1px solid #45443e;background:#1a1d1f;color:inherit;padding:28px 20px;text-align:left;cursor:pointer;font:inherit}.category:hover,.category[aria-pressed=true]{border-color:var(--gold);background:#252726}.number{color:var(--gold);font-size:12px;letter-spacing:2px}.category h3{font:25px Georgia,serif;margin:18px 0 12px}.category p{font-size:14px;margin:0}#detail{margin-top:18px;border-left:3px solid var(--gold);padding:20px 25px;background:#1b1e20}#detail h3{margin:0;font:24px Georgia,serif}.planning{padding:50px 4%;background:#222527;display:grid;grid-template-columns:1fr 1fr;gap:50px}.planning h2{margin-top:0}.planning ul{padding-left:20px;color:#c7c8c4;line-height:1.9}details{border-bottom:1px solid #ffffff20;padding:16px 0}summary{cursor:pointer;color:#eee}footer{padding:27px 4%;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:#aaa}.preview{font-size:12px;color:#9d9f9b}@media(max-width:760px){header{flex-wrap:wrap;gap:14px}nav{gap:18px}.categories{grid-template-columns:1fr 1fr}.planning{grid-template-columns:1fr;gap:25px}.intro{padding:35px 20px}.category{padding:20px 14px}.category h3{font-size:21px}footer{flex-direction:column}.section-title{display:block}}@media(max-width:420px){.categories{grid-template-columns:1fr}}

/* Garage backdrop continues behind every front-page section. */
body{background:#111416 url("garage-banner-smaller.png") center top/cover fixed no-repeat;isolation:isolate}
body::before{content:"";position:fixed;inset:0;background:rgba(8,10,12,.30);pointer-events:none;z-index:-1}
header{background:rgba(16,18,20,.78)}
.intro{background:rgba(16,18,20,.66);border-radius:12px;margin:30px auto;padding:35px 24px}
.section-title{background:rgba(16,18,20,.66);padding:8px 18px;border-radius:10px;margin-bottom:14px}
.category{background:rgba(26,29,31,.72)}
.category:hover,.category[aria-pressed=true]{background:rgba(37,39,38,.84)}
#detail{background:rgba(27,30,32,.76)}
.planning{background:rgba(22,25,27,.73)}
footer{background:rgba(16,18,20,.76)}
p,.planning ul{color:#eee9df}.preview,footer{color:#ded9d0}
@media(max-width:760px){.intro{margin:24px 4%}.section-title{padding:12px 16px}}

/* Keep one garage image across the page; hero reserves its opening space. */
.hero img{visibility:hidden}

header{gap:18px;flex-wrap:wrap}header strong a{text-decoration:none}nav{flex-wrap:wrap;gap:14px 20px}nav a:hover{text-decoration:underline}.stores{display:flex;gap:12px;flex-wrap:wrap}.stores a{border:1px solid #ddb45d80;padding:8px 12px;text-decoration:none;background:#101214b8}.stores a[aria-current]{border-color:var(--gold);color:var(--gold)}.content{max-width:1200px;margin:30px auto;padding:28px;background:#101214c9;border:1px solid #ffffff26;border-radius:12px}.page-title{margin-bottom:25px}.page-title h1{font-size:clamp(32px,4vw,48px)}.panel,.form-section,.policy-section{padding:24px;background:#171b1dc4;border:1px solid #ffffff25;margin-bottom:18px;border-radius:8px}.panel h2,.form-section h2,.policy-section h2{margin-top:0}.concepts{display:grid;grid-template-columns:1fr 1fr;gap:16px}.concepts details{background:#14191ac4;border:1px solid #ffffff30;padding:20px;border-radius:8px}.concepts summary{font:24px Georgia,serif}.concept-body{padding-top:10px}.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.secondary{background:#111416d9;color:#fff;border:1px solid var(--gold);padding:13px 20px;cursor:pointer;font:inherit}.fields{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field label{display:block;margin-bottom:8px;font-weight:600}.field input,.field select,.field textarea{width:100%;padding:12px;border:1px solid #777;border-radius:4px;background:#121719;color:#fff;font:inherit}.field textarea{resize:vertical}.full{grid-column:1/-1}.check{display:flex;align-items:flex-start;gap:10px;line-height:1.5;font-size:14px;margin-top:18px}.check input{width:auto;flex:0 0 auto;margin-top:4px;accent-color:var(--gold)}.hint{font-size:13px;color:#ddd}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--gold);outline-offset:3px}[hidden]{display:none!important}ul,ol{line-height:1.8;color:#eee9df}dt{font-weight:bold;color:var(--gold);margin-top:15px}dd{margin:4px 0;white-space:pre-wrap;overflow-wrap:anywhere}.policy-nav{margin:20px 0}.policy-alert{border-left:3px solid var(--gold);padding:15px;background:#161b1dde}.policy-kicker{color:var(--gold)}.measure-help svg{display:block;width:100%;max-width:620px;background:#f1ede3;border-radius:6px;margin:15px 0}.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.step-grid article{background:#171b1dc4;padding:20px;border:1px solid #ffffff25}.skip{position:absolute;left:10px;top:-100px;z-index:10}.skip:focus{top:10px;background:#111;padding:12px}footer a{display:inline-block;margin-right:15px}.category .textlink{display:inline-block;margin-top:16px;color:var(--gold)}@media(max-width:760px){.content{margin:20px 4%;padding:18px}.fields,.concepts,.step-grid{grid-template-columns:1fr}.full{grid-column:auto}.form-section{padding:18px}.stores{gap:8px}nav{font-size:13px}}

/* Keep form fields and long inquiry answers inside narrow screens. */
.field, .form-section, .fields, .form-actions>*{min-width:0}input,select,textarea{max-width:100%}dl dd{overflow-wrap:anywhere}button:focus-visible,a:focus-visible{outline:3px solid #dcb779;outline-offset:3px}@media(max-width:560px){input,select,textarea{font-size:16px}.form-actions{flex-wrap:wrap}.form-actions button{min-height:44px}}

/* Illustrate each garage equipment category with the established workshop artwork. */
.category{overflow:hidden}.category-picture{display:block;height:170px;width:calc(100% + 40px);margin:-28px -20px 18px;background-repeat:no-repeat;background-color:#1a1815}.category .number,.category h3,.category p{position:relative}@media(max-width:630px){.category-picture{height:190px}}

@media(max-width:760px){.category-picture{width:calc(100% + 28px);margin:-20px -14px 18px}}

/* Keep the workshop background tied to the screen, not the long document. */
body{background:#111416;position:relative;isolation:isolate}
body::before{background:linear-gradient(rgba(8,10,12,.24),rgba(8,10,12,.24)),url("garage-banner-smaller.png") center top/cover no-repeat}
.hero img{visibility:visible}

/* Reserve the opening space while showing only the continuous backdrop. */
.hero img{visibility:hidden}
