/* ============================================================
   WISDOM PAGE — 1:1 Figma rebuild
   Page frame: 1920 x 7425 (excluding global header chrome)
   Section vertical map (all in page-absolute Y):
     Hero:                  175 -> 877      (h 702)
     Compass cream band:    877 -> 1622     (h 745)
     Spacer (white):       1622 -> 1722     (h 100)
     Satsang glass card:   1722 -> 2189     (h 467)
     Spacer (white):       2189 -> 2289     (h 100)
     Offerings heading:    2289 -> 2347     (h 58)
     Offering card 1:      2397 -> 3260     (h 863)
     Offering card 2:      3310 -> 3937     (h 627)
     Quote band:           3937 -> 4366     (h 429)
     Inside Experience:    4466 -> 5380     (heading + card 786)
     Upcoming Events:      5614 -> 6581     (heading + grid + nav)
     Spacer to footer:     6581 -> 6701     (h 120)
   All sizes scale proportionally below 1920vp via
     min(Xpx, calc(X / 1920 * 100vw))
============================================================ */

/* ===== UNIVERSAL RESET — kill base styles.css paddings/gaps so per-section
   Figma values are not fighting clamp() defaults. ===== */
body[data-page="wisdom"] section,
body[data-page="wisdom"] [class*="__inner"]:not(.inner-hero__inner) {
  padding-top: 0;
  padding-bottom: 0;
  gap: 0;
  min-height: 0;
}
body[data-page="wisdom"] {
  background: #FAFAFA;
}

/* ============ HERO ============ */
body[data-page="wisdom"] .inner-hero {
  width: 100%;
  height: min(702px, calc(702 / 1920 * 100vw));
  position: relative;
  overflow: hidden;
}
body[data-page="wisdom"] .inner-hero__image {
  position: absolute; inset: 0;
  background-size: cover;
  /* Per user image #109 + 20-position visual comparison: 75% gives
     balcony tier at the top, dais small on the left, crowd middle,
     foreground hands-raised close-up at the bottom — strongest match
     to the user's reference crop. Visible source slice: y=434..1136
     of the 1920x1280 asset. */
  background-position: left 53.3%; /* QC r47: Figma mask-y=308 -> Bapa on the dais (upper-left) visible */
}
body[data-page="wisdom"] .inner-hero__veil {
  position: absolute; inset: 0;
  /* Figma rect 34624541: linear-gradient(90deg, rgba(132,132,132,0.32) 37.5%,
     rgba(42,42,42,0.64) 55%) rotated 180deg -> mirrored to 270deg. */
  background: linear-gradient(270deg, rgba(132,132,132,0.32) 37.5%, rgba(42,42,42,0.64) 55%);
}
body[data-page="wisdom"] .inner-hero__inner {
  position: absolute;
  left: min(149px, calc(149 / 1920 * 100vw));
  top: min(528px, calc(528 / 1920 * 100vw)); /* 703 - 175 = 528 within hero */
  width: min(785px, calc(785 / 1920 * 100vw));
  height: auto !important;
  min-height: 0 !important;
  padding: 0; margin: 0;
  text-align: left;
}
body[data-page="wisdom"] .inner-hero__kicker {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(24 / 20);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #FFFFFF;
  /* Figma kicker is a single 785-wide line; nowrap so the title block
     never breaks mid-phrase (user image #83). margin-bottom 0 because
     the browser's rendered Inter line-box adds ~12px over the spec
     height, which would push the title +12 below Figma otherwise. */
  margin: 0;
  white-space: nowrap;
}
body[data-page="wisdom"] .inner-hero__title {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(64px, calc(64 / 1920 * 100vw));
  line-height: calc(80 / 64);
  color: #FFFFFF;
  margin: 0;
}

/* Hero CTA pill — Figma node Button/Secondary at (1520, 742):
   width 273, height 60, bg #FAFAFA, radius 40, label Inter Medium 16/20
   #5E2A29 + brown filled-circle chevron arrow. */
body[data-page="wisdom"] .wisdom-hero-cta {
  position: absolute;
  left: min(1520px, calc(1520 / 1920 * 100vw));
  top: min(567px, calc(567 / 1920 * 100vw)); /* 742 - 175 = 567 within hero */
  width: min(273px, calc(273 / 1920 * 100vw));
  height: min(60px, calc(60 / 1920 * 100vw));
  background: #FAFAFA;
  border-radius: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: min(12px, calc(12 / 1920 * 100vw));
  text-decoration: none;
  padding: min(10px, calc(10 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw));
  box-sizing: border-box;
  z-index: 2;
}
body[data-page="wisdom"] .wisdom-hero-cta__label {
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  font-size: min(16px, calc(16 / 1920 * 100vw));
  line-height: calc(20 / 16);
  color: #5E2A29;
  white-space: nowrap;
}
body[data-page="wisdom"] .wisdom-hero-cta__arrow {
  width: min(20px, calc(20 / 1920 * 100vw));
  height: min(20px, calc(20 / 1920 * 100vw));
  display: block;
  flex-shrink: 0;
  overflow: visible;
  transition: transform 0.2s ease;
}
/* Hero pill hover — Figma's Button/Secondary inverts on hover:
   the #FAFAFA cream background becomes the brand brown, the label
   flips to white, and the inner circle inverts (white circle, brown
   chevron). */
body[data-page="wisdom"] .wisdom-hero-cta {
  transition: background 0.25s ease, color 0.25s ease;
}
body[data-page="wisdom"] .wisdom-hero-cta:hover {
  background: #5E2A29;
}
body[data-page="wisdom"] .wisdom-hero-cta:hover .wisdom-hero-cta__label {
  color: #FAFAFA;
}
body[data-page="wisdom"] .wisdom-hero-cta:hover .wisdom-hero-cta__arrow rect {
  fill: #FAFAFA;
}
body[data-page="wisdom"] .wisdom-hero-cta:hover .wisdom-hero-cta__arrow path {
  stroke: #5E2A29;
}

/* ============ RESET YOUR INNER COMPASS — cream band 877->1622 ============ */
body[data-page="wisdom"] .wisdom-compass {
  position: relative;
  width: 100%;
  height: min(745px, calc(745 / 1920 * 100vw));
  background: rgba(240, 234, 222, 0.5);
}
body[data-page="wisdom"] .wisdom-compass__photo {
  position: absolute;
  left: min(149px, calc(149 / 1920 * 100vw));
  top: min(105px, calc(105 / 1920 * 100vw)); /* 982 - 877 = 105 */
  width: min(801px, calc(801 / 1920 * 100vw));
  height: min(534px, calc(534 / 1920 * 100vw));
  background-size: cover;
  background-position: center;
  border-radius: min(8px, calc(8 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-compass__copy {
  position: absolute;
  left: min(1066px, calc(1066 / 1920 * 100vw));
  top: min(117px, calc(117 / 1920 * 100vw)); /* 994 - 877 = 117 */
  width: min(698px, calc(698 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-compass__copy h2 {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(52px, calc(52 / 1920 * 100vw));
  line-height: calc(58 / 52);
  text-transform: capitalize;
  color: #5E2A29;
  margin: 0;
  width: min(601px, calc(601 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-compass__copy p {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(38 / 20);
  color: #282828;
  margin: 0;
}
body[data-page="wisdom"] .wisdom-compass__lead {
  width: min(650px, calc(650 / 1920 * 100vw));
  margin-top: min(25px, calc(25 / 1920 * 100vw)) !important;
}
body[data-page="wisdom"] .wisdom-compass__intro {
  margin-top: min(25px, calc(25 / 1920 * 100vw)) !important;
}
body[data-page="wisdom"] .wisdom-compass__bullets {
  list-style: none;
  margin: min(23px, calc(23 / 1920 * 100vw)) 0 0 !important;
  padding: 0;
  display: flex; flex-direction: column;
  gap: min(25px, calc(25 / 1920 * 100vw)); /* 73 pitch - 48 cell = 25 */
}
body[data-page="wisdom"] .wisdom-compass__bullets li {
  position: relative;
  padding-left: min(24px, calc(24 / 1920 * 100vw));
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(36 / 20);
  color: #282828;
  min-height: min(48px, calc(48 / 1920 * 100vw));
  display: flex; align-items: center;
}
body[data-page="wisdom"] .wisdom-compass__bullets li::before {
  /* Figma uses a 48x4 rect rotated -90deg -> effective 4 wide x 48 tall. */
  content: '';
  position: absolute; left: 0; top: 0;
  width: min(4px, calc(4 / 1920 * 100vw));
  height: min(48px, calc(48 / 1920 * 100vw));
  background: #BEA884;
}

/* ============ SAT·SANG GLASS CARD ============ */
body[data-page="wisdom"] .wisdom-satsang {
  position: relative;
  width: 100%;
  /* 100px white spacer + 467 card = 567 */
  height: min(567px, calc(567 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-satsang__card {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: min(100px, calc(100 / 1920 * 100vw));
  width: min(950px, calc(950 / 1920 * 100vw));
  height: min(467px, calc(467 / 1920 * 100vw));
  border-radius: min(8px, calc(8 / 1920 * 100vw));
  overflow: hidden;
}
body[data-page="wisdom"] .wisdom-satsang__bg {
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
}
body[data-page="wisdom"] .wisdom-satsang__overlay {
  position: absolute; inset: 0;
  background: rgba(248, 248, 248, 0.3);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
body[data-page="wisdom"] .wisdom-satsang__content {
  position: relative;
  z-index: 1;
  /* From Figma: content top at 1800 in page (card top 1722) -> 78 inside card.
     Content left at 602 (card left 485) -> 117 inside card. */
  padding: min(78px, calc(78 / 1920 * 100vw))
           min(117px, calc(117 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-satsang__title {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(40px, calc(40 / 1920 * 100vw));
  /* Figma title uses line-height 28 (smaller than font-size 40) so the
     box is 28 tall, not 40. Without this the next element (pos) sat
     +13px below Figma. */
  line-height: calc(28 / 40);
  color: #46474B;
  margin: 0;
}
body[data-page="wisdom"] .wisdom-satsang__pos {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(28 / 20);
  letter-spacing: 0.02em;
  color: #9C9C9C;
  margin: min(27px, calc(27 / 1920 * 100vw)) 0 0;
}
body[data-page="wisdom"] .wisdom-satsang__definition {
  font-family: 'STIX Two Text', serif; font-style: italic; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(30 / 20);
  letter-spacing: 0.02em;
  color: #46474B;
  margin: min(22px, calc(22 / 1920 * 100vw)) 0 0;
  width: min(464px, calc(464 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-satsang__sep {
  border: none;
  border-top: 1px solid #46474B;
  width: min(717px, calc(717 / 1920 * 100vw));
  margin: min(35px, calc(35 / 1920 * 100vw)) 0 0;
}
body[data-page="wisdom"] .wisdom-satsang__body {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(38 / 20);
  color: #282828;
  width: min(702px, calc(702 / 1920 * 100vw));
  margin: min(35px, calc(35 / 1920 * 100vw)) 0 0;
}

/* ============ WISDOM OFFERINGS ============ */
body[data-page="wisdom"] .wisdom-offerings {
  position: relative;
  width: 100%;
  padding: min(100px, calc(100 / 1920 * 100vw)) 0 min(50px, calc(50 / 1920 * 100vw)); /* QC r40: 50px gap sessions->quote band (Figma updated) */
}
body[data-page="wisdom"] .wisdom-offerings__heading {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(52px, calc(52 / 1920 * 100vw));
  line-height: calc(58 / 52);
  text-transform: capitalize;
  color: #5E2A29;
  text-align: center;
  margin: 0;
}

body[data-page="wisdom"] .wisdom-offering {
  width: min(1619px, calc(1619 / 1920 * 100vw));
  margin: min(50px, calc(50 / 1920 * 100vw)) auto 0;
  /* Solid #F5F2EC per user spec — the rgba(240,234,222,0.5) blended
     against the white page bg to ~#F8F4EE which made the icon's
     white-PNG-multiply area read as a slightly off cream tile.
     Pinning to the exact target lines them up. */
  background: #F5F2EC;
  border-radius: min(8px, calc(8 / 1920 * 100vw));
  position: relative;
  box-sizing: border-box;
  overflow: hidden;
}
/* Lock card heights to Figma so per-section drift stays under 10px.
   Card 1 (Satsangs): pad-top 58, pad-bot 43 -> content area 762 fits
   icon 105 + 22 + title 35 + 12 + body ~190 + 10 + videos ~392. */
body[data-page="wisdom"] .wisdom-offering--satsang {
  height: min(863px, calc(863 / 1920 * 100vw));
  padding: min(58px, calc(58 / 1920 * 100vw))
           min(102px, calc(102 / 1920 * 100vw))
           min(43px, calc(43 / 1920 * 100vw));
}
/* Card 2 (Sessions): copy column sits LOWER (icon at Figma y=3441 inside
   card y=3310 -> 131 inset top). Photo is independent — Figma frame
   638 x 600 at y=3323 -> 13 top inset, 14 bottom inset. Set the card
   to position:relative with side-only padding; copy column gets its
   own vertical insets; photo positioned absolutely with the exact
   Figma rectangle. */
body[data-page="wisdom"] .wisdom-offering--sessions {
  margin-top: min(50px, calc(50 / 1920 * 100vw));
  height: min(627px, calc(627 / 1920 * 100vw));
  padding: 0 min(61px, calc(61 / 1920 * 100vw))
           0 min(62px, calc(62 / 1920 * 100vw));
}

/* Icons sit flat on the cream card. The PNG's white background was
   converted to transparent pixels (Pillow pass: r/g/b >= 230 -> a=0)
   so there is literally no white tile to leak through. No blend
   mode needed; the cream card bg shows through cleanly. */
body[data-page="wisdom"] .wisdom-offering__icon {
  display: block;
  width: min(105px, calc(105 / 1920 * 100vw));
  height: min(105px, calc(105 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-offering--sessions .wisdom-offering__icon {
  width: min(87px, calc(87 / 1920 * 100vw));
  height: min(87px, calc(87 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-offering__title {
  font-family: 'Inter', sans-serif; font-weight: 600;
  font-size: min(24px, calc(24 / 1920 * 100vw));
  line-height: calc(35 / 24);
  color: #5E2A29;
  margin: min(22px, calc(22 / 1920 * 100vw)) 0 0;
}
body[data-page="wisdom"] .wisdom-offering__body {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(38 / 20);
  color: #282828;
  margin: min(12px, calc(12 / 1920 * 100vw)) 0 0;
  width: min(807px, calc(807 / 1920 * 100vw));
  max-width: 100%;
}

/* Satsangs card: 2-up video thumbnails. Visible body bottom is well
   above its 203px box bottom, so the previous margin-top:10 looked
   cramped (user image #85). Bump to 30 to match the visual breathing
   room in Figma. */
body[data-page="wisdom"] .wisdom-offering__videos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: min(20px, calc(20 / 1920 * 100vw));
  margin-top: min(30px, calc(30 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-video {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 690 / 388;
  background-size: cover;
  background-position: center;
  border-radius: min(4px, calc(4 / 1920 * 100vw));
  overflow: hidden;
  cursor: pointer;
}
body[data-page="wisdom"] .wisdom-video img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
body[data-page="wisdom"] .wisdom-video__play {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: min(69px, calc(69 / 1920 * 100vw));
  height: min(69px, calc(69 / 1920 * 100vw));
  background: #9D3737;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
body[data-page="wisdom"] .wisdom-video__play svg {
  width: 40%; height: 40%;
}
/* Inline-play iframe inherits the thumbnail's box so the surrounding
   layout doesn't reflow when the video starts. */
body[data-page="wisdom"] .wisdom-video__iframe {
  display: block;
  width: 100%;
  aspect-ratio: 690 / 388;
  border: 0;
  border-radius: min(4px, calc(4 / 1920 * 100vw));
}

/* Sessions card: copy column flows naturally with its own padding-top
   (131) and padding-bottom (110); photo is absolutely positioned with
   the exact Figma rectangle so the gap above and below it (13/14) is
   preserved. */
body[data-page="wisdom"] .wisdom-offering__split {
  display: block;
  height: 100%;
  position: relative;
}
body[data-page="wisdom"] .wisdom-offering__copy {
  display: flex; flex-direction: column;
  align-items: flex-start;
  padding-top: min(131px, calc(131 / 1920 * 100vw));
  padding-bottom: min(110px, calc(110 / 1920 * 100vw));
  /* Constrain copy column width so it doesn't run under the photo. */
  width: min(815px, calc(815 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-offering__copy .wisdom-offering__body {
  width: min(795px, calc(795 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-offering__photo {
  position: absolute;
  right: 0;
  top: min(13px, calc(13 / 1920 * 100vw));
  width: min(638px, calc(638 / 1920 * 100vw));
  height: min(600px, calc(600 / 1920 * 100vw));
  background-size: cover;
  /* Source 1800x1200 -> 900x600 scaled (cover), 262px excess width.
     Per user image #106 reference crop: 15% keeps the woman's left
     side fully visible (cuts ~39px from left + ~223 from right) while
     still showing the right-edge person of the crowd. */
  background-position: 15% center;
  border-radius: min(8px, calc(8 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-offering__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: min(10px, calc(10 / 1920 * 100vw));
  padding: min(8px, calc(8 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw));
  margin-top: min(64px, calc(64 / 1920 * 100vw));
  min-width: min(364px, calc(364 / 1920 * 100vw));
  /* Figma button frame is 364 x 60 — lock height so the pill matches. */
  min-height: min(60px, calc(60 / 1920 * 100vw));
  background: transparent;
  border: 1px solid #5E2A29;
  border-radius: 40px;
  text-decoration: none;
  color: #5E2A29;
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(18px, calc(18 / 1920 * 100vw));
  line-height: calc(22 / 18);
  box-sizing: border-box;
  transition: background 0.25s ease, color 0.25s ease;
}
/* Hover for Explore Courses & Workshops: outlined fills with brown,
   text becomes white, inner brown circle inverts to white with
   brown chevron. Same Figma hover pattern as the hero pill. */
body[data-page="wisdom"] .wisdom-offering__cta:hover {
  background: #5E2A29;
  color: #FAFAFA;
}
body[data-page="wisdom"] .wisdom-offering__cta:hover .wisdom-offering__arrow rect {
  fill: #FAFAFA;
}
body[data-page="wisdom"] .wisdom-offering__cta:hover .wisdom-offering__arrow path {
  stroke: #5E2A29;
}
body[data-page="wisdom"] .wisdom-offering__arrow {
  width: min(20px, calc(20 / 1920 * 100vw));
  height: min(20px, calc(20 / 1920 * 100vw));
  display: block;
  flex-shrink: 0;
  vertical-align: middle;
}

/* ============ QUOTE BAND ============ verbatim Figma Frame 2147224187:

     position: absolute; width: 1922; height: 429; top: 3937; bg #5E2A29;
     display: flex; padding: 100px; align-items: center; isolation: isolate;

   Image child (node "image 582"):
     position: absolute; width: 2001; height: 3002; top: -1816.37;
     left: calc(50% - 2001/2 + 0.5);
     background: linear-gradient(0deg, rgba(105,84,51,0.3),
                                  rgba(105,84,51,0.3)),
                 url(image.png);
     background-blend-mode: screen, normal;
     filter: blur(15px); z-index: 0;

   Text child (single text run):
     margin: 0 auto; width: 1284; height: 229;
     STIX Two Text Medium 32 / line 58 / #FAFAFA / center; z-index: 1.

   Everything scaled by min(X, X/1920 * 100vw) so it stays 1:1 at
   1920 and shrinks proportionally below. */
body[data-page="wisdom"] .wisdom-quote-band {
  position: relative;
  width: 100%;
  height: min(429px, calc(429 / 1920 * 100vw));
  background: #5E2A29;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: min(100px, calc(100 / 1920 * 100vw));
  box-sizing: border-box;
}
body[data-page="wisdom"] .wisdom-quote-band__bg {
  position: absolute;
  width: min(2001px, calc(2001 / 1920 * 100vw));
  height: min(3002px, calc(3002 / 1920 * 100vw));
  left: 50%;
  top: min(-1816.37px, calc(-1816.37 / 1920 * 100vw));
  transform: translateX(calc(-50% + 0.5px));
  background-image:
    linear-gradient(0deg, rgba(105, 84, 51, 0.3), rgba(105, 84, 51, 0.3)),
    var(--wisdom-quote-bg);
  background-size: 100% 100%, cover;
  background-position: center;
  background-blend-mode: screen, normal;
  filter: blur(15px);
  z-index: 0;
  pointer-events: none;
}
body[data-page="wisdom"] .wisdom-quote-band__text {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  width: min(1284px, calc(1284 / 1920 * 100vw));
  /* Figma text frame is fixed 229 tall — leave height auto so the
     content fits naturally even if browser line-height differs by 1px. */
  font-family: 'STIX Two Text', serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: min(32px, calc(32 / 1920 * 100vw));
  line-height: calc(58 / 32);
  letter-spacing: 0 !important;
  color: #FAFAFA;
  text-align: center;
  text-transform: none !important;
}
body[data-page="wisdom"] .wisdom-quote-band__text cite {
  /* Attribution: separate styled run on its OWN line below the quote.
     Inter Medium 32, UPPERCASE, letter-spaced, white, sans-serif. */
  display: block;
  margin-top: min(28px, calc(28 / 1920 * 100vw));
  font-family: 'Inter', sans-serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: min(32px, calc(32 / 1920 * 100vw)) !important;
  line-height: 1.4 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: #FAFAFA !important;
}

/* ============ INSIDE THE EXPERIENCE ============
   Heading kept from the Figma treatment (100 spacer after quote band).
   Content team 7/22 (blueforest.org reference): the wisdom video
   clips were retired, so the section is now heading + WRITTEN
   testimonial quote cards in the original cream card idiom. */
body[data-page="wisdom"] .wisdom-experience {
  position: relative;
  width: 100%;
  /* 150 bottom keeps the video grid off the footer (user QC 7/2). */
  padding: min(100px, calc(100 / 1920 * 100vw)) 0 min(150px, calc(150 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-experience__heading {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(52px, calc(52 / 1920 * 100vw));
  line-height: calc(58 / 52);
  text-transform: capitalize;
  color: #5E2A29;
  text-align: center;
  margin: 0;
}
/* Written testimonial quote cards — the retired .wisdom-experience__card
   treatment revived (cream rgba(240,234,222,.5) card, 20 radius, STIX
   italic quote + Inter attribution), stacked and centered. */
body[data-page="wisdom"] .exp-quotes {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: min(40px, calc(40 / 1920 * 100vw));
  margin: min(70px, calc(70 / 1920 * 100vw)) auto 0;
}
body[data-page="wisdom"] .exp-quote {
  width: min(1640px, calc(1640 / 1920 * 100vw));
  background: rgba(240, 234, 222, 0.5);
  border-radius: min(20px, calc(20 / 1920 * 100vw));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: min(80px, calc(80 / 1920 * 100vw)) min(40px, calc(40 / 1920 * 100vw));
  box-sizing: border-box;
}
/* Cards without an attribution read cleaner with tighter vertical padding
   (no reserved-looking empty space under the quote). */
body[data-page="wisdom"] .exp-quote:not(:has(.exp-quote__attribution)) {
  padding-top: min(56px, calc(56 / 1920 * 100vw));
  padding-bottom: min(56px, calc(56 / 1920 * 100vw));
}
body[data-page="wisdom"] .exp-quote__text {
  max-width: min(878px, calc(878 / 1920 * 100vw));
  margin: 0;
  font-family: 'STIX Two Text', serif;
  font-weight: 400;
  font-style: italic;
  font-size: min(36px, calc(36 / 1920 * 100vw));
  line-height: calc(48 / 36);
  letter-spacing: 0.02em;
  color: #282828;
  text-align: center;
}
body[data-page="wisdom"] .exp-quote__attribution {
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: min(24px, calc(24 / 1920 * 100vw));
  line-height: 1;
  color: #5E2A29;
  margin: min(50px, calc(50 / 1920 * 100vw)) 0 0;
  text-align: center;
}
body[data-page="wisdom"] .wisdom-events__arrow {
  width: min(54px, calc(54 / 1920 * 100vw));
  height: min(54px, calc(54 / 1920 * 100vw));
  border: 1px solid #5E2A29;
  background: transparent;
  border-radius: 50%;
  color: #5E2A29;
  display: inline-flex;
  align-items: center; justify-content: center;
  cursor: pointer;
  padding: 0;
  transition: background 0.25s ease, color 0.25s ease;
}
/* Hover: outlined circle fills brand brown, chevron flips white.
   Same Figma hover pattern as the pill CTAs. */
body[data-page="wisdom"] .wisdom-events__arrow:hover {
  background: #5E2A29;
  color: #FAFAFA;
}
body[data-page="wisdom"] .wisdom-events__arrow svg {
  width: min(42px, calc(42 / 1920 * 100vw));
  height: min(42px, calc(42 / 1920 * 100vw));
}

/* ============ UPCOMING EVENTS ============
   Figma experience.card.end=5380 -> events.heading=5614 (234 spacer)
   -> nav.bot=6581 -> footer.top=6701 (120 spacer). */
body[data-page="wisdom"] .wisdom-events {
  position: relative;
  width: 100%;
  padding: min(234px, calc(234 / 1920 * 100vw)) 0 min(120px, calc(120 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-events__heading {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(52px, calc(52 / 1920 * 100vw));
  line-height: calc(58 / 52);
  text-transform: capitalize;
  color: #5E2A29;
  text-align: center;
  margin: 0;
}
body[data-page="wisdom"] .wisdom-events__grid {
  display: grid;
  grid-template-columns: repeat(3, min(530px, calc(530 / 1920 * 100vw)));
  gap: min(23px, calc(23 / 1920 * 100vw));
  justify-content: center;
  margin: min(70px, calc(70 / 1920 * 100vw)) 0 0;
}
body[data-page="wisdom"] .wisdom-event-card {
  display: flex; flex-direction: column;
  background: rgba(240, 234, 222, 0.5);
  border-radius: min(12px, calc(12 / 1920 * 100vw));
  overflow: hidden;
  padding-bottom: min(24px, calc(24 / 1920 * 100vw));
  /* Lock card to Figma frame height 715 so the events section nav
     lands at the right Y (Figma nav.bot = 6581). */
  min-height: min(715px, calc(715 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-event-card__photo {
  position: relative;
  width: 100%;
  height: min(368px, calc(368 / 1920 * 100vw));
  background-size: cover;
  background-position: center;
}
body[data-page="wisdom"] .wisdom-event-card__tags {
  position: absolute;
  left: min(26px, calc(26 / 1920 * 100vw));
  bottom: min(20px, calc(20 / 1920 * 100vw));
  display: flex;
  gap: min(9px, calc(9 / 1920 * 100vw));
}
body[data-page="wisdom"] .wisdom-event-tag {
  background: #FFFFFF;
  border-radius: 20px;
  padding: min(4px, calc(4 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw));
  font-family: 'Open Sans', 'Inter', sans-serif;
  font-weight: 400;
  font-size: min(19px, calc(19 / 1920 * 100vw));
  line-height: calc(26 / 19);
  color: #46474B;
}
body[data-page="wisdom"] .wisdom-event-card__body {
  padding: min(24px, calc(24 / 1920 * 100vw)) min(36px, calc(36 / 1920 * 100vw)) 0;
  display: flex; flex-direction: column;
  gap: min(16px, calc(16 / 1920 * 100vw));
  flex: 1;
}
body[data-page="wisdom"] .wisdom-event-card__date {
  display: flex; align-items: center;
  gap: min(14px, calc(14 / 1920 * 100vw));
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(18px, calc(18 / 1920 * 100vw));
  line-height: calc(28 / 18);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #5E2A29;
  margin: 0;
}
body[data-page="wisdom"] .wisdom-event-card__bullet {
  width: min(20px, calc(20 / 1920 * 100vw));
  height: min(20px, calc(20 / 1920 * 100vw));
  background: #5E2A29;
  display: inline-block;
  flex-shrink: 0;
  /* Figma date icon is a calendar, not a solid square — mask the brown box. */
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") center / contain no-repeat;
}
body[data-page="wisdom"] .wisdom-event-card__title {
  font-family: 'Inter', sans-serif; font-weight: 600;
  font-size: min(28px, calc(28 / 1920 * 100vw));
  line-height: calc(42 / 28);
  color: #5E2A29;
  margin: 0;
}
body[data-page="wisdom"] .wisdom-event-card__desc {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(30 / 20);
  color: #282828;
  margin: 0;
}
body[data-page="wisdom"] .wisdom-event-card__cta {
  display: flex;
  align-items: center; justify-content: center;
  background: #5E2A29;
  color: #FFFFFF;
  border-radius: 20px;
  padding: min(13px, calc(13 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw));
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(18px, calc(18 / 1920 * 100vw));
  line-height: calc(22 / 18);
  text-decoration: none;
  margin-top: auto;
}
body[data-page="wisdom"] .wisdom-events__nav {
  display: flex;
  justify-content: center;
  gap: min(33px, calc(33 / 1920 * 100vw));
  margin: min(70px, calc(70 / 1920 * 100vw)) 0 0;
}

/* ============================================================
   MOBILE 1:1 — Figma artboard 4149:5932 (Wisdom, 390x5789).
   Layout scales min(Xpx, calc(X/390*100vw)); TEXT fixed px.
   Structure changes from desktop: hero centred; compass = text then
   full-width photo; satsang = full-width glass card; offering cards
   full-width w/ stacked videos; events = single carousel card.
   ============================================================ */
/* ===== QC fixes (Phase-1 hides + tweaks) ===== */
body[data-page="wisdom"] .wisdom-hero-cta { display: none !important; } /* QC r38: hide until we have events */
body[data-page="wisdom"] .wisdom-events { display: none !important; }   /* QC r41: hide upcoming-events section (Phase 1) */
body[data-page="wisdom"] .wisdom-event-tag { font-style: italic; }      /* QC r43: italic tags (dormant while events hidden) */

/* QC r44: iPad (769-1199) — anchor hero text near the hero bottom */
@media (min-width: 769px) and (max-width: 1199px) {
  body[data-page="wisdom"] .inner-hero__inner { top: auto; bottom: min(70px, calc(70 / 1920 * 100vw)); }
}

@media (max-width: 1023px) {
  /* ---------- HERO (photo 588, centred white copy) ---------- */
  body[data-page="wisdom"] .inner-hero {
    height: min(588px, calc(588 / 390 * 100vw)); min-height: 0;
  }
  body[data-page="wisdom"] .inner-hero__image {
    background-size: cover; background-position: left center;   /* Bapa on the dais, left */
    transform: none;   /* defeat the base scale(1.04) parallax over-zoom (wisdom isn't in the defeat list) */
    /* MATTE FINISH — the site-wide hero grade (matches Activities + Our Story):
       contrast(0.68) saturate(0.82) reproduces the Figma's faded/matte look. */
    filter: contrast(0.68) saturate(0.82);
  }
  body[data-page="wisdom"] .inner-hero__veil {
    /* darken the lower third (kicker + Wisdom + button) so the white text reads
       over the busy crowd and the button area is dark like the Figma (~70). */
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.34) 67%, rgba(0,0,0,0.58) 100%);
  }
  body[data-page="wisdom"] .inner-hero__kicker { text-shadow: 0 1px 10px rgba(0,0,0,0.75); }
  body[data-page="wisdom"] .inner-hero__title { text-shadow: 0 2px 14px rgba(0,0,0,0.62); }
  body[data-page="wisdom"] .inner-hero__inner {
    position: absolute; left: 50%; top: min(398px, calc(398 / 390 * 100vw));
    transform: translateX(-50%);
    width: min(340px, calc(340 / 390 * 100vw)); height: auto !important; min-height: 0 !important;
    display: flex; flex-direction: column; align-items: center; text-align: center;
  }
  body[data-page="wisdom"] .inner-hero__kicker {
    font-size: 12px; line-height: 20px; letter-spacing: 0.84px;
    white-space: normal; text-align: center; color: #FFFFFF;
    width: 100%; max-width: none; margin: 0;   /* fill 340 -> 2 lines like Figma */
  }
  body[data-page="wisdom"] .inner-hero__title {
    font-size: 32px; line-height: 1.05; margin: min(10px, calc(10 / 390 * 100vw)) 0 0; text-align: center;
  }
  body[data-page="wisdom"] .wisdom-hero-cta {
    position: absolute; left: 50%; top: min(517px, calc(517 / 390 * 100vw));
    transform: translateX(-50%);
    width: min(239px, calc(239 / 390 * 100vw)); height: min(40px, calc(40 / 390 * 100vw));
    background: rgba(255,255,255,0.9); border-radius: 20px;
    gap: min(8px, calc(8 / 390 * 100vw)); padding: 0 min(20px, calc(20 / 390 * 100vw));
  }
  body[data-page="wisdom"] .wisdom-hero-cta__label { font-size: 12px; line-height: 1.2; }
  body[data-page="wisdom"] .wisdom-hero-cta__arrow { width: 18px; height: 18px; }
  /* keep the Figma's brown filled circle + white arrow (the HTML SVG) */

  /* ---------- RESET YOUR INNER COMPASS (text -> full-width photo) ---------- */
  body[data-page="wisdom"] .wisdom-compass {
    height: auto; min-height: 0; background: rgba(240,234,222,0.5);
    display: flex; flex-direction: column;
  }
  body[data-page="wisdom"] .wisdom-compass__copy {
    position: static; left: auto; top: auto; width: auto; order: 1;
    padding: min(34px, calc(34 / 390 * 100vw)) min(36px, calc(36 / 390 * 100vw)) min(30px, calc(30 / 390 * 100vw));
  }
  body[data-page="wisdom"] .wisdom-compass__copy h2 {
    font-size: 28px; line-height: 1.12; width: min(230px, calc(230 / 390 * 100vw));
    margin: 0 0 min(20px, calc(20 / 390 * 100vw));
  }
  body[data-page="wisdom"] .wisdom-compass__copy p { font-size: 14px; line-height: 26px; }
  body[data-page="wisdom"] .wisdom-compass__lead { width: auto; margin: 0 0 min(22px, calc(22 / 390 * 100vw)) !important; }
  body[data-page="wisdom"] .wisdom-compass__intro { margin: 0 0 min(52px, calc(52 / 390 * 100vw)) !important; }
  body[data-page="wisdom"] .wisdom-compass__bullets {
    margin: 0 !important; gap: min(34px, calc(34 / 390 * 100vw));   /* Figma bullet pitch ~64 */
  }
  body[data-page="wisdom"] .wisdom-compass__bullets li {
    padding-left: 0; padding-top: min(11px, calc(11 / 390 * 100vw)); min-height: 0;
    display: block; font-size: 14px; line-height: 1.4; color: #282828;
  }
  body[data-page="wisdom"] .wisdom-compass__bullets li::before {
    width: min(48px, calc(48 / 390 * 100vw)); height: 2px; top: 0; left: 0;  /* horizontal accent bar */
  }
  body[data-page="wisdom"] .wisdom-compass__photo {
    position: static; left: auto; top: auto; order: 2; width: 100%;
    height: min(261px, calc(261 / 390 * 100vw)); border-radius: 0;
  }

  /* ---------- SAT·SANG (full-width glass card) ---------- */
  body[data-page="wisdom"] .wisdom-satsang { height: auto; min-height: 0; }
  body[data-page="wisdom"] .wisdom-satsang__card {
    position: static; left: auto; top: auto; transform: none; margin: 0;
    width: 100%; height: min(381px, calc(381 / 390 * 100vw)); border-radius: 0;
  }
  body[data-page="wisdom"] .wisdom-satsang__content {
    padding: min(39px, calc(39 / 390 * 100vw)) min(45px, calc(45 / 390 * 100vw));
  }
  body[data-page="wisdom"] .wisdom-satsang__title { font-size: 28px; line-height: 1.1; }
  body[data-page="wisdom"] .wisdom-satsang__pos {
    font-size: 14px; line-height: 1.2; letter-spacing: 0.28px;
    margin: min(11px, calc(11 / 390 * 100vw)) 0 0;
  }
  body[data-page="wisdom"] .wisdom-satsang__definition {
    font-size: 14px; line-height: 22px; width: auto; letter-spacing: 0.28px;
    margin: min(16px, calc(16 / 390 * 100vw)) 0 0;
  }
  body[data-page="wisdom"] .wisdom-satsang__sep { width: 100%; margin: min(20px, calc(20 / 390 * 100vw)) 0 0; }
  body[data-page="wisdom"] .wisdom-satsang__body {
    font-size: 14px; line-height: 28px; width: auto; margin: min(16px, calc(16 / 390 * 100vw)) 0 0;
  }

  /* ---------- WISDOM OFFERINGS (heading + 2 full-width cream cards) ---------- */
  body[data-page="wisdom"] .wisdom-offerings { padding: min(70px, calc(70 / 390 * 100vw)) 0 0; }
  body[data-page="wisdom"] .wisdom-offerings__heading { font-size: 28px; line-height: 1.1; }
  body[data-page="wisdom"] .wisdom-offering {
    width: 100%; margin: min(28px, calc(28 / 390 * 100vw)) 0 0; border-radius: 0; height: auto;
  }
  body[data-page="wisdom"] .wisdom-offering--satsang,
  body[data-page="wisdom"] .wisdom-offering--sessions {
    height: auto;
    padding: min(10px, calc(10 / 390 * 100vw)) min(24px, calc(24 / 390 * 100vw)) min(24px, calc(24 / 390 * 100vw));
    margin-top: min(28px, calc(28 / 390 * 100vw));
  }
  body[data-page="wisdom"] .wisdom-offering__icon,
  body[data-page="wisdom"] .wisdom-offering--sessions .wisdom-offering__icon { width: 63px; height: 63px; }
  body[data-page="wisdom"] .wisdom-offering__title {
    font-size: 18px; line-height: 1.45; margin: min(12px, calc(12 / 390 * 100vw)) 0 0;
  }
  body[data-page="wisdom"] .wisdom-offering__body,
  body[data-page="wisdom"] .wisdom-offering__copy .wisdom-offering__body {
    font-size: 12px; line-height: 20px; width: auto; max-width: none; margin: min(14px, calc(14 / 390 * 100vw)) 0 0;
  }
  body[data-page="wisdom"] .wisdom-offering__videos {
    grid-template-columns: 1fr; gap: min(15px, calc(15 / 390 * 100vw));
    margin-top: min(20px, calc(20 / 390 * 100vw));
  }
  body[data-page="wisdom"] .wisdom-video { aspect-ratio: 320 / 180; border-radius: min(4px, calc(4 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-video__play { width: 35px; height: 35px; }
  body[data-page="wisdom"] .wisdom-video__iframe { aspect-ratio: 320 / 180; }
  body[data-page="wisdom"] .wisdom-offering__split { display: flex; flex-direction: column; height: auto; }
  body[data-page="wisdom"] .wisdom-offering__copy { width: 100%; padding: 0; }
  body[data-page="wisdom"] .wisdom-offering__photo {
    position: static; right: auto; top: auto;
    width: min(342px, calc(342 / 390 * 100vw)); margin: min(20px, calc(20 / 390 * 100vw)) auto 0;
    height: min(329px, calc(329 / 390 * 100vw));
    border-radius: min(8px, calc(8 / 390 * 100vw));
    background-size: cover; background-position: 12% center;   /* keep the speaker (left) in frame */
  }
  body[data-page="wisdom"] .wisdom-offering__cta {
    margin-top: min(20px, calc(20 / 390 * 100vw)); min-width: 0;
    width: min(239px, calc(239 / 390 * 100vw)); min-height: min(40px, calc(40 / 390 * 100vw));
    background: rgba(255,255,255,0.9); border: 0; border-radius: 20px;
    font-size: 12px; line-height: 1.2; color: #5e2a29;
    gap: min(8px, calc(8 / 390 * 100vw)); padding: 0 min(20px, calc(20 / 390 * 100vw));
  }
  body[data-page="wisdom"] .wisdom-offering__arrow { width: 16px; height: 16px; }
  body[data-page="wisdom"] .wisdom-offering__arrow rect { fill: transparent; }
  body[data-page="wisdom"] .wisdom-offering__arrow path { stroke: #5e2a29; }

  /* ---------- QUOTE BAND (maroon, blurred bg) ---------- */
  body[data-page="wisdom"] .wisdom-quote-band {
    height: min(329px, calc(329 / 390 * 100vw)); padding: min(40px, calc(40 / 390 * 100vw));
    flex-direction: column; justify-content: center; gap: min(20px, calc(20 / 390 * 100vw));
  }
  body[data-page="wisdom"] .wisdom-quote-band__bg {
    width: 100%; height: 100%; left: 0; top: 0; transform: none;
    background-size: cover, cover; background-position: center;
  }
  body[data-page="wisdom"] .wisdom-quote-band__text { width: min(309px, calc(309 / 390 * 100vw)); font-size: 16px; line-height: 28px; }
  body[data-page="wisdom"] .wisdom-quote-band__text cite {
    font-size: 12px !important; line-height: 1.2 !important; letter-spacing: 0.6px !important;
    text-transform: none !important; margin-top: min(20px, calc(20 / 390 * 100vw));
  }

  /* ---------- INSIDE THE EXPERIENCE (written quote cards, stacked) ---------- */
  body[data-page="wisdom"] .wisdom-experience { padding: min(70px, calc(70 / 390 * 100vw)) 0 min(56px, calc(56 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-experience__heading { font-size: 28px; line-height: 1.1; text-transform: none; }
  body[data-page="wisdom"] .exp-quotes {
    gap: min(20px, calc(20 / 390 * 100vw));
    margin: min(28px, calc(28 / 390 * 100vw)) auto 0;
  }
  body[data-page="wisdom"] .exp-quote {
    width: min(362px, calc(362 / 390 * 100vw));
    border-radius: min(12px, calc(12 / 390 * 100vw));
    padding: min(46px, calc(46 / 390 * 100vw)) min(28px, calc(28 / 390 * 100vw));
  }
  body[data-page="wisdom"] .exp-quote__text { max-width: none; font-size: 20px; line-height: 1.35; }
  body[data-page="wisdom"] .exp-quote__attribution { font-size: 14px; margin: min(24px, calc(24 / 390 * 100vw)) 0 0; }

  /* ---------- UPCOMING EVENTS (single carousel card) ---------- */
  body[data-page="wisdom"] .wisdom-events { padding: min(70px, calc(70 / 390 * 100vw)) 0 min(40px, calc(40 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-events__heading { font-size: 28px; line-height: 1.1; }
  body[data-page="wisdom"] .wisdom-events__grid {
    display: block; width: min(300px, calc(300 / 390 * 100vw)); margin: min(28px, calc(28 / 390 * 100vw)) auto 0;
  }
  body[data-page="wisdom"] .wisdom-event-card:not(:first-child) { display: none; }
  body[data-page="wisdom"] .wisdom-event-card {
    min-height: 0; border-radius: min(7px, calc(7 / 390 * 100vw)); padding-bottom: min(20px, calc(20 / 390 * 100vw));
  }
  body[data-page="wisdom"] .wisdom-event-card__photo { height: min(180px, calc(180 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-event-card__tags { left: min(16px, calc(16 / 390 * 100vw)); bottom: min(12px, calc(12 / 390 * 100vw)); gap: min(6px, calc(6 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-event-tag { font-size: 10px; line-height: 1.2; padding: min(3px, calc(3 / 390 * 100vw)) min(12px, calc(12 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-event-card__body { padding: min(14px, calc(14 / 390 * 100vw)) min(20px, calc(20 / 390 * 100vw)) 0; gap: min(8px, calc(8 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-event-card__date { font-size: 11px; line-height: 1.2; gap: min(8px, calc(8 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-event-card__bullet { width: 12px; height: 12px; }
  body[data-page="wisdom"] .wisdom-event-card__title { font-size: 17px; line-height: 1.3; }
  body[data-page="wisdom"] .wisdom-event-card__desc { font-size: 12px; line-height: 20px; }
  body[data-page="wisdom"] .wisdom-event-card__cta { font-size: 11px; border-radius: 15px; padding: min(9px, calc(9 / 390 * 100vw)) min(12px, calc(12 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-events__nav { margin: min(20px, calc(20 / 390 * 100vw)) 0 0; gap: min(16px, calc(16 / 390 * 100vw)); }
  body[data-page="wisdom"] .wisdom-events__arrow {
    width: min(28px, calc(28 / 390 * 100vw)); height: min(28px, calc(28 / 390 * 100vw)); border-color: #282828; color: #282828;
  }
  body[data-page="wisdom"] .wisdom-events__arrow svg { width: 20px; height: 20px; }
}