/* ===== EDIT: homepage — white background everywhere below the navy hero ===== */
.page:has(> #home-navy-hero-2026){background:#ffffff !important;}
#home-navy-hero-2026 ~ .hm-section,
#home-navy-hero-2026 ~ .hm-newsletter{background:#ffffff !important;}

/* preview tidy: hide JS-triggered popups & floating buttons that have no script here */
.toast,.hub-toast,.hv-toast,.fl-fab,.hvl-drawer-btn{display:none !important;}
body > div:has(> .pwa-banner-icon),
body > div:has(> .push-card){display:none !important;}

/* Food Friends character cards: a single tap opens the full-screen popup — these no longer flip */
.ff-card-wrap:has(.ff-front img):hover .ff-card,
.ff-card-wrap:has(.ff-front img).flipped .ff-card{transform:none !important;}

/* Heroes hosting the relocated voice button sit flush under the nav; the button floats top-right */
.hvl-hero-host{position:relative !important;}
.hvl-btn.hvl-in-hero{position:absolute !important;top:16px;right:20px;z-index:6;}
@media(max-width:640px){.hvl-btn.hvl-in-hero{top:12px;right:14px;}}

/* Match Home & Discover hero titles to the other pages: 2.8rem (44.8px) instead of 4rem (64px) */
.home-navy-copy-2026 h1,
.discover-copy-2026 h1{font-size:clamp(1.9rem,5vw,2.8rem) !important;line-height:1.12 !important;}

/* ===== Homepage hero: logo beside the title/tagline + floating tiles side by side ===== */
/* make the hero a single full-width column: top row (copy) then the tiles row */
.home-navy-inner-2026{grid-template-columns:1fr !important;gap:34px !important;}
/* copy row: text on the left, logo on the right */
.home-navy-copy-2026.home-copy-row{
  display:flex !important;align-items:center !important;justify-content:space-between !important;
  gap:40px !important;flex-wrap:wrap !important;text-align:left !important;
}
.home-hero-textcol{flex:1 1 420px;min-width:300px;}
.home-hero-logo{
  flex:0 0 auto;width:clamp(180px,26vw,300px);height:auto;display:block;
  background:none !important;background-image:none !important;background-color:transparent !important;
  border:none !important;box-shadow:none !important;border-radius:0 !important;padding:0 !important;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,0.28));
}
/* logo + a serif "U" continuing the wordmark so it reads "habituallyU" */
.home-hero-logowrap{position:relative;flex:0 0 auto;width:clamp(180px,26vw,300px);line-height:0;
  background:none !important;background-image:none !important;background-color:transparent !important;
  border:none !important;box-shadow:none !important;border-radius:0 !important;padding:0 !important;}
.home-hero-logowrap .home-hero-logo{
  width:100%;background:none !important;background-image:none !important;background-color:transparent !important;
}
.home-hero-logo-u{
  position:absolute;right:-0.10em;bottom:12.5%;      /* baseline ≈ word baseline (89% of logo) */
  font-family:Georgia,'Times New Roman',serif;font-weight:400;
  font-size:clamp(38px,5.3vw,62px);                  /* ≈ wordmark x/cap height */
  line-height:1;color:#eef3ec;
  background:none !important;background-image:none !important;background-color:transparent !important;
  border:none !important;box-shadow:none !important;border-radius:0 !important;padding:0 !important;
  -webkit-text-fill-color:#eef3ec !important;
  text-shadow:0 1px 2px rgba(0,0,0,0.25);
  pointer-events:none;
}
/* floating tiles: side by side in a responsive row instead of staggered/stacked */
.home-navy-tiles-2026{
  position:static !important;height:auto !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr)) !important;
  gap:14px !important;flex-direction:row !important;
}
.home-navy-tile-2026,
.home-navy-tile-2026.tile-1,.home-navy-tile-2026.tile-2,.home-navy-tile-2026.tile-3,
.home-navy-tile-2026.tile-4,.home-navy-tile-2026.tile-5{
  position:static !important;inset:auto !important;top:auto !important;left:auto !important;right:auto !important;
  width:auto !important;max-width:none !important;min-width:0 !important;margin:0 !important;
}
@media(max-width:760px){
  .home-navy-copy-2026.home-copy-row{justify-content:center;text-align:center;}
  .home-hero-logo{width:clamp(150px,40vw,220px);}
}
/* ensure the hero copy text stays white on the navy hero (heading/eyebrow/paragraph) */
#home-navy-hero-2026 .home-hero-textcol{background:transparent !important;background-image:none !important;}
#home-navy-hero-2026 .home-hero-textcol h1,
#home-navy-hero-2026 .home-navy-copy-2026 h1,
#home-navy-hero-2026 .home-navy-eyebrow-2026{
  color:#ffffff !important;-webkit-text-fill-color:#ffffff !important;
}
#home-navy-hero-2026 .home-hero-textcol p{
  color:rgba(255,255,255,0.78) !important;-webkit-text-fill-color:rgba(255,255,255,0.78) !important;
}
/* the primary "Explore" button has a white fill — keep its label dark/navy; the secondary
   "See My Rhythm" button is translucent on navy, so its label stays white */
#home-navy-hero-2026 .home-navy-actions-2026 > :first-child,
#home-navy-hero-2026 .home-navy-actions-2026 > :first-child *{
  color:#1e2d3d !important;-webkit-text-fill-color:#1e2d3d !important;
}
#home-navy-hero-2026 .home-navy-actions-2026 > :nth-child(2),
#home-navy-hero-2026 .home-navy-actions-2026 > :nth-child(2) *{
  color:#ffffff !important;-webkit-text-fill-color:#ffffff !important;
}

/* Discover: uniform white background across all content sections + wave dividers.
   Kept as-is: the navy hero and the recipe modal backdrop. */
#page-discover{background:#ffffff !important;}
#page-discover > section:not(#discover-navy-hero-2026),
#page-discover > div:not(#rcOverlay){background-color:#ffffff !important;background-image:none !important;}
/* wave dividers: their inline SVG paths carry the old section colors (incl. dark green #0f2f1d),
   which now render as stray strips on white — force every wave path white */
#page-discover .dsc-wave svg path{fill:#ffffff !important;}

/* Kitchen Academy block: converted from dark green to white.
   Recolor its cream/white text to navy for readability; keep the gradient CTA button light;
   give the existing rounded cards a slightly stronger shadow so they stand out on white. */
#page-discover .kitchen-brain-academy::before,
#page-discover #kitchen-academy::before{background:none !important;opacity:0 !important;}
#page-discover .kitchen-brain-academy, #page-discover .kitchen-brain-academy *,
#page-discover #kitchen-academy, #page-discover #kitchen-academy *{color:#243447 !important;}
#page-discover .academy-primary-btn, #page-discover .academy-primary-btn *{color:#ffffff !important;}
/* Little Chef Food Explorer: title sits on a navy panel, so keep it white (subtitle already is) */
#page-discover #dscExplorer .ce-title{color:#ffffff !important;}

/* My Kitchen › My Recipes: white background panel */
#page-dashboard #mkp-recipes{
  background:#ffffff !important;
  border-radius:20px !important;
  box-shadow:0 6px 22px rgba(36,52,71,0.08) !important;
  padding:24px !important;
  margin:0 auto 32px !important;
  max-width:1120px !important;
}

/* My Kitchen › Yellow Ticket: whole view on white, navy text, no second navy section, title pulled up */
#page-dashboard #mkp-yellow{background:#ffffff !important;}
/* kill the generic navy-hero override so the yt-hero is no longer a navy block; make it plain white and close the gap */
#page-dashboard #mkp-yellow .yt-hero{
  background:#ffffff !important;
  border-bottom:none !important;
  padding:8px 0 12px !important;   /* pulled up tight under the page hero */
}
#page-dashboard #mkp-yellow .yt-hero::before,
#page-dashboard #mkp-yellow .yt-hero::after{display:none !important;}
/* all text navy */
#page-dashboard #mkp-yellow,
#page-dashboard #mkp-yellow *{color:#243447 !important;}
#page-dashboard #mkp-yellow .yt-hero p,
#page-dashboard #mkp-yellow .yt-hero .yt-stat-l{color:#5b6470 !important;}  /* secondary text a touch softer */
/* keep the gold gradient on the "Shopping" emphasis word */
#page-dashboard #mkp-yellow .yt-hero h1 em{
  background:linear-gradient(135deg,#d4a82a,#b8861f) !important;
  -webkit-background-clip:text !important;background-clip:text !important;
  -webkit-text-fill-color:transparent !important;color:transparent !important;
}
/* whole Yellow Ticket page white: whiten the kitchen shell while this pane is showing */
#page-dashboard:has(#mkp-yellow[style*="block"]),
#page-dashboard:has(#mkp-yellow[style*="block"]) .mk-wrap{background:#ffffff !important;}
/* title sits in a white rounded card matching the "What did you find on special?" (.yt-card) box */
#page-dashboard #mkp-yellow .yt-hero{
  background:transparent !important;border-radius:0 !important;padding:20px 16px 8px !important;
}
#page-dashboard #mkp-yellow .yt-hero-inner{
  background:#ffffff !important;
  border:1px solid rgba(36,52,71,0.06) !important;
  border-radius:22px !important;
  box-shadow:0 4px 20px rgba(36,52,71,0.06) !important;
  padding:28px 24px !important;
  max-width:800px !important;margin:0 auto !important;
}
/* centre the stat blocks (4-6, $2.40, 0 kg) on a flat white background (remove the gradient strip) */
#page-dashboard #mkp-yellow .yt-hero-stats{
  justify-content:center !important;
  background:transparent !important;background-image:none !important;
  border:none !important;border-radius:0 !important;padding:0 !important;box-shadow:none !important;
}

/* ===== Smart Kitchen: three vertical rounded boxes matching the site theme ===== */
#mkp-smart .sk-wrap{
  display:flex !important;flex-direction:column !important;gap:20px !important;
  max-width:1120px !important;margin:0 auto !important;padding:20px 16px 32px !important;
}
#mkp-smart .sk-panel{
  background:#ffffff !important;
  border:1px solid rgba(36,52,71,0.07) !important;
  border-radius:22px !important;
  box-shadow:0 6px 22px rgba(36,52,71,0.08) !important;
  padding:22px !important;
  width:auto !important;max-width:none !important;
}
/* mood filter pills + planner goal pills → navy with white text */
#mkp-smart .sk-pill,
#mkp-smart .sk-goal{
  background:#243447 !important;
  color:#ffffff !important;
  border:1px solid #243447 !important;
}
#mkp-smart .sk-pill.on,
#mkp-smart .sk-goal.on{
  background:#1a2332 !important;color:#ffffff !important;border-color:#1a2332 !important;
  box-shadow:0 0 0 2px rgba(36,52,71,0.18) !important;
}
/* the mood-pills strip had a pink background box — make it sit flat on the white card */
#mkp-smart .sk-mood-pills{background:transparent !important;padding:4px 0 !important;}

/* Food & Mood Log + Voice Log: Back button moved into the navy hero (top-left), restyled for dark bg */
#page-scan .hu-page-hero,
#page-voice .hu-page-hero{position:relative !important;}
#page-scan .hu-hero-back,
#page-voice .hu-hero-back{
  position:absolute !important;top:16px;left:20px;z-index:6;
  background:rgba(255,255,255,0.12) !important;
  border:1.5px solid rgba(255,255,255,0.35) !important;
  color:#ffffff !important;
}
@media(max-width:640px){#page-scan .hu-hero-back,#page-voice .hu-hero-back{top:12px;left:14px;}}
/* Food & Mood Log section header: navy band, white text (beat any heading-color rules) */
#page-voice .fmvl-section-head h2{color:#ffffff !important;}
#page-voice .fmvl-section-head > div{color:rgba(255,255,255,0.7) !important;}

/* ===== "How HabituallyU Works" — put the 5 feature items in a rounded box ===== */
.hm-steps-box{
  background:#ffffff !important;
  border:1px solid rgba(36,52,71,0.07) !important;
  border-radius:24px !important;
  box-shadow:0 10px 34px rgba(36,52,71,0.08) !important;
  padding:34px 28px !important;
  margin:26px auto 0 !important;
  max-width:1120px !important;
}
@media(max-width:760px){.hm-steps-box{padding:24px 16px !important;border-radius:20px !important;}}

/* ===== Discover hero: match the homepage — copy on top, tile cards side by side underneath ===== */
.discover-navy-inner-2026{grid-template-columns:1fr !important;gap:30px !important;text-align:left !important;}
/* cards laid out side by side in a responsive row (not staggered/stacked) */
.discover-cards-2026{
  position:static !important;height:auto !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr)) !important;
  gap:14px !important;flex-direction:row !important;
}
.discover-card-2026,
.discover-card-2026.card-1,.discover-card-2026.card-2,.discover-card-2026.card-3,
.discover-card-2026.card-4,.discover-card-2026.card-5{
  position:static !important;inset:auto !important;top:auto !important;left:auto !important;right:auto !important;
  width:auto !important;max-width:none !important;min-width:0 !important;margin:0 !important;
}
@media(max-width:760px){
  .discover-navy-inner-2026{text-align:center !important;}
}

/* ===== Food Feels hero: match homepage/Discover — copy on top, cards side by side underneath ===== */
.ff-navy-inner-2026{grid-template-columns:1fr !important;gap:30px !important;text-align:left !important;}
.ff-cards-2026{
  position:static !important;height:auto !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr)) !important;
  gap:14px !important;flex-direction:row !important;
}
.ff-card-2026,
.ff-card-2026.card-1,.ff-card-2026.card-2,.ff-card-2026.card-3,
.ff-card-2026.card-4,.ff-card-2026.card-5{
  position:static !important;inset:auto !important;top:auto !important;left:auto !important;right:auto !important;
  width:auto !important;max-width:none !important;min-width:0 !important;margin:0 !important;
}
@media(max-width:760px){
  .ff-navy-inner-2026{text-align:center !important;}
}

/* ===== Discover: Little Chef Food Explorer — sage feature pill + flat search box ===== */
#page-discover .ce-badge{
  background:rgba(143,175,138,0.22) !important;
  color:#ffffff !important;
  border:1px solid rgba(143,175,138,0.55) !important;
}
#page-discover .ce-badge *{color:#ffffff !important;}
/* search/explore box: keep one flat pill and remove the inner filled "Explore" pill button */
#page-discover .ce-search-btn{
  background:transparent !important;
  color:var(--ce-sage-dk,#3a6635) !important;
  border:none !important;border-radius:0 !important;
  box-shadow:none !important;padding:11px 18px !important;font-weight:700 !important;
}
#page-discover .ce-search-btn:hover{ background:transparent !important; transform:none !important; opacity:0.7; }
#page-discover .ce-search-wrap{
  box-shadow:none !important;
  border:1.5px solid rgba(36,52,71,0.16) !important;
}
/* Find Recipes box: CTA + option hovers */
#dscSearchRecipes .dsc-search-cta:hover{ filter:brightness(1.06); transform:translateY(-1px); }
#dscSearchRecipes .dsc-opt{ transition:background .15s, border-color .15s; }
#dscSearchRecipes .dsc-opt:hover{ background:rgba(143,175,138,0.12) !important; border-color:rgba(143,175,138,0.5) !important; }
/* My Recipes: rounded CTA option boxes (match Discover) */
#mkp-recipes .mk-add-grid-opts{display:flex !important;flex-wrap:wrap;justify-content:center;gap:14px;}
#mkp-recipes .mk-opt{transition:background .15s, border-color .15s;}
#mkp-recipes .mk-opt:hover{background:rgba(143,175,138,0.12) !important;border-color:rgba(143,175,138,0.5) !important;}

/* ===== Mood Places: "You scan. We connect." flow in one rounded white box ===== */
/* whole section sits on the same soft sage background as the "Personalised for you" section */
#page-places .mp2-scan-section{
  background:linear-gradient(135deg, rgb(221,229,216), rgb(232,240,245)) !important;
  padding:52px 0 !important;
}
#page-places .mp2-flow-card{
  background:#ffffff;
  border:1px solid rgba(36,52,71,0.07);
  border-radius:24px;
  box-shadow:0 8px 26px rgba(36,52,71,0.08);
  padding:30px 24px;
  max-width:1000px;
  margin:8px auto 0;
}
#page-places .mp2-flow-card .mp2-user-flow{
  display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:6px;margin:0 auto;max-width:none !important;
}
/* each step a fixed-ish column; arrows align with the icon row (not the labels) */
#page-places .mp2-flow-card .mp2-flow-step{flex:0 1 150px;min-width:120px;padding:8px 6px;}
#page-places .mp2-flow-card .mp2-flow-arrow{
  display:flex !important;align-items:center;justify-content:center;
  margin-top:34px !important;padding:0 2px;color:var(--char);font-size:1.2rem;flex:0 0 auto;
}
#page-places .mp2-flow-instagram .mp2-flow-label{color:var(--char);font-weight:700;}
#page-places .mp2-flow-instagram .mp2-flow-icon{color:#fff;}
@media(max-width:600px){
  #page-places .mp2-flow-card .mp2-flow-arrow{display:none !important;}
  #page-places .mp2-flow-card .mp2-user-flow{gap:14px;}
  #page-places .mp2-flow-card .mp2-flow-step{flex:1 1 40%;}
}

/* ===== "Shared Wellness, Your Way" — 3 statements in rounded sage boxes, white text ===== */
#page-home .hm-testi-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr)) !important;
  gap:18px !important;max-width:1120px !important;margin:6px auto 0 !important;align-items:stretch !important;
}
#page-home .hm-testi-card{
  background:#7d9e77 !important;          /* sage green, deep enough for white text to read */
  border:1px solid rgba(255,255,255,0.18) !important;
  border-radius:20px !important;
  box-shadow:0 8px 26px rgba(36,52,71,0.12) !important;
  padding:24px 22px !important;
}
#page-home .hm-testi-card,
#page-home .hm-testi-card *{
  color:#ffffff !important;-webkit-text-fill-color:#ffffff !important;
}
#page-home .hm-testi-card p{color:#ffffff !important;}              /* the quoted statement */
#page-home .hm-testi-card span{color:rgba(255,255,255,0.82) !important;}  /* the source label */

/* ===== Kitchen Toolkit pane: white background + responsive tool-card grid ===== */
#mkp-toolkit{background:#ffffff !important;}
#mkp-toolkit .mk-toolkit-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr)) !important;
  gap:16px !important;
}
#mkp-toolkit .kitchen-tool{
  background:#ffffff;border:1px solid rgba(36,52,71,0.08);border-radius:18px;
  padding:22px 18px;text-align:center;cursor:default;
  box-shadow:0 4px 16px rgba(36,52,71,0.06);
}
#mkp-toolkit .kitchen-tool-icon{font-size:2rem;margin-bottom:0.6rem;display:block;}
#mkp-toolkit .kitchen-tool h4{font-family:Georgia,serif;font-size:1rem;font-weight:700;color:var(--char);margin:0 0 0.3rem;}
#mkp-toolkit .kitchen-tool p{font-size:0.8rem;color:#5b6470;line-height:1.5;margin:0;}
#mkp-toolkit .kitchen-tool .kt-tag{display:inline-block;margin-top:0.7rem;font-size:0.6rem;font-weight:700;text-transform:uppercase;letter-spacing:0.07em;padding:0.2rem 0.6rem;border-radius:20px;}
#mkp-toolkit .kt-free{background:rgba(143,175,138,0.2);color:#3a6635;}
#mkp-toolkit .kt-pro{background:rgba(212,168,42,0.18);color:#8b5a00;}
#page-discover .ka-who-card,
#page-discover .academy-card{
  background:#ffffff !important;
  border-radius:22px !important;
  border:1px solid rgba(36,52,71,0.08) !important;
  box-shadow:0 6px 22px rgba(36,52,71,0.10) !important;
}
/* tidy the inner card rows so only the outer card reads as the rounded block (pills/buttons untouched) */
#page-discover .ka-card-icon,
#page-discover .ka-card-title,
#page-discover .ka-card-desc{background:transparent !important;border:none !important;box-shadow:none !important;}