/* Garlits Swamp Rat Gallery — everything is scoped under .srg.
   Sizes use --srg-r / --srg-u (px) instead of rem: the theme's root font-size is 10px. */
.srg{
  --srg-r:17px; --srg-u:16px;
  --bg:#0b0c0e; --surface:#14161a; --surface2:#1c1f24; --line:rgba(255,255,255,.1);
  --text:#f3f4f6; --muted:#b9bec6; --accent:#e10600; --accent2:#ffd400; --glow:rgba(225,6,0,.45);
  --display:"Barlow Condensed","Oswald","Arial Narrow",system-ui,sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --max:1600px; --radius:12px; --sticky:0px;
  --carbon:radial-gradient(rgba(255,255,255,.035) 1px,transparent 1.5px) 0 0/6px 6px,linear-gradient(180deg,#121417,#0b0c0e);
  --checker:conic-gradient(#f3f4f6 25%,#0b0c0e 0 50%,#f3f4f6 0 75%,#0b0c0e 0) 0 0/10px 10px;
  background:var(--bg);color:var(--text);font-family:var(--body);font-size:var(--srg-r);line-height:1.6;text-align:left;
  -webkit-font-smoothing:antialiased;
}
.srg *,.srg *::before,.srg *::after{box-sizing:border-box}
.srg img{max-width:100%;display:block;height:auto;border:0;box-shadow:none}
/* theme-proofing */
.srg button{font:inherit;color:inherit;text-transform:none;letter-spacing:inherit;text-shadow:none;box-shadow:none;line-height:inherit;min-height:0;width:auto}
.srg h1,.srg h2,.srg h3,.srg h4{color:var(--text);text-shadow:none;border:0;padding:0;letter-spacing:normal}
.srg p{color:inherit}
.srg a{color:var(--accent2)}
.srg ul{list-style:none}
.srg :focus-visible{outline:3px solid var(--accent2);outline-offset:3px}
.srg-wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(16px,3vw,32px)}
.srg-empty{padding:48px 16px;text-align:center}

/* hero */
.srg .srg-hero{background:var(--carbon);text-align:center;padding:clamp(48px,7vw,96px) 16px clamp(36px,5vw,64px);position:relative;overflow:hidden}
.srg .srg-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:var(--checker);opacity:.9}
.srg .srg-eyebrow{display:inline-flex;align-items:center;gap:12px;font:700 calc(.92*var(--srg-r))/1 var(--display);letter-spacing:.32em;text-transform:uppercase;color:var(--accent2)}
.srg .srg-eyebrow::before,.srg .srg-eyebrow::after{content:"";width:36px;height:3px;background:var(--accent)}
.srg .srg-hero h1{margin:16px auto 12px;font:italic 800 clamp(calc(2.6*var(--srg-u)),7vw,calc(5.4*var(--srg-u)))/.92 var(--display);text-transform:uppercase;letter-spacing:.01em;max-width:16ch;
  background:linear-gradient(180deg,#fff 0%,#d9dde2 48%,#9ba2aa 52%,#f1f3f5 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.srg .srg-hero p{max-width:62ch;margin:0 auto;color:var(--muted);font-size:calc(1.15*var(--srg-r))}
.srg .srg-stats{display:flex;justify-content:center;gap:clamp(20px,5vw,64px);margin-top:28px;flex-wrap:wrap}
.srg .srg-stats strong{display:block;font:italic 800 clamp(calc(2*var(--srg-u)),4vw,calc(3*var(--srg-u)))/1 var(--display);color:var(--text)}
.srg .srg-stats span{font-size:calc(.85*var(--srg-r));letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* speed chart */
.srg .srg-speed{padding-top:clamp(32px,5vw,56px);padding-bottom:8px}
.srg .srg-sec-title{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:0 0 6px}
.srg .srg-sec-title h2{margin:0;font:italic 800 clamp(calc(1.9*var(--srg-u)),3.6vw,calc(2.8*var(--srg-u)))/1 var(--display);text-transform:uppercase}
.srg .srg-sec-title small{font:700 calc(.9*var(--srg-r))/1 var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--accent2)}
.srg .srg-lead{margin:0 0 18px;color:var(--muted);max-width:75ch}
.srg .srg-chart{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px 18px 10px;position:relative}
.srg .srg-chart svg{width:100%;height:auto;display:block;overflow:visible}
.srg .srg-chart .bar{cursor:pointer;transition:opacity .15s}
.srg .srg-chart .bar:focus{outline:none}
.srg .srg-chart:hover .bar{opacity:.55}
.srg .srg-chart:hover .bar:hover,.srg .srg-chart .bar:focus{opacity:1}
.srg .srg-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin:12px 4px 4px;font-size:calc(.95*var(--srg-r));color:var(--muted)}
.srg .srg-tip{position:absolute;pointer-events:none;background:#000;border:1px solid var(--accent);border-radius:8px;padding:8px 12px;font-size:calc(.95*var(--srg-r));line-height:1.35;white-space:nowrap;transform:translate(-50%,-110%);opacity:0;transition:opacity .12s;z-index:5;color:var(--text)}
.srg .srg-tip b{font:italic 800 calc(1.15*var(--srg-r))/1 var(--display);text-transform:uppercase;display:block}
.srg .srg-tip.on{opacity:1}

/* sticky bar */
.srg .srg-nav{position:sticky;top:var(--sticky);z-index:30;background:rgba(11,12,14,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);margin-top:28px}
.srg .srg-nav::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:linear-gradient(90deg,var(--accent) 0 18%,transparent 18% 20%,var(--accent) 20% 24%,transparent 24%)}
.srg .srg-nav-in{max-width:var(--max);margin:0 auto;padding:10px clamp(16px,3vw,32px);display:flex;flex-direction:column;gap:10px}
.srg .srg-eras{display:flex;gap:8px;flex-wrap:wrap}
.srg .srg-era-btn{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:8px 16px;margin:0;font:700 calc(1.02*var(--srg-r))/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);cursor:pointer}
.srg .srg-era-btn:hover{color:#fff;background:var(--surface2);border-color:rgba(255,255,255,.25)}
.srg .srg-era-btn i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:1px}
.srg .srg-era-btn[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 0 18px var(--glow)}
.srg .srg-strip{display:flex;align-items:center;gap:8px}
.srg .srg-chips{flex:1;min-width:0;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;padding:2px}
.srg .srg-chips::-webkit-scrollbar{display:none}
.srg .srg-chip{flex:0 0 auto;scroll-snap-align:start;height:42px;padding:0 14px;margin:0;border-radius:6px;border:1px solid var(--line);border-bottom:3px solid var(--c,#555);background:var(--surface);font:700 calc(1.05*var(--srg-r))/1 var(--display);letter-spacing:.04em;color:var(--muted);cursor:pointer;transform:skewX(-10deg)}
.srg .srg-chip>span{display:inline-block;transform:skewX(10deg)}
.srg .srg-chip:hover{color:#fff;background:var(--surface2)}
.srg .srg-chip.on{background:#fff;color:#111}
.srg .srg-chip[hidden]{display:none}
.srg .srg-arrow{flex:0 0 auto;width:44px;height:44px;padding:0;margin:0;border-radius:50%;border:1px solid var(--accent);background:var(--accent);color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 14px var(--glow)}
.srg .srg-arrow:hover{background:#ff2a1f;color:#fff}
.srg .srg-arrow:disabled{opacity:.25;background:var(--surface);border-color:var(--line);box-shadow:none;cursor:default}

/* eras + cards */
.srg .srg-era{padding:clamp(36px,5vw,64px) 0 0;scroll-margin-top:calc(var(--sticky) + 130px)}
.srg .srg-era[hidden]{display:none}
.srg .srg-era-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;border-left:6px solid var(--c);padding-left:16px;margin-bottom:22px}
.srg .srg-era-head h2{margin:0;font:italic 800 clamp(calc(1.8*var(--srg-u)),3.4vw,calc(2.6*var(--srg-u)))/1 var(--display);text-transform:uppercase}
.srg .srg-era-head p{margin:6px 0 0;color:var(--muted);max-width:70ch}
.srg .srg-count{color:var(--muted);font:700 var(--srg-r)/1 var(--display);letter-spacing:.14em;text-transform:uppercase}
.srg .srg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:clamp(14px,2vw,24px);list-style:none;margin:0;padding:0}
.srg .srg-grid>li{margin:0;padding:0}
.srg .srg-grid>li::before{display:none}
.srg .srg-card{width:100%;height:100%;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s;scroll-margin-top:calc(var(--sticky) + 150px);text-align:left;padding:0;margin:0;color:var(--text)}
.srg .srg-card:hover,.srg .srg-card:focus-visible{background:var(--surface);color:var(--text);transform:translateY(-4px);border-color:rgba(255,255,255,.25);box-shadow:0 14px 34px rgba(0,0,0,.55),0 0 0 1px var(--c)}
.srg .srg-card.flash{animation:srg-flash 1.4s ease}
@keyframes srg-flash{0%,40%{box-shadow:0 0 0 4px var(--accent2)}100%{box-shadow:none}}
.srg .srg-media{position:relative;aspect-ratio:4/3;background:#000;overflow:hidden;width:100%}
.srg .srg-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.srg .srg-card:hover .srg-media img{transform:scale(1.05)}
.srg .srg-media::after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(11,12,14,.92))}
.srg .srg-plate{position:absolute;left:12px;bottom:12px;z-index:1;background:var(--accent2);color:#111;border-radius:6px;padding:5px 12px 4px;font:italic 800 calc(1.5*var(--srg-r))/1 var(--display);text-transform:uppercase;box-shadow:0 4px 10px rgba(0,0,0,.5);border:2px solid #111}
.srg .srg-photos{position:absolute;right:12px;top:12px;z-index:1;background:rgba(0,0,0,.72);border-radius:999px;padding:4px 12px;font-size:calc(.85*var(--srg-r));color:#fff}
.srg .srg-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1;width:100%}
.srg .srg-name{margin:0;font:italic 800 calc(1.55*var(--srg-r))/1.05 var(--display);text-transform:uppercase}
.srg .srg-nick{color:var(--accent2);font-size:var(--srg-r);min-height:1.5em}
.srg .srg-specs{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-radius:8px;overflow:hidden;margin-top:auto}
.srg .srg-specs>div{background:var(--surface2);padding:8px 12px}
.srg .srg-specs span{display:block;font:700 calc(.8*var(--srg-r))/1 var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.srg .srg-specs strong{font:italic 800 calc(1.45*var(--srg-r))/1.1 var(--display);color:var(--text)}
.srg .srg-specs strong.srg-spec-text{font-size:calc(1.05*var(--srg-r))}
.srg .srg-specs em{font-style:normal;font-size:calc(.85*var(--srg-r));color:var(--muted);margin-left:3px}
.srg .srg-cta{color:var(--accent);font:700 calc(.95*var(--srg-r))/1 var(--display);letter-spacing:.18em;text-transform:uppercase;margin-top:8px}
.srg .srg-foot{padding:48px 16px 64px;margin:0;text-align:center;color:var(--muted)}
.srg .srg-foot b{color:var(--text)}

/* story pop-up */
.srg .srg-modal{border:0;padding:0;margin:auto;background:transparent;max-width:min(1180px,96vw);width:100%;max-height:94vh;color:var(--text);overflow:visible}
.srg .srg-modal::backdrop{background:rgba(0,0,0,.82);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.srg .srg-m{background:var(--bg);border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;max-height:94vh;font-size:var(--srg-r);line-height:1.65}
.srg .srg-m-scroll{overflow:auto;overscroll-behavior:contain}
.srg .srg-m-hero{position:relative;aspect-ratio:21/9;background:#000}
.srg .srg-m-hero img{width:100%;height:100%;object-fit:cover;opacity:.85}
.srg .srg-m-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,var(--bg))}
.srg .srg-m-head{position:absolute;left:clamp(16px,3vw,36px);right:16px;bottom:16px;z-index:1}
.srg .srg-m-head .srg-plate{position:static;display:inline-block;margin-bottom:10px}
.srg .srg-m-head h2{margin:0;font:italic 800 clamp(calc(2.2*var(--srg-u)),5vw,calc(3.8*var(--srg-u)))/.95 var(--display);text-transform:uppercase;text-shadow:0 3px 14px #000}
.srg .srg-m-head .srg-nick{font-size:calc(1.15*var(--srg-r))}
.srg .srg-x{position:absolute;top:14px;right:14px;z-index:3;width:46px;height:46px;padding:0;margin:0;border-radius:50%;border:1px solid var(--line);background:rgba(0,0,0,.7);color:#fff;font-size:26px;line-height:1;cursor:pointer}
.srg .srg-x:hover{background:var(--accent);color:#fff}
.srg .srg-m-body{padding:clamp(18px,3vw,36px);display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:clamp(20px,3vw,40px)}
.srg .srg-m-story p,.srg .srg-m-story li{margin:0 0 1em;font-size:calc(1.12*var(--srg-r));color:#dfe2e6;max-width:68ch}
.srg .srg-m-story h3{font:italic 800 calc(1.5*var(--srg-r))/1.1 var(--display);text-transform:uppercase;margin:1.2em 0 .5em;color:var(--accent2)}
.srg .srg-m-story h3:first-child{margin-top:0}
.srg .srg-m-story ul,.srg .srg-m-story ol{padding-left:1.2em;list-style:disc}
.srg .srg-m-side .srg-specs{margin:0 0 18px}
.srg .srg-m-side .srg-specs strong{font-size:calc(2*var(--srg-r))}
.srg .srg-m-side .srg-specs strong.srg-spec-text{font-size:calc(1.2*var(--srg-r))}
.srg .srg-book{border:1px dashed rgba(255,212,0,.5);border-radius:10px;padding:12px 14px;color:var(--muted);font-size:calc(.95*var(--srg-r))}
.srg .srg-book b{color:var(--accent2)}
.srg .srg-gal{padding:0 clamp(18px,3vw,36px) clamp(18px,3vw,36px)}
.srg .srg-gal h3{font:700 var(--srg-r)/1 var(--display);letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}
.srg .srg-gal ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.srg .srg-gal li{margin:0;padding:0}
.srg .srg-gal button{display:block;width:100%;height:100%;padding:0;margin:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--surface);cursor:zoom-in;text-align:left;color:var(--muted)}
.srg .srg-gal button:hover{border-color:var(--accent);background:var(--surface)}
.srg .srg-gal img{width:100%;aspect-ratio:4/3;object-fit:cover}
.srg .srg-gal span{display:block;padding:8px 10px;font-size:calc(.88*var(--srg-r));line-height:1.35;color:var(--muted)}
.srg .srg-gal span b{color:var(--accent2);font-weight:600}
.srg .srg-m-nav{display:flex;justify-content:space-between;gap:12px;padding:12px clamp(16px,3vw,36px);border-top:1px solid var(--line);background:var(--surface)}
.srg .srg-m-nav button{border:1px solid var(--line);background:transparent;border-radius:8px;padding:10px 14px;margin:0;font:700 calc(1.05*var(--srg-r))/1.1 var(--display);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;max-width:48%;color:var(--text)}
.srg .srg-m-nav button:hover{border-color:var(--accent);background:transparent;color:#fff}
.srg .srg-lb{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.95);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}
.srg .srg-lb[hidden]{display:none}
.srg .srg-lb img{max-width:94vw;max-height:80vh;width:auto;object-fit:contain;border-radius:6px}
.srg .srg-lb p{color:#ddd;font-size:calc(1.05*var(--srg-r));text-align:center;margin:14px 0 0}
.srg .srg-lb .srg-x{position:fixed}
.srg .srg-lp,.srg .srg-ln{position:fixed;top:50%;width:52px;height:52px;padding:0;margin:0;border-radius:50%;border:1px solid var(--accent);background:var(--accent);color:#fff;font-size:28px;line-height:1;cursor:pointer;transform:translateY(-50%)}
.srg .srg-lp:hover,.srg .srg-ln:hover{background:#ff2a1f;color:#fff}
.srg .srg-lp{left:14px}.srg .srg-ln{right:14px}

/* preview bar (staff only, before go-live) */
.srg-preview-bar{position:relative;z-index:31;background:#ffd400;color:#111;padding:10px 16px;font:600 15px/1.4 system-ui,sans-serif;text-align:center}
.srg-preview-bar a{color:#111;text-decoration:underline}

@media (max-width:860px){.srg .srg-m-body{grid-template-columns:1fr}.srg .srg-m-hero{aspect-ratio:16/10}}
@media (max-width:760px){
  .srg .srg-eras{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .srg .srg-eras::-webkit-scrollbar{display:none}
  .srg .srg-era-btn{flex:0 0 auto;padding:8px 12px}
  .srg .srg-stats>div{min-width:40%}
}
@media (max-width:520px){.srg .srg-grid{grid-template-columns:1fr}.srg .srg-arrow{width:40px;height:40px}}
@media (prefers-reduced-motion:reduce){.srg *{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* Beaver Builder theme: full-width page, no duplicate title, no red title banner (same as the Hall of Fame page) */
body:has(.srg) .fl-post-header{display:none}
body:has(.srg) .fl-content-full.container{width:100%;max-width:none;padding:0}
body:has(.srg) .fl-content-full>.row{margin:0}
body:has(.srg) .fl-content{margin:0;padding:0;width:100%;float:none}
body:has(.srg) .fl-post{margin:0}
body:has(.srg) .fl-builder-content .fl-row.fl-node-839uzojlq10i{display:none}
.admin-bar .srg{--sticky:32px}
@media (max-width:782px){.admin-bar .srg{--sticky:0px}}
