/* =============================================================================
   A Light From Heaven — main site + community styles
   Consolidated from the original app.html: every declaration that a later
   identical rule overrode has been removed (2,674 -> 2,337 declarations).
   Verified to produce identical computed styles at 375 / 900 / 1470 px.
   The owner-approved finishes are here unchanged: 24k gold hero lettering,
   struck-gold buttons, glowing purple "Become a Member" buttons, and the
   brightened hero photo. Shared brand tokens for the landing pages live in
   alfh.css; this file keeps the main site's own token values.
   ============================================================================= */

:root {
  --navy-900:#101b30;
  --navy-800:#16233d;
  --navy-700:#22355a;
  --sky-100:#eaf3fb;
  --sky-200:#dbe9f6;
  --cream:#fbfaf7;
  --white:#ffffff;
  --ink:#3a4454;
  --ink-soft:#5d6675;
  --font-display:'Cormorant Garamond', Georgia, serif;
  --font-body:'Nunito Sans', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --shadow-sm:0 2px 10px rgba(16,27,48,.06);
  --shadow-md:0 14px 40px rgba(16,27,48,.10);
  --shadow-lg:0 26px 60px rgba(16,27,48,.16);
  --radius:18px;
  --radius-lg:26px;
  --wrap:1180px;
  --pad:clamp(1.15rem,4vw,2rem);
}

* {
  box-sizing:border-box;
  margin:0;
  padding:0;
}

html {
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
}

body {
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--cream);
  line-height:1.7;
  font-size:clamp(1rem,.55vw + .9rem,1.075rem);
  overflow-x:hidden;
}

img {
  display:block;
  max-width:100%;
  height:auto;
}

a {
  color:inherit;
  text-decoration:none;
}

h1 {
  font-family:var(--font-display);
  color:var(--navy-800);
  line-height:1.12;
  font-weight:600;
  letter-spacing:.01em;
}

h2 {
  font-family:var(--font-display);
  color:var(--navy-800);
  line-height:1.12;
  font-weight:600;
  letter-spacing:.01em;
}

h3 {
  font-family:var(--font-display);
  color:var(--navy-800);
  line-height:1.12;
  font-weight:600;
  letter-spacing:.01em;
}

h4 {
  font-family:var(--font-display);
  color:var(--navy-800);
  line-height:1.12;
  font-weight:600;
  letter-spacing:.01em;
}

ul {
  list-style:none;
}

:focus-visible {
  outline:3px solid var(--gold-500);
  outline-offset:3px;
  border-radius:6px;
}

.wrap {
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--pad);
}

.section {
  padding:clamp(3.6rem,7vw,6.5rem) 0;
  position:relative;
}

.section--sky {
  background:linear-gradient(180deg,var(--sky-100),var(--white));
}

.section--navy {
  background:radial-gradient(1200px 600px at 50% -10%,var(--navy-700),var(--navy-900));
  color:#e9eef6;
}

.section--cream {
  background:var(--cream);
}

.eyebrow {
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  font-family:var(--font-body);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:.72rem;
  color:var(--gold-600);
  margin-bottom:1rem;
}

.eyebrow::before {
  content:"";
  width:26px;
  height:2px;
  background:var(--gold-500);
  display:inline-block;
}

.section--navy .eyebrow {
  color:var(--gold-400);
}

.section-title {
  font-size:clamp(2rem,4.4vw,3.1rem);
  margin-bottom:.35rem;
}

.section--navy .section-title {
  color:#fff;
}

.lead {
  color:var(--ink-soft);
  max-width:60ch;
  font-size:1.06rem;
}

.section--navy .lead {
  color:#c7d2e2;
}

.center {
  text-align:center;
}

.center .eyebrow::before {
  display:none;
}

.center .eyebrow {
  justify-content:center;
}

.btn {
  --btn-bg:var(--gold-500);
  --btn-fg:#241a05;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  border-radius:999px;
  background:var(--btn-bg);
  color:var(--btn-fg);
  border:2px solid transparent;
  cursor:pointer;
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease,color .25s;
  box-shadow:0 10px 24px rgba(199,155,75,.28);
}

.btn:hover {
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(199,155,75,.42);
}

.btn--ghost {
  background:transparent;
  color:var(--white);
  border-color:rgba(255,255,255,.6);
  box-shadow:none;
}

.btn--ghost:hover {
  background:rgba(255,255,255,.12);
  border-color:#fff;
}

.btn--outline {
  background:transparent;
  color:var(--navy-800);
  border-color:var(--navy-800);
  box-shadow:none;
}

.btn--outline:hover {
  background:var(--navy-800);
  color:#fff;
}

.btn .arrow {
  transition:transform .25s;
}

.btn:hover .arrow {
  transform:translateX(4px);
}

.ray-divider {
  display:flex;
  justify-content:center;
  margin:0 auto 2.4rem;
  width:180px;
  height:34px;
  opacity:.9;
}

.ray-divider svg {
  width:100%;
  height:100%;
}

.card {
  background:var(--white);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  border:1px solid rgba(16,27,48,.05);
  transition:transform .3s ease,box-shadow .3s ease;
  display:flex;
  flex-direction:column;
}

.card:hover {
  transform:translateY(-4px);
  box-shadow:var(--shadow-lg);
}

.card__media {
  position:relative;
  aspect-ratio:16/10;
  overflow:hidden;
  background:linear-gradient(135deg,var(--sky-200),var(--gold-100));
}

.card__media img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .6s ease;
}

.card:hover .card__media img {
  transform:scale(1.06);
}

.card__body {
  padding:1.5rem 1.6rem 1.7rem;
}

.reveal {
  opacity:0;
  transform:translateY(16px);
  transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1);
}

.reveal.in {
  opacity:1;
  transform:none;
}

.header {
  z-index:60;
}

.nav {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-height:74px;
}

.brand {
  display:flex;
  align-items:center;
  gap:.7rem;
  flex-shrink:0;
}

.brand__mark {
  width:42px;
  height:42px;
  flex:none;
}

.brand__text {
  display:flex;
  flex-direction:column;
  line-height:1;
}

.brand__name {
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.32rem;
  color:var(--navy-800);
  letter-spacing:.01em;
}

.brand__tag {
  font-size:.6rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold-600);
  font-weight:800;
  margin-top:3px;
}

.nav-links {
  display:flex;
  align-items:center;
  gap:.15rem;
}

.nav-links a {
  font-weight:600;
  font-size:.86rem;
  color:var(--navy-700);
  padding:.5rem .68rem;
  border-radius:8px;
  position:relative;
  transition:color .2s,background .2s;
  white-space:nowrap;
}

.nav-links a:not(.nav-cta)::after {
  content:"";
  position:absolute;
  left:.68rem;
  right:.68rem;
  bottom:.28rem;
  height:2px;
  background:var(--gold-500);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .28s;
}

.nav-links a:not(.nav-cta):hover {
  color:var(--navy-900);
}

.nav-links a:not(.nav-cta):hover::after {
  transform:scaleX(1);
}

.nav-cta {
  padding:.55rem 1.05rem !important;
  border-radius:999px;
  margin-left:.4rem;
}

.hamburger {
  display:none;
  flex-direction:column;
  gap:5px;
  background:none;
  border:0;
  cursor:pointer;
  padding:10px;
  border-radius:10px;
}

.hamburger span {
  width:26px;
  height:2.5px;
  background:var(--navy-800);
  border-radius:2px;
  transition:transform .3s,opacity .3s;
}

.hamburger.open span:nth-child(1) {
  transform:translateY(7.5px) rotate(45deg);
}

.hamburger.open span:nth-child(2) {
  opacity:0;
}

.hamburger.open span:nth-child(3) {
  transform:translateY(-7.5px) rotate(-45deg);
}

.nav-backdrop {
  position:fixed;
  inset:0;
  background:rgba(16,27,48,.4);
  opacity:0;
  visibility:hidden;
  transition:.3s;
}

.nav-backdrop.show {
  opacity:1;
  visibility:visible;
}

.hero {
  position:relative;
  min-height:min(78vh,660px);
  display:flex;
  align-items:center;
  color:#fff;
  overflow:hidden;
  isolation:isolate;
}

.hero__bg {
  position:absolute;
  inset:0;
  z-index:-3;
  background:linear-gradient(160deg,rgba(16,27,48,.72),rgba(34,53,90,.45) 45%,rgba(199,155,75,.28)), url("https://images.unsplash.com/photo-1470252649378-9c29740c9fa8?auto=format&fit=crop&w=1920&q=80") center/cover no-repeat, linear-gradient(160deg,#22355a,#101b30);
}

.hero__rays {
  position:absolute;
  z-index:-2;
  top:-30%;
  left:50%;
  transform:translateX(-50%);
  width:130vmax;
  height:130vmax;
  background:conic-gradient(from 180deg at 50% 50%, transparent 0deg,rgba(228,201,126,.16) 6deg,transparent 12deg, transparent 24deg,rgba(228,201,126,.12) 30deg,transparent 36deg, transparent 48deg,rgba(228,201,126,.16) 54deg,transparent 60deg, transparent 72deg,rgba(228,201,126,.10) 78deg,transparent 84deg, transparent 96deg,rgba(228,201,126,.15) 102deg,transparent 108deg, transparent 120deg,rgba(228,201,126,.11) 126deg,transparent 132deg, transparent 168deg,rgba(228,201,126,.18) 174deg,transparent 180deg, transparent 228deg,rgba(228,201,126,.13) 234deg,transparent 240deg, transparent 300deg,rgba(228,201,126,.15) 306deg,transparent 312deg);
  -webkit-mask:radial-gradient(circle at 50% 0,#000 0,#000 42%,transparent 70%);
  mask:radial-gradient(circle at 50% 0,#000 0,#000 42%,transparent 70%);
  animation:sway 22s ease-in-out infinite alternate;
  pointer-events:none;
}

.hero__glow {
  position:absolute;
  z-index:-2;
  top:-24%;
  left:50%;
  transform:translateX(-50%);
  width:70vmax;
  height:70vmax;
  background:radial-gradient(circle,rgba(246,236,212,.42),rgba(246,236,212,0) 60%);
  pointer-events:none;
}

.hero__inner {
  padding-block:clamp(3.5rem,10vw,6rem);
  max-width:760px;
}

.hero .eyebrow {
  color:var(--gold-400);
}

.hero .eyebrow::before {
  background:var(--gold-400);
}

.hero h1 {
  color:#fff;
  font-size:clamp(2.9rem,7.5vw,5rem);
  font-weight:600;
  text-shadow:0 4px 30px rgba(0,0,0,.35);
}

.hero__sub {
  font-family:var(--font-display);
  font-style:italic;
  font-size:clamp(1.4rem,3vw,2rem);
  color:var(--gold-400);
  margin-top:.35rem;
  font-weight:500;
}

.hero__cta {
  display:flex;
  flex-wrap:wrap;
  gap:.9rem;
  margin-top:2rem;
}

.scroll-cue {
  position:absolute;
  bottom:22px;
  left:50%;
  transform:translateX(-50%);
  color:rgba(255,255,255,.75);
  font-size:.7rem;
  letter-spacing:.25em;
  text-transform:uppercase;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  animation:bob 2.2s ease-in-out infinite;
}

.scroll-cue span {
  width:1px;
  height:34px;
  background:linear-gradient(rgba(255,255,255,.7),transparent);
}

.intro__grid {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:center;
}

.intro__quote {
  font-family:var(--font-display);
  font-size:clamp(1.35rem,2.4vw,1.85rem);
  color:var(--navy-800);
  line-height:1.4;
  font-weight:500;
}

.intro__quote em {
  color:var(--gold-600);
  font-style:italic;
}

.intro__ask {
  font-family:var(--font-display);
  font-style:italic;
  font-size:clamp(1.5rem,2.8vw,2.15rem);
  color:var(--gold-600);
  margin:1.2rem 0 1.6rem;
  line-height:1.3;
}

.intro__art {
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-md);
  aspect-ratio:4/5;
  background:linear-gradient(160deg,var(--sky-200),var(--gold-100));
}

.intro__art img {
  width:100%;
  height:100%;
  object-fit:cover;
}

.intro__badge {
  padding:.7rem 1.1rem;
  border-radius:14px;
  font-family:var(--font-display);
  font-size:1.05rem;
  color:var(--navy-800);
  font-weight:600;
}

.intro__badge b {
  color:var(--gold-600);
}

.about__grid {
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:center;
}

.about__media {
  position:relative;
}

.about__media img {
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);
  width:100%;
  aspect-ratio:820/1276;
  object-fit:cover;
  object-position:center top;
  background:linear-gradient(160deg,var(--sky-200),var(--gold-100));
}

.founder {
  background:var(--navy-800);
  color:#fff;
  border-radius:16px;
  padding:1rem 1.3rem;
  box-shadow:var(--shadow-md);
}

.founder small {
  color:var(--gold-400);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:800;
  font-size:.66rem;
}

.founder strong {
  display:block;
  font-family:var(--font-display);
  font-size:1.35rem;
  font-weight:600;
  margin-top:.15rem;
}

.values {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:.85rem;
  margin:1.5rem 0 1.9rem;
}

/* Block layout (not flex) so a bold label and its sentence wrap as one line
   of text; the star sits in the gutter. */
.values li {
  display:block;
  position:relative;
  padding-left:2.1rem;
  line-height:1.6;
  font-weight:600;
  color:var(--navy-700);
  font-size:.98rem;
}

.values .tick {
  position:absolute;
  left:0;
  top:.1em;
  width:22px;
  height:22px;
  border-radius:50%;
  background:var(--gold-100);
  color:var(--gold-600);
  display:grid;
  place-items:center;
  font-size:.8rem;
  margin-top:2px;
}

.about__cta {
  display:flex;
  flex-wrap:wrap;
  gap:.9rem;
}

.blog-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.8rem;
  margin-top:2.6rem;
}

.blog-card .card__media::after {
  content:attr(data-num);
  position:absolute;
  top:14px;
  left:14px;
  font-family:var(--font-display);
  font-size:1.5rem;
  font-weight:700;
  color:#fff;
  background:rgba(16,27,48,.55);
  backdrop-filter:blur(4px);
  width:46px;
  height:46px;
  border-radius:12px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.3);
}

.blog-card h3 {
  font-size:1.4rem;
  margin-bottom:.5rem;
}

.blog-card .meta {
  font-size:.74rem;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--gold-600);
  font-weight:800;
  margin-bottom:.5rem;
}

.blog-card p {
  color:var(--ink-soft);
  font-size:.96rem;
  margin-bottom:1rem;
}

.readmore {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-weight:800;
  color:var(--navy-800);
  font-size:.86rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.readmore .arrow {
  color:var(--gold-600);
  transition:transform .25s;
}

.readmore:hover .arrow {
  transform:translateX(5px);
}

.video-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.3rem;
  margin-top:2.4rem;
}

.video {
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  aspect-ratio:16/10;
  cursor:pointer;
  box-shadow:var(--shadow-sm);
  background:linear-gradient(135deg,var(--navy-700),var(--navy-900));
  transition:transform .3s,box-shadow .3s;
}

.video:hover {
  transform:translateY(-4px);
  box-shadow:var(--shadow-md);
}

.video img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .6s,filter .3s;
  filter:saturate(1.05);
}

.video:hover img {
  transform:scale(1.07);
}

.video::before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 40%,rgba(16,27,48,.65));
  z-index:1;
}

.video__play {
  position:absolute;
  inset:0;
  margin:auto;
  width:60px;
  height:60px;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  display:grid;
  place-items:center;
  z-index:2;
  transition:transform .3s,background .3s;
  box-shadow:0 8px 22px rgba(0,0,0,.3);
}

.video:hover .video__play {
  transform:scale(1.12);
  background:var(--gold-400);
}

.video__play svg {
  width:22px;
  height:22px;
  margin-left:3px;
  fill:var(--navy-800);
}

.video__label {
  position:absolute;
  left:14px;
  bottom:12px;
  z-index:2;
  color:#fff;
  font-weight:700;
  font-size:.9rem;
  font-family:var(--font-display);
  text-shadow:0 2px 8px rgba(0,0,0,.5);
}

.video__len {
  position:absolute;
  right:12px;
  top:12px;
  z-index:2;
  background:rgba(16,27,48,.72);
  color:#fff;
  font-size:.7rem;
  font-weight:700;
  padding:.15rem .5rem;
  border-radius:6px;
}

.webinar-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.8rem;
  margin-top:2.6rem;
}

.webinar {
  background:var(--white);
  border-radius:var(--radius);
  padding:1.9rem 1.7rem;
  box-shadow:var(--shadow-sm);
  border:1px solid rgba(16,27,48,.05);
  border-top:4px solid var(--gold-500);
  transition:transform .3s,box-shadow .3s;
  display:flex;
  flex-direction:column;
}

.webinar:hover {
  transform:translateY(-8px);
  box-shadow:var(--shadow-lg);
}

.webinar__date {
  display:flex;
  align-items:baseline;
  gap:.5rem;
  color:var(--gold-600);
  font-family:var(--font-display);
  margin-bottom:.9rem;
}

.webinar__date .d {
  font-size:2.6rem;
  font-weight:700;
  line-height:1;
}

.webinar__date .m {
  font-size:1rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-family:var(--font-body);
  font-weight:800;
}

.webinar h3 {
  font-size:1.35rem;
  text-transform:uppercase;
  letter-spacing:.02em;
  margin-bottom:.6rem;
}

.webinar p {
  color:var(--ink-soft);
  font-size:.95rem;
  margin-bottom:1.3rem;
  flex:1;
}

.fundraiser {
  background:linear-gradient(135deg,var(--navy-800),var(--navy-900));
  color:#fff;
  border-radius:var(--radius-lg);
  padding:clamp(2rem,5vw,3.4rem);
  display:grid;
  grid-template-columns:1.3fr .7fr;
  gap:2rem;
  align-items:center;
  box-shadow:var(--shadow-md);
  overflow:hidden;
  position:relative;
}

.fundraiser::after {
  content:"";
  position:absolute;
  right:-80px;
  top:-80px;
  width:280px;
  height:280px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(228,201,126,.28),transparent 70%);
}

.fundraiser .eyebrow {
  color:var(--gold-400);
}

.fundraiser h2 {
  color:#fff;
  font-size:clamp(1.8rem,3.6vw,2.6rem);
}

.fundraiser p {
  color:#c7d2e2;
  margin:.8rem 0 1.4rem;
  max-width:52ch;
}

.fundraiser__stat {
  text-align:center;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius);
  padding:1.6rem;
  position:relative;
  z-index:1;
}

.fundraiser__stat .big {
  font-family:var(--font-display);
  font-size:clamp(2.4rem,5vw,3.4rem);
  color:var(--gold-400);
  font-weight:700;
  line-height:1;
}

.fundraiser__stat .cap {
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#c7d2e2;
  margin-top:.4rem;
}

.progress {
  height:8px;
  background:rgba(255,255,255,.15);
  border-radius:999px;
  margin:1.1rem 0 .5rem;
  overflow:hidden;
}

.progress i {
  display:block;
  height:100%;
  width:68%;
  background:linear-gradient(90deg,var(--gold-500),var(--gold-400));
  border-radius:999px;
}

.vision {
  max-width:860px;
  margin-inline:auto;
  text-align:center;
}

.vision .big-quote {
  font-family:var(--font-display);
  font-size:clamp(1.7rem,3.6vw,2.6rem);
  color:#fff;
  line-height:1.35;
  font-weight:500;
}

.vision .big-quote span {
  color:var(--gold-400);
}

.vision__mark {
  font-family:var(--font-display);
  font-size:5rem;
  color:var(--gold-400);
  line-height:.5;
  opacity:.55;
}

.subscribe {
  max-width:760px;
  margin-inline:auto;
  text-align:center;
}

.subform {
  display:grid;
  grid-template-columns:1fr 1fr auto;
  gap:.8rem;
  margin-top:2rem;
  background:var(--white);
  padding:.8rem;
  border-radius:999px;
  box-shadow:var(--shadow-md);
  border:1px solid rgba(16,27,48,.06);
}

.subform input {
  border:0;
  background:var(--sky-100);
  border-radius:999px;
  padding:.85rem 1.2rem;
  font-family:inherit;
  font-size:.95rem;
  color:var(--navy-800);
  min-width:0;
}

.subform input::placeholder {
  color:#8994a5;
}

.subform input:focus {
  outline:2px solid var(--gold-400);
  background:#fff;
}

.subform .btn {
  white-space:nowrap;
}

.subnote {
  font-size:.82rem;
  color:var(--ink-soft);
  margin-top:1rem;
}

.subok {
  margin-top:1.1rem;
  color:var(--gold-600);
  font-weight:700;
  display:none;
}

.subok.show {
  display:block;
}

.brand__logo {
  width:52px;
  height:52px;
  object-fit:contain;
  flex:none;
}

.hero--light .hero__inner {
  max-width:860px;
  margin-inline:auto;
}

.hero--light h1 {
  color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.75),0 6px 40px rgba(0,0,0,.6);
}

.hero--light .eyebrow::before {
  background:var(--gold-400);
}

.hero--light .hero__cta {
  justify-content:center;
}

.hero__logo {
  width:min(320px,66vw);
  height:auto;
  margin:0 auto 1rem;
  display:block;
  filter:drop-shadow(0 20px 44px rgba(93,60,120,.28));
  animation:floaty 6s ease-in-out infinite;
}

.scroll-cue--dark {
  color:rgba(34,53,90,.55);
}

.scroll-cue--dark span {
  background:linear-gradient(rgba(34,53,90,.5),transparent);
}

.footer {
  background:var(--navy-900);
  color:#c7d2e2;
  padding-top:clamp(3rem,6vw,4.5rem);
}

.footer__top {
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:2.5rem;
  padding-bottom:2.5rem;
  border-bottom:1px solid rgba(255,255,255,.1);
}

.footer .brand__name {
  color:#fff;
}

.footer p {
  color:#9fabbf;
  font-size:.95rem;
  margin-top:1rem;
  max-width:38ch;
}

.footer h4 {
  color:#fff;
  font-size:1.2rem;
  margin-bottom:1rem;
}

.footer__links {
  display:flex;
  flex-direction:column;
  gap:.6rem;
}

.footer__links a {
  color:#9fabbf;
  font-size:.92rem;
  transition:color .2s,padding .2s;
  width:fit-content;
}

.footer__links a:hover {
  color:var(--gold-400);
  padding-left:5px;
}

.socials {
  display:flex;
  gap:.7rem;
  margin-top:1.3rem;
}

.socials a {
  width:40px;
  height:40px;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  display:grid;
  place-items:center;
  transition:background .25s,transform .25s;
}

.socials a:hover {
  background:var(--gold-500);
  transform:translateY(-3px);
}

.socials svg {
  width:18px;
  height:18px;
  fill:#fff;
}

.footer__bottom {
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:1rem;
  padding:1.6rem 0;
  font-size:.85rem;
  color:#8592a8;
}

.footer__bottom a {
  color:#9fabbf;
}

.footer__bottom a:hover {
  color:var(--gold-400);
}

@media (max-width:1080px) {
  .nav-links a:not(.nav-cta) {
    padding:.5rem .5rem;
    font-size:.82rem;
  }
}

@media (max-width:960px) {
  .hamburger {
    display:flex;
  }
  .nav-links {
    position:fixed;
    top:0;
    right:0;
    height:100dvh;
    width:min(320px,86vw);
    z-index:58;
    background:var(--cream);
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    padding:5.5rem 1.4rem 2rem;
    gap:.2rem;
    box-shadow:-20px 0 50px rgba(16,27,48,.2);
    transform:translateX(100%);
    transition:transform .35s cubic-bezier(.4,0,.2,1);
  }
  .nav-links.open {
    transform:translateX(0);
  }
  .nav-links a:not(.nav-cta) {
    padding:.85rem .8rem;
    font-size:1rem;
    border-radius:10px;
  }
  .nav-links a:not(.nav-cta)::after {
    display:none;
  }
  .nav-links a:not(.nav-cta):hover {
    background:var(--sky-100);
  }
  .nav-cta {
    margin:.7rem 0 0;
    text-align:center;
    justify-content:center;
    padding:.9rem 1rem !important;
  }
  .intro__grid {
    grid-template-columns:minmax(0,1fr);
  }
  .about__grid {
    grid-template-columns:minmax(0,1fr);
  }
  .fundraiser {
    grid-template-columns:1fr;
  }
  .about__media {
    max-width:440px;
    margin-inline:auto;
  }
  .intro__art {
    max-width:440px;
    margin-inline:auto;
  }
  .blog-grid {
    grid-template-columns:1fr 1fr;
  }
  .webinar-grid {
    grid-template-columns:1fr 1fr;
  }
  .video-grid {
    grid-template-columns:1fr 1fr;
  }
  .footer__top {
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width:620px) {
  .blog-grid {
    grid-template-columns:1fr;
  }
  .webinar-grid {
    grid-template-columns:1fr;
  }
  .video-grid {
    grid-template-columns:1fr;
  }
  .footer__top {
    grid-template-columns:1fr;
  }
  .subform {
    grid-template-columns:1fr;
    border-radius:var(--radius);
    padding:1rem;
  }
  .subform input {
    border-radius:12px;
    justify-content:center;
  }
  .subform .btn {
    border-radius:12px;
    justify-content:center;
  }
  .founder {
    position:static;
    margin-top:1rem;
    max-width:none;
  }
  .fundraiser__stat {
    margin-top:.5rem;
  }
  .brand__tag {
    display:none;
  }
  .brand__logo {
    width:44px;
    height:44px;
  }
}

@media (prefers-reduced-motion:reduce) {
  * {
    animation:none !important;
    scroll-behavior:auto;
  }
  .reveal {
    opacity:1;
    transform:none;
  }
}

:root {
  --line:#e7e2d7;
  --hero-photo:url("https://images.unsplash.com/photo-1585531263717-5ebd8114dac3?auto=format&fit=crop&w=1920&h=1100&q=80");
}

.auth {
  position:fixed;
  inset:0;
  z-index:200;
  background:linear-gradient(180deg,rgba(16,27,48,.55),rgba(16,27,48,.7));
  display:grid;
  place-items:center;
  padding:20px;
  backdrop-filter:blur(4px);
}

.auth[hidden] {
  display:none;
}

.auth__card {
  width:100%;
  max-width:430px;
  background:#fff;
  border-radius:24px;
  box-shadow:0 30px 70px rgba(0,0,0,.35);
  border:1px solid var(--line,#e7e2d7);
  padding:clamp(24px,5vw,36px);
  position:relative;
}

.auth__close {
  position:absolute;
  top:14px;
  right:14px;
  border:0;
  background:none;
  cursor:pointer;
  color:var(--ink-soft);
  font-size:22px;
  line-height:1;
}

.auth__logo {
  display:block;
  width:120px;
  margin:0 auto 6px;
}

.auth__tabs {
  display:flex;
  background:var(--sky-100);
  border-radius:999px;
  padding:4px;
  margin:14px 0 20px;
}

.auth__tabs button {
  flex:1;
  border:0;
  cursor:pointer;
  border-radius:999px;
  padding:9px 0;
  font-family:var(--font-body);
  font-weight:800;
  font-size:14px;
  background:transparent;
  color:var(--ink-soft);
}

.auth__tabs button.on {
  background:var(--navy-800);
  color:#fff;
}

.auth__err {
  background:#fbeae9;
  color:#c0524b;
  font-weight:700;
  font-size:13px;
  padding:9px 12px;
  border-radius:10px;
  margin-bottom:12px;
}

.f {
  display:block;
  margin-bottom:14px;
}

/* Sign-in window: reset-password modes, calm success notes, text links. */
.auth__title {
  font-size:1.7rem;
  text-align:center;
  margin:14px 0 6px;
}
.auth__lead {
  text-align:center;
  font-size:14px;
  line-height:1.55;
  color:var(--ink-soft);
  margin:0 0 18px;
}
.auth__info {
  background:#eef6ef;
  color:#1d5a32;
  font-weight:700;
  font-size:13px;
  line-height:1.5;
  padding:10px 12px;
  border-radius:10px;
  margin-bottom:12px;
}
.auth__link {
  display:block;
  margin:12px auto 0;
  min-height:44px;
  padding:0 8px;
  border:0;
  background:none;
  cursor:pointer;
  font-family:var(--font-body);
  font-weight:700;
  font-size:13.5px;
  color:var(--navy-700);
  text-decoration:underline;
  text-underline-offset:3px;
}
.auth__link:hover { color:var(--navy-900); }
.auth__forgot { margin:-8px 0 8px auto; min-height:36px; text-decoration:none; }
#authBtn:disabled { opacity:.7; cursor:progress; }

.f span {
  display:block;
  font-weight:700;
  font-size:13px;
  color:var(--navy-700);
  margin-bottom:5px;
}

.f input {
  width:100%;
  font-family:var(--font-body);
  font-size:15px;
  color:var(--navy-800);
  background:var(--sky-100);
  border:1px solid transparent;
  border-radius:12px;
  padding:11px 14px;
  outline:none;
}

.f textarea {
  width:100%;
  font-family:var(--font-body);
  font-size:15px;
  color:var(--navy-800);
  background:var(--sky-100);
  border:1px solid transparent;
  border-radius:12px;
  padding:11px 14px;
  outline:none;
}

.f select {
  width:100%;
  font-family:var(--font-body);
  font-size:15px;
  color:var(--navy-800);
  background:var(--sky-100);
  border:1px solid transparent;
  border-radius:12px;
  padding:11px 14px;
  outline:none;
}

.f input:focus {
  border-color:var(--gold-400);
  background:#fff;
}

.f textarea:focus {
  border-color:var(--gold-400);
  background:#fff;
}

.f select:focus {
  border-color:var(--gold-400);
  background:#fff;
}

.c-btn {
  font-family:var(--font-body);
  font-weight:800;
  border-radius:999px;
  cursor:pointer;
  border:2px solid transparent;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 18px;
  font-size:14px;
  background:var(--gold-500);
  color:#241a05;
  box-shadow:0 8px 20px rgba(199,155,75,.28);
}

.c-btn:hover {
  transform:translateY(-2px);
}

.c-btn.sm {
  padding:6px 13px;
  font-size:13px;
}

.c-btn.ghost {
  background:transparent;
  color:var(--navy-800);
  border-color:var(--line,#e7e2d7);
  box-shadow:none;
}

.c-btn.navy {
  background:var(--navy-800);
  color:#fff;
  box-shadow:none;
}

@media (max-width:1250px) {
  .hamburger {
    display:flex;
  }
  .nav-links {
    position:fixed;
    top:0;
    right:0;
    height:100dvh;
    width:min(320px,86vw);
    z-index:58;
    background:var(--cream);
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    padding:5.5rem 1.4rem 2rem;
    gap:.2rem;
    box-shadow:-20px 0 50px rgba(16,27,48,.2);
    transform:translateX(100%);
    transition:transform .35s cubic-bezier(.4,0,.2,1);
    overflow-y:auto;
  }
  .nav-links.open {
    transform:translateX(0);
  }
  .nav-links a:not(.nav-cta) {
    padding:.85rem .8rem;
    font-size:1rem;
    border-radius:10px;
  }
  .nav-links a:not(.nav-cta)::after {
    display:none;
  }
  .nav-links a:not(.nav-cta):hover {
    background:var(--sky-100);
  }
  .nav-cta {
    margin:.7rem 0 0;
    text-align:center;
    justify-content:center;
    padding:.9rem 1rem !important;
  }
}

.nav {
  flex-wrap:nowrap;
}

.brand {
  min-width:0;
}

.brand__name {
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media (max-width:420px) {
  .brand__name {
    font-size:1.05rem;
  }
}

img.avatar {
  object-fit:cover;
  display:block;
}

.am {
  position:fixed;
  inset:0;
  z-index:210;
  background:rgba(16,27,48,.62);
  backdrop-filter:blur(4px);
  display:grid;
  place-items:start center;
  padding:24px 16px;
  overflow-y:auto;
}

.am[hidden] {
  display:none;
}

.am__card {
  width:100%;
  max-width:760px;
  background:#fff;
  border-radius:22px;
  box-shadow:0 30px 70px rgba(0,0,0,.35);
  position:relative;
  overflow:hidden;
  margin-bottom:40px;
}

.am__close {
  position:absolute;
  top:12px;
  right:14px;
  z-index:2;
  border:0;
  background:rgba(255,255,255,.9);
  width:34px;
  height:34px;
  border-radius:50%;
  cursor:pointer;
  font-size:22px;
  line-height:1;
  color:var(--navy-800);
  box-shadow:0 2px 8px rgba(0,0,0,.2);
}

.am__cover {
  width:100%;
  aspect-ratio:16/7;
  object-fit:cover;
  display:block;
}

.am__body {
  padding:clamp(20px,4vw,34px);
}

.am__text {
  font-size:16.5px;
  line-height:1.75;
  color:var(--ink);
}

.am__text p {
  margin-bottom:1em;
}

.about__copy {
  margin-top:1rem;
}

.about__copy p {
  color:var(--ink-soft);
  font-size:1.02rem;
  line-height:1.78;
  margin-bottom:1rem;
}

.about__copy p:first-child {
  color:var(--ink);
  font-size:1.09rem;
}

.about__copy strong {
  color:var(--gold-600);
  font-weight:800;
}

@media(min-width:961px) {
  .about__grid {
    align-items:start;
  }
  .about__media {
    position:sticky;
    top:96px;
  }
}

.footer__logo {
  display:flex;
  justify-content:center;
  padding:2.2rem 0 .6rem;
}

.footer__logo img {
  width:min(210px,52vw);
  height:auto;
  filter:drop-shadow(0 12px 34px rgba(0,0,0,.45));
}

.toast {
  position:fixed;
  left:50%;
  bottom:26px;
  transform:translate(-50%,20px);
  z-index:300;
  background:var(--navy-900);
  color:#fff;
  font-family:var(--font-body);
  font-weight:700;
  font-size:14px;
  padding:11px 20px;
  border-radius:999px;
  box-shadow:0 12px 34px rgba(0,0,0,.35);
  opacity:0;
  visibility:hidden;
  transition:.22s;
}

.toast.show {
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0);
}

.header {
  position:fixed;
  top:0;
  left:0;
  right:0;
  background:transparent;
  backdrop-filter:none;
  border-bottom:1px solid transparent;
  box-shadow:none;
  transition:background .35s ease,box-shadow .35s ease,border-color .35s ease,backdrop-filter .35s ease;
}

.header.scrolled {
  background:rgba(251,250,247,.96);
  backdrop-filter:blur(12px);
  border-bottom-color:rgba(16,27,48,.06);
  box-shadow:var(--shadow-sm);
}

.header:not(.scrolled) .brand__name {
  color:#fff;
  text-shadow:0 2px 12px rgba(0,0,0,.65);
}

.header:not(.scrolled) .brand__tag {
  color:var(--gold-400);
  text-shadow:0 2px 10px rgba(0,0,0,.75);
}

.header:not(.scrolled) .hamburger span {
  background:#fff;
  box-shadow:0 1px 6px rgba(0,0,0,.5);
}

@media(min-width:1251px) {
  .header:not(.scrolled) .nav-links a:not(.nav-cta) {
    color:#fff;
    text-shadow:0 2px 10px rgba(0,0,0,.7);
  }
  .header:not(.scrolled) .nav-links a:not(.nav-cta):hover {
    color:var(--gold-400);
  }
  .header:not(.scrolled) .nav-links a:not(.nav-cta)::after {
    background:var(--gold-400);
  }
}

.hamburger.open span {
  background:var(--navy-800) !important;
  box-shadow:none !important;
}

.hero--light .hero__inner {
  padding-top:calc(clamp(3.5rem,10vw,6rem) + 2px);
  padding-bottom:calc(clamp(3.5rem,10vw,6rem) + 84px);
}

.btn {
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.15rem;
  letter-spacing:.02em;
  padding:.72rem 1.7rem;
}

.btn--sm {
  font-size:1rem;
  padding:.5rem 1.2rem;
}

.nav-cta {
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.02rem;
  letter-spacing:.02em;
}

.photo-locked {
  font-size:12px;
  font-weight:700;
  color:var(--ink-soft);
  background:var(--sky-100);
  padding:6px 12px;
  border-radius:999px;
}

.reader {
  position:fixed;
  inset:0;
  z-index:220;
  background:var(--cream);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}

.reader[hidden] {
  display:none;
}

.reader__hero {
  position:relative;
  min-height:min(56vh,440px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:74px 20px 42px;
  background-size:cover;
  background-position:center 40%;
  background-repeat:no-repeat;
  color:#fff;
}

.reader__back {
  position:absolute;
  top:16px;
  left:16px;
  border:1px solid rgba(255,255,255,.5);
  background:rgba(16,27,48,.35);
  backdrop-filter:blur(6px);
  color:#fff;
  cursor:pointer;
  border-radius:999px;
  padding:8px 16px;
  font-family:var(--font-body);
  font-weight:800;
  font-size:13px;
}

.reader__back:hover {
  background:rgba(16,27,48,.6);
}

.reader__logo {
  width:min(230px,48vw);
  height:auto;
  margin-bottom:14px;
  filter:drop-shadow(0 14px 34px rgba(0,0,0,.5));
}

.reader__eyebrow {
  color:var(--gold-400);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.2em;
  font-size:11px;
  margin-bottom:6px;
  text-shadow:0 2px 10px rgba(0,0,0,.7);
}

.reader__hero h1 {
  color:#fff;
  font-family:var(--font-display);
  font-size:clamp(30px,5.5vw,50px);
  line-height:1.1;
  text-shadow:0 3px 22px rgba(0,0,0,.6);
  max-width:16ch;
}

.reader__body {
  max-width:740px;
  margin:0 auto;
  padding:clamp(28px,5vw,52px) 22px 70px;
}

.reader__body p {
  font-size:17px;
  line-height:1.9;
  color:var(--ink);
  margin-bottom:1.25em;
}

.reader__body p:first-child {
  font-size:19px;
  color:var(--navy-800);
  line-height:1.8;
}

.reader__end {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:38px;
  padding-top:28px;
  border-top:1px solid var(--line);
}

.reader__hero {
  background-color:var(--navy-900);
}

.fundraiser__quote {
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.fq__mark {
  font-family:var(--font-display);
  font-size:56px;
  line-height:.6;
  color:var(--gold-400);
  opacity:.6;
}

.fundraiser__quote p {
  font-family:var(--font-display);
  font-size:clamp(1.15rem,2vw,1.4rem);
  line-height:1.45;
  color:#fff;
  margin:0 0 10px;
}

.fq__who {
  font-weight:800;
  font-size:13px;
  color:var(--gold-400);
}

.fq__who span {
  display:block;
  font-weight:600;
  font-size:11px;
  color:#c7d2e2;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-top:2px;
}

.reader__figure {
  margin:34px 0 30px;
}

.reader__figure img {
  width:100%;
  border-radius:16px;
  display:block;
  box-shadow:0 18px 44px rgba(16,27,48,.18);
}

.reader__figure figcaption {
  text-align:center;
  font-family:var(--font-display);
  font-style:italic;
  font-size:16px;
  color:var(--gold-600);
  margin-top:12px;
}

.intro__art img {
  filter:saturate(1.55) contrast(1.10) brightness(1.03) hue-rotate(-4deg);
  transition:filter .4s ease;
}

.intro__art:hover img {
  filter:saturate(1.75) contrast(1.13) brightness(1.05) hue-rotate(-4deg);
}

.reader__byline {
  font-family:var(--font-body);
  font-weight:800;
  font-size:11.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold-600);
  margin-bottom:22px;
}

.blog-card .card__media:not([data-num])::after {
  display:none;
}

.hero--light .hero__glow {
  display:none !important;
}

.hero--light .hero__rays {
  display:none !important;
}

.intro__col {
  display:block;
}

.intro__badge {
  position:static;
  left:auto;
  bottom:auto;
  margin:1.1rem auto 0;
  width:fit-content;
  max-width:100%;
  text-align:center;
  background:var(--sky-100);
  backdrop-filter:none;
  box-shadow:none;
  border:1px solid var(--line);
}

@media(max-width:960px) {
  .intro__col {
    max-width:440px;
    margin-inline:auto;
  }
}

.founder {
  position:static;
  left:auto;
  right:auto;
  bottom:auto;
  margin:1.1rem auto 0;
  width:fit-content;
  max-width:100%;
  text-align:center;
}

.btn--purple:hover {
  color:#fff !important;
}

.btn--purple {
  background:linear-gradient(135deg,#8b13d6 0%,#c44dff 100%) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 0 18px rgba(196,77,255,.65), 0 0 44px rgba(157,47,214,.45), 0 10px 26px rgba(108,1,166,.4) !important;
  animation:purpleGlow 2.8s ease-in-out infinite;
}

.btn--purple:hover {
  background:linear-gradient(135deg,#a020f0 0%,#dd7bff 100%) !important;
  box-shadow:0 0 32px rgba(214,110,255,.95), 0 0 74px rgba(196,77,255,.7), 0 16px 40px rgba(108,1,166,.55) !important;
}

.nav-cta {
  background:linear-gradient(135deg,#8b13d6 0%,#c44dff 100%) !important;
  color:#fff !important;
  box-shadow:0 0 14px rgba(196,77,255,.6), 0 0 32px rgba(157,47,214,.4) !important;
  animation:purpleGlow 2.8s ease-in-out infinite;
}

.nav-cta:hover {
  background:linear-gradient(135deg,#a020f0 0%,#dd7bff 100%) !important;
}

.hero--light .hero__logo {
  margin:0 auto .25rem;
}

.hero--light .eyebrow {
  font-family:'Great Vibes', 'Cormorant Garamond', cursive;
  font-weight:400;
  text-transform:none;
  letter-spacing:.01em;
  line-height:1.1;
  margin:-.35rem 0 .45rem;
  display:block;
}

.hero--light .eyebrow::before {
  display:none;
}

.hero--light .scroll-cue {
  color:#fff !important;
  font-weight:800;
  font-size:.74rem;
  letter-spacing:.28em;
  bottom:26px;
  text-shadow:0 2px 10px rgba(0,0,0,.85), 0 0 22px rgba(0,0,0,.6);
}

.hero--light .scroll-cue span {
  width:2px !important;
  height:44px !important;
  border-radius:2px;
  background:linear-gradient(180deg,#ffffff 0%, #f0c95c 55%, rgba(240,201,92,0) 100%) !important;
  box-shadow:0 0 12px rgba(255,255,255,.75), 0 0 22px rgba(240,201,92,.5);
}

.hero--light {
  background:linear-gradient(160deg,#22355a,#101b30) !important;
  color:#fff;
}

.hero--light::before {
  content:"" !important;
  display:block !important;
  position:absolute;
  inset:0;
  z-index:-1;
  background-image:var(--hero-photo);
  background-size:cover;
  background-position:center 40%;
  background-repeat:no-repeat;
  filter:brightness(1.30) contrast(1.02) saturate(1.12);
}

section[id] {
  scroll-margin-top:88px;
}

#top {
  scroll-margin-top:0;
}

.nav-links {
  z-index:61;
}

.nav-backdrop {
  z-index:59;
}

.hamburger {
  position:relative;
  z-index:62;
}

.header:has(.nav-links.open) {
  background:rgba(251,250,247,.98) !important;
  backdrop-filter:blur(12px);
  box-shadow:var(--shadow-sm);
}

.header:has(.nav-links.open) .brand__name {
  color:var(--navy-800);
  text-shadow:none;
}

.header:has(.nav-links.open) .brand__tag {
  color:var(--gold-600);
  text-shadow:none;
}

.header.menu-open {
  background:rgba(251,250,247,.98) !important;
  backdrop-filter:blur(12px);
  box-shadow:var(--shadow-sm);
}

.header.menu-open .brand__name {
  color:var(--navy-800);
  text-shadow:none;
}

.header.menu-open .brand__tag {
  color:var(--gold-600);
  text-shadow:none;
}

#cMain {
  animation:viewIn .26s ease;
}

.c-btn {
  transition:transform .14s, box-shadow .18s, background .18s;
}

.c-btn:active {
  transform:scale(.96);
}

#npText {
  outline:none;
  line-height:1.6;
}

#npText::placeholder {
  color:#93a0b2;
}

.reader {
  overscroll-behavior:contain;
}

.am {
  overscroll-behavior:contain;
}

.hero--light .eyebrow {
  background-position:0 0 !important;
}

.hero--light .hero__sub {
  background-position:0 0 !important;
}

.btn:not(.btn--purple):not(.btn--ghost):not(.btn--outline) {
  background-image:linear-gradient(180deg, #F9E596 0%, #FFE34D 18%, #E2C979 46%, #D8A100 72%, #DBBF6A 88%, #F0DD99 100% ) !important;
  background-color:#E2C979 !important;
  border:1px solid rgba(166,124,0,.55) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.28);
}

.c-btn:not(.ghost):not(.navy) {
  background-image:linear-gradient(180deg, #F9E596 0%, #FFE34D 18%, #E2C979 46%, #D8A100 72%, #DBBF6A 88%, #F0DD99 100% ) !important;
  background-color:#E2C979 !important;
  border:1px solid rgba(166,124,0,.55) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.28);
}

.btn:not(.btn--purple):not(.btn--ghost):not(.btn--outline):hover {
  background-image:linear-gradient(180deg, #FBDC5C 0%, #FFDF2E 18%, #E0BC44 46%, #F1B60E 72%, #D6B23C 88%, #EFD055 100% ) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(90,64,0,.3), 0 12px 30px rgba(166,124,0,.46) !important;
}

.c-btn:not(.ghost):not(.navy):hover {
  background-image:linear-gradient(180deg, #FBDC5C 0%, #FFDF2E 18%, #E0BC44 46%, #F1B60E 72%, #D6B23C 88%, #EFD055 100% ) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(90,64,0,.3), 0 12px 30px rgba(166,124,0,.46) !important;
}

.btn:not(.btn--purple):not(.btn--ghost):not(.btn--outline) .arrow {
  color:#3B2A00;
}

:root {
  --gold-600:#D8A100;
  --gold-500:#E2C979;
  --gold-400:#F9E596;
  --gold-100:#FBF4DC;
}

.btn:not(.btn--purple):not(.btn--ghost):not(.btn--outline) {
  color:#4A3600 !important;
  border-color:rgba(216,161,0,.5) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), inset 0 -1px 0 rgba(120,86,0,.28), 0 8px 24px rgba(216,161,0,.4) !important;
}

.c-btn:not(.ghost):not(.navy) {
  color:#4A3600 !important;
  border-color:rgba(216,161,0,.5) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), inset 0 -1px 0 rgba(120,86,0,.28), 0 8px 24px rgba(216,161,0,.4) !important;
}

.hero--light .hero__sub {
  font-weight:700 !important;
  letter-spacing:.005em;
}

.hero--light .eyebrow {
  font-size:clamp(1.95rem,4.1vw,2.95rem) !important;
  background-image:linear-gradient(180deg, #FFE500 0%, #FFE100 7%, #FFDC00 15%, #FFD700 25%, #FFCE00 36%, #FFC400 48%, #F5B900 60%, #E3A900 72%, #FFC000 82%, #CE9500 92%, #AD7C00 100% ) !important;
  background-size:100% 100% !important;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent !important;
  text-shadow:none !important;
  animation:none !important;
  filter:drop-shadow(0 -1px 0 rgba(255,229,0,1)) drop-shadow(0 1px 0 rgba(120,86,0,.95)) drop-shadow(0 2px 1px rgba(78,56,0,.6)) drop-shadow(0 3px 10px rgba(0,0,0,.55)) !important;
}

.hero--light .hero__sub {
  background-image:linear-gradient(180deg, #FFE500 0%, #FFE100 7%, #FFDC00 15%, #FFD700 25%, #FFCE00 36%, #FFC400 48%, #F5B900 60%, #E3A900 72%, #FFC000 82%, #CE9500 92%, #AD7C00 100% ) !important;
  background-size:100% 100% !important;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent !important;
  text-shadow:none !important;
  animation:none !important;
  filter:drop-shadow(0 -1px 0 rgba(255,229,0,1)) drop-shadow(0 1px 0 rgba(120,86,0,.95)) drop-shadow(0 2px 1px rgba(78,56,0,.6)) drop-shadow(0 3px 10px rgba(0,0,0,.55)) !important;
}

.hero--light::after {
  content:"" !important;
  display:block !important;
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:13%;
  z-index:-1;
  background:linear-gradient(180deg, rgba(251,250,247,0) 0%, rgba(251,250,247,.06) 45%, rgba(251,250,247,.26) 74%, rgba(251,250,247,.52) 90%, rgba(251,250,247,.78) 100%);
  pointer-events:none;
}

/* =============================================================================
   Homepage clean-up pass: one type scale, one button size, one vertical rhythm.
   Colours, photos, Shanti's copy and the approved gold/purple finishes above
   are untouched; this only evens out size, spacing and alignment.
   ============================================================================= */
#landing {
  --t-body: clamp(1.0625rem, .25vw + 1rem, 1.1875rem);   /* 17px -> 19px */
  --t-small: 1rem;
  --measure: 62ch;
  --sec-pad: clamp(4.5rem, 9vw, 8rem);
  --btn-h: 54px;
}
#landing .section { padding-block: var(--sec-pad); }
#landing p { text-wrap: pretty; }
#landing h1, #landing h2, #landing h3 { text-wrap: balance; }
#landing .eyebrow { font-size: .78rem; letter-spacing: .2em; margin-bottom: 1.1rem; }
#landing .section-title { font-size: clamp(2.25rem, 4.6vw, 3.5rem); line-height: 1.08; margin-bottom: .75rem; }
#landing .lead { font-size: var(--t-body); line-height: 1.65; }
.lead.center { margin-inline: auto; }
/* Centred section labels read cleaner without the leading dash. */
.vision .eyebrow::before, .subscribe .eyebrow::before { display: none; }

/* Navigation: larger, calmer links that still fit ten items at 1251px. */
.nav { min-height: 76px; }
.nav-links a { font-size: clamp(.86rem, .4vw + .55rem, .95rem); }

/* Buttons: every call to action shares one height and type size. */
#landing .btn, .reader .btn {
  min-height: var(--btn-h, 54px);
  padding: 0 1.9rem;
  font-size: 1.15rem;
  justify-content: center;
}
#landing .btn:hover { transform: translateY(-2px); }
.btn-row { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 2.25rem; }
.btn-row--center { justify-content: center; }
#landing .hero__cta { gap: .9rem; margin-top: 2.25rem; }

/* Intro */
.intro__quote { line-height: 1.35; }
.intro__text {
  margin-top: 1.25rem;
  max-width: var(--measure);
  font-size: var(--t-body);
  line-height: 1.7;
  color: var(--ink-soft);
}
.intro__ask { margin: 1.5rem 0 2rem; }
/* The photo caption is a quiet line of italic, not a floating pill. */
.intro__badge {
  margin-top: 1.25rem;
  padding: 0;
  border: 0;
  background: none;
  font-style: italic;
  font-size: 1.2rem;
  font-weight: 500;
}

/* About */
.about__copy p, .about__p {
  max-width: var(--measure);
  font-size: var(--t-body);
  line-height: 1.75;
  color: var(--ink-soft);
  margin-bottom: 1.1rem;
}
.about__copy p:first-child { font-size: clamp(1.15rem, .4vw + 1.05rem, 1.3rem); color: var(--ink); }
.about__sub { font-size: clamp(1.6rem, 2.4vw, 2rem); margin: 2.75rem 0 .85rem; }
.about__pull {
  margin: 1.75rem 0;
  padding-left: 1.25rem;
  border-left: 2px solid var(--gold-500);
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1.5rem, 2.6vw, 1.95rem);
  line-height: 1.3;
  color: var(--gold-600);
}
.about__motto { margin-top: 1.75rem; font-size: 1.1rem; font-weight: 800; letter-spacing: .04em; color: var(--navy-800); }
.about__cta { display: block; margin-top: 3rem; padding-top: 2.5rem; border-top: 1px solid var(--line); }
.about__cta .about__sub { margin: 0 0 1.25rem; }
#landing .values { gap: 1.1rem; margin: 1.75rem 0 0; }
#landing .values li { font-size: var(--t-body); line-height: 1.6; max-width: var(--measure); }

/* The Community: centred story, features as an even grid of tiles. */
.community-intro { max-width: 900px; }
.community-intro .section-title { color: #fff; }
.community-intro__copy { max-width: 64ch; margin: 1.5rem auto 0; }
.community-intro__copy p { margin-bottom: 1.1rem; font-size: var(--t-body); line-height: 1.75; color: #d8e2f2; }
.features {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin: 2.5rem auto 0;
  text-align: left;
}
.features li {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1.15rem;
  border-radius: 16px;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  font-size: var(--t-small);
  font-weight: 600;
  line-height: 1.4;
  color: #e9eef6;
}
.features .tick {
  display: grid;
  place-items: center;
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(249, 229, 150, .14);
  color: var(--gold-400);
  font-size: .85rem;
}
.community-intro .btn-row { margin-top: 2.75rem; }

/* Articles */
.ray-divider { margin-bottom: 1.75rem; }
.blog-grid { gap: clamp(1.25rem, 2.5vw, 2rem); margin-top: 3rem; }
.blog-card .card__body { display: flex; flex-direction: column; flex: 1; padding: 1.6rem 1.6rem 1.8rem; }
.blog-card h3 { font-size: 1.55rem; line-height: 1.15; }
.blog-card p { flex: 1; font-size: var(--t-small); line-height: 1.65; }
.readmore { min-height: 44px; }

/* Webinars invite (shown when the section is switched on) */
.webinar-invite {
  max-width: 720px;
  margin: 2.5rem auto 0;
  padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 4vw, 3rem);
  text-align: center;
  background: rgba(255, 255, 255, .7);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}
.webinar-invite h3 { font-size: 1.75rem; margin-bottom: .75rem; }
.webinar-invite p { max-width: 52ch; margin: 0 auto 1.75rem; font-size: var(--t-body); color: var(--ink-soft); }

/* Subscribe */
.subform input { min-height: 52px; font-size: 1rem; }
.subnote { font-size: .9rem; }

/* Footer */
.footer p { font-size: 1rem; line-height: 1.7; }
.footer h4 { font-size: 1.35rem; }
.footer__links { gap: .85rem; }
.footer__links a { font-size: 1rem; }
.socials a { width: 44px; height: 44px; }
.footer__logo img { width: min(150px, 40vw); }
.footer__bottom { font-size: .9rem; }

@media (max-width: 860px) {
  .features { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  #landing { --btn-h: 52px; }
  .features { grid-template-columns: 1fr; }
  /* Full-width buttons are easier to hit with a thumb. */
  #landing .hero__cta .btn, #landing .btn-row .btn, .about__cta .btn { width: 100%; }
}

/* =============================================================================
   Institutional finish: the calm, ordered feel of an established organisation.
   The logo, the photos, the purple and the gold all stay exactly as they are;
   only the treatment is quieter (no pulsing glow, no chrome sheen) and the
   page gains structure: numbered sections, hairline rules, crisper corners.
   ============================================================================= */
#landing {
  --rule: rgba(16, 27, 48, .12);
  --rule-dark: rgba(255, 255, 255, .14);
  --r-card: 14px;
  --gold-ink: #7d5c00;           /* gold for small text: readable on cream */
  counter-reset: section;
}

/* Numbered section labels: "01 — About Us". Hidden sections are display:none,
   so the numbering always runs 01, 02, 03 with no gaps. */
#landing .section:not(.hero) .eyebrow { counter-increment: section; }
#landing .section .eyebrow::before {
  content: counter(section, decimal-leading-zero);
  display: inline-block;
  width: auto;
  height: auto;
  padding-right: .85rem;
  margin-right: .1rem;
  border-right: 1px solid currentColor;
  background: none;
  font-variant-numeric: tabular-nums;
  letter-spacing: .08em;
  opacity: .85;
}
#landing .eyebrow { color: var(--gold-ink); gap: .85rem; }
#landing .section--navy .eyebrow { color: var(--gold-400); }

/* Every section opens on a hairline, like the pages of an annual report. */
#landing .section + .section { box-shadow: inset 0 1px 0 var(--rule); }
#landing .section--navy + .section, #landing .section + .section--navy { box-shadow: none; }

/* Left-aligned section headers: title on the left, intro on the right. */
@media (min-width: 900px) {
  #blogs .center.reveal, #videos .center.reveal, #archived .center.reveal, #webinars .center.reveal {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas: "eyebrow eyebrow" "title lead";
    align-items: end;
    column-gap: 4rem;
    text-align: left;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--rule);
  }
  #landing #blogs .center .eyebrow, #landing #videos .center .eyebrow,
  #landing #archived .center .eyebrow, #landing #webinars .center .eyebrow { grid-area: eyebrow; justify-content: flex-start; }
  #blogs .center .section-title, #videos .center .section-title,
  #archived .center .section-title, #webinars .center .section-title { grid-area: title; margin: 0; }
  #blogs .center .lead, #videos .center .lead, #archived .center .lead, #webinars .center .lead { grid-area: lead; margin: 0; justify-self: start; }
  #blogs .ray-divider { display: none; }
}
#landing .section .center .eyebrow::before { display: inline-block; }

/* Calm finishes for the same purple and gold. */
#landing .btn--purple, #landing .nav-cta, .reader .btn--purple {
  animation: none !important;
  box-shadow: 0 1px 2px rgba(60, 10, 90, .25), 0 8px 20px rgba(139, 19, 214, .22) !important;
}
#landing .btn--purple:hover, #landing .nav-cta:hover, .reader .btn--purple:hover {
  box-shadow: 0 1px 2px rgba(60, 10, 90, .25), 0 12px 28px rgba(139, 19, 214, .32) !important;
}
#landing .btn:not(.btn--purple):not(.btn--ghost):not(.btn--outline),
.reader .btn:not(.btn--purple):not(.btn--ghost):not(.btn--outline) {
  background-image: linear-gradient(180deg, #F3D978 0%, #E2C979 45%, #D8A100 100%) !important;
  border: 1px solid rgba(150, 110, 0, .45) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 6px 16px rgba(160, 120, 0, .18) !important;
  text-shadow: none;
}
#landing .btn:not(.btn--purple):not(.btn--ghost):not(.btn--outline):hover,
.reader .btn:not(.btn--purple):not(.btn--ghost):not(.btn--outline):hover {
  background-image: linear-gradient(180deg, #F6DE80 0%, #E6CC6E 45%, #E0A900 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), 0 10px 22px rgba(160, 120, 0, .26) !important;
}
#landing .btn--outline { border-width: 1px; }

/* Crisper corners and quieter depth on cards and photo frames. */
#landing .card, #landing .video, #landing .webinar-invite { border-radius: var(--r-card); }
#landing .card { box-shadow: none; border: 1px solid var(--rule); }
#landing .card:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(16, 27, 48, .08); }
#landing .card:hover .card__media img { transform: scale(1.03); }
#landing .blog-card .meta { color: var(--gold-ink); }
#landing .blog-card .card__media::after { border-radius: 8px; width: 40px; height: 40px; font-size: 1.25rem; }
#landing .intro__art, #landing .about__media img { border-radius: 18px; }
#landing .founder { border-radius: 12px; }
/* Photos of people are never cropped: the family portrait (and any photo put
   in its place from the editor) always shows whole, at its own shape.
   The clouds get a natural colour grade instead of the heavy boost. */
#landing .about__media img { aspect-ratio: auto; height: auto; object-fit: contain; }
#landing .intro__art img { filter: saturate(1.15) contrast(1.05); }
#landing .intro__art:hover img { filter: saturate(1.22) contrast(1.06); }

/* Hero: the same photo as a calm, full-screen backdrop. A navy wash deepening
   toward the edges and bottom carries the headline, so the text no longer
   needs heavy shadows and the stage lights stay as atmosphere. */
#landing .hero--light { min-height: 100svh; }
#landing .hero--light::before {
  filter: brightness(1.08) contrast(1.04) saturate(1.05);
  background-position: center 35%;
}
#landing .hero--light::after {
  top: 0;
  height: auto;
  background:
    radial-gradient(120% 80% at 50% 38%, rgba(16, 27, 48, 0) 0%, rgba(16, 27, 48, .35) 70%, rgba(16, 27, 48, .6) 100%),
    linear-gradient(180deg, rgba(16, 27, 48, .45) 0%, rgba(16, 27, 48, .1) 30%, rgba(16, 27, 48, .25) 62%, rgba(16, 27, 48, .82) 100%);
}
#landing .hero--light h1 { text-shadow: 0 2px 24px rgba(0, 0, 0, .35); }
/* The logo and "Welcome home" are the centrepiece: the logo gets as much of the
   first screen as it can while the headline and buttons still fit below it. */
#landing .hero__logo { animation: none; width: min(320px, 66vw, 31svh); }
#landing .hero--light h1 { font-size: min(clamp(2.9rem, 7.5vw, 5rem), 8.4svh); line-height: 1.05; }
#landing .hero--light .hero__sub { margin-top: .2rem; }
#landing .hero--light .hero__cta { margin-top: 1.6rem; }
/* Keep the logo, headline and both buttons inside the first screen. */
#landing .hero--light .hero__inner { padding-top: calc(76px + 1svh); padding-bottom: calc(64px + 1svh); }
/* The full-screen hero makes the page obviously scrollable; the cue only crowded the buttons. */
#landing .scroll-cue { display: none; }

/* The Community: features as a ruled two-column list on navy. */
#landing .features { gap: 0 2.5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 760px; }
#landing .features li {
  padding: 1.1rem 0;
  border: 0;
  border-top: 1px solid var(--rule-dark);
  border-radius: 0;
  background: none;
  font-size: var(--t-body);
}

/* Subscribe: a calm form panel instead of a floating pill. */
#landing .subform { border-radius: 16px; box-shadow: 0 1px 2px rgba(16, 27, 48, .04); border: 1px solid var(--rule); }
#landing .subform input { border-radius: 10px; }

/* Header: a clean white bar once you scroll. */
.header.scrolled { background: rgba(255, 255, 255, .92); box-shadow: 0 1px 0 var(--rule, rgba(16, 27, 48, .12)); }

/* Footer: report-style column labels and a hairline legal line. */
.footer h4 {
  font-family: var(--font-body);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-400);
}
.footer__bottom { border-top: 1px solid rgba(255, 255, 255, .1); }

@media (max-width: 620px) {
  #landing .features { grid-template-columns: 1fr; }
}

/* =============================================================================
   Sections added in the visual editor. They reuse the homepage's own section,
   type and button styles; these rules only lay out what is new.
   ============================================================================= */
html.cms-loading #landing > section:not(.hero) { opacity: 0; }
#landing > section { transition: opacity .3s ease; }
.section-title em, .intro__badge strong, .intro__badge b { color: var(--gold-600); }
.section--navy .section-title em { color: var(--gold-400); }
.cms-text { max-width: 860px; }
.cms-text--center { text-align: center; }
.cms-text--center .lead, .cms-text--center .cms-body { margin-inline: auto; }
.cms-body { max-width: var(--measure, 62ch); margin-top: 1rem; }
.cms-body p { font-size: var(--t-body, 1.1rem); line-height: 1.75; color: var(--ink-soft); margin-bottom: 1.1rem; }
.section--navy .cms-body p { color: #d8e2f2; }
.cms-photo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.cms-photo--right .cms-img { order: 2; }
/* Photos added in the editor keep their own shape, so nobody is cut out.
   Only an empty spot uses a set shape, as a placeholder. */
.cms-img { position: relative; border-radius: 18px; overflow: hidden; background: linear-gradient(160deg, var(--sky-200), var(--gold-100)); }
.cms-img:not(:has(img)) { aspect-ratio: 4 / 5; }
.blog-card .cms-img { border-radius: 0; }
.blog-card .cms-img:not(:has(img)) { aspect-ratio: 16 / 10; }
.cms-img img { display: block; width: 100%; height: auto; }
.cms-img__empty { display: grid; place-items: center; height: 100%; min-height: 120px; color: var(--ink-soft); font-weight: 700; font-size: .95rem; }
.cms-quote .big-quote { margin-top: .5rem; }
.cms-quote__who { margin-top: 1.25rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; font-size: .8rem; color: var(--gold-400); }
.section--cream .cms-quote .big-quote, .section--sky .cms-quote .big-quote { color: var(--navy-800); }
.section--cream .cms-quote__who, .section--sky .cms-quote__who { color: var(--gold-ink, #7d5c00); }
.cms-video { max-width: 960px; }
.cms-video__frame { position: relative; margin-top: 2.5rem; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: var(--navy-900); }
.cms-video__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cms-video__frame .cms-img__empty { color: #c7d2e2; min-height: 100%; }
.cms-banner { max-width: 760px; }
.section--navy .cms-banner .lead { color: #c7d2e2; }
.cms-signup + .subnote { margin-top: 1rem; }
.cms-editpill {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 140;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: var(--navy-800);
  color: #fff;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 14px;
  box-shadow: 0 10px 28px rgba(16, 27, 48, .3);
  cursor: pointer;
}
.cms-editpill:hover { background: var(--navy-700); }
@media (max-width: 860px) {
  .cms-photo { grid-template-columns: minmax(0, 1fr); }
  .cms-photo--right .cms-img { order: 0; }
  .cms-img { max-width: 440px; width: 100%; margin-inline: auto; }
}

/* ---------- Animations used by the main site and community ---------- */
@keyframes sway{from{transform:translateX(-50%) rotate(-4deg)}to{transform:translateX(-50%) rotate(4deg)}}
@keyframes bob{50%{transform:translateX(-50%) translateY(6px)}}
@keyframes floaty{50%{transform:translateY(-8px)}}
@keyframes purpleGlow{0%,100%{ box-shadow:0 0 16px rgba(196,77,255,.55), 0 0 36px rgba(157,47,214,.35), 0 10px 24px rgba(108,1,166,.40); } 50% { box-shadow:0 0 30px rgba(214,110,255,.9), 0 0 66px rgba(196,77,255,.6), 0 12px 32px rgba(108,1,166,.5); }}
@keyframes goldShine{from{ background-position:0% center } to { background-position:230% center }}
@keyframes bubIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes viewIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* =============================================================================
   Pre-launch gate — the coming-soon / free-gift page shown inside app.html while
   "Pre-launch mode" is on. Mirrors index.html (same tokens as alfh.css), scoped
   under #plGate so none of it can leak into the main site.
   ============================================================================= */
html.pl-locked, html.pl-locked body { overflow:hidden !important; }
#plGate {
  --pl-navy:#16233d; --pl-navy-2:#22355a; --pl-gold:#c79b4b; --pl-gold-light:#e4c97e;
  --pl-ink:#233457; --pl-ink-strong:#1c2a49; --pl-soft:#bccbe6; --pl-label:#9fb0d0;
  --pl-muted:#8494b4; --pl-hint:#7d8bab; --pl-error:#ffbfae; --pl-on-gold:#241a06;
  --pl-line:rgba(228,201,126,.28); --pl-line-strong:rgba(228,201,126,.45);
  --pl-ease:cubic-bezier(.2,.7,.2,1);
  position:fixed; inset:0; z-index:100000; overflow:auto; overscroll-behavior:contain;
  display:grid; place-items:center;
  padding:max(2rem, env(safe-area-inset-top)) 1rem max(2.5rem, env(safe-area-inset-bottom));
  font-family:'Nunito Sans', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:1rem; line-height:1.6;
  color:var(--pl-navy); background:#e4c97e; -webkit-font-smoothing:antialiased;
}
#plGate[hidden] { display:none; }
#plGate [hidden] { display:none !important; }
#plGate .pl-sky {
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(120% 85% at 50% -10%, #f8eecd 0%, #e9d191 30%, #d5ad5c 62%, #c39433 100%);
}
#plGate .pl-beam {
  position:fixed; top:-30vh; left:50%; z-index:0; pointer-events:none;
  width:min(760px,120vw); height:120vh; transform:translateX(-50%);
  background:radial-gradient(50% 42% at 50% 18%, rgba(255,252,240,.60), transparent 70%);
  filter:blur(6px); animation:plBreathe 9s ease-in-out infinite;
}
@keyframes plBreathe { 0%,100% { opacity:.7; transform:translateX(-50%) scale(1) } 50% { opacity:1; transform:translateX(-50%) scale(1.05) } }
#plGate .pl-page {
  position:relative; z-index:1; width:100%; max-width:34rem;
  display:flex; flex-direction:column; align-items:center; text-align:center;
}
#plGate .pl-logo { width:clamp(132px,34vw,176px); height:auto; filter:drop-shadow(0 10px 24px rgba(70,48,8,.30)); }
#plGate .pl-eyebrow {
  margin-top:1.5rem; font-family:'Great Vibes', cursive; font-size:clamp(1.625rem, 1.3rem + 1.6vw, 2.125rem);
  line-height:1; color:var(--pl-navy);
}
#plGate h1 {
  margin-top:.75rem; max-width:19ch; font-family:'Cormorant Garamond', Georgia, serif; font-weight:600;
  font-size:clamp(2.25rem, 1.6rem + 3.4vw, 3.5rem); line-height:1.04; letter-spacing:-.015em;
  color:var(--pl-navy); text-wrap:balance;
}
#plGate .pl-lede { margin-top:1.25rem; max-width:44ch; font-size:1.0625rem; line-height:1.65; color:var(--pl-ink); text-wrap:pretty; }
#plGate .pl-card {
  position:relative; width:100%; margin-top:2.5rem; padding:2rem 1.5rem; text-align:left;
  border-radius:28px; background:linear-gradient(180deg,var(--pl-navy-2) 0%,var(--pl-navy) 100%);
  border:1px solid var(--pl-line); isolation:isolate; overflow:hidden;
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset, 0 30px 60px -20px rgba(70,48,8,.45), 0 12px 24px -12px rgba(70,48,8,.25);
}
#plGate .pl-card::before {
  content:""; position:absolute; inset:0 0 auto; height:140px; z-index:-1; pointer-events:none;
  background:radial-gradient(90% 100% at 50% 0%, rgba(228,201,126,.14), transparent 70%);
}
@media (min-width:480px) { #plGate .pl-card { padding:2.5rem 2rem; } }
#plGate .pl-tag { font-family:'Great Vibes', cursive; font-size:1.5rem; line-height:1; color:var(--pl-gold-light); }
#plGate .pl-gtitle { margin-top:.5rem; font-family:'Cormorant Garamond', Georgia, serif; font-weight:600; font-size:1.625rem; line-height:1.15; color:#fff; }
#plGate .pl-gdesc { margin-top:.75rem; color:var(--pl-soft); }
#plGate .pl-form { margin-top:1.5rem; display:grid; gap:1rem; }
#plGate .pl-row { display:grid; gap:1rem; }
@media (min-width:480px) { #plGate .pl-row { grid-template-columns:1fr 1.25fr; } }
#plGate .pl-field { display:grid; gap:.5rem; min-width:0; }
#plGate label { font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--pl-label); }
#plGate .pl-optional { font-weight:600; letter-spacing:0; text-transform:none; color:var(--pl-hint); }
#plGate input {
  width:100%; min-height:52px; padding:0 1rem; font:inherit; font-size:1rem; color:#fff;
  background:rgba(9,16,32,.55); border:1px solid var(--pl-line); border-radius:12px;
  transition:border-color .2s var(--pl-ease), box-shadow .2s var(--pl-ease);
}
#plGate input::placeholder { color:var(--pl-hint); }
#plGate input:hover { border-color:var(--pl-line-strong); }
#plGate input:focus-visible { outline:none; border-color:var(--pl-gold-light); box-shadow:0 0 0 4px rgba(228,201,126,.22); }
#plGate input[aria-invalid="true"] { border-color:var(--pl-error); box-shadow:0 0 0 4px rgba(255,191,174,.16); }
#plGate .pl-submit {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  width:100%; min-height:52px; padding:0 1.5rem; cursor:pointer; text-decoration:none;
  font:inherit; font-size:1.0625rem; font-weight:800; letter-spacing:.01em; color:var(--pl-on-gold);
  background:linear-gradient(180deg,var(--pl-gold-light),var(--pl-gold)); border:0; border-radius:999px;
  box-shadow:0 8px 20px -6px rgba(199,155,75,.55);
  transition:transform .2s var(--pl-ease), box-shadow .2s var(--pl-ease), filter .2s var(--pl-ease);
}
#plGate .pl-submit:hover { transform:translateY(-1px); box-shadow:0 12px 28px -6px rgba(199,155,75,.65); }
#plGate .pl-submit:active { transform:translateY(0) scale(.99); }
#plGate .pl-submit:focus-visible { outline:3px solid #fff; outline-offset:3px; }
#plGate .pl-submit[disabled] { cursor:progress; filter:saturate(.6) opacity(.85); transform:none; }
#plGate .pl-arrow { transition:transform .2s var(--pl-ease); }
#plGate .pl-submit:hover .pl-arrow { transform:translateX(3px); }
#plGate .pl-spinner { width:1em; height:1em; border-radius:50%; border:2px solid currentColor; border-right-color:transparent; animation:plSpin .8s linear infinite; }
@keyframes plSpin { to { transform:rotate(360deg) } }
#plGate .pl-fine { font-size:.875rem; color:var(--pl-muted); text-align:center; }
#plGate .pl-msg { font-size:.875rem; text-align:center; color:var(--pl-error); }
#plGate .pl-msg:empty { display:none; }
#plGate .pl-done { text-align:center; animation:plRise .5s var(--pl-ease) both; }
#plGate .pl-seal {
  width:56px; height:56px; margin:0 auto 1rem; display:grid; place-items:center; border-radius:50%;
  color:var(--pl-on-gold); background:radial-gradient(circle at 50% 35%,#f3dea0,var(--pl-gold)); box-shadow:0 0 0 6px rgba(228,201,126,.14);
}
#plGate .pl-done h2 { font-family:'Cormorant Garamond', Georgia, serif; font-weight:600; font-size:1.625rem; line-height:1.15; color:#fff; }
#plGate .pl-done h2:focus { outline:none; }
#plGate .pl-done p { margin:.75rem auto 0; max-width:34ch; color:var(--pl-soft); }
#plGate .pl-player { margin-top:1.5rem; padding:.75rem; border-radius:16px; background:rgba(9,16,32,.45); border:1px solid var(--pl-line); }
#plGate .pl-player audio { width:100%; display:block; }
#plGate .pl-dl { margin-top:1rem; }
#plGate .pl-unavailable { margin-top:1.5rem; font-size:.875rem; }
#plGate .pl-sig { margin-top:2.5rem; font-family:'Cormorant Garamond', Georgia, serif; font-style:italic; font-size:1.25rem; color:var(--pl-ink-strong); }
#plGate .pl-rise { animation:plRise .8s var(--pl-ease) both; }
#plGate .pl-rise-2 { animation-delay:.08s } #plGate .pl-rise-3 { animation-delay:.16s } #plGate .pl-rise-4 { animation-delay:.24s }
#plGate .pl-rise-5 { animation-delay:.34s } #plGate .pl-rise-6 { animation-delay:.44s }
@keyframes plRise { from { opacity:0; transform:translateY(12px) } to { opacity:1; transform:none } }
@media (prefers-reduced-motion:reduce) {
  #plGate *, #plGate *::before, #plGate *::after { animation:none !important; transition:none !important; }
}

/* =============================================================================
   Refinements (Phase 7 polish)
   ============================================================================= */
/* The `hidden` attribute must always win. Component rules such as .f{display:block}
   were overriding it, so the Sign in tab showed the "Full name" and "Short bio"
   fields that belong only to Join us. */
[hidden] {
  display:none !important;
}
/* "The Community" sits on navy: its feature list must be light, not navy-on-navy. */
.section--navy .values li {
  color:#d8e2f2;
}
