/* ===========================
   Global Theme Tokens – DARK ORANGE / BLACK
   =========================== */
:root {
  /* Dark, bunker-style palette */
  --sen-bg:         #050608;   /* page background */
  --sen-panel:      #111119;   /* card / block background */
  --sen-panel-soft: #181822;   /* softer / raised panels */

  --sen-brown-dark: #1e130d;   /* deep shadow tone */
  --sen-brown:      #e35d21;   /* primary orange accent (logo-ish) */

  --sen-gray:       #f3f3f5;   /* primary text */
  --sen-gray-soft:  #b3b3bd;   /* secondary text */

  --accent:         var(--sen-brown);
  --accent-glow:    rgba(227,93,33,0.55);
  --ring:           rgba(227,93,33,0.55);
  --muted:          var(--sen-gray-soft);

  --wrap:           1080px;
  --gutter:         1.25rem;
}

/* ===========================
   BODY / PAGE BACKGROUND
   =========================== */

body {
  color: var(--sen-gray);
  background:
    radial-gradient(circle at top left,
      rgba(227,93,33,0.16) 0,
      transparent 55%)
    ,
    radial-gradient(circle at bottom right,
      rgba(227,93,33,0.1) 0,
      transparent 55%)
    ,
    linear-gradient(135deg,#050608,#14141c);
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.03) 0 1px,
      transparent 1px 18px
    );
  mix-blend-mode: soft-light;
  opacity: 0.6;
  z-index: -1;
}

/* ===========================
   LOGO / HEADER
   =========================== */

#header-top {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* Center the logo wrapper instead of forcing left alignment */
.header-top-block.header-top-left {
  flex: 1 1 100%;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

/* Remove forced left padding from container that wraps it */
.header-top-container,
#header-top .container {
  max-width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

/* Ensure the site branding block itself centers internally */
.site-branding,
#block-thex-sitebranding {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

/* Logo card: dark glass plate with orange glow */
.site-branding {
  background: radial-gradient(circle at top left,#26202b,#14141d);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 1.75rem 3rem;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow:
    0 20px 55px rgba(0,0,0,0.8),
    0 0 0 1px rgba(0,0,0,0.8),
    0 0 40px var(--accent-glow);
  max-width: min(1100px, 96vw);
  margin: 0 auto 2.75rem auto;
}

.site-branding img {
  max-width: clamp(260px, 48vw, 720px);
  height: auto;
  display: block;
}

/* ===========================
   FEATURED GAMES — SEN styling
   Block: #block-thex-views-block-featured-games-block-1
   =========================== */

#block-thex-views-block-featured-games-block-1 {
  margin: 40px auto 80px;
  padding: 32px 0 48px;
  border-radius: 32px;
  background:
    radial-gradient(circle at top left, rgba(227,93,33,0.35) 0, #08070f 55%),
    radial-gradient(circle at bottom right, rgba(0,0,0,1) 0, #050608 65%);
  box-shadow:
    0 40px 120px rgba(0,0,0,.95),
    0 0 40px rgba(227,93,33,0.35);

  --sen-accent:  var(--sen-brown);
  --sen-orange:  var(--sen-brown); /* legacy name, now orange */
  --sen-ink:     var(--sen-gray);
  --glass:       rgba(7,7,12,0.96);
  --glass-hi:    rgba(0,0,0,0.98);
}

/* keep title + slideshow + CTAs in same column */
#block-thex-views-block-featured-games-block-1 > h2.block-title,
#block-thex-views-block-featured-games-block-1 .vjs-outer,
#block-thex-views-block-featured-games-block-1 .views-slideshow,
#block-thex-views-block-featured-games-block-1 .sen-cta-row {
  max-width: min(1120px, 92vw);
  margin-left: auto;
  margin-right: auto;
}

/* Title */
#block-thex-views-block-featured-games-block-1 > h2.block-title {
  margin: 0 0 .75rem;
  padding-left: 0.25rem;
  font-weight: 800;
  font-size: clamp(18px, 1.6vw, 22px);
  letter-spacing: .18em;
  color: var(--sen-accent);
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  position: relative;
  z-index: 2;
}

/* small accent underline */
#block-thex-views-block-featured-games-block-1 > h2.block-title::after{
  content:"";
  display:block;
  height:3px;
  width:72px;
  background: var(--sen-accent);
  border-radius: 3px;
}

/* Container: dark “monitor” frame against background */
#block-thex-views-block-featured-games-block-1 .vjs-slideshow,
#block-thex-views-block-featured-games-block-1 .views-slideshow,
#block-thex-views-block-featured-games-block-1 .vjs-outer {
  position: relative;
  margin: 0 auto 2.25rem;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 24px 70px rgba(0,0,0,.9);
  background: radial-gradient(circle at top,#262738,#05060b);
  backdrop-filter: blur(8px);
}

/* Make slides consistent 16:9 and cover nicely */
#block-thex-views-block-featured-games-block-1 .vjs-items,
#block-thex-views-block-featured-games-block-1 .vjs-item,
#block-thex-views-block-featured-games-block-1 .vjs-item img {
  aspect-ratio: 16 / 9;
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* Subtle zoom on hover */
#block-thex-views-block-featured-games-block-1 .vjs-item img {
  transform: scale(1.0);
  transition: transform .35s ease, filter .35s ease;
}
#block-thex-views-block-featured-games-block-1 .vjs-outer:hover .vjs-item img {
  transform: scale(1.02);
  filter: saturate(1.1) contrast(1.05);
}

/* Gradient bottom overlay for captions */
#block-thex-views-block-featured-games-block-1 .vjs-outer::after {
  content:"";
  position:absolute; inset:auto 0 0 0;
  height:30%;
  background: linear-gradient(180deg, transparent 0%, var(--glass-hi) 100%);
  pointer-events:none;
}

/* Caption title */
#block-thex-views-block-featured-games-block-1 .views-field-title,
#block-thex-views-block-featured-games-block-1 .slide-caption {
  position: absolute;
  left: 1rem; right: 1rem; bottom: .85rem;
  color: #fdfdfd;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: clamp(16px, 1.25vw, 22px);
  text-shadow: 0 2px 16px rgba(0,0,0,.9);
}

/* Arrows: circular buttons with orange ring */
#block-thex-views-block-featured-games-block-1 .vjs-prev,
#block-thex-views-block-featured-games-block-1 .vjs-next,
#block-thex-views-block-featured-games-block-1 .views-slideshow-controls a[class*="prev"],
#block-thex-views-block-featured-games-block-1 .views-slideshow-controls a[class*="next"]{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px; height: 46px;
  border-radius: 999px;
  border: 2px solid var(--sen-accent);
  background: rgba(0,0,0,0.55);
  display: grid; place-items: center;
  text-decoration: none;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
  box-shadow: 0 4px 18px rgba(0,0,0,.7);
  z-index: 3;
}
#block-thex-views-block-featured-games-block-1 .vjs-prev,
#block-thex-views-block-featured-games-block-1 .views-slideshow-controls a[class*="prev"] { left: 12px; }
#block-thex-views-block-featured-games-block-1 .vjs-next,
#block-thex-views-block-featured-games-block-1 .views-slideshow-controls a[class*="next"] { right: 12px; }

#block-thex-views-block-featured-games-block-1 .vjs-prev:hover,
#block-thex-views-block-featured-games-block-1 .vjs-next:hover,
#block-thex-views-block-featured-games-block-1 .views-slideshow-controls a[class*="prev"]:hover,
#block-thex-views-block-featured-games-block-1 .views-slideshow-controls a[class*="next"]:hover{
  background: rgba(0,0,0,0.8);
  transform: translateY(-50%) scale(1.06);
  box-shadow: 0 0 18px var(--accent-glow);
}

/* Force arrow glyphs */
#block-thex-views-block-featured-games-block-1 .vjs-prev::before,
#block-thex-views-block-featured-games-block-1 .vjs-next::before {
  content: "";
}
#block-thex-views-block-featured-games-block-1 .vjs-prev > * { font-size: 0; }
#block-thex-views-block-featured-games-block-1 .vjs-next > * { font-size: 0; }
#block-thex-views-block-featured-games-block-1 .vjs-prev::after {
  content: "❮"; font-size: 22px; color: #fff; line-height: 1;
}
#block-thex-views-block-featured-games-block-1 .vjs-next::after {
  content: "❯"; font-size: 22px; color: #fff; line-height: 1;
}

/* Dots / pager */
#block-thex-views-block-featured-games-block-1 .vjs-pager,
#block-thex-views-block-featured-games-block-1 .views-slideshow-controls-bottom {
  position: absolute;
  left: 0; right: 0; bottom: .75rem;
  display: flex; justify-content: center; gap: .5rem;
  z-index: 4;
}
#block-thex-views-block-featured-games-block-1 .vjs-pager a,
#block-thex-views-block-featured-games-block-1 .views-slideshow-controls-bottom a {
  width: 9px; height: 9px; border-radius: 99px;
  background: rgba(255,255,255,.35);
  box-shadow: 0 0 0 2px rgba(0,0,0,.7) inset;
  display: inline-block;
  text-indent: -9999px;
  transition: transform .15s ease, background .15s ease;
}
#block-thex-views-block-featured-games-block-1 .vjs-pager a.active,
#block-thex-views-block-featured-games-block-1 .views-slideshow-controls-bottom a.active {
  background: var(--sen-accent);
  transform: scale(1.18);
}

#block-thex-views-block-featured-games-block-1 .views-element-container {
  border: 0 !important;
  background: transparent;
}

/* CTA row under Featured Games (optional markup) */
#block-thex-views-block-featured-games-block-1 .sen-cta-row {
  margin-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
}

#block-thex-views-block-featured-games-block-1 .sen-cta {
  flex: 1 1 230px;
  max-width: 260px;
  padding: 14px 16px;
  border-radius: 12px;
  background: radial-gradient(circle at top,#262738,#111119);
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: 0 12px 30px rgba(0,0,0,.9);
  display: flex;
  align-items: center;
  gap: 0.75rem;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

#block-thex-views-block-featured-games-block-1 .sen-cta:hover {
  transform: translateY(-2px);
  background: radial-gradient(circle at top,#2b2d3f,#15151f);
  box-shadow: 0 18px 42px rgba(0,0,0,.95), 0 0 14px rgba(227,93,33,0.45);
}

#block-thex-views-block-featured-games-block-1 .sen-cta-icon {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 2px solid var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}

#block-thex-views-block-featured-games-block-1 .sen-cta-label {
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

/* Responsive tightening */
@media (max-width: 720px) {
  #block-thex-views-block-featured-games-block-1 .vjs-prev,
  #block-thex-views-block-featured-games-block-1 .vjs-next { width: 40px; height: 40px; }
  #block-thex-views-block-featured-games-block-1 .views-field-title { font-size: 16px; }
}

/* ===========================
   Recent Articles — SEN Cards
   Block: #block-thex-views-block-duplicate-of-recent-content-block-1
   =========================== */

#block-thex-views-block-duplicate-of-recent-content-block-1 {
  --sen-accent: var(--sen-brown);
  --glass:      var(--sen-panel);
  --glass-hi:   var(--sen-panel-soft);
}

/* Title bar for recent content */
#block-thex-views-block-duplicate-of-recent-content-block-1 > h2 {
  background: transparent;
  padding: 0 0 10px 0;
  border-radius: 0;
  color: var(--sen-gray);
}

/* Grid */
#block-thex-views-block-duplicate-of-recent-content-block-1 .views-view-responsive-grid {
  --views-responsive-grid--layout-gap: 20px !important;
  --views-responsive-grid--cell-min-width: 280px !important;
  margin: 1rem auto 2.5rem;
  max-width: min(1200px, 92vw);
}

/* Each item → card */
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-view-responsive-grid__item {
  list-style: none;
}

#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-view-responsive-grid__item > * {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: radial-gradient(circle at top,#222231,#111119);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(0,0,0,.9);
  transition: transform .18s ease, box-shadow .18s ease, background .2s ease;
}

#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-view-responsive-grid__item > *:hover {
  transform: translateY(-4px);
  background: radial-gradient(circle at top,#272a3c,#15151f);
  box-shadow: 0 24px 60px rgba(0,0,0,.95), 0 0 16px rgba(227,93,33,0.45);
}

/* Image top */
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-view-responsive-grid__item img {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  display: block;
}

/* Body area */
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-view-responsive-grid__item .views-field,
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-view-responsive-grid__item .node__content {
  padding: 14px 16px;
}

/* Title */
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-field-title a {
  color: var(--sen-gray);
  text-decoration: none;
  font-weight: 800;
  letter-spacing: .04em;
  line-height: 1.15;
  font-size: clamp(16px, 1.2vw, 20px);
}
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-field-title a:hover {
  color: var(--sen-accent);
}

/* Meta (date/author) */
#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-uid {
  color: var(--sen-gray-soft);
  font-size: .875rem;
  margin-top: 4px;
}

/* Excerpt / summary */
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-field-body,
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-field-field-summary {
  color: var(--sen-gray);
  font-size: .95rem;
  margin-top: 8px;
}

/* Read more button */
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-field-view-node a,
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-field-nothing a.read-more {
  display: inline-block;
  margin: 12px 16px 16px;
  padding: 8px 14px;
  border-radius: 999px;
  background: transparent;
  border: 2px solid var(--sen-accent);
  color: var(--sen-gray);
  font-weight: 700;
  text-decoration: none;
  letter-spacing: .03em;
  transition: background .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
}
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-field-view-node a:hover,
#block-thex-views-block-duplicate-of-recent-content-block-1
  .views-field-nothing a.read-more:hover {
  background: var(--sen-accent);
  color: #fdfdfd;
  transform: translateY(-1px);
  box-shadow: 0 0 16px var(--accent-glow);
}

/* “More” link under the grid */
#block-thex-views-block-duplicate-of-recent-content-block-1 .more-link {
  text-align: center;
  margin-top: .25rem;
}
#block-thex-views-block-duplicate-of-recent-content-block-1 .more-link a {
  display: inline-block;
  padding: 10px 18px;
  border-radius: 999px;
  border: 2px solid var(--sen-accent);
  color: var(--sen-gray);
  text-decoration: none;
  font-weight: 800;
  letter-spacing: .04em;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease;
}
#block-thex-views-block-duplicate-of-recent-content-block-1 .more-link a:hover {
  background: var(--sen-accent);
  color: #fdfdfd;
  box-shadow: 0 0 18px var(--accent-glow);
  transform: translateY(-1px);
}

/* Block title match */
#block-thex-views-block-duplicate-of-recent-content-block-1 > h2.block-title {
  margin: 0 0 .75rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--sen-accent);
  font-size: clamp(18px, 1.6vw, 22px);
  display: inline-flex; align-items: center; gap: .75rem;
}
#block-thex-views-block-duplicate-of-recent-content-block-1 > h2.block-title::after {
  content:""; height:3px; width:72px; background: var(--sen-accent); border-radius:3px; display:block;
}

/* Small screens */
@media (max-width: 680px) {
  #block-thex-views-block-duplicate-of-recent-content-block-1
    .views-view-responsive-grid { --views-responsive-grid--cell-min-width: 240px !important; }
}

/* ===========================
   NODE CONTENT PANELS
   =========================== */

#block-thex-content > div > article > div.node-content.clear {
  background: var(--sen-panel);
  padding: 20px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: 0 18px 46px rgba(0,0,0,0.9);
}

/* Centered feature image */
.field--name-field-image.field--type-image.field--label-hidden.field-item {
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  width: 100%;
  margin: 0 auto 2rem auto;
}
.field--name-field-image img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* ===========================
   PAGE TITLES
   =========================== */

.page-title-wrap {
  text-align: center;
  margin: 2rem auto 3rem auto;
}

.page-title {
  font-family: 'Bebas Neue', Impact, sans-serif;
  font-size: 3.8rem;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--sen-gray);
  text-transform: uppercase;
  margin: 0;
  position: relative;
  display: inline-block;
}

/* Orange underline accent */
.page-title::after {
  content: "";
  display: block;
  width: 80px;
  height: 4px;
  background: var(--accent);
  margin: 0.75rem auto 0 auto;
  border-radius: 3px;
  box-shadow: 0 0 14px var(--accent-glow);
}

/* ===========================
   SERVER RULES BLOCK
   =========================== */

#block-thex-therulesblock {
  margin-top: 200px;
}

/* SERVER RULES */
#block-thex-therulesblock > .block-content{
  width:min(var(--wrap),100%);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

#block-thex-therulesblock{
  background: var(--sen-panel);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:14px;
  box-shadow:0 18px 46px rgba(0,0,0,.9), 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;
  color: var(--sen-gray);
}

#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);
}

/* left hazard strip, using orange */
#block-thex-therulesblock::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:12px;
  opacity:.8;
  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 18px 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:#050608;
  background:var(--accent);
  border-radius:.35rem;
  text-align:center;
  padding:.15rem .25rem;
}

@media (min-width:980px){
  #block-thex-therulesblock ol{
    columns:2;
  }
}