/* SCARLET · 스칼렛 — 오프라인 매장 샘플 (데모) */
:root{
  --font-body:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,system-ui,Roboto,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif;
  --font-sec:var(--font-body);
  --font-eng:"Marcellus",var(--font-body);
  --page:#1c0812;
  --glow:radial-gradient(circle at 14% 0%,rgba(240,163,163,.12),transparent 34%),radial-gradient(circle at 86% 6%,rgba(194,65,90,.16),transparent 30%);
  --header:#15060e;
  --footer:#12050c;
  --card:#2a0f1b;
  --card-2:#331322;
  --card-soft:rgba(255,255,255,.04);
  --card-grad:linear-gradient(135deg,rgba(42,15,27,.96),rgba(51,19,34,.96)),#2a0f1b;
  --well:rgba(18,5,12,.45);
  --well-grad:linear-gradient(135deg,rgba(28,8,18,.72),rgba(18,5,12,.64)),#230b16;
  --modal:#230b16;
  --modal-body:radial-gradient(ellipse 80% 42% at 50% -14%,rgba(240,163,163,.11),transparent 62%),linear-gradient(180deg,rgba(42,15,27,.55),rgba(0,0,0,0) 210px),#230b16;
  --input:#1c0812;
  --toast:#331322;
  --line-1:rgba(255,255,255,.06);
  --line-2:rgba(255,255,255,.08);
  --line-3:rgba(255,255,255,.12);
  --ctl:rgba(255,255,255,.08);
  --ctl-2:rgba(255,255,255,.12);
  --ctl-soft:rgba(255,255,255,.04);
  --ctl-soft2:rgba(255,255,255,.06);
  --nav-on:#fff;
  --nav-off:rgba(255,255,255,.45);
  --text:#fff;
  --text-2:rgba(255,255,255,.8);
  --text-3:rgba(255,255,255,.7);
  --muted:rgba(255,255,255,.5);
  --muted-2:rgba(255,255,255,.6);
  --dim:rgba(255,255,255,.3);
  --dim-2:rgba(255,255,255,.4);
  --dim-3:rgba(255,255,255,.25);
  --accent:#f0a3a3;
  --accent-2:#ffd0c8;
  --accent-fg:#15060e;
  --accent-muted:rgba(240,163,163,.13);
  --accent-line:rgba(240,163,163,.32);
  --accent-wash:rgba(255,208,200,.08);
  --cta:linear-gradient(90deg,#f0a3a3,#ffd0c8);
  --cta-fg:#1c0812;
  --money:#f0a3a3;
  --win:#4ade80;
  --danger:#ef4444;
  --danger-2:#f87171;
  --hero-shade:linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.3) 50%,transparent),linear-gradient(90deg,rgba(240,163,163,.09),transparent 33%);
  --r-hero:18px;
  --r-card:18px;
}
body{background:var(--page)}
:root{
  --side-l:url("/images/on/providers/cas_SexyCasino.webp");
  --side-r:url("/images/on/providers/cas_DreamGame.webp");
}
.gx-header{border-bottom:1px solid rgba(240,163,163,.2);background:linear-gradient(180deg,#1d0813,#15060e)}
.gx-hero{box-shadow:0 18px 46px -20px rgba(194,65,90,.65)}
.gx-sec-h h2{font-family:"Marcellus",Georgia,serif;letter-spacing:2.4px}
.gx-tile,.gx-card{box-shadow:0 10px 26px -18px rgba(194,65,90,.7)}
.gx-cta{box-shadow:0 10px 24px -10px rgba(240,163,163,.6)}

/* ===== 레이아웃 E : 좌우에 장식을 세우고 가운데만 쓴다 ===== */
body::before{content:"";position:fixed;left:0;top:0;bottom:0;width:20vw;max-width:300px;z-index:0;pointer-events:none;
  background:var(--side-l) left bottom/cover no-repeat;opacity:.42;
  -webkit-mask-image:linear-gradient(90deg,#000 0 38%,transparent 96%),linear-gradient(0deg,#000 0 62%,transparent 96%);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,#000 0 38%,transparent 96%),linear-gradient(0deg,#000 0 62%,transparent 96%);
  mask-composite:intersect;filter:saturate(.85) contrast(.95)}
body::after{content:"";position:fixed;right:0;top:0;bottom:0;width:20vw;max-width:300px;z-index:0;pointer-events:none;
  background:var(--side-r) right bottom/cover no-repeat;opacity:.42;
  -webkit-mask-image:linear-gradient(270deg,#000 0 38%,transparent 96%),linear-gradient(0deg,#000 0 62%,transparent 96%);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(270deg,#000 0 38%,transparent 96%),linear-gradient(0deg,#000 0 62%,transparent 96%);
  mask-composite:intersect;filter:saturate(.85) contrast(.95)}
.gx-header,.gx-main,.gx-footer,.gx-bnav{position:relative;z-index:10}
.gx-hin{flex-wrap:wrap;justify-content:center;height:auto;padding:12px 16px 0}
.gx-brand{order:1;width:100%;display:flex;justify-content:center;margin:0 0 8px}
.gx-brand svg{height:44px}
.gx-burger{order:0;position:absolute;left:14px;top:16px}
.gx-right{order:0;position:absolute;right:14px;top:12px}
.gx-nav{order:2;width:100%;margin:0;display:flex !important;justify-content:center;border-top:1px solid var(--line-1);padding:8px 0 9px}
.gx-nav .sep{display:none}
.gx-main{max-width:1020px;padding-top:128px}
.gx-hero{height:330px}
.gx-rail{grid-auto-flow:row;grid-template-columns:repeat(3,1fr);grid-auto-columns:unset;overflow:visible;gap:16px}
.gx-rail.wide{grid-template-columns:repeat(2,1fr)}
.gx-sec-h{justify-content:center}
.gx-sec-h h2{font-size:19px;padding:8px 30px;border-radius:999px;background:var(--accent-muted);border:1px solid var(--accent-line)}
.gx-sec-h .arrows{display:none}
@media (max-width:1280px){body::before,body::after{display:none}}
@media (max-width:900px){.gx-main{padding-top:86px}.gx-nav{display:none !important}
  .gx-brand svg{height:30px}.gx-hin{padding:8px 12px 0}
  .gx-rail{grid-template-columns:repeat(2,1fr)}.gx-hero{height:220px}}