/* CLIPHORIUM_SITE_V20 (SAFE global theme + 1400px rail + NO sideways scroll) */

:root{
  --ch-rail: 1400px;
  --ch-pad: 18px;

  --bg:#050505;
  --panel: rgba(255,255,255,.035);
  --stroke: rgba(255,255,255,.12);

  --gold:#D4AF37;
  --goldHi:#F6E08A;

  --t1: rgba(255,255,255,.92);
  --t2: rgba(255,255,255,.72);
  --tm: rgba(255,255,255,.50);

  --shadow: 0 18px 60px rgba(0,0,0,.55);
}

/* ✅ Prevent sideways scroll globally */
html, body{
  margin:0;
  padding:0;
  min-height:100%;
  color: var(--t1);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;

  background:
    radial-gradient(900px 500px at 20% -10%, rgba(212,175,55,.12), transparent 60%),
    radial-gradient(700px 420px at 85% 10%, rgba(217,217,217,.10), transparent 60%),
    radial-gradient(900px 550px at 50% 110%, rgba(139,92,246,.10), transparent 60%),
    var(--bg);

  overflow-x: hidden;
}

/* ✅ Box sizing avoids padding overflow */
*, *::before, *::after{
  box-sizing: border-box;
}

/* ✅ Link look */
a{ color: var(--t2); text-decoration: none; }
a:hover{ color: var(--goldHi); }

/* ✅ Rail helper class */
.ch-rail{
  max-width: var(--ch-rail);
  margin-left:auto;
  margin-right:auto;
  padding-left: var(--ch-pad);
  padding-right: var(--ch-pad);
}

/* ✅ Gentle rail for your common containers */
:where(.wrap, .container, .page-inner, .ch-main, .pricing-wrap, .playback-wrap){
  max-width: var(--ch-rail);
  margin-left:auto;
  margin-right:auto;
  padding-left: var(--ch-pad);
  padding-right: var(--ch-pad);
}

/* ✅ Force common offenders to stay inside viewport */
img, video, canvas, iframe, svg{
  max-width: 100%;
  height: auto;
  display: block;
}

/* ✅ Any accidental 100vw elements cause overflow — clamp them */
:where(header, footer, .ch-nav-wrap, .ch-footer, .wrap){
  max-width: 100%;
}

@media (max-width: 720px){
  :root{ --ch-pad: 16px; }
}

/* ===== MOBILE BG LOCK (V1) ===== */
/* iOS Safari sometimes drops backdrop/gradient unless html/body are pinned */

html, body{
  background: #050505 !important;
  min-height: 100%;
}

body{
  position: relative;
  overflow-x: hidden;
}

/* Force the same “gold haze” glow layer everywhere */
body::before{
  content:"";
  position: fixed;
  inset: -40px;
  z-index: -1;
  pointer-events: none;

  background:
    radial-gradient(900px 600px at 15% 10%, rgba(212,175,55,.16), transparent 60%),
    radial-gradient(700px 500px at 85% 20%, rgba(245,214,106,.10), transparent 62%),
    radial-gradient(850px 650px at 50% 90%, rgba(212,175,55,.08), transparent 64%);

  filter: blur(0px);
  opacity: 1;
}

/* ===== CLIPHORIUM BG LOCK (V2) ===== */
html, body{
  background: #050505 !important;
  min-height: 100%;
  overflow-x: hidden; /* prevents side-scroll glitches */
}

/* ===== CLIPHORIUM_ENTERPRISE_RAIL_V1 (1400px unified layout) ===== */
:root{
  --chRail: 1400px;
  --chGutter: 22px;
}

/* Stop annoying left-right scroll (mobile + desktop) */
html, body{
  overflow-x: hidden !important;
}

/* Universal rail helper */
.ch-rail{
  width: min(var(--chRail), calc(100vw - (var(--chGutter) * 2)));
  margin-left: auto;
  margin-right: auto;
}

/* Make main shells match the rail */
main,
.pb-shell,
.jobs-page main,
.pricing-page main{
  width: min(var(--chRail), calc(100vw - (var(--chGutter) * 2)));
  margin-left: auto;
  margin-right: auto;
}

/* Keep consistent padding on small screens */
@media (max-width: 720px){
  :root{ --chGutter: 16px; }
}
