.theme-tradition {
  --paper: oklch(0.967 0.022 86);
  --surface: oklch(0.989 0.012 88);
  --surface-soft: oklch(0.927 0.045 83);
  --ink: oklch(0.205 0.018 75);
  --ink-soft: oklch(0.39 0.023 74);
  --ink-dim: oklch(0.53 0.022 76);
  --line: oklch(0.81 0.038 82);
  --line-strong: oklch(0.67 0.06 78);
  --accent: oklch(0.71 0.13 75);
  --accent-dark: oklch(0.5 0.11 67);
  --accent-soft: oklch(0.87 0.09 79);
  --support: oklch(0.41 0.066 177);
  --support-dark: oklch(0.255 0.052 181);
  --button-ink: oklch(0.18 0.018 75);
  --purchase-bg: oklch(0.255 0.052 181);
  background: var(--paper);
}

.theme-tradition .public-header {
  background: oklch(0.982 0.013 86);
}

.theme-tradition .public-button:focus-visible,
.theme-tradition .tradition-index a:focus-visible,
.theme-tradition .tradition-source:focus-visible {
  outline: 3px solid oklch(0.67 0.12 75 / 0.55);
  outline-offset: 4px;
}

.tradition-hero {
  position: relative;
  min-height: 690px;
  padding-block: clamp(64px, 8vw, 118px);
  overflow: hidden;
  background:
    radial-gradient(circle at 9% 18%, oklch(0.78 0.08 79 / 0.18) 0 1px, transparent 2px),
    var(--paper);
  background-size: 36px 36px, auto;
}

.tradition-hero::after {
  content: "";
  position: absolute;
  width: clamp(360px, 48vw, 760px);
  aspect-ratio: 1;
  inset: auto -16% -54% auto;
  border: 1px solid oklch(0.62 0.09 76 / 0.28);
  border-radius: 50%;
  pointer-events: none;
}

.tradition-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(410px, 0.82fr);
  gap: clamp(48px, 7vw, 112px);
  align-items: center;
}

.tradition-hero-grid > * { min-width: 0; }

.tradition-hero-copy { position: relative; z-index: 2; }

.tradition-hero h1 {
  max-width: 9ch;
  margin: 20px 0 28px;
  font-family: "Montserrat", sans-serif;
  font-size: clamp(3.45rem, 6.7vw, 6.8rem);
  font-weight: 330;
  letter-spacing: -0.065em;
  line-height: 0.94;
}

.tradition-hero-copy > p {
  max-width: 59ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: clamp(1.02rem, 1.4vw, 1.18rem);
}

.tradition-hero-art {
  position: relative;
  min-height: clamp(430px, 42vw, 590px);
}

.tradition-hero-art figure { margin: 0; }

.tradition-hero-art img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tradition-hero-art-main {
  position: absolute;
  width: min(77%, 440px);
  aspect-ratio: 1;
  inset: 3% 4% auto auto;
  overflow: hidden;
  border: 1px solid oklch(0.79 0.055 82);
  border-radius: 34px 10px 34px 10px;
  box-shadow: 0 30px 72px oklch(0.28 0.04 74 / 0.16);
}

.tradition-hero-art-small {
  position: absolute;
  width: min(33%, 176px);
  aspect-ratio: 1;
  overflow: hidden;
  border: 7px solid var(--paper);
  border-radius: 22px 7px 22px 7px;
  box-shadow: 0 18px 42px oklch(0.28 0.04 74 / 0.15);
}

.tradition-hero-art-small--sun { inset: 6% auto auto 0; }
.tradition-hero-art-small--breath { inset: auto 0 2% auto; }

.tradition-index {
  position: relative;
  z-index: 3;
  background: var(--support-dark);
  color: oklch(0.95 0.018 87);
}

.tradition-index-inner {
  min-height: 96px;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: stretch;
}

.tradition-index a {
  min-width: 0;
  padding: 22px clamp(12px, 1.7vw, 24px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  border-inline-end: 1px solid oklch(0.66 0.05 178 / 0.28);
  color: inherit;
  font-family: "Montserrat", sans-serif;
  font-size: 0.74rem;
  font-weight: 580;
  line-height: 1.25;
  text-decoration: none;
  transition: background-color 220ms var(--ease), color 220ms var(--ease);
}

.tradition-index a:first-child { border-inline-start: 1px solid oklch(0.66 0.05 178 / 0.28); }
.tradition-index a:hover { background: oklch(0.33 0.062 177); color: var(--accent-soft); }
.tradition-index span { color: var(--accent-soft); font-size: 0.6rem; letter-spacing: 0.12em; }

.tradition-section { padding-block: clamp(76px, 9vw, 136px); }

.tradition-section-head {
  max-width: 900px;
  margin-bottom: clamp(62px, 9vw, 116px);
  display: grid;
  grid-template-columns: minmax(150px, 0.33fr) minmax(0, 1fr);
  column-gap: clamp(28px, 5vw, 74px);
}

.tradition-eyebrow {
  margin: 8px 0 0;
  color: var(--accent-dark);
  font-family: "Montserrat", sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.tradition-section-head h2,
.breath-copy h2,
.tradition-library-cta h2 {
  margin: 0;
  font-family: "Montserrat", sans-serif;
  font-size: clamp(2.6rem, 5.2vw, 5rem);
  font-weight: 340;
  letter-spacing: -0.055em;
  line-height: 1;
}

.tradition-section-head > p:last-child {
  grid-column: 2;
  max-width: 61ch;
  margin: 22px 0 0;
  color: var(--ink-soft);
}

.tradition-entry {
  min-height: 560px;
  padding-block: clamp(56px, 7vw, 94px);
  display: grid;
  grid-template-columns: minmax(280px, 0.66fr) minmax(0, 1fr);
  gap: clamp(52px, 9vw, 142px);
  align-items: center;
  border-top: 1px solid var(--line);
}

.tradition-entry:last-child { border-bottom: 1px solid var(--line); }
.tradition-entry--reverse .tradition-entry-art { order: 2; }
.tradition-entry--reverse .tradition-entry-copy { order: 1; }

.tradition-entry-art,
.technique-feature-art,
.breath-art {
  margin: 0;
}

.tradition-entry-art img,
.technique-feature-art img,
.breath-art img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border: 1px solid oklch(0.8 0.045 82);
  border-radius: 26px 8px 26px 8px;
  box-shadow: 0 22px 58px oklch(0.3 0.04 74 / 0.11);
}

.tradition-entry-art figcaption,
.technique-feature-art figcaption,
.breath-art figcaption {
  margin-top: 16px;
  color: var(--ink-dim);
  font-family: "Montserrat", sans-serif;
  font-size: 0.63rem;
  font-weight: 650;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.tradition-entry-copy { max-width: 680px; }

.tradition-entry-role {
  margin: 0 0 14px;
  color: var(--accent-dark);
  font-family: "Montserrat", sans-serif;
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.tradition-entry h3,
.technique-feature h3 {
  margin: 0 0 26px;
  font-family: "Montserrat", sans-serif;
  font-size: clamp(2.15rem, 4vw, 4.2rem);
  font-weight: 390;
  letter-spacing: -0.052em;
  line-height: 1.02;
}

.tradition-entry-copy > p:not(.tradition-entry-role),
.technique-feature-copy > p:not(.tradition-entry-role) {
  max-width: 65ch;
  color: var(--ink-soft);
}

.tradition-translation {
  margin: 0 0 24px;
  color: var(--ink) !important;
  font-size: clamp(1.12rem, 1.7vw, 1.35rem);
  font-weight: 520;
  line-height: 1.48;
}

.tradition-mantra-line {
  margin: 0 0 24px;
  color: var(--ink) !important;
  font-family: "Montserrat", sans-serif;
  font-size: clamp(1.02rem, 1.55vw, 1.23rem);
  font-weight: 550;
  line-height: 1.7;
}

.tradition-steps {
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
  counter-reset: tradition-step;
}

.tradition-steps li {
  position: relative;
  min-height: 36px;
  padding: 0 0 18px 48px;
  color: var(--ink-soft);
  counter-increment: tradition-step;
}

.tradition-steps li::before {
  content: counter(tradition-step, decimal-leading-zero);
  position: absolute;
  inset: 1px auto auto 0;
  color: var(--accent-dark);
  font-family: "Montserrat", sans-serif;
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.09em;
}

.tradition-note {
  margin-top: 10px;
  padding: 17px 19px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: oklch(0.948 0.035 84);
  font-size: 0.88rem;
}

.tradition-source {
  width: fit-content;
  margin-top: 24px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--accent-dark);
  font-family: "Montserrat", sans-serif;
  font-size: 0.72rem;
  font-weight: 650;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}

.tradition-techniques {
  background: var(--support-dark);
  color: oklch(0.962 0.014 86);
}

.tradition-section-head--light .tradition-eyebrow,
.tradition-techniques .tradition-entry-role { color: var(--accent-soft); }

.tradition-section-head--light > p:last-child { color: oklch(0.8 0.025 177); }

.technique-feature {
  display: grid;
  grid-template-columns: minmax(300px, 0.7fr) minmax(0, 1fr);
  gap: clamp(58px, 9vw, 142px);
  align-items: start;
}

.technique-feature-art img { border-color: oklch(0.72 0.05 84 / 0.5); box-shadow: 0 26px 68px oklch(0.12 0.03 181 / 0.35); }
.technique-feature-art figcaption { color: oklch(0.72 0.035 178); }
.technique-feature-copy > p:not(.tradition-entry-role) { color: oklch(0.82 0.022 177); }

.bandha-list { margin-top: 40px; border-top: 1px solid oklch(0.64 0.045 178 / 0.4); }

.bandha-list section {
  padding-block: 24px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 14px;
  border-bottom: 1px solid oklch(0.64 0.045 178 / 0.4);
}

.bandha-list section > span {
  padding-top: 4px;
  color: var(--accent-soft);
  font-family: "Montserrat", sans-serif;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.bandha-list h4 { margin: 0 0 8px; font-family: "Montserrat", sans-serif; font-size: 1rem; font-weight: 600; }
.bandha-list p { margin: 0; color: oklch(0.8 0.025 177); font-size: 0.9rem; }
.tradition-source--light { color: var(--accent-soft); }

.tradition-safety {
  max-width: 910px;
  margin: clamp(58px, 8vw, 100px) 0 0 auto;
  padding: clamp(22px, 3vw, 34px);
  display: grid;
  grid-template-columns: minmax(160px, 0.28fr) minmax(0, 1fr);
  gap: 28px;
  border: 1px solid oklch(0.67 0.055 178 / 0.48);
  border-radius: 18px;
  background: oklch(0.29 0.055 179);
}

.tradition-safety strong { color: var(--accent-soft); font-family: "Montserrat", sans-serif; font-size: 0.83rem; }
.tradition-safety p { max-width: 68ch; margin: 0; color: oklch(0.83 0.025 177); font-size: 0.88rem; }

.breath-section { background: var(--surface); }

.breath-grid {
  display: grid;
  grid-template-columns: minmax(280px, 0.62fr) minmax(0, 1fr);
  gap: clamp(58px, 9vw, 142px);
  align-items: start;
}

.breath-art { position: sticky; inset-block-start: 122px; }
.breath-copy { max-width: 750px; }
.breath-copy h2 { margin-bottom: 28px; }
.breath-intro { max-width: 63ch; margin: 0; color: var(--ink-soft); font-size: clamp(1.05rem, 1.55vw, 1.24rem); }

.breath-how,
.breath-errors { margin-top: 46px; padding-top: 30px; border-top: 1px solid var(--line); }

.breath-how h3,
.breath-errors h3 {
  margin: 0 0 20px;
  font-family: "Montserrat", sans-serif;
  font-size: 1.2rem;
  font-weight: 600;
}

.breath-errors ul { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 30px; list-style: none; }

.breath-errors li {
  position: relative;
  padding-left: 21px;
  color: var(--ink-soft);
  font-size: 0.9rem;
}

.breath-errors li::before {
  content: "";
  position: absolute;
  width: 7px;
  height: 7px;
  inset: 0.58em auto auto 0;
  border-radius: 50%;
  background: var(--accent);
}

.breath-warning {
  margin-top: 42px;
  padding: clamp(22px, 3vw, 32px);
  display: grid;
  grid-template-columns: minmax(150px, 0.28fr) minmax(0, 1fr);
  gap: 24px;
  border: 1px solid oklch(0.73 0.08 66);
  border-radius: 16px;
  background: oklch(0.94 0.046 73);
}

.breath-warning strong { color: var(--accent-dark); font-family: "Montserrat", sans-serif; font-size: 0.82rem; }
.breath-warning p { margin: 0; color: var(--ink-soft); font-size: 0.88rem; }

.tradition-library-cta {
  padding-block: clamp(78px, 10vw, 150px);
  background: oklch(0.9 0.073 80);
}

.tradition-library-cta-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 0.68fr);
  gap: clamp(52px, 10vw, 150px);
  align-items: end;
}

.tradition-library-cta h2 { margin-top: 14px; }
.tradition-library-cta-grid > div:last-child > p { max-width: 57ch; margin: 0 0 28px; color: var(--ink-soft); }

@media (max-width: 1000px) {
  .tradition-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(330px, 0.76fr); gap: 42px; }
  .tradition-index-inner { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tradition-index a:nth-child(3) { border-inline-end: 0; }
  .tradition-index a:nth-child(n + 4) { border-top: 1px solid oklch(0.66 0.05 178 / 0.28); }
  .tradition-index a:nth-child(4) { border-inline-start: 1px solid oklch(0.66 0.05 178 / 0.28); }
  .tradition-entry,
  .technique-feature,
  .breath-grid { gap: clamp(38px, 6vw, 70px); }
  .tradition-library-cta-grid { gap: 60px; }
}

@media (max-width: 760px) {
  .tradition-hero { min-height: auto; padding-block: 48px 62px; background-size: 30px 30px, auto; }
  .tradition-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .tradition-hero h1 { max-width: 100%; font-size: clamp(2.65rem, 13vw, 5rem); overflow-wrap: anywhere; }
  .tradition-hero-art { min-height: 390px; margin-top: 6px; }
  .tradition-hero-art-main { width: min(76%, 360px); }
  .tradition-hero-art-small { width: min(31%, 145px); border-width: 5px; }
  .tradition-index { overflow-x: auto; }
  .tradition-index-inner { width: max-content; min-width: 100%; grid-template-columns: repeat(6, minmax(132px, 1fr)); }
  .tradition-index a { min-height: 76px; border-top: 0 !important; border-inline-start: 0 !important; border-inline-end: 1px solid oklch(0.66 0.05 178 / 0.28) !important; }
  .tradition-section-head { grid-template-columns: 1fr; gap: 14px; }
  .tradition-section-head > p:last-child { grid-column: 1; margin-top: 6px; }
  .tradition-section-head h2 { font-size: clamp(2.45rem, 12vw, 4rem); }
  .tradition-entry,
  .technique-feature,
  .breath-grid { grid-template-columns: 1fr; min-height: 0; }
  .tradition-entry { padding-block: 52px; gap: 36px; }
  .tradition-entry--reverse .tradition-entry-art,
  .tradition-entry--reverse .tradition-entry-copy { order: initial; }
  .tradition-entry-art,
  .technique-feature-art,
  .breath-art { width: min(82vw, 410px); }
  .tradition-entry h3,
  .technique-feature h3 { font-size: clamp(2.05rem, 10vw, 3.35rem); }
  .technique-feature { gap: 44px; }
  .tradition-safety,
  .breath-warning { grid-template-columns: 1fr; gap: 12px; }
  .breath-art { position: static; }
  .breath-errors ul { grid-template-columns: 1fr; }
  .tradition-library-cta-grid { grid-template-columns: 1fr; gap: 34px; }
  .tradition-library-cta h2 { font-size: clamp(2.5rem, 12vw, 4rem); }
}

@media (max-width: 460px) {
  .tradition-hero-art { min-height: 320px; }
  .tradition-hero-art-main { width: 78%; border-radius: 24px 8px 24px 8px; }
  .tradition-hero-art-small { border-radius: 16px 5px 16px 5px; }
  .tradition-entry-art,
  .technique-feature-art,
  .breath-art { width: 100%; }
  .tradition-entry-art img,
  .technique-feature-art img,
  .breath-art img { border-radius: 20px 7px 20px 7px; }
  .tradition-note,
  .tradition-safety,
  .breath-warning { border-radius: 12px; }
}

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