/* Reverse-It designs. The Worker puts the chosen design on <html data-design="…">
   (picked in the admin's Designs tab; any page can be previewed with ?design=name).
   "night" is the default and needs no overrides. Each design brings its own colours;
   a colour published from the admin's Colour tab (theme.css) still wins over them. */

/* ---------- shared: light designs ---------- */
html:is([data-design="showroom"],[data-design="workshop"],[data-design="rally"],[data-design="clean"]){
  color-scheme:light;
  --ink-rgb:255 255 255;
  --panel-rgb:255 255 255;
  --hi-rgb:0 0 0;
  --glass:rgb(255 255 255 / .82);
  --err:#c62828;
}
html:is([data-design="showroom"],[data-design="workshop"],[data-design="rally"],[data-design="clean"]) .ph::after,html:is([data-design="showroom"],[data-design="workshop"],[data-design="rally"],[data-design="clean"]) .hero-photo::after{background:none}
html:is([data-design="showroom"],[data-design="workshop"],[data-design="rally"],[data-design="clean"]) .ph img{filter:none}
html:is([data-design="showroom"],[data-design="workshop"],[data-design="rally"],[data-design="clean"]) .contact-bg::after{background:linear-gradient(90deg,rgb(255 255 255 / .96),rgb(255 255 255 / .88) 60%,rgb(255 255 255 / .7))}
html:is([data-design="showroom"],[data-design="workshop"],[data-design="rally"],[data-design="clean"]) :is(.cluster,.tile,.step,.law,.frame,.hero-photo){box-shadow:0 24px 50px -36px rgb(0 0 0 / .4)}
html:is([data-design="showroom"],[data-design="workshop"],[data-design="rally"],[data-design="clean"]) .hero{background:var(--bg)}
html:is([data-design="showroom"],[data-design="workshop"],[data-design="rally"],[data-design="clean"]) .notice{background:rgb(var(--accent-rgb) / .08)}
html:is([data-design="showroom"],[data-design="workshop"],[data-design="rally"],[data-design="clean"]) .odo .d:last-child{background:rgb(var(--accent-rgb) / .16)}

/* ---------- 2. Showroom: bright white showroom, photo on the left, softly rounded ---------- */
html[data-design="showroom"]{
  --bg:#f3f3f1;--surface:#ffffff;--surface-2:#ececea;--line:rgb(0 0 0 / .09);--line-2:rgb(0 0 0 / .16);
  --fg:#121212;--fg-2:#4b4a48;--muted:#8b8a86;--lead:#3a3937;
  --accent:#d3121d;--accent-rgb:211 18 29;--accent-hi:#ef2a35;--accent-hi-rgb:239 42 53;--accent-deep:#8e040b;--accent-dark:#fbdcde;--accent-ink:#ffffff;
  --head-stretch:100%;--head-case:none;--head-weight:800;--h1-weight:800;--head-track:-.03em;--h1-track:-.045em;
  --r:10px;--r-lg:14px;--pill:10px;
}
html[data-design="showroom"] .hero-visual{order:-1}
html[data-design="showroom"] :is(h2,.svc h3,.step h3,.law h3){text-decoration:none}
html[data-design="showroom"] .makes{background:#fff}
html[data-design="showroom"] .mq span{background:var(--surface-2);border-color:transparent}
html[data-design="showroom"] .btn-glass{background:#fff}
@media (max-width:920px){html[data-design="showroom"] .hero-visual{order:0}}

/* ---------- 3. Carbon: carbon-fibre weave, amber, tall condensed type, sharp angles ---------- */
html[data-design="carbon"]{
  --bg:#121314;--surface:#1a1c1e;--surface-2:#232629;--ink-rgb:18 19 20;--panel-rgb:26 28 30;--glass:rgb(26 28 30 / .8);
  --line:rgb(255 255 255 / .08);--line-2:rgb(255 255 255 / .16);--fg:#f2f2ef;--fg-2:#b6b8b9;--muted:#7a7d80;--lead:#cfd1d2;
  --accent:#ffb000;--accent-rgb:255 176 0;--accent-hi:#ffc94d;--accent-hi-rgb:255 201 77;--accent-deep:#a86f00;--accent-dark:#3a2a00;--accent-ink:#121314;
  --head-stretch:62%;--head-weight:900;--h1-weight:900;--head-track:0em;--h1-track:-.01em;
  --r:0px;--r-lg:0px;--pill:0px;
}
html[data-design="carbon"] body{background:repeating-linear-gradient(45deg,rgb(255 255 255 / .025) 0 2px,transparent 2px 6px),repeating-linear-gradient(-45deg,rgb(0 0 0 / .3) 0 2px,transparent 2px 6px),var(--bg)}
html[data-design="carbon"] .hero{background:radial-gradient(50% 70% at 78% 45%,rgb(var(--accent-rgb) / .14),transparent 70%)}
html[data-design="carbon"] h1{font-size:clamp(3.2rem,8.4vw,7.4rem);line-height:.84}
html[data-design="carbon"] h2:not(#makesTitle){font-size:clamp(2.4rem,6vw,4.6rem);text-decoration:none}
html[data-design="carbon"] .kicker::before{width:34px;height:8px;background:repeating-linear-gradient(-45deg,var(--accent) 0 6px,#111 6px 12px)}
html[data-design="carbon"] :is(.tile,.step,.law){border-left:4px solid var(--accent)}
html[data-design="carbon"] .btn{clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);padding-inline:32px}
html[data-design="carbon"] .mq span{font-stretch:75%;font-size:17px}

/* ---------- 4. Heritage: British racing green, cream and gold, classic serif ---------- */
html[data-design="heritage"]{
  --bg:#0d2219;--surface:#12291f;--surface-2:#183326;--ink-rgb:13 34 25;--panel-rgb:18 41 31;--glass:rgb(18 41 31 / .78);
  --line:rgb(243 236 216 / .12);--line-2:rgb(243 236 216 / .22);--fg:#f3ecd8;--fg-2:#cdc5ad;--muted:#958d76;--lead:#e3dbc4;
  --accent:#c9a24a;--accent-rgb:201 162 74;--accent-hi:#e2c06a;--accent-hi-rgb:226 192 106;--accent-deep:#8a6a22;--accent-dark:#2c2410;--accent-ink:#10140f;
  --display:Georgia,"Times New Roman",ui-serif,serif;
  --head-stretch:100%;--head-case:none;--head-weight:700;--h1-weight:700;--head-track:-.01em;--h1-track:-.02em;
  --r:6px;--r-lg:8px;--pill:6px;
}
html[data-design="heritage"] .hero{background:radial-gradient(60% 80% at 80% 40%,rgb(var(--accent-rgb) / .12),transparent 70%),var(--bg)}
html[data-design="heritage"] h1 .red{font-style:italic}
html[data-design="heritage"] h2{text-decoration-thickness:1px;text-underline-offset:.25em}
html[data-design="heritage"] :is(.svc h3,.step h3,.law h3){text-decoration:none}
html[data-design="heritage"] .kicker{font-family:var(--body);letter-spacing:.3em}
html[data-design="heritage"] .mq span{background:none;border:0;padding:6px 10px;font-family:var(--display);font-style:italic;text-transform:none;font-size:19px;font-weight:400}
html[data-design="heritage"] .ph img{filter:sepia(.18) saturate(.9) contrast(1.05) brightness(.9)}

/* ---------- 5. Neon Night: midnight blue, electric cyan, glowing edges ---------- */
html[data-design="neon"]{
  --bg:#06061a;--surface:#0d0d2b;--surface-2:#14143a;--ink-rgb:6 6 26;--panel-rgb:13 13 43;--glass:rgb(13 13 43 / .72);
  --line:rgb(140 160 255 / .14);--line-2:rgb(140 160 255 / .28);--fg:#eef0ff;--fg-2:#aab0dd;--muted:#6c72a6;--lead:#c9cdf5;
  --accent:#22e3ff;--accent-rgb:34 227 255;--accent-hi:#7cf0ff;--accent-hi-rgb:124 240 255;--accent-deep:#0a8fa6;--accent-dark:#052a33;--accent-ink:#031018;
  --r:22px;--r-lg:32px;
}
html[data-design="neon"] body{background:radial-gradient(60% 40% at 10% 0%,rgb(255 40 200 / .18),transparent 70%),radial-gradient(50% 40% at 100% 30%,rgb(34 227 255 / .14),transparent 70%),linear-gradient(rgb(140 160 255 / .05) 1px,transparent 1px) 0 0/40px 40px,linear-gradient(90deg,rgb(140 160 255 / .05) 1px,transparent 1px) 0 0/40px 40px,var(--bg)}
html[data-design="neon"] .hero{background:transparent}
html[data-design="neon"] h1{text-shadow:0 0 30px rgb(var(--accent-rgb) / .45)}
html[data-design="neon"] h1 .red{background:linear-gradient(90deg,var(--accent),#ff3fd8);-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-design="neon"] :is(.tile,.step,.law,.cluster,.hero-photo,.frame){box-shadow:0 0 0 1px rgb(var(--accent-rgb) / .35),0 0 40px -10px rgb(var(--accent-rgb) / .45)}
html[data-design="neon"] .btn-red{background:linear-gradient(90deg,var(--accent),#ff3fd8);color:#06061a}

/* ---------- 6. Workshop: concrete grey, safety orange, thick black outlines ---------- */
html[data-design="workshop"]{
  --bg:#e7e5df;--surface:#f6f5f1;--surface-2:#dcd9d1;--line:#161514;--line-2:#161514;
  --fg:#161514;--fg-2:#3c3a36;--muted:#77736b;--lead:#2a2826;
  --accent:#ff6a00;--accent-rgb:255 106 0;--accent-hi:#ff8c3a;--accent-hi-rgb:255 140 58;--accent-deep:#b34a00;--accent-dark:#ffe0c7;--accent-ink:#161514;
  --head-stretch:75%;--head-weight:900;--h1-weight:900;--head-track:0em;--h1-track:-.01em;
  --r:0px;--r-lg:0px;--pill:0px;
}
html[data-design="workshop"] :is(.tile,.step,.law,.cluster,.contact,.hours,.frame,.hero-photo,.mq span,.btn,.chip,.readouts li,.svc-gauge,.town-list li,.tags li,.verdict,.state){border-width:2px;border-style:solid;border-color:var(--fg)}
html[data-design="workshop"] :is(.tile,.step,.law,.cluster,.hero-photo,.frame){box-shadow:6px 6px 0 var(--fg)}
html[data-design="workshop"] .btn-red{box-shadow:4px 4px 0 var(--fg)}
html[data-design="workshop"] .btn-glass{background:var(--surface)}
html[data-design="workshop"] h1{font-size:clamp(3rem,7.4vw,6.6rem)}
html[data-design="workshop"] h2{text-decoration-thickness:6px}
html[data-design="workshop"] .hero-photo{transform:rotate(1.5deg)}
html[data-design="workshop"] .notice{background:var(--accent);border-color:var(--fg)}
html[data-design="workshop"] .notice span{color:var(--accent-ink)}
html[data-design="workshop"] .radar{box-shadow:0 0 0 2px var(--fg)}
html[data-design="workshop"] .ph img{filter:contrast(1.1) saturate(.9)}

/* ---------- 7. Prestige: black and gold, fine serif capitals, everything centred ---------- */
html[data-design="prestige"]{
  --bg:#0a0907;--surface:#12100c;--surface-2:#1a1711;--ink-rgb:10 9 7;--panel-rgb:18 16 12;--glass:rgb(18 16 12 / .8);
  --line:rgb(212 175 55 / .16);--line-2:rgb(212 175 55 / .32);--fg:#f4efe3;--fg-2:#c2b9a3;--muted:#8a826f;--lead:#ddd5c1;
  --accent:#d4af37;--accent-rgb:212 175 55;--accent-hi:#ecd27a;--accent-hi-rgb:236 210 122;--accent-deep:#8f7322;--accent-dark:#2a2210;--accent-ink:#0a0907;
  --display:Georgia,"Times New Roman",ui-serif,serif;
  --head-stretch:100%;--head-weight:400;--h1-weight:400;--head-track:.08em;--h1-track:.04em;
  --r:2px;--r-lg:2px;--pill:2px;
}
html[data-design="prestige"] .hero{background:radial-gradient(60% 60% at 50% 100%,rgb(var(--accent-rgb) / .12),transparent 70%),var(--bg)}
html[data-design="prestige"] .hero-in{grid-template-columns:1fr;text-align:center;justify-items:center}
html[data-design="prestige"] :is(.hero .lead,.sec-head .lead){margin-inline:auto}
html[data-design="prestige"] :is(.ctas,.trust){justify-content:center}
html[data-design="prestige"] .hero-photo{width:min(100%,960px);aspect-ratio:16/8;margin:0 auto}
html[data-design="prestige"] h1{font-size:clamp(2.4rem,5vw,4.6rem);line-height:1.05}
html[data-design="prestige"] h1 .red{font-style:italic;text-transform:none;letter-spacing:0}
html[data-design="prestige"] .sec-head{flex-direction:column;align-items:center;text-align:center}
html[data-design="prestige"] :is(h2,.svc h3,.step h3,.law h3){text-decoration:none}
html[data-design="prestige"] .sec-head h2::after{content:"";display:block;width:60px;height:1px;background:var(--accent);margin:22px auto 0}
html[data-design="prestige"] .kicker{letter-spacing:.4em}
html[data-design="prestige"] .kicker::before{display:none}
html[data-design="prestige"] .btn-red{background:transparent;color:var(--accent);border:1px solid var(--accent);box-shadow:none;text-transform:uppercase;letter-spacing:.18em;font-size:13px}
html[data-design="prestige"] .btn-red:hover{background:var(--accent);color:var(--accent-ink)}
html[data-design="prestige"] .mq span{background:none;border:0;font-family:var(--display);letter-spacing:.2em;font-weight:400}

/* ---------- 8. Blueprint: technical drawing on blue paper, dashed lines, mono type ---------- */
html[data-design="blueprint"]{
  --bg:#0b3a6e;--surface:#0f4683;--surface-2:#13508f;--ink-rgb:11 58 110;--panel-rgb:15 70 131;--glass:rgb(15 70 131 / .78);
  --line:rgb(234 244 255 / .22);--line-2:rgb(234 244 255 / .42);--fg:#eaf4ff;--fg-2:#bcd6f2;--muted:#8db3dc;--lead:#d7e8fa;
  --accent:#ffd166;--accent-rgb:255 209 102;--accent-hi:#ffe199;--accent-hi-rgb:255 225 153;--accent-deep:#b38a2e;--accent-dark:#3d3315;--accent-ink:#0b2a4d;
  --display:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --head-stretch:100%;--head-weight:500;--h1-weight:500;--head-track:-.02em;--h1-track:-.04em;
  --r:0px;--r-lg:0px;--pill:0px;
}
html[data-design="blueprint"] body{background:linear-gradient(rgb(234 244 255 / .07) 1px,transparent 1px) 0 0/24px 24px,linear-gradient(90deg,rgb(234 244 255 / .07) 1px,transparent 1px) 0 0/24px 24px,linear-gradient(rgb(234 244 255 / .12) 1px,transparent 1px) 0 0/120px 120px,linear-gradient(90deg,rgb(234 244 255 / .12) 1px,transparent 1px) 0 0/120px 120px,var(--bg)}
html[data-design="blueprint"] .hero{background:transparent}
html[data-design="blueprint"] :is(.tile,.step,.law,.cluster,.contact,.hours,.frame,.hero-photo,.mq span,.readouts li,.town-list li,.tags li,.btn-glass){border-style:dashed}
html[data-design="blueprint"] h2{text-decoration-style:dashed;text-decoration-thickness:2px}
html[data-design="blueprint"] .ph img{filter:grayscale(1) contrast(1.15) brightness(.95)}
html[data-design="blueprint"] .ph::after{background:rgb(11 58 110 / .45);mix-blend-mode:multiply}
html[data-design="blueprint"] .hero-photo::before{content:"FIG. 1  /  INSTRUMENT CLUSTER";position:absolute;left:14px;top:12px;z-index:2;font:500 10px/1 var(--mono);letter-spacing:.2em;color:var(--fg)}

/* ---------- 9. Rally: race-livery white, navy and red stripes, slanted italics ---------- */
html[data-design="rally"]{
  --bg:#ffffff;--surface:#f2f5f9;--surface-2:#e6ebf2;--line:rgb(13 27 42 / .12);--line-2:rgb(13 27 42 / .22);
  --fg:#0d1b2a;--fg-2:#3a4a5c;--muted:#7a8797;--lead:#26374a;
  --accent:#e4002b;--accent-rgb:228 0 43;--accent-hi:#ff2b4f;--accent-hi-rgb:255 43 79;--accent-deep:#9c001d;--accent-dark:#ffd6de;--accent-ink:#ffffff;
  --head-style:italic;--head-weight:900;--h1-weight:900;
  --r:0px;--r-lg:0px;--pill:0px;
}
html[data-design="rally"] .hero{background:linear-gradient(115deg,transparent 62%,#0047ba 62% 66%,transparent 66% 67.5%,var(--accent) 67.5% 71.5%,transparent 71.5%),var(--bg)}
html[data-design="rally"] .makes{background:#0d1b2a;--strip-fg:#ffffff}
html[data-design="rally"] .makes-head :is(h2,p){color:#fff}
html[data-design="rally"] .mq span{background:transparent;border-color:rgb(255 255 255 / .25)}
html[data-design="rally"] :is(.tile,.step,.law){border-top:6px solid #0047ba}
html[data-design="rally"] .hero-photo{clip-path:polygon(8% 0,100% 0,92% 100%,0 100%);border:0}
html[data-design="rally"] :is(h2,.svc h3,.step h3,.law h3){text-decoration:none}
html[data-design="rally"] .sec-head h2{border-left:10px solid var(--accent);padding-left:16px}
html[data-design="rally"] .btn{transform:skewX(-10deg)}
html[data-design="rally"] .btn-red:hover{transform:skewX(-10deg) translateY(-1px)}

/* ---------- 10. Digital Dash: green LCD readout, scan lines, monospace everything ---------- */
html[data-design="lcd"]{
  --bg:#020403;--surface:#06100a;--surface-2:#0a1810;--ink-rgb:2 4 3;--panel-rgb:6 16 10;--glass:rgb(6 16 10 / .8);
  --line:rgb(57 255 136 / .14);--line-2:rgb(57 255 136 / .3);--fg:#c8ffd9;--fg-2:#7fc79a;--muted:#4f8a66;--lead:#a6f0c0;
  --accent:#39ff88;--accent-rgb:57 255 136;--accent-hi:#8affb8;--accent-hi-rgb:138 255 184;--accent-deep:#12a050;--accent-dark:#06301a;--accent-ink:#021006;
  --display:"JetBrains Mono",ui-monospace,Menlo,monospace;--body:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --head-stretch:100%;--head-weight:500;--h1-weight:500;--head-track:-.03em;--h1-track:-.05em;
  --r:2px;--r-lg:4px;--pill:2px;
}
html[data-design="lcd"] body{font-size:15px}
html[data-design="lcd"] body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:70;background:repeating-linear-gradient(0deg,rgb(0 0 0 / .18) 0 1px,transparent 1px 3px)}
html[data-design="lcd"] :is(h1,h2,.mini b,.rpm,.phone){text-shadow:0 0 12px rgb(var(--accent-rgb) / .55)}
html[data-design="lcd"] h1{color:var(--accent)}
html[data-design="lcd"] h1 .red{color:var(--fg)}
html[data-design="lcd"] .ph img{filter:grayscale(1) contrast(1.2) brightness(.8)}
html[data-design="lcd"] .ph::after{background:rgb(var(--accent-rgb) / .22);mix-blend-mode:color}

/* ---------- 11. Clean Mono: black and white, lots of space, photos in black and white ---------- */
html[data-design="clean"]{
  --bg:#fafafa;--surface:#ffffff;--surface-2:#f0f0f0;--line:rgb(0 0 0 / .08);--line-2:rgb(0 0 0 / .14);
  --fg:#0a0a0a;--fg-2:#555555;--muted:#999999;--lead:#333333;
  --accent:#0a0a0a;--accent-rgb:10 10 10;--accent-hi:#333333;--accent-hi-rgb:51 51 51;--accent-deep:#000000;--accent-dark:#e9e9e9;--accent-ink:#ffffff;
  --head-stretch:100%;--head-case:none;--head-weight:700;--h1-weight:700;--head-track:-.035em;--h1-track:-.055em;
  --r:16px;--r-lg:24px;
}
html[data-design="clean"] .ph img{filter:grayscale(1) contrast(1.05)}
html[data-design="clean"] :is(.shot:hover .frame img,.svc:hover .svc-media img,.gitem:hover img){filter:none}
html[data-design="clean"] :is(h2,.svc h3,.step h3,.law h3){text-decoration:none}
html[data-design="clean"] .kicker::before{display:none}
html[data-design="clean"] .btn-red{box-shadow:none}
html[data-design="clean"] .radar{box-shadow:0 0 0 1px var(--line-2)}
html[data-design="clean"] .dial-wrap.hot{filter:none}
html[data-design="clean"] .sec{padding-block:clamp(90px,12vw,170px)}
