
/* The Habitual Mind — page-mind. Sage, cream and charcoal, matching the range artwork. */
#page-mind{ background:#fff !important; font-family:'Nunito',system-ui,sans-serif;
  --mn-ink:#2E332C; --mn-navy:#243447; --mn-mute:#5E6659; --mn-faint:#8D948A;
  --mn-sage:#7E8F72; --mn-sage-d:#5F7355; --mn-soft:#EDF1E9; --mn-cream:#F8F6F0;
  --mn-line:rgba(46,51,44,.12); --mn-line2:rgba(46,51,44,.24); }
#page-mind *{ box-sizing:border-box; }
.mn-wrap{ max-width:1180px; margin:0 auto; padding:0 20px 90px; }

/* banner */
.mn-banner{ background:linear-gradient(135deg,#F8F6F0 0%,#EDF1E9 100%); border-bottom:1px solid var(--mn-line); }
.mn-banner-in{ max-width:1180px; margin:0 auto; padding:30px 20px 28px; display:grid;
  grid-template-columns:minmax(0,1fr) auto; gap:24px; align-items:center; }
.mn-eb{ font-size:.68rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; margin:0 0 8px;
  color:var(--mn-sage-d) !important; -webkit-text-fill-color:var(--mn-sage-d) !important; }
.mn-h1{ font-family:'Playfair Display',Georgia,serif; font-weight:400; font-size:clamp(1.9rem,4vw,2.8rem);
  line-height:1.05; margin:0 0 6px; letter-spacing:.02em;
  color:var(--mn-ink) !important; -webkit-text-fill-color:var(--mn-ink) !important; }
.mn-h1 b{ display:block; font-weight:700; letter-spacing:.14em; text-transform:uppercase; font-size:1.12em; }
.mn-tag{ font-size:.74rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; margin:0 0 14px;
  color:var(--mn-faint) !important; -webkit-text-fill-color:var(--mn-faint) !important; }
.mn-lede{ margin:0 0 18px; font-size:.98rem; line-height:1.7; max-width:58ch;
  color:var(--mn-mute) !important; -webkit-text-fill-color:var(--mn-mute) !important; }
.mn-acts{ display:flex; flex-wrap:wrap; gap:10px; }
.mn-btn{ cursor:pointer; font-family:inherit; font-size:.86rem; font-weight:800; border-radius:999px;
  padding:11px 20px; min-height:44px; border:1px solid var(--mn-line2); background:#fff;
  color:var(--mn-ink) !important; -webkit-text-fill-color:var(--mn-ink) !important; transition:.16s; }
.mn-btn:hover{ background:var(--mn-soft); border-color:var(--mn-sage); }
.mn-btn.is-primary{ background:var(--mn-sage-d); border-color:var(--mn-sage-d);
  color:#fff !important; -webkit-text-fill-color:#fff !important; }
.mn-btn.is-primary:hover{ background:#4F6146; }
.mn-btn.is-sm{ padding:8px 14px; font-size:.79rem; min-height:38px; }
.mn-btn:focus-visible,.mn-chip:focus-visible,.mn-face:focus-visible,.mn-tab:focus-visible{ outline:3px solid #CF9E3F; outline-offset:2px; }

/* sections */
.mn-sec{ margin-top:40px; }
.mn-h2{ font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:1.32rem; margin:0 0 4px;
  color:var(--mn-ink) !important; -webkit-text-fill-color:var(--mn-ink) !important; }
.mn-sub{ margin:0 0 16px; font-size:.9rem; line-height:1.65; max-width:76ch;
  color:var(--mn-mute) !important; -webkit-text-fill-color:var(--mn-mute) !important; }
.mn-card{ background:#fff; border:1px solid var(--mn-line); border-radius:22px; padding:22px; }
.mn-card.is-tint{ background:var(--mn-cream); }
.mn-card.is-sage{ background:var(--mn-soft); border-color:#D8E2D2; }
.mn-grid{ display:grid; gap:16px; }
.mn-g2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.mn-g3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.mn-g5{ grid-template-columns:repeat(5,minmax(0,1fr)); }

/* stat cards */
.mn-stat{ text-align:center; }
.mn-stat-k{ font-size:.64rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; margin:0 0 10px;
  color:var(--mn-sage-d) !important; -webkit-text-fill-color:var(--mn-sage-d) !important; }
.mn-stat-v{ font-size:2rem; font-weight:800; line-height:1;
  color:var(--mn-ink) !important; -webkit-text-fill-color:var(--mn-ink) !important; }
.mn-stat-d{ font-size:.82rem; margin:6px 0 0; color:var(--mn-mute) !important; -webkit-text-fill-color:var(--mn-mute) !important; }

/* focus checklist */
.mn-focus{ display:grid; gap:8px; }
.mn-focus-i{ display:flex; align-items:center; gap:11px; width:100%; text-align:left; cursor:pointer;
  font-family:inherit; font-size:.9rem; border:1px solid var(--mn-line); border-radius:14px; padding:11px 14px;
  background:#fff; min-height:46px; color:var(--mn-ink) !important; -webkit-text-fill-color:var(--mn-ink) !important; }
.mn-focus-i:hover{ background:var(--mn-soft); }
.mn-focus-i.is-done{ background:var(--mn-soft); border-color:#D8E2D2; }
.mn-focus-i.is-done .mn-focus-t{ text-decoration:line-through; color:var(--mn-faint) !important; -webkit-text-fill-color:var(--mn-faint) !important; }
.mn-tick{ flex:none; width:22px; height:22px; border-radius:50%; border:2px solid var(--mn-sage);
  display:grid; place-items:center; font-size:.72rem; color:#fff; }
.mn-focus-i.is-done .mn-tick{ background:var(--mn-sage-d); border-color:var(--mn-sage-d); }
.mn-focus-t{ flex:1; min-width:0; }

/* mood faces */
.mn-faces{ display:flex; flex-wrap:wrap; gap:10px; }
.mn-face{ cursor:pointer; font-family:inherit; border:1px solid var(--mn-line); background:#fff;
  border-radius:18px; padding:12px 10px; min-width:76px; flex:1 1 76px; text-align:center; transition:.15s; }
.mn-face:hover{ background:var(--mn-soft); border-color:var(--mn-sage); }
.mn-face.is-on{ background:var(--mn-sage-d); border-color:var(--mn-sage-d); }
.mn-face-e{ display:block; font-size:1.5rem; }
.mn-face-l{ display:block; margin-top:5px; font-size:.72rem; font-weight:700;
  color:var(--mn-mute) !important; -webkit-text-fill-color:var(--mn-mute) !important; }
.mn-face.is-on .mn-face-l{ color:#fff !important; -webkit-text-fill-color:#fff !important; }

/* practice rows */
.mn-row{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; border:1px solid var(--mn-line);
  border-radius:16px; padding:14px 16px; background:#fff; }
.mn-row + .mn-row{ margin-top:10px; }
.mn-row-ic{ flex:none; width:42px; height:42px; border-radius:13px; display:grid; place-items:center;
  background:var(--mn-soft); font-size:1.15rem; }
.mn-row-b{ flex:1 1 200px; min-width:0; }
.mn-row-t{ font-size:.95rem; font-weight:800; margin:0;
  color:var(--mn-ink) !important; -webkit-text-fill-color:var(--mn-ink) !important; }
.mn-row-d{ font-size:.83rem; line-height:1.55; margin:3px 0 0;
  color:var(--mn-mute) !important; -webkit-text-fill-color:var(--mn-mute) !important; }
.mn-pill{ display:inline-block; border-radius:999px; padding:3px 10px; font-size:.66rem; font-weight:800;
  letter-spacing:.07em; text-transform:uppercase; background:var(--mn-soft);
  color:var(--mn-sage-d) !important; -webkit-text-fill-color:var(--mn-sage-d) !important; }

/* breathing guide */
.mn-breathe{ display:grid; place-items:center; gap:16px; padding:10px 0 4px; }
.mn-orb{ width:190px; height:190px; border-radius:50%; display:grid; place-items:center;
  background:radial-gradient(circle at 50% 45%, #E8EFE3 0%, #D3E0CB 70%, #C2D3B9 100%);
  border:2px solid #C6D6BE; transition:transform 3.6s ease-in-out; }
.mn-orb.is-in{ transform:scale(1.22); }
.mn-orb.is-hold{ transform:scale(1.22); }
.mn-orb.is-out{ transform:scale(.86); }
.mn-orb-t{ font-size:1.02rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  color:var(--mn-sage-d) !important; -webkit-text-fill-color:var(--mn-sage-d) !important; }
.mn-orb-c{ font-size:2rem; font-weight:800; color:var(--mn-ink) !important; -webkit-text-fill-color:var(--mn-ink) !important; }

/* strip */
.mn-strip{ background:var(--mn-sage); border-radius:24px; padding:26px 22px; text-align:center; }
.mn-strip-h{ font-family:'Playfair Display',Georgia,serif; font-style:italic; font-size:1.5rem; margin:0 0 4px;
  color:#fff !important; -webkit-text-fill-color:#fff !important; }
.mn-strip-s{ font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; margin:0 0 20px;
  color:rgba(255,255,255,.86) !important; -webkit-text-fill-color:rgba(255,255,255,.86) !important; }
.mn-strip-g{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
.mn-strip-b{ cursor:pointer; font-family:inherit; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28);
  border-radius:16px; padding:14px 8px; min-height:84px; transition:.15s;
  color:#fff !important; -webkit-text-fill-color:#fff !important; }
.mn-strip-b:hover{ background:rgba(255,255,255,.24); }
.mn-strip-b:focus-visible{ outline:3px solid #fff; outline-offset:2px; }
.mn-strip-e{ display:block; font-size:1.35rem; }
.mn-strip-l{ display:block; margin-top:7px; font-size:.68rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }

/* chart */
.mn-chart{ display:flex; align-items:flex-end; gap:9px; height:120px; margin:10px 0; }
.mn-chart-c{ flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:6px; height:100%; }
.mn-chart-b{ width:100%; max-width:40px; border-radius:8px 8px 3px 3px; background:#D3E0CB; min-height:4px; }
.mn-chart-b.is-on{ background:var(--mn-sage-d); }
.mn-chart-x{ font-size:.66rem; font-weight:700; color:var(--mn-faint) !important; -webkit-text-fill-color:var(--mn-faint) !important; }

/* forms */
.mn-lbl{ display:block; font-size:.66rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:6px;
  color:var(--mn-sage-d) !important; -webkit-text-fill-color:var(--mn-sage-d) !important; }
.mn-in,.mn-ta,.mn-sel{ width:100%; border:1.5px solid var(--mn-line); border-radius:14px; padding:11px 14px;
  font-family:inherit; font-size:.92rem; background:var(--mn-cream); color:var(--mn-ink); min-height:44px; }
.mn-in:focus,.mn-ta:focus,.mn-sel:focus{ outline:none; border-color:var(--mn-sage); background:#fff; }
.mn-ta{ min-height:82px; resize:vertical; }
.mn-fld{ margin-bottom:14px; }
.mn-note{ font-size:.8rem; line-height:1.6; margin:12px 0 0;
  color:var(--mn-faint) !important; -webkit-text-fill-color:var(--mn-faint) !important; }
.mn-safety{ margin-top:14px; border:1px dashed var(--mn-sage); border-radius:14px; padding:13px 16px;
  background:var(--mn-soft); font-size:.83rem; line-height:1.6;
  color:var(--mn-ink) !important; -webkit-text-fill-color:var(--mn-ink) !important; }
.mn-empty{ font-size:.86rem; font-style:italic; color:var(--mn-faint) !important; -webkit-text-fill-color:var(--mn-faint) !important; }
.mn-quote{ font-family:'Playfair Display',Georgia,serif; font-size:1.3rem; line-height:1.5; margin:0;
  color:var(--mn-ink) !important; -webkit-text-fill-color:var(--mn-ink) !important; }

/* folds */
.mn-fold > summary{ cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.mn-fold > summary::-webkit-details-marker{ display:none; }
.mn-fold > summary::after{ content:"+"; font-size:1.25rem; font-weight:800; color:var(--mn-sage-d); }
.mn-fold[open] > summary::after{ content:"\2212"; }
.mn-fold[open] > summary{ margin-bottom:14px; }

@media (max-width:1024px){ .mn-g3,.mn-g5{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px){
  .mn-banner-in{ grid-template-columns:minmax(0,1fr); }
  .mn-g2,.mn-g3,.mn-g5{ grid-template-columns:minmax(0,1fr); }
  .mn-strip-g{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:420px){ .mn-strip-g{ grid-template-columns:minmax(0,1fr); } }
@media (prefers-reduced-motion:reduce){ #page-mind *{ transition:none !important; } }
