:root {
  --font-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-sans:  'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.practice {
  background: var(--cream);
  
  padding: var(--flow-section) var(--gutter);
}

@media (max-width: 1023px) {
  .practice:first-of-type {
    padding-top: max(var(--flow-section), 168px);
  }
}

.practice__inner {
  max-width: 42rem;          
  margin: 0 auto;
  text-align: center;
}

.practice__eyebrow {
  display: block;
  font-family: var(--font-sans);
  font-size: var(--fs-micro);          
  font-weight: 600;                    
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--sage-deep);             
  margin-bottom: var(--flow-sm);
}

.practice__title {
  font-family: var(--font-serif);
  font-size: var(--fs-page-title);
  font-weight: 400;
  line-height: 1.15;
  color: var(--charcoal);
  margin-bottom: var(--flow-3xs);
}

.practice__meta {
  font-family: var(--font-sans);
  font-size: var(--fs-small);
  color: var(--warm-taupe);
  letter-spacing: 0.04em;
  margin-bottom: var(--flow-lg);
}

.practice__intro {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  font-weight: 300;
  line-height: var(--leading-body);    
  color: var(--charcoal);
  max-width: var(--measure);
  margin: 0 auto var(--flow-xl);
}

.practice__two-minute {
  font-family: var(--font-serif);
  font-size: clamp(1.05rem, 1.2vw + 0.7rem, 1.3rem);
  font-style: italic;
  font-weight: 400;
  line-height: 1.6;
  color: var(--charcoal);
  max-width: 32rem;
  margin: var(--flow-xl) auto 0;
}

.practice__safety,
.practice__support {
  font-family: var(--font-sans);
  font-weight: 300;
  line-height: var(--leading-body);
  max-width: 34rem;
  margin-left: auto;
  margin-right: auto;
}

.practice__safety {
  font-size: var(--fs-small);
  color: var(--warm-taupe);            
  margin-top: var(--flow-xl);
}

.practice__support {
  font-size: var(--fs-micro);
  color: var(--warm-taupe);
  margin-top: var(--flow-sm);
}

.practice__more {
  margin-top: var(--flow-xl);
  font-family: var(--font-sans);
  font-size: var(--fs-small);
  font-weight: 300;
}

.practice__more a {
  color: var(--sage-deep);
  text-decoration: underline;
  text-underline-offset: 0.3em;
  text-decoration-thickness: 1px;
  transition: color 0.8s var(--ease-smooth);
}

.practice__more a:hover { color: var(--charcoal); }

@media (prefers-reduced-motion: reduce) {
  .practice__more a { transition: none; }
}

.nav--light .site-nav::before {
  background-color: var(--cream);
  border-bottom-color: var(--stone);
}

.site-nav::before,
.site-nav[data-nav-state="morph"]::before,
.site-nav[data-nav-state="collapsed"]::before {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.practice__caution {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  font-weight: 300;
  line-height: var(--leading-body);
  color: var(--charcoal);
  max-width: var(--measure);
  margin: 0 auto var(--flow-xl);
}

.practice__more a:focus-visible,
.footer__list a:focus-visible,
.footer__legal a:focus-visible,
.nav-logo:focus-visible,
.nav-pill__links a:focus-visible,
.nav-pill__cta:focus-visible,
.nav-pill__dropdown-item:focus-visible,
.nav-pill__dropdown-footer a:focus-visible,
.nav-pill__burger:focus-visible,
.nav-mobile a:focus-visible {
  outline: 2px solid var(--sage-deep);
  outline-offset: 3px;
}