/* ===== VREPROG Mobile Hotfix (v1) =====
   Scope: generic, non-breaking; no HTML refactor required.
   Author: ChatGPT (for V REPROG)
   Notes: No WebP enforced. Use JPEG/PNG as-is.
*/
:root{
  --vr-bg:#0a0a0b;--vr-surface:#121214;--vr-text:#f4f4f5;--vr-muted:#b9b9c0;--vr-primary:#e6132d;
  --vr-radius:16px;--vr-gap:clamp(12px,3vw,24px);--vr-maxw:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--vr-bg);color:var(--vr-text);-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
/* Containers */
[class*="container"], .container, .wrapper, .wrap, main{max-width:var(--vr-maxw);margin-inline:auto;padding-inline:16px}
/* Typography fluid */
h1{font-size:clamp(26px,6.5vw,46px);line-height:1.05;margin:.4em 0}
h2{font-size:clamp(20px,5.6vw,32px);margin:.6em 0 .4em}
h3{font-size:clamp(18px,4.8vw,24px);margin:.6em 0 .4em}
p,li{font-size:clamp(15px,3.6vw,18px);}
/* Buttons & tap targets */
button, .btn, [role="button"], .cta, input[type="submit"]{
  min-height:44px;padding:.7em 1.1em;border-radius:999px;border:1px solid rgba(255,255,255,.08);
  background:var(--vr-primary);color:#fff;font-weight:700;cursor:pointer
}
.btn--ghost,.ghost{background:transparent;color:var(--vr-text)}
/* Header sticky (generic) */
header{position:sticky;top:0;z-index:1000;background:rgba(10,10,11,.9);backdrop-filter:saturate(140%) blur(6px)}
/* Navigation burger injected by JS */
.vr-burger{background:transparent;border:0;display:inline-flex;flex-direction:column;gap:4px;padding:10px;cursor:pointer}
.vr-burger .bar{width:22px;height:2px;background:var(--vr-text);border-radius:1px}
.vr-mobile-nav{position:fixed;inset:56px 0 0 0;background:rgba(12,12,14,.96);transform:translateY(-100%);
  transition:transform .28s ease;display:flex;flex-direction:column;padding:16px;gap:10px}
.vr-mobile-nav a{padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06)}
.vr-mobile-nav.is-open{transform:translateY(0)}
/* Desktop fallback */
@media (min-width:768px){
  .vr-burger{display:none}
  .vr-mobile-nav{position:static;transform:none;background:transparent;flex-direction:row;gap:8px;padding:0}
  .vr-mobile-nav a{background:transparent;border:0;padding:10px 12px}
}
/* Grid normalisation */
.grid, .cards, .items, .row{display:grid;gap:var(--vr-gap)}
@media (min-width:600px){.grid, .cards, .items, .row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){.grid, .cards, .items, .row{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card, .box, .panel{background:var(--vr-surface);border:1px solid rgba(255,255,255,.06);border-radius:var(--vr-radius);overflow:hidden}
.card > img, .panel > img{display:block;width:100%;height:auto}
.card .body, .panel .body, .content{padding:14px}
.meta{color:var(--vr-muted);font-size:14px}
/* Tables -> mobile */
table{width:100%;border-collapse:separate;border-spacing:0 10px}
thead th{font-size:14px;color:var(--vr-muted);font-weight:600}
tbody tr{background:var(--vr-surface);border:1px solid rgba(255,255,255,.06)}
tbody tr td:first-child{border-top-left-radius:12px;border-bottom-left-radius:12px}
tbody tr td:last-child{border-top-right-radius:12px;border-bottom-right-radius:12px}
/* Forms */
input, select, textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0e0e10;color:var(--vr-text)}
textarea{min-height:120px}
/* Image CLS fix */
img[width][height]{height:auto}
/* Optional sticky CTA */
.vr-cta-sticky{position:fixed;inset:auto 16px 16px 16px;z-index:999}