:root {
  --cream: #fbf5e9;
  --paper: #fffaf0;
  --sage: #718263;
  --sage-deep: #334c35;
  --sage-soft: #dfe6d7;
  --blush: #ead3c8;
  --terracotta: #bd6e50;
  --brown: #6a5746;
  --charcoal: #2f342f;
  --line: rgba(78, 92, 67, 0.22);
  --shadow: 0 18px 55px rgba(61, 67, 52, 0.10);
  --radius: 28px;
  --max: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--charcoal);
  background:
    radial-gradient(circle at 8% 5%, rgba(234,211,200,.36), transparent 28rem),
    radial-gradient(circle at 92% 16%, rgba(223,230,215,.55), transparent 32rem),
    var(--cream);
  font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
.container { width: min(calc(100% - 40px), var(--max)); margin: 0 auto; }
.skip-link { position: absolute; left: -999px; }
.skip-link:focus { left: 20px; top: 15px; z-index: 99; background: white; padding: 10px 14px; }
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(251,245,233,.94);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line);
}
.navbar { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; text-decoration: none; flex-shrink: 0; }
.brand img { width: 226px; height: 76px; object-fit: cover; object-position: left top; }
.nav-toggle { display: none; border: 1px solid var(--line); background: var(--paper); padding: 10px 14px; border-radius: 99px; font: inherit; }
.site-nav { display: flex; align-items: center; gap: 20px; }
.site-nav a { text-decoration: none; font-size: .91rem; color: #3b493a; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--terracotta); }
.site-nav .nav-cta { padding: 10px 16px; border-radius: 99px; background: var(--sage-deep); color: white; }
main { overflow: hidden; }
.hero { padding: 92px 0 74px; }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 70px; }
.eyebrow { color: var(--terracotta); text-transform: uppercase; letter-spacing: .18em; font-size: .75rem; font-weight: 700; margin: 0 0 18px; }
h1, h2, h3, .serif { font-family: Georgia, "Times New Roman", serif; font-weight: 500; color: var(--sage-deep); line-height: 1.08; }
h1 { font-size: clamp(3.1rem, 6vw, 6rem); letter-spacing: -.045em; margin: 0 0 26px; }
h2 { font-size: clamp(2.2rem, 4vw, 4.1rem); letter-spacing: -.032em; margin: 0 0 20px; }
h3 { font-size: 1.5rem; margin: 0 0 12px; }
.lead { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.15rem, 2vw, 1.45rem); color: #4d554d; max-width: 42rem; }
.hero-copy p:not(.eyebrow):not(.lead) { max-width: 42rem; }
.actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.button { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; padding: 13px 20px; border-radius: 99px; border: 1px solid var(--sage-deep); font-weight: 650; }
.button.primary { background: var(--sage-deep); color: white; }
.button.secondary { background: rgba(255,255,255,.35); color: var(--sage-deep); }
.hero-art { position: relative; }
.hero-art::before { content:""; position:absolute; inset:-26px; border:1px solid rgba(189,110,80,.28); border-radius: 48% 52% 45% 55%; transform: rotate(-2deg); }
.hero-art img { position: relative; border-radius: 44% 44% 30px 30px; box-shadow: var(--shadow); }
.hero-note { position:absolute; right:-22px; bottom:30px; width: 230px; background: rgba(255,250,240,.95); border:1px solid var(--line); border-radius: 20px; padding:18px; box-shadow: var(--shadow); font-family: Georgia, serif; color: var(--sage-deep); }
.section { padding: 88px 0; }
.section.compact { padding: 64px 0; }
.section-tint { background: rgba(255,250,240,.62); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section-head { max-width: 760px; margin-bottom: 42px; }
.kicker { font-family: Georgia, serif; color: var(--terracotta); font-style: italic; font-size: 1.08rem; }
.question-band { padding: 34px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: center; background: rgba(223,230,215,.34); }
.question-band strong { font-family: Georgia, serif; font-size: clamp(1.8rem, 4vw, 3.2rem); color: var(--sage-deep); font-weight: 500; }
.grid-2, .grid-3, .grid-6 { display: grid; gap: 22px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.grid-6 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.card { background: rgba(255,250,240,.76); border:1px solid var(--line); border-radius: var(--radius); padding: 28px; box-shadow: 0 10px 34px rgba(61,67,52,.05); }
.card p:last-child { margin-bottom: 0; }
.card .num { width: 36px; height:36px; display:grid; place-items:center; border-radius:50%; background:var(--sage-soft); color:var(--sage-deep); font-family:Georgia,serif; margin-bottom:20px; }
.card-link { text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.card-link:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.visual-card { padding: 0; overflow: hidden; }
.visual-card img { aspect-ratio: 1 / 1; object-fit: cover; width:100%; }
.visual-card .content { padding: 24px 26px 28px; }
.split { display:grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items:center; }
.split.reverse { grid-template-columns: 1.1fr .9fr; }
.split img { border-radius: 28px; box-shadow: var(--shadow); }
.prose { max-width: 780px; }
.prose p, .prose li { font-size: 1.04rem; }
.prose h2 { margin-top: 58px; }
.prose h3 { margin-top: 34px; }
.principle { display:grid; grid-template-columns: 62px 1fr; gap:18px; align-items:start; padding: 24px 0; border-top:1px solid var(--line); }
.principle:first-child { border-top:0; }
.principle-number { font-family:Georgia,serif; color:var(--terracotta); font-size:2rem; }
.tag { display:inline-block; padding: 6px 10px; background:var(--sage-soft); border-radius:99px; font-size:.76rem; text-transform:uppercase; letter-spacing:.12em; color:var(--sage-deep); font-weight:700; }
.callout { background: var(--sage-deep); color: #fff9ee; border-radius: 36px; padding: clamp(34px, 6vw, 72px); position: relative; overflow:hidden; }
.callout h2, .callout h3 { color: white; }
.callout::after { content:""; position:absolute; width:320px; height:320px; border:1px solid rgba(255,255,255,.16); border-radius:50%; right:-120px; top:-140px; box-shadow: 0 0 0 34px rgba(255,255,255,.03),0 0 0 68px rgba(255,255,255,.03); }
.catalogue { display:grid; grid-template-columns: 1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:24px; overflow:hidden; }
.catalogue article { background:var(--paper); padding:26px; }
.catalogue small { color:var(--terracotta); text-transform:uppercase; letter-spacing:.12em; font-weight:700; }
.founder-card { display:grid; grid-template-columns: 1fr 1.2fr; gap:44px; align-items:center; }
.founder-portrait { min-height: 520px; border-radius:34px; background: linear-gradient(145deg,var(--blush),var(--sage-soft)); display:flex; align-items:flex-end; padding:36px; position:relative; overflow:hidden; }
.founder-portrait::before { content:"IG"; position:absolute; font-family:Georgia,serif; font-size:13rem; color:rgba(255,255,255,.42); left:22px; top:35px; line-height:1; }
.founder-portrait p { position:relative; z-index:1; font-family:Georgia,serif; font-size:1.35rem; color:var(--sage-deep); max-width: 16rem; }
.form { display:grid; gap:16px; max-width:650px; }
.form label { font-weight:650; color:var(--sage-deep); }
.form input, .form textarea, .form select { width:100%; border:1px solid var(--line); background:var(--paper); padding:14px 16px; border-radius:14px; font:inherit; color:var(--charcoal); }
.form textarea { min-height:150px; resize:vertical; }
.form button { justify-self:start; cursor:pointer; }
.form-status { min-height:1.5em; color:var(--terracotta); }
.netlify-honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.site-footer { border-top:1px solid var(--line); padding:58px 0 30px; background:rgba(255,250,240,.7); }
.footer-grid { display:grid; grid-template-columns: 1.5fr repeat(3, minmax(0,1fr)); gap:40px; }
.footer-brand img { width:240px; height:80px; object-fit:cover; object-position:left top; }
.footer-links { display:grid; gap:9px; }
.footer-links a { text-decoration:none; }
.footer-note { border-top:1px solid var(--line); margin-top:36px; padding-top:22px; font-size:.86rem; color:#667066; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.page-hero { padding: 88px 0 58px; }
.page-hero .lead { max-width: 760px; }
.breadcrumb { color:#6b756a; font-size:.86rem; margin-bottom:20px; }
.breadcrumb a { text-decoration:none; }
.quote { font-family:Georgia,serif; color:var(--sage-deep); font-size:clamp(1.6rem,3vw,2.5rem); line-height:1.3; border-left:3px solid var(--terracotta); padding-left:26px; }
.source-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 26px; }
.source-list div { padding:18px 0; border-bottom:1px solid var(--line); }
@media (max-width: 980px) {
  .nav-toggle { display: inline-flex; }
  .site-nav { display:none; position:absolute; left:20px; right:20px; top:76px; background:var(--paper); border:1px solid var(--line); border-radius:20px; padding:18px; flex-direction:column; align-items:stretch; box-shadow:var(--shadow); }
  .site-nav.open { display:flex; }
  .hero-grid, .split, .split.reverse, .founder-card { grid-template-columns:1fr; }
  .hero { padding-top:68px; }
  .hero-art { max-width:720px; }
  .hero-note { right:12px; }
  .grid-3, .grid-6 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 680px) {
  .container { width:min(calc(100% - 26px), var(--max)); }
  .brand img { width:190px; height:64px; }
  .hero { padding:54px 0 48px; }
  h1 { font-size:clamp(2.65rem, 15vw, 4.3rem); }
  .hero-grid { gap:44px; }
  .hero-note { position:relative; right:auto; bottom:auto; margin:-24px 16px 0 auto; }
  .section { padding:64px 0; }
  .grid-2, .grid-3, .grid-6, .catalogue, .source-list { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .card { padding:23px; }
  .navbar { min-height:72px; }
}

/* July 18 review revisions */
/* Make dark-panel headings more restrained across every page using this format. */
.callout h2 {
  font-size: clamp(1.65rem, 3vw, 3.075rem);
}
.callout .lead {
  color: #f7f0e4;
}

/* Reduce the oversized page titles called out in review by approximately 25%. */
.page-hero-reduced h1 {
  font-size: clamp(2.325rem, 4.5vw, 4.5rem);
}

/* Reading a TinyWorld: smaller section title and number/title alignment. */
.reading-tinyworld > h2 {
  font-size: clamp(1.65rem, 3vw, 3.075rem);
}
.reading-tinyworld .principle {
  align-items: start;
}
.reading-tinyworld .principle-number {
  line-height: 1.08;
  padding-top: 0;
}
.reading-tinyworld .principle h3 {
  margin-top: 0;
}

/* Fields of Study: tighten label-to-title spacing and reduce field titles by 25%. */
.fields-list article {
  padding-top: 8px;
}
.fields-list article + article {
  margin-top: 34px;
}
.fields-list article > .tag + h2 {
  margin-top: 12px;
}
.fields-list article > h2 {
  font-size: clamp(1.65rem, 3vw, 3.075rem);
}

@media (max-width: 680px) {
  .callout h2,
  .reading-tinyworld > h2,
  .fields-list article > h2 {
    font-size: clamp(1.75rem, 9vw, 2.65rem);
  }
  .page-hero-reduced h1 {
    font-size: clamp(2.15rem, 11vw, 3.25rem);
  }
}


/* Founder photography and Behind the Work section */
.founder-photo {
  margin: 0;
  border-radius: 34px;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}
.founder-photo img {
  width: 100%;
  height: 560px;
  object-fit: cover;
  object-position: 50% 24%;
}
.founder-photo figcaption {
  padding: 22px 26px 25px;
  font-family: Georgia, serif;
  font-size: 1.16rem;
  line-height: 1.45;
  color: var(--sage-deep);
}
.behind-work {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 58px;
  align-items: center;
}
.behind-work-photo {
  border-radius: 30px;
  overflow: hidden;
  box-shadow: var(--shadow);
  border: 1px solid var(--line);
  background: var(--paper);
}
.behind-work-photo img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: 52% 50%;
}
.behind-work .prose h2 {
  margin-top: 0;
}
@media (max-width: 980px) {
  .behind-work { grid-template-columns: 1fr; }
  .founder-photo img { height: min(680px, 110vw); }
}
@media (max-width: 680px) {
  .founder-photo img { height: 118vw; max-height: 620px; object-position: 50% 20%; }
  .behind-work { gap: 34px; }
  .behind-work-photo img { aspect-ratio: 16 / 11; }
}

/* Edition 1.1 — homepage orientation path */
.journey-nav{background:#f7f2e8;border-top:1px solid rgba(66,83,64,.12);border-bottom:1px solid rgba(66,83,64,.12)}
.journey-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.journey-grid a{padding:1.15rem 1rem;text-decoration:none;color:var(--ink);border-right:1px solid rgba(66,83,64,.12);display:flex;gap:.7rem;align-items:baseline;transition:background .2s ease}
.journey-grid a:first-child{border-left:1px solid rgba(66,83,64,.12)}
.journey-grid a:hover{background:rgba(255,255,255,.55)}
.journey-grid span{font-size:.72rem;letter-spacing:.12em;color:var(--terracotta);font-weight:700}
.journey-grid strong{font-family:var(--serif);font-size:1rem;font-weight:600;color:var(--green-deep)}
@media (max-width:850px){.journey-grid{grid-template-columns:1fr 1fr}.journey-grid a:nth-child(3){border-left:1px solid rgba(66,83,64,.12);border-top:1px solid rgba(66,83,64,.12)}.journey-grid a:nth-child(4){border-top:1px solid rgba(66,83,64,.12)}}
@media (max-width:540px){.journey-grid{grid-template-columns:1fr}.journey-grid a{border-left:1px solid rgba(66,83,64,.12);border-top:1px solid rgba(66,83,64,.12)}.journey-grid a:first-child{border-top:0}}


/* Public-channel links and deep-link accessibility */
main [id] { scroll-margin-top: 104px; }
.channel-links { position: relative; z-index: 1; margin: 24px 0 0; color: #f7f0e4; }
.channel-links a { font-weight: 700; text-underline-offset: 3px; }
.section-actions { justify-content: center; margin-top: 34px; }



/* Offers page */
.offers-overview { border-bottom: 1px solid var(--line); }
.offer-overview-card { min-height: 220px; }
.offer-overview-card h3 { margin-top: 20px; }
.offer-card { display: flex; flex-direction: column; align-items: flex-start; min-height: 330px; }
.offer-card .button { margin-top: auto; }
.offer-meta { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 22px; width: 100%; color: var(--brown); font-size: .92rem; }
.offer-note { color: var(--brown); font-style: italic; }
.course-copy .offer-meta { max-width: 34rem; }
.course-copy .button { margin-top: 16px; }
.consultation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.consultation-card { display: flex; flex-direction: column; align-items: flex-start; }
.consultation-card h3 { margin-top: 20px; font-size: clamp(1.8rem, 3vw, 2.65rem); }
.consultation-card .button { margin-top: auto; }
.consultation-format { align-items: start; }
.consultation-format .prose h2 { margin-top: 0; }
.request-card ul { padding-left: 1.3rem; }
.request-card li + li { margin-top: 8px; }
.consultation-callout .lead { max-width: 850px; margin: 0; }
.consultation-callout .lead + .lead { margin-top: 18px; }
.contact-guidance { margin-top: 28px; padding: 22px; }
.contact-guidance h3 { font-size: 1.3rem; }

@media (max-width: 980px) {
  .consultation-grid { grid-template-columns: 1fr; }
  .offer-card { min-height: 0; }
}

@media (max-width: 680px) {
  .offer-meta { align-items: flex-start; flex-direction: column; gap: 10px; }
  .consultation-card h3 { font-size: 2rem; }
}


/* Serenity 101 course artwork */
.serenity-course { align-items: start; }
.course-visual { position: sticky; top: 118px; }
.course-visual a { display: block; border-radius: 28px; overflow: hidden; }
.course-visual img { width: 100%; }
.course-copy .actions { margin-top: 26px; }
.offer-card > .button { margin-top: auto; }
@media (max-width: 980px) {
  .course-visual { position: static; max-width: 720px; }
}