/*
Theme Name: DarkNews Child
Template: darknews
Description: Child theme for DarkNews.
Version: 1.0.81
*/

/* ================================================================
  STYLE ORGANIZATION PATTERN

  Comment header format used in this file:

  === SECTION: <Name> — Short description ===

  Aim: keep all rules that belong to a page inside a single section
  (example: Page: Slow Down — `page-id-1632`) and group by logical
  block/class (e.g. .slowdown-*, .se-*, .se-keeper, .se-price..).  This
  makes future edits, searches and maintenance much easier.
  ================================================================ */

/* === TOC ===
  1) Brand / variables
  2) Global utilities
  3) Page: Slow Down — page-id-1632 (consolidated)
  4) Page: PMPro / page-id-1145
  5) LLMS / UI helpers
  6) Misc / imports
*/
/* === CUSTOM: slowdown header mobile toggle & desktop layout === */

/* Desktop: keep 3 columns in a row (logo - menu - logo) */
@media (min-width: 769px) {
  .slowdown-header { display: grid !important; grid-template-columns: auto 1fr auto !important; align-items: center !important; }
  .slowdown-hamburger { display: none !important; } /* hide hamburger on desktop */
  .slowdown-close-wrap { display: none !important; }
  .slowdown-nav { display: flex !important; justify-content: center !important; align-items: center !important; gap: 12px !important; }
  .slowdown-nav .wp-block-button { margin: 0 6px !important; display: inline-block !important; }
}

/* -----------------------------------------------------------------
   FINAL OVERRIDE: very high specificity rules to force header/titles
   (added when other rules appear to be overridden or cached)
----------------------------------------------------------------- */
html body .header-layout-default .af-middle-container .logo .site-title,
html body .header-layout-default .af-middle-container .logo .site-title .site-title-anchor,
html body .header-layout-default .af-middle-container .logo .site-branding .site-description{
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Keep subtitle directly under title, tiny gap and readable size */
html body .header-layout-default .af-middle-container .logo .site-branding .site-description{
  margin-top: 2px !important;
  font-size: 0.95rem !important;
  opacity: .95 !important;
}

/* Force the desktop header to use space-between and keep logos aligned */
@media (min-width: 991px){
  html body .header-layout-default .af-middle-container{ justify-content: space-between !important; }
  html body .header-layout-default .af-middle-container .logo{ text-align:left !important; display:flex !important; flex-direction: row !important; align-items:center !important; gap:12px !important; }
  html body .header-layout-default .af-middle-container .header-promotion{ justify-content:flex-end !important; }
}

/* Force CTA + lock to brand gold where they exist */
html body .af-middle-container .wp-block-button__link,
html body .slowdown-cta-button .wp-block-button__link,
html body .se-testimonials-cta .se-cta { background: linear-gradient(180deg, rgba(var(--se-gold-rgb),1) 0%, rgba(var(--se-gold-rgb),0.95) 100%) !important; color: var(--sd-obsidian) !important; border-color: rgba(var(--se-gold-rgb),0.95) !important; }
html body svg.feather.feather-lock, html body .feather-lock { stroke: rgba(var(--se-gold-rgb),1) !important; }

/* End override */

/* -----------------------------------------------------------------
   FORCE: lift the subtitle directly under the title (developer request)
   - user asked for immediate placement; apply -100px offset on desktop
   - keep smaller adjustment on mobile so it doesn't overlap other content
----------------------------------------------------------------- */
@media (min-width: 991px){
  html body .header-layout-default .af-middle-container .logo .site-branding .site-description{
    margin-top: -100px !important; /* requested 'set -100px' */
    z-index: 30 !important; /* keep subtitle visually on top */
    display: block !important;
  }
}

/* Safer mobile: much smaller lift so subtitle stays readable and doesn't overlap */
@media (max-width: 990px){
  html body .header-layout-default .af-middle-container .logo .site-branding .site-description{
    margin-top: 2px !important;
    transform: none !important;
  }
}

/* ---------------------------------------------------------------
   PMPro membership cards — child-theme overrides (persist across plugin updates)
   High-specificity selectors + `!important` are used so plugin/theme updates are unlikely
   to override these branding rules. Adjust these values if you'd like different colors.
--------------------------------------------------------------- */
.entry-content .pmpro_card {
  /* make the card background the defined OBSIDIAN VOID color requested */
  background: #0D0D0D !important;
  border: 1px solid rgba(var(--se-gold-rgb),0.14) !important;
  border-radius: 14px !important;
  box-shadow: 0 16px 40px rgba(0,0,0,0.55) !important;
  color: var(--se-white) !important;
  /* enforce even horizontal padding across layout */
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  overflow: visible !important;
}

.entry-content .pmpro_card_content { padding: 8px 6px !important; background: transparent !important; }

/* -----------------------------------------------------------------
   Login & PMPro inputs — make fields use the same semi-transparent
   glass look as the rest of the card/UI (remove solid white fields)
   Targets: standard pmpro form inputs and generic `.input` class
----------------------------------------------------------------- */
.entry-content .pmpro_card_content input[type="text"],
.entry-content .pmpro_card_content input[type="password"],
.entry-content .pmpro_card_content input[type="email"],
.entry-content .pmpro_card_content input[type="tel"],
.entry-content .pmpro_card_content textarea,
.entry-content .pmpro_card_content select,
.entry-content .pmpro_card_content .input {
  background: rgba(255,255,255,0.04) !important; /* subtle glass */
  border: 1px solid rgba(255,255,255,0.06) !important;
  color: var(--se-white) !important; /* keep text readable on dark card */
  width: 100% !important;
  padding: 10px 12px !important;
  border-radius: 8px !important;
  box-shadow: inset 0 3px 8px rgba(0,0,0,0.5) !important;
  transition: box-shadow 160ms ease, border-color 160ms ease, background 160ms ease !important;
  -webkit-appearance: none !important; /* avoid platform white defaults */
}

.entry-content .pmpro_card_content input::placeholder,
.entry-content .pmpro_card_content textarea::placeholder { color: rgba(249,244,235,0.55) !important; }

.entry-content .pmpro_card_content input:focus,
.entry-content .pmpro_card_content textarea:focus,
.entry-content .pmpro_card_content select:focus { outline: none !important; border-color: rgba(var(--se-gold-rgb),0.9) !important; box-shadow: 0 6px 22px rgba(var(--se-gold-rgb),0.06) inset, 0 0 0 4px rgba(var(--se-gold-rgb),0.08) !important; }

/* Small screens: slightly reduce padding so stacked forms stay compact */
@media (max-width: 760px){
  .entry-content .pmpro_card_content input[type="text"],
  .entry-content .pmpro_card_content input[type="password"],
  .entry-content .pmpro_card_content textarea,
  .entry-content .pmpro_card_content .input { padding: 8px 10px !important; }
}

/* -----------------------------------------------------------------
   Pricing & form fine-tuning per request
   - center and color the pricing expiration copy gold
   - tighten the gap between the two-column form fields to 10px and
     update the 2-col child widths to compensate
   - make the 'Account Information' heading white to improve contrast
----------------------------------------------------------------- */
.entry-content .pmpro_level_expiration_text p{
  text-align: center !important;
  color: var(--se-gold) !important; /* gold color for expiration */
  margin-top: 10px !important;
}

.entry-content .pmpro_cols-2{ display:flex !important; gap:10px !important; }
.entry-content .pmpro_cols-2 > *{ width: calc(50% - 5px) !important; box-sizing: border-box !important; }

/* Ensure form heading is strongly white */
.entry-content .pmpro_form_heading, .entry-content .pmpro_card_title { color: var(--se-white) !important; }

.entry-content .pmpro_table { width: 100% !important; /* use separate border model so we can add vertical spacing between rows */ border-collapse: separate !important; border-spacing: 0 14px !important; }
.entry-content .pmpro_table th, .entry-content .pmpro_table td {
  padding: 12px 10px !important;
  border: none !important;
  vertical-align: middle !important;
}

.entry-content .pmpro_table th[data-title="Level"], .entry-content #pmpro_level-1 th, .entry-content #pmpro_level-2 th, .entry-content #pmpro_level-3 th, .entry-content #pmpro_level-4 th {
  color: rgba(var(--se-gold-rgb),1) !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  font-size: 1.02rem !important;
}

.entry-content .pmpro_table tbody tr.pmpro_level{ clear: both; display: table-row; }
.entry-content .pmpro_table tbody tr.pmpro_level th, .entry-content .pmpro_table tbody tr.pmpro_level td{ padding-top: .8rem !important; padding-bottom: .8rem !important; }

.entry-content .pmpro_level-price strong{ color: var(--se-gold) !important; font-weight:900 !important; font-size:1.05rem !important; }

.entry-content .pmpro_btn-select {
  background: linear-gradient(180deg, rgba(var(--se-gold-rgb),1) 0%, rgba(var(--se-gold-rgb),0.92) 100%) !important;
  color: var(--sd-obsidian) !important;
  border-radius: 8px !important;
  padding: .9rem 2.25rem !important;
  display: inline-block !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  text-decoration: none !important;
  border: 2px solid rgba(var(--se-gold-rgb),0.95) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.5) !important;
}

.entry-content #pmpro_level-1 th, .entry-content #pmpro_level-1 td { background: rgba(255,255,255,0.02) !important; border-radius:8px; }
.entry-content #pmpro_level-2 th, .entry-content #pmpro_level-2 td { background: linear-gradient(90deg, rgba(var(--se-gold-rgb),0.03), rgba(255,255,255,0.01)) !important; border-radius:8px; }
.entry-content #pmpro_level-3 th, .entry-content #pmpro_level-3 td { background: linear-gradient(90deg, rgba(var(--se-gold-rgb),0.01), rgba(255,255,255,0.02)) !important; border-radius:8px; }
.entry-content #pmpro_level-4 th, .entry-content #pmpro_level-4 td { background: linear-gradient(90deg, rgba(0,0,0,0.04), rgba(var(--se-gold-rgb),0.02)) !important; border-radius:8px; }

@media (max-width: 760px){
  .entry-content .pmpro_card { padding-left: 10px !important; padding-right: 10px !important; }
  .entry-content .pmpro_table thead { display: none !important; }
  .entry-content .pmpro_table tbody tr { display: block !important; margin-bottom: 14px !important; padding: 10px !important; border-radius: 10px !important; background: rgba(255,255,255,0.02) !important; }
  .entry-content .pmpro_table tbody tr th, .entry-content .pmpro_table tbody tr td { display:block !important; width:100% !important; padding:6px 0 !important; }
  .entry-content .pmpro_table tbody tr td .pmpro_level-price { margin-top: 6px !important; }
  .entry-content .pmpro_btn-select{ width: 86% !important; display:block !important; margin: 12px auto 0 !important; }
}

.entry-content .pmpro_table th, .entry-content .pmpro_table td, .entry-content .pmpro_btn-select { color: var(--se-white) !important; }

/* End PMPro child-theme overrides */

/* -----------------------------------------------------------------
   PMPro: password toggle visual reset
   - Remove any background so the control blends with the card
   - Use the page's brand font color for the text + icon
   - Keep an accessible focus ring
----------------------------------------------------------------- */
.entry-content .pmpro_form_field-password-toggle button,
.entry-content .pmpro_btn.pmpro_btn-plain.pmpro_btn-password-toggle {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  color: var(--se-white) !important; /* match rest of font */
  cursor: pointer !important;
}

.entry-content .pmpro_form_field-password-toggle button .pmpro_icon svg{ stroke: currentColor !important; }
.entry-content .pmpro_form_field-password-toggle button .pmpro_form_field-password-toggle-state{ color: inherit !important; }
.entry-content .pmpro_form_field-password-toggle button:focus{ outline: 2px dashed rgba(var(--se-gold-rgb),0.18) !important; outline-offset: 4px !important; }

/* -----------------------------------------------------------------
   Refined PMPro table & card polish
   - clearer header band
   - neat card panels with separators for each level row
   - right aligned CTAs, improved button contrast and hover
   - keep changes in child theme so plugin updates don't overwrite them
----------------------------------------------------------------- */
.entry-content .pmpro_table thead th{
  /* New header tone — subtle but more contrasted against the card */
  background: rgba(255,255,255,0.06) !important; /* faint band */
  color: var(--se-gold) !important; /* brand gold for labels */
  font-weight:700 !important;
  text-transform: none !important;
  padding: 12px 14px !important;
  border-radius: 10px !important;
  box-shadow: inset 0 -6px 18px rgba(0,0,0,0.14) !important;
}

/* -----------------------------------------------------------------
   Convert PMPro levels table into a responsive product-grid of modules
   - keeps plugin markup (no PHP changes) and adapts <tr> => product card
   - responsive grid (3 / 2 / 1 columns), clear spacing between modules
   - Free level gets a lighter 'outline' style; paid levels look like product cards
   - safe CSS in child theme so plugin updates won't overwrite
----------------------------------------------------------------- */
/* Hide the table header visually (keeps it for screen readers) */
.entry-content .pmpro_table.pmpro_levels_table thead { position: absolute !important; left: -9999px !important; top: auto !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

/* Make the table body into a wrapping flex grid */
.entry-content .pmpro_table.pmpro_levels_table { display: block !important; }
.entry-content .pmpro_table.pmpro_levels_table tbody { display: flex !important; flex-wrap: wrap !important; gap: 20px 24px !important; padding: 6px 0 !important; }

/* Treat each level row as a module/card */
  .entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level{
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    width: calc(33.333% - 16px) !important; /* default 3-column */
    min-width: 220px !important;
    background: linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.00)) !important;
    border-radius: 12px !important;
    /* even horizontal padding + comfortable vertical padding */
    padding-top: 18px !important;
    padding-bottom: 18px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  box-shadow: 0 8px 28px rgba(0,0,0,0.5) !important;
  margin: 0 !important; /* spacing handled by gap */
  position: relative !important;
  box-sizing: border-box !important;
}

/* Two-column layout for medium screens */
@media (max-width: 1100px){
  .entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level{ width: calc(50% - 12px) !important; padding-left:20px !important; padding-right:20px !important; }
}

/* -----------------------------------------------------------------
   Desktop layout: Free level sits on its own first row and the three
   "Slow Down" levels form a larger, three-column row beneath it.

   We increase min-heights and padding so each card (holder) feels larger
   and more like a product module while keeping responsive fallbacks.
----------------------------------------------------------------- */
/*
  Notes: To change how many paid cards fit per row, update the
  `width: calc(33.333% - 16px)` value and matching breakpoint(s).

  - For 4-up on very wide screens, change to `calc(25% - 16px)` and
    adjust the @media(min-width) above (there's already a convenience
    rule for >=1600px further down).
  - Adjust `min-height` below to make the card holders taller/shorter.
*/
@media (min-width: 1101px){
  /* Force Free into a full-width first row */
  .entry-content .pmpro_table.pmpro_levels_table tbody tr#pmpro_level-1{
    width: 100% !important;
    order: -1 !important; /* keep Free at the start */
    /* keep vertical breathing but even horizontal padding */
    padding-top: 28px !important;
    padding-bottom: 28px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    min-height: 160px !important; /* a bit taller for the hero level */
    align-self: stretch !important;
  }

  /* Make all other levels larger and constrained to 3 columns */
  .entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level{
    /* exact three-column sizing while leaving space for gap */
    width: calc(33.333% - 16px) !important;
    min-width: 260px !important;
    min-height: 360px !important; /* make holders noticeably larger */
    /* horizontal padding evened to 20px while keeping vertical padding */
    padding-top: 28px !important; /* internal vertical breathing */
    padding-bottom: 28px !important;
    padding-left: 20px !important;
    padding-right: 20px !important; /* more internal breathing room */
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important; /* keep CTA at the bottom */
  }

  /* Make sure the grid container aligns modules to the top row so Free sits alone */
  .entry-content .pmpro_table.pmpro_levels_table tbody{ align-items: flex-start !important; }

  /* Ensure CTA column stays visually anchored at the bottom */
  .entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level td:last-child{ display:flex !important; align-items:flex-end !important; justify-content:flex-end !important; }
}

/* Single-column / stacked cards for small screens */
@media (max-width: 760px){
  .entry-content .pmpro_table.pmpro_levels_table tbody { gap: 12px 0 !important; }
  .entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level{ width: 100% !important; padding: 14px !important; border-radius: 10px !important; }
}

/* Layout inside a module: use table cells as logical areas */
.entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level th{ display:block !important; font-size:1.05rem !important; color: var(--se-gold) !important; margin-bottom: 6px !important; font-weight:900 !important; }
.entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level td{ display:block !important; color: rgba(249,244,235,0.9) !important; margin-bottom: 8px !important; }

/* Price + expiry are in the price cell; make them visually strong */
.entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level td .pmpro_level-price{ font-size:1.02rem !important; color: var(--se-gold) !important; font-weight:900 !important; display:block; }
.entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level td .pmpro_level-expiration{ color: rgba(249,244,235,0.75) !important; font-size:0.95rem; margin-top:6px; }

/* === Layout refinements requested: center price, make price brand-white, show "One-time" label under title for one-time levels, center expiration description === */
.entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level td .pmpro_level-price{
  text-align: center !important; /* center price block */
  color: var(--se-white) !important; /* brand white for price text */
  margin: 0 auto !important;
}
.entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level td .pmpro_level-price strong{
  display: block !important;
  color: var(--se-white) !important; /* ensure the strong price is brand white */
  font-size: 1.28rem !important;
  letter-spacing: .01em !important;
}
.entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level td .pmpro_level-expiration{
  text-align: center !important; /* center expiration text */
  color: rgba(var(--se-gold-rgb),0.88) !important; /* readable tone under the price */
  margin-top: 10px !important;
}

/* Add a small 'One-time' label beneath the level title for paid-once levels */
.entry-content .pmpro_table.pmpro_levels_table tbody tr#pmpro_level-3 th::after,
.entry-content .pmpro_table.pmpro_levels_table tbody tr#pmpro_level-4 th::after{
  content: "One-time";
  display: block;
  text-align: center;
  color: var(--se-white) !important;
  opacity: 0.95;
  font-weight: 600;
  font-size: .88rem;
  margin-top: 8px;
}

/* -----------------------------------------------------------------
   FEATURED IMAGE: force post featured images to be 300x300 (centered)
   - scoped to common theme/plugin output classes so it only affects
     post/thumbnail/featured images (not all images)
   - uses object-fit:cover so photos crop nicely inside the 300px box
   - responsive fallback: on very narrow screens, allow width:100% for
     readability while keeping max-width:300px
----------------------------------------------------------------- */
.post-thumbnail img.wp-post-image,
img.attachment-darknews-featured,
img.size-darknews-featured,
.wp-block-post-featured-image img.wp-post-image,
.read-img img.wp-post-image {
  width: 300px !important;
  height: 300px !important;
  max-width: 300px !important;
  object-fit: cover !important;
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important; /* center */
  border-radius: 10px !important; /* keep consistent with theme thumbnails */
  box-shadow: 0 10px 30px rgba(0,0,0,0.25) !important;
}

/* Mobile / tiny containers — keep images readable but constrained */
@media (max-width: 420px){
  .post-thumbnail img.wp-post-image,
  img.attachment-darknews-featured,
  img.size-darknews-featured,
  .wp-block-post-featured-image img.wp-post-image,
  .read-img img.wp-post-image{
    width: 100% !important; /* fluid inside narrow cards */
    height: auto !important;
    max-width: 300px !important;
    object-fit: cover !important;
  }
}


/* For monthly / subscription level (e.g. level-2), use a different small label */
.entry-content .pmpro_table.pmpro_levels_table tbody tr#pmpro_level-2 th::after{
  content: "Recurring (monthly)";
  display: block;
  text-align: center;
  color: rgba(255,255,255,0.9) !important;
  font-weight: 600;
  font-size: .88rem;
  margin-top: 8px;
}

/* CTA area: always stick to the bottom inside each module to make modules similar height */
.entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level td:last-child{ margin-top:12px !important; display:flex !important; align-items:center !important; justify-content:flex-end !important; }
.entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level .pmpro_btn-select{ margin-left: 8px !important; }

/* Free level: lighter outline treatment */
.entry-content .pmpro_table.pmpro_levels_table tbody tr#pmpro_level-1{ background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00)) !important; border: 1px dashed rgba(var(--se-gold-rgb),0.10) !important; }

/* Paid levels: slightly stronger lift */
.entry-content .pmpro_table.pmpro_levels_table tbody tr#pmpro_level-2, .entry-content .pmpro_table.pmpro_levels_table tbody tr#pmpro_level-3, .entry-content .pmpro_table.pmpro_levels_table tbody tr#pmpro_level-4{ border: 1px solid rgba(255,255,255,0.03) !important; }

/* Founder badge: keep but tune so it sits comfortably when modules are cards */
.entry-content #pmpro_level-3::before{ right: 18px !important; top: -10px !important; }

/* Ensure a11y / focus clear CTA */
.entry-content .pmpro_btn-select{ box-shadow: none !important; }
.entry-content .pmpro_btn-select:focus{ box-shadow: 0 10px 30px rgba(var(--se-gold-rgb),0.15) !important; }

/* Optional: if you later add many products, reduce the card width so more fit in a row */
@media (min-width: 1600px){
  .entry-content .pmpro_table.pmpro_levels_table tbody tr.pmpro_level{ width: calc(25% - 16px) !important; }
}


/* Make each pricing row appear like a panel inside the card */
.entry-content .pmpro_table tbody tr.pmpro_level{ 
  /* keep the row as a table-row but visually present it as a separated panel */
  background: linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.00));
  border-radius: 10px; 
  box-shadow: 0 6px 18px rgba(0,0,0,0.45);
  overflow: visible;
  position: relative; /* allow positioned badge inside */
}

.entry-content .pmpro_table tbody tr.pmpro_level td, .entry-content .pmpro_table tbody tr.pmpro_level th{
  padding: 18px 12px !important;
}

/* subtle separators between levels for desktop/tablet */
.entry-content .pmpro_table tbody tr.pmpro_level + tr.pmpro_level{ padding-top: 8px; }

/* price column — emphasize price text and make expiration clearer */
.entry-content .pmpro_level-price strong { display:block; color: var(--se-gold) !important; font-weight:900 !important; font-size:1.08rem !important; }
.entry-content .pmpro_level-expiration { margin-top:6px; color: rgba(249,244,235,0.8) !important; font-size:0.95rem; }

/* align CTA column to right and vertically center it on larger screens */
.entry-content .pmpro_table td:last-child { text-align:right !important; vertical-align: middle !important; }
.entry-content .pmpro_btn-select { display:inline-block !important; vertical-align: middle; }

/* Make CTA more tactile and visually consistent */
.entry-content .pmpro_btn-select{
  transition: transform 160ms ease, box-shadow 160ms ease, opacity 160ms ease !important;
}
.entry-content .pmpro_btn-select:hover{ transform: translateY(-3px) !important; box-shadow: 0 18px 36px rgba(0,0,0,0.55) !important; opacity:0.98 !important; }

/* Distinguish the founder pass with a stronger accent — giving it a subtle glyph */
.entry-content #pmpro_level-3 { position: relative; }
.entry-content #pmpro_level-3::before{
  content: "FOUNDER'S PASS";
  position: absolute;
  top: -8px;
  right: 14px;
  transform: translateY(-50%);
  background: linear-gradient(180deg, rgba(var(--se-gold-rgb),1), rgba(var(--se-gold-rgb),0.92));
  color: #0D0D0D !important;
  padding: 6px 10px;
  font-weight:800 !important;
  font-size: .72rem !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 18px rgba(0,0,0,0.35) !important;
  white-space: nowrap !important;
  z-index: 40 !important;
}

/* Keep the badge hidden on small screens so it doesn't clash with stacked layout */
@media (max-width: 760px){
  .entry-content #pmpro_level-3::before{ display: none !important; }
}

/* Make mobile presentation tighter & readable */
@media (max-width: 760px){
  .entry-content .pmpro_table tbody tr.pmpro_level{ box-shadow:none; background: rgba(255,255,255,0.02) !important; padding: 12px !important; border-radius:8px !important; }
  .entry-content .pmpro_table tbody tr.pmpro_level td, .entry-content .pmpro_table tbody tr.pmpro_level th{ padding: 10px 8px !important; }
  .entry-content .pmpro_table td:last-child { text-align:center !important; }
  .entry-content .pmpro_btn-select{ width:88% !important; margin: 10px auto 0 !important; display:block !important; }
}

/* small visual polish for focus state (keyboard accessibility) */
.entry-content .pmpro_btn-select:focus{ outline: 3px solid rgba(var(--se-gold-rgb),0.18) !important; outline-offset: 2px !important; }


/* Mobile: hide nav by default and show when header has .menu-open */
@media (max-width: 768px) {
  .slowdown-header { display: block; padding-bottom: 0; overflow: visible; }
  .slowdown-header .slowdown-header-left, .slowdown-header .slowdown-header-right { display: inline-flex; justify-content: center; align-items: center; }

  /* Hide the nav buttons inside header until menu opens */
  .slowdown-nav { display: none !important; max-height: 0; overflow: hidden; transition: max-height 220ms ease, opacity 160ms ease; opacity: 0; }

  /* Hamburger visible on mobile */
  .slowdown-hamburger { display: inline-flex !important; justify-content: center; align-items: center; }

  /* When the menu is open, expand header bottom and show stacked buttons inside header */
  .slowdown-header.menu-open .slowdown-nav { display: flex !important; flex-direction: column !important; gap: 6px !important; opacity: 1 !important; max-height: 999px !important; margin-top: 8px !important; }

  /* Buttons stacked & minimal spacing — keep them inside header */
  .slowdown-nav .wp-block-button { display: block !important; width: calc(100% - 28px) !important; margin: 4px 14px !important; }

  /* show close control when open */
  .slowdown-close-wrap { display: none !important; }
  .slowdown-header.menu-open .slowdown-close-wrap { display: inline-flex !important; }

  /* keep header compact when nav hidden */
  .slowdown-header .slowdown-header-center { padding-bottom: 0 !important; }
}

.page .post-thumbnail, .page .entry-header { text-align: center; }
.page .wp-post-image { display: inline-block; float: none !important; margin-left: auto !important; margin-right: auto !important; }
.page img.attachment-darknews-featured.wp-post-image { display: block; float: none !important; margin: 0 auto !important; }
.post-thumbnail img.wp-post-image { display: block; float: none !important; margin: 0 auto !important; }
header .top-header, .darknews-header .top-header { background: none !important; }

footer .aft-small-social-menu ul li a { color: var(--se-white) !important; }
.af-main-banner-latest-posts { background: none !important; }

/* Ensure any leftover banner thumbnail column is hidden and the carousel
 * expands to use the available space. This helps if the parent theme
 * renders thumbnails in some pages/layouts we haven't overridden yet.
 */
.af-main-banner-thumb-posts,
.aft-thumb-part {
  display: none !important;
}

/* Make slider take the remaining width (desktop). Keep trending/ tabs at 25% */
.aft-main-banner-part .aft-slider-part {
  width: 75% !important;
}
.aft-main-banner-part .aft-trending-part {
  width: 25% !important;
}
.pmpro_section_title { color: var(--se-white) !important; }
.pmpro_section_title a { color: var(--se-white) !important; }
body[class*="pmpro-"] h2 { color: var(--se-white); }
/* === SECTION: PMPro (membership) — membership styles and page overrides === */
body[class*="pmpro-"] .entry-content { width: 80%; margin: 0 auto; background: none !important; }
body[class*="pmpro-"] .inner-entry-content { margin: 0 auto; }
body[class*="pmpro-"] .pmpro_card_actions { background-color: var(--se-brown) !important; padding: 8px 12px; border-radius: 4px; }
body[class*="pmpro-"] .pmpro_card_actions a { color: var(--se-white) !important; }
body[class*="pmpro-"] .pmpro_card_action_separator { color: var(--se-white) !important; }
body[class*="pmpro-"] h2.pmpro_form_heading { color: var(--se-brown) !important; }
#pmpro_btn-submit { padding: 12px 20px !important; }
body[class*="pmpro-"] .entry-content p { color: var(--sd-blood) !important; }
body[class*="pmpro-"] .pmpro p { color: var(--sd-blood) !important; }
body[class*="pmpro-"] .entry-content > p { color: var(--se-white) !important; }
body[class*="pmpro-"] .entry-content p,
body[class*="pmpro-"] .pmpro p,
body[class*="pmpro-"] p { color: var(--se-brown) !important; }
body[class*="pmpro-"] .entry-content a { color: var(--se-brown) !important; border-bottom: 2px solid var(--se-brown) !important; }
body[class*="pmpro-"] .entry-content a:hover { color: var(--se-brown) !important; border-bottom: 2px solid var(--se-brown) !important; }
body[class*="pmpro-"] .pmpro_table th { background-color: var(--se-white) !important; color: var(--se-brown) !important; }
body[class*="pmpro-"] .pmpro_table_orders th { background-color: var(--se-white) !important; color: var(--se-brown) !important; }
body[class*="pmpro-"] .pmpro_level-price { color: var(--se-brown) !important; }
body[class*="pmpro-"] .pmpro_level-price strong { color: var(--se-brown) !important; }
body[class*="pmpro-"] .pmpro_btn.pmpro_btn-outline { background-color: var(--se-white) !important; color: var(--se-brown) !important; border-color: var(--se-brown) !important; }
body[class*="pmpro-"] .pmpro_btn.pmpro_btn-outline:hover { background-color: var(--se-white) !important; color: var(--se-brown) !important; border-color: var(--se-brown) !important; }
body.page-id-1145 .pmpro_card_actions { background-color: var(--se-white) !important; }
body.page-id-1145 .pmpro_card_actions a { color: var(--se-brown) !important; }
body.page-id-1145 .pmpro_card_action_separator { color: var(--se-brown) !important; }
body[class*="pmpro-"] .entry-content, body[class*="pmpro-"] .entry-content p, body[class*="pmpro-"] .entry-content ol, body[class*="pmpro-"] .entry-content ul { font-family: 'Montserrat', sans-serif !important; font-size: 18px !important; color: var(--se-white) !important; }
body[class*="pmpro-"] .entry-content h2.wp-block-heading { font-family: 'Montserrat', sans-serif !important; color: var(--se-white) !important; }

/* === Section: Posts index child layout: post boxes (wide list) === */
.se-posts-list{ display:flex; flex-direction:column; gap:22px; max-width:1240px; margin: 22px auto; padding: 12px; box-sizing: border-box; }
.se-post-box{ background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00)); border:1px solid rgba(255,255,255,0.04); padding: 14px; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,0.35); display:block; width:100%; }

/* Grid layout for the requested 3-column module */
.se-post-inner.se-post-grid{ display: grid; grid-template-columns: 360px 1fr 220px; gap: 20px; align-items: start; }
.se-col-image{ display:block; }
.se-post-thumb-link, .se-post-thumb{ display:block; width:100%; height:100%; max-height:320px; object-fit: contain; border-radius: 12px; }
.se-post-thumb-placeholder{ width:100%; height: 180px; display:flex; align-items:center; justify-content:center; color: rgba(249,244,235,0.65); background: rgba(255,255,255,0.02); border-radius: 12px; }
.se-col-content{ display:flex; flex-direction:column; gap: 8px; }
.se-col-meta{ display:flex; flex-direction:column; gap:12px; justify-content:flex-start; align-items:flex-start; }
.se-post-meta{ color: rgba(249,244,235,0.8); font-size:0.95rem; }
.se-post-meta strong{ display:block; font-weight:700; margin-bottom:6px; }
.se-membership-status{
  /* Make the small "Access" status label visibly gold */
  background: var(--se-gold);
  color: var(--sd-obsidian); /* dark text for contrast */
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid rgba(var(--se-gold-rgb),0.18);
  display: inline-block;
  font-weight: 700;
}

/* Membership card displayed when content is gated by PMPro. Keeps a compact, readable design */
.se-membership-card{ margin-top:14px; background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01)); padding: 14px; border-radius: 10px; border: 1px solid rgba(255,255,255,0.04); box-shadow: 0 8px 28px rgba(0,0,0,0.36); color: var(--se-white); }
.se-membership-card__icon{ font-size:20px; display:inline-block; margin-right:10px; }
.se-membership-card__title{ margin:8px 0; font-size:1rem; color: var(--se-white); font-weight:700; }
.se-membership-card__text{ color: #8A1C1C !important; margin-bottom: 12px; }
.se-membership-card__cta{ display:inline-block; background: linear-gradient(180deg, rgba(var(--se-gold-rgb),1) 0%, rgba(var(--se-gold-rgb),0.92) 100%); color: var(--sd-obsidian); padding: 8px 12px; border-radius:8px; font-weight:800; text-decoration:none; margin-right:8px; }
.se-membership-card__login{ margin-top:10px; font-size:0.95rem; }
.se-membership-card__login a{ color: rgba(249,244,235,0.85); text-decoration: underline; }
.se-post-body{ flex:1 1 auto; display:flex; flex-direction:column; }
.se-post-title{ margin: 0 0 8px 0; font-size:1.35rem; }
.se-post-meta{ color: rgba(249,244,235,0.65); font-size:0.95rem; margin-bottom:10px; }
.se-post-excerpt{ color: rgba(249,244,235,0.88); margin-bottom:12px; }
.se-post-footer{ margin-top:auto; }
.se-post-readmore{ color: var(--se-gold); font-weight:700; text-decoration:none; border-bottom: 1px solid transparent; }
.se-post-readmore:hover{ border-color: rgba(var(--se-gold-rgb),0.18); }

/* Make it stacked on small screens with the image full-width and preserved (no cut) */
@media (max-width: 760px){
  .se-post-inner.se-post-grid{ grid-template-columns: 1fr; }
  .se-post-thumb-link, .se-post-thumb{ max-height: 320px; width:100%; height:auto; object-fit: contain; }
  .se-posts-list{ padding-left: 8px; padding-right: 8px; }
}

/* loader */
#se-load-more{ display:block; text-align:center; padding: 8px 0; color: rgba(249,244,235,0.85); }
.se-load-spinner{ display:inline-block; padding: 8px 12px; background: rgba(255,255,255,0.02); border-radius: 8px; border: 1px solid rgba(255,255,255,0.04); }

/* Posts page — if primary has .se-no-sidebar, expand it to full width */
#primary.se-no-sidebar{ width: 100% !important; max-width: 100% !important; float: none !important; }

/* Some parent rules float primary/secondary; ensure content fills the space */
.se-no-sidebar .site-main { width: 100% !important; }

/* Defensive: hide #secondary if it exists in markup and we asked to be no-sidebar */
#primary.se-no-sidebar + #secondary, body.page-for-posts #secondary { display: none !important; }

body[class*="pmpro-"] .entry-content p, body[class*="pmpro-"] .entry-content ol, body[class*="pmpro-"] .entry-content ul, body[class*="pmpro-"] .entry-content li { text-align: justify; font-family: 'Montserrat', sans-serif; font-size: 18px; color: var(--se-white); }
/* Fix: match the actual DOM (site-description is a direct child of .site-branding) */
.site-description { font-family: 'Montserrat', sans-serif; font-size: 18px; color: var(--se-white) !important; }
.site-branding .site-description { color: var(--se-white) !important; }

/* === SECTION: LLMS (learning) — LLMS UI & navigation styles === */
.llms-sd-nav, .llms-sd-nav .llms-sd-items { color: var(--se-white) !important; }
.llms-sd-nav .llms-sd-link, .llms-sd-nav .llms-sep { color: var(--se-white) !important; border-bottom: none !important; }
.llms-sd-nav .llms-sd-item.current .llms-sd-link { color: var(--se-white) !important; }
.llms-sd-nav select, .llms-sd-nav option { color: var(--se-white) !important; background-color: var(--se-brown) !important; }
body .llms-sd-nav .llms-sd-link:link,
body .llms-sd-nav .llms-sd-link:visited,
body .llms-sd-nav .llms-sd-link:hover,
body .llms-sd-nav .llms-sd-link:focus,
body .llms-sd-nav .llms-sd-link:active { color: var(--se-white) !important; }
body .llms-lesson-link,
body .llms-lesson-link:link,
body .llms-lesson-link:visited,
body .llms-lesson-link:hover,
body .llms-lesson-link:focus,
body .llms-lesson-link:active { color: var(--se-white) !important; border-bottom: none !important; }
body .llms-loop-item-content a,
body .llms-loop-item-content a:link,
body .llms-loop-item-content a:visited,
body .llms-loop-item-content a:hover,
body .llms-loop-item-content a:focus,
body .llms-loop-item-content a:active { color: var(--se-white) !important; }
body .llms-sd-nav .llms-sd-items .llms-sd-item .llms-sd-link { color: var(--se-white) !important; }
body .llms-sd-nav .llms-sd-items .llms-sd-item .llms-sd-link:hover { color: var(--se-white) !important; }
body .llms-loop-item .llms-loop-item-content .llms-lesson-link { color: var(--se-white) !important; }
body .llms-loop-item .llms-loop-item-content .llms-lesson-link:hover { color: var(--se-white) !important; }
body[class*="pmpro-"] .entry-content .llms-loop-item-content a { color: var(--se-white) !important; }
body[class*="pmpro-"] .entry-content a.llms-lesson-link,
body[class*="pmpro-"] .entry-content a.llms-lesson-link:link,
body[class*="pmpro-"] .entry-content a.llms-lesson-link:visited,
body[class*="pmpro-"] .entry-content a.llms-lesson-link:hover,
body[class*="pmpro-"] .entry-content a.llms-lesson-link:focus,
body[class*="pmpro-"] .entry-content a.llms-lesson-link:active { color: var(--se-white) !important; }
body .llms-lesson-link { background: none !important; background-color: transparent !important; }
body .llms-lesson-link::before, body .llms-lesson-link::after { background: none !important; }
body .llms-lesson-link .llms-lesson-preview-row,
body .llms-lesson-link .llms-main,
body .llms-lesson-link .llms-pre-text,
body .llms-lesson-link .llms-lesson-title { background: none !important; background-color: transparent !important; box-shadow: none !important; border: none !important; }
body .llms-lesson-link:hover,
body .llms-lesson-link:focus,
body .llms-lesson-link:active { background: none !important; background-color: transparent !important; }
body .llms-lesson-link * { background: none !important; background-color: transparent !important; box-shadow: none !important; border: none !important; }
body .llms-lesson-link *::before,
body .llms-lesson-link *::after { background: none !important; }
body .entry-content.read-details { background: none !important; color: var(--se-white) !important; }
body .entry-content.read-details a { color: var(--se-white) !important; }
body .llms-favorite-wrapper, body .llms-favorites-count, body .llms-favorite-btn, body .llms-heart-btn { color: var(--se-white) !important; }
body .llms-video-wrapper, body .llms-video-wrapper .center-video { background: none !important; }
body .llms-lesson-button-wrapper .llms-button-primary { background: none !important; color: var(--se-white) !important; border: 1px solid var(--se-white) !important; margin-top: 20px !important; }
body .llms-course-navigation, body .llms-course-navigation .llms-course-nav, body .llms-lesson-preview, body .llms-lesson-preview.is-incomplete { background: none !important; color: var(--se-white) !important; box-shadow: none !important; border: none !important; }
body .llms-lesson-preview section, body .llms-lesson-preview .llms-lesson-meta { background: none !important; color: var(--se-white) !important; }
body .llms-lesson-title, body .llms-pre-text { color: var(--se-white) !important; }
body .llms-course-navigation a.llms-lesson-link { color: var(--se-white) !important; }
body .llms-parent-course-link, body .llms-parent-course-link a { color: var(--se-white) !important; }
body .post-navigation .nav-links a { color: var(--se-white) !important; }

/* -----------------------------------------------------------------
   LLMS & Courses / Lessons — hide feature-post widgets, style titles
   - Hide the "featured post" widgets when they appear inside course
     or lesson templates / lists so the feature post doesn't show.
   - Make course / lesson titles centered, larger and gold (H1-like).
----------------------------------------------------------------- */
/* Hide featured-post widget areas when encountered in LLMS/course/lesson contexts */
body .llms-lesson-preview .featured-post-items-wrap,
body .llms-lesson-link .featured-post-items-wrap,
body .llms-lesson-preview .aft-featured-category-section,
body .llms-lesson-link .aft-featured-category-section,
body.post-type-lesson .featured-post-items-wrap,
body.post-type-course .featured-post-items-wrap,
body.post-type-lesson .aft-featured-category-section,
body.post-type-course .aft-featured-category-section,
body[class*="llms"] .featured-post-items-wrap,
body[class*="llms"] .aft-featured-category-section{
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Make lesson/course headings appear like centered, large H1s in the learning UI */
body .llms-lesson-title,
body .llms-course-title,
body .llms-lesson .entry-title,
body .llms-course .entry-title,
body .llms-single-lesson h1.entry-title,
body .llms-single-course h1.entry-title{
  text-align: center !important;
  color: var(--se-gold) !important; /* gold heading */
  font-size: clamp(2.2rem, 6vw, 4rem) !important; /* H1-like sizing */
  line-height: 1.04 !important;
  font-weight: 900 !important;
  margin: 0 auto 18px !important;
  letter-spacing: .01em !important;
}

/* Small screens: slightly smaller but still prominent */
@media (max-width: 640px){
  body .llms-lesson-title,
  body .llms-course-title,
  body .llms-lesson .entry-title,
  body .llms-course .entry-title { font-size: clamp(1.6rem, 8vw, 2.4rem) !important; }
}

/* Global: unify yellow to brand gold */

.has-white-color{color:var(--se-white)!important}.has-white-background-color{background-color:var(--se-white)!important}
.has-black-color{color:var(--se-brown)!important}.has-black-background-color{background-color:var(--se-brown)!important}
.has-vivid-green-cyan-color{color:var(--se-gold)!important}.has-vivid-green-cyan-background-color{background-color:var(--se-gold)!important}
.has-luminous-vivid-amber-color{color:var(--se-gold)!important}.has-luminous-vivid-amber-background-color{background-color:var(--se-gold)!important}
.has-luminous-vivid-orange-color{color:var(--se-gold)!important}.has-luminous-vivid-orange-background-color{background-color:var(--se-gold)!important}
.has-cyan-bluish-gray-color{color:var(--se-link)!important}.has-cyan-bluish-gray-background-color{background-color:var(--se-link)!important}

/* === SECTION: Buttons & Controls — button styles and hover states === */
.wp-block-button__link, .wp-element-button{background-color:var(--se-gold)!important;color:var(--se-brown)!important;border:1px solid var(--se-brown)!important;border-radius:8px;padding:8px 16px;position:relative;display:inline-block}
.wp-block-button__link::before, .wp-element-button::before{content:"";position:absolute;inset:2px;border:1px solid var(--se-brown);border-radius:6px;pointer-events:none}
.wp-block-button__link:hover, .wp-element-button:hover{filter:brightness(1.05)}

/* footer credit: hide anchor content for compatibility (avoid :has pseudo) */
footer .wp-block-group p.has-small-font-size a[href*="wordpress.org"] { display: none; }

/* === SECTION: Brand / Variables (Shamanic Ether & Slow Down palettes) === */

/* Hero subtitle under main title on page 1401 */

/* Page 1401 hero content: subtitle, paragraph, button label, footnote */
/* Brand system and heading cleanup */
:root{
  /* Shamanic Ether brand */
  --se-white: #F9F4EB;
  --se-brown: #5D4037;
  --se-gold: #C5A059; /* unified Zion Gold */
  --se-gold-rgb: 197,160,89;
  --se-link: #798C7A;

  /* Slow Down page palette (matches se-gold where requested) */
  --sd-obsidian: #0D0D0D; /* background */
  --sd-blood: #8A1C1C; /* primary line */
  --sd-zion: #C5A059; /* highlights / Zion Gold */
  --sd-forest: #1B3F2F; /* shadows */
  --sd-glitch: #00FFFF; /* accent spark */

  /* Brand helper colors (kept here so primary palette is centralized) */
  --brand-primary: #0d9488;
  --brand-text: #0b3b37;
  --brand-yellow: #f59e0b;
  --social-facebook: var(--social-facebook);
}
:root{--wp--preset--color--white:var(--se-white);--wp--preset--color--black:var(--se-brown);--wp--preset--color--cyan-bluish-gray:var(--se-link);--wp--preset--color--luminous-vivid-amber:var(--se-gold);--wp--preset--color--luminous-vivid-orange:var(--se-gold)}
body,.entry-content{font-family:'Montserrat',sans-serif}

/* === CUSTOM: Smaller left-aligned logo === */
/* Force the site logo to a consistent size (150px wide) and align it to the left
   so the child theme can override parent styles that centered the logo. */
.custom-logo {
  width: 150px !important; /* explicit pixel width requested */
  max-width: 150px !important;
  height: auto !important;
  object-fit: contain !important;
}

/* Make the small site description match the brand gold */
.site-branding .site-description,
.site-description {
  color: var(--se-gold) !important;
  opacity: 1 !important; /* ensure it isn't visually dimmed by inheritance */
}

/* === CUSTOM: Place title + description inline next to logo === */
/* Use a grid so the logo sits left and title+subtitle stack on the right column */
.site-branding {
  display: grid !important;
  grid-template-columns: auto 1fr !important; /* logo | (title + subtitle) */
  align-items: center !important;
  gap: 12px !important;
}

.site-branding .custom-logo-link { display: block; }
.site-title, .site-branding .site-description { display: block !important; margin: 0 !important; vertical-align: baseline; }

/* Tune sizes and spacing so title + description sit on one line */
.site-title .site-title-anchor {
  font-size: clamp(20px, 2.8vw, 34px) !important; /* scales between mobile and desktop */
  font-weight: 700 !important;
  margin: 0 0 2px 0 !important;
  line-height: 1 !important;
  letter-spacing: 0.03em !important;
  color: var(--se-white) !important; /* Title should be white per request */
  text-transform: uppercase !important;
}

.site-branding .site-description {
  grid-column: 2 !important; /* ensure description sits in the right column */
  font-size: 14px !important;
  font-weight: 500 !important;
  margin: 0 !important;
  margin-top: 2px !important;
  opacity: 1 !important;
  color: var(--se-white) !important; /* make subtitle white */
}

/* Ensure the title also sits in the right column and stacks above the subtitle */
.site-title { grid-column: 2 !important; margin: 0 !important; }
.site-title .site-title-anchor { display: block; margin: 0 0 2px 0 !important; line-height: 1 !important; }

/* If there isn't enough horizontal space, collapse into stacked layout on narrow viewports */
@media (max-width: 820px) {
  /* collapse to stacked layout on smaller screens: keep title + subtitle centered.
    SHOW logo on small screens (user wanted logo back) and center everything.
    Hide the mobile toggle/menu control on small tablets & phones (<=990px) below.
  */
  .site-branding { display: block !important; text-align: center !important; }
  /* ensure the custom logo/link is visible and centered */
  .site-branding .custom-logo-link,
  .site-branding .custom-logo { display: block !important; margin-left: auto !important; margin-right: auto !important; }
  .site-title .site-title-anchor { display: block !important; font-size: clamp(18px, 3.4vw, 28px) !important; color: var(--se-white) !important; }
  .site-branding .site-description { display: block !important; margin-top: 4px !important; color: var(--se-white) !important; font-size: 0.95rem !important; opacity: 0.95 !important; }

  /* tighten title/subtitle spacing on large header layout */
  @media (min-width: 991px){
    .header-layout-default .af-middle-container .logo .site-title .site-title-anchor { margin-bottom: 2px !important; }
    .header-layout-default .af-middle-container .logo .site-branding .site-description { margin-top: 2px !important; }
  }
}

/* Align header logo containers to the left where parent theme centered them */
.header-layout-default .af-middle-container .logo,
.header-layout-centered .logo,
.header-layout-default .logo {
  text-align: left !important;
}

/* If parent layout uses flex centering, ensure the middle container left-justifies children */
.header-layout-default .af-middle-container {
  justify-content: flex-start !important;
}

/* === CUSTOM: Reduce header banner size and keep it right-aligned === */
/* Shrink the header-promotion column so the banner (hero image/promo) is smaller */
.header-layout-default .af-middle-container .header-promotion {
  width: 30% !important; /* default to a smaller banner column */
  padding-right: 10px !important;
  text-align: right !important;
}

/* -----------------------------------------------------------------
   Header centering + gold CTA + lock color
   - center logo + header-promotion and ensure site-title/site-description
   - add a gold CTA variant used across header/slowdown CTAs
   - color lock icons (feather-lock) with the same gold
----------------------------------------------------------------- */
.header-layout-default .af-middle-container { justify-content: center !important; }
.header-layout-default .af-middle-container .logo { text-align: center !important; display:flex; flex-direction:column; align-items:center; }
.header-layout-default .af-middle-container .logo .site-title, .header-layout-default .af-middle-container .logo .site-description{ text-align:center !important; }
.header-layout-default .af-middle-container .header-promotion{ display:flex; align-items:center; justify-content:center; }

/* Desktop: restore left / center / right layout to avoid overlapping hero text */
@media (min-width: 991px){
  .header-layout-default .af-middle-container { justify-content: space-between !important; }
  .header-layout-default .af-middle-container .logo { text-align: left !important; flex-direction: row !important; align-items: center !important; gap: 12px; }
  .header-layout-default .af-middle-container .logo .site-title, .header-layout-default .af-middle-container .logo .site-description{ text-align:left !important; }
  .header-layout-default .af-middle-container .header-promotion{ justify-content: flex-end !important; }
}

/* Make CTAs sit centered where appropriate, and add a gold style variant */
.af-middle-container .wp-block-button__link,
.slowdown-cta-button .wp-block-button__link,
.slowdown-nav-begin .wp-block-button__link,
.slowdown-join-buttons .wp-block-button__link,
.se-testimonials-cta .se-cta{
  display:inline-block; /* keep natural size */
  margin: 0 auto !important; /* ensure centered when inside a flex/centered container */
  background: linear-gradient(180deg, rgba(var(--se-gold-rgb),1) 0%, rgba(var(--se-gold-rgb),0.95) 100%) !important;
  border: 2px solid rgba(var(--se-gold-rgb),0.95) !important;
  color: var(--sd-obsidian) !important;
  padding: .8rem 1.2rem !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  letter-spacing: .02em !important;
  box-shadow: 0 10px 30px rgba(var(--se-gold-rgb),0.16) !important;
}

/* Hover/focus states for gold CTA */
.af-middle-container .wp-block-button__link:hover,
.slowdown-cta-button .wp-block-button__link:hover,
.slowdown-nav-begin .wp-block-button__link:hover,
.se-testimonials-cta .se-cta:hover { filter:brightness(0.98); transform: translateY(-1px); }

/* Center lock icons and make the lock stroke the brand gold */
svg.feather.feather-lock, .feather-lock { stroke: rgba(var(--se-gold-rgb),1) !important; color: rgba(var(--se-gold-rgb),1) !important; }

/* When lock SVGs appear inline next to text (eg. CTA or price) center them */
.se-price-card-center .se-price-icon svg,
.wp-block-button .feather-lock,
.llms-lesson-button-wrapper .feather-lock { vertical-align: middle; display:inline-block; margin-right:8px; stroke-width:2.2; }

@media (max-width: 640px){
  .af-middle-container { padding-left:12px; padding-right:12px; }
  .af-middle-container .site-title { font-size: 1.0rem; }
  .af-middle-container .wp-block-button__link { padding: .6rem 1rem !important; }
}

/* Limit images inside the header promotion so the visual banner isn't oversized */
.header-promotion img, .header-promotion .banner-promotions-wrapper img {
  max-width: 200px !important;
  height: auto !important;
  display: inline-block !important;
}

/* For very narrow screens keep banner full width but center it below the logo */
@media (max-width: 990px) {
  .header-layout-default .af-middle-container .header-promotion {
    width: 100% !important;
    text-align: center !important;
    padding: 10px 0 0 !important;
  }

  /* Center header logo/title/subtitle on mobile so the hero looks balanced */
  .site-branding { text-align: center !important; }
  .custom-logo-link { display: block; margin-left: auto !important; margin-right: auto !important; }
  /* HIDE the hamburger/mobile toggle/menu control on small tablets + phones (user request) */
  .toggle-menu, .offcanvas, .offcanvas-nav, .offcanvas-menu, .offcanvas-nav .offcanvas-menu { display: none !important; }
  /* Ensure the middle header container centers its children at small widths so the logo and text align together */
  .header-layout-default .af-middle-container { justify-content: center !important; }
  .header-layout-default .af-middle-container .logo { text-align: center !important; }
  .site-title .site-title-anchor { text-align: center !important; }
  .site-branding .site-description { display: block !important; margin-top: 6px !important; color: var(--se-white) !important; text-align: center !important; }
}

/* === CUSTOM: reduce header background image so it fits with logo/title === */
.af-middle-header.af-header-image.data-bg {
  /* show the right-side graphic at a reduced, consistent size */
  background-repeat: no-repeat !important;
  background-position: calc(100% - 24px) center !important; /* slight inset from the edge */
  background-size: auto 220px !important; /* scale image by height so it won't overwhelm header */
  padding-top: 20px !important; /* reduce header height slightly */
  padding-bottom: 20px !important;
}

/* Slightly smaller on medium screens */
@media (max-width: 1200px) {
  .af-middle-header.af-header-image.data-bg { background-size: auto 180px !important; }
}

/* On small screens hide the background graphic (prevents overlap) and keep the header compact */
@media (max-width: 990px) {
  .af-middle-header.af-header-image.data-bg { background-image: none !important; padding-top: 18px !important; padding-bottom: 18px !important; }
}

/* On very small screens keep logo slightly smaller to avoid crowding */
@media (max-width: 420px) {
  .custom-logo { width: 120px !important; max-width: 120px !important; }
}

/* === CUSTOM: Mobile handling for trending column (right column in main banner) ===
   User wants the trending column hidden on mobile or at least shown under the first (main) column.
   Strategy: For tablet/mobile widths we'll stack columns and set the trending column to 100% width
   so it sits under the main (slider) column. For very narrow screens (<=420px) we'll hide the
   trending column to avoid long vertical stacked lists that interfere with layout.
*/
@media (max-width: 820px) {
  /* stack the main banner parts so each column becomes full-width */
  .aft-main-banner-part { flex-direction: column !important; }

  /* main slider / left content should come first */
  .aft-main-banner-part .aft-slider-part { order: 1 !important; width: 100% !important; }

  /* trending (right) column should follow the slider and expand full width */
  .aft-main-banner-part .aft-trending-part { order: 2 !important; width: 100% !important; padding-top: 10px !important; }

  /* make sure the internals (images/titles) are readable in stacked layout */
  .aft-trending-part .article-item li .read-img { margin: 0 0 12px 0 !important; float: none !important; display: block !important; }
  .aft-trending-part .read-details { float: none !important; width: auto !important; }
}

/* If you'd rather hide the trending column on narrow phones entirely */
@media (max-width: 420px) {
  .aft-main-banner-part .aft-trending-part { display: none !important; }
}

/* Show full images (no cropped thumbnails) inside read-bg-img containers
   - Make the container auto height where possible and allow the <img> to scale
     to its natural aspect while fitting within the column width.
   - This ensures the full picture is visible rather than cropped by a fixed
     height + overflow:hidden container.
*/
.read-img.read-bg-img {
  height: auto !important;
  overflow: visible !important;
}

.read-img.read-bg-img img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important; /* graceful if any sizing remains */
}

/* === CUSTOM: center category + golden badge === */
/* Center category label on image cards and render the category as a gold pill/badge */
/* Move category/badge below image and center it (avoid overlay) */
.read-img .read-categories,
.af-cat-widget-carousel .read-categories,
.af-main-banner-thumb-posts .read-categories,
.af-banner-carousel .read-categories {
  position: static !important; /* place in flow below image */
  left: auto !important;
  transform: none !important;
  bottom: auto !important;
  z-index: auto !important;
  text-align: center !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  /* overlap the badge slightly to sit flush with the image — small negative top margin */
  margin: -16px 0 0 !important; /* stronger overlap on larger screens */
  pointer-events: auto !important; /* ensure categories remain clickable */
}

/* style the category as a centered gold pill, with dark text for contrast */
.read-categories a, .read-categories span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: var(--se-gold) !important; /* golden badge */
  color: #0D0D0D !important; /* dark text inside badge requested */
  padding: 6px 12px !important;
  border-radius: 999px !important; /* pill */
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.18) !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  text-decoration: none !important;
}

/* Hover/focus state for badge — keep legible against the gold background */
.read-categories a:hover,
.read-categories a:focus,
.read-categories a:active,
.read-categories a:visited,
.read-categories span:hover,
.read-categories span:focus,
.read-categories span:active,
.read-categories span:visited {
  color: #798C7A !important; /* requested hover color */
  background: var(--se-gold) !important; /* ensure badge stays golden across states */
  text-decoration: none !important;
}

/* remove the decorative dot that previously appeared inside the badge to keep it clean */
.read-categories a::before,
.read-categories span::before { content: none !important; }

/* ensure small widths don't overflow and keep badge readable */
@media (max-width: 420px) {
  .read-categories a, .read-categories span { font-size: 0.8rem !important; padding: 5px 10px !important; }
  /* Avoid overlapping on small screens — reset the negative margin so badge sits directly below image */
  .read-img .read-categories,
  .af-cat-widget-carousel .read-categories,
  .af-main-banner-thumb-posts .read-categories,
  .af-banner-carousel .read-categories { margin: 0 !important; }
}

/* Slightly larger small devices: prevent excessive overlap on tablets/phones */
@media (max-width: 600px) {
  .read-img .read-categories,
  .af-cat-widget-carousel .read-categories,
  .af-main-banner-thumb-posts .read-categories,
  .af-banner-carousel .read-categories { margin: 0 !important; }
}

/* === CUSTOM: move all slider/banner overlay content under the image/slider === */
/* force read-details (titles/meta) to be placed below slider images instead of overlaying */
.af-banner-carousel.common-carousel .read-details,
.banner-single-slider-1 .read-details,
.read-single-overbanner .read-details,
.grid-design-texts-over-image .read-details,
.af-post-slider .read-details,
.af-post-carousel .read-details,
.af-main-banner-thumb-posts .af-sec-post .read-details,
.aft-main-banner-part .aft-slider-part .read-details,
.aft-main-banner-part .read-details,
.af-banner-carousel .read-single .read-details {
  position: static !important;
  width: 100% !important;
  margin-top: 0 !important; /* remove extra space above details/badge */
  padding: 6px 0 !important;
  /* Also remove any padding the image wrapper might add so the badge is flush */
  /* (moved into a separate top-level rule below) */
  transform: none !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: auto !important;
  background: transparent !important; /* remove overlay background */
  color: inherit !important;
  text-align: center !important;
  display: block !important;
}

/* ensure the image wrapper doesn't add bottom padding in slider/banner contexts */
.af-banner-carousel.common-carousel .read-img,
.banner-single-slider-1 .read-img,
.read-single-overbanner .read-img,
.grid-design-texts-over-image .read-img,
.af-post-slider .read-img,
.af-post-carousel .read-img,
.af-main-banner-thumb-posts .af-sec-post .read-img,
.aft-main-banner-part .aft-slider-part .read-img,
.aft-main-banner-part .read-img,
.af-banner-carousel .read-single .read-img {
  padding-bottom: 0 !important;
}

/* ensure title and meta stack and center when moved out */
.af-banner-carousel .read-details .read-title,
.af-banner-carousel .read-details .entry-meta,
.banner-single-slider-1 .read-details .read-title,
.banner-single-slider-1 .read-details .entry-meta,
.read-single-overbanner .read-details .read-title,
.read-single-overbanner .read-details .entry-meta {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  margin: 0 auto !important;
}

/* reduce any absolute-positioned offsets on titles/meta */
.af-banner-carousel .read-title h4,
.banner-single-slider-1 .read-title h4,
.read-single-overbanner .read-title h4 {
  margin: 6px 0 4px !important;
}

/* ensure meta items are clearly under the title */
.af-banner-carousel .read-details .entry-meta,
.banner-single-slider-1 .read-details .entry-meta,
.read-single-overbanner .read-details .entry-meta {
  margin-top: 6px !important;
  display: block !important;
}

/* make sure thumbnails / slider spacing is preserved */
.af-banner-carousel .read-img, .aft-main-banner-part .read-img { display: block !important; }

/* Keep small thumbnail grid rules intact but don't force cropping */
.aft-main-banner-thumb-posts .read-img.read-bg-img,
.af-main-banner-tabbed-posts .read-img.read-bg-img,
.aft-trending-part .read-img.read-bg-img {
  height: auto !important;
}

/* === GLOBAL: Link hover color (keep default color unchanged; change ONLY on hover/focus/active) === */
/* Ensure hover/active/focus for *all* anchor links across the site show the brand gold */
a:hover, a:focus, a:active,
a:visited:hover, a:visited:focus, a:visited:active,
.entry-content a:hover, .entry-content a:focus, .entry-content a:active,
body a:hover, body a:focus, body a:active {
  color: var(--se-gold) !important;
}

/* Remove theme accents on headings */
.wp-block-heading,
.wp-block-heading.has-text-color,
.wp-block-heading.has-luminous-vivid-amber-color,
h1.wp-block-heading{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  outline:0!important;
  text-decoration:none!important;
}
.wp-block-heading::before,
.wp-block-heading::after{content:none!important;display:none!important}

/* Map utility classes to brand colors */
.has-white-color{color:var(--se-white)!important}
.has-white-background-color{background-color:var(--se-white)!important}
.has-black-color{color:var(--se-brown)!important}
.has-black-background-color{background-color:var(--se-brown)!important}
.has-luminous-vivid-amber-color{color:var(--se-gold)!important}
.has-luminous-vivid-amber-background-color{background-color:var(--se-gold)!important}
.has-cyan-bluish-gray-color{color:var(--se-link)!important}
.has-cyan-bluish-gray-background-color{background-color:var(--se-link)!important}
.entry-content a, body a{color:var(--se-link)!important}
/* Facebook share button */
.se-share-btn{display:block;width:calc(100% - 40px);max-width:100%;box-sizing:border-box;text-align:center;padding:12px 16px;background:transparent;border:1px solid var(--se-gold);border-radius:6px;color:var(--se-brown);font-family:'Montserrat',sans-serif;text-decoration:none;transition:all .2s ease;margin:20px}
.se-share-btn:hover{background:var(--social-facebook);color:var(--se-white)}
/* === SECTION: Global — Tabs/Navigation (visual cleanup) === */
/* Global tabs background removal */
ul.nav.nav-tabs.af-tabs.tab-warpper,
.nav.nav-tabs.af-tabs.tab-warpper,
.af-tabs.tab-warpper {
  background: transparent !important;
  background-color: transparent !important;
}
.nav-tabs > li > a,
.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus,
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus,
.af-tabs .tab a,
.af-tabs .tab a.active {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}
/* Global tabs bottom border removal */
ul.nav.nav-tabs.af-tabs.tab-warpper,
.nav.nav-tabs.af-tabs.tab-warpper,
.af-tabs.tab-warpper,
.nav-tabs {
  border-bottom: none !important;
}
.nav-tabs > li > a,
.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus,
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus,
.af-tabs .tab a,
.af-tabs .tab a.active {
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  outline: none !important;
}
.nav-tabs > li > a::after,
.af-tabs .tab a::after {
  border-bottom: none !important;
  background: none !important;
  content: none !important;
}

/* === Page: Slow Down (page-id-1632) — consolidated page styles === */
/* --- Slowdown: block-level & background helpers (.slowdown-*, .slowdown-bg-overlay) --- */
.slowdown-page{position:relative}
.slowdown-bg-overlay{display:block;position:fixed;inset:0;pointer-events:none;z-index:0}
.slowdown-bg-overlay::before{content:"";position:absolute;inset:0;opacity:.10;background-image:radial-gradient(circle, rgb(var(--se-gold-rgb)) 1px, transparent 1px);background-size:24px 24px}
.slowdown-cover{min-height:100vh}
.slowdown-cover .wp-block-cover__image-background{object-fit:cover}
.slowdown-cover .wp-block-cover__inner-container{position:relative;z-index:1;max-width:min(98vw, 1600px);margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px}

/* --- Slowdown: header (.slowdown-header, .slowdown-logo, .slowdown-title, .slowdown-nav) --- */
.page-id-1632 .wp-block-cover__inner-container{max-width:min(98vw, 1600px)!important;margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px}
.page-id-1632 .wp-block-group.slowdown-page > .wp-block-cover__inner-container > .wp-block-group{max-width:inherit!important;width:100%!important}
.slowdown-header{background:rgba(13,13,13,.5);color:var(--se-white);border-bottom:1px solid rgba(var(--se-gold-rgb),.2);border-radius:14px;margin:6px auto;padding:10px 18px;display:flex;align-items:flex-start!important;justify-content:space-between;gap:12px;position:sticky;top:var(--se-adminbar-offset,0);z-index:50;backdrop-filter:none}
.slowdown-logo{height:68px;width:auto}
.slowdown-title{color:var(--se-gold);margin:6px 0 0 0;letter-spacing:.08em}
.slowdown-right-brand{color:var(--se-white);margin:6px 0 0 0;letter-spacing:.08em}
.slowdown-nav .wp-block-button__link{background:transparent;color:var(--sd-obsidian) !important;border:1px solid var(--se-gold)!important;border-radius:6px;padding:6px 12px}
.slowdown-nav-begin .wp-block-button__link{background:transparent;color:var(--se-brown)!important;border:1px solid var(--se-gold)!important;background-color:var(--se-gold)!important}
.slowdown-logo{height:48px;width:auto}
.slowdown-title{color:var(--se-gold);margin:6px 0 0 0;letter-spacing:.08em}
.slowdown-right-brand{color:var(--se-white);margin:6px 0 0 0;letter-spacing:.08em}
.slowdown-nav .wp-block-button__link{background:transparent;color:var(--sd-obsidian) !important;border:1px solid var(--se-gold)!important;border-radius:6px;padding:6px 12px}
.slowdown-nav-begin .wp-block-button__link{background:transparent;color:var(--sd-obsidian) !important;border:1px solid var(--se-gold)!important;background-color:var(--se-gold)!important}
.slowdown-hero{padding:60px 16px;text-align:center;position:relative;z-index:1}

/* --- Slowdown: hero (.slowdown-hero, .slowdown-headline, .slowdown-lead, .slowdown-cta) --- */
.slowdown-cta .wp-block-button__link{background:transparent;color:var(--se-white)!important;border:1px solid var(--se-gold)!important;border-radius:6px;padding:10px 16px}
.slowdown-headline{white-space:normal;overflow-wrap:break-word;word-break:normal;hyphens:auto;letter-spacing:.01em;text-transform:uppercase;text-align:center;margin:0 16px;color:var(--se-white)}
.slowdown-headline .slowdown-gold{color:var(--se-gold)}
.slowdown-lead{color:var(--se-white);margin-top:12px}
.slowdown-lead-accent{color:var(--se-white);opacity:.85;margin-top:4px}
/* Improve mobile sizing for the hero headline */
@media (max-width:768px){
  /* Smaller scaling on tablet / small desktop so headline doesn't overwhelm */
  .page-id-1632 h1.slowdown-headline,
  .page-id-1632 h2.slowdown-headline,
  .page-id-1632 .wp-block-heading.slowdown-headline,
  .slowdown-headline {
    font-size: clamp(30px, 8.5vw, 44px) !important;
    line-height: 1.12 !important;
    letter-spacing: .005em !important;
    margin: 0 12px !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
  }
  .slowdown-logo{height:56px}
}

@media (max-width:480px){
  /* Tighten the headline for phones: a smaller clamp and slightly taller lines */
  .page-id-1632 h1.slowdown-headline,
  .page-id-1632 h2.slowdown-headline,
  .page-id-1632 .wp-block-heading.slowdown-headline,
  .slowdown-headline {
    font-size: clamp(22px, 7.5vw, 34px) !important;
    line-height: 1.08 !important;
    letter-spacing: .002em !important;
    margin: 0 10px !important;
  }
  .slowdown-logo{height:48px}
}

.admin-bar #wpadminbar{position:fixed;z-index:100000;height:32px;line-height:32px}
@media (max-width:782px){.admin-bar #wpadminbar{height:46px;line-height:46px}}
.admin-bar .slowdown-page{margin-top:32px}
@media (max-width:782px){.admin-bar .slowdown-page{margin-top:46px}}

/* --- Slowdown: inner sections (se-*, .slowdown-section, values, protocol, guide, keeper) --- */
.slowdown-section{position:relative;z-index:1;padding:40px 16px}
.slowdown-section-title{color:var(--se-white);text-transform:uppercase;letter-spacing:.06em;text-align:center;margin-bottom:12px}
.slowdown-section-lead{color:var(--se-white);text-align:center;margin-bottom:20px}
.slowdown-columns{gap:24px}
.slowdown-list{color:var(--se-white);max-width:720px;margin:0 auto;padding-left:20px}
.slowdown-media-text p{color:var(--se-white)}
.slowdown-join-buttons .wp-block-button__link{background:transparent;color:var(--se-white)!important;border:1px solid var(--se-gold)!important;border-radius:6px;padding:10px 16px}

/* Guide: card image styles (page-id-1632) */
/* On narrow viewports we keep the image width-first (height:auto) so the cards stack nicely.
   On larger screens we prefer the image to fill the card height while preserving aspect ratio
   (height:100%, width:auto + object-fit:contain). This prevents images being clipped while
   staying responsive. */
.page-id-1632 #guide .grid > div > div .se-guide-card-image{
  width:100%;
  height:auto !important; /* default for mobile */
  max-height:none !important; /* don't enforce cropping */
  display:block !important;
  object-fit:contain !important; /* show full image rather than cropping */
  border-radius:10px;
  margin-left:auto;
  margin-right:auto;
}

@media (min-width: 769px) {
  /* Desktop/tablet: show the full artwork centered inside the tile.
     For square art we limit both width and height so the full image fits
     and remains centered — this keeps the title & caption centered below. */
  .page-id-1632 #guide .grid > div > div .se-guide-figure,
  .page-id-1632 #guide .grid > div > div picture{
    display:flex; /* stack image + caption */
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px;
    height:100%;
  }

  .page-id-1632 #guide .grid > div > div .se-guide-card-image,
  .page-id-1632 #guide .grid > div > div picture img {
    display:block !important;
    width: auto !important;      /* let the image use its natural width */
    max-width: 320px !important; /* constrain so it sits nicely inside the card */
    height: auto !important;     /* preserve aspect ratio */
    max-height: 320px !important;/* ensure it fits vertically for square art */
    object-fit: contain !important;
    margin: 0 auto !important;   /* center horizontally */
  }
}

@media (max-width:480px){
  .page-id-1632 #guide .grid > div > div .se-guide-card-image{ max-height:280px; }
}

/* When the guide cards stack (tablet & mobile) center the cards and
   constrain the inner card width so images don't hug the full page width. */
@media (max-width: 768px){
  .page-id-1632 #guide .grid { display:flex; flex-direction:column; gap:1rem; align-items:center; }
  .page-id-1632 #guide .grid > div { width:100%; display:flex; justify-content:center; }
  .page-id-1632 #guide .grid > div > div { width:100%; max-width:720px; }
  .page-id-1632 #guide .grid > div > div .se-guide-card-image{ max-width:640px; }
}

  /* Figure & caption styles for the guide cards */
  .page-id-1632 #guide .se-guide-figure{ display:block; width:100%; }
  .page-id-1632 #guide .se-guide-figure picture{ display:block; width:100%; }
  .page-id-1632 #guide .se-guide-caption{ text-align:center; margin-top:12px; color:var(--se-white); max-width:88%; margin-left:auto; margin-right:auto; }
  .page-id-1632 #guide .se-guide-caption .se-guide-caption-title{ font-family: Montserrat, sans-serif; font-weight:800; font-size:1.125rem; margin:0; color:var(--se-white); }
  .page-id-1632 #guide .se-guide-caption .se-guide-caption-sub{ font-family: 'Roboto Mono', monospace; font-size:.95rem; color:var(--se-gold); margin:4px 0 0 0; opacity:.95 }

  @media (max-width:768px){
    .page-id-1632 #guide .se-guide-caption { max-width:92%; }
    .page-id-1632 #guide .se-guide-caption .se-guide-caption-title { font-size:1rem; }
    .page-id-1632 #guide .se-guide-caption .se-guide-caption-sub { font-size:.9rem; }
  }

/* Strong override: make caption titles brand-white and centered (override generic #guide h3) */
.page-id-1632 #guide .se-guide-caption .se-guide-caption-title{
  color: var(--se-white) !important;
  text-align: center !important;
}

body.page-id-1632 h1.entry-title { white-space: normal; overflow-wrap: break-word; word-break: normal; hyphens: auto; letter-spacing: .02em; text-transform: uppercase; }
@media only screen and (max-width: 640px) { body.page-id-1632 h1.entry-title { font-size: clamp(24px, 7vw, 32px); line-height: 1.1; } }
@media only screen and (max-width: 375px) { body.page-id-1632 h1.entry-title { font-size: 22px; line-height: 1.15; } }

body.page-id-1632 h1.slowdown-headline { white-space: normal; overflow-wrap: break-word; word-break: normal; hyphens: auto; letter-spacing: .01em; text-transform: uppercase; text-align: center; margin: 0 16px; }
@media only screen and (max-width: 640px) { body.page-id-1632 h1.slowdown-headline { font-size: clamp(24px, 8vw, 34px); line-height: 1.15; } }
@media only screen and (max-width: 375px) { body.page-id-1632 h1.slowdown-headline { font-size: 22px; line-height: 1.2; } }
body.page-id-1632 h1.slowdown-headline .slowdown-gold { display: inline; }
/* Scope read-details visibility */

/* Hide only in carousel grid overlay card */
/* Ensure visible in tabbed list and double-column list */
.article-tabbed-list .af-sec-post .pad.read-details.color-tp-pad,
.af-double-column.list-style 
/* Center images inside read-img/read-bg-img */
.read-img.read-bg-img{ display:flex!important; align-items:center!important; justify-content:center!important; }
.read-img.read-bg-img img{ display:block!important; margin:0 auto!important; }
/* Ensure column image blocks center as well */
.col-3.read-img.read-bg-img, .col-3.pos-rel.read-img.read-bg-img{ display:flex!important; align-items:center!important; justify-content:center!important; }
.col-3.read-img.read-bg-img img{ margin:0 auto!important; }
/* Restore image visibility in default grid and center non-destructively */
.grid-design-default .read-img.read-bg-img{ display:block !important; }
.grid-design-default .read-img.read-bg-img img{ display:block !important; margin:0 auto !important; max-width:100% !important; height:auto !important; }
/* Also apply to carousel default grid variant */
.af-cat-widget-carousel.grid-design-default .read-img.read-bg-img{ display:block !important; }
.af-cat-widget-carousel.grid-design-default .read-img.read-bg-img img{ display:block !important; margin:0 auto !important; }
/* Hide overlay grid card on mobile/tablet, show on desktop */
@media (max-width: 1024px){
  .af-sec-post .af-cat-widget-carousel.grid-design-texts-over-image{ display:none !important; }
}
@media (min-width: 1025px){
  .af-sec-post .af-cat-widget-carousel.grid-design-texts-over-image{ display:block !important; }
}
/* Ensure image card is clickable even when overlays/meta hidden */
.read-img.pos-rel.read-bg-img{ position: relative !important; }
.read-img.pos-rel.read-bg-img .aft-post-image-link{ position: absolute !important; top:0; left:0; right:0; bottom:0; width:100% !important; height:100% !important; display:block !important; z-index: 5 !important; }
.read-img.pos-rel.read-bg-img .post-format-and-min-read-wrap,
.read-img.pos-rel.read-bg-img .category-min-read-wrap{ pointer-events: none !important; z-index: 4 !important; }

/* -----------------------------------------------------------------
   Make the 'min-read' badge use site gold with good contrast
----------------------------------------------------------------- */
.entry-content .min-read,
.entry-content .post-format-and-min-read-wrap .min-read,
.entry-content .category-min-read-wrap .min-read{
  background: linear-gradient(180deg, rgba(var(--se-gold-rgb),1) 0%, rgba(var(--se-gold-rgb),0.95) 100%) !important;
  color: var(--sd-obsidian) !important; /* dark text so it's readable on gold */
  padding: 6px 10px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: .8rem !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.35) !important;
  text-transform: none !important;
}

/* Small tweak: slightly reduce badge size on small screens */
@media (max-width: 760px){
  .entry-content .min-read, .entry-content .post-format-and-min-read-wrap .min-read { padding: 5px 8px !important; font-size: .75rem !important; }
}
/* brand vars consolidated at top */
.llms-author{ background-color: rgba(13,148,136,0.08) !important; border: 1px solid rgba(13,148,136,0.3) !important; border-radius: 8px !important; padding: 10px 12px !important; display: inline-flex !important; align-items: center !important; gap: 10px !important; }
.llms-author .avatar{ border-radius: 50% !important; border: 2px solid var(--brand-primary) !important; }
.llms-author .llms-author-info{ color: var(--brand-primary) !important; font-weight: 600 !important; }
.llms-author .llms-author-info.label{ opacity: 0.85 !important; }
/* brand vars consolidated at top */
/* Comment reply title */
#theChampReplyTitle, .comment-reply-title{ color: var(--brand-text) !important; border-left: 3px solid var(--brand-primary) !important; padding-left: 8px !important; }
/* TheChamp (Super Socializer) tabs and selected states */
#theChampTabs-0-li, .theChampSelectedTab{ color: var(--brand-primary) !important; border-bottom: 2px solid var(--brand-primary) !important; }
/* Akismet notice link and paragraph */
.akismet_comment_form_privacy_notice{ color: var(--brand-text) !important; }
.akismet_comment_form_privacy_notice a{ color: var(--brand-primary) !important; text-decoration: underline !important; }
.akismet_comment_form_privacy_notice{ display:none !important; }
/* brand vars consolidated at top */
#theChampReplyTitle, .comment-reply-title{ color: var(--brand-yellow) !important; border-left-color: var(--brand-yellow) !important; }
.entry-content.read-details, .entry-content.read-details .inner-entry-content{ text-align:center !important; }
/* limit left/right padding to 20px (preserve top/bottom) */
.entry-content.read-details {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* Ensure post date sits below the title for .read-single list/thumbnail items */
.read-single .read-title + .post-item-metadata,
.read-single.color-pad .read-title + .post-item-metadata {
  display: block !important;
  width: 100% !important;
  margin-top: 8px !important;
}

.read-single .post-item-metadata .posts-date,
.read-single.color-pad .post-item-metadata .posts-date {
  display: block !important;
  float: none !important;
  margin-top: 6px !important;
}

/* Strong stack-forcing rules to ensure date sits under the title across layouts */
.read-single.color-pad .read-details,
.read-single .read-details {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}
.read-single.color-pad .read-details .post-item-metadata,
.read-single .read-details .post-item-metadata {
  order: 2 !important;
  width: 100% !important;
  display: block !important;
  clear: both !important;
  margin-top: 0px !important;
}
.read-single .read-details .read-title { order: 1 !important; }
.read-single .read-details .read-title h4 { margin-bottom: 0px !important; }
.entry-content.read-details .llms-instructors.llms-cols{ display:flex !important; justify-content:center !important; align-items:center !important; }
.entry-content.read-details .llms-author{ display:inline-flex !important; align-items:center !important; justify-content:center !important; }
.entry-content.read-details img{ margin:0 auto !important; display:block !important; }@media (min-width: 1025px){.af-main-banner-latest-posts .af-cat-widget-carousel.grid-design-texts-over-image .col-3.read-img.read-bg-img,.af-main-banner-latest-posts .af-cat-widget-carousel.grid-design-texts-over-image .col-3.pos-rel.read-img.read-bg-img{ display:flex !important }}@media (max-width: 1024px){.af-main-banner-latest-posts .af-cat-widget-carousel.grid-design-texts-over-image .col-3.read-img.read-bg-img,.af-main-banner-latest-posts .af-cat-widget-carousel.grid-design-texts-over-image .col-3.pos-rel.read-img.read-bg-img{ display:none !important }}.af-main-banner-latest-posts .af-cat-widget-carousel.grid-design-texts-over-image .col-3 .pad.read-details.color-tp-pad{ display:none !important }@media (min-width:1025px){.aft-thumb-part .af-main-banner-thumb-posts{display:block !important}}@media (max-width:1024px){.aft-thumb-part .af-main-banner-thumb-posts{display:none !important}}.aft-thumb-part .af-main-banner-thumb-posts .pad.read-details.color-tp-pad{display:none !important}/* Hide entire left thumbs column on tablet/mobile, show on desktop */@media (min-width:1081px){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:block !important; visibility:visible !important}}@media (max-width:1080px){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:none !important; visibility:hidden !important}}/* iPad landscape: show hero thumbnails column starting at 1181px */@media (min-width:1181px){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:block !important; visibility:visible !important}}@media (max-width:1180px){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:none !important; visibility:hidden !important}}/* Explicit landscape orientation rule for tablets */@media screen and (orientation: landscape) and (min-width: 1024px){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:block !important; visibility:visible !important}}@media (min-width:1180px){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:block !important; visibility:visible !important}}@media screen and (orientation: landscape) and (min-width:1024px){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:block !important; visibility:visible !important}}@media (max-width:1199px){.aft-thumb-part .af-main-banner-thumb-posts .af-cat-widget-carousel.grid-design-texts-over-image{display:block !important}}@media (min-width:980px){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:block !important; visibility:visible !important}.aft-thumb-part .af-main-banner-thumb-posts .af-cat-widget-carousel.grid-design-texts-over-image{display:block !important}.aft-thumb-part .af-main-banner-thumb-posts .col-3.read-img.read-bg-img,.aft-thumb-part .af-main-banner-thumb-posts .col-3.pos-rel.read-img.read-bg-img{display:flex !important}}@media (max-width:979px){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:none !important; visibility:hidden !important}}@media screen and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2){.aft-thumb-part.col-4.pad.float-l.aft-position-2{display:block !important; visibility:visible !important}}.aft-thumb-part .af-main-banner-thumb-posts .read-title h4{ margin-bottom:6px !important } .aft-thumb-part .af-main-banner-thumb-posts .post-item-metadata.entry-meta{ display:block !important; float:none !important; position:static !important; margin-top:6px !important } .aft-thumb-part .af-main-banner-thumb-posts .post-item-metadata.entry-meta .posts-date{ display:block !important }/* Contact page centering and brand button wrapper */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;800;900&display=swap');

/* Page /slow-down-practice id:1632 I want everyting related to this page organze in sections */

/* --- Slowdown: page-scoped overrides (body.page-id-1632 & helpers) --- */
.page-id-1632, .page-id-1632 #page, .page-id-1632 .site, .page-id-1632 .site-content, .page-id-1632 .entry-content { background: transparent !important; }
.page-id-1632 .entry-content::before, .page-id-1632 [class*=overlay]:not(.figma-bg-overlay), .page-id-1632 [style*=radial-gradient] { display: none !important; }
.page-id-1632 h1, .page-id-1632 h2, .page-id-1632 h3, .page-id-1632 h4, .page-id-1632 p { display:block; white-space:normal; }
/* Page 1632 overlay controls */
.page-id-1632 .aft-pagebuilder-page-section .absolute.inset-0.opacity-10 { display: none !important; }
.page-id-1632 .slowdown-bg-overlay { display:block!important; position: fixed; inset: 0; pointer-events: none; z-index: 0; }
.page-id-1632 .slowdown-bg-overlay::before { content:""; position:absolute; inset:0; opacity:.10; background-image:radial-gradient(circle, rgb(var(--se-gold-rgb)) 1px, transparent 1px); background-size:24px 24px; }
.page-id-1632 .entry-content, .page-id-1632 #content { position: relative; z-index: 1; }
/* Figma hero layout and headline visibility */
.page-id-1632 .slowdown-hero{min-height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:64px 16px}
.page-id-1632 .slowdown-headline{font-weight:800;letter-spacing:.02em;line-height:1.08;font-size:clamp(2.5rem,6vw,4.5rem);color:var(--se-gold);background-image:linear-gradient(180deg,var(--se-white) 30%, var(--se-gold) 80%);-webkit-background-clip:text;background-clip:text}
@supports (-webkit-background-clip:text){.page-id-1632 .slowdown-headline{-webkit-text-fill-color:transparent;color:inherit}}
.page-id-1632 .slowdown-headline{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;letter-spacing:.02em;line-height:1.08;font-size:clamp(3.2rem,7.5vw,5.8rem);color:var(--se-white);background:none}
.page-id-1632 .slowdown-text-glow{ text-shadow:0 0 6px rgba(255,255,255,.08), 0 0 22px rgba(var(--se-gold-rgb),.25) }
.page-id-1632 .slowdown-gold{ color:var(--se-gold) }
.page-id-1632 .slowdown-lead{opacity:.85;margin-top:.75rem}
.page-id-1632 .slowdown-lead-accent{color:var(--sd-blood)}
.page-id-1632 .slowdown-cta{margin-top:28px}
.page-id-1632 .slowdown-cta-button .wp-block-button__link{background-color:var(--se-gold);color:var(--sd-obsidian);border:1px solid var(--se-gold);border-radius:8px;padding:.75rem 1.25rem;position:relative}
.page-id-1632 .slowdown-cta-button .wp-block-button__link::before{content:"";position:absolute;inset:2px;border:1px solid rgba(var(--se-gold-rgb),.8);border-radius:6px}
/* Force radial grid overlay on body for Slow Down page */
body.page-id-1632::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.10;background-image:radial-gradient(circle, rgb(var(--se-gold-rgb)) 1px, transparent 1px);background-size:24px 24px}
body.page-id-1632 #page, body.page-id-1632 .site, body.page-id-1632 .site-content{position:relative;z-index:1}
.page-id-1632 body, body.page-id-1632{background-color:var(--sd-obsidian)!important;background-image:url('https://www.shamanicether.com/wp-content/uploads/2025/11/slowdown_hero-scaled.webp')!important;background-size:cover!important;background-position:center!important;background-attachment:fixed!important;background-repeat:no-repeat!important}
body.page-id-1632::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(1200px 700px at 50% 30%, rgba(0,0,0,.6), rgba(0,0,0,.95)),
  radial-gradient(220px 220px at 15% 12%, rgba(var(--se-gold-rgb),.08), transparent 60%),
  radial-gradient(240px 240px at 82% 68%, rgba(var(--se-gold-rgb),.06), transparent 60%);
}

/* Mobile: make the main vignette scale with the viewport and be at least as dark as desktop
   (some mobile browsers ignore background-attachment: fixed and can expose more of the image,
   which makes overlays feel lighter). Use viewport-relative sizes and slightly stronger alpha
   to match the perceived desktop darkness. */
@media (max-width: 900px) {
  body.page-id-1632::after{
    /* use viewport units so the radial vignette covers small screens more uniformly */
    background:
      radial-gradient(80vw 60vh at 50% 30%, rgba(0,0,0,.72), rgba(0,0,0,.95)),
      radial-gradient(18vw 18vw at 12% 10%, rgba(var(--se-gold-rgb),.08), transparent 60%),
      radial-gradient(20vw 20vw at 88% 72%, rgba(var(--se-gold-rgb),.06), transparent 60%);
  }
}
.page-id-1632 .slowdown-header{background:rgba(13,13,13,.5);color:var(--se-white);border-bottom:1px solid rgba(var(--se-gold-rgb),.2);border-radius:14px;margin:16px auto;padding:12px 20px;display:flex;align-items:flex-start!important;justify-content:space-between;gap:12px;position:sticky;top:var(--se-adminbar-offset,0);z-index:50;backdrop-filter:none}
.page-id-1632 .slowdown-page,.page-id-1632 .slowdown-header,.page-id-1632 .slowdown-hero{max-width:unset!important;width:100%!important}
.page-id-1632 .wp-block-group.slowdown-hero.is-layout-constrained{max-width:unset!important}
.admin-bar{--se-adminbar-offset:32px}
@media (max-width:782px){.admin-bar{--se-adminbar-offset:46px}}
.page-id-1632 .slowdown-header{display:grid!important;grid-template-columns:1fr 2fr 1fr!important;align-items:center!important}
.page-id-1632 .slowdown-header-left{display:flex!important;align-items:center!important;gap:8px!important;justify-self:center!important;justify-content:center!important}
.page-id-1632 .slowdown-header-center{justify-self:center!important;display:flex!important;justify-content:center!important;align-items:center!important;gap:10px!important}
.page-id-1632 .slowdown-header-right{display:flex!important;align-items:center!important;gap:8px!important;justify-self:center!important;justify-content:center!important}
.page-id-1632 .slowdown-right-logo img{width:140px!important;height:auto!important;border-radius:8px!important;display:block!important;margin-top:0!important}

/* Page 1632: ensure guide titles and subtitles are visually separated and subtitle is brand gold */
.page-id-1632 .se-guide-title { text-align: center; }
.page-id-1632 .se-guide-title-main { display: block; }
.page-id-1632 .se-guide-title-sub { display: block; margin-top: 8px; color: #C5A059 !important; }

/* Page 1632: target subsections individually
  - the 'invest' guide subtitle should be gold
  - the 'keeper' guide subtitle should be white
  Use higher-specificity selectors and !important to reliably override inline/styles.
*/
body.page-id-1632 .se-invest .se-guide-title-sub { color: var(--se-gold) !important; }
body.page-id-1632 .se-guide.se-keeper .se-guide-title-sub { color: var(--se-white) !important; }

/* Page 1632: make only the 'se-invest' lead paragraph white (keep other page paragraphs gold) */
body.page-id-1632 .se-invest .se-invest-lead { color: var(--se-white) !important; }
/* override any nested inline spans (e.g. <span>Sanctuary</span>) inside the lead */
body.page-id-1632 .se-invest .se-invest-lead span { color: var(--se-white) !important; }
.page-id-1632 .slowdown-right-brand{font-family:'Montserrat',system-ui,sans-serif!important;font-weight:800!important;letter-spacing:.20em!important;color:var(--se-white)!important}
.page-id-1632 .slowdown-title{font-family:'Montserrat',system-ui,sans-serif!important;font-weight:800!important;letter-spacing:.20em!important;color:var(--se-gold)!important}
.page-id-1632 .slowdown-hamburger .wp-block-button__link{background:transparent!important;border:1px solid var(--se-gold)!important;color:var(--sd-obsidian) !important;border-radius:10px!important;padding:8px 12px!important}
@media (max-width:768px){
  .page-id-1632 .slowdown-nav{display:none!important}
  .page-id-1632 .slowdown-hamburger{display:flex!important}
  /* allow logos to size naturally and give the center column the available room */
  .page-id-1632 .slowdown-header{display:grid!important;grid-template-columns:auto 1fr auto!important;border:1px solid rgba(var(--se-gold-rgb),.35)!important;background:rgba(13,13,13,.94)!important}
  .page-id-1632 .slowdown-header-left,.page-id-1632 .slowdown-header-center,.page-id-1632 .slowdown-header-right{justify-content:center!important;align-items:center!important}
  .page-id-1632 .slowdown-title,.page-id-1632 .slowdown-right-brand{display:none!important}
  .page-id-1632 .slowdown-logo{height:40px!important;width:auto!important}
  .page-id-1632 .slowdown-right-logo img{height:40px!important;width:auto!important}
}

/* === STRONG OVERRIDES: Force full image visibility and remove cropping for all banner/thumb/trending cards ===
   We add very specific selectors and disable background-image/background-size where
   the parent theme forces fixed heights / cover cropping. These rules are intentionally
   placed towards the end of the child stylesheet and use !important so they win
   over parent selectors in practice.
*/
/* target many parent selectors that set height or background-size */
.aft-main-banner-thumb-posts .read-img.read-bg-img,
.af-main-banner-tabbed-posts .read-img.read-bg-img,
.af-banner-carousel .read-img.read-bg-img,
.darknews_posts_slider_widget .read-single .read-img.read-bg-img,
.darknews_posts_double_columns_widget .af-widget-body .af-sec-post .read-img.read-bg-img,
.af-main-banner-thumb-posts .read-single:not(.af-cat-widget-carousel) .read-img.read-bg-img,
.af-main-banner-tabbed-posts .read-single:not(.af-cat-widget-carousel) .read-img.read-bg-img,
.aft-trending-part .read-img.read-bg-img,
.af-main-banner-latest-posts .af-sec-post .read-img.read-bg-img,
.af-wrapper .af-banner-carousel .read-img.read-bg-img,
.col-3.read-img.read-bg-img,
.read-img.read-bg-img {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  background-size: contain !important; /* don't crop */
  background-position: center center !important;
  background-repeat: no-repeat !important;
  /* If markup uses background-image instead of <img>, show the full background rather than cropped */
}

/* make sure actual <img> elements are shown full-size inside their containers */
.read-img.read-bg-img img,
.col-3.read-img.read-bg-img img,
.af-banner-carousel .read-img.read-bg-img img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
}

/* If a layout is intentionally using background-image to render the picture, ensure it's visible and centred */
.read-img.read-bg-img[data-bg],
.read-img.read-bg-img[data-bg]::before {
  background-size: contain !important;
  background-position: center center !important;
}


/* Mobile: branded dropdown/menu for Slow Down header */
@media (max-width:1279px){
  .page-id-1632 .slowdown-header{position:relative}
  .page-id-1632 .slowdown-header.menu-open{z-index:99999}

  /* when menu is open make the header larger and show a vertical stack of compact buttons */
  /* make header slightly more compact in mobile open state so nav sits snugly */
  .page-id-1632 .slowdown-header.menu-open{
    /* reserve room under the header so the nav can sit beneath the logo/hamburger/logo row
       reduce the reserved gap to keep the nav visually closer under the header */
    padding-bottom: 96px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  /* base mobile nav state: hidden but present so we can animate open/close */
  .page-id-1632 .slowdown-nav{
    display:flex !important;
    flex-direction:column;
    align-items:center;
    gap:6px;
    opacity:0;
    transform: translateY(-6px);
    visibility:hidden;
    pointer-events:none;
    transition: opacity 220ms cubic-bezier(.2,.9,.2,1), transform 220ms cubic-bezier(.2,.9,.2,1), visibility 0ms linear 220ms;
  }

  .page-id-1632 .slowdown-header.menu-open .slowdown-nav{
    /* position the nav visually under the header row (logo, hamburger, logo) */
    display:flex !important;
    flex-direction:column;
    align-items:center;
    gap:4px; /* even tighter spacing as requested */
    /* keep nav inside header (pushes header bigger) */
    /* use absolute centering so the nav sits under the header row, centered across the full header */
    position:absolute !important;
    top: calc(100% + 10px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width:auto !important;
    max-width: min(520px, 86vw) !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding:0 !important; /* buttons will control their own padding */
    /* animate visible state */
    opacity:1 !important;
    transform: translateY(0) !important;
    visibility:visible !important;
    pointer-events:auto !important;
    background:transparent !important; /* let header background remain visible */
    border-radius:8px !important;
    box-shadow:none !important;
  }

  /* compact pill buttons stacked inside the header */
  /* compact pill buttons stacked under the header row */
  .page-id-1632 .slowdown-header.menu-open .slowdown-nav .wp-block-button__link{
    display:inline-block !important;
    width:auto !important;
    min-width:96px !important;
    padding:8px 12px !important;
    border-radius:999px !important;
    background: rgba(255,255,255,0.04) !important; /* subtle dark pill */
    color: var(--se-white) !important;
    border: 1px solid rgba(var(--se-gold-rgb),0.06) !important;
    text-align:center !important;
    font-weight:700 !important;
  }

  /* ensure button wrappers don't stretch to full width */
  .page-id-1632 .slowdown-header.menu-open .slowdown-nav .wp-block-button{
    width:auto !important;
    display:inline-block !important;
  }

  /* center the nav within the header grid cell when the menu is open */
  /* keep the header center as the single row with the hamburger in the middle */
  .page-id-1632 .slowdown-header.menu-open .slowdown-header-center{
    display:flex !important;
    flex-direction:row !important; /* maintain row layout for logo/hamburger/logo */
    justify-content:center !important;
    align-items:center !important;
    gap:6px !important;
    padding:0 !important;
    position:static !important; /* allow absolutely-positioned nav to be positioned relative to the header */
  }

  /* make pills fill a larger portion of narrow devices so there's less empty space */
  @media (max-width:420px){
    .page-id-1632 .wp-block-cover__inner-container{ padding-left: 8px !important; padding-right: 8px !important; }
    .page-id-1632 .slowdown-header.menu-open .slowdown-nav .wp-block-button__link{
      min-width: 0 !important;
      width: 92% !important;
      padding: 10px 14px !important;
    }
    .page-id-1632 .slowdown-header.menu-open{ padding-left: 6px !important; padding-right: 6px !important; }
  }

  /* keep the header logos and hamburger visible as the single top row */
  .page-id-1632 .slowdown-header.menu-open .slowdown-header-left,
  .page-id-1632 .slowdown-header.menu-open .slowdown-header-right,
  .page-id-1632 .slowdown-header.menu-open .slowdown-hamburger{
    display:flex !important; /* allow centering and consistent vertical alignment */
    align-items:center !important;
    justify-content:center !important;
  }

  /* order the hamburger above the nav so the list appears under the center cell */
  .page-id-1632 .slowdown-header.menu-open .slowdown-hamburger{ order: 0 !important; }
  .page-id-1632 .slowdown-header.menu-open .slowdown-nav{ order: 1 !important; }

  /* primary CTA variant inside the menu — keep it visually distinct but small */
  .page-id-1632 .slowdown-header.menu-open .slowdown-nav .slowdown-nav-begin .wp-block-button__link{
    background: var(--sd-obsidian) !important;
    color: var(--se-gold) !important;
    border-radius:999px !important;
    padding:8px 16px !important;
    border: 1px solid rgba(var(--se-gold-rgb),0.12) !important;
  }

  /* larger hamburger button when menu is open — visually centered and obvious */
  .page-id-1632 .slowdown-header.menu-open .slowdown-hamburger .wp-block-button__link{
    display:inline-flex !important;
    width:56px !important;
    height:56px !important;
    align-items:center !important;
    justify-content:center !important;
    padding:0 !important;
    font-size:28px !important;
    border-radius:12px !important;
    border:1px solid rgba(var(--se-gold-rgb),.18) !important;
    background: rgba(255,255,255,0.03) !important;
    color: var(--se-white) !important;
  }

  /* default hamburger sizing for mobile (closed) */
  .page-id-1632 .slowdown-hamburger .wp-block-button__link{
    display:inline-flex !important;
    width:48px !important;
    height:48px !important;
    align-items:center !important;
    justify-content:center !important;
    padding:0 !important;
    font-size:20px !important;
    border-radius:10px !important;
    border:1px solid rgba(var(--se-gold-rgb),.12) !important;
    background: rgba(255,255,255,0.02) !important;
    color: var(--se-white) !important;
    transition: box-shadow 180ms ease, transform 120ms ease, background 160ms ease;
  }

  /* subtle hover/focus on hamburger */
  .page-id-1632 .slowdown-hamburger .wp-block-button__link:hover,
  .page-id-1632 .slowdown-hamburger .wp-block-button__link:focus{
    box-shadow: 0 6px 18px rgba(var(--se-gold-rgb),0.06), 0 0 0 3px rgba(var(--se-gold-rgb),0.03);
    transform: translateY(-1px);
  }

  /* close icon hidden by default and shown when menu-open */
  .page-id-1632 .slowdown-close{
    display:none !important;
    background: transparent !important;
    border: 1px solid rgba(var(--se-gold-rgb), .06) !important;
    color: var(--se-white) !important;
    font-size:20px !important;
    width:44px !important;
    height:44px !important;
    border-radius:10px !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .page-id-1632 .slowdown-header.menu-open .slowdown-close{
    display:inline-flex !important;
    aria-hidden: false;
  }
}

/* Reduce the top spacing if the adminbar is present on this specific page */
.page-id-1632.admin-bar .slowdown-page{margin-top:8px !important}
@media (max-width:782px){ .page-id-1632.admin-bar .slowdown-page{margin-top:16px !important} }
@media (min-width:769px){
  .page-id-1632 .slowdown-hamburger{display:none!important}
  .page-id-1632 .slowdown-header-left{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important}
  .page-id-1632 .slowdown-header-right{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important}
  .page-id-1632 .slowdown-title,.page-id-1632 .slowdown-right-brand{display:none!important}
  .page-id-1632 .slowdown-logo,.page-id-1632 .slowdown-right-logo img{display:block!important;margin-left:auto!important;margin-right:auto!important}
  .page-id-1632 .slowdown-nav .wp-block-button__link{padding:10px 16px!important}
  /* larger logos on wider screens */
  .page-id-1632 .slowdown-logo{width:140px!important}
  .page-id-1632 .slowdown-right-logo img{width:140px!important}
}

/* Make the Slow Down header wider on large desktop viewports:
   - increase center column width (gives the header more horizontal space)
   - add larger left/right padding so the header stretches visually
   - allow the cover inner container to expand further on ultra-wide screens
*/
@media (min-width:1200px){
  .page-id-1632 .slowdown-header{
    grid-template-columns: 1fr 3fr 1fr !important;
    padding-left: 60px !important;
    padding-right: 60px !important;
  }

  /* expand the inner container for very wide screens so header has room to breathe */
  .page-id-1632 .wp-block-cover__inner-container{
    max-width: min(98vw, 2000px) !important;
  }
}

/* Force hero headline/subtitle visibility on Slow Down page (both H1 & H2) */
.page-id-1632 h1.slowdown-headline,
.page-id-1632 h2.slowdown-headline,
.page-id-1632 .slowdown-headline {
  color: var(--se-white) !important;
  background-image: none !important;
  -webkit-background-clip: initial !important;
  -webkit-text-fill-color: initial !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 4 !important; /* ensure it's above decorative overlays */
}

/* Make subtitle (lead-accent) clearly visible under the header */
.page-id-1632 .slowdown-lead-accent{
  color: var(--se-gold) !important;
  font-weight:700 !important;
  margin-top: 6px !important;
  opacity: 1 !important;
}
.page-id-1632 .slowdown-title{font-family:'Montserrat',system-ui,sans-serif;font-weight:800;letter-spacing:.25em}
.page-id-1632 .slowdown-logo{width:140px;height:auto;border-radius:8px;display:block;margin-top:0!important}

/* Mobile / small viewport overrides — make logos comfortably larger than before */
@media (max-width:768px){
  .page-id-1632 .slowdown-logo,
  .page-id-1632 .slowdown-right-logo img{
    width:120px !important;
    height:auto !important;
  }
}
@media (max-width:375px){
  .page-id-1632 .slowdown-logo,
  .page-id-1632 .slowdown-right-logo img{
    width:100px !important;
    height:auto !important;
  }
}
.page-id-1632 .slowdown-nav .wp-block-button__link{background:transparent;border:0;color:var(--sd-obsidian) !important;padding:8px 12px;font-family:'Montserrat',system-ui,sans-serif;font-size:12px;letter-spacing:.25em;line-height:1;text-transform:uppercase;white-space:nowrap}
@media (max-width:1279px){
  .page-id-1632 .slowdown-nav{display:none!important}
  .page-id-1632 .slowdown-hamburger{display:flex!important}
}
.page-id-1632 .slowdown-nav-begin .wp-block-button__link{border:1px solid var(--sd-blood);color:var(--sd-obsidian) !important;border-radius:10px;padding:8px 16px}
.page-id-1632 h1.slowdown-headline, .page-id-1632 .wp-block-heading.slowdown-headline{font-family:'Montserrat',system-ui,sans-serif;font-weight:800;letter-spacing:.01em;line-height:1.08;font-size:clamp(3.12rem,7.8vw,5.04rem)!important;color:var(--se-white)!important;background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important;-webkit-text-fill-color:initial!important;opacity:1!important}
@media (max-width:768px){
  .page-id-1632 h1.slowdown-headline,
  .page-id-1632 h2.slowdown-headline,
  .page-id-1632 .wp-block-heading.slowdown-headline,
  .slowdown-headline {
    font-size: clamp(30px, 8.5vw, 44px) !important;
    line-height: 1.12 !important;
    letter-spacing: .005em !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    hyphens: auto !important;
    margin: 0 12px !important;
  }
}
@media (max-width:480px){
  .page-id-1632 h1.slowdown-headline,
  .page-id-1632 h2.slowdown-headline,
  .page-id-1632 .wp-block-heading.slowdown-headline,
  .slowdown-headline {
    font-size: clamp(22px, 7.5vw, 34px) !important;
    line-height: 1.08 !important;
    letter-spacing: .002em !important;
  }
}
.page-id-1632 .slowdown-lead{color:var(--se-white)!important;margin-top:.5rem;opacity:1!important;font-size:1.2em!important}
.page-id-1632 .slowdown-lead-accent{color:var(--se-gold)!important;opacity:1!important;margin-bottom:.5rem!important;margin-top:0!important;font-size:1.2em!important}
.page-id-1632 .slowdown-hero{display:flex!important;flex-direction:column!important;gap:.5rem!important;padding-top:50px!important}
.page-id-1632 .slowdown-hero .slowdown-lead-accent{order:-1}
.page-id-1632 .slowdown-gold{color:var(--se-gold)!important}
.page-id-1632 .slowdown-cta-button .wp-block-button__link{background:transparent!important;color:var(--se-gold)!important;border:1px solid var(--se-gold)!important;position:relative!important;opacity:1!important;padding:1.08rem 1.68rem!important;border-radius:8px!important;font-size:1.1em!important}
.page-id-1632 .slowdown-cta-button .wp-block-button__link::before{content:"";position:absolute;inset:2px;border:1px solid var(--se-gold);border-radius:8px}
.page-id-1632 .slowdown-text-glow{ text-shadow:none!important }
.page-id-1632 .slowdown-hero, .page-id-1632 .slowdown-hero *{ opacity:1!important; filter:none!important; mix-blend-mode:normal!important }
.page-id-1632 .wp-block-group.slowdown-hero{background:transparent!important;box-shadow:none!important;border:0!important}
.page-id-1632 .wp-block-group.slowdown-hero.is-layout-constrained{max-width:none!important;width:100%!important}
.page-id-1632 .slowdown-hero{max-width:none!important;width:100%!important}
.page-id-1632 .slowdown-hero{position:relative!important;z-index:2!important}

/* Remove the default 25px top margin on the content wrapper for the Slow Down page
   (some user-agent or theme rules were adding margin-top:25px). Explicitly reset
   to zero here so the slowdown page header sits flush with the top of the content. */
body.page-id-1632 #content.container-wrapper {
  margin-top: 0 !important;
  /* Full-bleed layout horizontally for the Slow Down page */
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Guide cards: smaller padding, larger image area, and white title */
.page-id-1632 #guide .grid > div > div {
  /* reduce internal padding so cards feel tighter */
  padding: 1rem !important; /* 16px */
  min-height: 280px !important; /* keep a sensible minimum */
}

.page-id-1632 #guide .grid > div > div .se-guide-figure img,
.page-id-1632 #guide .grid > div > div picture img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important; /* avoid cropping */
  margin: 0 auto !important;
}

.page-id-1632 #guide .grid > div > div .se-guide-caption {
  margin-top: 8px !important;
  padding: 8px !important;
}

.page-id-1632 .se-guide-caption-title {
  color: var(--se-white) !important; /* brand white */
  font-weight: 700 !important;
}

/* Reduce helper utility padding on this page so other p-8 uses are smaller here */
.page-id-1632 .p-8 { padding: 12px !important; }
.page-id-1632 .wp-block-group.slowdown-hero::before,
.page-id-1632 .wp-block-group.slowdown-hero::after,
.page-id-1632 .slowdown-hero::before,
.page-id-1632 .slowdown-hero::after{content:none!important;display:none!important;background:none!important;opacity:1!important}
.se-essence{padding:60px 20px}

/* --- SE: Essence (.se-essence, .se-architecture, .se-arch-*) --- */
.se-architecture{max-width:980px;margin:0 auto;text-align:center;position:relative}
.se-arch-body{font-family:'Montserrat',system-ui,sans-serif;font-size:clamp(16px,2.2vw,22px);line-height:1.6;color:var(--se-gold);opacity:.92;margin:0 auto 12px auto;max-width:860px}
.se-arch-note{font-family:'Roboto Mono',monospace;font-size:clamp(14px,2vw,18px);line-height:1.6;color:var(--sd-forest);opacity:.85;margin:0 auto 16px auto;max-width:860px}
.se-arch-title{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;font-size:clamp(28px,4.5vw,48px);letter-spacing:.06em;color:var(--se-gold);margin-bottom:14px}
.se-cyan{color:var(--sd-glitch)}
.se-divider{width:100%;height:1px;background:rgba(var(--se-gold-rgb),.18);margin:24px 0}
.page-id-1632 .slowdown-hero .se-mouse{margin-top:12px}
.se-mouse{width:24px;height:40px;border:2px solid var(--se-gold);border-radius:999px;margin:12px auto 0 auto;position:relative}
.se-mouse-dot{width:6px;height:10px;background:var(--se-gold);border-radius:999px;position:absolute;left:50%;top:8px;transform:translateX(-50%);animation:se-bounce 1.2s ease-in-out infinite}
@keyframes se-bounce{0%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}100%{transform:translate(-50%,0)}}
.se-practice{text-align:center;margin-top:36px}
.se-practice-subtitle{font-family:'Roboto Mono',monospace;font-size:clamp(16px,2.5vw,22px);color:var(--sd-blood)}
.se-practice-title{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;font-size:clamp(36px,6vw,64px);letter-spacing:.04em;color:var(--se-gold);margin-bottom:8px;text-transform:uppercase}
@media (max-width:768px){
  .se-essence{padding:40px 16px}
  .se-mouse{width:22px;height:36px}
}
.page-id-1632 .slowdown-lead{max-width:75%;margin-left:auto;margin-right:auto;text-align:center}
@media (max-width:768px){.page-id-1632 .slowdown-lead{max-width:100%}}
.se-value{padding:60px 20px}

/* --- SE: Value (.se-value, .se-value-*) --- */
.se-value-columns{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:start;max-width:min(95vw, 1400px);margin:0 auto}
.se-value-media{display:flex;align-items:center;justify-content:center}
.se-value-media img{display:block;width:100%;height:auto;border-radius:12px;max-width:520px}
.se-value-subheading{font-family:'Montserrat',system-ui,sans-serif;color:var(--se-gold);font-weight:800;font-size:22px;margin:10px 0}

/* Page-specific: make all H3 on Slow Down page white and left-aligned */
body.page-id-1632 h3,
body.page-id-1632 h3.se-value-subheading,
body.page-id-1632 .se-value-subheading {
  color: var(--se-white) !important;
  text-align: left !important;
}

/* Only paragraphs that are siblings following an H3 should be justified on this page */
body.page-id-1632 h3 + p,
body.page-id-1632 h3 ~ p,
body.page-id-1632 .se-value-text h3 + p,
body.page-id-1632 .se-value-text h3 ~ p {
  text-align: justify !important;
}
body.page-id-1632 .se-price-sub { text-align: center !important; }
.se-value-text{font-family:'Montserrat',system-ui,sans-serif;color:var(--se-white);font-size:18px;line-height:1.7;text-align:justify;text-justify:inter-word;hyphens:auto}
.se-value-title{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;text-transform:uppercase;text-align:center;letter-spacing:.05em;margin-bottom:24px;display:flex;flex-direction:column;align-items:center}
.se-value-title-main{display:block;color:var(--se-white);font-size:clamp(42px,7vw,72px)}
.se-value-title-sub{display:block;color:var(--se-gold);font-size:clamp(24px,4.5vw,36px);letter-spacing:.08em;margin-bottom:8px;order:-1}
@media (max-width:900px){.se-value-columns{grid-template-columns:1fr;gap:18px}.se-value-media img{max-width:360px;margin:0 auto}}
.page-id-1632 #essence{max-width:none!important;width:100%!important}
.page-id-1632 #essence.wp-block-group.is-layout-constrained{max-width:none!important;width:100%!important}
.se-protocol{padding:30px 20px}

/* Desktop: place the media (logo) on the LEFT and text on the RIGHT */
@media (min-width:901px){
    /* Desktop: text on LEFT, media (logo) on RIGHT and image aligned to top
      so the image lines up with the beginning of the text column. */
    .se-value-text{grid-column:1;padding-right:20px}
    .se-value-media{grid-column:2;align-items:flex-start;justify-content:center}
}

/* Map any 'brown' palette variables to gold on the Slow Down page (ID:1632).
   This makes rules that use var(--se-brown) or var(--sd-blood) render gold locally
   and avoids editing multiple plugin/theme rules. */
body.page-id-1632 {
  --se-brown: #C5A059; /* brand gold */
  --sd-blood: #C5A059; /* map any slow-down "blood" color to gold */
}

/* Ensure all paragraphs on the Slow Down page (ID:1632) are gold */
/* Keep a high-specificity rule to beat pmpro/theme rules that use !important */
body.page-id-1632 .entry-content p,
body.page-id-1632 .se-value-text p,
body[class*="pmpro-"] .page-id-1632 .entry-content p,
body.page-id-1632 p {
  color: #C5A059 !important;
}

/* --- SE: Protocol (.se-protocol, .se-card, .se-protocol-grid) --- */
.page-id-1632 #protocol{margin-top:20px}
@media (min-width:769px){.page-id-1632 #protocol{margin-top:40px}}
.page-id-1632 #protocol{max-width:none!important;width:100%!important}
.page-id-1632 #protocol.wp-block-group.is-layout-constrained{max-width:none!important;width:100%!important}
.se-protocol-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;max-width:min(95vw,1400px);margin:0 auto}
.se-protocol-title{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;text-transform:uppercase;text-align:center;letter-spacing:.05em;margin-bottom:24px}
.se-protocol-title-main{display:block;color:var(--se-white);font-size:clamp(36px,6vw,68px)}
.se-protocol-title-sub{display:block;color:var(--se-gold);font-size:clamp(18px,3.5vw,28px);letter-spacing:.08em;margin-top:6px;margin-bottom:100px}
.se-card{position:relative;background:var(--sd-obsidian);border:2px solid rgba(138,28,28,.3);padding:20px;border-radius:10px;transition:all .3s ease}
.se-card-body{font-family:'Roboto Mono',monospace;color:var(--se-gold)}
.se-card-gold{border-color:rgba(var(--se-gold-rgb),.3)}
.se-card-gold2{border-color:rgba(var(--se-gold-rgb),.3)}
.se-card-green{border-color:rgba(27,63,47,.3)}
.se-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.se-card-head-left{display:flex;flex-direction:column}
.se-card-icon{opacity:.3;color:var(--sd-blood)}
.se-card-num{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;font-size:32px;opacity:.3;color:var(--sd-blood)}
.se-card-time{font-family:'Roboto Mono',monospace;color:var(--se-gold);opacity:.8;font-size:12px}
.se-card-title{font-family:'Montserrat',system-ui,sans-serif;font-weight:800;font-size:22px;color:var(--se-gold);margin:4px 0}
.se-card:hover{border-color:rgba(var(--se-gold-rgb),.5)}

/* Page-scoped: make card titles/labels white and card border brand-gold on Slow Down page */
body.page-id-1632 .se-card{
  border-color: rgba(var(--se-gold-rgb), .25) !important;
}

body.page-id-1632 .se-card .se-card-title,
body.page-id-1632 .se-card h5.se-card-title,
body.page-id-1632 .se-card .se-card-label,
body.page-id-1632 .se-card .se-card-label.alt {
  color: var(--se-white) !important;
}

/* Keep body of cards readable (gold text retained) but allow title/labels to be white */
body.page-id-1632 .se-card .se-card-body{ color: var(--se-gold) !important; }
.se-card-label{display:block;color:var(--se-gold);text-transform:uppercase;font-size:12px;margin-top:8px}
.se-card-label.alt{color:var(--sd-blood)}
@media (max-width:1100px){.se-protocol-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.se-protocol-grid{grid-template-columns:1fr}}
/* --- SE: Guide (#guide, .grid, utility classes) --- */
.page-id-1632 #guide{padding:60px 20px;max-width:none!important;width:100%!important}
.page-id-1632 #guide.wp-block-group.is-layout-constrained{max-width:none!important;width:100%!important}
.page-id-1632 #guide .max-w-7xl{max-width:min(95vw,1400px)!important}
.page-id-1632 .grid{display:grid}
.page-id-1632 .grid-cols-1{grid-template-columns:1fr}
@media (min-width:768px){.page-id-1632 .md\:grid-cols-3{grid-template-columns:repeat(3,1fr)}}
.page-id-1632 .gap-8{gap:32px}
.page-id-1632 .mx-auto{margin-left:auto;margin-right:auto}
.page-id-1632 .mb-16{margin-bottom:64px}
.page-id-1632 .max-w-7xl{max-width:min(98vw,1600px)}
.page-id-1632 .max-w-4xl{max-width:56rem}
.page-id-1632 .p-8{padding:12px !important}
.page-id-1632 .border{border-style:solid;border-width:1px}
.page-id-1632 .rounded-full{border-radius:9999px}
.page-id-1632 .w-16{width:4rem}
.page-id-1632 .h-16{height:4rem}
.page-id-1632 .w-8{width:2rem}
.page-id-1632 .h-8{height:2rem}
.page-id-1632 .w-3\/4{width:75%}
.page-id-1632 .-translate-x-1\/2{transform:translateX(-50%)}
.page-id-1632 .text-center{text-align:center}
/* Brand text refinements */
.page-id-1632 #guide h2{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;color:var(--se-gold);letter-spacing:.06em;text-transform:uppercase}
.page-id-1632 #guide h3{font-family:'Montserrat',system-ui,sans-serif;font-weight:800;color:var(--sd-obsidian) !important}
.page-id-1632 #guide p{font-family:'Roboto Mono',monospace;line-height:1.7;color:var(--se-gold)}
.page-id-1632 #guide .se-invest-lead{ color: var(--se-white) !important; }
.page-id-1632 #guide .text-xl,.page-id-1632 #guide .text-lg{color:var(--se-white)}
.page-id-1632 #guide p .text-\[\#00FFFF\]{color:var(--sd-glitch)}
/* Card wrapper accent line */
.page-id-1632 #guide .bg-gradient-to-r{background:linear-gradient(90deg,transparent,rgba(138,28,28,.3),transparent)}
.page-id-1632 #guide .grid > div > div{ /* center every inner block by default */
  text-align: center !important;
}

/* make entire grid rows stretch so cards become equal height */
.page-id-1632 #guide .grid{
  align-items: stretch !important;
}

/* allow each grid child to become a flex container so inner div can be centered vertically */
.page-id-1632 #guide .grid > div{
  display: flex !important;
  align-items: stretch !important;
}

/* vertical center inside card, keep existing padding and overlay */
.page-id-1632 #guide .grid > div > div{
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  min-height: 240px !important; /* tighter default card height so boxes feel smaller */
}

/* Simple three-box layout on wide screens — no custom puzzle tabs */
@media (min-width: 960px) {
  /* keep the three tiles horizontally aligned with a comfortable gap */
  .page-id-1632 #guide .grid{ grid-template-columns: repeat(3, 1fr) !important; gap: 48px !important; }

  /* ensure no extra puzzle pseudo-elements appear */
  .page-id-1632 #guide .grid > div:nth-child(1) > div::after,
  .page-id-1632 #guide .grid > div:nth-child(2) > div::before,
  .page-id-1632 #guide .grid > div:nth-child(2) > div::after,
  .page-id-1632 #guide .grid > div:nth-child(3) > div::before{
    display: none !important;
    content: none !important;
  }

  /* make sure padding is uniform on wide screens */
  .page-id-1632 #guide .grid > div > div{ padding: 2.25rem !important; }
}

  /* make sure the tabs sit above the gap but underneath inner content of their own card */
  .page-id-1632 #guide .grid > div > div::before,
  .page-id-1632 #guide .grid > div > div::after{ z-index:1; }

  /* ensure the next sibling's tab overlaps slightly (gives interlocked feel) */
  .page-id-1632 #guide .grid > div:nth-child(2) > div::before,
  .page-id-1632 #guide .grid > div:nth-child(3) > div::before{ z-index:3; }

  /* subtle notch effect on middle tile by darkening where tabs meet */
  .page-id-1632 #guide .grid > div:nth-child(2) > div::after{ filter: drop-shadow(0 -2px 6px rgba(0,0,0,0.25)); }

  /* small visual offset so tabs are visible from outer boundary */
  .page-id-1632 #guide .grid > div:first-child > div,
  .page-id-1632 #guide .grid > div:last-child > div{ padding-right: calc(2.25rem + var(--tile-tab-size)/2) !important; padding-left: calc(2.25rem + var(--tile-tab-size)/2) !important; }
  .page-id-1632 #guide .grid > div:nth-child(2) > div{ padding-left: calc(2.25rem + var(--tile-tab-size)/2) !important; padding-right: calc(2.25rem + var(--tile-tab-size)/2) !important; }
}

/* Mobile: hide puzzle tabs and stack vertically */
@media (max-width: 959px) {
  .page-id-1632 #guide .grid{ grid-template-columns: 1fr !important; gap: 20px !important; }
  .page-id-1632 #guide .grid > div > div::before,
  .page-id-1632 #guide .grid > div > div::after{
    display: none !important;
  }
  .page-id-1632 #guide .grid > div > div{ padding: 1.5rem !important; min-height: auto !important; }
}

/* 1) Modern brand gold card for first box */
.page-id-1632 #guide .grid > div:nth-child(1) > div{
  position: relative !important;
  overflow: hidden !important;
  padding: 2.25rem !important;
  border-radius: 16px !important;
  /* unify to brand brown: #C5A059 (rgb 197,160,89) */
  border: 1px solid rgba(197,160,89,0.88) !important;
  background: linear-gradient(180deg, rgba(197,160,89,0.12) 0%, rgba(197,160,89,0.06) 60%), rgba(13,13,13,0.22) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.6), inset 0 10px 30px rgba(197,160,89,0.18) !important;
}

/* subtle gold glow/overlay to give depth */
.page-id-1632 #guide .grid > div:nth-child(1) > div::before{
  content: "";
  position: absolute;
  z-index: 0;
  inset: -10% -5% -30% -5%;
  background: radial-gradient(800px 360px at 20% 20%, rgba(197,160,89,0.28), rgba(197,160,89,0.09) 30%, rgba(0,0,0,0) 60%);
  filter: blur(26px);
  pointer-events: none;
  mix-blend-mode: screen;
}

/* Keep content on top of overlay */
.page-id-1632 #guide .grid > div:nth-child(1) > div *{ position: relative; z-index: 1; }

/* 1A) typography inside — make everything a nuanced gold */
.page-id-1632 #guide .grid > div:nth-child(1) > div h3{
  color: var(--sd-obsidian) !important;
  margin-bottom: .75rem !important;
}
.page-id-1632 #guide .grid > div:nth-child(1) > div p{ color: rgba(197,160,89,0.96) !important; }

/* 2) Second box — remove visual border/shadow so the first stands out */
.page-id-1632 #guide .grid > div:nth-child(2) > div{
  /* replicate first-card treatment with 'regular brand' brown */
  position: relative !important;
  overflow: hidden !important;
  padding: 2.25rem !important;
  border-radius: 16px !important;
  /* unify to brand brown for box 2 as well */
  border: 1px solid rgba(197,160,89,0.9) !important;
  background: linear-gradient(180deg, rgba(197,160,89,0.12) 0%, rgba(197,160,89,0.06) 60%), rgba(13,13,13,0.12) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.6), inset 0 10px 30px rgba(197,160,89,0.16) !important;
}

.page-id-1632 #guide .grid > div:nth-child(2) > div::before{
  content: "";
  position: absolute;
  z-index: 0;
  inset: -10% -5% -30% -5%;
  background: radial-gradient(800px 360px at 20% 20%, rgba(197,160,89,0.28), rgba(197,160,89,0.09) 30%, rgba(0,0,0,0) 60%);
  filter: blur(26px);
  pointer-events: none;
  mix-blend-mode: screen;
}
.page-id-1632 #guide .grid > div:nth-child(2) > div *{ position: relative; z-index: 1; }
.page-id-1632 #guide .grid > div:nth-child(2) > div h3{ color: var(--sd-obsidian) !important; }
.page-id-1632 #guide .grid > div:nth-child(2) > div p{ color: rgba(197,160,89,0.94) !important; }
.page-id-1632 #guide .grid > div:nth-child(3) > div{
  /* modern green treatment for third card */
  position: relative !important;
  overflow: hidden !important;
  padding: 2.25rem !important;
  border-radius: 16px !important;
  border: 1px solid rgba(197,160,89,0.9) !important; /* #C5A059 */
  background: linear-gradient(180deg, rgba(197,160,89,0.12) 0%, rgba(197,160,89,0.06) 60%), rgba(13,13,13,0.12) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.6), inset 0 10px 30px rgba(197,160,89,0.16) !important;
}

.page-id-1632 #guide .grid > div:nth-child(3) > div::before{
  content: "";
  position: absolute;
  z-index: 0;
  inset: -10% -5% -30% -5%;
  background: radial-gradient(800px 360px at 20% 20%, rgba(197,160,89,0.28), rgba(197,160,89,0.09) 30%, rgba(0,0,0,0) 60%);
  filter: blur(26px);
  pointer-events: none;
  mix-blend-mode: screen;
}
.page-id-1632 #guide .grid > div:nth-child(3) > div *{ position: relative; z-index: 1; }
.page-id-1632 #guide .grid > div:nth-child(3) > div h3{ color: var(--sd-obsidian) !important; }
.page-id-1632 #guide .grid > div:nth-child(3) > div p{ color: rgba(197,160,89,0.94) !important; }
/* Guide title consistency and spacing under subtitle */
.page-id-1632 .se-guide-title-main{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;color:var(--se-white);letter-spacing:.05em;text-transform:uppercase;font-size:clamp(36px,6vw,68px)}
.page-id-1632 .se-guide-title-sub{font-family:'Montserrat',system-ui,sans-serif;font-weight:800;color:var(--se-gold);letter-spacing:.08em;font-size:clamp(18px,3.5vw,28px);margin-top:6px;margin-bottom:40px}
.se-keeper{padding:60px 20px;max-width:none!important;width:100%!important}

/* --- SE: Keeper (biography, media, quote) (.se-keeper, .se-keeper-*) --- */
.page-id-1632 .se-keeper.wp-block-group.is-layout-constrained{max-width:none!important;width:100%!important}
.page-id-1632 .se-keeper .se-keeper-columns{max-width:min(95vw,1400px)!important}
.page-id-1632 .se-keeper .se-keeper-media img{border:2px solid var(--se-gold)!important;border-radius:12px!important;box-shadow:0 8px 24px rgba(var(--se-gold-rgb),.18)!important;background-color:transparent!important}
.page-id-1632 .se-keeper .se-keeper-title-sub{margin-bottom:40px!important}
.page-id-1632 .se-keeper .se-keeper-text{color:var(--se-white)!important;font-size:20px!important;line-height:1.8!important}
.page-id-1632 .se-keeper .se-keeper-quote{color:var(--se-white)!important;font-size:20px!important}
.se-keeper-header h2.se-keeper-name{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;color:var(--se-gold);letter-spacing:.06em;text-transform:uppercase;font-size:clamp(28px,5vw,48px)}
.se-keeper-header .se-keeper-role{font-family:'Montserrat',system-ui,sans-serif;font-weight:800;color:var(--se-gold);letter-spacing:.12em;text-transform:uppercase;margin-top:6px}
.se-keeper-columns{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:center;max-width:min(95vw,1400px);margin:24px auto 0}
.se-keeper-text{font-family:'Roboto Mono',monospace;color:var(--se-gold);line-height:1.7}
.se-keeper-quote{color:var(--sd-blood);font-style:italic;margin-top:12px}
.se-keeper-media img{display:block;width:100%;height:auto;border-radius:12px;max-width:520px;margin:0 auto}
@media (max-width:900px){.se-keeper-columns{grid-template-columns:1fr}.se-keeper-media img{max-width:360px}}
.page-id-1632 #invest{padding:60px 20px;max-width:none!important;width:100%!important}

/* --- SE: Invest & Pricing (#invest, .se-price, .se-hour) --- */
.page-id-1632 #invest .max-w-7xl{max-width:min(95vw,1400px)!important;margin:0 auto}
.se-invest-lead{font-family:'Roboto Mono',monospace;color:var(--se-white) !important;line-height:1.7;max-width:56rem;margin:0 auto}
.se-price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;align-items:stretch}
.se-price-card{position:relative;background:var(--sd-obsidian);border:2px solid rgba(var(--se-gold-rgb),.25);border-radius:10px;padding:32px;color:var(--se-gold)}
.se-price-card-center{border-color:rgba(var(--se-gold-rgb),.4)}
.se-price-recommended{
  /* Flow inside the card and sit above content, centered */
  position: relative;
  display:inline-block;
  margin:0 0 1rem 0;
  background: var(--sd-blood);
  color:var(--se-white)!important;
  padding:4px 12px;
  border-radius:6px;
  font-family:'Montserrat',system-ui,sans-serif;
  font-weight:800;
  letter-spacing:.06em;
}
.se-price-icon{display:flex;justify-content:center;margin-bottom:24px}
.se-price-icon svg{width:32px;height:32px;color:var(--se-gold)}
.se-price-title{font-family:'Montserrat',system-ui,sans-serif;font-weight:800;font-size:24px;color:var(--se-gold);text-align:center;margin-bottom:12px}
.se-price-sub{font-family:'Roboto Mono',monospace;color:var(--se-gold);opacity:.7;text-align:center!important;margin-bottom:24px;font-size:14px;min-height:3rem}
.se-price-amount{margin-bottom:24px;text-align:center}
.se-price-number{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;font-size:30px;color:var(--sd-blood);margin-bottom:8px}
.se-price-note{font-family:'Roboto Mono',monospace;color:rgba(var(--se-gold-rgb),.5);font-size:12px}
.se-price-features{margin-bottom:24px}
.se-price-features li{font-family:'Roboto Mono',monospace;color:var(--se-gold);opacity:.8;font-size:14px;display:flex;align-items:flex-start}
.se-marker{color:var(--sd-blood);margin-right:8px}
.se-price-button{display:block;width:100%;text-align:center;border:2px solid var(--se-gold);border-radius:8px;padding:10px 16px;font-family:'Montserrat',system-ui,sans-serif;font-weight:800;color:var(--se-gold);background:transparent;transition:all .2s ease}
.se-price-button.se-outline:hover{background-color:rgba(var(--se-gold-rgb),.1)}
.se-price-button.se-solid{background-color:var(--sd-blood);border-color:var(--sd-blood);color:var(--se-gold)}
.se-price-button.se-solid:hover{background-color:rgba(138,28,28,.85)}
.se-hour{margin-top:40px}
.se-hour-card{position:relative;max-width:56rem;margin:0 auto;background:var(--sd-obsidian);border:2px solid rgba(27,63,47,.4);padding:48px}
.se-hour-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--sd-glitch)}
.se-hour-icon{display:flex;justify-content:center;margin-bottom:16px}
.se-hour-icon svg{width:64px;height:64px;color:var(--se-gold)}
.se-hour-title{font-family:'Montserrat',system-ui,sans-serif;font-weight:900;color:var(--se-gold);text-align:center;font-size:clamp(24px,3.5vw,32px);margin-bottom:24px}
.se-hour-text p{font-family:'Roboto Mono',monospace;color:var(--se-gold);line-height:1.7}
.se-hour-call{text-align:center;font-family:'Montserrat',system-ui,sans-serif;font-weight:900;color:var(--se-gold);font-size:24px;margin-top:16px}
@media (max-width:900px){.se-price-grid{grid-template-columns:1fr}}

/* Overlay cleanup for final sections */
/* Restore leaf/overlay background; keep final sections clear via local backgrounds */
body.page-id-1632::before{display:block!important}
body.page-id-1632::after{display:block!important}
.page-id-1632 .slowdown-bg-overlay{display:block!important}

/* Improve visibility of the dotted overlay on smaller screens and increase contrast */
.page-id-1632 .slowdown-bg-overlay{display:block!important;position:fixed;inset:0;pointer-events:none;z-index:0}
.page-id-1632 .slowdown-bg-overlay::before{ /* slightly darker / denser overlay so it shows on phones */
  opacity: .20 !important;
  background-size: 18px 18px !important;
}
@media (max-width: 768px) {
  .page-id-1632 .slowdown-bg-overlay::before{
    opacity: .22 !important; /* make slightly stronger on small devices */
    background-size: 14px 14px !important; /* tighter dots to read better on high-dpi screens */
  }
}
/* .page-id-1632 .se-keeper .se-keeper-text, .page-id-1632 .se-keeper .se-keeper-quote{color:var(--se-white)!important} */
.page-id-1632 .se-keeper-inline-name{font-family:'Montserrat',system-ui,sans-serif;font-weight:800;color:var(--se-gold);letter-spacing:.06em;text-transform:uppercase;margin-bottom:12px}
.page-id-1632 .se-keeper{position:relative;background:transparent}
.page-id-1632 .se-keeper .se-keeper-columns,
.page-id-1632 .se-keeper .se-keeper-header,
.page-id-1632 .se-keeper .se-keeper-text,
.page-id-1632 .se-keeper .se-keeper-media{position:relative;z-index:1}

/* === SECTION: UI overrides — scroll-up button & secondary color (make gold) === */
/* The site uses var(--se-gold) as the canonical gold color. Ensure the "scroll to top"
   control uses that gold (for brand consistency) while keeping its glyph readable. */
#scroll-up,
a#scroll-up.secondary-color,
a#scroll-up.secondary-color.right {
  background-color: var(--se-gold) !important;
  color: var(--se-white) !important; /* keep the arrow visible */
  border-radius: 6px !important;
  box-shadow: 0 6px 18px rgba(var(--se-gold-rgb), 0.12) !important;
}

#scroll-up:hover,
a#scroll-up.secondary-color:hover {
  filter: brightness(0.95) !important;
}

 

/* === STRONG OVERRIDES: ensure guide cards show full image, white titles, and smaller padding === */
/* These are placed late in the file intentionally so they win against earlier rules
   (they use strong selectors + !important) */
body.page-id-1632 #guide .grid > div > div,
body.page-id-1632 #guide .grid > div:first-child > div,
body.page-id-1632 #guide .grid > div:last-child > div,
body.page-id-1632 #guide .grid > div > div {
  padding: 12px !important; /* much tighter boxes */
  min-height: 240px !important; /* avoid overly tall boxes */
  overflow: visible !important; /* allow images to be fully visible */
}

/* Force any per-tile nth-child padding to be small */
body.page-id-1632 #guide .grid > div:nth-child(1) > div,
body.page-id-1632 #guide .grid > div:nth-child(2) > div,
body.page-id-1632 #guide .grid > div:nth-child(3) > div {
  padding: 12px !important;
}

/* Ensure images show fully (no cropping) across all variants */
/* Desktop/tablet: center square/narrow artworks and constrain their size so the full
   image is visible inside the card. Mobile: make images width-first so they scale
   nicely across small screens. */
body.page-id-1632 #guide .grid > div > div .se-guide-card-image,
body.page-id-1632 #guide .grid > div > div .se-guide-figure img,
body.page-id-1632 #guide .grid > div > div picture img,
body.page-id-1632 #guide .se-guide-figure img {
  object-fit: contain !important;
  max-height: 320px !important;
  width: auto !important;
  max-width: 320px !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto !important;
}

@media (max-width: 768px){
  /* On small screens restore full-width, responsive behaviour */
  body.page-id-1632 #guide .grid > div > div .se-guide-card-image,
  body.page-id-1632 #guide .grid > div > div .se-guide-figure img,
  body.page-id-1632 #guide .grid > div > div picture img,
  body.page-id-1632 #guide .se-guide-figure img {
    max-height: none !important;
    width: 100% !important;
    max-width: 640px !important;
    height: auto !important;
  }
}

/* Force titles to brand white (override per-tile h3 color rules) */
body.page-id-1632 #guide .grid > div > div h3,
body.page-id-1632 #guide .se-guide-caption .se-guide-caption-title,
body.page-id-1632 #guide h3.se-guide-caption-title {
  color: var(--se-white) !important;
  text-shadow: none !important;
}

/* Specific overrides for the three tiles to ensure no overflow clipping and white titles
   (these are higher-specificity rules to beat earlier per-tile nth-child rules). */
.page-id-1632 #guide .grid > div:nth-child(1) > div,
.page-id-1632 #guide .grid > div:nth-child(2) > div,
.page-id-1632 #guide .grid > div:nth-child(3) > div {
  overflow: visible !important; /* allow full image display */
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.page-id-1632 #guide .grid > div:nth-child(1) > div h3,
.page-id-1632 #guide .grid > div:nth-child(2) > div h3,
.page-id-1632 #guide .grid > div:nth-child(3) > div h3 {
  color: var(--se-white) !important; /* force white title for each card */
  text-align: center !important;
}

/* Make sure the image sits centered in the card and isn't taller than the card's available
   visual space — scale it down if necessary but keep the full image visible. */
.page-id-1632 #guide .grid > div > div .se-guide-figure,
.page-id-1632 #guide .grid > div > div picture{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; }
.page-id-1632 #guide .grid > div > div picture img,
.page-id-1632 #guide .grid > div > div .se-guide-card-image{ max-width:360px !important; max-height:360px !important; width:auto !important; height:auto !important; margin:0 auto !important; object-fit:contain !important; }

/* Make sure the caption text is readable and not hidden under overlays */
body.page-id-1632 #guide .se-guide-caption,
body.page-id-1632 #guide .se-guide-caption-sub {
  color: var(--se-gold) !important;
  opacity: 1 !important;
}

/* Force the small "RECOMMENDED" badge to use brand gold on the Slow Down page
   (keeps background dark but makes the label appear golden per brand spec) */
body.page-id-1632 .se-price-recommended {
  color: var(--se-gold) !important;
  /* keep background and border as-is; color is the main change */
}

/* More specific override to beat rules that target .se-invest .se-price-card-center */
body.page-id-1632 .se-invest .se-price-card-center .se-price-recommended {
  color: var(--se-gold) !important;
}

/* Force additional spacing above the Hour card on Slow Down page
   Keep the base 4rem but add +50px to satisfy the user's request. */
body.page-id-1632 .se-hour {
  margin-top: calc(4rem + 50px) !important;
}

/* === FINAL OVERRIDES: ensure guide images show full square artwork and titles stay white === */
/* Place these late in the file so they beat any earlier per-tile/utility rules */
body.page-id-1632 #guide .grid > div > div {
  overflow: visible !important; /* ensure inner image is not clipped */
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* --- Category badge overlay (centered, gold background) for image cards --- */
@media (min-width: 768px) {
  /* position wrapper so the badge sits on top of the image */
  body.page-id-1632 .read-img.pos-rel.read-bg-img { position: relative !important; }

  /* center the category wrapper in the image area */
  body.page-id-1632 .read-img.pos-rel.read-bg-img .category-min-read-wrap {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 7 !important; /* above image but not blocking other controls */
    pointer-events: none !important; /* allow clicks to pass through except for the link */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
  }

  /* style the category links as a prominent gold badge */
  body.page-id-1632 .read-img.pos-rel.read-bg-img .read-categories .cat-links a.darknews-categories {
    pointer-events: auto !important; /* make the badge link clickable */
    background: linear-gradient(180deg, rgba(197,160,89,1), rgba(197,160,89,0.9)) !important; /* brand gold */
    color: var(--se-white) !important;
    padding: 0.5rem 0.8rem !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
    font-size: 0.9rem !important;
    text-transform: none !important;
    box-shadow: 0 6px 18px rgba(0,0,0,0.4) !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* handle multi-category (unlikely) by showing the first only or spacing them */
  body.page-id-1632 .read-img.pos-rel.read-bg-img .read-categories .cat-links li { margin: 0 6px !important; display:inline-block !important; }
}

/* Small screens: keep previous layout (category near image edge) */
@media (max-width: 767px) {
  body.page-id-1632 .read-img.pos-rel.read-bg-img .category-min-read-wrap { position: static !important; transform: none !important; pointer-events: none !important; }
  body.page-id-1632 .read-img.pos-rel.read-bg-img .read-categories .cat-links a.darknews-categories { background: rgba(0,0,0,0.08) !important; color: var(--se-white) !important; padding: .36rem .7rem !important; border-radius: 6px !important; }
}

body.page-id-1632 #guide .grid > div > div .se-guide-figure,
body.page-id-1632 #guide .grid > div > div picture {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  gap: 12px !important;
}

body.page-id-1632 #guide .grid > div > div .se-guide-card-image,
body.page-id-1632 #guide .grid > div > div picture img,
body.page-id-1632 #guide .se-guide-figure img {
  width: auto !important;
  height: auto !important;
  max-width: 420px !important;  /* give square art room to breathe */
  max-height: 420px !important; /* prevent vertical cropping */
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
}

/* caption/title guaranteed centered + white */
body.page-id-1632 #guide .se-guide-caption,
body.page-id-1632 #guide .se-guide-caption .se-guide-caption-title {
  text-align: center !important;
  color: var(--se-white) !important;
}

/* Desktop: put share buttons inline, smaller and aligned right inside keeper/keeper-wide */
@media (min-width: 960px) {
  body.page-id-1632 .se-share-buttons {
    display: flex !important;
    flex-direction: row !important;
    gap: 0.6rem !important;
    justify-content: flex-end !important; /* align right */
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: 100% !important;
  }

  body.page-id-1632 .se-share-buttons .se-share-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;        /* do not grow full width */
    min-width: 120px !important;   /* consistent small button width */
    padding: 0.35rem 0.75rem !important;
    font-size: 0.9rem !important;
    margin: 0 !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
  }
}