/* ==========================================================
   THE SURVIVORS ENCLAVE — v4A (Neon Hazard) • CLEAN BUILD
   ========================================================== */

/* TOKENS */
:root{
  --wrap: 1200px;
  --gutter: min(5vw,28px);
  --ink:#fff;
  --muted:#c9c9c9;
  --accent:#ff6a2b;
  --accent-glow: rgba(255,106,43,.45);
  --ring:#222428;
  --panel:#111316;
  --panel-2:#0e1114;
}

/* GLOBAL */
html,body{
  margin:0; color:var(--ink);
  background:
    radial-gradient(1200px 560px at 12% -20%, rgba(255,106,43,.08), transparent 60%),
    radial-gradient(1200px 560px at 88% 120%, rgba(255,106,43,.06), transparent 60%),
    linear-gradient(180deg,#0c0d10 0%,#121318 55%,#0c0e12 100%);
  background-attachment: fixed, fixed, fixed;
}
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:url("https://thesurvivorsenclave.com/sites/thesurvivorsenclave.com/themes/custom/thex/images/grain-texture.png") center/320px repeat;
  opacity:.24; mix-blend-mode:soft-light;
}

/* TYPE / LAYOUT */
h1,h2,h3,.section-title,.lede{
  font-family:"Bebas Neue",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  text-transform:uppercase; line-height:.95; letter-spacing:.015em; margin:0 0 .25rem;
}
p,li,small{ font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; }
.wrap{ width:min(var(--wrap),100%); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding-block:clamp(26px,5vw,64px); }
.section--tight{ padding-block:clamp(16px,3vw,28px); }

/* ==========================================================
   HEADER / LOGO — FORCE CENTER (Drupal wrappers)
   ========================================================== */
.header-top-container,
.header-top-block.header-top-left,
.block-region.region-header-top-left{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  width:100% !important;
  flex:1 1 100% !important;
}
#block-thex-sitebranding{
  width:100% !important;
  display:grid !important;
  place-items:center !important;
  margin:0 auto !important;
  padding-block:clamp(22px,4vw,48px) !important;
}
#block-thex-sitebranding .block-content,
#block-thex-sitebranding .site-branding{
  width:100% !important;
  display:grid !important;
  place-items:center !important;
  text-align:center !important;
}
#block-thex-sitebranding .site-logo{ margin:0 !important; float:none !important; }
#block-thex-sitebranding .site-logo a{ display:block !important; line-height:0 !important; }
#block-thex-sitebranding .site-logo img{
  display:block !important; margin:0 auto !important;
  width:clamp(380px,28vw,780px) !important; height:auto !important;
  filter:drop-shadow(0 8px 26px rgba(0,0,0,.55));
  transition:transform .22s ease;
}
#block-thex-sitebranding .site-logo img:hover{ transform:scale(1.02); }

/* HAZARD ELEMENTS */
.divider-chevron{
  height:12px; width:min(var(--wrap),96%); margin:clamp(12px,2.5vw,24px) auto;
  border-radius:3px; position:relative; overflow:hidden;
  background:repeating-linear-gradient(135deg, transparent 0 18px, var(--accent) 18px 36px);
  box-shadow:0 0 0 1px var(--ring) inset, 0 0 22px var(--accent-glow);
  opacity:.9;
}
.hazard-bar{
  height:22px; border-radius:4px; border:1px solid var(--ring);
  background:repeating-linear-gradient(135deg, var(--accent) 0 18px, transparent 18px 36px);
  box-shadow:0 0 18px var(--accent-glow);
}

/* CTAS */
.cta,.btn,a.button{
  display:inline-block; background:var(--accent); color:#000!important;
  padding:.9rem 1.3rem; border-radius:.4rem; font-weight:800; text-decoration:none;
  text-transform:uppercase; letter-spacing:.04em;
  box-shadow:0 10px 28px rgba(0,0,0,.35), 0 0 12px var(--accent-glow);
  transition:transform .15s, box-shadow .15s, filter .15s;
}
.cta:hover,.btn:hover,a.button:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 40px rgba(0,0,0,.4), 0 0 18px var(--accent-glow);
  filter:saturate(1.1);
}

/* FEATURED GAMES */
#block-thex-views-block-featured-games-block-1{ margin-block:clamp(10px,3vw,22px); }
#block-thex-views-block-featured-games-block-1 .block-title{
  text-align:center; letter-spacing:.06em; font-size:clamp(22px,3.2vw,34px); margin:0 0 12px;
}
#block-thex-views-block-featured-games-block-1 > .block-content{
  width:min(var(--wrap),100%); margin-inline:auto; padding-inline:var(--gutter);
}
#block-thex-views-block-featured-games-block-1 > .block-content > div{
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
  border:1px solid var(--ring); border-radius:14px;
  box-shadow:0 14px 40px rgba(0,0,0,.35);
  padding:clamp(10px,1.4vw,16px);
}
/* Slick arrows */
.slick-prev,.slick-next{
  width:40px;height:40px;border-radius:50%;
  background:#0f1114;border:1px solid #2a2e34!important;
  box-shadow:0 6px 14px rgba(0,0,0,.35), 0 0 10px rgba(255,255,255,.05);
}
.slick-prev:hover,.slick-next:hover{ border-color:var(--accent)!important; box-shadow:0 0 16px var(--accent-glow); }
.slick-prev:before,.slick-next:before{ color:#fff;font-size:20px; }

/* RECENT ARTICLES */
#block-thex-views-block-duplicate-of-recent-content-block-1{ margin-top:clamp(22px,4.5vw,48px); }
#block-thex-views-block-duplicate-of-recent-content-block-1 .block-title{
  text-align:center; letter-spacing:.06em; font-size:clamp(20px,3vw,30px); margin:0 0 12px; position:relative;
}
#block-thex-views-block-duplicate-of-recent-content-block-1 .block-title::after{
  content:""; width:140px; height:6px; background:var(--accent);
  border-radius:3px; display:block; margin:10px auto 0; box-shadow:0 0 18px var(--accent-glow);
}
#block-thex-views-block-duplicate-of-recent-content-block-1 > .block-content{
  width:min(var(--wrap),100%); margin-inline:auto; padding-inline:var(--gutter);
}
#block-thex-views-block-duplicate-of-recent-content-block-1 .view-content{
  display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
}

/* Cards */
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-row{
  border:1px solid var(--ring); border-radius:12px; overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  transition:transform .15s, border-color .15s, box-shadow .15s;
  box-shadow:0 10px 28px rgba(0,0,0,.26);
}
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-row:hover{
  transform:translateY(-3px); border-color:var(--accent);
  box-shadow:0 16px 40px rgba(0,0,0,.34), 0 0 14px var(--accent-glow);
}

/* Image */
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-field-field-image{
  order:0; margin:0 !important; position:static !important; z-index:auto !important;
}
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-field-field-image img{
  display:block; width:100%; height:auto; border-bottom:1px solid rgba(255,255,255,.07);
}

/* Title */
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-field-title{
  order:1; position:static !important; display:block !important;
  visibility:visible !important; opacity:1 !important; height:auto !important; overflow:visible !important;
  margin:0; padding:.85rem 1rem .35rem;
  border-bottom:2px solid rgba(255,255,255,.06);
  font-family:"Bebas Neue",sans-serif; font-size:1.7rem; line-height:.95; letter-spacing:.01em;
}
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-field-title a{
  display:block; color:#fff !important; text-decoration:none;
}
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-field-title a:hover{ filter:brightness(1.08); }
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-field-title:not(:first-of-type){ display:none !important; }

/* Meta / Summary */
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-field-created,
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-field-body{
  order:2; padding:0 1rem 1rem; color:var(--muted);
}
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-field-body{ color:#e4e4e4; }

/* DISCORD */
#block-thex-discordblock > .block-content{
  width:min(var(--wrap),100%); margin-inline:auto; padding-inline:var(--gutter);
}
.discord-embed{
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
  border:1px solid var(--ring); border-radius:12px;
  padding:clamp(12px,2vw,18px); box-shadow:0 8px 22px rgba(0,0,0,.25);
}

/* SERVER RULES */
#block-thex-therulesblock > .block-content{
  width:min(var(--wrap),100%); margin-inline:auto; padding-inline:var(--gutter);
}
#block-thex-therulesblock{
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0));
  border:1px solid var(--ring); border-radius:14px;
  box-shadow:0 14px 36px rgba(0,0,0,.28), 0 0 18px var(--accent-glow);
  padding:clamp(18px,3vw,26px); position:relative; overflow:hidden;
}
#block-thex-therulesblock .block-title{
  font-family:"Bebas Neue",sans-serif; font-size:clamp(26px,4.2vw,40px);
  margin:0 0 .35rem; text-align:center; letter-spacing:.04em;
}
#block-thex-therulesblock .block-title::after{
  content:""; display:block; width:160px; height:6px; margin:.5rem auto 0;
  background:var(--accent); border-radius:3px; box-shadow:0 0 16px var(--accent-glow);
}
#block-thex-therulesblock::before{
  content:""; position:absolute; inset:0 auto 0 0; width:12px; opacity:.7;
  background:repeating-linear-gradient(180deg, var(--accent) 0 18px, transparent 18px 36px);
  border-top-left-radius:14px; border-bottom-left-radius:14px; box-shadow:0 0 14px var(--accent-glow);
}
#block-thex-therulesblock ol{
  counter-reset:rule; list-style:none; padding-left:0; margin:12px 0 0; columns:1; column-gap:2rem;
}
#block-thex-therulesblock li{
  break-inside:avoid; margin:.55rem 0; color:var(--muted); line-height:1.6;
  padding-left:3.1rem; position:relative;
}
#block-thex-therulesblock li::before{
  counter-increment:rule; content:counter(rule, decimal-leading-zero);
  position:absolute; left:0; top:.1rem; font-weight:900; width:2.4rem;
  color:#000; background:var(--accent); border-radius:.35rem; text-align:center; padding:.15rem .25rem;
}
@media (min-width:980px){ #block-thex-therulesblock ol{ columns:2; } }

/* FOOTER ACCENT */
.footer-accent{
  margin-top:clamp(36px,6vw,80px); height:16px;
  background:
    linear-gradient(to right,var(--accent),var(--accent)) left/200px 100% no-repeat,
    repeating-linear-gradient(135deg, transparent 0 20px, rgba(255,255,255,.06) 20px 40px);
  box-shadow:0 0 18px var(--accent-glow) inset, 0 0 18px var(--accent-glow);
  opacity:.95;
}

/* MISC */
.block-title{ color:#fff !important; }
a{ color:var(--accent); }
a:hover{ filter:brightness(1.1); }

/* RESPONSIVE */
@media (max-width:768px){
  .discord-embed{ padding:16px; }
  #block-thex-sitebranding .site-branding{ padding-block:clamp(18px,5vw,28px); }
}
