/* =========================================
   DIVINE MOONLIGHT — MISSION PAGE
   ========================================= */

.mission-page {
  --sage: #687563;
  --sage-dark: #4d594b;
  --burgundy: #6b3039;
  --gold: #b4975a;
  --gold-light: #d4bd82;
  --cream: #f7f4ed;
  --warm-white: #fcfbf8;
  --text: #2f302c;
  --muted: #73756d;
  background: var(--warm-white);
  color: var(--text);
  overflow: hidden;
}

.mission-hero {
  min-height: 82vh;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background:
    radial-gradient(circle at 50% 35%, rgba(180,151,90,.13), transparent 35%),
    linear-gradient(180deg,#f8f6f0 0%,#f3f1e9 100%);
  padding: 120px 24px 100px;
}
.mission-hero::before {
  content:"";
  position:absolute;
  inset:28px;
  border:1px solid rgba(180,151,90,.28);
  pointer-events:none;
}
.mission-hero-glow {
  position:absolute;
  width:480px;
  height:480px;
  border-radius:50%;
  background:rgba(180,151,90,.07);
  filter:blur(20px);
  pointer-events:none;
}
.mission-hero-content { position:relative; max-width:850px; z-index:2; }
.mission-eyebrow {
  display:inline-block;
  font-family:"Outfit",sans-serif;
  font-size:12px;
  font-weight:600;
  letter-spacing:4px;
  color:var(--burgundy);
  margin-bottom:28px;
}
.mission-hero h1 {
  margin:0;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(60px,7vw,96px);
  line-height:.9;
  font-weight:500;
  letter-spacing:-2px;
  color:var(--sage-dark);
}
.mission-hero h1 em { color:var(--burgundy); font-weight:400; }
.crown-divider {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin:34px auto 30px;
  width:min(400px,80%);
}
.crown-divider span { height:1px; flex:1; background:linear-gradient(90deg,transparent,rgba(180,151,90,.7)); }
.crown-divider span:last-child { background:linear-gradient(90deg,rgba(180,151,90,.7),transparent); }
.crown-symbol { font-family:Georgia,serif; font-size:30px; line-height:1; color:var(--gold); }
.mission-intro {
  max-width:720px;
  margin:0 auto;
  font-family:"Outfit",sans-serif;
  font-size:17px;
  line-height:1.8;
  color:var(--muted);
}
.scroll-indicator {
  position:absolute;
  bottom:34px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:9px;
}
.scroll-indicator span {
  font-family:"Outfit",sans-serif;
  font-size:9px;
  letter-spacing:3px;
  font-weight:600;
  color:#88877e;
}
.scroll-line { width:1px; height:34px; background:var(--gold); opacity:.65; }

.mission-content {
  max-width:1180px;
  margin:0 auto;
  padding:140px 60px 130px;
}
.mission-section-heading {
  display:grid;
  grid-template-columns:100px 1fr;
  gap:30px;
  margin-bottom:100px;
}
.section-number {
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:22px;
  color:var(--gold);
  padding-top:12px;
}
.small-heading {
  display:block;
  font-family:"Outfit",sans-serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:3px;
  color:var(--burgundy);
  margin-bottom:16px;
}
.mission-section-heading h2 {
  margin:0;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(52px,6vw,78px);
  line-height:.92;
  font-weight:500;
  color:var(--sage-dark);
  letter-spacing:-1px;
}
.mission-section-heading h2 em { color:var(--burgundy); font-weight:400; }
.mission-copy { max-width:930px; margin-left:auto; }
.mission-statement {
  display:grid;
  grid-template-columns:1fr 1.5fr;
  gap:70px;
  margin-bottom:90px;
}
.mission-statement p {
  margin:0;
  font-family:"Outfit",sans-serif;
  font-size:17px;
  line-height:1.9;
  color:var(--muted);
}
.mission-statement p:first-child {
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:36px;
  line-height:1.1;
  color:var(--sage-dark);
}
.mission-highlight {
  position:relative;
  background:var(--cream);
  padding:65px 75px 65px 100px;
  margin-bottom:100px;
  border-left:3px solid var(--gold);
}
.highlight-mark {
  position:absolute;
  left:36px;
  top:34px;
  font-family:Georgia,serif;
  font-size:70px;
  line-height:1;
  color:var(--gold);
  opacity:.6;
}
.mission-highlight p {
  position:relative;
  margin:0;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(28px,3vw,39px);
  line-height:1.3;
  color:var(--sage-dark);
}
.mission-professional {
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:80px;
  align-items:end;
  margin-bottom:110px;
}
.professional-heading h3 {
  margin:0;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(42px,4vw,58px);
  line-height:.98;
  font-weight:500;
  color:var(--sage-dark);
}
.professional-heading h3 em { color:var(--burgundy); font-weight:400; }
.mission-professional > p {
  margin:0;
  font-family:"Outfit",sans-serif;
  font-size:17px;
  line-height:1.9;
  color:var(--muted);
}
.mission-closing { padding-left:60px; margin-bottom:110px; }
.closing-line { width:50px; height:2px; background:var(--gold); margin-bottom:28px; }
.mission-closing p {
  max-width:750px;
  margin:0;
  font-family:"Outfit",sans-serif;
  font-size:17px;
  line-height:1.85;
  color:var(--muted);
}
.mission-closing .closing-lead {
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(34px,4vw,48px);
  line-height:1.1;
  color:var(--sage-dark);
  margin-bottom:18px;
}
.mission-closing strong { color:var(--burgundy); font-weight:500; }
.mission-final {
  position:relative;
  text-align:center;
  max-width:780px;
  margin:0 auto;
  padding-top:70px;
}
.mission-final::before {
  content:"";
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:80px;
  height:1px;
  background:var(--gold);
}
.final-crown {
  font-family:Georgia,serif;
  font-size:38px;
  color:var(--gold);
  margin-bottom:24px;
}
.mission-final p {
  margin:0;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(28px,3vw,39px);
  line-height:1.35;
  color:var(--sage-dark);
}
.mission-final span { color:var(--burgundy); }

.reveal {
  opacity:0;
  transform:translateY(28px);
  transition:opacity .8s ease,transform .8s ease;
}
.reveal.visible { opacity:1; transform:translateY(0); }

@media (max-width:800px) {
  .mission-hero { min-height:78vh; padding:100px 24px 90px; }
  .mission-hero::before { inset:16px; }
  .mission-hero h1 { font-size:clamp(50px,15vw,72px); letter-spacing:-1px; }
  .mission-intro { font-size:15px; line-height:1.7; }
  .mission-content { padding:90px 25px; }
  .mission-section-heading { grid-template-columns:1fr; gap:12px; margin-bottom:65px; }
  .section-number { padding:0; }
  .mission-copy { margin:0; }
  .mission-statement { grid-template-columns:1fr; gap:25px; margin-bottom:65px; }
  .mission-statement p:first-child { font-size:34px; }
  .mission-highlight { padding:50px 30px 50px 60px; margin-bottom:70px; }
  .highlight-mark { left:22px; top:27px; font-size:52px; }
  .mission-highlight p { font-size:28px; }
  .mission-professional { grid-template-columns:1fr; gap:28px; margin-bottom:80px; }
  .professional-heading h3 { font-size:42px; }
  .mission-closing { padding-left:25px; margin-bottom:80px; }
  .mission-closing .closing-lead { font-size:36px; }
  .mission-final p { font-size:29px; }
}
@media (prefers-reduced-motion:reduce) {
  .reveal { opacity:1; transform:none; transition:none; }
}