/* ====================================================================
   settr — Managed Service page styles
   Builds on hero.css / sections.css tokens. Page-specific layouts only.
   ==================================================================== */

/* ====================================================================
   HERO — managed service variant
   ==================================================================== */
.mgp-hero{
  padding: 88px 0 72px;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: 64px;
  align-items: start;
}
.mgp-hero > *{ min-width: 0; }

.mgp-hero .kicker{ padding-bottom: 28px; }

.mgp-hero .headline{
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(48px, 5.6vw, 78px);
  line-height: 0.98;
  letter-spacing: -0.025em;
  margin: 0 0 28px;
  color: var(--fg);
  text-wrap: balance;
}
.mgp-hero .headline .em{ font: inherit; color: inherit; }
.mgp-hero .subhead{
  font-size: 17px;
  line-height: 1.55;
  color: var(--muted);
  max-width: 56ch;
  margin: 0 0 32px;
}
.mgp-hero .subhead strong{ color: var(--fg); font-weight: 500; }

.mgp-hero-micro{
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px 0 26px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  margin-bottom: 32px;
  max-width: 560px;
}
.mgp-hero-micro .row{
  display: flex; align-items: baseline; gap: 14px;
  font-size: 13.5px; color: var(--muted);
}
.mgp-hero-micro .row .k{
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  width: 84px; flex: 0 0 84px;
}
.mgp-hero-micro .row strong{ color: var(--fg); font-weight: 500; }

/* Right side: pod card preview */
.mgp-hero-card{
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: var(--r-card);
  padding: 26px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  font-family: var(--font-sans);
  position: relative;
}
.mgp-hero-card::before{
  content:""; position:absolute; top:-1px; left: 26px; right: 26px;
  height: 2px; background: var(--fg);
}
.mghc-head{
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--font-mono); font-size: 11px;
  color: var(--muted); letter-spacing: 0.06em; text-transform: uppercase;
}
.mghc-head .name{ color: var(--fg); }
.mghc-headline{
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 22px;
  letter-spacing: -0.015em;
  line-height: 1.15;
  color: var(--fg);
  margin: 4px 0 0;
}
.mghc-headline .sub{
  display: block;
  font-size: 13px;
  color: var(--muted);
  letter-spacing: 0;
  margin-top: 6px;
  font-weight: 400;
}

.mghc-pod{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}
.mghc-role{
  background: var(--surface);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.mghc-role .role-k{
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.mghc-role .role-t{
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 14px;
  color: var(--fg);
  letter-spacing: -0.01em;
}
.mghc-role .role-c{
  font-size: 12px;
  color: var(--muted);
  line-height: 1.45;
}
.mghc-role .role-avatar{
  position: absolute;
  top: 14px; right: 16px;
  width: 22px; height: 22px;
  border-radius: 999px;
  background: var(--canvas-tint);
  border: 1px solid var(--line-strong);
  display: grid; place-items: center;
  font-family: var(--font-mono);
  font-size: 9.5px;
  color: var(--muted);
  letter-spacing: 0;
}
.mghc-role{ position: relative; }
.mghc-role.is-system{
  background:
    repeating-linear-gradient(
      135deg,
      rgba(0,0,0,0.022) 0 6px,
      transparent 6px 12px
    ),
    var(--surface);
}
.mghc-role.is-system .role-avatar{
  font-family: var(--font-mono);
  background: var(--fg);
  color: var(--bg);
  border-color: var(--fg);
  font-size: 11px;
}

.mghc-foot{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--muted);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding-top: 6px;
  border-top: 1px solid var(--line);
}
.mghc-foot .dot{
  width: 6px; height: 6px;
  background: var(--state-pos);
  border-radius: 999px;
  display: inline-block; margin-right: 8px;
  vertical-align: middle;
}

/* ====================================================================
   PROOF — light strip after hero (compact)
   ==================================================================== */
.mgp-proof{
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 32px 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position: relative;
}
.mgp-proof::before, .mgp-proof::after{
  content:""; position:absolute; top: 32px; bottom: 32px;
  width: 1px; background: var(--line);
}
.mgp-proof::before{ left: 25%; }
.mgp-proof::after { left: 50%; }
.mgp-proof .mp-item{ padding: 0 32px; }
.mgp-proof .mp-item:first-child{ padding-left: 0; }
.mgp-proof .mp-item:nth-child(3)::before{
  content:""; position:absolute; top:32px; bottom:32px; left: 75%; width:1px; background: var(--line);
}
.mp-k{
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 10px;
}
.mp-v{
  font-family: var(--font-display);
  font-weight: 300;
  font-size: 38px;
  letter-spacing: -0.025em;
  color: var(--fg);
  display: block;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.mp-d{
  display: block;
  font-size: 12.5px;
  color: var(--muted);
  margin-top: 8px;
  line-height: 1.4;
  max-width: 26ch;
}

/* ====================================================================
   WHAT WE OPERATE — six operating areas, editorial table
   ==================================================================== */
.s-ops .ops-head{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  align-items: end;
  margin-bottom: 56px;
}
.ops-head .left{
  display: flex; flex-direction: column; gap: 16px;
}
.ops-head .left .headline{
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(40px, 4.4vw, 60px);
  letter-spacing: -0.025em;
  line-height: 1.02;
  margin: 0;
  color: var(--fg);
}
.ops-head .left .headline .em{ font: inherit; color: inherit; }
.ops-head .right{
  display: flex; flex-direction: column; gap: 14px;
  padding-bottom: 6px;
}
.ops-head .right .lede{
  font-size: 15px;
  line-height: 1.55;
  color: var(--muted);
  max-width: 52ch;
  margin: 0;
}
.ops-head .right .lede strong{ color: var(--fg); font-weight: 500; }
.ops-head .right .meta{
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  display: inline-flex; gap: 10px; align-items: center;
}
.ops-head .right .meta::before{
  content:""; width: 18px; height: 1px; background: var(--ghost);
}

.ops-grid{
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}
.ops-cell{
  padding: 28px 28px 32px 0;
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  display: flex; flex-direction: column;
  gap: 12px;
  padding-left: 28px;
  position: relative;
}
.ops-cell:nth-child(3n){ border-right: 0; padding-right: 0; }
.ops-cell:nth-child(1),
.ops-cell:nth-child(2),
.ops-cell:nth-child(3){ padding-top: 32px; }
.ops-cell:nth-child(3n+1){ padding-left: 0; }
.ops-cell:nth-last-child(-n+3){ border-bottom: 0; }

.ops-num{
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.ops-title{
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 22px;
  letter-spacing: -0.015em;
  color: var(--fg);
  margin: 0;
  line-height: 1.15;
}
.ops-copy{
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
  max-width: 32ch;
}
.ops-copy strong{ color: var(--fg); font-weight: 500; }
.ops-deliv{
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
  display: flex; flex-direction: column; gap: 4px;
}
.ops-deliv .d-k{
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.ops-deliv .d-v{
  font-size: 12.5px;
  color: var(--fg-2);
  font-variant-numeric: tabular-nums;
}

/* ====================================================================
   POD — meet the team
   ==================================================================== */
.s-pod{
  background: var(--canvas-tint);
}
.s-pod .pod-head{
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 48px;
  align-items: end;
  margin-bottom: 56px;
}
.pod-head .headline{
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(40px, 4.4vw, 60px);
  letter-spacing: -0.025em;
  line-height: 1.02;
  margin: 0;
  color: var(--fg);
}
.pod-head .headline .em{ font: inherit; color: inherit; }
.pod-head .right{ display: flex; flex-direction: column; gap: 14px; padding-bottom: 6px; }
.pod-head .right .lede{
  font-size: 15px;
  line-height: 1.55;
  color: var(--muted);
  max-width: 52ch;
  margin: 0;
}

.pod-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  overflow: hidden;
}
.pod-card{
  padding: 26px 24px 28px;
  display: flex; flex-direction: column; gap: 14px;
  border-right: 1px solid var(--line);
  position: relative;
  min-width: 0;
}
.pod-card:last-child{ border-right: 0; }
.pod-card.lead::before{
  content:""; position:absolute; top:0; left:0; right:0;
  height: 2px; background: var(--fg);
}
.pod-card.system{
  background:
    repeating-linear-gradient(
      135deg,
      rgba(0,0,0,0.018) 0 8px,
      transparent 8px 16px
    ),
    var(--surface);
}
.pod-card.system .pod-mark .count{
  font-variant-numeric: tabular-nums;
  color: var(--fg);
}
.pod-mark{
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.pod-mark .num{ color: var(--fg-2); }
.pod-mark .count{
  background: var(--canvas-tint);
  border: 1px solid var(--line);
  padding: 2px 7px;
  border-radius: var(--r-badge);
  color: var(--muted);
}
.pod-name{
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 20px;
  letter-spacing: -0.015em;
  color: var(--fg);
  margin: 0;
  line-height: 1.15;
}
.pod-name .sub{
  display: block;
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: 12.5px;
  color: var(--muted);
  letter-spacing: 0;
  margin-top: 4px;
}
.pod-copy{
  font-size: 13px;
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
}
.pod-copy strong{ color: var(--fg); font-weight: 500; }
.pod-rules{
  list-style: none;
  padding: 0;
  margin: auto 0 0;
  display: flex; flex-direction: column; gap: 6px;
  border-top: 1px dashed var(--line);
  padding-top: 14px;
}
.pod-rules li{
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--muted);
  display: flex; gap: 10px; align-items: baseline;
  line-height: 1.4;
}
.pod-rules li::before{
  content:""; display:inline-block;
  width: 8px; height: 1px; background: var(--ghost);
  flex: 0 0 8px;
  transform: translateY(-3px);
}

.pod-meta{
  margin-top: 28px;
  display: flex; gap: 20px 36px; flex-wrap: wrap;
  align-items: baseline;
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--muted);
}
.pod-meta .k{
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-right: 10px;
}
.pod-meta strong{ color: var(--fg); font-weight: 500; }

.pod-shared{
  margin-top: 32px;
  border-top: 1px solid var(--line);
  padding-top: 22px;
  display: grid;
  grid-template-columns: minmax(0, 220px) 1fr;
  gap: 32px;
  align-items: start;
}
.pod-shared .ps-k{
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.pod-shared .ps-rows{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px 32px;
}
.pod-shared .ps-row{ display:flex; flex-direction: column; gap: 4px; }
.pod-shared .ps-row .t{
  font-family: var(--font-display); font-weight: 500;
  font-size: 14.5px; letter-spacing: -0.01em; color: var(--fg);
}
.pod-shared .ps-row .c{
  font-size: 12.5px; color: var(--muted); line-height: 1.5;
}

/* ====================================================================
   CADENCE — the operating week + ritual layer
   ==================================================================== */
.s-cadence .cad-head{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  margin-bottom: 56px;
  align-items: end;
}
.cad-head .headline{
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(40px, 4.4vw, 60px);
  letter-spacing: -0.025em;
  line-height: 1.02;
  margin: 0;
  color: var(--fg);
}
.cad-head .headline .em{ font: inherit; color: inherit; }
.cad-head .right{ display: flex; flex-direction: column; gap: 14px; padding-bottom: 6px; }
.cad-head .right .lede{ font-size: 15px; color: var(--muted); line-height: 1.55; max-width: 52ch; margin: 0; }

.cad-frame{
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  background: var(--surface);
  overflow: hidden;
}
.cad-frame-head{
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 16px 22px;
  border-bottom: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--muted);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--canvas-tint);
}
.cad-frame-head .l{ display: inline-flex; align-items: center; gap: 10px; color: var(--fg); }
.cad-frame-head .sq{ width: 8px; height: 8px; background: var(--state-pos); display: inline-block; border-radius: 1px; }

.cad-week{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}
.cad-day{
  padding: 22px 22px 26px;
  border-right: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 12px;
  min-width: 0;
}
.cad-day:last-child{ border-right: 0; }
.cad-day .day-head{
  display: flex; align-items: baseline; gap: 10px; justify-content: space-between;
}
.cad-day .day-name{
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 17px;
  letter-spacing: -0.015em;
  color: var(--fg);
}
.cad-day .day-num{
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.cad-day .day-title{
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 14px;
  color: var(--fg-2);
  letter-spacing: -0.01em;
  margin: 0;
}
.cad-tasks{
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 8px;
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.5;
  padding-top: 6px;
  border-top: 1px dashed var(--line);
}
.cad-tasks li{
  display: grid; grid-template-columns: 62px 1fr; gap: 10px;
  align-items: baseline;
}
.cad-tasks li .t{
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--faint);
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
}
.cad-tasks li .c{ min-width: 0; }
.cad-tasks li.flag .c{ color: var(--fg); }
.cad-tasks li.flag .t{ color: var(--state-pos); }

.cad-rituals{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: var(--canvas-tint);
  border-top: 1px solid var(--line);
}
.cad-rit{
  padding: 18px 22px 20px;
  border-right: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 8px;
  min-width: 0;
}
.cad-rit:last-child{ border-right: 0; }
.cad-rit .rit-k{
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.cad-rit .rit-t{
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 15px;
  letter-spacing: -0.015em;
  color: var(--fg);
}
.cad-rit .rit-c{
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.5;
  margin: 0;
}
.cad-rit .rit-c strong{ color: var(--fg); font-weight: 500; }
.cad-rit .rit-tag{
  margin-top: auto;
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--muted);
  display: inline-flex; align-items: center; gap: 8px;
  padding-top: 8px;
}
.cad-rit .rit-tag::before{ content:""; width: 8px; height: 1px; background: var(--ghost); }

/* ====================================================================
   TIERS — engagement comparison
   ==================================================================== */
.s-tiers{ background: #161614; color: #FAFAF8; }
.s-tiers .container{ position: relative; }
.s-tiers .tiers-head{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  margin-bottom: 56px;
  align-items: end;
}
.s-tiers .eyebrow .eb-num,
.s-tiers .eyebrow .eb-label,
.s-tiers .eyebrow .eb-arr{ color: rgba(250,250,248,0.62); }
.s-tiers .eyebrow .eb-num{ color: #FAFAF8; }
.s-tiers .headline{
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(40px, 4.4vw, 60px);
  letter-spacing: -0.025em;
  line-height: 1.02;
  margin: 0;
  color: #FAFAF8;
}
.s-tiers .headline .em{ font: inherit; color: inherit; }
.s-tiers .lede{
  font-size: 15px; line-height: 1.55;
  color: rgba(250,250,248,0.66);
  max-width: 52ch; margin: 0;
}
.s-tiers .lede strong{ color: #FAFAF8; font-weight: 500; }

.tier-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border: 1px solid rgba(250,250,248,0.10);
  border-radius: var(--r-card);
  overflow: hidden;
}
.tier-card{
  padding: 28px 28px 32px;
  border-right: 1px solid rgba(250,250,248,0.10);
  display: flex; flex-direction: column;
  gap: 18px;
  min-width: 0;
  position: relative;
}
.tier-card:last-child{ border-right: 0; }
.tier-card.feat{ background: rgba(250,250,248,0.04); }
.tier-card.feat::before{
  content: "typical path";
  position: absolute; top: 0; left: 28px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--state-pos);
  color: #FAFAF8;
  padding: 3px 9px;
  border-radius: 0 0 var(--r-badge) var(--r-badge);
}
.tier-name{
  font-family: var(--font-mono);
  font-size: 11px;
  color: rgba(250,250,248,0.62);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 8px;
}
.tier-name .id{
  background: rgba(250,250,248,0.08);
  color: #FAFAF8;
  padding: 2px 7px;
  border-radius: var(--r-badge);
  letter-spacing: 0.04em;
}
.tier-title{
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 32px;
  letter-spacing: -0.025em;
  margin: 0;
  color: #FAFAF8;
  line-height: 1.05;
}
.tier-model{
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  border-top: 1px solid rgba(250,250,248,0.10);
  border-bottom: 1px solid rgba(250,250,248,0.10);
  padding: 16px 0;
  margin: 0;
}
.tier-model .model-k{
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: rgba(250,250,248,0.5);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.tier-model .model-v{
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 30px;
  letter-spacing: -0.02em;
  color: #FAFAF8;
  line-height: 1.05;
  font-variant-numeric: tabular-nums;
}
.tier-model .model-unit{
  font-size: 12.5px;
  color: rgba(250,250,248,0.6);
  line-height: 1.4;
}

.engage-path{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin-bottom: 22px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(250,250,248,0.10);
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(250,250,248,0.5);
}
.engage-path .ep-step{
  color: rgba(250,250,248,0.72);
  padding: 4px 10px;
  border: 1px solid rgba(250,250,248,0.14);
  border-radius: var(--r-badge);
}
.engage-path .ep-step.hi{
  color: #FAFAF8;
  border-color: rgba(250,250,248,0.28);
  background: rgba(250,250,248,0.06);
}
.engage-path .ep-arr{ color: rgba(250,250,248,0.35); }
.engage-path .ep-note{
  text-transform: none;
  letter-spacing: 0.02em;
  font-family: var(--font-sans);
  font-size: 12px;
  color: rgba(250,250,248,0.55);
}

.engage-card .tier-cta{ display: none; }

.engage-pass{
  margin-top: 28px;
  border: 1px solid rgba(250,250,248,0.10);
  border-radius: var(--r-card);
  overflow: hidden;
}
.engage-pass-k{
  display: block;
  padding: 14px 24px;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(250,250,248,0.5);
  border-bottom: 1px solid rgba(250,250,248,0.08);
  background: rgba(250,250,248,0.03);
}

.engage-cta-row{
  margin-top: 32px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px 32px;
  padding-top: 28px;
  border-top: 1px solid rgba(250,250,248,0.10);
}
.engage-cta-copy{
  margin: 0;
  max-width: 42ch;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(250,250,248,0.66);
}
.tier-cta.primary{
  background: #FAFAF8;
  color: #161614;
  border-color: #FAFAF8;
}
.tier-cta.primary:hover{ background: rgba(250,250,248,0.86); }
.tier-blurb{
  font-size: 13.5px;
  color: rgba(250,250,248,0.72);
  line-height: 1.55;
  margin: 0;
}
.tier-blurb strong{ color: #FAFAF8; font-weight: 500; }

.tier-points{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tier-points li{
  position: relative;
  padding-left: 14px;
  font-size: 12.5px;
  color: rgba(250,250,248,0.78);
  line-height: 1.5;
}
.tier-points li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: var(--state-pos);
}

.commercial-aside{
  margin-top: 28px;
  border: 1px dashed rgba(250,250,248,0.14);
  border-radius: var(--r-card);
  overflow: hidden;
}
.engage-pass .ca-row:last-child{ border-bottom: 0; }
.ca-row{
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 20px;
  padding: 18px 24px;
  border-bottom: 1px solid rgba(250,250,248,0.08);
  align-items: baseline;
}
.ca-row:last-child{ border-bottom: 0; }
.ca-k{
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: rgba(250,250,248,0.5);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.ca-t{
  font-size: 13.5px;
  color: rgba(250,250,248,0.72);
  line-height: 1.55;
}

.tier-cta{
  margin-top: auto;
  display: inline-flex;
  align-items: center; gap: 10px;
  background: transparent;
  color: #FAFAF8;
  border: 1px solid rgba(250,250,248,0.24);
  padding: 10px 16px;
  border-radius: var(--r-btn);
  font-family: var(--font-sans);
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
  align-self: flex-start;
}
.tier-cta:hover{ border-color: #FAFAF8; background: rgba(250,250,248,0.06); }
.tier-card.feat .tier-cta{
  background: #FAFAF8; color: #161614; border-color: #FAFAF8;
}
.tier-card.feat .tier-cta:hover{ background: rgba(250,250,248,0.86); }

.tiers-foot{
  margin-top: 28px;
  display: flex; gap: 24px; align-items: baseline; flex-wrap: wrap;
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: rgba(250,250,248,0.5);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.tiers-foot .dot{ width: 6px; height: 6px; border-radius: 999px; background: var(--state-pos); display: inline-block; margin-right: 8px; vertical-align: middle; }
.tiers-foot strong{ color: #FAFAF8; font-weight: 500; }

/* ====================================================================
   ONBOARDING — 30 days to live (timeline)
   ==================================================================== */
.s-onboard .ob-head{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  align-items: end;
  margin-bottom: 56px;
}
.ob-head .headline{
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(40px, 4.4vw, 60px);
  letter-spacing: -0.025em;
  line-height: 1.02;
  margin: 0;
}
.ob-head .headline .em{ font: inherit; color: inherit; }
.ob-head .right{ display: flex; flex-direction: column; gap: 14px; padding-bottom: 6px; }
.ob-head .right .lede{ font-size: 15px; color: var(--muted); line-height: 1.55; max-width: 52ch; margin: 0; }

/* Timeline rail */
.ob-rail{
  position: relative;
  display: grid;
  grid-template-columns: 120px 1fr;
}
.ob-rail::before{
  content:""; position:absolute;
  left: 120px; top: 32px; bottom: 32px;
  width: 1px; background: var(--line-strong);
}
.ob-week{
  display: contents;
}
.ob-stamp{
  padding: 28px 28px 28px 0;
  border-top: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--faint);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: right;
  display: flex; flex-direction: column; gap: 6px; align-items: flex-end;
}
.ob-stamp .week{
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 22px;
  color: var(--fg);
  letter-spacing: -0.02em;
  text-transform: none;
}
.ob-stamp .day{ color: var(--muted); }

.ob-body{
  padding: 28px 0 28px 36px;
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 36px;
  position: relative;
}
.ob-body::before{
  content:"";
  position: absolute;
  /* sit exactly on the rail line at the left edge of this column */
  left: -6px; top: 34px;
  width: 11px; height: 11px;
  background: var(--bg);
  border: 1px solid var(--fg);
  border-radius: 999px;
  z-index: 1;
}
.ob-week:last-child .ob-body::before{
  background: var(--state-pos);
  border-color: var(--state-pos);
}
.ob-body .left{ display: flex; flex-direction: column; gap: 10px; }
.ob-body .right{ display: flex; flex-direction: column; gap: 10px; padding-top: 4px; }
.ob-title{
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 28px;
  letter-spacing: -0.02em;
  color: var(--fg);
  line-height: 1.1;
  margin: 0;
}
.ob-title .em{ font: inherit; color: inherit; }
.ob-copy{
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
  max-width: 48ch;
}
.ob-copy strong{ color: var(--fg); font-weight: 500; }

.ob-deliv{
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.ob-deliv li{
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 12px;
  font-size: 12.5px;
  color: var(--fg-2);
  line-height: 1.5;
  align-items: baseline;
}
.ob-deliv li .k{
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.ob-deliv li .v strong{ color: var(--fg); font-weight: 500; }

.ob-foot{
  margin-top: 4px;
  display: flex; gap: 18px 28px; flex-wrap: wrap;
  padding: 22px 0 0;
  border-top: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--muted);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.ob-foot strong{ color: var(--fg); font-weight: 500; }
.ob-foot .dot{ width:6px; height:6px; background: var(--state-pos); border-radius:999px; display:inline-block; margin-right:8px; vertical-align: middle; }

/* ====================================================================
   FAQ — editorial
   ==================================================================== */
.s-faq{ background: var(--canvas-tint); }
.s-faq .faq-head{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  margin-bottom: 48px;
  align-items: end;
}
.faq-head .headline{
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(40px, 4.4vw, 56px);
  letter-spacing: -0.025em;
  line-height: 1.02;
  margin: 0;
}
.faq-head .headline .em{ font: inherit; }
.faq-head .right{ display: flex; flex-direction: column; gap: 14px; padding-bottom: 4px; }
.faq-head .right .lede{ font-size: 14.5px; color: var(--muted); line-height: 1.55; max-width: 48ch; margin: 0; }

.faq-list{
  border-top: 1px solid var(--line);
}
.faq-item{
  display: grid;
  grid-template-columns: 56px minmax(0, 1.05fr) minmax(0, 1fr);
  gap: 36px;
  padding: 26px 0;
  border-bottom: 1px solid var(--line);
  align-items: start;
}
.faq-num{
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding-top: 4px;
}
.faq-q{
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 20px;
  letter-spacing: -0.012em;
  color: var(--fg);
  line-height: 1.25;
  margin: 0;
  max-width: 28ch;
}
.faq-a{
  font-size: 14px;
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
  max-width: 48ch;
}
.faq-a strong{ color: var(--fg); font-weight: 500; }

/* ====================================================================
   Smaller-screen adjustments
   ==================================================================== */
@media (max-width: 1180px){
  .ops-grid{ grid-template-columns: repeat(2, 1fr); }
  .ops-cell:nth-child(3n){ border-right: 1px solid var(--line); padding-right: 28px; }
  .ops-cell:nth-child(3n+1){ padding-left: 28px; }
  .ops-cell:nth-child(2n){ border-right: 0; padding-right: 0; }
  .ops-cell:nth-child(2n+1){ padding-left: 0; }
  .ops-cell:nth-last-child(-n+3){ border-bottom: 1px solid var(--line); }
  .ops-cell:nth-last-child(-n+2){ border-bottom: 0; }

  .pod-grid{ grid-template-columns: repeat(2, 1fr); }
  .pod-card:nth-child(2n){ border-right: 0; }
  .pod-card:nth-child(1), .pod-card:nth-child(2){ border-bottom: 1px solid var(--line); }

  .cad-week{ grid-template-columns: repeat(5, 1fr); }
}
@media (max-width: 900px){
  .mgp-hero{ grid-template-columns: 1fr; gap: 48px; }
  .s-ops .ops-head,
  .s-pod .pod-head,
  .s-cadence .cad-head,
  .s-tiers .tiers-head,
  .s-onboard .ob-head,
  .s-faq .faq-head{ grid-template-columns: 1fr; gap: 18px; align-items: start; }
  .ops-grid{ grid-template-columns: 1fr; }
  .ops-cell{ border-right: 0 !important; padding-right: 0 !important; padding-left: 0 !important; }
  .pod-grid{ grid-template-columns: 1fr; }
  .pod-card{ border-right: 0; border-bottom: 1px solid var(--line); }
  .pod-card:last-child{ border-bottom: 0; }
  .cad-week{ grid-template-columns: 1fr; }
  .cad-day{ border-right: 0; border-bottom: 1px solid var(--line); }
  .cad-rituals{ grid-template-columns: repeat(2, 1fr); }
  .tier-grid{ grid-template-columns: 1fr; }
  .tier-card{ border-right: 0; border-bottom: 1px solid rgba(250,250,248,0.10); }
  .tier-card:last-child{ border-bottom: 0; }
  .ca-row{ grid-template-columns: 1fr; gap: 8px; }
  .mgp-proof{ grid-template-columns: repeat(2, 1fr); gap: 24px 0; }
  .mgp-proof::before, .mgp-proof::after, .mgp-proof .mp-item:nth-child(3)::before{ display: none; }
  .mgp-proof .mp-item{ padding: 0 20px; }
  .ob-rail{ grid-template-columns: 1fr; }
  .ob-rail::before{ display:none; }
  .ob-stamp{ text-align: left; padding: 24px 0 8px; align-items: flex-start; border-top: 1px solid var(--line); }
  .ob-body{ padding: 0 0 24px; grid-template-columns: 1fr; gap: 14px; border-top: 0; }
  .ob-body::before{ display:none; }
  .faq-item{ grid-template-columns: 40px 1fr; gap: 16px; }
  .faq-item .faq-a{ grid-column: 1 / -1; padding-left: 56px; }
}
