/* ==========================================================================
   Volviendo a Mí — Luxury Visual Overrides (Vogue/Chanel Aesthetic)
   v2: rendering-safe — content visible without jQuery, proper grids, refined spacing
   ========================================================================== */

/* === FOUNDATION === */

html { scroll-behavior: smooth !important; }

*, *::before, *::after { border-radius: 0 !important; }

/* Exception: avatar circles */
.avatar, .member-avatar, .user-avatar,
img[class*="avatar"], img[class*="circle"], .rounded-circle { border-radius: 50% !important; }

body {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  background-color: #0D0C08 !important;
  color: #F0E8DC !important;
}

body, p, li, .paragraph, [class*="body-text"] { line-height: 1.7 !important; }

/* Heading letter-spacing */
h1, .h1 { letter-spacing: -0.02em !important; font-weight: 300 !important; }
h2, .h2 { letter-spacing: -0.01em !important; font-weight: 300 !important; }
h3, .h3, h4, .h4 { letter-spacing: 0.02em !important; }

/* Labels & eyebrows */
.eyebrow, [class*="overline"], .category-label {
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

/* === FORCE-VISIBLE: kill any opacity:0 reveal that depends on missing JS === */
.kjb-section,
[class*="card"],
.product,
.blog-post,
.blog-listing,
.announcement,
.section,
.reveal {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* === BOOTSTRAP-LIKE GRID (Kajabi uses col-N classes) === */
.row {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-right: -12px !important;
  margin-left: -12px !important;
  width: auto !important;
}
.row > [class*="col-"] {
  padding-right: 12px !important;
  padding-left: 12px !important;
  box-sizing: border-box !important;
}
.col-1  { flex: 0 0 8.333% !important; max-width: 8.333% !important; }
.col-2  { flex: 0 0 16.666% !important; max-width: 16.666% !important; }
.col-3  { flex: 0 0 25% !important; max-width: 25% !important; }
.col-4  { flex: 0 0 33.333% !important; max-width: 33.333% !important; }
.col-5  { flex: 0 0 41.666% !important; max-width: 41.666% !important; }
.col-6  { flex: 0 0 50% !important; max-width: 50% !important; }
.col-7  { flex: 0 0 58.333% !important; max-width: 58.333% !important; }
.col-8  { flex: 0 0 66.666% !important; max-width: 66.666% !important; }
.col-9  { flex: 0 0 75% !important; max-width: 75% !important; }
.col-10 { flex: 0 0 83.333% !important; max-width: 83.333% !important; }
.col-11 { flex: 0 0 91.666% !important; max-width: 91.666% !important; }
.col-12 { flex: 0 0 100% !important; max-width: 100% !important; }

/* col-lg-* (desktop) */
@media (min-width: 992px) {
  .col-lg-1  { flex: 0 0 8.333% !important; max-width: 8.333% !important; }
  .col-lg-2  { flex: 0 0 16.666% !important; max-width: 16.666% !important; }
  .col-lg-3  { flex: 0 0 25% !important; max-width: 25% !important; }
  .col-lg-4  { flex: 0 0 33.333% !important; max-width: 33.333% !important; }
  .col-lg-5  { flex: 0 0 41.666% !important; max-width: 41.666% !important; }
  .col-lg-6  { flex: 0 0 50% !important; max-width: 50% !important; }
  .col-lg-7  { flex: 0 0 58.333% !important; max-width: 58.333% !important; }
  .col-lg-8  { flex: 0 0 66.666% !important; max-width: 66.666% !important; }
  .col-lg-9  { flex: 0 0 75% !important; max-width: 75% !important; }
  .col-lg-10 { flex: 0 0 83.333% !important; max-width: 83.333% !important; }
  .col-lg-11 { flex: 0 0 91.666% !important; max-width: 91.666% !important; }
  .col-lg-12 { flex: 0 0 100% !important; max-width: 100% !important; }
}

/* col-md-* (tablet) */
@media (min-width: 768px) {
  .col-md-3  { flex: 0 0 25% !important; max-width: 25% !important; }
  .col-md-4  { flex: 0 0 33.333% !important; max-width: 33.333% !important; }
  .col-md-6  { flex: 0 0 50% !important; max-width: 50% !important; }
  .col-md-8  { flex: 0 0 66.666% !important; max-width: 66.666% !important; }
  .col-md-9  { flex: 0 0 75% !important; max-width: 75% !important; }
  .col-md-12 { flex: 0 0 100% !important; max-width: 100% !important; }
}

@media (max-width: 991px) {
  .col-2, .col-3, .col-4 { flex: 0 0 50% !important; max-width: 50% !important; }
  .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11 { flex: 0 0 100% !important; max-width: 100% !important; }
  .col-lg-3, .col-lg-4, .col-lg-9 { flex: 0 0 100% !important; max-width: 100% !important; }
}
@media (max-width: 575px) {
  .col-2, .col-3, .col-4 { flex: 0 0 100% !important; max-width: 100% !important; }
}

.row.align-items-center { align-items: center !important; }
.row.align-items-start  { align-items: flex-start !important; }
.row.align-items-end    { align-items: flex-end !important; }
.row.align-items-stretch { align-items: stretch !important; }
.row.justify-content-center { justify-content: center !important; }
.row.justify-content-start  { justify-content: flex-start !important; }
.row.justify-content-end    { justify-content: flex-end !important; }
.row.justify-content-between { justify-content: space-between !important; }

/* === SECTION SPACING (single-layer only) === */
.kjb-section { padding: 0 !important; }

.kjb-section > section.section .sizer {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

/* Bigger top-level spacing on home page content sections */
#section-1773200000002 > section.section .sizer,
#section-1773200000003 > section.section .sizer,
#section-1773200000004 > section.section .sizer,
#section-1773200000005 > section.section .sizer,
#section-1773200000006 > section.section .sizer,
#section-1773200000007 > section.section .sizer,
#section-1778637024859 > section.section .sizer,
#section-1778637024859 .sizer {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Container max-widths */
.kjb-section > section.section .container {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}
.kjb-section > section.section .container--full {
  max-width: 100% !important;
}

/* === HEADER REFINEMENT — frosted matte translucent (Retiro pill aesthetic) === */
#section-header,
.kjb-section:has(.header) { padding: 0 !important; }

/* Strong selector chain to beat Kajabi core.css and the header--static /
   background-transparent runtime classes. The visual goal: a luxurious matte
   translucent panel — dark cream-tinted glass, frosted backdrop blur, subtle
   gold hairline below, faint noise grain on top for a non-plastic finish. */
html body .header,
html body .header.header--static,
html body .header.background-transparent,
html body .header.header--static.background-transparent {
  background-color: rgba(20, 18, 14, 0.55) !important;
  background-image:
    linear-gradient(180deg, rgba(20, 18, 14, 0.62) 0%, rgba(13, 12, 8, 0.5) 100%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.95  0 0 0 0 0.91  0 0 0 0 0.86  0 0 0 0.06 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>") !important;
  background-blend-mode: normal, soft-light !important;
  backdrop-filter: blur(18px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(180%) !important;
  border-bottom: 1px solid rgba(184, 146, 106, 0.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(240, 232, 220, 0.06),
    inset 0 -1px 0 rgba(184, 146, 106, 0.10),
    0 8px 32px rgba(0, 0, 0, 0.28) !important;
  padding: 0 !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  isolation: isolate !important;
}

/* Subtle inner-glow / vignette so the header feels like glass, not a flat fill */
html body .header::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(ellipse at top, rgba(196, 153, 60, 0.06) 0%, transparent 60%) !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

/* Vertically center all header blocks (logo, menu, CTA, etc.) */
.header .header__container,
.header .header__content--desktop,
.header .header__content--desktop > .container {
  display: flex !important;
  align-items: center !important;
}
.header .header__block,
.header .header__switch-content {
  display: flex !important;
  align-items: center !important;
}
.header #block-header_cta,
.header .header__block--cta { align-self: center !important; }
.header .container { max-width: 1340px !important; padding: 0 32px !important; }

.header .logo, .header [class*="logo"] {
  display: inline-flex !important;
  align-items: center !important;
}
.header .logo img,
.header [class*="logo"] img {
  max-height: 56px !important;
  width: auto !important;
}

.header .link-list,
.header nav { gap: 8px !important; }

.header a.link-list__link,
.header .link-list__link {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: rgba(240, 232, 220, 0.85) !important;
  padding: 10px 18px !important;
  text-decoration: none !important;
  position: relative !important;
  transition: color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1.0) !important;
}
.header a.link-list__link:hover,
.header .link-list__link:hover { color: #C4993C !important; }

.header a.link-list__link::after,
.header .link-list__link::after {
  content: '' !important;
  position: absolute !important;
  bottom: 4px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 0 !important;
  height: 1px !important;
  background: #C4993C !important;
  transition: width 0.4s cubic-bezier(0.25, 0.1, 0.25, 1.0) !important;
}
.header a.link-list__link:hover::after,
.header .link-list__link:hover::after { width: 24px !important; }

/* Header CTA button (gold) */
.header .btn,
.header [class*="btn"] {
  background-color: #C4993C !important;
  color: #0D0C08 !important;
  padding: 12px 28px !important;
  font-size: 11px !important;
  letter-spacing: 0.22em !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  border: 1px solid #C4993C !important;
  transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1.0) !important;
}
.header .btn:hover,
.header [class*="btn"]:hover {
  background-color: transparent !important;
  color: #C4993C !important;
  transform: translateY(-1px) !important;
}

/* === BUTTONS (general) === */
.btn,
[class*="btn-"],
input[type="submit"] {
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  padding: 14px 36px !important;
  transition: all 0.4s cubic-bezier(0.25, 0.1, 0.25, 1.0) !important;
}
.btn:hover,
[class*="btn-"]:hover,
input[type="submit"]:hover { transform: translateY(-1px) !important; }

/* === LIBRARY (products grid) === */
.products__list {
  margin-top: 32px !important;
}
.products__col {
  margin-bottom: 32px !important;
}
.products__col .product {
  background: rgba(45, 74, 62, 0.25) !important;
  border: 1px solid rgba(184, 146, 106, 0.18) !important;
  padding: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  text-align: center !important;
  transition: transform 0.4s cubic-bezier(0.25, 0.1, 0.25, 1.0), border-color 0.3s ease, box-shadow 0.4s ease !important;
}
.products__col .product:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(184, 146, 106, 0.5) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.35) !important;
}

/* Library product image */
.products__col .product__image,
.products__col [class*="product__image"],
.products__col .product img {
  width: 100% !important;
  aspect-ratio: 4/3 !important;
  object-fit: cover !important;
  background: linear-gradient(135deg, #1A3328, #0D0C08) !important;
  margin-bottom: 20px !important;
  display: block !important;
  max-height: 240px !important;
}

.products__col .product__title,
.products__col .product h1,
.products__col .product h2,
.products__col .product h3 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 22px !important;
  font-weight: 500 !important;
  color: #F0E8DC !important;
  margin: 8px 0 12px !important;
  line-height: 1.3 !important;
}
.products__col .product p,
.products__col .product .product__description {
  font-size: 14px !important;
  color: rgba(240, 232, 220, 0.65) !important;
  line-height: 1.6 !important;
  margin-bottom: 20px !important;
  flex: 1 !important;
}
.products__col .product .btn,
.products__col .product [class*="btn"] {
  background-color: #C4993C !important;
  color: #0D0C08 !important;
  border: 1px solid #C4993C !important;
  padding: 12px 28px !important;
  font-size: 11px !important;
  letter-spacing: 0.22em !important;
  margin-top: auto !important;
  align-self: center !important;
}
.products__col .product .btn:hover {
  background-color: transparent !important;
  color: #C4993C !important;
}

/* Library page title */
.products__heading,
.products__title,
.kjb-section > section.section h1:first-child,
.kjb-section > section.section h2:first-child {
  text-align: center !important;
  font-family: 'Cormorant Garamond', serif !important;
}

/* === STORE (custom cards / store_builder) === */
.store-builder .row,
.store-builder__list,
[class*="store"] .row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}
.custom-card,
.store-card,
.store-builder__col {
  background: rgba(45, 74, 62, 0.25) !important;
  border: 1px solid rgba(184, 146, 106, 0.18) !important;
  padding: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  text-align: center !important;
  margin-bottom: 32px !important;
  transition: transform 0.4s cubic-bezier(0.25, 0.1, 0.25, 1.0), border-color 0.3s ease, box-shadow 0.4s ease !important;
}
.custom-card:hover,
.store-card:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(184, 146, 106, 0.5) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.35) !important;
}

.custom-card img,
.store-card img,
.custom-card [class*="image"],
.store-card [class*="image"] {
  width: 100% !important;
  aspect-ratio: 4/3 !important;
  object-fit: cover !important;
  background: linear-gradient(135deg, #1A3328, #0D0C08) !important;
  margin-bottom: 20px !important;
  max-height: 260px !important;
}

/* Kajabi base SCSS forces .store-card__body to white — override so the
   green card tint shows through and the cream text stays legible */
.custom-card__body,
.store-card__body {
  background-color: transparent !important;
  padding: 24px 20px !important;
}

.custom-card h1, .custom-card h2, .custom-card h3,
.store-card h1, .store-card h2, .store-card h3,
.custom-card__title, .store-card__title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 24px !important;
  font-weight: 500 !important;
  color: #F0E8DC !important;
  margin: 8px 0 12px !important;
}
/* Defeat the inline style="color:..." that the snippet writes onto each
   text node so the readable cascade above wins */
.store-card__title[style],
.store-card__description[style],
.store-card__price[style],
.custom-card__title[style],
.custom-card__description[style],
.custom-card__price[style] { color: inherit; }
.store-card__title { color: #F0E8DC !important; }
.store-card__description { color: rgba(240, 232, 220, 0.78) !important; }
.store-card__price { color: #C4993C !important; }
.custom-card p, .store-card p,
.custom-card__description, .store-card__description {
  font-size: 14px !important;
  color: rgba(240, 232, 220, 0.65) !important;
  line-height: 1.6 !important;
  margin-bottom: 16px !important;
  flex: 1 !important;
}
.custom-card .price, .store-card .price,
.custom-card__price, .store-card__price {
  color: #C4993C !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  margin: 12px 0 20px !important;
}

/* === ANNOUNCEMENTS === */
.announcements {
  padding: 80px 24px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
}
.announcements__header {
  text-align: center !important;
  margin-bottom: 48px !important;
  border-bottom: 1px solid rgba(184, 146, 106, 0.18) !important;
  padding-bottom: 32px !important;
}
.announcements__title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 48px !important;
  font-weight: 300 !important;
  color: #F0E8DC !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 16px !important;
}
.announcement-search {
  display: flex !important;
  gap: 12px !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  margin-top: 24px !important;
}
.announcement-search input,
.announcement-search select {
  background: rgba(45, 74, 62, 0.3) !important;
  border: 1px solid rgba(184, 146, 106, 0.25) !important;
  color: #F0E8DC !important;
  padding: 12px 16px !important;
  font-size: 13px !important;
  min-width: 200px !important;
}
.announcement-search .btn {
  background-color: #C4993C !important;
  color: #0D0C08 !important;
  border: 1px solid #C4993C !important;
}

.announcements__announcements { display: block !important; }
.announcements__col { padding: 0 !important; }

.announcement {
  background: rgba(45, 74, 62, 0.18) !important;
  border: 1px solid rgba(184, 146, 106, 0.18) !important;
  border-left: 3px solid #C4993C !important;
  padding: 28px 32px !important;
  margin-bottom: 20px !important;
  color: #F0E8DC !important;
  transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1.0), border-color 0.3s ease !important;
}
.announcement:hover {
  transform: translateX(4px) !important;
  border-color: rgba(184, 146, 106, 0.4) !important;
  border-left-color: #C4993C !important;
}
.announcement.background-color-F0E8DC {
  background: rgba(45, 74, 62, 0.18) !important;
}
.announcement .announcement__product,
.announcement p.announcement__product {
  font-size: 11px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #C4993C !important;
  margin-bottom: 8px !important;
  font-weight: 500 !important;
}
.announcement .announcement__title,
.announcement h3.announcement__title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 24px !important;
  font-weight: 500 !important;
  color: #F0E8DC !important;
  margin: 0 0 8px !important;
  letter-spacing: -0.005em !important;
  text-transform: none !important;
}
.announcement .announcement__date,
.announcement p.announcement__date {
  font-size: 13px !important;
  color: rgba(240, 232, 220, 0.55) !important;
  margin: 0 0 12px !important;
  letter-spacing: 0.04em !important;
}
.announcement .announcement__description,
.announcement .announcement__body,
.announcement div.announcement__body,
.announcement p {
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: rgba(240, 232, 220, 0.85) !important;
  margin: 8px 0 !important;
}
.announcement .announcement__link,
.announcement a.announcement__link {
  color: #C4993C !important;
  text-decoration: none !important;
  border-bottom: 1px solid transparent !important;
  font-size: 11px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  margin-top: 8px !important;
  display: inline-block !important;
}
.announcement .announcement__link:hover { border-bottom-color: #C4993C !important; }
.announcement a {
  color: #C4993C !important;
  text-decoration: none !important;
  border-bottom: 1px solid transparent !important;
  font-size: 12px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  transition: border-color 0.3s ease !important;
}
.announcement a:hover { border-bottom-color: #C4993C !important; }

/* === BLOG LISTING === */
.blog-listings {
  padding: 0 !important;
}
.blog-listings .sizer {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}
.blog-listings .container {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}
.blog-listings__content { padding-right: 24px !important; }
@media (max-width: 991px) {
  .blog-listings__content { padding-right: 0 !important; }
}

.blog-listings__heading,
.blog-listings__header h1,
.blog-listings__title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 48px !important;
  font-weight: 300 !important;
  color: #F0E8DC !important;
  margin-bottom: 32px !important;
  letter-spacing: -0.01em !important;
}

.blog-listing,
.blog-search-result {
  background: rgba(45, 74, 62, 0.18) !important;
  border: 1px solid rgba(184, 146, 106, 0.18) !important;
  padding: 32px !important;
  margin-bottom: 24px !important;
  color: #F0E8DC !important;
  transition: transform 0.4s cubic-bezier(0.25, 0.1, 0.25, 1.0), border-color 0.3s ease, box-shadow 0.4s ease !important;
}
.blog-listing__panel {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}
.blog-listing__media,
.blog-listing__media img {
  width: 100% !important;
  max-height: 320px !important;
  object-fit: cover !important;
  margin-bottom: 20px !important;
  display: block !important;
}
.blog-listing__media:empty { display: none !important; }

.blog-listing:hover,
.blog-search-result:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(184, 146, 106, 0.45) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3) !important;
}
.blog-listing__title,
.blog-search-result__title,
.blog-listing h2, .blog-listing h3,
.blog-search-result h2, .blog-search-result h3,
a.blog-listing__title,
a.h3.blog-listing__title,
.blog-listing a.h3 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 28px !important;
  font-weight: 500 !important;
  color: #F0E8DC !important;
  margin: 0 0 12px !important;
  line-height: 1.25 !important;
  display: block !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: -0.01em !important;
}
.blog-listing__title:hover,
a.blog-listing__title:hover { color: #C4993C !important; }
.blog-listing__title a,
.blog-search-result__title a {
  color: #F0E8DC !important;
  text-decoration: none !important;
  transition: color 0.3s ease !important;
}
.blog-listing__title a:hover,
.blog-search-result__title a:hover { color: #C4993C !important; }
.blog-listing__date {
  font-size: 11px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: rgba(240, 232, 220, 0.55) !important;
  margin: 8px 0 12px !important;
  display: inline-block !important;
}
.blog-listing__tags { display: inline-flex !important; gap: 6px !important; flex-wrap: wrap !important; margin: 8px 0 !important; }
.blog-listing__content {
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: rgba(240, 232, 220, 0.75) !important;
  margin: 12px 0 16px !important;
}
.blog-listing__more {
  display: inline-block !important;
  margin-top: 12px !important;
  color: #C4993C !important;
  font-size: 11px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border-bottom: 1px solid transparent !important;
  padding-bottom: 2px !important;
}
.blog-listing__more:hover { border-bottom-color: #C4993C !important; }
.tag {
  display: inline-block !important;
  font-size: 10px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: #C4993C !important;
  background: transparent !important;
  padding: 4px 10px !important;
  border: 1px solid rgba(184, 146, 106, 0.4) !important;
  margin: 2px 4px 2px 0 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
.tag:hover {
  background: rgba(184, 146, 106, 0.12) !important;
  color: #D4AD7A !important;
}

.blog-listing__category,
.blog-search-result__category,
.blog-listing__tag,
[class*="blog-listing__tag"] {
  display: inline-block !important;
  font-size: 10px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: #C4993C !important;
  padding: 4px 10px !important;
  border: 1px solid rgba(184, 146, 106, 0.4) !important;
  margin: 4px 6px 4px 0 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

.blog-listing__excerpt,
.blog-search-result__excerpt,
.blog-listing p,
.blog-search-result p {
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: rgba(240, 232, 220, 0.75) !important;
  margin: 12px 0 16px !important;
}

.blog-listing__read-more,
.blog-search-result__read-more,
.blog-listing__more {
  color: #C4993C !important;
  font-size: 11px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border-bottom: 1px solid transparent !important;
  transition: border-color 0.3s ease !important;
  display: inline-block !important;
  margin-top: 12px !important;
}
.blog-listing__read-more:hover,
.blog-search-result__read-more:hover,
.blog-listing__more:hover {
  border-bottom-color: #C4993C !important;
}

/* Blog/Newsletter sidebar — flatten nested panels */
.sidebar {
  position: sticky !important;
  top: 100px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}
.sidebar__panel {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
}
.sidebar__block {
  background: rgba(45, 74, 62, 0.18) !important;
  border: 1px solid rgba(184, 146, 106, 0.16) !important;
  padding: 24px 22px !important;
  margin-bottom: 16px !important;
}
.sidebar__block h3,
.sidebar__title,
.sidebar h3,
.sidebar__block-title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  color: #F0E8DC !important;
  margin: 0 0 14px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(184, 146, 106, 0.2) !important;
  letter-spacing: 0.02em !important;
}
.sidebar ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.sidebar li {
  padding: 6px 0 !important;
  font-size: 13px !important;
}
.sidebar a {
  color: rgba(240, 232, 220, 0.8) !important;
  text-decoration: none !important;
  font-size: 13px !important;
  letter-spacing: 0.04em !important;
  transition: color 0.3s ease !important;
}
.sidebar a:hover { color: #C4993C !important; }

/* Sidebar search */
.sidebar input[type="search"],
.sidebar input[type="text"] {
  width: 100% !important;
  background: rgba(13, 12, 8, 0.5) !important;
  border: 1px solid rgba(184, 146, 106, 0.25) !important;
  color: #F0E8DC !important;
  padding: 10px 14px !important;
  font-size: 13px !important;
}
.sidebar__search {
  display: flex !important;
  gap: 6px !important;
  align-items: stretch !important;
}
.sidebar__search button,
.sidebar__search .btn {
  padding: 6px 12px !important;
  background: rgba(196, 153, 60, 0.15) !important;
  border: 1px solid rgba(196, 153, 60, 0.3) !important;
  color: #C4993C !important;
}

/* Social icons in sidebar */
.sidebar .social-icons,
.sidebar__social-icons,
.social-icons {
  display: inline-flex !important;
  gap: 10px !important;
  align-items: center !important;
}
.sidebar .social-icons__icon,
.social-icons__icon {
  width: 36px !important;
  height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(196, 153, 60, 0.1) !important;
  border: 1px solid rgba(196, 153, 60, 0.3) !important;
  color: #C4993C !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
}
.sidebar .social-icons__icon:hover,
.social-icons__icon:hover {
  background: #C4993C !important;
  color: #0D0C08 !important;
}

/* === BLOG POST === */
.blog-post-body,
.sales-page-body {
  max-width: 800px !important;
  margin: 0 auto !important;
  padding: 80px 24px !important;
}
.blog-post-body__title,
.blog-post-body h1 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(2.5rem, 1.8rem + 2.5vw, 3.75rem) !important;
  font-weight: 300 !important;
  color: #F0E8DC !important;
  letter-spacing: -0.02em !important;
  line-height: 1.1 !important;
  margin-bottom: 24px !important;
  text-align: center !important;
}
.blog-post-body__meta,
.blog-post-body__date {
  text-align: center !important;
  color: rgba(240, 232, 220, 0.55) !important;
  font-size: 12px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  margin-bottom: 32px !important;
}
.blog-post-body__category,
.blog-post-body__tag {
  display: inline-block !important;
  font-size: 10px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: #C4993C !important;
  padding: 4px 10px !important;
  border: 1px solid rgba(184, 146, 106, 0.4) !important;
  margin: 4px 6px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
.blog-post-body__content,
.blog-post-body p {
  font-size: 17px !important;
  line-height: 1.85 !important;
  color: rgba(240, 232, 220, 0.9) !important;
  margin-bottom: 24px !important;
}
.blog-post-body img {
  width: 100% !important;
  max-height: 480px !important;
  object-fit: cover !important;
  margin: 32px 0 !important;
}
.blog-post-body h2 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 32px !important;
  font-weight: 400 !important;
  color: #F0E8DC !important;
  margin: 48px 0 16px !important;
}
.blog-post-body h3 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 24px !important;
  font-weight: 500 !important;
  color: #C4993C !important;
  margin: 32px 0 12px !important;
}

/* Blog post opt-in / CTA */
.blog-post-body__opt-in,
.blog-post-body__cta {
  background: rgba(45, 74, 62, 0.3) !important;
  border: 1px solid rgba(184, 146, 106, 0.25) !important;
  padding: 40px 32px !important;
  margin: 48px 0 !important;
  text-align: center !important;
}
.blog-post-body__opt-in h2,
.blog-post-body__opt-in h3,
.blog-post-body__cta h2,
.blog-post-body__cta h3 {
  margin-top: 0 !important;
}

/* === FOOTER === */
.footer {
  background: #0D0C08 !important;
  border-top: 1px solid rgba(184, 146, 106, 0.15) !important;
  padding: 64px 24px 32px !important;
  color: rgba(240, 232, 220, 0.65) !important;
}
.footer a {
  color: rgba(240, 232, 220, 0.75) !important;
  text-decoration: none !important;
  font-size: 12px !important;
  letter-spacing: 0.1em !important;
}
.footer a:hover { color: #C4993C !important; }
.footer .container { max-width: 1240px !important; margin: 0 auto !important; }

/* === GENERAL CARD HOVER === */
img:not([class*="avatar"]):not([class*="logo"]):not([class*="icon"]) {
  transition: transform 0.6s cubic-bezier(0.25, 0.1, 0.25, 1.0) !important;
}
[class*="card"]:hover img:not([class*="avatar"]):not([class*="logo"]),
.products__col .product:hover img,
.custom-card:hover img,
.store-card:hover img {
  transform: scale(1.04) !important;
}

/* === SELECTION & SCROLLBAR === */
::selection { background: rgba(196, 153, 60, 0.3) !important; color: inherit !important; }
::-webkit-scrollbar { width: 8px !important; }
::-webkit-scrollbar-track { background: rgba(13, 12, 8, 0.6) !important; }
::-webkit-scrollbar-thumb { background: rgba(184, 146, 106, 0.4) !important; }
::-webkit-scrollbar-thumb:hover { background: rgba(184, 146, 106, 0.7) !important; }

/* === LIBRARY/PRODUCTS HEADING === */
.products {
  padding: 0 !important;
}
.products .sizer {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}
.products .container { max-width: 1240px !important; padding: 0 24px !important; }
.products__heading,
.products__heading h2,
.products .products__heading {
  text-align: center !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 42px !important;
  font-weight: 300 !important;
  letter-spacing: -0.01em !important;
  color: #F0E8DC !important;
  margin: 0 0 48px !important;
}
.products__heading + * { margin-top: 16px !important; }

/* Hide empty course outline + assessment placeholders */
.course-outline:empty,
.course-outline-category:empty,
.assessment:empty,
.course-outline__category--empty,
[class*="course-outline"]:not(:has(*)) {
  display: none !important;
}

/* Course outline styling — when present, look nice */
.course-outline,
[class*="course-outline"] {
  max-width: 800px !important;
  margin: 32px auto !important;
}
.course-outline-category__title,
.course-outline__title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 22px !important;
  color: #F0E8DC !important;
  margin-bottom: 12px !important;
}

/* === ANNOUNCEMENTS HEADER LINK LIST (no large empty space) === */
#section-1598294888649 > section.section .sizer {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}
#section-1598294888649 .section__overlay {
  display: none !important;
}
#section-1598294888649 .link-list {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 24px !important;
  flex-wrap: wrap !important;
}
#section-1598294888649 .link-list__title {
  display: none !important;
}
#section-1598294888649 .link-list__links {
  display: flex !important;
  gap: 24px !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
}
#section-1598294888649 .link-list__link {
  color: rgba(240, 232, 220, 0.7) !important;
  font-size: 11px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  padding: 6px 12px !important;
  transition: color 0.3s ease !important;
}
#section-1598294888649 .link-list__link:hover { color: #C4993C !important; }
.link-list--header { padding: 12px 0 !important; }

/* === HIDE BROKEN PLACEHOLDER ICONS THAT RENDER FULL-SIZE === */
.product__image:empty,
.custom-card__image:empty,
.store-card__image:empty,
.product__image svg.placeholder,
.custom-card svg.placeholder,
.store-card svg.placeholder {
  display: block !important;
  width: 100% !important;
  height: 220px !important;
  background: linear-gradient(135deg, #1A3328 0%, #2D4A3E 50%, #0F1A18 100%) !important;
}
.product__image svg,
.custom-card svg,
.store-card svg {
  max-width: 64px !important;
  max-height: 64px !important;
  opacity: 0.35 !important;
}

/* === HERO/SECTION OVERLAY FIX (was rendering empty rectangles & covering content) === */
.section__overlay {
  pointer-events: none !important;
  z-index: 0 !important;
  background-color: transparent !important;
}
.section, .announcements, .blog-listings, .products, .blog-post-body, .sales-page-body {
  position: relative !important;
}
.section > .sizer, .announcements > .sizer, .blog-listings > .sizer,
.products > .sizer, .blog-post-body > .sizer, .sales-page-body > .sizer {
  position: relative !important;
  z-index: 1 !important;
}

/* === FULLSCREEN MOBILE MENU OVERLAY === */
body.menu-open {
  overflow: hidden !important;
  position: fixed !important;
  width: 100% !important;
  height: 100% !important;
}

@media (max-width: 991px) {
  .header__content--mobile {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-height: none !important;
    background: rgba(13, 12, 8, 0.97) !important;
    backdrop-filter: blur(24px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(160%) !important;
    z-index: 9998 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                visibility 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    overflow-y: auto !important;
    padding: 80px 24px 40px !important;
  }
  .header__content--mobile[style*="max-height"],
  .header__content--mobile.is-open { opacity: 1 !important; visibility: visible !important; }
  .header__content--mobile .link-list__link {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 28px !important;
    font-weight: 300 !important;
    letter-spacing: 0.05em !important;
    text-transform: none !important;
    color: rgba(247, 240, 226, 0.85) !important;
    padding: 16px 24px !important;
    display: block !important;
    text-align: center !important;
  }
  .hamburger { z-index: 9999 !important; position: relative !important; }
  .header { z-index: 10000 !important; }
}
