/*
Theme Name: SoftTopsTheme
Theme URI: https://xjs-soft-tops.com
Description: Child theme for the ColorMag theme used by XJS Soft Tops Club.
Author: Laurence Jones
Author URI: https://xjs-soft-tops.com
Template: colormag
Version: 1.0
Text Domain: softtopstheme
*/


/* ======================================================================
   XJS Soft Tops Club — Custom Theme Stylesheet
   Theme: SoftTopsTheme (child of ColorMag)
   Version: v2.3K.42 — E-Series Baseline Release
   Date: 10 November 2025
   ----------------------------------------------------------------------
   Contains all active styling through Enhancement E-17a.
   Notes:
     • DO NOT write below the “DO NOT WRITE BELOW HERE” marker
       (to preserve Flexbox logic for softsplit ratios).
     • Maintain all new CSS above this marker and group by feature.
     • Softbtn, Softframe, Softpaper, Softsplit and Softcards systems
       are now standardised and cross-theme compatible.
   ----------------------------------------------------------------------
   Next Version: v2.3K.43 — Design System Consolidation
   ====================================================================== */






/* Override all main wrappers on mobile to use full screen width */
@media (max-width: 1024px) {
  .inner-wrap,
  .content-area,
  #primary,
  .site-content,
  article,
  .page .hentry,
  .single .hentry,
  .post,
  .single-post article {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 auto !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding-left: 1.5vw !important;
    padding-right: 1.5vw !important;
  }
}
/* ================================================================
   PATCH v2.3K.2 - Unified Article / Event / Album width alignment
   ================================================================ */
@media (max-width: 1024px) {
  .single-post article,
  .single-event article,
  .single-album article,
  .post,
  .event,
  .album,
  .archive .post,
  .archive .event,
  .archive .album {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 2vw !important;
    padding-right: 2vw !important;
    margin: 0 auto !important;
  }

  /* Align featured image and text column flush with the same padding */
  .single-post .post-thumbnail img,
  .single-event .event-thumbnail img,
  .single-album .album-thumbnail img,
  .post img.wp-post-image {
    width: 100% !important;
    height: auto !important;
    border-radius: 0 !important;
    margin: 0 auto 1rem !important;
    display: block;
  }
}
































/* ========== 2) HEADER & MENU (gap-free) ========== */
.header-image, .header-media, .header-top, .header-advertisement, .advertisement-above-header {
  display: none !important; height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important;
}
#masthead, #header-text-nav-wrap, #header-text-nav-container, #site-navigation {
  display:block !important; visibility:visible !important; opacity:1 !important;
}
#masthead, #header-text-nav-wrap, #header-text-nav-container {
  padding:0 !important; margin:0 !important; border:0 !important; background:#1a3b2e !important;
}
#site-navigation { position:sticky; top:0; z-index:9999; background:#1a3b2e !important; border:none !important; box-shadow:none !important; margin-top:0 !important; }
body.admin-bar #site-navigation { top:32px; }
@media (max-width:782px){ body.admin-bar #site-navigation { top:46px; } }

#site-navigation .menu-item a {
  color:#fff !important; background:none !important; font-weight:700; font-size:14px; letter-spacing:.5px; text-transform:uppercase; line-height:1.4;
}
#site-navigation .menu-item a:hover,
#site-navigation .current-menu-item a, #site-navigation .current_page_item a { color:#eae3d1 !important; background:transparent !important; }
#site-navigation .menu-item { background:none !important; border:none !important; }

@media (min-width:1025px){
  #site-navigation { padding-top: 0 !important; padding-bottom:6px !important; }
/*  .menu-item-logo img { max-height:65px; width:auto; }  */
  #site-navigation ul { display:flex !important; flex-direction:row !important; justify-content:center !important; align-items:center !important; }
  #site-navigation li { display:inline-block !important; margin:0 8px !important; }
}

/* === DESKTOP HEADER REFINEMENT === */






/* === NAVBAR HEIGHT & LOGO REBALANCE - restored heritage version === */
@media (min-width: 1025px) {

  /* Slightly taller navbar for breathing room */
  #site-navigation {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
    line-height: 1.3 !important;
  }

  /* Heritage logo size (Safari-friendly) */
  #site-navigation .menu-item-logo img {
    display: inline-block !important;
    height: 92px !important;       /* explicit height works in Safari */
    width: auto !important;
    margin-top: -6px !important;
    margin-bottom: -4px !important;
    margin-right: 18px !important;
    vertical-align: middle !important;
    -webkit-transform: translateZ(0); /* force repaint */
    transition: transform 0.25s ease;
  }

  #site-navigation .menu-item-logo img:hover {
    transform: scale(1.04);
  }

  /* Nav link spacing */
  #site-navigation ul li a {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    font-size: 16px !important;
  }
}









  /* Make sure paper area doesn't jump up too high */
  #main, .site-content, #primary, #content {
    margin-top: 20px !important;
  }
}

/* === DESKTOP CONTENT CENTERING & WIDTH RESET === */
@media (min-width: 1025px) {
  #primary,
  .content-area,
  article,
  .page .hentry {
    max-width: 1400px !important;   /* widen from 1200px → 1400px */
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 60px !important;
    padding-right: 60px !important;
  }

  /* Align the inner content (softpaper panels, etc.) neatly inside */
  .entry-content > *,
  .page .entry-content > * {
    max-width: 100% !important;
  }
}

/* === DESKTOP FULL-WIDTH PAPER BALANCE === */
@media (min-width: 1025px) {

  /* Let the main paper span the full safe width */
  #primary,
  .content-area,
  .page .hentry,
  article {
    max-width: 1500px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Remove any inner centering that's holding it in */
  .inner-wrap,
  .page-section,
  .xjs-alt .alt-section,
  .xjs-alt .alt-softpaper {
    max-width: none !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 5vw !important;
    padding-right: 5vw !important;
  }

  /* Keep round corners and shadow consistent */
  .page-section,
  .xjs-alt .alt-section,
  .xjs-alt .alt-softpaper {
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.05);
  }
}




/* ========== 3) MOBILE NAV (ColorMag default kept tidy) ========== */
@media (max-width:1024px){
  #masthead { background:transparent !important; border:none !important; box-shadow:none !important; height:auto !important; overflow:visible !important; }
  .softtops-desktop-header, .header-image, .header-media, .header-top { display:none !important; visibility:hidden !important; height:0 !important; overflow:hidden !important; }
  
  
  
  .slicknav_menu, .slicknav_nav, .slicknav_nav ul, .slicknav_nav li, .slicknav_nav a, #site-navigation, #site-navigation * {
    background-color: #1a3b2e !important;
    max-width: 300px;
    color: #1a3b2e !important;
        border-radius: 12px;
    border:none !important;
  }

  
  
  
  .slicknav_btn .slicknav_icon-bar { background-color:#eae3d1 !important; }
  .slicknav_nav li a:hover, .slicknav_nav li.slicknav_open>a { 
    background-color:#000082 !important; 
    color:#000082 !important; }
  .slicknav_nav, .slicknav_menu { margin:0 !important; padding:0 !important; }
  .slicknav_nav img { display:none !important; }
  /* content offset */
  body { padding-top:240px !important; }
  #site-navigation ul.menu { display:none !important; }
}


/* ========== 4) PAPER CONTENT AREA ========== */
#primary, .content-area, article, .page .hentry {
  background-color:#eae3d1 !important; border-radius:15px; padding:40px 50px;
  margin:0 auto 40px !important; max-width:1200px; box-shadow:0 4px 10px rgba(0,0,0,.1); overflow:hidden;
}

/* ========== 5) CONTENT + TITLE ALIGNMENT ========== */
.entry-content, .page .entry-content, .page .hentry, article .entry-content { padding-top:0 !important; margin-top:0 !important; }
.entry-header, .page-header { margin:0 !important; padding:0 !important; background:transparent !important; z-index:1 !important; }
.page .entry-header + .entry-content, .page .entry-content > *:first-child, .page:not(.has-post-thumbnail) .entry-content { margin-top:0 !important; padding-top:0 !important; }

/* ========== 6) FOOTER ========== */
#colophon, .footer-widgets-wrapper, .footer-wrapper, .footer-container, .footer-bottom, .site-footer {
  background:#1a3b2e !important; color:#eae3d1 !important; padding:10px 0 !important; margin:0 !important; border:none !important;
  box-shadow:none !important; width:100% !important; text-align:center !important; font-size:14px; line-height:1.6;
}
.site-footer a, #colophon a { color:#eae3d1 !important; text-decoration:none !important; }
.site-footer a:hover, #colophon a:hover { color:#ffffff !important; text-decoration:underline !important; }
.heritage-footer {
  clear: both;
  width: 100%;
  display: block;
}


/* Flatten bottom edge on paper */
#primary, .content-area, article, .page .hentry { border-bottom-left-radius:0 !important; border-bottom-right-radius:0 !important; box-shadow:none !important; margin-bottom:0 !important; padding-bottom:30px !important; }

/* ========== 7) INTRO (hero) & SECTIONS ========== */
.intro-section {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:2rem; margin-bottom:3rem;
}
.intro-text { flex:0 1 60%; }
.intro-section img, .intro-section .wppa-container {
  flex:0 1 35%; max-width:100%; height:auto; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,.1);
}
@media (max-width:900px){
  .intro-section { flex-direction:column; align-items:center; text-align:left; }
  .intro-text { flex:1 1 100%; }
  .intro-section img, .intro-section .wppa-container { flex:1 1 100%; max-width:100%; }
}

.page-section {
  background:#f3efe3; border-radius:12px; box-shadow:0 2px 10px rgba(0,0,0,.05);
  padding:3vw 4vw; margin:50px auto; max-width:1100px; transition:box-shadow .3s ease;
}
@media (hover:hover){ .page-section:hover { box-shadow:0 4px 16px rgba(0,0,0,.08); } }
@media (max-width:768px){ .page-section { padding:5vw; margin:30px auto; } }

.page-section h3 { font-size:1.6rem; text-align:center; margin-bottom:.5rem; color:#1a3b2e; }
.page-section p  { max-width:850px; margin:.5rem auto 1.5rem; color:#1a3b2e; line-height:1.6; }

/* ========== 8) TYPOGRAPHY ========== */
h2, h3, h4, h5 { font-family: "Georgia","Times New Roman",serif; font-weight:600; color:#1a3b2e; }
p, li { font-family: "Helvetica Neue","Arial",sans-serif; color:#1a3b2e; }
hr.divider { border:0; height:2px; width:70%; margin:40px auto; background:linear-gradient(to right, transparent, #1a3b2e 50%, transparent); border-radius:2px; }

/* ========== 9) BUTTONS ========== */
.softbtn.green a, a.softbtn.green {
  background:#1a3b2e !important; color:#eae3d1 !important; border-radius:6px; padding:10px 25px; text-decoration:none; font-weight:600; display:inline-block; transition:background .3s,color .3s;
}
.softbtn.green a:hover, a.softbtn.green:hover { background:#2b5946 !important; }

.softbtn.cream a, a.softbtn.cream {
  background:#eae3d1 !important; color:#1a3b2e !important; border-radius:6px; padding:10px 25px; text-decoration:none; font-weight:600; display:inline-block; transition:background .3s,color .3s;
}
.softbtn.cream a:hover, a.softbtn.cream:hover { background:#fff !important; }

.member-buttons { text-align:center; margin-top:1.5rem; }
.member-buttons .softbtn a, .member-buttons a.softbtn { min-width:240px; text-align:center; margin:.3rem; }

/* ========== 10) CARDS GRID ========== */
.page-section .cards { display:grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap:1.5rem; }

/* ========== 11) SOFTPAPER structure (CSS partner for shortcode) ========== */
.softpaper {
  max-width: 1400px; margin: 0 auto 40px; padding: clamp(20px, 4vw, 50px); padding-top: var(--softpaper-padding-top, 10px);
  border-radius: 18px; box-shadow: 0 2px 5px rgba(0,0,0,.05), 0 8px 20px rgba(26,59,46,.07);
}
.softpaper-title { margin:0 0 0; font-size: clamp(1.6rem, 2vw, 2rem); font-weight:600; }
.softpaper-title.talign-center{ text-align:center; } .softpaper-title.talign-left{ text-align:left; } .softpaper-title.talign-right{ text-align:right; }

.softpaper-flex { display:flex; flex-wrap:nowrap; align-items:flex-start; justify-content:space-between; gap:30px; }
.softpaper.align-left .softpaper-flex { text-align:left; }
.softpaper.align-center .softpaper-flex { text-align:center; }
.softpaper.align-right .softpaper-flex { text-align:right; }
.softpaper-flex > div { flex:1 1 auto; min-width:280px; }

/* ratio helpers (used earlier, kept) */
.softpaper-flex > .softpaper-30 { flex:0 0 30%; }
.softpaper-flex > .softpaper-70 { flex:1 1 70%; }
.softpaper-flex > .softpaper-35 { flex:0 0 35%; }
.softpaper-flex > .softpaper-65 { flex:1 1 65%; }
.softpaper-flex > .softpaper-40 { flex:0 0 40%; }
.softpaper-flex > .softpaper-60 { flex:1 1 60%; }

.softpaper.opt-cream { color:#1a3b2e; background:#eae3d1; }
.softpaper.opt-green { color:#eae3d1; background:#1a3b2e; }

.softpaper-flex img { max-width:100%; height:auto; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,.15); }

@media (max-width:768px){
  .softpaper-flex { flex-direction:column; text-align:center; }
  .softpaper-flex > div, .softpaper-30, .softpaper-35, .softpaper-40, .softpaper-60, .softpaper-65, .softpaper-70 { flex:1 1 100%; text-align:center; }
}
/* ========== 12) SOFTFRAME (new) - plain framed container ========== */
.softframe {
  --sf-max: 1100px; --sf-pad: 28px; --sf-radius: 14px; --sf-border: 1px; --sf-bg: #ffffff;
  max-width: var(--sf-max); margin: 30px auto; background: var(--sf-bg);
  padding: var(--sf-pad); border-radius: var(--sf-radius);
  border: var(--sf-border) solid rgba(22,52,38,.25);
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.softframe-title { margin: 0 0 14px; font-size: 1.4rem; font-weight: 700; color: #163426; }
.softframe-inner > :last-child { margin-bottom: 0; }



/* ========== 14) SOFTLIST (forums) ========== */
.softlist { max-width:1100px; margin:30px auto; display:flex; flex-direction:column; gap:10px; }
.softlist-item { display:grid; grid-template-columns: 88px 1fr auto; gap:12px; padding:10px 12px; background:#fff; border-radius:10px; box-shadow:0 1px 6px rgba(0,0,0,.06); align-items:center; }
.softlist-img { width:88px; height:auto; border-radius:8px; display:block; }
.softlist-title { font-weight:700; color:#163426; }
.softlist-meta { font-size:.9rem; color:#3b604e; }
.softlist-status a, .softlist-status { font-size:.9rem; color:#1a3b2e; text-decoration:none; }
.softlist-status a:hover { text-decoration:underline; }
@media (max-width:640px){ .softlist-item { grid-template-columns: 68px 1fr; } .softlist-status { justify-self:end; grid-column:1 / -1; } }

/* === SAFARI LOGO SQUEEZE FIX (final) === */
/* Structural: make the logo menu item and its link refuse to shrink */
@media (min-width: 1025px) {
  #site-navigation .menu-item-logo,
  #site-navigation .menu-item-logo > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;     /* don't let flexbox shrink it */
    min-width: 0 !important;       /* prevent odd width clamping */
    line-height: 1 !important;
  }

  /* Image: keep natural proportions and explicit height */
  #site-navigation .menu-item-logo img {
    display: inline-block !important;
    height: 92px !important;       /* your heritage size */
    width: auto !important;        /* derive width from the image */
    max-height: none !important;   /* avoid double capping */
    max-width: none !important;    /* Safari sometimes inherits caps */
    aspect-ratio: auto !important; /* stop Safari guessing ratios */
    object-fit: contain !important;
    vertical-align: middle !important;
    margin-top: -6px !important;
    margin-bottom: -4px !important;
    margin-right: 18px !important;
  }
}

/* Extra Safari-only nudge (WebKit feature query) */
@supports (-webkit-hyphens: none) {
  @media (min-width: 1025px) {
    #site-navigation .menu-item-logo img {
      transform: translateZ(0);    /* force proper repaint */
      -webkit-backface-visibility: hidden;
    }
  }
}

/* === TOP PAPER OFFSET TUNING (reduce gap below navbar) === */
@media (min-width: 1025px) {
  #main,
  .site-content,
  #primary,
  #content {
    margin-top: 8px !important;   /* was 20px - reduced for tighter join */
  }
}

/* Mobile & tablet minor alignment match */
@media (max-width: 1024px) {
  #main,
  .site-content,
  #primary,
  #content {
    margin-top: 0 !important;
  }
}

/* === TIGHTEN PAPER-TO-NAVBAR GAP (visual join) === */
@media (min-width: 1025px) {
  #main,
  .site-content,
  #primary,
  #content,
  .content-area,
  .page .hentry,
  article {
    margin-top: 0 !important;       /* fully close the structural gap */
    padding-top: 6px !important;    /* gentle breathing room */
  }

  /* remove any stray top padding from first section */
  .entry-header,
  .page-header,
  .page .entry-content > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

/* === ULTRA-TIGHT NAVBAR TO PAPER JOIN === */
@media (min-width: 1025px) {
  #main,
  .site-content,
  .content-area,
  .site-main,
  #primary {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* also remove any theme-inserted gap above first entry */
  .page .hentry:first-of-type,
  article:first-of-type {
    margin-top: -8px !important;   /* small negative lift */
    padding-top: 0 !important;
  }

  /* keep logo alignment consistent */
  #site-navigation {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
}

/* === FINAL NAVBAR-PAPER GAP FIX === */
@media (min-width: 1025px) {
  .main-wrapper,
  #content,
  #primary,
  .content-area,
  .site-content,
  #main {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* specifically squash any top padding from ColorMag's inner wrapper */
  .inner-wrap {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* subtle lift to the first section if still slightly off */
  .page .hentry:first-of-type {
    margin-top: -10px !important;
  }
}

/* === MOBILE HEADER HEIGHT FIX === */
@media (max-width:1024px){
  /* remove any blank green gap above logo */
  #masthead,
  .site-header,
  .header-container,
  .custom-header,
  .slicknav_menu {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* nudge logo slightly up if still offset */
  #masthead img.custom-logo,
  #masthead .menu-item-logo img {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* force the sticky nav to sit tight */
  #site-navigation {
    top: 0 !important;
  }

  /* neutralise any fixed placeholder pushed by slicknav */
  body {
    padding-top: 0 !important;
  }
}


@media (max-width:1024px){
  .slicknav_nav li a img { 
    display: none !important; 
    height: 0 !important; 
    width: 0 !important; 
    overflow: hidden !important;
  }
}

/* MOBILE: hide any logo image that appears inside the burger (SlickNav) */
@media (max-width:1024px){
  /* Common cases: <img> anywhere inside the dropdown UL */
  .slicknav_menu .slicknav_nav img,
  .slicknav_menu .slicknav_nav li a img,
  .slicknav_menu .slicknav_nav .slicknav_item img {
    display: none !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  /* If your logo comes through as a dedicated menu item */
  .slicknav_menu .slicknav_nav li.menu-item-logo,
  .slicknav_menu .slicknav_nav li.menu-item-logo > a,
  .slicknav_menu .slicknav_nav li.menu-item-logo * {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  /* If the logo is applied as a background on the anchor */
  .slicknav_menu .slicknav_nav li.menu-item-logo > a {
    background: none !important;
    min-height: 0 !important;
  }
}


@media (max-width:1024px){
  /* Hide the first list item in the mobile dropdown (the duplicated logo) */
  .slicknav_nav > li:first-child {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
}

@media (max-width:1024px){
  /* Hide the first list item in the innermost SlickNav dropdown (cloned logo) */
  .slicknav_menu ul.slicknav_nav > li:first-child,
  .slicknav_menu nav.slicknav_nav ul.slicknav_nav > li:first-child {
    background: magenta !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
}

/* === MOBILE LOGO SIZE REDUCTION === */
@media (max-width: 1024px) {
  #masthead img.custom-logo,
  #masthead .menu-item-logo img {
    max-height: 140px !important;   /* adjust down from current size */
    width: auto !important;
    height: auto !important;
    margin-top: -6px !important;   /* optional fine-tune */
    margin-bottom: -4px !important;
  }
}

/* === MOBILE LOGO CENTERING FIX === */
@media (max-width: 1024px) {
  #masthead,
  .site-header,
  .header-container {
    text-align: center !important;
  }

  #masthead img.custom-logo,
  #masthead .menu-item-logo img {
    display: inline-block !important;
    float: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* === MOBILE LOGO SIZE + CENTER + SPACING FIX === */
@media (max-width: 1024px) {
  #masthead,
  .site-header,
  .header-container {
    text-align: center !important;
  }

  #masthead img.custom-logo,
  #masthead .menu-item-logo img {
    display: inline-block !important;
    float: none !important;
    max-height: 140px !important;   /* your preferred size */
    width: auto !important;
    height: auto !important;
    margin-top: 6px !important;     /* was negative - add a bit of breathing room */
    margin-bottom: 4px !important;
  }
}

/* ========== SOFT UTILITIES (Homepage & Section Layouts) ========== */

/* Decorative divider */
.softdivider {
  height: 26px;
  background: linear-gradient(to bottom, #eae3d1, #f3efe3);
  border-radius: 12px;
  max-width: 1100px;
  margin: 0 auto;
}

/* Photo card block */
.softphoto {
  background: #fff;
  border-radius: 12px;
  padding: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
}
.softphoto img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
}

/* Call-to-action banner */
.softcta {
  background: #1a3b2e;
  color: #eae3d1;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.softcta strong {
  font-size: clamp(18px, 2.2vw, 22px);
}















/* ================================================================
   PATCH v2.3K.1 - Expand content width on mobile
   ================================================================ */
@media (max-width: 1024px) {
  .single .content-area,
  .single-post .content-area,
  .single .inner-wrap,
  .page .inner-wrap,
  .single .site-content,
  .page .site-content {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 4vw !important;
    padding-right: 4vw !important;
  }

  article,
  .page .hentry {
    max-width: 100% !important;
    width: 100% !important;
    border-radius: 0 !important;
    margin: 0 !important;
  }
}



/* ================================================================
   PATCH D.2 - Fix softphoto image scaling on mobile
   ================================================================ */
@media screen and (max-width: 900px) {
  .softphoto {
    overflow: hidden;
    max-width: 100%;
  }

  .softphoto img,
  .softphoto .wppa-container img,
  .softphoto .thumb-img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    max-width: 100%;
  }

  /* If WPPA is injecting fixed heights, override them */
  .wppa-container,
  .wppa-container-wrapper {
    height: auto !important;
    width: 100% !important;
  }
}

/* ================================================================
   PATCH v2.3K - SoftFrame Split Layout (65/35 responsive)
   ================================================================ */
.softframe .softsplit {
  display: grid;
  grid-template-columns: 65% 35%;
  gap: 24px;
  align-items: start;
}

.softframe .softsplit > div {
  background: transparent;
}

/* Image area alignment */
.softframe .softsplit .softphoto {
  justify-self: center;
}

/* --- Responsive behaviour --- */
@media (max-width: 900px) {
  .softframe .softsplit {
    grid-template-columns: 1fr;
    gap: 18px;
    text-align: center;
  }
  .softframe .softsplit .softphoto {
    margin: 0 auto;
  }
}


/* ================================================================
   PATCH v2.3J - SoftFrame option override (restores [option="cream"])
   ================================================================ */
.softframe.opt-cream {
  background-color: #f3efe3 !important;
  color: #1a3b2e !important;
  border-color: rgba(22,52,38,.15) !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.05) !important;
}

.softframe.opt-green {
  background-color: #1a3b2e !important;
  color: #eae3d1 !important;
  border-color: rgba(234,227,209,.15) !important;
}


/* ================================================================
   PATCH v2.3K.3 - Unified Card Design (Posts / Events / Albums)
   ================================================================ */
/* ==================================================
   Interactive Cards ONLY
   ================================================== */

.softcard,
.post-card,
.event-card,
.album-card,
.post-item,
.post-wrapper,
.blog article {
  background: #ffffff !important;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
  cursor: pointer;
  text-decoration: none !important;
  color: #1a3b2e !important;
  display: block;
}

.softcard:hover,
.post-card:hover,
.event-card:hover,
.album-card:hover,
.post-item:hover,
.post-wrapper:hover,
.archive article:hover,
.blog article:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 14px rgba(0,0,0,.12) !important;
}

/* ==================================================
   Reading Surfaces (never interactive)
   ================================================== */

.single article,
.single .article-content,
.single .softpaper {
  cursor: default !important;
  transform: none !important;
  box-shadow: none !important;
}


.post img,
.type-post img,
.event img,
.type-event img,
.album img,
.type-album img,
.archive article img,
.blog article img,
.post-item img,
.post-wrapper img,
.article-content img,
.softcard img,
.post-card img,
.event-card img,
.album-card img {
  width: 100%;
  height: auto !important;
  display: block;
  border-radius: 0 !important;
}

.post .entry-content,
.type-post .entry-content,
.event .entry-content,
.type-event .entry-content,
.album .entry-content,
.type-album .entry-content,
.archive article .entry-content,
.blog article .entry-content,
.post-item .entry-content,
.post-wrapper .entry-content,
.article-content .entry-content {
  padding: 16px 20px !important;
}

/* ================================================================
   PATCH v2.3K.4 - Card background harmonisation
   ================================================================ */
.post,
.type-post,
.event,
.type-event,
.album,
.type-album,
.archive article,
.blog article,
.post-item,
.post-wrapper,

.softcard,
.post-card,
.event-card,
.album-card {
  background: #eae3d1 !important; /* was #ffffff */
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
  cursor: pointer;
  text-decoration: none !important;
  color: #1a3b2e !important;
  display: block;
}

/* ================================================================
   PATCH v2.3K.5 - Refined Card Shadow Depth
   ================================================================ */
.post,
.type-post,
.event,
.type-event,
.album,
.type-album,
.archive article,
.blog article,
.post-item,
.post-wrapper,
.softcard,
.post-card,
.event-card,
.album-card {
  background: #eae3d1 !important; /* heritage cream tone */
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.12), 0 6px 20px rgba(0,0,0,0.08) !important;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
  cursor: pointer;
  text-decoration: none !important;
  color: #1a3b2e !important;
  display: block;
}

.post:hover,
.type-post:hover,
.event:hover,
.type-event:hover,
.album:hover,
.type-album:hover,
.archive article:hover,
.blog article:hover,
.post-item:hover,
.post-wrapper:hover,

.softcard:hover,
.post-card:hover,
.event-card:hover,
.album-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 5px 16px rgba(0,0,0,0.18), 0 10px 28px rgba(0,0,0,0.12) !important;
}

/* Mild cream lift when hovering over clickable cards */
.post:hover,
.type-post:hover,
.event:hover,
.type-event:hover,
.album:hover,
.type-album:hover,
.softcard:hover,
.post-card:hover,
.event-card:hover,
.album-card:hover {
  background-color: #f3efe3 !important;
}


.clubhouse-updates li {
  margin-bottom: 1.6em;
}



.club-updates-section {
  background: #f6f2e7; /* light heritage cream */
  padding: 1.5em;
  border-radius: 12px;
  margin: 2em 0;
}

.club-updates-section h2 {
  margin-bottom: 0.8em;
  color: #1a3b2e; /* British Racing Green */
  font-weight: 600;
}

.club-updates {
  list-style-type: disc;
  margin-left: 1.5em;
}

.club-updates li {
  margin-bottom: 19.6em;
  line-height: 1.4;
}

.club-updates a {
  color: #1a3b2e;
  text-decoration: none;
}

.club-updates a:hover {
  text-decoration: underline;
}

/* === XJS Soft Tops Club: Homepage 'What's happening' section === */

.club-updates-section {
  background: #f6f2e7;                     /* heritage cream background */
  padding: 1.2em 1.6em;
  border-radius: 14px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08); /* soft elevation */
  transition: box-shadow 0.3s ease;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.club-updates-section:hover {
  box-shadow: 0 6px 12px rgba(0,0,0,0.12);
}

.club-updates-section h2 {
  margin-top: 0;
  margin-bottom: 0.8em;
  font-size: 1.35em;
  font-weight: 600;
  color: #1a3b2e;                          /* British Racing Green */
  letter-spacing: 0.3px;
  text-shadow: 0 1px 0 rgba(255,255,255,0.4);
}

/* --- List structure --- */
.club-updates {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.club-updates li {
  position: relative;
  margin-bottom: 39.75em;
  padding-left: 1.4em;
  font-size: 1.05em;
  line-height: 1.45;
  color: #1a3b2e;
  opacity: 0;
  transform: translateY(8px);
  animation: fadeUp 0.6s ease forwards;
}


/* Decorative bullet */
.club-updates li::before {
  content: "-";
  position: absolute;
  left: 0;
  top: 0;
  color: #c1b68c;                          /* muted gold accent */
  font-weight: bold;
  font-size: 1.2em;
}

/* Link styling */
.club-updates a {
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid rgba(26, 59, 46, 0.15);
  transition: all 0.2s ease;
}

.club-updates a:hover {
  color: #c1b68c;
  border-color: #c1b68c;
}

/* --- Animation Keyframes --- */
@keyframes fadeUp {
  to { opacity: 1; transform: translateY(0); }
}

/* --- Responsive fine-tuning --- */
@media (max-width: 768px) {
  .club-updates-section {
    margin-bottom: 1.5em;
    padding: 1em 1.2em;
  }

  .club-updates-section h2 {
    font-size: 1.2em;
  }

  .club-updates li {
    font-size: 11em;
  }
}

.live-badge {
  background: #c1b68c;             /* muted gold accent */
  color: #1a3b2e;
  font-size: 0.75em;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0.2em 0.6em;
  border-radius: 6px;
  margin-left: 0.5em;
  letter-spacing: 0.5px;
  position: relative;
  top: -2px;
}

.live-badge::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 6px;
  border-radius: 50%;
  background: #e84a3d;             /* soft red pulse */
  animation: pulse 1.6s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 0.3; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1.3); }
}
.updates-last-refreshed {
  font-size: 0.8em;
  color: #555;
  margin-top: 0.6em;
  font-style: italic;
}


.live-badge {
  position: relative;
  top: -0.1em;
}

.latest-from .card {
  box-shadow: 0 3px 6px rgba(0,0,0,0.08);
  border-radius: 14px;
  background: #f8f5eb;
  transition: box-shadow 0.3s ease;
}
.latest-from .card:hover {
  box-shadow: 0 6px 12px rgba(0,0,0,0.12);
}

/* === XJS Soft Tops Club - Softcard Variants === */

/* Base softcard style (inherits your existing system) */
.softcard_static {
  background: #f6f2e7; /* heritage cream */
  border-radius: 14px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.softcard_static:hover {
  box-shadow: 0 6px 12px rgba(0,0,0,0.12);
  transform: translateY(-2px);
}

/* === White variant - use sparingly for contrast === */
.softcard_static.white {
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.softcard_static.white:hover {
  box-shadow: 0 6px 14px rgba(0,0,0,0.12);
}

/* Optional subtle tint for alternation or grouping */
.softcard_static.alt {
  background: #f8f5eb; /* slightly lighter than cream base */
}

/* Harmonise text and button colours */
.softcard_static.white h3,
.softcard_static.white p,
.softcard_static.white a {
  color: #1a3b2e; /* British Racing Green text */
}

/* Ensure soft hover link colour fits both variants */
.softcard_static.white a:hover,
.softcard_static.alt a:hover {
  color: #c1b68c; /* muted gold accent */
}

/* === Softcard White Variant Override === */
.softcard.white,
.softcard_static.white {
  background: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  color: #1a3b2e;
}

.softcard.white a.softbtn,
.softcard_static.white a.softbtn {
  background: #eae3d1;
  color: #1a3b2e;
  border: 2px solid #eae3d1;
}

.softcard.white a.softbtn:hover,
.softcard_static.white a.softbtn:hover {
  background: #1a3b2e;
  color: #eae3d1;
  border: 2px solid #1a3b2e;
}


.softcard.white {
  box-shadow: 0 3px 10px rgba(0,0,0,0.10), 0 1px 2px rgba(0,0,0,0.06);
}




/* === LIVE Tag: clean word + pulsing dot === */
.live-badge {
  display: inline-flex;
  align-items: center;
  background: none;
  border: none;
  padding: 0;
  margin-left: 6px;
  color: #1a3b2e;            /* heritage green text */
  font-weight: 700;
  font-size: 0.85em;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.live-badge::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 6px;
  border-radius: 50%;
  background: #e84a3d;       /* soft red pulse */
  animation: pulse 1.8s ease-in-out infinite;
}



/* --- Coloured pulsing dots for each update type --- */
.club-updates li {
  position: relative;
  margin-bottom: 0.75em;
  padding-left: 1.6em;
  font-size: 1.05em;
  line-height: 1.45;
  color: #1a3b2e;
  opacity: 0;
  transform: translateY(8px);
  animation: fadeUp 0.6s ease forwards;
}



/* --- Decorative pulsing dot before each item --- */
.club-updates li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  animation: pulseDot 2.8s ease-in-out infinite;
}


/* --- Gentle pulse animation --- */
@keyframes pulseDot {
  0%, 100% { opacity: 0.4; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1.3); }
}




/* --- Responsive refinement for CTA banner (mobile view) --- */
@media (max-width: 768px) {
  .cta-buttons {
    flex-direction: column;
    gap: 10px;
  }

  .cta-btn.cream,
  .cta-btn.outline {
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
  }

  .cta-banner {
    padding: 1em 0.8em 1.3em;
  }

  .cta-text {
    font-size: 1em;
    line-height: 1.4;
    margin-bottom: 0.9em;
  }
}


/* H1 so it cannot be seen */
.visually-hidden {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* --- Dropdown Menu Restyle (ColorMag Heritage Version) --- */

/* Base dropdown container */
.main-navigation ul ul {
  background-color: #1a3b2e !important;  /* heritage green */
  border: 1px solid #eae3d1 !important;  /* cream border */
  border-radius: 8px;
  padding: 6px 0;
  box-shadow: 0 4px 8px rgba(0,0,0,0.25);
  z-index: 9999; /* ensure it's above everything else */
}

/* Dropdown menu links */
.main-navigation ul ul li a {
  color: #eae3d1 !important;             /* cream text */
  padding: 10px 18px;
  font-weight: 500;
  text-decoration: none;
  background: transparent !important;
  transition: background-color 0.25s ease, color 0.25s ease;
  line-height: 1.4em;
}

/* Hover state */
.main-navigation ul ul li a:hover {
  background-color: #eae3d1 !important;  /* cream hover background */
  color: #1a3b2e !important;             /* green hover text */
}

/* Divider between dropdown items */
.main-navigation ul ul li:not(:last-child) {
  border-bottom: 1px solid rgba(234, 227, 209, 0.25);
}

/* Optional: smooth dropdown animation */
.main-navigation ul ul {
  opacity: 0;
  transform: translateY(8px);
  transition: all 0.25s ease;
  visibility: hidden;
}

.main-navigation ul li:hover > ul {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
}

:root {
  --green: #1a3b2e;
  --cream: #eae3d1;
  --paper: #f3efe3;
}

/* ================================================================
   PATCH v2.3K.17 - Softintro + Divider (final consolidated build)
   ================================================================ */

/* === Softintro container === */
.softintro {
  max-width: 1400px !important;
  width: 100% !important;
  background: #f3efe3 !important;                     /* heritage paper tone */
  border-radius: 14px !important;
  border: 1px solid rgba(22,52,38,.25) !important;    /* soft green tint */
  box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important;
  margin: 12px auto !important;
  padding: 4px 40px 10px !important;                  /* ultra-tight vertical spacing */
  box-sizing: border-box !important;
  text-align: center !important;
}

/* === Typography and rhythm === */
.softintro-title {
  font-family: "Georgia","Times New Roman",serif !important;
  font-size: 1.85rem !important;
  font-weight: 700 !important;
  color: #1a3b2e !important;
  line-height: 1.1 !important;
  margin: 0 0 0.3em 0 !important;                     /* compact spacing below title */
}

.softintro-text {
  font-size: clamp(16px,2.1vw,20px) !important;
  font-weight: 400 !important;
  color: #1a3b2e !important;
  opacity: 0.9 !important;
  line-height: 1.15 !important;
  margin: 0 0 0.35em 0 !important;
}

/* Neutralise inherited paragraph/header margins inside */
.softintro p,
.softintro h2,
.softintro h3,
.softintro h4 {
  margin: 0 !important;
  padding: 0 !important;
}

/* Button spacing alignment */
.softintro .softbtn {
  margin: 0 !important;
}

/* === Divider styling === */
.softdivider {
  height: 2px;
  width: 70%;
  margin: 40px auto 25px;
  border-radius: 2px;
  background: linear-gradient(to right, transparent, var(--green) 50%, transparent);
}

/* Balance spacing when used inside a .softsection wrapper */
.softsection > .softdivider {
  margin-top: 1.5em;
  margin-bottom: 1.5em;
}

/* Remove any default theme padding/margins around intro sections */
.page .entry-content > .softsection,
.page .entry-content > .softframe {
  margin: 0 auto;
  padding: 0;
}

/* ##################################################### */

.softpaper-flex {
  display: flex;
  align-items: center;   /* vertical centering */
  gap: 24px;
}

.softpaper + .softpaper {
  margin-top: 0.3em !important; /* tighten the vertical gap between stacked blocks */
}


/* ================================================================
   PATCH v2.3K.18 - Mobile spacing + alignment refinements
   ================================================================ */

/* --- 1. Tighten gap between intro and first softpaper --- */
@media (max-width: 900px) {
  .softintro {
    margin-bottom: 0.8em !important;  /* reduce the after-gap of intro */
  }

  .softdivider {
    margin-top: 1em !important;      /* slightly smaller divider gap */
    margin-bottom: 1em !important;
  }
}

/* ################################################# */

  /* Reduce top margin of first softpaper when stacked under intro */
  .softintro + .softdivider + .softbody .softpaper:first-of-type,
  .softdivider + .softbody .softpaper:first-of-type {
    margin-top: 0.6em !important;
  }
}

/* ################################################# */

/* --- 2. Reduce vertical gap between photo and text --- */
@media (max-width: 900px) {
  .softpaper-flex {
    gap: 0.8em !important;  /* reduce gap between stacked children */
    align-items: flex-start !important;
  }

  /* Remove redundant bottom padding from the image block */
  .softpaper-flex > .softpaper-35 {
    margin-bottom: 0.2em !important;
  }

  /* Remove excessive top margin on text after image */
  .softpaper-flex > .softpaper-65 p:first-child {
    margin-top: 0 !important;
  }
}

/* --- 3. Keep text left-aligned on mobile --- */
@media (max-width: 900px) {
  .softpaper-flex,
  .softpaper-flex > div,
  .softpaper .softpaper-65 {
    text-align: left !important;
  }
}

/* ================================================================
   PATCH v2.3K.19 - Ultra-tight mobile spacing around image
   ================================================================ */
@media (max-width: 900px) {

  /* Tighten overall softpaper padding */
  .softpaper {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Remove excess space above and below the image */
  .softpaper-35 img {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    display: block;
  }

  /* Compress the vertical gap between image and text */
  .softpaper-flex {
    gap: 0 !important;
  }

  /* Remove extra margins on first and last paragraphs within text */
  .softpaper-65 p:first-child {
    margin-top: 0 !important;
  }
  .softpaper-65 p:last-child {
    margin-bottom: 0 !important;
  }

  /* Neutralise any internal div spacing that can add height */
  .softpaper-35, .softpaper-65 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
  }
}

/* ================================================================
   PATCH v2.3K.20 - Eliminate WP auto-paragraph gaps around images
   ================================================================ */
@media (max-width: 900px) {
  /* Remove vertical space caused by auto <p> around image blocks */
  .softpaper p:empty,
  .softpaper p:has(img),
  .softpaper p:has(div) {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
  }

  /* Remove default line-height reserve from img baseline */
  .softpaper img {
    display: block !important;
    line-height: 0 !important;
    vertical-align: middle !important;
  }

  /* If any rogue paragraphs slip in after the image */
  .softpaper p + p {
    margin-top: 0.3em !important;
  }
}


/* ================================================================
   TRACE - Identify where extra vertical space remains
   ================================================================ */
/*@media (max-width: 900px) {
  .softpaper {
    outline: 2px dashed red !important;
    background-color: rgba(255,0,0,0.05) !important;
  }

  .softpaper-35 {
    outline: 2px dotted blue !important;
    background-color: rgba(0,0,255,0.05) !important;
  }

  .softpaper-65 {
    outline: 2px dotted green !important;
    background-color: rgba(0,255,0,0.05) !important;
  }

  img {
    outline: 2px solid orange !important;
  }
}*/

/* ================================================================
   PATCH v2.3K.23 - Mobile compression for stacked softpaper blocks
   ================================================================ */
@media (max-width: 900px) {
  /* Force block stacking to touch edges neatly */
  .softpaper-35,
  .softpaper-65 {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
  }

  /* Remove residual text flow margin around stacked softpaper */
  .softbody {
    gap: 0 !important;
  }

  /* Eliminate subtle baseline space between inline items */
  .softpaper img {
    display: block !important;
    margin: 0 auto !important;
    line-height: 0 !important;
    vertical-align: middle !important;
  }

  /* Counter any inherited line-height on parent container */
  .softpaper {
    line-height: 0 !important;
  }

  /* Restore readable spacing just for the actual text content */
  .softpaper-65 p {
    line-height: 1.4 !important;
    margin-top: 0 !important;
    margin-bottom: 0.6em !important;
  }
}


/* TRACE 2 - show any hidden <p> tags in the area */
/*.softpaper p {
  background: rgba(255, 255, 0, 0.3) !important;
  outline: 1px dashed orange !important;
}


/* ================================================================
   PATCH v2.3K.22 - Remove unwanted <p> margins inside softpaper
   ================================================================ */
.softpaper p:first-child,
.softpaper p:has(img),
.softpaper p:empty {
  margin-top: 0 !important;
}

.softpaper p:last-child {
  margin-bottom: 0 !important;
}

.softpaper p {
  line-height: 1.5;
  padding: 0 !important;
}

/* ================================================================
   v2.3K - Softpaper Alignment & Mobile Compression
   ================================================================ */

.softpaper p:first-child,
.softpaper p:has(img),
.softpaper p:empty {
  margin-top: 0 !important;
}

.softpaper p:last-child {
  margin-bottom: 0 !important;
}

.softpaper img {
  display: block !important;
  margin: 0 auto !important;
  line-height: 0 !important;
  vertical-align: middle !important;
}

@media (max-width: 900px) {
  .softpaper-35,
  .softpaper-65 {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
  }

  .softbody {
    gap: 0 !important;
  }

  .softpaper {
    line-height: 0 !important;
  }

  .softpaper-65 p {
    line-height: 1.4 !important;
    margin-top: 0 !important;
    margin-bottom: 0.6em !important;
  }
}

/* ===================================================================
   SOFTPAPER VISUAL SPACING & ALIGNMENT STANDARD - v2.3K
   -------------------------------------------------------------------
   Purpose:
   - Unify spacing across text, image and mixed-content softpaper blocks.
   - Remove unwanted cream gaps between stacked blocks on mobile.
   - Maintain consistent alignment on desktop and mobile layouts.
   -------------------------------------------------------------------
   Usage:
   - Apply to any `.softpaper` block or `.softbody` container.
   - Designed to work alongside `.softintro`, `.softdivider`, `.softsection`.
   -------------------------------------------------------------------
   Version History:
   v2.3K.23  (Nov 2025)  -  Mobile compression and margin reset patch.
   =================================================================== */

.softpaper p:first-child,
.softpaper p:has(img),
.softpaper p:empty {
  margin-top: 0 !important;
}

.softpaper p:last-child {
  margin-bottom: 0 !important;
}

.softpaper img {
  display: block !important;
  margin: 0 auto !important;
  line-height: 0 !important;
  vertical-align: middle !important;
}

/* ==================== MOBILE STACK BEHAVIOUR ==================== */
@media (max-width: 900px) {
  .softpaper-35,
  .softpaper-65 {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
  }

  .softbody {
    gap: 0 !important;
  }

  .softpaper {
    line-height: 0 !important;
  }

  .softpaper-65 p {
    line-height: 1.4 !important;
    margin-top: 0 !important;
    margin-bottom: 0.6em !important;
  }
}



/* ================================================================
   PATCH v2.3K.28 - Restore balance for .softsplit blocks in softframes
   ================================================================ */
.softsplit {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  box-sizing: border-box;
}

.softsplit > div {
  box-sizing: border-box;
  padding: 1.2rem 1.4rem;
}





/* Specific ratio blocks */
.softsplit.ratio-60-40 > div:first-child {
  flex: 0 0 60%;
  max-width: 60%;
}

.softsplit.ratio-60-40 > div:last-child {
  flex: 0 0 40%;
  max-width: 40%;
}

/* Mobile stack tidy */
@media (max-width: 900px) {
  .softsplit > div {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0.6rem 0.8rem;
  }
}

/* ================================================================
   PATCH v2.3K.33 - Final tidy correction for ratio-35-65 balance
   ================================================================ */
@media (min-width: 900px) {
  .softsplit.ratio-35-65 > div:first-child {
    padding-left: 1.2rem;  /* visually match member side */
  }
  .softsplit.ratio-35-65 > div:last-child {
    padding-right: 1.2rem; /* equal inset, not overpadded */
    box-sizing: border-box;
  }
}

/* ================================================================
   PATCH v2.3K.35 - Softsplit alignment & mobile stack correction
   ================================================================ */

/* --- DESKTOP (min 900px) --- */
@media (min-width: 900px) {

  /* Base flex alignment within softframes */
  .softframe .softsplit {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: 28px !important;
  }







  /* --- Photo RIGHT variant (normal 60-40) --- */
  .softframe .softsplit.ratio-60-40 > div:first-child {
    flex: 0 0 60%;
    max-width: 60%;
    padding-left: 1.2rem !important;
  }
  .softframe .softsplit.ratio-60-40 > div:last-child {
    flex: 0 0 40%;
    max-width: 40%;
    padding-right: 1.2rem !important;
  }

  /* --- Photo LEFT variant (mirrored) --- */
  .softframe .softsplit.ratio-35-65 > div:first-child {
    flex: 0 0 35%;
    max-width: 35%;
    padding-left: 1.2rem !important;
  }
  .softframe .softsplit.ratio-35-65 > div:last-child {
    flex: 0 0 65%;
    max-width: 65%;
    padding-right: 1.2rem !important;
  }
}

/* --- MOBILE STACKING (max 900px) --- */
@media (max-width: 900px) {
  .softframe .softsplit {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 18px !important;
    text-align: center !important;
  }

  .softframe .softsplit > div {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }

  .softframe .softsplit .softphoto {
    margin: 0 auto !important;
  }
}


/* ================================================================
   PATCH v2.3K.37b � Standalone softpaper full-width fix (no :has)
   ================================================================ */

/* PATCH v2.3K.37b – Standalone softpaper full-width fix (no :has) */
/* Exclude specialised album layouts (intro, navbar) */
.softpaper:not(.softpaper-35):not(.softpaper-65):not(.intro):not(.navbar) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  text-align: left !important;
}

/* =========================================================
   v2.3K.41c � Softpaper Legal Page Alignment Fix
   Forces full-width single-column flow and re-centres content
   ========================================================= */

/*.softpaper,
.softpaper * {
  -webkit-column-count: 1 !important;
  -moz-column-count: 1 !important;
  column-count: 1 !important;
  -webkit-column-gap: 0 !important;
  -moz-column-gap: 0 !important;
  column-gap: 0 !important;
}

.softpaper {
  display: block !important;
  text-align: left !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 900px !important;
}

.softpaper > * {
  float: none !important;
  display: block !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
} */


/* ================================================================
   PATCH v2.3K.39�40 � Softnote + Slim variants (finalised colour fix)
   ================================================================ */

/* --- Base full-width version --- */
.softnote {
  background: #eae3d1;               /* heritage cream */
  color: #1a3b2e;                    /* heritage green text */
  border-radius: 18px;
  box-shadow: 0 2px 5px rgba(0,0,0,.05), 0 8px 20px rgba(26,59,46,.07);
  padding: clamp(20px, 4vw, 50px);
  margin: 0 auto 40px;
  max-width: 1400px;
  width: 100%;
  display: block;
  text-align: left;
  box-sizing: border-box;
}

/* --- Green variant (inverse colourway) --- */
.softnote.opt-green {
  background: #1a3b2e !important;
  color: #eae3d1 !important;          /* cream text on green background */
}

/* --- Cream variant (explicit) --- */
.softnote.opt-cream {
  background: #eae3d1 !important;
  color: #1a3b2e !important;
}

/* --- Slim version (compact layout) --- */
.softnote.slim {
  border-radius: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 3px 8px rgba(26,59,46,0.05);
  padding: clamp(12px, 2.5vw, 22px) clamp(20px, 3vw, 30px);
  margin: 0 auto 30px;
  max-width: 1200px;
  line-height: 1.45;
}

/* Ensure slim green variant inherits correct text colour */
.softnote.slim.opt-green {
  background: #1a3b2e !important;
  color: #eae3d1 !important;
}

/* --- Paragraph spacing --- */
.softnote p:first-child,
.softnote.slim p:first-child { margin-top: 0; }
.softnote p:last-child,
.softnote.slim p:last-child  { margin-bottom: 0; }

/* --- Alignment helpers --- */
.softnote.align-center,
.softnote.slim.align-center { text-align: center; }
.softnote.align-right,
.softnote.slim.align-right  { text-align: right; }

/* --- Responsive refinement --- */
@media (max-width: 900px) {
  .softnote { padding: 20px 6vw; margin-bottom: 24px; }
  .softnote.slim { padding: 16px 5vw; margin-bottom: 20px; }
}


/* ================================================================
   PATCH v2.3K.41 � Force readable cream text inside green Softnotes
   ================================================================ */

/* Override any inherited theme colour */
.softnote.opt-green,
.softnote.opt-green *,
.softnote.slim.opt-green,
.softnote.slim.opt-green * {
  color: #eae3d1 !important;
  border-color: rgba(234,227,209,0.3) !important;
  text-shadow: none !important;
}

/* Preserve link contrast */
.softnote.opt-green a,
.softnote.slim.opt-green a {
  color: #eae3d1 !important;
  border-bottom: 1px solid rgba(234,227,209,0.4);
  text-decoration: none;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.softnote.opt-green a:hover,
.softnote.slim.opt-green a:hover {
  color: #c1b68c !important; /* muted gold hover */
  border-color: #c1b68c !important;
}





/* ================================================================
   PATCH v2.3K.41 � Add support for .ratio-40-60 softsplit
   ================================================================ */

/* --- DESKTOP (min 900px) --- */
@media (min-width: 900px) {
  .softframe .softsplit.ratio-40-60,
  .softpaper .softsplit.ratio-40-60 {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: 28px !important;
  }

  .softframe .softsplit.ratio-40-60 > div:first-child,
  .softpaper .softsplit.ratio-40-60 > div:first-child {
    flex: 0 0 40% !important;
    max-width: 40% !important;
    padding-left: 1.2rem !important;
  }

  .softframe .softsplit.ratio-40-60 > div:last-child,
  .softpaper .softsplit.ratio-40-60 > div:last-child {
    flex: 0 0 60% !important;
    max-width: 60% !important;
    padding-right: 1.2rem !important;
  }
}

/* --- MOBILE STACKING (max 900px) --- */
@media (max-width: 900px) {
  .softframe .softsplit.ratio-40-60,
  .softpaper .softsplit.ratio-40-60 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 18px !important;
    text-align: center !important;
  }

  .softframe .softsplit.ratio-40-60 > div,
  .softpaper .softsplit.ratio-40-60 > div {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }
}


/* ================================================================
   PATCH v2.3K.41c � Add .ratio-40-60 softsplit layout (40% / 60%)
   ================================================================ */
@media (min-width: 900px) {
  .softframe .softsplit.ratio-40-60,
  .softpaper .softsplit.ratio-40-60 {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 28px !important;
  }

  .softframe .softsplit.ratio-40-60 > div:first-child,
  .softpaper .softsplit.ratio-40-60 > div:first-child {
    flex: 0 0 40% !important;
    max-width: 40% !important;
    padding-left: 1.2rem !important;
  }

  .softframe .softsplit.ratio-40-60 > div:last-child,
  .softpaper .softsplit.ratio-40-60 > div:last-child {
    flex: 0 0 60% !important;
    max-width: 60% !important;
    padding-right: 1.2rem !important;
  }
}

@media (max-width: 900px) {
  .softframe .softsplit.ratio-40-60,
  .softpaper .softsplit.ratio-40-60 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 18px !important;
    text-align: center !important;
  }

  .softframe .softsplit.ratio-40-60 > div,
  .softpaper .softsplit.ratio-40-60 > div {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }
}

@media (min-width: 900px) {
  .softsplit.ratio-40-60 { 
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
  }
  .softsplit.ratio-40-60 > div:first-child {
    flex: 0 0 40% !important;
    max-width: 40% !important;
  }
  .softsplit.ratio-40-60 > div:last-child {
    flex: 0 0 60% !important;
    max-width: 60% !important;
  }
}

@media (min-width: 900px) {
  .softsplit.ratio-40-60 { 
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
  }
  .softsplit.ratio-40-60 > div:first-child {
    flex: 0 0 40% !important;
    max-width: 40% !important;
  }
  .softsplit.ratio-40-60 > div:last-child {
    flex: 0 0 60% !important;
    max-width: 60% !important;
  }
}

/* Sunday 9th November 2025 */
/* start of day */


/* ############################################################# */
/* #######################  v2.3K.39  ACTIVE  ################### */
/* ############################################################# */
/* Sunday 9 November 2025
   Card and grid enhancements for unified site-wide visual consistency.
   Includes:
   - 40/60 and 60/40 ratio refinement
   - Softgrid card layout
   - Hover lift and brightness effect
   - Consistent shadows and border radius
   Signed off: working and visually approved
/* ############################################################# */
/* --- SOFTGRID 4-UP CARD LAYOUT --- */
.page-section.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 24px;
  align-items: start;
  justify-items: center;
  margin: 10px auto 20px;
  max-width: 1100px;
}

/* Individual cards */
.page-section.cards .softcard_static {
  background: var(--soft-cream, #eae3d1);
  border-radius: 12px;
  padding: 18px;
  text-align: center;
  box-shadow: 0 3px 8px rgba(0,0,0,0.15);
  transition: transform .2s ease, box-shadow .2s ease;
}

.page-section.cards .softcard_static:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}

/* Images inside cards */
.page-section.cards .softcard_static img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  margin-bottom: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

/* Titles & text */
.page-section.cards .softcard_static h4 {
  color: #1a3b2e;
  margin: 6px 0 4px;
  font-size: 1.1rem;
}

.page-section.cards .softcard_static p {
  margin: 0;
  font-size: 0.95rem;
  opacity: 0.9;
}

.softframe.opt-cream .softcard_static {
  background: #eae3d1;
}

.softbtn.cream {
  border: 2px solid #1a3b2e;
}

.page-section.cards .softcard_static:hover img {
  filter: brightness(1.05);
}

/* --- SOFTGRID 4-UP CARD LAYOUT --- */
div.page-section.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 24px;
  align-items: start;
  justify-items: center;
  margin: 10px auto 20px;
  max-width: 1100px;
}

div.page-section.cards > .softcard_static {
  background: #eae3d1;
  border-radius: 12px;
  padding: 18px;
  text-align: center;
  box-shadow: 0 3px 8px rgba(0,0,0,0.15);
  transition: transform .2s ease, box-shadow .2s ease;
}

div.page-section.cards > .softcard_static:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}

div.page-section.cards > .softcard_static img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  margin-bottom: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

div.page-section.cards > .softcard_static h4 {
  color: #1a3b2e;
  margin: 6px 0 4px;
  font-size: 1.1rem;
}

div.page-section.cards > .softcard_static p {
  margin: 0;
  font-size: 0.95rem;
  opacity: 0.9;
}

.page-section.cards .softcard_static:hover img {
  animation: softpulse 1.6s ease-in-out infinite alternate;
}

@keyframes softpulse {
  from { filter: brightness(1.0); }
  to   { filter: brightness(1.07); }
}

/* --- Harmonise Forum Card Hover (match Article/Event style) --- */
.page-section.cards .softcard_static {
  background-color: #eae3d1;
  transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

.page-section.cards .softcard_static:hover {
  transform: translateY(-6px);
  background-color: #f5efdc; /* slightly lighter cream for hover */
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.22);
}

/* Optional: gentle brightness lift for the image on hover */
.page-section.cards .softcard_static:hover img {
  filter: brightness(1.08);
  transition: filter 0.25s ease;
}

/* --- v2.3K.38: Unified Softcard Cascade Hover Timing --- */

/* Apply to all card grids across site */
.softcard_static {
  transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease, filter 0.25s ease;
}

/* Hover effect shared by Articles, Events, Forum, Albums */
.softcard_static:hover {
  transform: translateY(-6px);
  background-color: #f5efdc;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.22);
  filter: brightness(1.05);
}


/* --- v2.3K.39: Extended Cascade Hover for Softgrid + Softframe Cards --- */

/* Ensure all card containers share the same unified behaviour */
.softgrid .softcard_static,
.softframe .softcard_static,
.page-section.cards .softcard_static {
  transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease, filter 0.25s ease;
}

/* Consistent hover lift and tone */
.softgrid .softcard_static:hover,
.softframe .softcard_static:hover,
.page-section.cards .softcard_static:hover {
  transform: translateY(-6px);
  background-color: #f5efdc;
  box-shadow: 0 8px 16px rgba(0,0,0,0.22);
  filter: brightness(1.05);
}


/* ############################################################# */
/* ####################  END OF v2.3K.39 ACTIVE  ################ */
/* ############################################################# */



/* --- v2.3K.40e Diagnostic: detect duplicate rendering in softpaper --- */
/*@media (max-width: 900px) {
  .softpaper *,
  .softframe * {
    background: rgba(255, 0, 0, 0.05) !important;
  }

  .softpaper::before,
  .softpaper::after,
  .softbody::before,
  .softbody::after {
    background: rgba(0, 255, 0, 0.15) !important;
    color: red !important;
    z-index: 9999 !important;
    position: relative !important;
  }
}

/* End of Sunday */

/* start of Monday 10th November */

/* Make sure softbtns inside Profile Builder forms align nicely */
form.wppb-register-user .softbtn,
form.wppb-login .softbtn,
form.wppb-recover-password .softbtn {
    display: inline-block;
    margin-top: 10px;
}

form.wppb-register-user .softbtn,
form.wppb-login .softbtn,
form.wppb-recover-password .softbtn {
    display: block;
    margin: 20px auto;
}


form.wppb-register-user .softbtn,
form.wppb-login .softbtn,
form.wppb-recover-password .softbtn,
form.wppb-edit-user .softbtn {
    display: block;
    margin: 20px auto;
}

/* === XJS Soft Tops Club: unify all Profile Builder and bbPress buttons === */

.wppb-user-forms input[type="submit"],
form#loginform input[type="submit"],
form#lostpasswordform input[type="submit"],
form.wppb-register-user input[type="submit"],
form.wppb-edit-user input[type="submit"],
form.wppb-recover-password input[type="submit"],
.login-submit input[type="submit"],
.form-submit input[type="submit"],
#bbp_topic_submit,
#bbp_reply_submit,
#bbp_edit_submit {
  background-color: #1a3b2e !important;
  color: #eae3d1 !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 28px !important;
  font-weight: 600 !important;
  font-family: inherit !important;
  box-shadow: 0 3px 5px rgba(0,0,0,0.2);
  transition: all 0.25s ease;
  cursor: pointer;
  display: inline-block;
}

.wppb-user-forms input[type="submit"]:hover,
form#loginform input[type="submit"]:hover,
form#lostpasswordform input[type="submit"]:hover,
form.wppb-register-user input[type="submit"]:hover,
form.wppb-edit-user input[type="submit"]:hover,
form.wppb-recover-password input[type="submit"]:hover,
.login-submit input[type="submit"]:hover,
.form-submit input[type="submit"]:hover,
#bbp_topic_submit:hover,
#bbp_reply_submit:hover,
#bbp_edit_submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 8px rgba(0,0,0,0.3);
  opacity: 0.95;
}


/* --- Final fix: force bbPress topic/reply submit button to align left --- */
#bbpress-forums div.bbp-submit-wrapper,
#bbpress-forums p.submit {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
  text-align: left !important;
  width: 100% !important;
}

#bbpress-forums input#bbp_topic_submit,
#bbpress-forums input#bbp_reply_submit,
#bbpress-forums input#bbp_edit_submit {
  margin-left: 0 !important;
  margin-right: auto !important;
  float: none !important;
  display: inline-block !important;
  text-align: left !important;
}




















/* ############################################################# */
/* ############################################################# */
/* ##### DO NOT WRITE BELOW HERE                     ########### */
/* ############################################################# */
/* ############################################################# */

/* ================================================================
   PATCH v2.3K.36 - Universal containment for all .softsplit ratios
   ================================================================ */
@media (min-width: 900px) {
  .softframe .softsplit {
    box-sizing: border-box !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }

  .softframe .softsplit > div {
    box-sizing: border-box !important;
  }

  /* Subtle text inset when it's the right-hand column */
  .softframe .softsplit > div:last-child {
    padding-right: 1.5rem !important;
  }
}


/* ================================================
   BROWSE MODE STYLING FOR ACF FIELDS (READ-ONLY)
   Applies to single-car_album.php with class: album-browse-page
   ================================================ */

body.album-browse-page .acf-form {
    padding: 30px 40px;
    background-color: var(--soft-cream);
    border-radius: 12px;
    box-shadow: var(--soft-shadow);
}

/* Field group spacing */
body.album-browse-page .acf-field {
    margin-bottom: 24px;
}

/* Input-like elements: plain appearance */
body.album-browse-page input[type="text"],
body.album-browse-page input[type="number"],
body.album-browse-page textarea {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    font-weight: 500;
    color: #222;
    cursor: default;
}

/* Radio button suppression */
body.album-browse-page input[type="radio"] {
    pointer-events: none;
    opacity: 0.5;
    transform: scale(0.9);
}

body.album-browse-page .acf-label label {
    font-weight: bold;
    color: var(--soft-green);
    margin-bottom: 6px;
    display: inline-block;
}

/* Photo field image spacing */
body.album-browse-page .acf-field-image img {
    max-width: 100%;
    border-radius: 6px;
    margin-top: 12px;
    box-shadow: var(--soft-shadow);
}

/* Suppress 'No image selected' etc. in read-only */
body.album-browse-page .acf-field .acf-image-uploader .acf-button,
body.album-browse-page .acf-field .acf-image-uploader p {
    display: none !important;
}






.club-updates li.update {
  position: relative;
  padding-left: 1.4em;
}

.club-updates li.update::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 0.6em;
  height: 0.6em;
  border-radius: 50%;
}

/* Existing lights */
.club-updates li.discussion::before { background: #3a7f5c; }
.club-updates li.event::before      { background: #c6a94a; }
.club-updates li.article::before    { background: #8a6f3d; }
.club-updates li.album::before      { background:#ffffff; }



/* Club Updates — remove native list bullets */
ul.club-updates {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}

ul.club-updates li {
    list-style: none;
}
/* ============================================================
   Single Article — override ColorMag full-width layout
   ============================================================ */

body.single-post article.post {
    max-width: 1100px !important;
    margin-left: auto;
    margin-right: auto;
}

.soft-lightbox {
  position: fixed;
  inset: 0;
  z-index: 999999;
}

.soft-lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.85);
}

.soft-lightbox-inner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.soft-lightbox-inner img {
  max-width: 92vw;
  max-height: 92vh;
  border-radius: 8px;
}

.soft-lightbox-close {
  position: absolute;
  top: 18px;
  right: 18px;
  font-size: 28px;
  background: none;
  border: none;
  color: #fff;
  cursor: pointer;
}

.album-photo-grid img,
.polaroid-card img,
.forum-photo-grid img {
  cursor: zoom-in;
}

body.soft-lightbox-open {
  overflow: hidden;
}
/* DEBUG: outline SlickNav blocks so we can see what's what */
.slicknav_menu { outline: 3px solid red !important; }
.slicknav_menu > * { outline: 2px solid orange !important; }
.slicknav_menu .slicknav_nav { outline: 2px solid lime !important; }
.slicknav_menu .slicknav_nav > li { outline: 1px solid cyan !important; }
.slicknav_menu .slicknav_nav > li:first-child { outline: 3px solid magenta !important; }
/* Hide the first SlickNav item (often HOME) if it's being used as a logo row */
@media (max-width: 1024px) {
  .slicknav_menu .slicknav_nav > li:first-child {
    display: none !important;
  }
}
/* MOBILE: hide logo item inside dropdown menu */
@media (max-width: 1024px) {
  #site-navigation li.menu-item-logo {
    display: none !important;
  }
}
/* ------------------------------------------------------
   FIX: Media modal "Upload files" tab text invisible
------------------------------------------------------ */

/* Non-active tabs */
.media-modal .media-menu-item {
    color: #000082 !important;   /* heritage green */
}

/* Active tab */
.media-modal .media-menu-item.active {
    color: #000 !important;
}

/* Hover / focus */
.media-modal .media-menu-item:hover,
.media-modal .media-menu-item:focus {
    color: #000 !important;
}

/* hide feature photo on articles */
.single-post .post-thumbnail,
.single-post .wp-post-image {
    display: none;
}
/* Prevent theme-level featured image wrapper
   when softpaper-feature shortcode is used */
.has-softpaper-feature .post-thumbnail,
.has-softpaper-feature .featured-image,
.has-softpaper-feature .entry-thumbnail {
    display: none !important;
}

/* ======================================================
   Header actions — centred + right aligned (single row)
   ====================================================== */

.album-header-actions {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end; /* right button */
  margin-top: 2px;
}

/* Centre button */
.album-header-center {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

/* Right button */
.album-header-right {
  margin-left: auto;
}

/* Button hygiene */
.album-header-actions .softbtn {
  white-space: nowrap;
}
@media (max-width: 768px) {
  .album-header-actions {
    position: static;
    flex-direction: column;
    gap: 12px;
  }

  .album-header-center {
    position: static;
    transform: none;
  }

  .album-header-right {
    margin-left: 0;
  }
}

/* Home only: remove legacy ColorMag front-page spacer */
body.home .front-page-top-section,
body.home .front-page-section {
  display: none !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 0 !important;
}
/* Home only: prevent extra gap above the cream page */
body.home .main-content-section {
  padding-top: 0 !important;
  margin-top: 0 !important;
}


/* Kill WordPress auto <p><br></p> pollution */
.entry-content p:has(> br:only-child) {
    display: none;
}
.softspacer {
  height: 1.5rem;   /* tweak to taste */
}

/* === Anniversary Feature Strip ================================= */

.soft-anniversary-strip {
  max-width: 1100px;
  margin: 2rem auto;

}

/* Make the LINK the grid container */
.soft-anniversary-strip > a {
  display: grid;
  grid-template-columns: 1fr 1.4fr 1fr;
  align-items: center;
  gap: 1.5rem;

  background: #f8f5ec;
  border-radius: 18px;


  text-decoration: none;
  color: inherit;
}

/* Defensive reset: kill WP junk */
.soft-anniversary-strip a > p,
.soft-anniversary-strip a > br {
  display: none !important;
}

/* === Column base =============================================== */

.anniv-col {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

/* === Left column =============================================== */

.anniv-left {
  text-align: left;
}

.anniv-club {
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.65;
}

.anniv-title {
  font-size: 1.35rem;
  font-weight: 600;
  color: #1a3b2e;
}

/* === Centre image ============================================== */

.anniv-centre {
  align-items: center;
}

.anniv-centre img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
}

/* === Right column ============================================== */

.anniv-right {
  text-align: right;
}

.anniv-venue {
  font-size: 1rem;
  font-weight: 500;
}

.anniv-date {
  font-size: 0.95rem;
  opacity: 0.85;
}

.anniv-note {
  font-size: 0.85rem;
  opacity: 0.6;
}

/* === Hover affordance ========================================== */

.soft-anniversary-strip > a:hover {
  background: #f3efe3;
}
.soft-anniversary-strip > a {
  padding: 0.75rem 1.6rem; 
    bottom-padding:0;/* was 1.6rem 1.8rem */
}
.anniv-col {
  gap: 0.25rem;   /* was 0.4rem */
}

.soft-anniversary-strip > a:hover {
  background: #f6f2e6; /* barely perceptible */
}

/* === Responsive fallback ======================================= */

@media (max-width: 900px) {
  .soft-anniversary-strip > a {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .anniv-left {
    text-align: center;
  }
  .anniv-right {
    text-align: center;
  }
}
.club-updates .update-title {
  display: block;
}

.club-updates .update-meta {
  display: block;
  font-size: 0.9em;
  opacity: 0.75;
}
.club-updates li.update {
  position: relative;
  padding-left: 1.6em;
}

.club-updates li.update::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.6em;          /* adjust per line height */
  width: 0.6em;
  height: 0.6em;
  border-radius: 50%;
  background: var(--status-colour);
}
.update.discussion { --status-colour: #5f8f6e; } /* heritage green */
.update.album      { --status-colour: #8fa58f; }
.update.gallery    { --status-colour: #8fa58f; }
.update.event      { --status-colour: #c9a44c; } /* muted gold */
.update.article    { --status-colour: #7f8fa0; } /* calm blue-grey */

.home-feature-photo img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 14px;
}

.home-feature-photo-credit {
    margin-top: 0.75rem;
    font-size: 0.95rem;
    color: #2e4a3f;
}
/* Footer policy: Home only */
body:not(.home) .heritage-footer-col {
    display: none;
}
footer.heritage-footer {
padding: 0rem 1rem 0rem 1rem !important;
}
/* Remove artificial bottom spacing on page content for flows */
body:not(.home) article.page.hentry {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
/* Prevent lightbox helper from adding layout height */
#soft-lightbox {
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden;
}