:root{
  --club-red:#e24a4a; --club-red-dark:#c53e3e; --active-underline:#ffffff;
  --club-teal:#0f6b73; --club-deep-teal:#0a4950; --club-sky:#49b9d6; --club-amber:#f29e2e;
  --ink:#1b1f23; --line:rgba(0,0,0,.09); --card:#fff; --bg:#f3f6f9;
}

/* ===== NAVBAR ===== */
.clubbar{ background:var(--club-red); }
.clubbar .navbar-brand, .clubbar .nav-link{ color:#fff; }
.brand-text{ font-weight:700; }

.club-nav .nav-link{
  text-transform:uppercase; font-weight:700; letter-spacing:.02em;
  padding:1rem .9rem; position:relative;
}
.club-nav .nav-link.active::after,
.club-nav .nav-link:hover::after{
  content:""; position:absolute; left:.75rem; right:.75rem; bottom:.55rem;
  height:2px; border-radius:3px; background:var(--active-underline);
}

.navbar, .navbar-over-hero{ z-index:1050; }
.navbar .navbar-dot{
  position:absolute; top:0; right:0; min-width:16px; height:16px; line-height:16px;
  padding:0 .25rem; border-radius:999px; font-size:.7rem;
}

/* Normal dropdowns */
.navbar .dropdown-menu{ z-index:2000; }
.dropdown-menu.dropdown-menu-xl{ min-width:420px; max-width:90vw; }

/* ===== MEGA MENUS (CENTERED) ===== */
.dropdown-mega{
  position:absolute; top:100%;
  left:50% !important;                  /* center under navbar */
  transform:translate(-50%, 10px) !important;
  width:min(1180px, calc(100vw - 32px));  /* global max width */
  background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:10px;
  box-shadow:0 20px 40px rgba(0,0,0,.12);
  padding:24px 28px; z-index:2000; display:none;
}
.dropdown.show > .dropdown-mega,
.dropdown-mega.show{ display:block; }

.teams-mega{ width:min(1180px, calc(100vw - 32px)); }
.info-mega { width:min(820px,  calc(100vw - 32px)); }

.mega-grid{ display:grid; gap:16px 36px; }
.mega-grid-4{ grid-template-columns:repeat(4,1fr); }
.mega-grid-2{ grid-template-columns:repeat(2,1fr); }
.mega-title{ margin:0 0 12px; font-weight:700; color:#2b2f33; border-bottom:1px solid rgba(0,0,0,.08); padding-bottom:8px; }
.mega-list{ margin:0; padding:0; list-style:none; }
.mega-list li{ margin:8px 0; }
.mega-list a{ color:#5f6b76; text-decoration:none; display:inline-block; }
.mega-list a:hover{ color:#101418; text-decoration:none; }
.mega-cta{ display:inline-block; margin-top:8px; font-weight:700; color:#c53e3e; }
.mega-cta::after{ content:" ›"; }

@media (max-width: 991.98px){
  .dropdown-mega{ left:0!important; right:0!important; transform:none!important; width:100%!important; border-radius:0; box-shadow:none; padding:16px 18px; }
  .mega-grid{ grid-template-columns:1fr !important; gap:8px 0; }
  #globalNav{ max-height:calc(100vh - 56px); overflow-y:auto; }
}

/* Buttons */
.btn-pill{ border-radius:999px; padding:.45rem 1rem; font-weight:700; text-transform:uppercase; }
.btn-dark.btn-pill{ background:#111; border:1px solid #111; }
.btn-outline-light.btn-pill{ border:1px solid rgba(255,255,255,.75); color:#fff; }

/* Banner */
.construction-banner{ background:#FFD500; color:#1b1f23; font-weight:600; padding:.35rem 1rem; font-size:.9rem; border-bottom:2px solid rgba(0,0,0,.1); }

/* ===== HERO / FRONT-PAGE (concept) ===== */
.news-wrap{ background:var(--bg); padding:0 0 3rem; } /* no top padding */

.hero-bleed{ position:relative; width:100vw; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw; margin-top:0; z-index:1; }
.hero-carousel{ border-radius:0; overflow:hidden; box-shadow:0 16px 48px rgba(0,0,0,.18); }
.hero-carousel .carousel-item{ height:56vh; min-height:480px; }
.hero-carousel .carousel-item img{ width:100%; height:100%; object-fit:cover; filter:saturate(1.05) contrast(1.03); }
.hero-gradient{ position:absolute; inset:0; background:linear-gradient(0deg, rgba(10,73,80,.55), rgba(10,73,80,.18) 40%, rgba(10,73,80,.45) 100%), radial-gradient(1100px 450px at 80% -10%, rgba(73,185,214,.35), transparent 60%); pointer-events:none; }
.hero-caption{ position:absolute; inset:0; display:flex; align-items:center; color:#fff; }
.hero-inner{ width:100%; max-width:1440px; margin:0 auto; padding:0 clamp(12px, 3.2vw, 24px); }
.hero-eyebrow{ display:inline-block; font-weight:800; font-size:.8rem; letter-spacing:.02em; background:rgba(255,255,255,.18); padding:.32rem .7rem; border-radius:999px; border:1px solid rgba(255,255,255,.25); backdrop-filter:blur(2px); }
.hero-title{ font-size:clamp(1.9rem, 4.8vw, 3.2rem); line-height:1.05; font-weight:900; margin:.6rem 0 .35rem; text-shadow:0 3px 14px rgba(0,0,0,.35); }
.hero-sub{ font-size:clamp(1rem, 1.4vw, 1.2rem); opacity:.95; max-width:70ch; }
.hero-ctas{ display:flex; gap:.6rem; flex-wrap:wrap; margin-top:1rem; }
.btn-cta{ border-radius:.8rem; padding:.7rem 1.1rem; font-weight:800; display:inline-flex; align-items:center; gap:.5rem; border:1px solid rgba(255,255,255,.25); color:#0a4950; background:#f29e2e; }
.btn-ghost-dark{ border-radius:.8rem; padding:.7rem 1.1rem; font-weight:800; display:inline-flex; align-items:center; gap:.5rem; color:#fff; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25); }
.carousel-control-prev,.carousel-control-next{ width:8%; filter:drop-shadow(0 4px 8px rgba(0,0,0,.25)); }
.carousel-indicators li{ width:10px; height:10px; border-radius:50%; }
.carousel-indicators .active{ background:#fff; }

/* Wider content area */
.container-wide{ width:100%; max-width:1440px; margin:0 auto; padding:0 clamp(12px, 3.2vw, 24px); }

/* KPI chips */
.kpi-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin:.75rem 0 1rem; }
@media (max-width:991.98px){ .kpi-row{ grid-template-columns:repeat(2,1fr); } }
.kpi{ background:var(--card); border:1px solid var(--line); border-radius:1rem; padding:.9rem 1rem; box-shadow:0 8px 20px rgba(15,107,115,.08); display:flex; align-items:center; gap:.75rem; }
.kpi .icon{ width:38px; height:38px; border-radius:.7rem; display:grid; place-items:center; background:rgba(73,185,214,.15); }
.kpi strong{ font-size:1.25rem; }
.kpi small{ color:#6a727b; display:block; margin-top:-2px; }

/* News blocks */
.news-hero{ display:grid; grid-template-columns:1.15fr 1fr; gap:1rem; }
@media (max-width:991.98px){ .news-hero{ grid-template-columns:1fr; } }
.hero-media{ position:relative; border-radius:1rem; overflow:hidden; min-height:420px; background:#0b0b0b; box-shadow:0 14px 32px rgba(0,0,0,.12); }
.hero-media img{ width:100%; height:100%; object-fit:cover; filter:saturate(1.05) contrast(1.02); display:block; }
.hero-chip{ position:absolute; top:.8rem; left:.8rem; background:var(--club-amber); color:#1b1f23; font-weight:800; font-size:.72rem; padding:.3rem .55rem; border-radius:999px; letter-spacing:.02em; box-shadow:0 6px 16px rgba(0,0,0,.12); }
.hero-panel{ background:radial-gradient(1200px 600px at 80% -10%, rgba(73,185,214,.35), transparent 60%), linear-gradient(145deg, var(--club-deep-teal) 0%, var(--club-teal) 65%); color:#fff; border-radius:1rem; padding:1.2rem 1.2rem 1.1rem; min-height:420px; display:flex; flex-direction:column; box-shadow:0 14px 32px rgba(0,0,0,.12); }
.hero-badge{ display:inline-block; background:rgba(255,255,255,.18); color:#fff; font-weight:700; padding:.28rem .6rem; border-radius:999px; font-size:.7rem; border:1px solid rgba(255,255,255,.22); backdrop-filter:blur(2px); }
.hero-excerpt{ opacity:.92; }
.hero-meta{ margin-top:auto; display:flex; align-items:center; gap:.75rem; opacity:.95; font-size:.92rem; }
.hero-meta .dot{ width:4px; height:4px; border-radius:50%; background:#fff; opacity:.6; display:inline-block; }

.news-strip{ margin-top:1.1rem; display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
@media (max-width:991.98px){ .news-strip{ grid-template-columns:1fr; } }
.news-card{ background:var(--card); border-radius:1rem; overflow:hidden; border:1px solid var(--line); box-shadow:0 10px 24px rgba(15,107,115,.10); display:flex; flex-direction:column; transition:transform .18s, box-shadow .18s; }
.news-card:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(15,107,115,.14); }
.news-card .thumb{ aspect-ratio:16/9; background:#000; }
.news-card .thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.news-card .body{ padding:.9rem 1rem 1rem; display:flex; flex-direction:column; gap:.45rem; }
.kicker{ background:rgba(73,185,214,.18); color:var(--club-teal); font-weight:800; font-size:.7rem; padding:.22rem .5rem; border-radius:999px; display:inline-block; border:1px solid rgba(73,185,214,.35); }
.title{ font-weight:800; font-size:1.02rem; line-height:1.2; margin:0; color:var(--ink); }
.meta{ color:#5f6b76; font-size:.86rem; }
.excerpt{ color:#2b3137; opacity:.95; font-size:.95rem; }
.foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; padding:.75rem 1rem; border-top:1px solid var(--line); }
.btn-ghost{ display:inline-flex; align-items:center; gap:.5rem; font-weight:700; text-decoration:none; border:1px solid var(--line); padding:.5rem .85rem; border-radius:.65rem; color:var(--club-teal); background:#fff; }
.btn-ghost:hover{ background:rgba(73,185,214,.09); border-color:rgba(73,185,214,.35); color:var(--club-deep-teal); }

/* Fixtures / sponsors */
.fixtures{ margin-top:1.25rem; }
.fixtures .card{ border-radius:1rem; border:1px solid var(--line); box-shadow:0 8px 22px rgba(0,0,0,.06); }
.fixtures .card-header{ background:#fff; border-bottom:1px solid var(--line); font-weight:800; }

.sponsors{ margin-top:1.25rem; }
.sponsors-band{ background:linear-gradient(0deg,#fff 0%, #f6f9fc 100%); border:1px solid var(--line); border-radius:1rem; padding:1rem; box-shadow:0 8px 22px rgba(0,0,0,.06);}
.sponsors-logos{ display:grid; grid-template-columns:repeat(6,1fr); gap:1rem; align-items:center; }
@media (max-width:991.98px){ .sponsors-logos{ grid-template-columns:repeat(3,1fr); } }
.sponsors-logos img{ width:100%; height:64px; object-fit:contain; filter:saturate(.95) contrast(1.03); }

.more-row{ text-align:center; margin-top:1rem; }
.btn-more{ background:#fff; border:1px solid var(--line); border-radius:999px; padding:.6rem 1.15rem; font-weight:800; color:var(--club-teal); box-shadow:0 6px 18px rgba(0,0,0,.06); }
.btn-more:hover{ background:rgba(73,185,214,.09); border-color:rgba(73,185,214,.35); color:var(--club-deep-teal); }

 :root{ --club-red:#e24a4a; --club-red-dark:#c53e3e; --active-underline:#ffffff; }
    .clubbar{ background:var(--club-red); }
    .clubbar .navbar-brand, .clubbar .nav-link{ color:#fff; }
    .brand-text{ font-weight:700; }

    .club-nav .nav-link{
      text-transform:uppercase; font-weight:700; letter-spacing:.02em;
      padding:1rem .9rem; position:relative;
    }
    .club-nav .nav-link.active::after,
    .club-nav .nav-link:hover::after{
      content:""; position:absolute; left:.75rem; right:.75rem; bottom:.55rem;
      height:2px; border-radius:3px; background:var(--active-underline);
    }

    .navbar .navbar-dot{
      position:absolute; top:0; right:0;
      min-width:16px; height:16px; line-height:16px;
      padding:0 .25rem; border-radius:999px; font-size:.7rem;
    }
    .dropdown-menu.dropdown-menu-xl{ min-width:420px; max-width:90vw; }
    .dropdown-section-title{ font-weight:600; opacity:.8; }
    .dropdown-menu .dropdown-item .small.text-wrap{ white-space:normal; }
    .dropdown-menu .dropdown-item i.mr-2{ width:18px; text-align:center; }

    .dropdown-mega{
      position:absolute; top:100%;
      left:var(--container-left,0px)!important;
      transform:translateY(10px)!important;
      background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:10px;
      box-shadow:0 20px 40px rgba(0,0,0,.12); padding:24px 28px; z-index:1050;
    }
    .teams-mega{ width: min(1180px, calc(100vw - var(--container-left,0px) - 16px)); }
    .info-mega { width: min(720px,  calc(100vw - var(--container-left,0px) - 16px)); }

    .mega-grid{ display:grid; gap:16px 36px; }
    .mega-grid-4{ grid-template-columns:repeat(4,1fr); }
    .mega-grid-2{ grid-template-columns:repeat(2,1fr); }

    .mega-title{
      margin:0 0 12px 0; font-weight:700; color:#2b2f33;
      border-bottom:1px solid rgba(0,0,0,.08); padding-bottom:8px;
    }
    .mega-list{ margin:0; padding:0; list-style:none; }
    .mega-list li{ margin:8px 0; }
    .mega-list a{ color:#5f6b76; text-decoration:none; display:inline-block; }
    .mega-list a:hover{ color:#101418; text-decoration:none; }
    .mega-cta{ display:inline-block; margin-top:8px; font-weight:700; color:#c53e3e; }
    .mega-cta::after{ content:" ›"; }

    @media (max-width: 991.98px){
      .dropdown-mega{ left:0!important; right:0!important; transform:none!important;
        width:100%!important; border-radius:0; box-shadow:none; padding:16px 18px; }
      .mega-grid{ grid-template-columns:1fr !important; gap:8px 0; }
      #globalNav{ max-height:calc(100vh - 56px); overflow-y:auto; }
    }

    .btn-pill{ border-radius:999px; padding:.45rem 1rem; font-weight:700; text-transform:uppercase; }
    .btn-dark.btn-pill{ background:#111; border:1px solid #111; }
    .btn-outline-light.btn-pill{ border:1px solid rgba(255,255,255,.75); color:#fff; }

    .navbar .dropdown-menu:not(.dropdown-mega){ margin-top:.5rem; }

    .construction-banner{
      background:#FFD500; color:#1b1f23; font-weight:600;
      padding:.35rem 1rem; font-size:.9rem; border-bottom:2px solid rgba(0,0,0,.1);
    }

.hero.general {
  position: relative;
  color: #fff;
  min-height: 20vh;              /* Adjust height */
  display: flex;
  align-items: center;
}
.hero-general .overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(15,107,115,.75), rgba(10,73,80,.75));
  z-index: 1;
}
.hero-general .container {
  position: relative;
  z-index: 2;
}

/* Make footer content readable on dark bg */
footer address { color:#fff; font-style:normal; }

/* Bigger tap targets on mobile; revert on md+ */
.footer-nav a { display:block; padding:.4rem 0; }
@media (min-width: 768px){
  .footer-nav a { display:inline-block; padding:0; }
}

/* Social buttons: square, touch-friendly on mobile */
.btn-social {
  width:44px; height:44px; padding:0; display:inline-grid; place-items:center;
}
@media (min-width: 992px){
  .btn-social { width:36px; height:36px; }
}

/* --- Hero band styling for staff list --- */
.hero-band--staff{
  background: var(--hero-bg, #f8fbff);
  border-bottom: 1px solid #e9eef5;
  /* If you want a subtle image: uncomment
  background-image: linear-gradient(rgba(255,255,255,.85), rgba(255,255,255,.85)), url("/static/img/hero-texture.svg");
  background-size: cover; background-position: center;
  */
}
.hero-band .hero-icon{
  width: 40px; height: 40px; background: #0d6efd; color:#fff; font-size: 18px;
}

/* KPI chips used in hero */
.kpi.hero-kpi{display:flex;align-items:center;gap:.6rem;padding:.65rem .75rem;border:1px solid #e9ecef;border-radius:.6rem;background:#fff}
.kpi-icon{width:36px;height:36px;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center}
.kpi-value{font-weight:600;font-size:1.05rem;line-height:1}
.kpi-label{font-size:.8rem;color:#6c757d}

/* Filter chips under hero */
.chip{display:inline-block;font-size:.75rem;background:#eef3ff;color:#1d4ed8;padding:.3rem .6rem;border-radius:999px;cursor:pointer}
.chip:hover{background:#e2ebff}
.chip-active{background:#dbe6ff}

/* Table niceties (carry-over) */
.one-line-rows th,.one-line-rows td{white-space:nowrap;vertical-align:middle}
.table-compact thead th,.table-compact tbody td{padding:.45rem .6rem}
.progress-xxs{height:6px;border-radius:4px}
.avatar-xs{width:20px;height:20px;color:#fff;font-weight:700;font-size:10px;border-radius:50%}
.avatar-sm{width:32px;height:32px;color:#fff;font-weight:700;font-size:13px;border-radius:50%}
.badges-strip{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;max-width:100%}
.name-trunc{max-width:260px;display:inline-block;overflow:hidden;text-overflow:ellipsis}
.table thead th.sticky-col{z-index:3;background:#f8f9fa;position:sticky;left:0}
tbody .sticky-col{position:sticky;left:0;z-index:2;background:#fff}
.table-striped tbody tr:nth-of-type(even) .sticky-col{background:#fdfdfd}
.btn-xxs{padding:.22rem .45rem;font-size:.72rem;line-height:1.05}
.table-responsive{overflow:visible!important}
.dropdown-menu.spond-menu{z-index:1051}
.spond-pill{display:inline-block;min-width:44px;padding:.12rem .35rem;margin-left:.35rem;font-size:.68rem;line-height:1;color:#fff;border-radius:999px;text-align:center;text-transform:lowercase}
.team-badge{background:var(--bg,#6c757d)!important;color:var(--fg,#fff)!important;border:1px solid rgba(0,0,0,.06);box-shadow:0 0 0 1px rgba(255,255,255,.35) inset}
.team-badge.team-ellipsis{background:#e9ecef!important;color:#495057!important}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-wrap table{min-width:980px}
#playersTable tbody tr .btn-group{opacity:.88;transition:opacity .15s}
#playersTable tbody tr:hover .btn-group{opacity:1}
body.table-density-compact .table-compact thead th,
body.table-density-compact .table-compact tbody td{padding:.25rem .45rem}
body.table-density-compact .avatar-xs{width:18px;height:18px;font-size:9px}
@media (min-width:1200px){
  #playersTable th:nth-child(2),#playersTable td:nth-child(2){width:80px}
  #playersTable th:nth-child(3),#playersTable td:nth-child(3){width:90px}
}

/* Ensure indicators render in BS5 (buttons, not <li>) and sit above overlays */
#rhcHero .carousel-indicators {
  z-index: 5;              /* above .hero-gradient */
  margin-bottom: 1rem;
}
#rhcHero .carousel-indicators [data-bs-target] {
  width: .75rem;
  height: .75rem;
  border-radius: 50%;
}

/* Make prev/next visible on dark photos */
#rhcHero .carousel-control-prev,
#rhcHero .carousel-control-next {
  z-index: 5;
  opacity: .9;
}

/* Legacy BS4 cleanup (safe to keep even if not present) */
#rhcHero .carousel-indicators li { display: none !important; }

/* Keep the USER mega fully on-screen (desktop) */
@media (min-width: 992px){
  /* make sure nothing clips it */
  header.site-header,
  .clubbar-secondary,
  .navbar,
  .navbar .container,
  .navbar-collapse{
    overflow: visible !important;
  }

  /* anchor the user mega to the right edge and cap width */
  .user-menu .dropdown-menu.user-mega{
    left: auto !important;
    right: 12px !important;                 /* hug the viewport’s right side */
    transform: translateY(10px) !important; /* slight drop shadow offset */
    width: min(880px, calc(100vw - 24px));  /* never exceed the viewport */
    max-width: calc(100vw - 24px);
    padding: 0;                             /* outer wrapper handles padding */
    background: transparent;
    border: 0;
    box-shadow: none;
  }

  /* the visible card */
  .user-menu .dropdown-menu.user-mega .mega-wrap{
    background:#fff;
    border-radius:16px;
    border:1px solid rgba(0,0,0,.06);
    box-shadow:0 24px 50px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.08);
    overflow:hidden;
    padding:24px 28px;
  }
}

/* Mobile/tablet: make the menu full-width in the collapsed navbar */
@media (max-width: 991.98px){
  .user-menu .dropdown-menu.user-mega{
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    width: 100% !important;
    padding: 12px;
    background: transparent;
    border: 0;
    box-shadow: none;
  }
  .user-menu .dropdown-menu.user-mega .mega-wrap{
    border-radius:12px;
    border:1px solid rgba(255,255,255,.25);
    background:rgba(255,255,255,.15);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    padding:16px;
  }
}
/* Mobile: make dropdowns render INLINE inside the collapsed navbar */
@media (max-width: 991.98px){
  #globalNav .dropdown-menu,
  #globalNav .dropdown-mega{
    position: static !important;  /* no Popper positioning */
    inset: auto !important;
    float: none;
    width: 100% !important;
    max-width: 100% !important;
    margin: .25rem 0 0 0;
    transform: none !important;
    display: none;                /* hidden until .show is applied */
    box-shadow: none;             /* looks like an accordion */
    border: 0;                    /* optional: card styling is inside */
    padding: 0;                   /* let inner content handle padding */
  }
  #globalNav .dropdown-menu.show,
  #globalNav .dropdown-mega.show{
    display: block;
  }
}