:root {
  --crimson: #971b36;
  --red: #bd2344;
  --dark: #292929;
  --grey: #676767;
  --light: #f3f3f3;
  --line: #d8d8d8;
  --white: #fff;
  --content: 1120px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--white); color: var(--dark); font: 16px/1.6 Arial, sans-serif; }
a { color: inherit; }
img { display: block; max-width: 100%; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 16px; top: 16px; z-index: 100; padding: 10px 14px; background: var(--white); }
.eyebrow { color: var(--crimson); font-size: .72rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }

.nav { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 14px max(24px, calc((100vw - var(--content)) / 2)); border-bottom: 1px solid var(--line); background: var(--white); }
.brand { color: var(--crimson); font: 1.15rem/1.25 Georgia, serif; text-decoration: none; }
.brand small { display: block; color: var(--grey); font: .62rem/1.4 Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.links { display: flex; align-items: center; gap: 24px; }
.links a { color: var(--dark); font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.links a:hover, .links a:focus-visible { color: var(--crimson); }
.links .pill { padding: 8px 13px; border: 1px solid var(--crimson); color: var(--crimson); }
.menu { display: none; width: 42px; height: 42px; border: 1px solid var(--line); background: var(--white); color: var(--crimson); font: 1.2rem Arial, sans-serif; }

.cta { display: inline-block; margin-top: 14px; color: var(--crimson); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.footer { display: flex; justify-content: space-between; gap: 35px; padding: 38px max(24px, calc((100vw - var(--content)) / 2)); border-top: 4px solid var(--crimson); background: var(--light); }
.footer strong { color: var(--crimson); font: 1.05rem Georgia, serif; }
.footlinks { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.footlinks a { color: var(--grey); font-size: .75rem; }

/* Concept 1 — centered and traditional */
.concept-one .intro { padding: 72px 24px 62px; border-bottom: 1px solid var(--line); text-align: center; }
.concept-one .intro-inner { max-width: 720px; margin: auto; }
.concept-one .intro h1 { margin: 12px 0 22px; color: var(--crimson); font: clamp(2.6rem, 6vw, 5.4rem)/1.02 Georgia, serif; }
.concept-one .intro p { max-width: 630px; margin: 0 auto; color: var(--grey); font: 1.1rem/1.75 Georgia, serif; }
.concept-one .wisdom { max-width: var(--content); margin: auto; padding: 64px 24px; display: grid; grid-template-columns: 150px 1fr; align-items: center; gap: 50px; }
.concept-one .portrait { width: 130px; border-radius: 50%; }
.concept-one blockquote { margin: 0; color: var(--dark); font: clamp(1.5rem, 3vw, 2.4rem)/1.35 Georgia, serif; }
.concept-one cite { display: block; margin-top: 16px; color: var(--crimson); font: normal .72rem Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.concept-one .sections { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); background: var(--light); }
.concept-one .sections article { padding: 42px max(24px, calc((100vw - var(--content)) / 6)); border-right: 1px solid var(--line); }
.concept-one .sections article:last-child { border-right: 0; }
.concept-one .sections h2 { margin: 10px 0; color: var(--crimson); font: 1.65rem Georgia, serif; }
.concept-one .sections p { color: var(--grey); }

/* Concept 2 — simple split layout */
.concept-two .hero { max-width: var(--content); margin: auto; min-height: 590px; padding: 64px 24px; display: grid; grid-template-columns: 1.2fr .8fr; align-items: center; gap: 70px; }
.concept-two .hero h1 { max-width: 650px; margin: 12px 0 24px; color: var(--crimson); font: clamp(3rem, 7vw, 6.4rem)/.98 Georgia, serif; }
.concept-two .hero p { max-width: 610px; color: var(--grey); font-size: 1.05rem; }
.concept-two .emblem { padding: 15%; border: 1px solid var(--line); background: var(--light); }
.concept-two .emblem img { border-radius: 50%; }
.concept-two .information { padding: 65px 24px; border-top: 1px solid var(--line); background: var(--light); }
.concept-two .information-inner { max-width: var(--content); margin: auto; display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; }
.concept-two .information h2 { margin: 8px 0; color: var(--crimson); font: clamp(2rem, 4vw, 3.5rem) Georgia, serif; }
.concept-two .information p { color: var(--grey); }
.concept-two .path-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.concept-two .path { padding: 48px max(24px, calc((100vw - var(--content)) / 6)); border-top: 4px solid var(--crimson); border-right: 1px solid var(--line); }
.concept-two .path:last-child { border-right: 0; }
.concept-two .path span { color: var(--grey); font-size: .7rem; }
.concept-two .path h2 { color: var(--crimson); font: 1.6rem Georgia, serif; }
.concept-two .path p { color: var(--grey); }

/* Concept 3 — compact editorial layout */
.concept-three .hero { max-width: var(--content); margin: auto; padding: 76px 24px; display: grid; grid-template-columns: 220px 1fr; gap: 70px; }
.concept-three .guru { padding: 24px; align-self: start; border-top: 5px solid var(--crimson); background: var(--light); }
.concept-three .guru img { width: 110px; margin-bottom: 20px; border-radius: 50%; }
.concept-three .hero h1 { margin: 10px 0 24px; color: var(--crimson); font: clamp(2.8rem, 7vw, 6.8rem)/.98 Georgia, serif; }
.concept-three .hero-copy p { max-width: 650px; color: var(--grey); font: 1.1rem/1.7 Georgia, serif; }
.concept-three .courses { padding: 64px 24px; background: var(--crimson); color: var(--white); }
.concept-three .courses-inner { max-width: var(--content); margin: auto; }
.concept-three .courses-head { display: flex; justify-content: space-between; align-items: end; gap: 30px; padding-bottom: 34px; border-bottom: 1px solid rgba(255,255,255,.35); }
.concept-three .courses .eyebrow { color: var(--white); }
.concept-three .courses h2 { margin: 8px 0 0; font: clamp(2rem, 5vw, 4rem) Georgia, serif; }
.concept-three .courses-head p { max-width: 390px; margin: 0; }
.concept-three .items { display: grid; grid-template-columns: repeat(3, 1fr); }
.concept-three .item { padding: 34px 34px 10px 0; }
.concept-three .item + .item { padding-left: 34px; border-left: 1px solid rgba(255,255,255,.35); }
.concept-three .item h3 { font: 1.55rem Georgia, serif; }
.concept-three .item a { font-size: .75rem; }

/* Concept 4 — warm mandala-inspired layout */
.mandala { background: #fff8ee; color: #47130f; }
.mandala .nav { border-color: rgba(105, 31, 18, .18); background: #fff8ee; }
.mandala .brand, .mandala .eyebrow, .mandala .links a:hover, .mandala .links a:focus-visible { color: #a51f19; }
.mandala .links .pill { border-color: #a51f19; color: #a51f19; }
.mandala-hero { min-height: 650px; padding: 76px max(24px, calc((100vw - var(--content)) / 2)); display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(48px, 8vw, 110px); background: linear-gradient(90deg, rgba(255,248,238,.98), rgba(255,248,238,.86)), url("mystic-sanctum.png") center/cover; }
.mandala-visual { padding: 13%; border: 1px solid rgba(165, 31, 25, .2); border-radius: 50%; background: rgba(255,255,255,.55); box-shadow: 0 28px 70px rgba(122, 34, 18, .13); }
.mandala-visual img { border-radius: 50%; }
.mandala-copy h1 { max-width: 650px; margin: 12px 0 24px; color: #7e1713; font: clamp(3.2rem, 7vw, 6.8rem)/.92 Georgia, serif; letter-spacing: -.04em; }
.mandala-copy h1 em { color: #c33c20; font-weight: normal; }
.mandala-copy p { max-width: 590px; color: #70463d; font: 1.08rem/1.75 Georgia, serif; }
.mandala .cta { color: #a51f19; }
.mandala .cta i { display: inline-grid; width: 34px; height: 34px; margin-right: 9px; place-items: center; border-radius: 50%; background: #a51f19; color: white; font-style: normal; }
.red-river { overflow: hidden; padding: 14px 0; background: #a51f19; color: #fff4da; font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; }
.red-river div { width: max-content; }
.teaching { max-width: var(--content); margin: auto; padding: 78px 24px; display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; }
.teaching h2 { margin: 10px 0; color: #7e1713; font: clamp(2.2rem, 5vw, 4.2rem)/1 Georgia, serif; }
.teaching blockquote { margin: 0; color: #70463d; font: clamp(1.3rem, 2.6vw, 2rem)/1.5 Georgia, serif; }
.teaching cite { display: block; margin-top: 18px; color: #a51f19; font: normal .72rem Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.mandala .footer { border-color: #a51f19; background: #f8eadb; }


@media (max-width: 760px) {
  .nav { min-height: 68px; padding: 12px 18px; }
  .links { display: none; position: absolute; z-index: 20; top: 68px; left: 0; right: 0; padding: 20px; border-bottom: 1px solid var(--line); background: var(--white); flex-direction: column; align-items: flex-start; }
  .links.open { display: flex; }
  .menu { display: block; }
  .footer { flex-direction: column; padding: 32px 20px; }

  .concept-one .intro { padding: 52px 20px 44px; text-align: left; }
  .concept-one .intro h1 { font-size: clamp(2.45rem, 13vw, 4rem); }
  .concept-one .intro p { font-size: 1rem; }
  .concept-one .wisdom { padding: 44px 20px; grid-template-columns: 72px 1fr; gap: 20px; }
  .concept-one .portrait { width: 72px; }
  .concept-one blockquote { font-size: 1.25rem; }
  .concept-one .sections { grid-template-columns: 1fr; }
  .concept-one .sections article { padding: 30px 20px; border-right: 0; border-bottom: 1px solid var(--line); }

  .concept-two .hero { min-height: 0; padding: 48px 20px; grid-template-columns: 1fr; gap: 40px; }
  .concept-two .emblem { max-width: 330px; order: -1; }
  .concept-two .information-inner, .concept-two .path-grid { grid-template-columns: 1fr; gap: 20px; }
  .concept-two .information { padding: 45px 20px; }
  .concept-two .path { padding: 30px 20px; border-right: 0; border-bottom: 1px solid var(--line); }

  .concept-three .hero { padding: 48px 20px; grid-template-columns: 1fr; gap: 34px; }
  .concept-three .guru { display: flex; align-items: center; gap: 18px; }
  .concept-three .guru img { width: 72px; margin: 0; }
  .concept-three .courses { padding: 45px 20px; }
  .concept-three .courses-head { align-items: flex-start; flex-direction: column; }
  .concept-three .items { grid-template-columns: 1fr; }
  .concept-three .item, .concept-three .item + .item { padding: 28px 0; border-left: 0; border-bottom: 1px solid rgba(255,255,255,.35); }

  .mandala .links { background: #fff8ee; }
  .mandala-hero { min-height: 0; padding: 48px 20px 56px; grid-template-columns: 1fr; gap: 38px; }
  .mandala-visual { width: min(76vw, 300px); margin: auto; padding: 11%; }
  .mandala-copy h1 { font-size: clamp(3rem, 15vw, 4.8rem); }
  .teaching { padding: 48px 20px; grid-template-columns: 1fr; gap: 28px; }

}