:root {
  --mission-ink: #1f251f;
  --mission-muted: #667067;
  --mission-cream: #f7f0e5;
  --mission-paper: #fffdf8;
  --mission-green: #355f49;
  --mission-green-dark: #294a3a;
  --mission-green-soft: #e6eee8;
  --mission-rust: #b8563a;
  --mission-gold: #d4aa55;
  --mission-gold-soft: #f4e7c6;
  --mission-line: #d8d1c4;
  --mission-shadow: 0 20px 55px rgba(40, 52, 43, .12);
}

html { scroll-padding-top: 94px; }
body.mission-home { background: var(--mission-cream); color: var(--mission-ink); }
.mission-home h1,
.mission-home h2,
.mission-home h3,
.mission-home p { text-wrap: pretty; }
.mission-home h1,
.mission-home h2 { letter-spacing: -.035em; }
.mission-home .container { width: min(1160px, calc(100% - 36px)); }
.mission-home .skip-link:focus { z-index: 1000; }

.mission-header {
  background: rgba(247, 240, 229, .96);
  border-bottom: 1px solid rgba(71, 79, 68, .14);
  backdrop-filter: blur(18px);
}
.mission-header .brand-script { color: var(--mission-ink); }
.mission-header .brand,
.mission-footer .brand { min-height: 44px; justify-content: center; }
.mission-header .brand-subtitle { color: var(--mission-green); font-size: .75rem; }
.mission-header .primary-nav a { color: #4b554e; }
.mission-header .primary-nav a:hover,
.mission-header .primary-nav a:focus-visible { color: var(--mission-rust); }
.mobile-nav-account { display: none; }

.mission-home .button { border-radius: 999px; font-weight: 800; }
.mission-home .button-primary {
  background: var(--mission-green);
  border-color: var(--mission-green);
  color: #fff;
}
.mission-home .button-primary:hover,
.mission-home .button-primary:focus-visible {
  background: var(--mission-green-dark);
  border-color: var(--mission-green-dark);
}
.mission-home .button-outline {
  background: transparent;
  border-color: var(--mission-green);
  color: var(--mission-green-dark);
}
.mission-home .button-outline:hover,
.mission-home .button-outline:focus-visible { background: var(--mission-green-soft); }
.button-large { min-height: 52px; padding-inline: 24px; }
.button-wide { width: 100%; text-align: center; justify-content: center; }
.text-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--mission-green-dark); font-weight: 800; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }

.mission-hero {
  position: relative;
  overflow: hidden;
  padding: 86px 0 82px;
  background:
    radial-gradient(circle at 88% 5%, rgba(212, 170, 85, .25), transparent 27%),
    radial-gradient(circle at 6% 94%, rgba(53, 95, 73, .12), transparent 28%),
    var(--mission-cream);
}
.mission-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(69, 75, 67, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(69, 75, 67, .045) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.6), transparent 78%);
}
.mission-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: .88fr 1.12fr; gap: 54px; align-items: center; }
.mission-hero-copy { max-width: 570px; }
.mission-home .eyebrow { color: var(--mission-rust); font-size: .75rem; font-weight: 900; letter-spacing: .13em; line-height: 1.45; }
.mission-home .eyebrow-dark { color: var(--mission-green-dark); }
.mission-hero h1 { margin: 16px 0 22px; font-size: clamp(3rem, 5.8vw, 5.5rem); line-height: .94; font-weight: 850; }
.mission-hero h1 span { color: var(--mission-rust); }
.mission-lede { margin: 0; max-width: 56ch; color: #4f5b53; font-size: clamp(1.04rem, 1.5vw, 1.2rem); line-height: 1.68; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 30px; }
.trust-row { display: flex; flex-wrap: wrap; gap: 9px 18px; margin-top: 30px; color: #59645b; font-size: .85rem; font-weight: 750; }
.trust-row span::before { content: "✓"; display: inline-grid; place-items: center; width: 20px; height: 20px; margin-right: 7px; border-radius: 50%; background: var(--mission-green-soft); color: var(--mission-green); font-size: .7rem; }

.mission-transform { display: grid; grid-template-columns: minmax(0,1fr) 26px minmax(0,1fr) 26px minmax(0,1fr); align-items: stretch; gap: 8px; }
.transform-stage {
  position: relative;
  min-width: 0;
  min-height: 365px;
  display: flex;
  flex-direction: column;
  padding: 22px 20px 20px;
  border: 1px solid rgba(44, 68, 55, .14);
  border-radius: 24px;
  background: rgba(255, 253, 248, .93);
  box-shadow: var(--mission-shadow);
}
.transform-stage > small { margin-top: auto; color: var(--mission-rust); font-size: .75rem; font-weight: 900; letter-spacing: .1em; }
.transform-stage > strong { display: block; margin-top: 8px; font-size: 1.07rem; line-height: 1.2; }
.transform-stage > span:last-child { display: block; margin-top: 8px; color: var(--mission-muted); font-size: .78rem; line-height: 1.45; }
.transform-number { position: absolute; top: 14px; right: 16px; margin: 0; color: rgba(53,95,73,.18); font-size: 2.2rem; font-weight: 950; line-height: 1; }
.transform-arrow { align-self: center; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--mission-gold); color: #3e341d; font-weight: 950; }
.transform-art { position: relative; height: 190px; margin: 18px 0 16px; }

.pantry-art { border: 3px solid var(--mission-green); border-radius: 12px 12px 6px 6px; background: linear-gradient(90deg, #e9dec9, #f9f1e4 46%, #e9dec9); overflow: hidden; }
.pantry-art::before,
.pantry-art::after { content: ""; position: absolute; bottom: -3px; width: 14px; height: 10px; background: var(--mission-green-dark); }
.pantry-art::before { left: 16px; }.pantry-art::after { right: 16px; }
.pantry-shelf { position: absolute; left: 8px; right: 8px; height: 5px; border-radius: 3px; background: var(--mission-green-dark); }
.shelf-one { top: 62px; }.shelf-two { top: 126px; }
.pantry-item { position: absolute; bottom: 66px; border: 2px solid rgba(41,74,58,.65); background: var(--mission-gold-soft); }
.jar { left: 14px; width: 31px; height: 44px; border-radius: 6px 6px 10px 10px; }
.jar::before { content: ""; position: absolute; left: 4px; right: 4px; top: -7px; height: 7px; border-radius: 3px 3px 0 0; background: var(--mission-rust); }
.can { left: 53px; width: 27px; height: 36px; border-radius: 5px; background: #b7c8b8; }
.box { right: 13px; width: 34px; height: 54px; background: #dca68c; }
.bowl { left: 24px; bottom: 13px; width: 53px; height: 27px; border-radius: 4px 4px 30px 30px; background: #c8d8cb; }
.bottle { right: 23px; bottom: 12px; width: 24px; height: 48px; border-radius: 7px 7px 5px 5px; background: #d9bf76; }
.bottle::before { content: ""; position: absolute; left: 6px; top: -12px; width: 9px; height: 12px; border-radius: 3px 3px 0 0; background: var(--mission-green-dark); }

.stage-capacity { background: var(--mission-green-dark); color: #fff; }
.stage-capacity > small { color: #f2cf80; }
.stage-capacity > span:last-child { color: #dbe5de; }
.stage-capacity .transform-number { color: rgba(255,255,255,.15); }
.capacity-dials { display: grid; grid-template-columns: 1fr; gap: 12px; margin: 38px 0 24px; }
.capacity-dials > span { display: grid; grid-template-columns: 58px 1fr; align-items: center; min-height: 48px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.17); border-radius: 14px; background: rgba(255,255,255,.08); }
.capacity-dials b { font-size: .96rem; }
.capacity-dials small { color: #dfe7e1; font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; }

.dinner-art { display: grid; place-items: center; }
.plate { position: absolute; width: 165px; height: 165px; border: 12px solid #e3e8df; border-radius: 50%; background: #fff; box-shadow: 0 10px 25px rgba(41,74,58,.12); }
.protein { position: absolute; width: 72px; height: 49px; transform: translate(-27px, -24px) rotate(-9deg); border-radius: 55% 45% 50% 45%; background: #c88155; box-shadow: inset -8px -7px 0 rgba(111,55,32,.12); }
.veg { position: absolute; width: 27px; height: 27px; border-radius: 45% 55% 48% 52%; background: #62854d; }
.veg-one { transform: translate(43px,-30px); }.veg-two { transform: translate(50px,2px) scale(.8); }
.veg::before,.veg::after { content:""; position:absolute; width:18px; height:18px; border-radius:50%; background:#789d5a; }
.veg::before { left:-9px; top:5px; }.veg::after { right:-9px; top:5px; }
.grain { position: absolute; width: 66px; height: 47px; transform: translate(-15px,49px); border-radius: 50%; background: repeating-radial-gradient(circle at 20% 30%, #efe4c6 0 3px, #fff6dd 4px 6px); }

.mission-section { padding: 84px 0; }
.mission-section-light { background: var(--mission-paper); }
.section-heading { margin-bottom: 40px; }
.section-heading.centered { text-align: center; margin-inline: auto; }
.narrow-heading { max-width: 760px; }
.section-heading h2 { margin: 11px 0 13px; font-size: clamp(2.2rem, 4.3vw, 4rem); line-height: 1; }
.section-heading > p:last-child { margin: 0; color: var(--mission-muted); font-size: 1.03rem; line-height: 1.65; }

.mission-proof-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.mission-proof-card { position: relative; padding: 28px 24px 30px; border-top: 4px solid var(--mission-green); border-radius: 0 0 17px 17px; background: #f6f3ec; }
.proof-mark { display: inline-block; margin-bottom: 28px; color: var(--mission-rust); font-size: .75rem; font-weight: 950; letter-spacing: .08em; }
.mission-proof-card h3 { margin: 0 0 12px; font-size: 1.25rem; line-height: 1.2; }
.mission-proof-card p { margin: 0; color: var(--mission-muted); font-size: .92rem; line-height: 1.6; }

.pathway-section { background: var(--mission-green-dark); color: #fff; }
.pathway-heading { max-width: 760px; }
.pathway-heading .eyebrow { color: #f1ca74; }
.pathway-heading h2 { margin: 11px 0 13px; font-size: clamp(2.35rem, 4.5vw, 4.2rem); line-height: 1; }
.pathway-heading > p:last-child { color: #dce6df; }
.pathway-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.pathway-card { min-height: 390px; display: flex; flex-direction: column; padding: 26px; border: 1px solid rgba(255,255,255,.16); border-radius: 22px; background: rgba(255,255,255,.07); }
.pathway-card:nth-child(even) { background: rgba(247,240,229,.1); }
.pathway-symbol { height: 88px; display: grid; place-items: center; margin-bottom: 23px; border-radius: 16px; background: rgba(255,255,255,.08); }
.pathway-kicker { margin: 0 0 11px; color: #f1ca74; font-size: .75rem; font-weight: 900; letter-spacing: .08em; }
.pathway-card h3 { margin: 0 0 12px; font-size: 1.35rem; line-height: 1.2; }
.pathway-card > p:not(.pathway-kicker) { margin: 0 0 20px; color: #dae5de; line-height: 1.55; font-size: .9rem; }
.pathway-card a { display: inline-flex; align-items: center; min-height: 44px; margin-top: auto; color: #fff1c5; font-size: .87rem; font-weight: 800; text-decoration: none; }
.pathway-card a:hover,.pathway-card a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.battery { position: relative; width: 62px; height: 32px; border: 3px solid #f4dd9e; border-radius: 6px; }
.battery::after { content:""; position:absolute; right:-8px; top:8px; width:5px; height:10px; border-radius:0 2px 2px 0; background:#f4dd9e; }
.battery i { position:absolute; left:4px; top:4px; bottom:4px; width:22%; border-radius:3px; background:#d17855; }
.mini-shelf { position: relative; width: 68px; height: 60px; border: 3px solid #f4dd9e; border-radius: 8px 8px 3px 3px; }
.mini-shelf::before,.mini-shelf::after { content:""; position:absolute; left:5px; right:5px; height:3px; background:#f4dd9e; }
.mini-shelf::before { top:20px; }.mini-shelf::after { top:40px; }
.steps-symbol { width: 70px; height: 56px; display: flex; align-items: flex-end; gap: 4px; }
.steps-symbol i { flex:1; border:2px solid #f4dd9e; border-bottom:0; background:rgba(244,221,158,.12); }
.steps-symbol i:nth-child(1){height:20px}.steps-symbol i:nth-child(2){height:36px}.steps-symbol i:nth-child(3){height:54px}
.mini-plate { position:relative; width:66px; height:66px; border:7px solid #f4dd9e; border-radius:50%; }
.mini-plate::before { content:""; position:absolute; width:25px; height:18px; left:8px; top:13px; border-radius:50%; background:#d17855; transform:rotate(-15deg); }
.mini-plate::after { content:""; position:absolute; width:18px; height:18px; right:8px; bottom:10px; border-radius:50%; background:#8ca071; }

.example-section { background: #ede5d6; }
.example-grid { display: grid; grid-template-columns: 1fr .78fr; gap: 58px; align-items: center; }
.example-copy h2 { margin: 12px 0 17px; max-width: 690px; font-size: clamp(2.3rem, 4.2vw, 4.1rem); line-height: 1; }
.example-copy > p:not(.eyebrow) { max-width: 62ch; color: var(--mission-muted); line-height: 1.65; }
.example-inputs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 25px; }
.example-inputs span { padding: 8px 12px; border: 1px solid #c9c0b0; border-radius: 999px; background: rgba(255,255,255,.55); font-size: .83rem; font-weight: 750; }
.example-constraint { margin-top: 17px; padding: 14px 16px; border-left: 4px solid var(--mission-rust); background: rgba(255,255,255,.52); color: #525d54; line-height: 1.5; }
.example-result { padding: 30px; border-radius: 25px; background: var(--mission-paper); box-shadow: var(--mission-shadow); }
.result-label { color: var(--mission-rust); font-size: .75rem; font-weight: 900; letter-spacing: .09em; }
.example-result h3 { margin: 20px 0 10px; font-size: 1.55rem; }
.example-result p { color: var(--mission-muted); line-height: 1.6; font-size: .92rem; }
.result-plate { position: relative; height: 230px; margin: 22px 0 5px; display: grid; place-items: center; border-radius: 18px; background: linear-gradient(145deg,#dde6dc,#f5ead7); overflow:hidden; }
.result-plate::before { content:""; position:absolute; width:190px; height:190px; border:13px solid #f0f0e9; border-radius:50%; background:#fff; box-shadow:0 10px 26px rgba(34,55,43,.12); }
.result-plate i { position:absolute; z-index:1; }
.rp-protein { width:88px; height:55px; transform:translate(-34px,-28px) rotate(-11deg); border-radius:50% 44% 52% 44%; background:#c57c50; }
.rp-veg { width:66px; height:54px; transform:translate(48px,-17px); border-radius:50%; background:radial-gradient(circle at 25% 35%,#86a16c 0 18%,transparent 19%),radial-gradient(circle at 57% 22%,#6e8d55 0 21%,transparent 22%),radial-gradient(circle at 71% 63%,#7d995e 0 24%,transparent 25%); }
.rp-rice { width:78px; height:57px; transform:translate(3px,51px); border-radius:50%; background:repeating-radial-gradient(circle at 10% 30%,#efe5c9 0 3px,#fff7e4 4px 7px); }

.pricing-section { background: var(--mission-paper); }
.pricing-section .section-heading h2 {
  color: var(--mission-ink);
}
.pricing-section .section-heading > p:last-child {
  color: #4f5b53;
}
.pricing-section .section-heading,
.pricing-section .section-heading h2 { color: var(--mission-ink); }
.pricing-section .section-heading > p:last-child { color: #59645b; }
.mission-pricing-grid { max-width: 830px; margin-inline: auto; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.mission-pricing-grid .price-card { display: flex; flex-direction: column; padding: 31px; border: 1px solid var(--mission-line); border-radius: 22px; background: #fff; box-shadow: 0 10px 32px rgba(40,52,43,.07); }
.mission-pricing-grid .price-card.featured { border: 2px solid var(--mission-green); background: #f1f5ef; }
.price-kicker { margin: 0 0 9px; color: var(--mission-rust); font-size: .75rem; font-weight: 900; letter-spacing: .1em; }
.mission-pricing-grid h3 { margin: 0; font-size: 2.55rem; line-height: 1; }
.mission-pricing-grid h3 small { color: var(--mission-muted); font-size: .9rem; font-weight: 650; }
.mission-pricing-grid .price-card > p:not(.price-kicker) { min-height: 50px; color: var(--mission-muted); line-height: 1.5; }
.mission-pricing-grid .button { margin-top: auto; }
.pricing-fine { max-width: 760px; margin: 20px auto 0; color: var(--mission-muted); font-size: .78rem; line-height: 1.5; text-align: center; }

.closing-section { padding: 65px 0; background: var(--mission-rust); color: #fff; }
.closing-grid { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; }
.closing-section .eyebrow { color: #f6ddb2; }
.closing-section h2 { margin: 10px 0 0; font-size: clamp(2.3rem,4vw,4rem); line-height: 1; }
.closing-actions { display: flex; flex-direction: column; gap: 14px; align-items: flex-end; }
.closing-section .button-primary { background:#fff8eb; border-color:#fff8eb; color:var(--mission-green-dark); }
.light-link { color:#fff9e8; }

.mission-footer { padding: 44px 0; background: #1f2e26; color: #dbe6de; }
.footer-grid { display: grid; grid-template-columns: 1fr auto auto; gap: 45px; align-items: end; }
.footer-brand { display: inline-flex; color: #fff; text-decoration: none; }
.mission-footer .brand-script { color: #fff; }
.mission-footer .brand-subtitle { color:#b9ccb9; font-size:.75rem; }
.mission-footer p { margin: 12px 0 0; max-width: 430px; color:#b9c8bf; font-size:.84rem; }
.mission-footer nav { display:flex; gap:20px; }
.mission-footer nav a { display:inline-flex; align-items:center; min-height:44px; color:#eef4ef; font-weight:750; text-decoration:none; }
.footer-copy { white-space: nowrap; }

@media (max-width: 1040px) {
  .mission-hero-grid { grid-template-columns: 1fr; }
  .mission-hero-copy { max-width: 760px; }
  .mission-transform { max-width: 900px; }
  .mission-proof-grid,.pathway-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pathway-card { min-height: 335px; }
}

@media (max-width: 820px) {
  .mission-header .header-actions { display: none; }
  .mobile-nav-account { display: block; }
  .mission-header .primary-nav { background: var(--mission-paper); }
  .mission-transform { grid-template-columns: 1fr; gap: 10px; }
  .transform-arrow { transform: rotate(90deg); margin: 1px auto; }
  .transform-stage { min-height: 285px; }
  .transform-art { height: 140px; max-width: 210px; width:100%; margin-inline:auto; }
  .capacity-dials { margin: 24px 0 20px; grid-template-columns: repeat(3,minmax(0,1fr)); }
  .capacity-dials > span { grid-template-columns:1fr; text-align:center; }
  .example-grid { grid-template-columns: 1fr; }
  .closing-grid { grid-template-columns:1fr; }
  .closing-actions { align-items:flex-start; }
  .footer-grid { grid-template-columns:1fr; gap:25px; align-items:start; }
}

@media (max-width: 620px) {
  .mission-home .container { width: min(100% - 28px, 1160px); }
  .mission-hero { padding: 58px 0 54px; }
  .mission-hero h1 { font-size: clamp(2.6rem,13vw,4.2rem); }
  .hero-actions { align-items:stretch; }
  .hero-actions .button,.hero-actions .text-link { width:100%; text-align:center; }
  .trust-row { display:grid; }
  .mission-section { padding: 62px 0; }
  .mission-proof-grid,.pathway-grid,.mission-pricing-grid { grid-template-columns:1fr; }
  .pathway-card { min-height:0; }
  .capacity-dials { grid-template-columns:1fr; }
  .capacity-dials > span { grid-template-columns:58px 1fr; text-align:left; }
  .example-result { padding:22px; }
  .result-plate { height:190px; }
  .result-plate::before { width:155px; height:155px; }
  .closing-actions,.closing-actions .button { width:100%; }
  .mission-footer nav { flex-wrap:wrap; }
}

@media (prefers-reduced-motion: reduce) {
  .mission-home *, .mission-home *::before, .mission-home *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}
