/* Shared public UI polish loaded after page-level CSS. */
body {
  background:
    radial-gradient(ellipse at 18% 8%, rgba(255, 234, 198, .72), transparent 34%),
    linear-gradient(180deg, #fffcf6 0%, #fffaf1 42%, #f8f4ed 100%);
}

body > main,
body > .auth-page {
  flex: 1 0 auto;
}

.jjb-chrome-header {
  box-shadow: 0 8px 28px rgba(73, 55, 31, .055);
}

.jjb-chrome-header .nav-inner,
.jjb-chrome-footer .wrap,
.wrap {
  max-width: 1240px;
}

.jjb-chrome-header .brand,
.jjb-chrome-footer .footer-brand .brand {
  letter-spacing: 0;
}

.jjb-chrome-nav a,
.jjb-nav-dropdown__trigger,
.jjb-chrome-ghost {
  font-weight: 800;
}

.jjb-chrome-nav a.is-active,
.jjb-chrome-nav a:hover,
.jjb-nav-dropdown__trigger:hover,
.jjb-nav-dropdown.is-open .jjb-nav-dropdown__trigger,
.jjb-nav-dropdown.is-active .jjb-nav-dropdown__trigger {
  color: #7852a8;
  background: #f0e9f8;
}

.jjb-chrome-footer {
  margin-top: 56px;
  background:
    linear-gradient(180deg, rgba(255, 252, 246, .55), #f8f4ed 42%),
    #f8f4ed;
}

.breadcrumb,
.breadcrumb-strip .breadcrumb {
  min-height: 36px;
  padding: 7px 12px;
  width: fit-content;
  max-width: 100%;
  background: rgba(255, 255, 255, .68);
  border: 1px solid rgba(46, 42, 61, .08);
  border-radius: 12px;
  box-shadow: 0 5px 18px rgba(46, 42, 61, .04);
}

.breadcrumb a {
  color: #7554a7;
  font-weight: 850;
}

.breadcrumb .current {
  color: #373144;
}

.eyebrow,
.home-eyebrow,
.section-head .eyebrow,
.cat-masthead .eyebrow,
.legal-masthead .eyebrow,
.masthead .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #7a5a37;
  background: #fff3d9;
  border: 1px solid rgba(236, 185, 102, .42);
  border-radius: 999px;
  padding: 6px 13px;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0;
}

.masthead,
.cat-masthead,
.legal-masthead,
.auth-section,
.contact-section,
.cat-list,
.legal-content {
  position: relative;
}

.masthead,
.cat-masthead,
.legal-masthead {
  overflow: hidden;
  padding-block: clamp(46px, 6vw, 84px);
  background:
    radial-gradient(ellipse at 18% 30%, rgba(255, 240, 211, .95), transparent 45%),
    linear-gradient(135deg, #fffaf1 0%, #fffcf6 58%, #f2edf9 100%);
  border-bottom: 1px solid rgba(46, 42, 61, .08);
}

.masthead::after,
.cat-masthead::after,
.legal-masthead::after {
  content: "";
  position: absolute;
  inset-inline-start: max(24px, calc((100vw - 1240px) / 2 + 32px));
  bottom: -70px;
  width: clamp(170px, 20vw, 280px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: #ffeac6;
  border: 1px dashed #dec7a6;
  opacity: .7;
  pointer-events: none;
}

.masthead .wrap,
.cat-masthead .wrap,
.legal-masthead .wrap {
  position: relative;
  z-index: 1;
}

.masthead h1,
.cat-masthead h1,
.legal-masthead h1,
.auth-form-pane h1,
.form-card h2,
.section-head h2,
.archive-section-head h2,
.page-cta__inner h2,
.cta-inner h2 {
  color: #2e2a3d;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.65;
}

.masthead h1,
.cat-masthead h1,
.legal-masthead h1 {
  max-width: 820px;
  margin-top: 18px;
  font-size: clamp(30px, 4vw, 48px);
}

.lead,
.masthead .lead,
.cat-masthead .lead,
.legal-masthead .lead,
.section-head p,
.page-cta__inner p,
.cta-inner p {
  color: #6c6375;
  line-height: 2.05;
}

.masthead .lead,
.cat-masthead .lead,
.legal-masthead .lead {
  max-width: 700px;
  margin-top: 12px;
  font-size: 15px;
}

.masthead-mascot,
.cta-mascot {
  filter: drop-shadow(0 14px 18px rgba(133, 80, 20, .12));
}

.content-card,
.video-card,
.guide-card,
.team-card,
.val,
.info-card,
.form-card,
.legal-prose,
.home-plan,
.benefit-grid article,
.tl-item,
.auth-form-pane,
.auth-welcome,
.page-cta__inner,
.cta-inner,
.stats-inner {
  background: rgba(255, 255, 255, .92);
  border: 1px solid #e7e1d9;
  box-shadow: 0 8px 28px rgba(81, 49, 39, .07);
}

.content-card,
.video-card,
.guide-card,
.team-card,
.val,
.info-card,
.form-card,
.home-plan,
.benefit-grid article,
.tl-item,
.auth-form-pane,
.auth-welcome {
  border-radius: 18px;
}

.legal-prose,
.page-cta__inner,
.cta-inner,
.stats-inner {
  border-radius: 24px;
}

.content-card:hover,
.video-card:hover,
.guide-card:hover,
.team-card:hover {
  transform: none;
  box-shadow: 0 12px 36px rgba(81, 49, 39, .11);
}

.btn {
  min-height: 48px;
  border-radius: 14px;
  font-weight: 850;
  letter-spacing: 0;
}

.btn-primary {
  color: #332615;
  background: #ffac32;
  border: 1px solid #f09b23;
  box-shadow: 0 3px 0 #e58d1e;
}

.btn-primary:hover {
  background: #ffc05e;
  transform: none;
}

.btn-outline,
.btn-light,
.btn-outline-light {
  color: #373144;
  background: #fff;
  border: 1px solid #ddd7cd;
  box-shadow: 0 3px 0 #ede8df;
}

.btn-outline:hover,
.btn-light:hover,
.btn-outline-light:hover {
  color: #7554a7;
  border-color: #d9cbea;
  transform: none;
}

.archive-nav-pills,
.cta-actions,
.page-cta__actions,
.hero-actions,
.form-foot {
  gap: 12px;
}

.video-grid,
.team-grid,
.val-grid,
.guide-grid,
.home-content-grid,
.discovery-grid,
.benefit-grid,
.contact-grid {
  gap: 20px;
}

.thumb,
.content-thumb,
.guide-cover,
.avatar {
  background: #eee7f8;
}

.level-badge,
.content-tag,
.chip,
.hours {
  background: #f2edf9;
  color: #7554a7;
  border: 1px solid #e3d8ef;
  border-radius: 8px;
}

input,
textarea,
select,
.field input,
.field textarea,
.field select {
  border-color: #e2d9ce;
  border-radius: 14px;
  background: #fffdfa;
}

input:focus,
textarea:focus,
select:focus,
.field input:focus,
.field textarea:focus,
.field select:focus {
  border-color: #b99add;
  box-shadow: 0 0 0 4px rgba(124, 92, 191, .12);
  outline: none;
}

.page-cta,
.cta-banner {
  padding-block: 54px 70px;
}

.page-cta__inner,
.cta-inner,
.final-card {
  background:
    radial-gradient(ellipse at 15% 20%, rgba(255, 240, 211, .95), transparent 44%),
    linear-gradient(135deg, #fff4df, #eee7f6);
}

.faq-item summary,
.faq-q {
  color: #373144;
}

.faq-item[open],
.faq-item:hover {
  border-color: #ded2c4;
}

/* Keep the homepage FAQ as an accordion list, not as a stack of cards. */
body.jjb-home .faq-item {
  background: transparent;
  border: 0;
  border-bottom: 1px solid #e5ded5;
  border-radius: 0;
  box-shadow: none;
}

body.jjb-home .faq-item summary {
  min-height: 66px;
  padding: 21px 0;
}

body.jjb-home .faq-item:hover,
body.jjb-home .faq-item[open] {
  border-color: #d9d0c4;
}

/* Blog, article and ad surfaces: align old public pages with the homepage system. */
.blog-masthead,
.article-masthead {
  overflow: hidden;
  color: #2e2a3d;
  padding-block: clamp(48px, 6vw, 82px);
  background:
    radial-gradient(ellipse at 18% 30%, rgba(255, 240, 211, .95), transparent 45%),
    linear-gradient(135deg, #fffaf1 0%, #fffcf6 58%, #eee7f6 100%);
  border-bottom: 1px solid rgba(46, 42, 61, .08);
}

.blog-masthead .breadcrumb,
.article-masthead .breadcrumb {
  color: #6c6375;
}

.blog-masthead .breadcrumb a,
.article-masthead .breadcrumb a {
  color: #7554a7;
}

.blog-masthead .breadcrumb span.current,
.article-masthead .breadcrumb span.current {
  color: #373144;
}

.blog-masthead .eyebrow,
.article-masthead .eyebrow {
  display: inline-flex;
  color: #7a5a37;
  background: #fff3d9;
  border: 1px solid rgba(236, 185, 102, .42);
  margin-bottom: 16px;
}

.blog-masthead h1,
.article-masthead h1 {
  color: #2e2a3d;
  line-height: 1.65;
  letter-spacing: 0;
}

.blog-masthead p.lead,
.article-meta {
  color: #6c6375;
}

.blog-search {
  max-width: 600px;
  border: 1px solid #e7e1d9;
  border-radius: 18px;
  box-shadow: 0 8px 28px rgba(81, 49, 39, .08);
}

.blog-featured-wrap {
  margin-top: -36px;
}

.featured-card,
.post-card,
.blog-sidebar .widget,
.article-content figure,
.article-content table {
  border-color: #e7e1d9;
  border-radius: 18px;
  box-shadow: 0 8px 28px rgba(81, 49, 39, .07);
}

.featured-card:hover,
.post-card:hover {
  transform: none;
  box-shadow: 0 12px 36px rgba(81, 49, 39, .11);
}

.post-tag,
.featured-tag {
  border-radius: 8px;
}

.blog-sidebar {
  top: 98px;
  gap: 0;
}

.blog-sidebar .widget {
  background: rgba(255, 255, 255, .94);
  padding: 18px;
}

.blog-sidebar .widget-head h3 {
  color: #373144;
}

.blog-sidebar .mini-post .thumb {
  background: #eee7f8;
  border: 1px solid #e3d8ef;
}

.blog-sidebar .mini-post .rank {
  background: #7554a7;
}

.blog-sidebar .ad-widget {
  border-radius: 18px;
  overflow: hidden;
}

.blog-sidebar .ad-widget .ad-eyebrow {
  padding: 12px 14px 0;
  color: #7a5a37;
  font-weight: 850;
}

.blog-sidebar .ad-slide,
.blog-sidebar .ad-static {
  color: #332615;
  background:
    radial-gradient(ellipse at 15% 18%, rgba(255, 240, 211, .95), transparent 48%),
    linear-gradient(135deg, #fff4df, #eee7f6);
}

.blog-sidebar .ad-slide.s1,
.blog-sidebar .ad-slide.s2,
.blog-sidebar .ad-slide.s3,
.blog-sidebar .ad-slide--blue,
.blog-sidebar .ad-slide--dynamic,
.blog-sidebar .ad-slide--grape,
.blog-sidebar .ad-slide--pink,
.blog-sidebar .ad-slide--leaf,
.blog-sidebar .ad-slide--green,
.blog-sidebar .ad-slide--yellow,
.blog-sidebar .ad-static--blue,
.blog-sidebar .ad-static--pink,
.blog-sidebar .ad-static--grape,
.blog-sidebar .ad-static--green,
.blog-sidebar .ad-static--leaf,
.blog-sidebar .ad-static--yellow {
  background:
    radial-gradient(ellipse at 15% 18%, rgba(255, 240, 211, .95), transparent 48%),
    linear-gradient(135deg, #fff4df, #eee7f6);
}

.blog-sidebar .ad-slide strong,
.blog-sidebar .ad-static strong {
  color: #373144;
}

.blog-sidebar .ad-slide p,
.blog-sidebar .ad-static p,
.blog-sidebar .ad-foot {
  color: #6c6375;
}

.blog-sidebar .ad-slide span.cta,
.blog-sidebar .ad-static .cta,
.blog-sidebar .ad-foot a {
  color: #7554a7;
  font-weight: 850;
}

.blog-sidebar .ad-slide__media,
.blog-sidebar .ad-slide__media img,
.blog-sidebar .ad-static img {
  border-radius: 14px;
}

.newsletter {
  background: transparent;
}

.newsletter-inner {
  color: #2e2a3d;
  background:
    radial-gradient(ellipse at 15% 20%, rgba(255, 240, 211, .95), transparent 44%),
    linear-gradient(135deg, #fff4df, #eee7f6);
  border: 1px solid #e7e1d9;
  box-shadow: 0 8px 28px rgba(81, 49, 39, .07);
}

.newsletter-inner p,
.newsletter p,
.newsletter-note {
  color: #6c6375;
  opacity: 1;
}

.newsletter-mascot {
  filter: drop-shadow(0 14px 18px rgba(133, 80, 20, .12));
}

@media (max-width: 760px) {
  .wrap,
  .jjb-chrome-header .nav-inner,
  .jjb-chrome-footer .wrap {
    padding-inline: 22px;
  }

  .masthead,
  .cat-masthead,
  .legal-masthead {
    padding-block: 34px 52px;
  }

  .masthead h1,
  .cat-masthead h1,
  .legal-masthead h1 {
    font-size: clamp(27px, 7vw, 38px);
  }

  .breadcrumb,
  .breadcrumb-strip .breadcrumb {
    width: 100%;
  }

  .page-cta,
  .cta-banner {
    padding-block: 36px 48px;
  }
}

@media (max-width: 420px) {
  .wrap,
  .jjb-chrome-header .nav-inner,
  .jjb-chrome-footer .wrap {
    padding-inline: 18px;
  }

  .btn {
    min-height: 44px;
    padding-inline: 14px;
    font-size: 12px;
    white-space: normal;
  }
}