@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=Montserrat:wght@400;500;600&display=swap');

:root {
  --ink: #211915;
  --paper: #f2ebe1;
  --gold: #b39264;
  --display: "Cormorant Garamond", Garamond, Georgia, serif;
  --sans: Montserrat, Arial, Helvetica, sans-serif;
  --line: rgba(179, 146, 100, .5);
}

body { background: var(--paper); font-family: var(--sans); }
.hero h1, .section h2, .dark-section h2, .founder h2, .cta h2,
.schedule-intro h2, .schedule-grid h3, .monogram { font-family: var(--display); }
.hero h1, .section h2, .dark-section h2, .founder h2, .cta h2,
.schedule-intro h2 { font-weight: 400; }

.nav { background: rgba(33, 25, 21, .95); border-bottom-color: rgba(179,146,100,.35); }
.nav nav a { position: relative; }
.nav nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -.45rem; height: 1px; background: var(--gold); transition: right .25s ease; }
.nav nav a:hover::after { right: 0; }

.eyebrow { color: var(--gold); }
.eyebrow::before { content: ""; display: inline-block; width: 2.7rem; height: 1px; margin-right: .8rem; vertical-align: middle; background: currentColor; }
.hero .eyebrow { color: #f2ebe1; }
.hero { background: var(--ink); }
.hero-media {
  position: absolute;
  top: 0;
  right: 0;
  width: 62%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 56%;
}
.hero-shade {
  background: linear-gradient(90deg, #211915 0%, rgba(33, 25, 21, .97) 27%, rgba(33, 25, 21, .62) 50%, rgba(33, 25, 21, .18) 76%, rgba(33, 25, 21, .06) 100%);
}

.pill-dark { background: var(--gold); color: var(--ink); }
.nav-actions > .pill-dark { gap: .55rem; }
.nav-actions > .pill-dark::before {
  content: "";
  display: block;
  width: 1.1rem;
  height: 1.1rem;
  flex: 0 0 1.1rem;
  background: currentColor;
  -webkit-mask: url("/assets/whatsapp-mark.svg") center / contain no-repeat;
  mask: url("/assets/whatsapp-mark.svg") center / contain no-repeat;
}
.pill-light { background: var(--gold); color: var(--ink); }
.text-link { border-bottom-color: var(--gold); }
.line-icon { width: 1.15rem; height: 1.15rem; margin-left: .8rem; display: inline-block; flex: 0 0 auto; vertical-align: -.22em; fill: none; stroke: var(--gold); stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
.text-link, .scroll, .back-link, .read-more, footer div a { display: inline-flex; align-items: center; }
.back-link .line-icon { margin-left: 0; margin-right: .65rem; }
.mobile-menu-cta .line-icon { margin-left: 1rem; }

.dark-section, .schedule, .cta, footer, .founder-art { background: var(--ink); }
.dark-section, .schedule, .cta, footer { color: var(--paper); }
.benefits, .schedule-grid { border-color: rgba(179,146,100,.45); }
.benefits article, .schedule-grid article { border-color: rgba(179,146,100,.34); }
.benefits span, .schedule-grid span { color: var(--gold); opacity: 1; }

.centre-list a { border-color: var(--line); }
.centre-list a > span { min-width: 0; padding-right: 1.5rem; }
.centre-list a b { color: var(--gold); flex: 0 0 auto; }
.centre-list a b svg { display: block; width: 1.45rem; height: 1.45rem; fill: none; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
.founder { background: #e7ddcf; }
.founder-copy .eyebrow { color: #8f7049; }
.founder-art { position: relative; overflow: hidden; }
.founder-art::before { display: none; }
.founder-art::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 38%;
  background: linear-gradient(0deg, rgba(33, 25, 21, .78), transparent);
  pointer-events: none;
}
.founder-art > img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 48%; display: block; }
.founder-art > p { position: absolute; z-index: 1; left: 3rem; bottom: 2.5rem; margin: 0; color: var(--paper); }
.monogram { color: var(--paper); }

.schedule-note .pill { border-color: var(--gold); }
footer { border-top: 1px solid rgba(179,146,100,.4); }
footer > p { border-top-color: rgba(179,146,100,.35); }
.nav { height: 116px; }
.brand img { width: 220px; height: 76px; }
footer img { width: min(560px, 86vw); height: auto; }

@media (max-width: 850px) {
  .eyebrow::before { width: 1.8rem; }
  .hero-media { width: 100%; object-position: 49% 56%; }
  .hero-shade { background: linear-gradient(0deg, rgba(20, 15, 13, .84) 0%, rgba(20, 15, 13, .5) 45%, rgba(20, 15, 13, .08) 82%); }
  .founder-art { min-height: 620px; }
  .founder-art > img { object-position: 50% 48%; }
  .founder-art > p { left: 1.4rem; bottom: 1.8rem; }
  .nav { height: 108px; }
  .brand img { width: 165px; height: 64px; }
  .mobile-menu {
    position: absolute;
    inset: 100% 0 auto;
    height: calc(100svh - 108px);
    overflow-y: auto;
    background: rgba(33, 25, 21, .94);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }
  .nav-actions { gap: .55rem; }
  .nav-actions .pill { white-space: nowrap; }
}

@media (max-width: 430px) {
  .nav { padding: 0 .85rem; }
  .brand img { width: 138px; }
  .nav-actions .pill { padding: .7rem .8rem; font-size: .74rem; }
  .menu-toggle { width: 42px; height: 42px; flex-basis: 42px; }
}