/* MaP on Circle — Custom CSS v2.24 (2026-02-05) — OPTIMIZED */

/* ===== CRITICAL CSS (Above the fold) ===== */
/* CSS Custom Properties */
:root{
  --font-serif:'GT-Alpina-Standard-Regular',Georgia,serif;
  --font-serif-bold:'GT-Alpina-Standard-Bold',Georgia,serif;
  --font-sans-med:'GT-Pressura-Standard-Medium',Arial,sans-serif;
  --font-sans-bold:'GT-Pressura-Standard-Bold',Arial,sans-serif;
  --font-sans-black:'GT-Pressura-Standard-Black',Arial,sans-serif;
  --font-typewriter:'GT-Alpina-Typewriter-Medium','Courier New',monospace;
  --font-typewriter-bold:'GT-Alpina-Typewriter-Bold','Courier New',monospace;

  /* Colors - most handled by Circle theme settings */
  /* These kept only for CSS effects (gradients, shadows, accents) */
  --accent:#5E409D;--brand-strong:#BC5215;

  /* Shared design tokens (used by CDN blockquotes.css and other shared components) */
  --fx-orange-400:#DA702C;
  --fx-blue-400:#4385BE;
  --color-text:#1C1B1A;
  --color-text-secondary:#575653;
  --color-surface:#FFFFFF;
  --color-brand:var(--brand-strong);
  --shadow-color:rgba(16, 15, 15, 0.08);

  /* 1.2 Modular Scale (Minor Third) — recalculated for 16px rem base */
  /* All values ×1.25 to compensate for not overriding html font-size */
  --scale-ratio:1.2;
  --base-size:1.25rem;--body-size:1.25rem;--lh-body:1.55;--lh-tight:1.15;--lh-post-title:1.08;

  /* Paragraph scale: P3 → P2 → P1 (steps -1, 0, +1) */
  --wb-p3:1.042rem;  /* step -1: ~17px */
  --wb-p2:1.25rem;   /* step 0: 20px base */
  --wb-p1:1.5rem;    /* step +1: 24px */

  /* Badge/tag size (step -2 in modular scale) */
  --badge-size:0.868rem;  /* step -2: ~14px */


  /* Heading scale: each heading spans ±1 step (min @ 400px, max @ 1200px) */
  --h5:clamp(1.5rem, calc(1.175rem + 1.65vw), 2.16rem);      /* steps +1 to +3 */
  --h4:clamp(1.8rem, calc(1.4rem + 2vw), 2.592rem);          /* steps +2 to +4 */
  --h3:clamp(2.16rem, calc(1.69rem + 2.38vw), 3.11rem);      /* steps +3 to +5 */
  --h2:clamp(2.592rem, calc(2.025rem + 2.85vw), 3.732rem);   /* steps +4 to +6 */
  --h1:clamp(3.11rem, calc(2.425rem + 3.43vw), 4.478rem);    /* steps +5 to +7 */
  --h6:clamp(5.375rem, calc(4.19rem + 5.94vw), 7.74rem);     /* steps +8 to +10 (display) */

  --h1-family:var(--font-sans-black);
  --h2-family:var(--font-sans-black);
  --h3-family:var(--font-sans-bold);
  --h4-family:var(--font-sans-bold);
  --h5-family:var(--font-sans-med);
  --h6-family:var(--font-sans-black);

  /* Contextual sizes (derived from scale) */
  --post-title:clamp(1.8rem, calc(1.4rem + 2vw), 2.592rem);  /* same as H4: steps +2 to +4 */
  --sidebar-text:1.042rem;                     /* matches P3 */
  --event-title:var(--post-title);

  --nav-label:var(--h3);
  --crumb-label:calc(var(--h3)*.9);

  --alpina-ot:"ss01" 0,"ss02" 1,"ss03" 1;

  /* Tactile button system */
  --tactile-bg: #FFFFFF;
  --tactile-orange: #BC5215;
  --tactile-blue: #205EA6;
  --tactile-ink: #1C1B1A;
  /* Button tiers */
  --btn-lg-size: 1.35rem;--btn-lg-elevation: 8px;--btn-lg-border: 2.5px;--btn-lg-radius: 8px;
  --btn-md-size: 1.125rem;--btn-md-elevation: 6px;--btn-md-border: 2px;--btn-md-radius: 6px;
  --btn-sm-size: 0.938rem;--btn-sm-elevation: 3px;--btn-sm-border: 1.5px;--btn-sm-radius: 5px;
}

@media (max-width:420px){
  :root{
    /* Mobile: headings lock to their clamp minimums (one step below base) */
    --base-size:1.125rem;--body-size:1.125rem;
    --wb-p3:0.938rem;--wb-p2:1.125rem;--wb-p1:1.35rem;
    --h5:1.35rem;--h4:1.62rem;--h3:1.944rem;--h2:2.333rem;--h1:2.8rem;
    --h6:4.84rem;
    --post-title:1.62rem;--sidebar-text:0.938rem;--event-title:var(--post-title);
    --lh-post-title:1.08;
    /* Mobile button sizes (90% of mobile P sizes) */
    --btn-lg-size:1.215rem;--btn-md-size:1.012rem;--btn-sm-size:0.844rem;
    /* Mobile badge size */
    --badge-size:0.78rem;
  }
}

/* ===== BASE TYPOGRAPHY (Critical) ===== */
/* Colors handled by Circle theme settings */
/* Note: Do NOT set html font-size — breaks Circle's layout in Safari */
body{font-family:var(--font-serif);font-size:var(--base-size);font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}

/* Headings - Simplified selectors */
h1{font-family:var(--h1-family);font-size:var(--h1);line-height:1.0}
h2{font-family:var(--h2-family);font-size:var(--h2);line-height:1.05}
h3{font-family:var(--h3-family);font-size:var(--h3);line-height:1.1}
h4{font-family:var(--h4-family);font-size:var(--h4);line-height:var(--lh-tight)}
h5{font-family:var(--h5-family);font-size:var(--h5);line-height:var(--lh-tight)}
h6{font-family:var(--h4-family);font-size:var(--h4);line-height:var(--lh-tight);margin:1em 0 .5em}

/* Bold text */
strong,b{font-family:var(--font-serif-bold);font-weight:700;font-feature-settings:var(--alpina-ot)}

/* ===== NON-CRITICAL CSS (Defer if possible) ===== */
/* Login button animation - ring burst effect */
@keyframes login-ring{0%,45%{transform:scale(1);box-shadow:0 0 0 0 rgba(223,180,49,.7)}65%{transform:scale(1.08);box-shadow:0 0 0 0 rgba(223,180,49,.7)}80%{transform:scale(1);box-shadow:0 0 0 12px rgba(223,180,49,0)}100%{transform:scale(1);box-shadow:0 0 0 0 rgba(223,180,49,0)}}
.login-attention{animation:login-ring 4s ease-out infinite !important;animation-delay:1s !important}
.login-btn,[data-testid="auth-modal-trigger"]{transition:all .3s ease-in-out}
.login-btn:hover,[data-testid="auth-modal-trigger"]:hover{transform:translateY(-1px);box-shadow:0 4px 8px rgba(236,93,86,.2)}

/* Lists - simplified selectors */
ul,ol,li{font-family:var(--font-serif);font-size:var(--body-size);line-height:var(--lh-body);font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}
.tiptap.ProseMirror ul,.tiptap.ProseMirror ol,.trix-content ul,.trix-content ol,.post_body ul,.post_body ol{font-family:var(--font-serif);font-size:var(--body-size);line-height:var(--lh-body)}
ul li::marker,ol li::marker{font-size:var(--body-size);font-family:var(--font-serif)}

/* Heading enforcement for WB containers */
:where(.wb-container,[data-block-type="container"],[data-block-type="section"],[data-block-type="root"],body) h1{font-family:var(--h1-family);font-size:var(--h1);line-height:1.0}
:where(.wb-container,[data-block-type="container"],[data-block-type="section"],[data-block-type="root"],body) h2{font-family:var(--h2-family);font-size:var(--h2);line-height:1.05}
:where(.wb-container,[data-block-type="container"],[data-block-type="section"],[data-block-type="root"],body) h3{font-family:var(--h3-family);font-size:var(--h3);line-height:1.1}
:where(.wb-container,[data-block-type="container"],[data-block-type="section"],[data-block-type="root"],body) h4{font-family:var(--h4-family);font-size:var(--h4);line-height:var(--lh-tight)}
:where(.wb-container,[data-block-type="container"],[data-block-type="section"],[data-block-type="root"],body) h5{font-family:var(--h5-family);font-size:var(--h5);line-height:var(--lh-tight)}

/* Inline heading inheritance */
:is(h1,h2,h3,h4,h5,h6) :is(span,strong,b,em,a){font-family:inherit;font-size:inherit;line-height:inherit;letter-spacing:inherit;font-weight:inherit}

/* H6 display treatment - use class instead of complex :not() chains */
h6.display-treatment,.display-heading h6{font-family:var(--h6-family);font-size:var(--h6);line-height:1.08;letter-spacing:-.02em;margin:1.25em 0 .5em}

/* Rich text & post bodies - with !important to ensure correct sizing */
.tiptap.ProseMirror p,
.trix-content,
.post_body,
[data-testid="post-body-inside"],
[role="dialog"] .trix-content,
[data-headlessui-state] .trix-content {
  font-family: var(--font-serif) !important;
  font-size: var(--body-size) !important;
  line-height: var(--lh-body) !important;
  font-feature-settings: var(--alpina-ot);
}
.trix-content p,.trix-content span,.post_body p,.post_body span{font-family:inherit;font-size:inherit;line-height:inherit}

/* Bold in rich text - simplified */
:is(.post_body,.trix-content,.tiptap.ProseMirror) :is(strong,b){font-family:var(--font-serif-bold);font-weight:700;font-feature-settings:var(--alpina-ot)}
:is(.post_body,.trix-content) a{font-family:var(--font-serif-bold);font-weight:700}
li :is(strong,b){font-family:var(--font-serif-bold);font-weight:700}

/* Community headings (post bodies, comments, rich text) */
/* Post title uses H4 + black weight; in-post headings differentiated by size/weight */
:is(.post_body,.trix-content,.tiptap.ProseMirror) h2{font-family:var(--font-sans-bold);font-size:var(--h4);line-height:var(--lh-tight);margin:1.25em 0 .5em}
:is(.post_body,.trix-content,.tiptap.ProseMirror) h3{font-family:var(--font-sans-med);font-size:var(--h5);line-height:var(--lh-tight);margin:1.15em 0 .4em}
:is(.post_body,.trix-content,.tiptap.ProseMirror) h4{font-family:var(--font-sans-med);font-size:var(--wb-p1);line-height:var(--lh-tight);margin:1em 0 .35em}

/* Community lists */
:is(.post_body,.trix-content,.tiptap.ProseMirror) :is(ul,ol){font-family:var(--font-serif);font-size:var(--body-size);line-height:var(--lh-body);margin:.75em 0;padding-left:1.5em}
:is(.post_body,.trix-content,.tiptap.ProseMirror) li{font-family:inherit;font-size:inherit;line-height:inherit;margin:.25em 0}

/* Blockquotes - left border accent (community posts) */
:is(.post_body,.trix-content,.tiptap.ProseMirror) blockquote{font-family:var(--font-serif);font-size:var(--body-size);line-height:var(--lh-body);font-style:italic;border-left:4px solid var(--accent);margin:1.25em 0;padding:.5em 0 .5em 1.25em;font-feature-settings:var(--alpina-ot)}

/* Website Builder blockquotes — default to bq-voice treatment */
blockquote[data-block-type="blockquote"]:not(.bq-provocation){font-family:var(--font-serif);font-size:var(--wb-p2);font-style:italic;line-height:1.6;color:var(--color-text);background:none !important;border:none !important;border-left:3px solid var(--color-brand) !important;border-radius:0 !important;box-shadow:none !important;margin:1.5em 0 !important;padding:0 0 0 1.25rem !important}
blockquote[data-block-type="blockquote"]:not(.bq-provocation) p{margin:0}
blockquote[data-block-type="blockquote"]:not(.bq-provocation) p+p{margin-top:.75em}

/* WB P1-P3 sizes - simplified with classes */
.wb-text-p1{font-family:var(--font-serif);font-size:var(--wb-p1);line-height:var(--lh-body);font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}
.wb-text-p2{font-family:var(--font-serif);font-size:var(--wb-p2);line-height:var(--lh-body);font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}
.wb-text-p3{font-family:var(--font-serif);font-size:var(--wb-p3);line-height:var(--lh-body);font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}

/* Website Builder heading classes */
[class*="wb-font-h1"],[class*="wb-text-h1"]{font-family:var(--h1-family) !important}
[class*="wb-font-h2"],[class*="wb-text-h2"]{font-family:var(--h2-family) !important}
[class*="wb-font-h3"],[class*="wb-text-h3"]{font-family:var(--h3-family) !important}
[class*="wb-font-h4"],[class*="wb-text-h4"]{font-family:var(--h4-family) !important}
[class*="wb-font-h5"],[class*="wb-text-h5"]{font-family:var(--h5-family) !important}
[class*="wb-font-h6"],[class*="wb-text-h6"]{font-family:var(--h6-family) !important}

/* WB paragraph classes - ensure serif font */
[class*="wb-font-p"],[class*="wb-text-p"]{font-family:var(--font-serif) !important;font-size:var(--body-size) !important;line-height:var(--lh-body);font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}

/* Community UI */
.wb-divide-primary h1{font-family:var(--h1-family)}
.wb-divide-primary h2{font-family:var(--h2-family)}
.wb-divide-primary h3,.wb-divide-primary h4{font-family:var(--h3-family)}
.wb-divide-primary h5{font-family:var(--h5-family)}
.wb-divide-primary h6:not([data-testid*="event"]):not(.event-title){font-family:var(--h6-family);font-size:var(--h6);line-height:1.08;letter-spacing:-.02em;margin:1.5em 0 .75em}
.wb-divide-primary p,.wb-divide-primary div[data-block="true"][data-block-type="p"]{font-family:var(--font-serif);font-size:var(--body-size);line-height:var(--lh-body);font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}

/* Course cards */
body[data-current-path*="/courses"] a[href^="/c/"] h1,body[data-current-path*="/courses"] a[href^="/c/"] h2,body[class*="courses"] a[href^="/c/"] h1,body[class*="courses"] a[href^="/c/"] h2{font-family:var(--h3-family);font-size:var(--h3);line-height:var(--lh-tight);letter-spacing:normal;font-weight:700}

/* Event pages */
[data-testid="event-title"],.event-title,[data-testid*="event"] h1,[data-testid*="event"] h2,[data-testid*="event"] h3,h1[data-testid*="event"],h2[data-testid*="event"],h3[data-testid*="event"],.event h1,.event h2,.event h3,[class*="event"] h1.text-xl,[class*="event"] h1[class*="text-2xl"],.post.parent.event-item h1{font-family:var(--h1-family);font-size:var(--event-title);line-height:1.08 !important;letter-spacing:normal;margin:.5em 0}

/* Hide "Details" header on event pages */
h5.text-lg.font-semibold.leading-4 {
  display: none !important;
}

/* Event page mobile padding */
@media (max-width: 480px) {
  [data-testid="post-body-inside"],
  .post__inside,
  .trix-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-sizing: border-box;
  }
}


/* Navigation */
nav[data-testid="navigation-bar-wrapper"] a{font-family:var(--font-sans-med);font-size:var(--wb-p3)}
nav[data-testid="navigation-bar-wrapper"] ul[role="list"]{gap:.5rem;justify-content:flex-start;align-items:center}
nav[data-testid="navigation-bar-wrapper"] ul[role="list"] li{margin:0}
/* Nav buttons (More dropdown, etc.) should match nav links */
nav[data-testid="navigation-bar-wrapper"] .flex.items-center button,nav[data-testid="navigation-bar-wrapper"] [role="button"],header nav button{font-family:var(--font-sans-med);font-size:var(--wb-p3)}

/* Active navigation - use .nav-active class for path-based highlighting */
nav a[aria-current="page"],nav a.active,.nav-active{font-family:var(--font-sans-bold);padding:.5rem 1rem;border-radius:50px;text-decoration:none;border:none;transition:all .2s ease-in-out;box-shadow:none}
nav a[aria-current="page"]:hover,nav a.active:hover,.nav-active:hover{opacity:.85;transform:translateY(-1px);border-radius:50px;border:none;box-shadow:0 2px 4px rgba(0,0,0,.1)}
nav [aria-label="Secondary navigation bar"]{display:none}

/* Space titles & breadcrumbs - consistent size for both views */
[data-testid="space-title-name"],[data-testid="space-header"] h1{font-family:var(--font-sans-med) !important;font-size:var(--wb-p2) !important;line-height:1.08 !important;letter-spacing:normal;margin:.3em 0;padding-bottom:.1em}

/* Back navigation link (when space title contains a back button) */
/* Uses --tactile-orange (not --brand-strong) for dark mode support */
[data-testid="space-title-name"]:has(button),
h1[data-testid="space-title-name"]:has(svg) {
  font-family: var(--font-sans-med) !important;
  font-size: var(--wb-p2) !important;
  color: var(--tactile-orange) !important;
  line-height: 1.08 !important;
}
[data-testid="space-title-name"] button {
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
}
header .breadcrumb-link{font-family:var(--font-sans-med);font-size:var(--wb-p2);line-height:1.2;letter-spacing:0;font-weight:500}
header .breadcrumb-link svg{width:18px;height:18px}

/* Sidebars */
.bg-c-sidebar .truncate.text-sm.font-semibold,.bg-c-sidebar h3.truncate{font-family:var(--font-sans-med);font-size:var(--wb-p3);line-height:1.2}
.bg-c-sidebar .text-xs-plus,.bg-c-sidebar .flex.w-full a,.bg-c-sidebar button .truncate{font-family:var(--font-serif);font-size:var(--sidebar-text);font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}
.bg-c-sidebar .text-current,.bg-c-sidebar a[aria-current="page"]{font-family:var(--font-serif-bold)}
.bg-c-sidebar *{font-size:inherit}

/* Space navigation - Pressura for space names */
h4[data-testid="space-name"],
h4[data-testid="space-name"].text-sm,
h4[data-testid="space-name"].truncate,
h4.text-sm.truncate.font-medium[data-testid="space-name"] {
  font-family: 'GT-Pressura-Standard-Medium', Arial, sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
}
/* Category labels (Programs, Resources, etc.) */
button[data-testid="space-group"],
button[data-testid="space-group"] span {
  font-family: 'GT-Pressura-Standard-Bold', Arial, sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}
/* Dropdown selectors (Latest, etc.) */
[data-testid="dropdown-button-wrapper"] button span.text-sm.font-medium,
button[data-testid="dropdown-button"] span.text-sm.font-medium {
  font-family: 'GT-Pressura-Standard-Medium', Arial, sans-serif !important;
  font-weight: 500 !important;
  font-size: var(--btn-md-size) !important;
}
/* Start a post placeholder */
span.text-md.font-normal.text-light,
span.text-md.font-normal.leading-5.tighter.normal-case.text-light {
  font-family: 'GT-Pressura-Standard-Medium', Arial, sans-serif !important;
  font-weight: 500 !important;
}
/* Post engagement (likes, comments) - unified sizing */
button[data-testid="post-comment-count"],
[data-testid="post-comment-count"],
.engagement__members span.text-sm.font-medium,
.engagement_members span.text-sm.font-medium,
div[class*="engagement"] span.text-sm.font-medium,
span.overflow-anywhere.text-default.text-sm.font-medium {
  font-family: 'GT-Pressura-Standard-Medium', Arial, sans-serif !important;
  font-weight: 500 !important;
  font-size: var(--btn-sm-size) !important;
}
/* Author headline/credentials */
button.author__credentials,
button.author__credentials span,
.author__credentials span.overflow-anywhere {
  font-family: 'GT-Pressura-Standard-Medium', Arial, sans-serif !important;
  font-weight: 500 !important;
}
/* Search button in header */
nav[data-testid="navigation-bar-wrapper"] button.border-primary,
[data-testid="right-action-block"] button.border-primary {
  font-family: 'GT-Pressura-Standard-Medium', Arial, sans-serif !important;
  font-weight: 500 !important;
}

/* Right sidebar: sticky subscribe widget on scroll (desktop only) */
/* Circle's scroll container is .community__content (overflow:auto below the 64px nav), not the window. */
/* The aside stretches to full flex-row height (~15k px) but sidebar__content is short (~764px). */
/* Strategy: stretch sidebar__content to fill the aside (height:100%), fix its overflow:hidden, */
/* then make just the subscribe widget sticky. The space header is also sticky at 72px inside */
/* the scroll container, so top:96px (72 + 24 breathing room) clears it. */
@media (min-width: 1024px) {
  [data-testid="sidebar-right"] > .sidebar__content {
    height: 100% !important;
    overflow: visible !important;
  }
  #map-subscribe-widget {
    position: sticky !important;
    top: 96px !important;
  }
}

/* Right sidebar: subscribe widget heading — match Featured card size (20px) */
#map-subscribe-widget .subscribe-heading { font-size: 1.25rem !important; }

/* Right sidebar featured links — floor at P3 (16px) */
[data-testid="sidebar-right"] a.text-sm { font-size: var(--wb-p3) !important; }
/* Right sidebar section headings */
[data-testid="sidebar-right"] h4,[data-testid="sidebar-right"] .text-xl,[data-testid="sidebar-right"] .font-semibold,.sidebar__right h4,.sidebar__right .text-xl.font-semibold,aside[aria-label*="sidebar"] h4,aside[aria-label*="sidebar"] .text-xl{font-family:var(--font-sans-bold);font-size:var(--wb-p2)}
/* "See more" button — treat as a link, not a heading */
[data-testid="sidebar-right"] button > span.font-semibold.tighter { font-size: var(--wb-p3) !important; font-family: var(--font-serif-bold) !important; font-weight: 700 !important; }

/* Right sidebar: "More" dropdown - bump up size */
[data-testid="sidebar-right"] [data-testid="dropdown-button"],
[data-testid="sidebar-right"] button[aria-haspopup="menu"],
aside[aria-label*="sidebar"] [data-testid="dropdown-button"] {
  font-family: var(--font-sans-med) !important;
  font-size: var(--wb-p2) !important;
}

/* Right sidebar: Share link/button - bump up size, link color */
[data-testid="sidebar-right"] [data-testid*="share"],
[data-testid="sidebar-right"] button:has(svg[class*="share"]),
[data-testid="sidebar-right"] a:has(svg[class*="share"]),
aside[aria-label*="sidebar"] [data-testid*="share"] {
  font-family: var(--font-sans-med) !important;
  font-size: var(--wb-p2) !important;
  color: var(--tactile-blue) !important;
}

/* Right sidebar: "Featured" heading (when it's a link) - scale down, link color */
[data-testid="sidebar-right"] a h4,
[data-testid="sidebar-right"] h4 a,
[data-testid="sidebar-right"] a.font-semibold,
[data-testid="sidebar-right"] a[href*="/featured"],
aside[aria-label*="sidebar"] a h4 {
  font-family: var(--font-sans-med) !important;
  font-size: var(--wb-p3) !important;
  color: var(--tactile-blue) !important;
}

/* Right sidebar: "See more" text link - scale down, link color */
[data-testid="sidebar-right"] a[href*="see-more"],
[data-testid="sidebar-right"] a.text-sm:not([data-testid]),
[data-testid="sidebar-right"] .see-more,
[data-testid="sidebar-right"] a:has(span:contains("See more")),
aside[aria-label*="sidebar"] a[href*="see-more"] {
  font-family: var(--font-sans-med) !important;
  font-size: var(--wb-p3) !important;
  color: var(--tactile-blue) !important;
}

/* Upcoming events - simplified */
.upcoming-events a,.upcoming-events .event-title{font-family:var(--font-serif-bold);font-size:var(--sidebar-text);line-height:1.4;font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}
.upcoming-events .event-date,.upcoming-events .uppercase{font-family:var(--font-sans-med)}

[data-testid="show-expanded-and"],.text-light.hover\:text-dark,.mt-2.text-base{font-family:var(--font-serif-bold)}

/* Trending posts - simplified */
/* Article titles one step smaller than section header for proper hierarchy */
.trending-posts a,.trending-posts__post-name{font-family:var(--font-serif-bold);font-size:var(--badge-size);line-height:1.4;font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}
.trending-posts h4{font-family:var(--font-sans-bold);font-size:var(--wb-p1)}

/* Right sidebar block titles (Trending posts, Upcoming events, etc.) */
/* Matches left sidebar space-group titles (Community Connections, Programs, etc.) */
.block__title h4,
.block__title .text-lg,
.block__title .text-xl {
  font-family: var(--font-sans-bold) !important;
  font-size: var(--wb-p3) !important;
  line-height: 1.4 !important;
  letter-spacing: normal !important;
}

/* Post titles - with !important to override Circle defaults */
/* Circle uses h4 in modal views, h1 in feed */
[data-testid="post-title"],
.post__title,
h1.text-2xl,
h1.text-3xl,
[role="dialog"] h1,
[role="dialog"] h4.text-lg,
[role="dialog"] h4.font-bold,
[data-headlessui-state] h1,
[data-headlessui-state] h4.text-lg,
[data-headlessui-state] h4.font-bold,
[data-testid="modal"] h4,
[data-testid="modal-header"] h4 {
  font-family: var(--font-sans-black) !important;
  font-size: var(--post-title) !important;
  line-height: var(--lh-post-title) !important;
  letter-spacing: normal !important;
  margin-top: 0;
  margin-bottom: .5em;
}
[data-testid="post-title"] a,
.post__title a,
h1.text-2xl a,
h1.text-3xl a,
[role="dialog"] h4 a,
[data-headlessui-state] h4 a {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Forms & buttons - simplified */
button,input[type="button"],input[type="submit"],[role="button"],.button{font-family:var(--font-sans-med)}
.wb-button,.wb-text-button,[data-block-type$="Button"]{font-family:var(--font-sans-med);font-feature-settings:normal;font-variant-numeric:normal}
.wb-button *,.wb-text-button *,[data-block-type$="Button"] *{font-family:inherit}

/* Website Builder button classes */
[class*="wb-font-button"],[class*="wb-text-button"],[data-block-type="primaryButton"],[data-block-type="secondaryButton"]{font-family:var(--font-sans-med) !important;font-feature-settings:normal;font-variant-numeric:normal}
[class*="wb-font-button"] *,[class*="wb-text-button"] *,[data-block-type="primaryButton"] *,[data-block-type="secondaryButton"] *{font-family:inherit !important}
.tiptap-cta{font-family:var(--font-sans-med)}

/* ===== TACTILE BUTTONS ===== */
/* Physical "push button" effect using per-element CSS custom properties.
   Each selector sets --_accent, --_size, --_elev, --_bw, --_rad.
   Shared base + state rules reference those variables.
   Global tier/color tokens defined in main :root block above. */

/* Shared tactile base — all tactile buttons inherit these behaviors */
[data-block-type="primaryButton"],[data-block-type="secondaryButton"],
.wb-button[class*="bg-brand"],button.bg-brand:not([data-testid="post-comment-count"]),
nav button.bg-brand,nav button[class*="bg-brand"],header button.bg-brand,
[data-testid="new-post-button"],[data-testid="create-post-button"],button[id*="btn-quick-post"],
button.border-brand,button.bg-brand.text-brand-button,
button[type="submit"].bg-brand:not([id*="btn-quick-post"]),
:not(nav):not(header) > button.bg-brand.text-sm:not([id*="btn-quick-post"]),
main button.bg-brand.text-sm:not([id*="btn-quick-post"]),
[id*="create-comment"] button.bg-brand,
a.tiptap-cta,.tiptap-cta,
button.bg-circle-button,button.text-circle-button,.rsvp-section button,[data-testid="event-finished"] button,
#map-calendar-widget .cal-google,#map-calendar-widget .cal-outlook,#map-calendar-widget .cal-other,
[data-testid="community_member"] button.bg-brand,
button[data-testid="connect-button"],button[data-testid="connect-button"].rounded-full,
button[aria-label="Connect"].rounded-full,[data-testid="community_member"] button[aria-label="Connect"],
[data-testid="see-more-post"] {
  font-family: var(--font-sans-med)!important;
  background-color: var(--tactile-bg)!important;
  border: none!important;
  font-size: var(--_size)!important;
  color: var(--_accent)!important;
  border-radius: var(--_rad)!important;
  box-shadow: inset 0 0 0 var(--_bw) var(--_accent),0 var(--_elev) 0 0 var(--_accent)!important;
  transform: translateY(0);
  transition: transform 0.12s cubic-bezier(0.25,0.46,0.45,0.94),box-shadow 0.12s cubic-bezier(0.25,0.46,0.45,0.94)!important;
}

/* Shared hover state */
[data-block-type="primaryButton"]:hover,[data-block-type="secondaryButton"]:hover,
.wb-button[class*="bg-brand"]:hover,button.bg-brand:not([data-testid="post-comment-count"]):hover,
nav button.bg-brand:hover,nav button[class*="bg-brand"]:hover,header button.bg-brand:hover,
[data-testid="new-post-button"]:hover,[data-testid="create-post-button"]:hover,button[id*="btn-quick-post"]:hover,
button.border-brand:hover,button.bg-brand.text-brand-button:hover,
button[type="submit"].bg-brand:not([id*="btn-quick-post"]):hover,
:not(nav):not(header) > button.bg-brand.text-sm:not([id*="btn-quick-post"]):hover,
main button.bg-brand.text-sm:not([id*="btn-quick-post"]):hover,
[id*="create-comment"] button.bg-brand:hover,
a.tiptap-cta:hover,.tiptap-cta:hover,
button.bg-circle-button:hover,button.text-circle-button:hover,.rsvp-section button:hover,[data-testid="event-finished"] button:hover,
#map-calendar-widget .cal-google:hover,#map-calendar-widget .cal-outlook:hover,#map-calendar-widget .cal-other:hover,
[data-testid="community_member"] button.bg-brand:hover,
button[data-testid="connect-button"]:hover,button[data-testid="connect-button"].rounded-full:hover,
button[aria-label="Connect"].rounded-full:hover,[data-testid="community_member"] button[aria-label="Connect"]:hover,
[data-testid="see-more-post"]:hover {
  transform: translateY(calc(var(--_elev)*0.25))!important;
  box-shadow: inset 0 0 0 var(--_bw) var(--_accent),0 calc(var(--_elev)*0.75) 0 0 var(--_accent)!important;
}

/* Shared active state */
[data-block-type="primaryButton"]:active,[data-block-type="secondaryButton"]:active,
.wb-button[class*="bg-brand"]:active,button.bg-brand:not([data-testid="post-comment-count"]):active,
nav button.bg-brand:active,nav button[class*="bg-brand"]:active,header button.bg-brand:active,
[data-testid="new-post-button"]:active,[data-testid="create-post-button"]:active,button[id*="btn-quick-post"]:active,
button.border-brand:active,button.bg-brand.text-brand-button:active,
button[type="submit"].bg-brand:not([id*="btn-quick-post"]):active,
:not(nav):not(header) > button.bg-brand.text-sm:not([id*="btn-quick-post"]):active,
main button.bg-brand.text-sm:not([id*="btn-quick-post"]):active,
[id*="create-comment"] button.bg-brand:active,
a.tiptap-cta:active,.tiptap-cta:active,
button.bg-circle-button:active,button.text-circle-button:active,.rsvp-section button:active,[data-testid="event-finished"] button:active,
#map-calendar-widget .cal-google:active,#map-calendar-widget .cal-outlook:active,#map-calendar-widget .cal-other:active,
[data-testid="community_member"] button.bg-brand:active,
button[data-testid="connect-button"]:active,button[data-testid="connect-button"].rounded-full:active,
button[aria-label="Connect"].rounded-full:active,[data-testid="community_member"] button[aria-label="Connect"]:active,
[data-testid="see-more-post"]:active {
  transform: translateY(var(--_elev))!important;
  box-shadow: inset 0 0 0 var(--_bw) var(--_accent),0 0 0 0 var(--_accent)!important;
  transition-duration: 0.06s!important;
}

/* --- Tier + Color assignments (set per-element variables) --- */

/* LARGE Orange (WB Primary) */
[data-block-type="primaryButton"] {
  font-family: var(--font-sans-bold)!important;
  --_accent: var(--tactile-orange);--_size: var(--btn-lg-size);--_elev: var(--btn-lg-elevation);--_bw: var(--btn-lg-border);--_rad: var(--btn-lg-radius);
}

/* MEDIUM Orange */
.wb-button[class*="bg-brand"],
nav button.bg-brand,nav button[class*="bg-brand"],header button.bg-brand,
[data-testid="new-post-button"],[data-testid="create-post-button"],
button.border-brand,button.bg-brand.text-brand-button,a.tiptap-cta,.tiptap-cta,
button[id*="btn-quick-post"].bg-brand,button[id*="btn-quick-post"].text-sm,button[id*="btn-quick-post"] {
  --_accent: var(--tactile-orange);--_size: var(--btn-md-size);--_elev: var(--btn-md-elevation);--_bw: var(--btn-md-border);--_rad: var(--btn-md-radius);
}

/* MEDIUM Ink (WB Secondary) */
[data-block-type="secondaryButton"] {
  --_accent: var(--tactile-ink);--_size: var(--btn-md-size);--_elev: var(--btn-md-elevation);--_bw: var(--btn-md-border);--_rad: var(--btn-md-radius);
}

/* MEDIUM Blue (Event buttons) */
button.bg-circle-button,button.text-circle-button,.rsvp-section button,[data-testid="event-finished"] button {
  --_accent: var(--tactile-blue);--_size: var(--btn-md-size);--_elev: var(--btn-md-elevation);--_bw: var(--btn-md-border);--_rad: var(--btn-md-radius);
}

/* SMALL Orange */
button[type="submit"].bg-brand:not([id*="btn-quick-post"]):not(.text-brand-button),
:not(nav):not(header) > button.bg-brand.text-sm:not([id*="btn-quick-post"]):not(.text-brand-button),
main button.bg-brand.text-sm:not([id*="btn-quick-post"]):not(.text-brand-button),
[id*="create-comment"] button.bg-brand,
[data-testid="community_member"] button.bg-brand {
  --_accent: var(--tactile-orange);--_size: var(--btn-sm-size);--_elev: var(--btn-sm-elevation);--_bw: var(--btn-sm-border);--_rad: var(--btn-sm-radius);
}

/* SMALL Blue (Calendar) */
#map-calendar-widget .cal-google,#map-calendar-widget .cal-outlook {
  --_accent: var(--tactile-blue);--_size: var(--btn-sm-size);--_elev: var(--btn-sm-elevation);--_bw: var(--btn-sm-border);--_rad: var(--btn-sm-radius);
}

/* SMALL Ink */
#map-calendar-widget .cal-other,
button[data-testid="connect-button"],button[data-testid="connect-button"].rounded-full,
button[aria-label="Connect"].rounded-full,[data-testid="community_member"] button[aria-label="Connect"],
[data-testid="see-more-post"] {
  --_accent: var(--tactile-ink);--_size: var(--btn-sm-size);--_elev: var(--btn-sm-elevation);--_bw: var(--btn-sm-border);--_rad: var(--btn-sm-radius);
}

/* Connect button overrides */
button[data-testid="connect-button"],button[data-testid="connect-button"].rounded-full,
button[aria-label="Connect"].rounded-full,[data-testid="community_member"] button[aria-label="Connect"] {
  padding: .5rem 1.25rem!important;
  border-color: transparent!important;
}

/* See more button specifics */
[data-testid="see-more-post"] {
  display: inline-flex!important;
  align-items: center!important;
  width: fit-content!important;
  align-self: flex-start!important;
  padding: 6px 14px;
}

/* Dark mode */
html.dark {
  --tactile-bg: #F2F0E5;
  --tactile-orange: #BC5215;
  --tactile-blue: #4385BE;
  --tactile-ink: #CECDC3;
  /* Shared design tokens — dark overrides */
  --color-text: #E6E4D9;
  --color-text-secondary: #B7B5AC;
  --color-surface: #282726;
  --color-brand: #DA702C;
  --shadow-color: rgba(0, 0, 0, 0.3);
}

/* Event sidebar fonts */
.rsvp-section,[data-testid="event-finished"],[data-testid="event-date"],[data-testid="event-date"] span {
  font-family: var(--font-sans-med)!important;
}

/* ===== MEMBER DIRECTORY ===== */
/* Member cards & list items */
[data-testid="community_member"]{border-color:rgba(16,32,64,.08)}

/* Member name - uses "tighter" + "font-semibold" as distinguisher */
span.font-semibold.tighter{font-family:var(--font-sans-bold) !important;font-size:var(--wb-p2) !important;line-height:1.25;letter-spacing:.005em}

/* Member job title - all contexts should be p3 */
p.font-normal.tracking-tight,
p.text-xs.font-normal,
p.text-sm.font-normal.truncate{font-family:var(--font-serif) !important;font-size:var(--wb-p3) !important;line-height:1.4;font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}

/* Section headings (All members, Recommendations) */
span.text-lg.font-semibold.tightest{font-family:var(--font-sans-bold) !important}

/* Member location - has location icon nearby */
span.text-xs.font-normal.truncate{font-family:var(--font-serif) !important;font-size:var(--badge-size) !important;line-height:1.4;font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}

/* Member tags */
[data-testid="member-tag"]{display:inline-flex;align-items:center;font-family:var(--font-sans-med);font-size:var(--badge-size);letter-spacing:.02em;padding:.35rem .85rem}
[data-testid="member-tag-label"]{position:relative;top:-1px;font-size:var(--badge-size) !important}

/* Normalize Admin badge to match other member tags */
[data-testid*="admin-badge"]{background:#C03E35 !important;border-color:#C03E35 !important;color:#fff !important}
[data-testid*="admin-badge"] [data-testid="member-tag-label"]{font-family:var(--font-sans-med) !important;font-size:var(--badge-size) !important}

/* Post author name */
[data-testid="post-avatar"]{font-family:var(--font-sans-med) !important;font-size:var(--wb-p2) !important}

/* Post title in feed */
h1[data-testid="post-title"]{font-family:var(--font-sans-black) !important;font-size:var(--post-title) !important;line-height:var(--lh-post-title) !important}

/* View profile & Connect buttons are styled by the main tactile button section above */

/* ===== FIND MEMBERS SECTION ===== */
/* Search input */
input[name="search-filter-input"]{font-family:var(--font-serif);font-size:var(--wb-p2)}
input[name="search-filter-input"]::placeholder{font-family:var(--font-serif);opacity:.5}

/* Filter buttons */
[data-testid="filters-section"] button{font-family:var(--font-sans-med);font-size:var(--wb-p3);transition:all .15s ease}
[data-testid="filters-section"] .bg-secondary button{font-family:var(--font-sans-bold)}

/* Filter labels (Location, Tag, Organization) - uses font-normal.tighter.text-dark */
span.text-sm.font-normal.tighter.text-dark{font-family:var(--font-sans-med) !important;font-size:var(--wb-p3) !important}

/* Filter inputs and dropdowns */
[data-testid*="profile-field-filter-input"] input,
[data-testid*="profile-field-filter-input"] input::placeholder{font-family:var(--font-serif) !important;font-size:var(--wb-p3) !important}

/* Member directory tabs (All members / My connections) */
[data-testid*="member-directory-tab"] span{font-family:var(--font-sans-med) !important}

/* ===== WELCOME BANNER ===== */
[data-testid="welcome-banner-inside"]{border:none;box-shadow:none}
[data-testid="welcome-banner-content"]{border:none}
[data-testid="welcome-banner-title"]{font-family:var(--font-sans-black);font-size:var(--h3);line-height:var(--lh-tight);margin:0 0 .5em}
[data-testid="welcome-banner-content"] p,[data-testid="welcome-banner-content"] .trix-content{font-family:var(--font-serif);font-size:var(--body-size);line-height:var(--lh-body);font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}

/* ===== MEMBER PROFILE MODAL ===== */
[data-testid="profile-modal-header"] .font-semibold{font-family:var(--font-sans-bold);font-size:var(--wb-p1);line-height:1.25;letter-spacing:.005em}
[data-testid="profile-modal-header"] .text-sm{font-family:var(--font-serif);font-size:var(--wb-p3);line-height:1.4;font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums;opacity:.75}

/* Constrain profile tab content width for readable line lengths */
[data-testid="profile-modal-tab-content"]{max-width:720px}

/* Profile field values — Alpina P2 (overrides filter-label rule that shares same span classes) */
[data-testid="user-profile-field"] .text-dark span.text-sm.font-normal{font-family:var(--font-serif) !important;font-size:var(--wb-p2) !important;line-height:var(--lh-body) !important;font-feature-settings:var(--alpina-ot);font-variant-numeric:oldstyle-nums}

/* Hide "Last seen X ago" from member profiles */
div.flex.items-start.space-x-1\.5:has(.icon-16-clock){display:none !important}

/* ===== PINNED POST TREATMENT ===== */
/* Light mode only: warm tint + lift effect to distinguish pinned posts */
/* Requires :has() — graceful degradation: pinned posts use default styling on unsupported browsers */
html:not(.dark) [data-testid="post-container"]:has(.post__pin--pinned) {
  background: #fffcf0; /* Flexoki Paper */
  box-shadow:
    0 4px 8px -2px rgba(16, 15, 15, 0.1),
    0 12px 28px -8px rgba(16, 15, 15, 0.12),
    0 2px 4px rgba(16, 15, 15, 0.04); /* Flexoki Black #100F0F */
  border: 1px solid rgba(16, 15, 15, 0.08);
}
html:not(.dark) [data-testid="post-container"]:has(.post__pin--pinned) .trix-content,
html:not(.dark) [data-testid="post-container"]:has(.post__pin--pinned) .post__body,
html:not(.dark) [data-testid="post-container"]:has(.post__pin--pinned) .post__content {
  background: transparent;
}
html:not(.dark) [data-testid="post-container"]:has(.post__pin--pinned) .trix-content,
html:not(.dark) [data-testid="post-container"]:has(.post__pin--pinned) .trix-content p,
html:not(.dark) [data-testid="post-container"]:has(.post__pin--pinned) .trix-content div {
  font-family: var(--font-serif);
  font-size: var(--body-size);
  line-height: var(--lh-body);
}

/* Override: Pinned posts with embedded forms get white background to match form iframe */
html:not(.dark) [data-testid="post-container"]:has(.post__pin--pinned):has([data-circle-form-uid]) {
  background: #fff;
  border: 1px solid rgba(16, 15, 15, 0.06);
}

/* Calendar widget CSS is now self-contained in map-calendar-widget.js */

/* ===== VIEW SWITCHER - SIMPLE PROMINENCE ===== */
/* Requires :has() — graceful degradation: view switcher uses default border on unsupported browsers */
div.border-primary.inline-flex:has([data-testid*="view-switcher"]) {
  border: 2px solid #1C1B1A !important;
}
html.dark div.border-primary.inline-flex:has([data-testid*="view-switcher"]) {
  border-color: #878580 !important;
}

/* ===== EXPERIMENTS SPACES - TYPEWRITER TREATMENT ===== */
/* Field notes aesthetic for experiment spaces */
/* Scoped to specific space paths via data-current-path attribute */

/* From Data to Decision experiment */
body[data-current-path*="/c/from-data-to-decision"] .trix-content,
body[data-current-path*="/c/from-data-to-decision"] .post_body,
body[data-current-path*="/c/from-data-to-decision"] [data-testid="post-body-inside"],
body[data-current-path*="/c/from-data-to-decision"] .tiptap.ProseMirror p {
  font-family: var(--font-typewriter) !important;
  font-size: calc(var(--body-size) * 0.92) !important; /* Slightly smaller for mono */
  line-height: 1.6 !important;
  letter-spacing: 0.01em;
  font-feature-settings: normal;
  font-variant-numeric: normal;
}

/* Typewriter bold for strong/links in experiment spaces */
body[data-current-path*="/c/from-data-to-decision"] .trix-content strong,
body[data-current-path*="/c/from-data-to-decision"] .trix-content b,
body[data-current-path*="/c/from-data-to-decision"] .post_body strong,
body[data-current-path*="/c/from-data-to-decision"] .post_body b,
body[data-current-path*="/c/from-data-to-decision"] .trix-content a,
body[data-current-path*="/c/from-data-to-decision"] .post_body a {
  font-family: var(--font-typewriter-bold) !important;
  font-weight: 700;
}

/* Lists in experiment spaces */
body[data-current-path*="/c/from-data-to-decision"] .trix-content ul,
body[data-current-path*="/c/from-data-to-decision"] .trix-content ol,
body[data-current-path*="/c/from-data-to-decision"] .trix-content li,
body[data-current-path*="/c/from-data-to-decision"] .post_body ul,
body[data-current-path*="/c/from-data-to-decision"] .post_body ol,
body[data-current-path*="/c/from-data-to-decision"] .post_body li {
  font-family: var(--font-typewriter) !important;
  font-size: calc(var(--body-size) * 0.92) !important;
  line-height: 1.6 !important;
}

/* Blockquotes in experiment spaces */
body[data-current-path*="/c/from-data-to-decision"] .trix-content blockquote,
body[data-current-path*="/c/from-data-to-decision"] .post_body blockquote {
  font-family: var(--font-typewriter) !important;
  border-left-color: var(--tactile-ink);
}

/* ===== CHECKOUT: HIDE BUSINESS NAME & TAX ID ===== */
form[data-testid="checkout-form"] .flex-col:has([data-testid*="business_name"]):not(.border-secondary-200) {
  display: none !important;
}
form[data-testid="checkout-form"] .underline:has([data-testid="checkout-form-add-tax-id-button"]) {
  display: none !important;
}