@font-face {
  font-family:Bookman;
  src:url('assets/catalog/bookman-demi.otf') format('opentype');
  font-weight:700;
  font-display:swap}
@font-face {
  font-family:OpenSans;
  src:url('assets/catalog/open-sans-regular.woff') format('woff');
  font-display:swap}
@font-face {
  font-family:OpenSans;
  src:url('assets/catalog/open-sans-semibold.woff') format('woff');
  font-weight:600;
  font-display:swap}
:root {
  --pine:#164c41;
  --paper:#faf5e9;
  --gold:#f2b84b;
  --ink:#173e36;
  --muted:#52675d;
  --line:#a7b8a8}
* {
  box-sizing:border-box}
html {
  scroll-behavior:smooth}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.65 OpenSans,Arial,sans-serif}
a {
  color:inherit;
  text-underline-offset:.2em}
a:focus-visible {
  outline:3px solid #c37a19;
  outline-offset:4px}
.skip {
  position:absolute;
  top:-5rem;
  left:1rem;
  z-index:20;
  background:white;
  padding:.6rem}
.skip:focus {
  top:1rem}
.wrap {
  width:min(1180px,calc(100% - 48px));
  margin:auto}
.site-header {
  background:var(--paper);
  border-bottom:1px solid #d4ddcf}
.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  min-height:92px}
.brand {
  display:block;
  width:240px;
  line-height:0}
.brand img {
  width:100%;
  height:auto}
.site-header nav {
  display:flex;
  align-items:center;
  gap:2rem;
  font-weight:600;
  font-size:.9rem}
.site-header nav a {
  text-decoration:none}
.site-header nav a:hover {
  text-decoration:underline}
.nav-join {
  border:1px solid var(--pine);
  padding:.65rem 1rem;
  border-radius:4px}
.hero {
  overflow:hidden;
  background:#e7eddf}
.hero-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  min-height:570px;
  gap:3rem}
.hero-copy {
  padding:4rem 0}
.eyebrow {
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:#43685a}
.eyebrow span {
  display:inline-block;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#d99c33;
  margin-right:6px}
h1,h2,h3 {
  font-family:Bookman,Georgia,serif;
  line-height:1.12;
  letter-spacing:-.035em}
h1 {
  font-size:clamp(3.1rem,5.5vw,5.5rem);
  margin:.6rem 0 1.4rem}
h1 em {
  font-style:normal;
  color:#4d735e}
h2 {
  font-size:clamp(2.15rem,3.7vw,3.5rem);
  margin:.6rem 0 1.3rem}
h3 {
  font-size:1.45rem;
  margin:.8rem 0}
p {
  margin:0 0 1rem}
.hero-lead {
  font-size:1.14rem;
  max-width:510px}
.hero-art {
  margin:0;
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  align-self:stretch;
  margin-right:calc((1180px - 100vw)/2);
  min-width:0}
.hero-art img {
  min-height:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block}
.hero-art figcaption,.practice-photo figcaption {
  color:#324d40;
  font-size:.78rem;
  line-height:1.45;
}
.hero-art figcaption {padding:.55rem .85rem;background:#eff1e8}
.practice-photo {margin:0;min-width:0}
.practice-photo img {display:block;height:auto}
.practice-photo figcaption {margin-top:.3rem;text-align:right}
.actions {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:1.4rem;
  margin:2rem 0 1.5rem}
.button {
  display:inline-block;
  background:var(--gold);
  color:var(--pine);
  padding:.9rem 1.25rem;
  border:2px solid var(--gold);
  border-radius:4px;
  text-decoration:none;
  font-weight:600}
.button:hover {
  background:#ffcc6a}
.button span {
  margin-left:.8rem}
.text-link {
  font-weight:600}
.hero-note,.small {
  font-size:.83rem;
  color:var(--muted)}
.intro,.resources {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5rem;
  padding:6rem 0}
.intro p:not(.eyebrow),.resources p:not(.eyebrow) {
  max-width:520px}
.start {
  background:var(--pine);
  color:white;
  padding:5.5rem 0}
.start .eyebrow,.community .eyebrow {
  color:#c6ddca}
.section-heading {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:2rem;
  margin-bottom:1.8rem}
.section-heading h2 {
  margin-bottom:0}
.steps {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:#6f9986;
  border:1px solid #6f9986}
.steps article {
  background:var(--pine);
  padding:2rem;
  min-height:270px;
  display:flex;
  flex-direction:column}
.step-number {
  color:var(--gold);
  font-size:.8rem;
  letter-spacing:.12em}
.steps p {
  color:#e1ebe1}
.steps a {
  margin-top:auto;
  font-weight:600}
.guides {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6rem;
  padding:6rem 0}
.guides-intro p:not(.eyebrow) {
  max-width:430px}
.button-outline {
  background:transparent;
  border-color:var(--pine);
  margin:1rem 0}
.button-outline:hover {
  background:#e5eadc}
.guide-list {
  border-top:1px solid var(--line)}
.guide-list>a {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding:1.4rem .2rem;
  border-bottom:1px solid var(--line);
  text-decoration:none}
.guide-list>a:hover strong {
  text-decoration:underline}
.guide-list small,.guide-list strong,.guide-list span span {
  display:block}
.guide-list small {
  font-size:.67rem;
  letter-spacing:.12em;
  color:#5e786a}
.guide-list strong {
  font:700 1.35rem Bookman,Georgia,serif;
  margin:.4rem 0}
.guide-list span span {
  font-size:.9rem;
  color:var(--muted)}
.guide-list b {
  font-size:1.4rem;
  font-weight:400}
.community {
  background:var(--pine);
  color:white;
  padding:5.5rem 0}
.community-grid {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:7rem;
  align-items:center}
.community-grid>div:first-child {
  max-width:570px}
.community-grid .button {
  margin-top:1rem}
.community-card {
  border:1px solid #6e9a86;
  padding:2rem 3rem;
  background:#20584a}
.quote-mark {
  font:700 5rem/.6 Bookman,Georgia,serif;
  color:var(--gold)}
.community-card p {
  font:700 clamp(1.8rem,3vw,2.6rem)/1.2 Bookman,Georgia,serif;
  margin:1.2rem 0}
.rule {
  display:block;
  width:45px;
  border-top:2px solid var(--gold);
  margin-bottom:1rem}
.community-card small {
  font-size:.65rem;
  letter-spacing:.13em}
.resources {
  padding-bottom:6rem}
.resource-link {
  display:inline-block;
  margin-top:.8rem}
.resources .small {
  margin-top:1.5rem}
footer {
  border-top:1px solid #ccd6c7;
  padding:2.5rem 0;
  background:#f2eddf}
.footer-inner {
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:2rem;
  align-items:start}
.footer-inner img {
  width:210px}
.footer-inner p {
  font-size:.84rem}
.footer-inner a {
  display:block;
  font-size:.85rem;
  margin-bottom:.4rem}
.footer-note {
  color:var(--muted)}
@media(max-width:800px) {
  .header-inner {
  min-height:76px}
.brand {
  width:190px}
.site-header nav {
  gap:1rem}
.site-header nav a:not(.nav-join) {
  display:none}
.hero-grid {
  grid-template-columns:1fr;
  gap:0}
.hero-copy {
  padding:4rem 0 2rem}
.hero-art {
  margin:0 -24px;
  height:340px}
.intro,.resources,.guides,.community-grid {
  grid-template-columns:1fr;
  gap:1.5rem}
.intro,.resources,.guides {
  padding:4rem 0}
.start,.community {
  padding:4rem 0}
.steps {
  grid-template-columns:1fr}
.steps article {
  min-height:0}
.steps a {
  margin-top:.8rem}
.community-grid {
  gap:2.5rem}
.footer-inner {
  grid-template-columns:1fr 1fr}
.footer-note {
  grid-column:1/-1}
}
@media(max-width:420px) {
  .wrap {
  width:calc(100% - 32px)}
.hero-art {
  margin:0 -16px;
  height:260px}
.brand {
  width:165px}
.nav-join {
  font-size:.78rem;
  padding:.5rem!important}
.section-heading {
  align-items:start;
  flex-direction:column}
.footer-inner {
  grid-template-columns:1fr}
.footer-note {
  grid-column:auto}
}
@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto}
}

/* Practice page */
.practice-hero {background:#e7eddf}
.practice-hero-grid {display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:4rem;padding-top:4rem;padding-bottom:4rem}
.practice-hero h1 em {font-style:normal;color:#4d735e}
.practice-hero .button {margin-top:1rem}
.practice-hero img {width:100%;max-height:380px;object-fit:cover;border-radius:4px}
.practice-content {max-width:900px;padding:5rem 0}
.practice-card {border:1px solid var(--line);background:#fffdf6;margin:1rem 0;border-radius:4px}
.practice-card summary {cursor:pointer;padding:1.4rem 1.5rem;display:flex;align-items:center;gap:1rem;list-style:none}
.practice-card summary::-webkit-details-marker {display:none}
.practice-card summary:after {content:'+';font-size:1.8rem;margin-left:auto}
.practice-card[open] summary:after {content:'−'}
.practice-card summary strong,.practice-card summary span span {display:block}
.practice-card summary strong {font:700 1.45rem Bookman,Georgia,serif;margin:.3rem 0}
.practice-card summary:focus-visible,.practice-share button:focus-visible {outline:3px solid #c37a19;outline-offset:4px}
.practice-body {padding:0 1.5rem 1.5rem;max-width:750px}
.practice-body li {padding-left:.3rem;margin:.6rem 0}
.practice-discussion {background:var(--pine);color:white;padding:5rem 0}
.practice-discussion-grid {display:grid;grid-template-columns:1fr 1fr;gap:5rem}
.practice-discussion blockquote {font:700 1.5rem/1.35 Bookman,Georgia,serif;margin:1.5rem 0}
.practice-examples {background:#20584a;border:1px solid #6e9a86;padding:2rem}
.practice-share {padding:5rem 0}
.practice-share button {font:600 1rem OpenSans,Arial,sans-serif;color:var(--pine);background:var(--gold);border:2px solid var(--gold);border-radius:4px;padding:.9rem 1.25rem;cursor:pointer}
.share-address {margin-top:1rem;overflow-wrap:anywhere}
@media(max-width:800px) {.practice-hero-grid,.practice-discussion-grid {grid-template-columns:1fr;gap:2rem}.practice-hero-grid {padding:3rem 0}.practice-hero img {max-height:300px}.practice-content,.practice-share {padding:3rem 0}.practice-discussion {padding:3rem 0}}

@media (max-width: 800px) {
  .practice-page .site-header nav a.practice-nav-learn {display: inline-block}
  .practice-hero-grid {padding-top: 2rem; padding-bottom: 2rem}
  .practice-hero img {max-height: 230px; object-position: 50% 40%}
}

@media (max-width: 800px) {
  .site-header .header-inner:has(.shop-entry) { gap: .6rem; }
  .site-header nav a.shop-entry { display: inline-flex; align-items: center; min-height: 44px; }
}
@media (max-width: 380px) {
  .header-inner:has(.shop-entry) .brand { width: 36%; }
  .header-inner:has(.shop-entry) nav { gap: .6rem; }
}