:root{
  --brand: #095D7F;
  --accent: #E2FCD5;
  --bg: #F1F8FE;
  --card: #FFFFFF;

  --text: #083546;
  --border: rgba(9,93,127,0.18);

  --radius-12: 12px;
  --radius-16: 16px;
  --radius-24: 24px;

  --shadow-soft: 0 12px 28px rgba(8, 53, 70, 0.12);
  --shadow-mini: 0 6px 16px rgba(8, 53, 70, 0.10);

  --pad: 20px;
  --max: 1080px;

  --ease: cubic-bezier(.2,.8,.2,1);
  --dur: 240ms;
}

*{ box-sizing: border-box; }
html, body{ height: 100%; }
body{
  margin: 0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.35;
}
a{ color: inherit; text-decoration: none; }
button{ font: inherit; }
.container{
  width: 100%;
  max-width: var(--max);
  padding: 0 var(--pad);
  margin: 0 auto;
}

/* TOPBAR (logo left, hamburger right) */
.topbar{
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px var(--pad);
  backdrop-filter: blur(10px);
  background: rgba(241,248,254,0.78);
  border-bottom: 1px solid var(--border);
}
.topbar--landing{
  background: rgba(241,248,254,0.72);
}
.brand{ display: inline-flex; align-items: center; }
.brand__logo{ height: 34px; width: auto; display: block; object-fit: contain; }

/* Icon buttons */
.iconBtn{
  height: 40px;
  width: 40px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,0.72);
  cursor: pointer;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  -webkit-tap-highlight-color: transparent;
  color: var(--text);
  display: grid;
  place-items: center;
  line-height: 1;
}
.iconBtn:hover{ transform: translateY(-1px); box-shadow: var(--shadow-mini); }
.iconBtn:active{ transform: translateY(1px); }
.iconBtn--menu{ font-size: 18px; }

/* LANDING */
.landing{ min-height: calc(100dvh - 64px); }

/* Hero image */
.landingHero{
  position: relative;
  min-height: calc(100dvh - 64px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: url("assets/trubg.png") center / cover no-repeat;
}
.landingHero::before{
  content:"";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(8,53,70,0.06),
    rgba(8,53,70,0.20) 35%,
    rgba(8,53,70,0.58) 100%
  );
}

/* Overlay content */
.landingHero__overlay{
  position: relative;
  z-index: 1;
  width: min(520px, calc(100% - 28px));
  padding: 18px 0 26px;
  display: grid;
  gap: 14px;
  animation: riseIn 520ms var(--ease) both;

  /* Pull CTA up a bit so it doesn't fall below screen */
  transform: translateY(-18px);
}
@media (max-height: 720px){
  .landingHero__overlay{ transform: translateY(-34px); }
}

/* Headline */
.landingHero__title{
  margin: 0;
  color: #fff;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.05;
  font-size: clamp(28px, 8vw, 42px);
  text-shadow: 0 10px 30px rgba(0,0,0,0.22);
}
.landingHero__accent{ color: var(--accent); }

/* Glass CTA card */
.landingHero__ctaCard{
  background: rgba(255,255,255,0.62);
  border: 1px solid rgba(226,252,213,0.35);
  border-radius: var(--radius-24);
  padding: 16px;
  backdrop-filter: blur(12px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.18);
  display: grid;
  gap: 12px;
}

/* Buttons */
.btn{
  border: 1px solid transparent;
  border-radius: var(--radius-16);
  height: 54px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  font-weight: 600;
}
.btn:active{ transform: translateY(1px) scale(0.99); }
.btn--lg{ width: 100%; }

.btn--primary{
  background: var(--brand);
  color: #fff;
  box-shadow: var(--shadow-mini);
}
.btn--primary:hover{ transform: translateY(-1px); box-shadow: var(--shadow-soft); }

.btn--mint{
  background: rgba(226,252,213,0.95);
  color: var(--brand);
  border-color: rgba(9,93,127,0.16);
}
.btn--mint:hover{ transform: translateY(-1px); box-shadow: var(--shadow-mini); }

/* SUPPORT SECTION: Always below hero when scrolled */
.landingSupport{
  padding: 18px 0 34px;
  background: var(--bg);
}
.landingSupport__grid{
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr;
}

/* Cards */
.h2{ font-size: 16px; font-weight: 700; margin: 0 0 6px; }
.body{ font-size: 15px; margin: 0; opacity: .92; }

.card{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  border-radius: var(--radius-16);
  border: 1px solid var(--border);
  background: rgba(255,255,255,0.92);
  box-shadow: var(--shadow-mini);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.card:hover{ transform: translateY(-2px); box-shadow: var(--shadow-soft); }
.card__icon{
  width: 36px; height: 36px;
  border-radius: 14px;
  display: grid; place-items: center;
  background: rgba(226,252,213,0.72);
  color: var(--brand);
  font-weight: 900;
}

/* Desktop arrangement */
@media (min-width: 900px){
  .landingHero{ min-height: 78vh; border-bottom: 1px solid var(--border); }
  .landingHero__overlay{ transform: translateY(-6px); }
  .landingSupport__grid{ grid-template-columns: repeat(3, 1fr); }
}

/* CENTRAL MODALS */
.modal{ position: fixed; inset: 0; display: none; z-index: 50; }
.modal.is-open{ display: grid; place-items: center; }
.modal__backdrop{
  position: absolute; inset: 0;
  background: rgba(8,53,70,0.42);
  animation: fadeIn var(--dur) var(--ease) both;
}
.modal__sheet{
  position: relative;
  width: min(520px, calc(100% - 24px));
  background: rgba(255,255,255,0.97);
  border: 1px solid var(--border);
  border-radius: var(--radius-24);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
  animation: popIn 260ms var(--ease) both;
}
.modal__header{
  padding: 16px 16px 12px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  border-bottom: 1px solid var(--border);
}
.modal__title{ margin: 0; font-size: 16px; font-weight: 700; }
.modal__body{ padding: 14px; display: grid; gap: 10px; }

.optionCard{
  width: 100%;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px;
  border-radius: var(--radius-16);
  border: 1px solid var(--border);
  background: rgba(241,248,254,0.65);
  cursor: pointer;
  text-align: left;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease);
  -webkit-tap-highlight-color: transparent;
}
.optionCard:hover{
  transform: translateY(-1px);
  box-shadow: var(--shadow-mini);
  border-color: rgba(9,93,127,0.30);
}
.optionCard:active{ transform: translateY(1px); }
.optionCard__left{ display: flex; align-items: center; gap: 12px; }
.optionCard__icon{
  width: 40px; height: 40px;
  border-radius: 14px;
  display: grid; place-items: center;
  background: rgba(226,252,213,0.75);
  color: var(--brand);
  font-weight: 900;
}
.optionCard__title{ font-weight: 700; font-size: 15px; }
.optionCard__sub{ font-size: 13px; opacity: .78; margin-top: 3px; }
.optionCard__chev{ font-size: 22px; opacity: .55; color: var(--brand); }

/* Drawer (left) */
.drawer{ position: fixed; inset: 0; display: none; z-index: 60; }
.drawer.is-open{ display: block; }
.drawer__backdrop{
  position: absolute; inset: 0;
  background: rgba(8,53,70,0.38);
  animation: fadeIn var(--dur) var(--ease) both;
}
.drawer__panel{
  position: absolute;
  top: 0; left: 0;
  height: 100%;
  width: min(340px, 88vw);
  background: rgba(255,255,255,0.98);
  border-right: 1px solid var(--border);
  box-shadow: var(--shadow-soft);
  display: flex;
  flex-direction: column;
  animation: slideInLeft 280ms var(--ease) both;
}
.drawer__header{
  padding: 14px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  border-bottom: 1px solid var(--border);
}
.drawer__logo{ height: 34px; width: auto; display: block; }
.drawer__body{ padding: 12px; display: grid; gap: 8px; }
.drawer__item{
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid transparent;
  background: rgba(241,248,254,0.60);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.drawer__item:hover{
  transform: translateY(-1px);
  box-shadow: var(--shadow-mini);
  border-color: rgba(9,93,127,0.22);
  background: rgba(255,255,255,0.92);
}
.drawer__chev{ color: var(--brand); opacity: .7; font-size: 20px; }
.drawer__divider{ height: 1px; background: var(--border); margin: 6px 2px; }
.drawer__item--primary{
  background: rgba(226,252,213,0.80);
  border-color: rgba(9,93,127,0.18);
}

/* Footer desktop only */
.footer{ padding: 14px 0 22px; background: var(--bg); }
.footer--landing{ display: none; }
.footer__inner{
  max-width: var(--max);
  padding: 0 var(--pad);
  margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
  opacity: .86;
}
.footer__copy{ margin: 0; font-size: 13px; }
.footer__links{ display: inline-flex; gap: 14px; }
.link{ font-size: 14px; font-weight: 600; opacity: .85; }
.link--muted:hover{ opacity: 1; }

@media (min-width: 900px){
  .footer--landing{ display: block; }
}

/* Toast */
.toast{
  position: fixed;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  background: rgba(9,93,127,0.94);
  color: #fff;
  padding: 10px 14px;
  border-radius: 999px;
  box-shadow: var(--shadow-soft);
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms var(--ease), transform 180ms var(--ease);
  font-size: 13px;
  z-index: 80;
}
.toast.is-show{ opacity: 1; transform: translateX(-50%) translateY(-6px); }

/* Motion */
@keyframes riseIn{ from{ opacity: 0; transform: translateY(10px); } to{ opacity: 1; transform: translateY(0); } }
@keyframes fadeIn{ from{ opacity: 0; } to{ opacity: 1; } }
@keyframes popIn{ from{ opacity: 0; transform: translateY(10px) scale(0.98); } to{ opacity: 1; transform: translateY(0) scale(1); } }
@keyframes slideInLeft{ from{ transform: translateX(-14px); opacity: 0; } to{ transform: translateX(0); opacity: 1; } }
@media (prefers-reduced-motion: reduce){ *{ animation: none !important; transition: none !important; } }

/* =========================
   Screen: Care Types
========================= */
.page{
  background: var(--bg);
}

.screen{
  padding: 14px 0 28px;
}

.screen__inner{
  padding-top: 10px;
}

.eyebrow{
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(9,93,127,0.85);
}

.screenTitle{
  margin-bottom: 14px;
}
.screenTitle__h1{
  margin: 0;
  font-size: clamp(22px, 6.2vw, 34px);
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 900;
  color: var(--text);
}

/* Care cards list */
.careList{
  display: grid;
  gap: 12px;
}

/* Card feel like screenshot: image left, text center, chevron right */
.careCard{
  width: 100%;
  display: grid;
  grid-template-columns: 64px 1fr 24px;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 24px rgba(8, 53, 70, 0.08);
  cursor: pointer;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
  transition:
    transform 240ms var(--ease),
    box-shadow 240ms var(--ease),
    border-color 240ms var(--ease),
    background 240ms var(--ease);
  position: relative;
  overflow: hidden;
}

/* subtle “alive” float */
.careCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(8, 53, 70, 0.12);
  border-color: rgba(9,93,127,0.22);
}
.careCard:active{
  transform: translateY(1px) scale(0.995);
}

/* shimmer hover */
.careCard::before{
  content:"";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(226,252,213,0.22) 35%,
    transparent 70%
  );
  transform: translateX(-120%);
  transition: transform 520ms var(--ease);
}
.careCard:hover::before{
  transform: translateX(120%);
}

.careCard__media{
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background: rgba(226,252,213,0.55);
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(9,93,127,0.10);
}

.careCard__img{
  width: 56px;
  height: 56px;
  object-fit: cover;
  transform: translateY(0);
  transition: transform 260ms var(--ease);
}
.careCard:hover .careCard__img{
  transform: translateY(-2px) scale(1.02);
}

.careCard__text{
  font-size: 16px;
  font-weight: 900;
  color: rgba(8,53,70,0.92);
}

.careCard__chev{
  justify-self: end;
  font-size: 22px;
  color: rgba(9,93,127,0.65);
  transform: translateX(0);
  transition: transform 240ms var(--ease), color 240ms var(--ease);
}
.careCard:hover .careCard__chev{
  transform: translateX(3px);
  color: rgba(9,93,127,0.85);
}

/* Selected state (cool “open” feel) */
.careCard.is-selected{
  background: rgba(226,252,213,0.55);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 18px 44px rgba(8,53,70,0.12);
}
.careCard.is-selected .careCard__media{
  background: rgba(255,255,255,0.75);
}
.careCard.is-selected::after{
  content:"";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  box-shadow: inset 0 0 0 2px rgba(9,93,127,0.12);
  pointer-events: none;
}

/* Desktop layout: keep list centered and airy */
@media (min-width: 900px){
  .screen{
    padding: 22px 0 40px;
  }
  .careList{
    max-width: 560px;
  }
}
/* Care Types — Palette-only Hover & Selected (SCOPED) */
.page--care-types .careCard{
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
}

.page--care-types .careCard:hover{
  background: rgba(226,252,213,0.70);
  border-color: rgba(9,93,127,0.32);
  box-shadow: 0 16px 34px rgba(9,93,127,0.18);
  transform: translateY(-2px);
}

.page--care-types .careCard:active{
  transform: translateY(1px) scale(0.995);
  background: rgba(226,252,213,0.85);
  border-color: rgba(9,93,127,0.40);
}

.page--care-types .careCard::before{
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(226,252,213,0.55) 35%,
    transparent 70%
  );
}

.page--care-types .careCard:hover .careCard__media{
  background: rgba(255,255,255,0.92);
  border-color: rgba(9,93,127,0.18);
}

.page--care-types .careCard:hover .careCard__chev{
  color: rgba(9,93,127,0.95);
  transform: translateX(3px);
}

.page--care-types .careCard.is-selected{
  background: rgba(226,252,213,0.80);
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}

.page--care-types .careCard.is-selected::after{
  content:"";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  box-shadow: inset 0 0 0 2px rgba(9,93,127,0.22);
  pointer-events: none;
}

.page--care-types .careCard.is-selected .careCard__media{
  background: rgba(255,255,255,0.95);
  border-color: rgba(9,93,127,0.20);
}
/* =========================
   Care Types — Mint Highlight Panel (Scoped)
========================= */

/* Base card positioning */
.page--care-types .careCard{
  position: relative;
  overflow: hidden;
}

/* Mint highlight panel (behind text area) */
.page--care-types .careCard::after{
  content:"";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 76px;                /* starts after illustration */
  right: 12px;
  background: rgba(226,252,213,0.0);  /* hidden by default */
  border-radius: 14px;
  z-index: 0;
  transition:
    background 240ms var(--ease),
    transform 240ms var(--ease);
  transform: scaleX(0.92);
  transform-origin: left center;
}

/* On hover → mint panel appears */
.page--care-types .careCard:hover::after{
  background: rgba(226,252,213,0.85);  /* mint highlight */
  transform: scaleX(1);
}

/* On selected → mint panel stays */
.page--care-types .careCard.is-selected::after{
  background: rgba(226,252,213,0.95);
  transform: scaleX(1);
}

/* Ensure content stays above panel */
.page--care-types .careCard__media,
.page--care-types .careCard__text,
.page--care-types .careCard__chev{
  position: relative;
  z-index: 1;
}

/* Text gets slightly bolder on hover (subtle) */
.page--care-types .careCard:hover .careCard__text{
  color: rgba(9,93,127,0.95);
}

/* Selected state feels “open” */
.page--care-types .careCard.is-selected{
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}

/* Optional: slightly stronger left edge like screenshot */
.page--care-types .careCard.is-selected{
  border-left: 4px solid rgba(9,93,127,0.55);
}
/* =========================
   Child Care — Number & Ages (Scoped)
========================= */
.page--child-ages .screen--flow{
  padding: 14px 0 34px;
}

.page--child-ages .hint{
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 600;
  color: rgba(9,93,127,0.75);
}

.page--child-ages .countCard{
  margin-top: 14px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 14px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 12px 26px rgba(9,93,127,0.12);
  animation: riseIn 360ms var(--ease) both;
}

.page--child-ages .countCard__label{
  font-size: 13px;
  font-weight: 800;
  color: rgba(9,93,127,0.75);
}

.page--child-ages .countCard__value{
  font-size: 26px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  margin-top: 2px;
}

.page--child-ages .stepper{
  display: inline-flex;
  gap: 10px;
}

.page--child-ages .stepper__btn{
  height: 44px;
  width: 44px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.18);
  background: rgba(226,252,213,0.85);
  color: rgba(9,93,127,0.95);
  font-size: 20px;
  font-weight: 900;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease);
  -webkit-tap-highlight-color: transparent;
}
.page--child-ages .stepper__btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.16);
}
.page--child-ages .stepper__btn:active{
  transform: translateY(1px) scale(0.99);
}

.page--child-ages .ageList{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}

.page--child-ages .ageCard{
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 12px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease);
}

.page--child-ages .ageCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(9,93,127,0.14);
  background: rgba(226,252,213,0.45);
}

.page--child-ages .ageCard__left{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.page--child-ages .ageBadge{
  height: 38px;
  width: 38px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.90);
  border: 1px solid rgba(9,93,127,0.16);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
}

.page--child-ages .ageCard__title{
  font-size: 15px;
  font-weight: 900;
  color: rgba(8,53,70,0.92);
}

.page--child-ages .ageCard__sub{
  margin-top: 2px;
  font-size: 12px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}

.page--child-ages .ageSelect{
  height: 44px;
  min-width: 170px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.18);
  background: rgba(241,248,254,0.85);
  padding: 0 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.95);
  outline: none;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease);
}
.page--child-ages .ageSelect:focus{
  background: rgba(226,252,213,0.65);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.65);
}

.page--child-ages .bottomBar{
  margin-top: 16px;
  display: grid;
  gap: 12px;
}

@media (min-width: 720px){
  .page--child-ages .bottomBar{
    grid-template-columns: 1fr 1fr;
  }
}

/* Gentle entrance */
.page--child-ages .ageCard{
  animation: riseIn 320ms var(--ease) both;
}
/* =========================
   Child Care — Type of Care (Scoped)
========================= */
.page--child-type .hint,
.page--senior-who .hint,
.page--senior-age .hint,
.page--senior-type .hint,
.page--senior-mobility .hint,
.page--senior-help .hint,
.page--adult-who .hint,
.page--adult-age .hint,
.page--adult-type .hint,
.page--adult-independence .hint,
.page--adult-tasks .hint{
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 600;
  color: rgba(9,93,127,0.75);
}

.page--child-type .typeGrid,
.page--senior-who .typeGrid,
.page--senior-age .typeGrid,
.page--senior-type .typeGrid,
.page--senior-mobility .typeGrid,
.page--adult-who .typeGrid,
.page--adult-age .typeGrid,
.page--adult-type .typeGrid,
.page--adult-independence .typeGrid{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}

/* Card */
.page--child-type .typeCard,
.page--senior-who .typeCard,
.page--senior-age .typeCard,
.page--senior-type .typeCard,
.page--senior-mobility .typeCard,
.page--adult-who .typeCard,
.page--adult-age .typeCard,
.page--adult-type .typeCard,
.page--adult-independence .typeCard{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
}

/* Mint highlight panel behind content */
.page--child-type .typeCard::after,
.page--senior-who .typeCard::after,
.page--senior-age .typeCard::after,
.page--senior-type .typeCard::after,
.page--senior-mobility .typeCard::after,
.page--adult-who .typeCard::after,
.page--adult-age .typeCard::after,
.page--adult-type .typeCard::after,
.page--adult-independence .typeCard::after{
  content:"";
  position: absolute;
  top: 8px; bottom: 8px;
  left: 8px; right: 8px;
  background: rgba(226,252,213,0.0);
  border-radius: 14px;
  transform: scaleX(0.92);
  transform-origin: left center;
  transition: background 240ms var(--ease), transform 240ms var(--ease);
  z-index: 0;
}

.page--child-type .typeCard:hover,
.page--senior-who .typeCard:hover,
.page--senior-age .typeCard:hover,
.page--senior-type .typeCard:hover,
.page--senior-mobility .typeCard:hover,
.page--adult-who .typeCard:hover,
.page--adult-age .typeCard:hover,
.page--adult-type .typeCard:hover,
.page--adult-independence .typeCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}

.page--child-type .typeCard:hover::after,
.page--senior-who .typeCard:hover::after,
.page--senior-age .typeCard:hover::after,
.page--senior-type .typeCard:hover::after,
.page--senior-mobility .typeCard:hover::after,
.page--adult-who .typeCard:hover::after,
.page--adult-age .typeCard:hover::after,
.page--adult-type .typeCard:hover::after,
.page--adult-independence .typeCard:hover::after{
  background: rgba(226,252,213,0.85);
  transform: scaleX(1);
}

.page--child-type .typeCard:active,
.page--senior-who .typeCard:active,
.page--senior-age .typeCard:active,
.page--senior-type .typeCard:active,
.page--senior-mobility .typeCard:active,
.page--adult-who .typeCard:active,
.page--adult-age .typeCard:active,
.page--adult-type .typeCard:active,
.page--adult-independence .typeCard:active{
  transform: translateY(1px) scale(0.995);
  background: rgba(226,252,213,0.50);
}

.page--child-type .typeCard.is-selected,
.page--senior-who .typeCard.is-selected,
.page--senior-age .typeCard.is-selected,
.page--senior-type .typeCard.is-selected,
.page--senior-mobility .typeCard.is-selected,
.page--adult-who .typeCard.is-selected,
.page--adult-age .typeCard.is-selected,
.page--adult-type .typeCard.is-selected,
.page--adult-independence .typeCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--child-type .typeCard.is-selected::after,
.page--senior-who .typeCard.is-selected::after,
.page--senior-age .typeCard.is-selected::after,
.page--senior-type .typeCard.is-selected::after,
.page--senior-mobility .typeCard.is-selected::after,
.page--adult-who .typeCard.is-selected::after,
.page--adult-age .typeCard.is-selected::after,
.page--adult-type .typeCard.is-selected::after,
.page--adult-independence .typeCard.is-selected::after{
  background: rgba(226,252,213,0.95);
  transform: scaleX(1);
}
.page--child-type .typeCard.is-selected::before,
.page--senior-who .typeCard.is-selected::before,
.page--senior-age .typeCard.is-selected::before,
.page--senior-type .typeCard.is-selected::before,
.page--senior-mobility .typeCard.is-selected::before,
.page--adult-who .typeCard.is-selected::before,
.page--adult-age .typeCard.is-selected::before,
.page--adult-type .typeCard.is-selected::before,
.page--adult-independence .typeCard.is-selected::before{
  content:"";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  box-shadow: inset 0 0 0 2px rgba(9,93,127,0.18);
  pointer-events: none;
}

/* Content above highlight panel */
.page--child-type .typeCard__left,
.page--child-type .typeCard__chev,
.page--senior-who .typeCard__left,
.page--senior-who .typeCard__chev,
.page--senior-age .typeCard__left,
.page--senior-age .typeCard__chev,
.page--senior-type .typeCard__left,
.page--senior-type .typeCard__chev,
.page--senior-mobility .typeCard__left,
.page--senior-mobility .typeCard__chev,
.page--adult-who .typeCard__left,
.page--adult-who .typeCard__chev,
.page--adult-age .typeCard__left,
.page--adult-age .typeCard__chev,
.page--adult-type .typeCard__left,
.page--adult-type .typeCard__chev,
.page--adult-independence .typeCard__left,
.page--adult-independence .typeCard__chev{
  position: relative;
  z-index: 1;
}

.page--child-type .typeCard__left,
.page--senior-who .typeCard__left,
.page--senior-age .typeCard__left,
.page--senior-type .typeCard__left,
.page--senior-mobility .typeCard__left,
.page--adult-who .typeCard__left,
.page--adult-age .typeCard__left,
.page--adult-type .typeCard__left,
.page--adult-independence .typeCard__left{
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.page--child-type .typeIcon,
.page--senior-who .typeIcon,
.page--senior-age .typeIcon,
.page--senior-type .typeIcon,
.page--senior-mobility .typeIcon,
.page--adult-who .typeIcon,
.page--adult-age .typeIcon,
.page--adult-type .typeIcon,
.page--adult-independence .typeIcon{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(241,248,254,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  color: rgba(9,93,127,0.95);
  font-size: 20px;
}

.page--child-type .typeCard__title,
.page--senior-who .typeCard__title,
.page--senior-age .typeCard__title,
.page--senior-type .typeCard__title,
.page--senior-mobility .typeCard__title,
.page--adult-who .typeCard__title,
.page--adult-age .typeCard__title,
.page--adult-type .typeCard__title,
.page--adult-independence .typeCard__title{
  display: block;
  font-size: 16px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--child-type .typeCard__sub,
.page--senior-who .typeCard__sub,
.page--senior-age .typeCard__sub,
.page--senior-type .typeCard__sub,
.page--senior-mobility .typeCard__sub,
.page--adult-who .typeCard__sub,
.page--adult-age .typeCard__sub,
.page--adult-type .typeCard__sub,
.page--adult-independence .typeCard__sub{
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}

.page--child-type .typeCard__chev,
.page--senior-who .typeCard__chev,
.page--senior-age .typeCard__chev,
.page--senior-type .typeCard__chev,
.page--senior-mobility .typeCard__chev,
.page--adult-who .typeCard__chev,
.page--adult-age .typeCard__chev,
.page--adult-type .typeCard__chev,
.page--adult-independence .typeCard__chev{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.12);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 5l7 7-7 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transform: translateX(0);
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background-color 240ms var(--ease);
}
.page--child-type .typeCard:hover .typeCard__chev,
.page--senior-who .typeCard:hover .typeCard__chev,
.page--senior-age .typeCard:hover .typeCard__chev,
.page--senior-type .typeCard:hover .typeCard__chev,
.page--senior-mobility .typeCard:hover .typeCard__chev,
.page--adult-who .typeCard:hover .typeCard__chev,
.page--adult-age .typeCard:hover .typeCard__chev,
.page--adult-type .typeCard:hover .typeCard__chev,
.page--adult-independence .typeCard:hover .typeCard__chev{
  transform: translateX(3px);
  box-shadow: 0 10px 18px rgba(9,93,127,0.12);
  border-color: rgba(9,93,127,0.22);
  background-color: rgba(226,252,213,0.85);
}

/* Senior Care – Icon set */
.page--senior-who .typeIcon,
.page--senior-age .typeIcon,
.page--senior-type .typeIcon,
.page--senior-mobility .typeIcon,
.page--adult-who .typeIcon,
.page--adult-age .typeIcon,
.page--adult-type .typeIcon,
.page--adult-independence .typeIcon{
  background-color: rgba(226,252,213,0.45);
  border-color: rgba(9,93,127,0.16);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--senior-who .typeIcon--parent{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M7 20v-6a5 5 0 0 1 10 0v6'/><path d='M5 12h14'/><path d='M9 6a3 3 0 1 0 6 0a3 3 0 1 0-6 0'/></svg>");
}
.page--senior-who .typeIcon--spouse{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M15.5 10a4.5 4.5 0 1 1-3.2-4.3'/><circle cx='9' cy='14' r='4.5'/><path d='M15 3v4'/><path d='M13 5h4'/></svg>");
}
.page--senior-who .typeIcon--self{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='8' r='3.5'/><path d='M5 20a7 7 0 0 1 14 0'/></svg>");
}
.page--senior-who .typeIcon--other{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='8' cy='9' r='3'/><circle cx='16' cy='9' r='3'/><path d='M3.5 20a5.5 5.5 0 0 1 9 0'/><path d='M11.5 20a5.5 5.5 0 0 1 9 0'/></svg>");
}

.page--senior-age .typeIcon--age{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='5' width='18' height='16' rx='3'/><path d='M8 3v4'/><path d='M16 3v4'/><path d='M3 9h18'/><path d='M8 14h4'/></svg>");
}

.page--senior-type .typeIcon--companion{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='9' cy='8' r='3'/><circle cx='16' cy='10' r='2.5'/><path d='M3.5 20a6.5 6.5 0 0 1 11 0'/><path d='M14 20a5.5 5.5 0 0 1 6.5-4.8'/></svg>");
}
.page--senior-type .typeIcon--personal{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3c2.2 0 4 1.8 4 4s-1.8 4-4 4-4-1.8-4-4 1.8-4 4-4z'/><path d='M6 21a6 6 0 0 1 12 0'/><path d='M6 13l2 2 4-4'/></svg>");
}
.page--senior-type .typeIcon--memory{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M9 4h6a4 4 0 0 1 4 4v8a4 4 0 0 1-4 4h-6a4 4 0 0 1-4-4V8a4 4 0 0 1 4-4z'/><path d='M9 8h6'/><path d='M9 12h3'/><path d='M9 16h5'/></svg>");
}
.page--senior-type .typeIcon--nursing{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><rect x='5' y='3' width='14' height='18' rx='3'/><path d='M9 8h6'/><path d='M12 6v6'/><path d='M9 14h6'/></svg>");
}

/* Senior Mobility – colorful icons */
.page--senior-mobility .typeIcon{
  background-color: #fff;
  border-color: rgba(9,93,127,0.12);
  box-shadow: 0 10px 22px rgba(9,93,127,0.12);
}
.page--senior-mobility .typeIcon--independent{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7.5' r='3.2' fill='%23F59E0B'/><path d='M5 21a7 7 0 0 1 14 0' fill='none' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><circle cx='12' cy='12' r='8.2' fill='none' stroke='%2395D5F0' stroke-width='1.2'/></svg>");
}
.page--senior-mobility .typeIcon--support{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 19h12' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M9 19V7a3 3 0 0 1 6 0v12' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><circle cx='12' cy='5' r='2.2' fill='%233B82F6'/><path d='M7 13h10' stroke='%2393C5FD' stroke-width='2' stroke-linecap='round'/></svg>");
}
.page--senior-mobility .typeIcon--wheelchair{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='10' cy='6' r='2.4' fill='%2322C55E'/><circle cx='8' cy='17' r='3.6' fill='none' stroke='%23095D7F' stroke-width='1.6'/><path d='M12 9l2 3h4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/><path d='M12 9v6a3.5 3.5 0 0 0 3.5 3.5' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/></svg>");
}
.page--senior-mobility .typeIcon--bedbound{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='3' y='10' width='18' height='7' rx='2' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.4'/><circle cx='8' cy='9' r='2' fill='%23F97316'/><path d='M3 17v3' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><path d='M21 17v3' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/></svg>");
}

/* Senior Help Needed – grid cards */
.page--senior-help .helpGrid{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}
.page--adult-tasks .helpGrid{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}
.page--senior-help .helpCard{
  width: 100%;
  display: grid;
  grid-template-columns: 44px 1fr;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background 240ms var(--ease);
}
.page--adult-tasks .helpCard{
  width: 100%;
  display: grid;
  grid-template-columns: 44px 1fr;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background 240ms var(--ease);
}
.page--adult-tasks .helpCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}
.page--adult-tasks .helpCard:active{
  transform: translateY(1px) scale(0.995);
  background: rgba(226,252,213,0.55);
}
.page--adult-tasks .helpCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--adult-tasks .helpCard.is-selected::after{
  content:"";
  position: absolute;
  inset: 8px;
  border-radius: 14px;
  background: rgba(226,252,213,0.85);
  z-index: 0;
}
.page--adult-tasks .helpCard > *{
  position: relative;
  z-index: 1;
}
.page--senior-help .helpCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}
.page--senior-help .helpCard:active{
  transform: translateY(1px) scale(0.995);
  background: rgba(226,252,213,0.55);
}
.page--senior-help .helpCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--senior-help .helpCard.is-selected::after{
  content:"";
  position: absolute;
  inset: 8px;
  border-radius: 14px;
  background: rgba(226,252,213,0.85);
  z-index: 0;
}
.page--senior-help .helpCard > *{
  position: relative;
  z-index: 1;
}
.page--senior-help .helpIcon{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background-color: #fff;
  border: 1px solid rgba(9,93,127,0.12);
  box-shadow: 0 10px 22px rgba(9,93,127,0.12);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--adult-tasks .helpIcon{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background-color: #fff;
  border: 1px solid rgba(9,93,127,0.12);
  box-shadow: 0 10px 22px rgba(9,93,127,0.12);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--senior-help .helpTitle{
  display: block;
  font-size: 16px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--adult-tasks .helpTitle{
  display: block;
  font-size: 16px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--senior-help .helpSub{
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}
.page--adult-tasks .helpSub{
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}
.page--senior-help .helpIcon--heart,
.page--adult-tasks .helpIcon--heart{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 20s-7-4.5-9-9a5 5 0 0 1 9-3 5 5 0 0 1 9 3c-2 4.5-9 9-9 9z' fill='%23F87171' stroke='%23095D7F' stroke-width='1.2' stroke-linejoin='round'/></svg>");
}
.page--senior-help .helpIcon--meal,
.page--adult-tasks .helpIcon--meal{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='9' cy='12' r='5.5' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.2'/><path d='M14.5 9.5h4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M14.5 12h4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M14.5 14.5h4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/></svg>");
}
.page--senior-help .helpIcon--meds,
.page--adult-tasks .helpIcon--meds{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='6' y='3' width='12' height='7' rx='2' fill='%2393C5FD' stroke='%23095D7F' stroke-width='1.2'/><rect x='5' y='10' width='14' height='11' rx='3' fill='%23DBEAFE' stroke='%23095D7F' stroke-width='1.2'/><path d='M12 12v6' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M9 15h6' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/></svg>");
}
.page--senior-help .helpIcon--care,
.page--adult-tasks .helpIcon--care{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7' r='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.2'/><path d='M6 21a6 6 0 0 1 12 0' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M9 13l2 2 4-4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
.page--senior-help .helpIcon--mobility,
.page--adult-tasks .helpIcon--mobility{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='8' cy='17' r='3.4' fill='none' stroke='%23095D7F' stroke-width='1.5'/><circle cx='12' cy='6.5' r='2.2' fill='%23FDBA74'/><path d='M12 9l2 3h4' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/><path d='M12 9v6a3 3 0 0 0 3 3' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round'/></svg>");
}
.page--senior-help .helpIcon--errands,
.page--adult-tasks .helpIcon--errands{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='7' width='16' height='12' rx='2' fill='%23C4B5FD' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 7a4 4 0 0 1 8 0' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><circle cx='9' cy='18' r='1.5' fill='%23095D7F'/><circle cx='15' cy='18' r='1.5' fill='%23095D7F'/></svg>");
}

/* Adult Care – icon set */
.page--adult-who .typeIcon{
  background-color: rgba(226,252,213,0.45);
  border-color: rgba(9,93,127,0.16);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--adult-who .typeIcon--adult-self{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7.5' r='3.2' fill='%2393C5FD'/><path d='M5 21a7 7 0 0 1 14 0' fill='none' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/></svg>");
}
.page--adult-who .typeIcon--adult-family{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='9' cy='8' r='2.6' fill='%23FDE68A'/><circle cx='15.5' cy='9.5' r='2.2' fill='%23FCA5A5'/><path d='M4 20a6 6 0 0 1 10 0' fill='none' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M12.5 20a5 5 0 0 1 7 0' fill='none' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/></svg>");
}
.page--adult-who .typeIcon--adult-partner{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 20s-6-3.8-7.8-7.3a4.6 4.6 0 0 1 7.8-4 4.6 4.6 0 0 1 7.8 4C18 16.2 12 20 12 20z' fill='%23F9A8D4' stroke='%23095D7F' stroke-width='1.2' stroke-linejoin='round'/></svg>");
}
.page--adult-who .typeIcon--adult-other{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='8' cy='9' r='2.4' fill='%23A7F3D0'/><circle cx='16' cy='9' r='2.4' fill='%23C7D2FE'/><path d='M3.5 20a5.5 5.5 0 0 1 9 0' fill='none' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round'/><path d='M11.5 20a5.5 5.5 0 0 1 9 0' fill='none' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round'/></svg>");
}
.page--adult-age .typeIcon--adult-age{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='6' width='16' height='14' rx='3' fill='%23DBEAFE' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 4v4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M16 4v4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M4 10h16' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--adult-type .typeIcon--adult-companion{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='9' cy='8' r='2.6' fill='%23FDBA74'/><circle cx='16' cy='10' r='2.2' fill='%23FCA5A5'/><path d='M4 20a6 6 0 0 1 10 0' fill='none' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M12.5 20a5 5 0 0 1 7 0' fill='none' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/></svg>");
}
.page--adult-type .typeIcon--adult-personal{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7' r='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.2'/><path d='M6 21a6 6 0 0 1 12 0' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M9 13l2 2 4-4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
.page--adult-type .typeIcon--adult-home{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 12l8-6 8 6' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/><rect x='6' y='12' width='12' height='8' rx='2' fill='%23E0E7FF' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--adult-type .typeIcon--adult-medical{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='4' width='14' height='16' rx='3' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.2'/><path d='M9 8h6' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round'/><path d='M12 6v6' stroke='%23095D7F' stroke-width='1.8' stroke-linecap='round'/></svg>");
}
.page--adult-independence .typeIcon--adult-indep{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7' r='3' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.2'/><path d='M6 21a6 6 0 0 1 12 0' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M8 12h8' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/></svg>");
}

/* =====================================================
   Generic Type + Task Flows (Special Needs, Housekeeping, Tutoring)
===================================================== */
.page--typeflow .hint{
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 600;
  color: rgba(9,93,127,0.75);
}
.page--typeflow .typeGrid{
  margin-top: 14px;
  display: grid;
  gap: 12px;
  margin-bottom: 22px;
}
.page--typeflow .typeCard{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
}
.page--typeflow .typeCard::after{
  content:"";
  position: absolute;
  top: 8px; bottom: 8px;
  left: 8px; right: 8px;
  background: rgba(226,252,213,0.0);
  border-radius: 14px;
  transform: scaleX(0.92);
  transform-origin: left center;
  transition: background 240ms var(--ease), transform 240ms var(--ease);
  z-index: 0;
}
.page--typeflow .typeCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}
.page--typeflow .typeCard:hover::after{
  background: rgba(226,252,213,0.85);
  transform: scaleX(1);
}
.page--typeflow .typeCard:active{
  transform: translateY(1px) scale(0.995);
  background: rgba(226,252,213,0.50);
}
.page--typeflow .typeCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--typeflow .typeCard.is-selected::after{
  background: rgba(226,252,213,0.95);
  transform: scaleX(1);
}
.page--typeflow .typeCard.is-selected::before{
  content:"";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  box-shadow: inset 0 0 0 2px rgba(9,93,127,0.18);
  pointer-events: none;
}
.page--typeflow .typeCard__left,
.page--typeflow .typeCard__chev{
  position: relative;
  z-index: 1;
}
.page--typeflow .typeCard__left{
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.page--typeflow .typeIcon{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.45);
  border: 1px solid rgba(9,93,127,0.16);
  color: rgba(9,93,127,0.95);
  font-size: 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--typeflow .typeCard__title{
  display: block;
  font-size: 16px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--typeflow .typeCard__sub{
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}
.page--typeflow .typeCard__chev{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.12);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 5l7 7-7 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transform: translateX(0);
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background-color 240ms var(--ease);
}
.page--typeflow .typeCard:hover .typeCard__chev{
  transform: translateX(3px);
  box-shadow: 0 10px 18px rgba(9,93,127,0.12);
  border-color: rgba(9,93,127,0.22);
  background-color: rgba(226,252,213,0.85);
}
.page--typeflow .bottomBar{
  display: grid;
  gap: 18px;
  margin-top: 16px;
  padding-bottom: 24px;
}
.page--typeflow .bottomBar--two{
  gap: 14px;
}
.page--typeflow .bottomBar .btn{ margin: 0; height: 56px; }

.page--taskflow .helpGrid{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}
.page--taskflow .helpCard{
  width: 100%;
  display: grid;
  grid-template-columns: 44px 1fr;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background 240ms var(--ease);
}
.page--taskflow .helpCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}
.page--taskflow .helpCard:active{
  transform: translateY(1px) scale(0.995);
  background: rgba(226,252,213,0.55);
}
.page--taskflow .helpCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--taskflow .helpCard.is-selected::after{
  content:"";
  position: absolute;
  inset: 8px;
  border-radius: 14px;
  background: rgba(226,252,213,0.85);
  z-index: 0;
}
.page--taskflow .helpCard > *{
  position: relative;
  z-index: 1;
}
.page--taskflow .helpIcon{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background-color: #fff;
  border: 1px solid rgba(9,93,127,0.12);
  box-shadow: 0 10px 22px rgba(9,93,127,0.12);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--taskflow .helpTitle{
  display: block;
  font-size: 16px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--taskflow .helpSub{
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}
.page--taskflow .helpIcon--heart{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 20s-7-4.5-9-9a5 5 0 0 1 9-3 5 5 0 0 1 9 3c-2 4.5-9 9-9 9z' fill='%23F87171' stroke='%23095D7F' stroke-width='1.2' stroke-linejoin='round'/></svg>");
}
.page--taskflow .helpIcon--meal{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='9' cy='12' r='5.5' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.2'/><path d='M14.5 9.5h4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M14.5 12h4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M14.5 14.5h4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/></svg>");
}
.page--taskflow .helpIcon--meds{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='6' y='3' width='12' height='7' rx='2' fill='%2393C5FD' stroke='%23095D7F' stroke-width='1.2'/><rect x='5' y='10' width='14' height='11' rx='3' fill='%23DBEAFE' stroke='%23095D7F' stroke-width='1.2'/><path d='M12 12v6' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M9 15h6' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/></svg>");
}
.page--taskflow .helpIcon--care{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7' r='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.2'/><path d='M6 21a6 6 0 0 1 12 0' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M9 13l2 2 4-4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
.page--taskflow .helpIcon--mobility{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='8' cy='17' r='3.4' fill='none' stroke='%23095D7F' stroke-width='1.5'/><circle cx='12' cy='6.5' r='2.2' fill='%23FDBA74'/><path d='M12 9l2 3h4' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/><path d='M12 9v6a3 3 0 0 0 3 3' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round'/></svg>");
}
.page--taskflow .helpIcon--errands{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='7' width='16' height='12' rx='2' fill='%23C4B5FD' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 7a4 4 0 0 1 8 0' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><circle cx='9' cy='18' r='1.5' fill='%23095D7F'/><circle cx='15' cy='18' r='1.5' fill='%23095D7F'/></svg>");
}
.page--taskflow .bottomBar{
  display: grid;
  gap: 18px;
  margin-top: 16px;
  padding-bottom: 24px;
}
.page--taskflow .bottomBar--two{
  gap: 14px;
}
.page--taskflow .bottomBar .btn{
  margin: 0;
  height: 56px;
}

/* Icons — Special Needs */
.page--typeflow .typeIcon--sn-who{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7' r='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.2'/><path d='M6 21a6 6 0 0 1 12 0' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--sn-age{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='6' width='16' height='14' rx='3' fill='%23DBEAFE' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 4v4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M16 4v4' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M4 10h16' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
/* Special Needs - support icons (richer, distinct) */
.page--typeflow .typeIcon--sn-behavior{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7.5' r='3' fill='%23FCA5A5' stroke='%23095D7F' stroke-width='1.1'/><path d='M6 21a6 6 0 0 1 12 0' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round'/><path d='M8.5 11.5c1.5-1 5.5-1 7 0' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--sn-development{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3l7 4-7 4-7-4 7-4z' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><path d='M5 10v5a7 7 0 0 0 14 0v-5' stroke='%23095D7F' stroke-width='1.2'/><path d='M12 11v6' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--sn-physical{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='10' cy='7' r='2.3' fill='%23FDBA74'/><circle cx='8' cy='17' r='3.2' fill='none' stroke='%23095D7F' stroke-width='1.4'/><path d='M10 9l2 3h4' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/><path d='M10 9v6a3 3 0 0 0 3 3' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--sn-medical{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='4' width='14' height='16' rx='3' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.1'/><path d='M9 8h6' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><path d='M12 6v6' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/></svg>");
}

/* Icons — Housekeeping */
.page--typeflow .typeIcon--hk-home{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 12l8-6 8 6' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/><rect x='6' y='12' width='12' height='8' rx='2' fill='%23E0E7FF' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--typeflow .typeIcon--hk-standard{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4.5' y='8.5' width='15' height='10' rx='2' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 8.5V6.5a4 4 0 0 1 8 0v2' stroke='%23095D7F' stroke-width='1.4'/><path d='M9 13h6' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--hk-deep{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='9' width='14' height='10' rx='2' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 9V6.5a4 4 0 0 1 8 0V9' stroke='%23095D7F' stroke-width='1.4'/><path d='M9 14h6' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/><path d='M9 16h6' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--hk-move{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='7' width='16' height='12' rx='2' fill='%23DBEAFE' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 7v-2h8v2' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><path d='M8 13h8' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/><path d='M10 15h4' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--hk-recurring{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='8' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.2'/><path d='M12 7v5l3 2' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/><path d='M8 5h4' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--hk-supply{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='6' y='4' width='12' height='16' rx='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.2'/><path d='M9 8h6' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/></svg>");
}

/* Icons — Tutoring */
.page--typeflow .typeIcon--tu-self{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7.5' r='3' fill='%2393C5FD' stroke='%23095D7F' stroke-width='1.1'/><path d='M6 21a6 6 0 0 1 12 0' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round'/><path d='M8.5 12.5h7' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--tu-child{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='10' cy='8' r='2.6' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><circle cx='15.8' cy='10' r='2.1' fill='%23FDBA74' stroke='%23095D7F' stroke-width='1.0'/><path d='M5 20a6 6 0 0 1 10 0' fill='none' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--tu-teen{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='7.5' r='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.1'/><path d='M6 21a6 6 0 0 1 12 0' stroke='%23095D7F' stroke-width='1.5' stroke-linecap='round'/><path d='M9 12h6' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/><path d='M10 14h4' stroke='%23095D7F' stroke-width='1.1' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--tu-other{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='8.5' cy='9' r='2.4' fill='%23FCA5A5' stroke='%23095D7F' stroke-width='1.0'/><circle cx='15.5' cy='9.5' r='2.4' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.0'/><path d='M3.8 20a5.6 5.6 0 0 1 9.4 0' fill='none' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><path d='M11.2 20a5.6 5.6 0 0 1 9.4 0' fill='none' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--tu-elem{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='6' width='14' height='12' rx='3' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><circle cx='9' cy='12' r='2' fill='%23FCA5A5'/><circle cx='15' cy='12' r='2' fill='%23A7F3D0'/></svg>");
}
.page--typeflow .typeIcon--tu-middle{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='5' width='14' height='14' rx='3' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 9h8' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/><path d='M8 12h8' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/><path d='M8 15h5' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--tu-high{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 7l8-4 8 4-8 4-8-4z' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.1'/><path d='M6 11v4a6 6 0 0 0 12 0v-4' stroke='%23095D7F' stroke-width='1.2'/><circle cx='12' cy='11.5' r='1.4' fill='%23F97316'/></svg>");
}
.page--typeflow .typeIcon--tu-college{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 7l8-4 8 4-8 4-8-4z' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 11v3a4 4 0 0 0 8 0v-3' stroke='%23095D7F' stroke-width='1.2'/><rect x='10.5' y='14' width='3' height='4' rx='1' fill='%23FCA5A5' stroke='%23095D7F' stroke-width='1.0'/></svg>");
}
.page--taskflow .helpIcon--subject{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='4' width='14' height='16' rx='2' fill='%23DBEAFE' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 8h8' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 12h8' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--typeflow .typeIcon--tu-help{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='8' fill='%23E9D5FF' stroke='%23095D7F' stroke-width='1.2'/><path d='M9.5 10a2.5 2.5 0 1 1 4.5 1.5c-.6.6-1.5 1.1-1.5 2' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><circle cx='12' cy='16.5' r='1' fill='%23095D7F'/></svg>");
}
.page--typeflow .typeIcon--tu-homework{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='6' y='4' width='12' height='16' rx='2' fill='%23DBEAFE' stroke='%23095D7F' stroke-width='1.1'/><path d='M9 8h6' stroke='%23095D7F' stroke-width='1.2'/><path d='M9 11h6' stroke='%23095D7F' stroke-width='1.2'/><path d='M9 14h4' stroke='%23095D7F' stroke-width='1.2'/><circle cx='16.5' cy='15.5' r='2' fill='%23FCA5A5' stroke='%23095D7F' stroke-width='1.0'/></svg>");
}
.page--typeflow .typeIcon--tu-testprep{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 7l8-4 8 4-8 4-8-4z' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.1'/><path d='M6 11v4a6 6 0 0 0 12 0v-4' stroke='%23095D7F' stroke-width='1.2'/><path d='M12 11v4' stroke='%23095D7F' stroke-width='1.2'/><circle cx='12' cy='17' r='1.3' fill='%23F97316'/></svg>");
}
.page--typeflow .typeIcon--tu-skill{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4.5' y='6' width='15' height='12' rx='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 10h8' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/><path d='M8 13h5' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/><circle cx='16.5' cy='13.5' r='1.6' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.0'/></svg>");
}
.page--typeflow .typeIcon--tu-habits{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='8' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><path d='M12 8v4l3 2' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/><path d='M8 5h4' stroke='%23095D7F' stroke-width='1.1' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--tu-pref{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='3' y='6' width='18' height='12' rx='2' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.2'/><path d='M7 9h4' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><path d='M13 12h4' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--tu-inperson{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='6' width='10' height='12' rx='2' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><circle cx='17' cy='10' r='3' fill='%23FCA5A5' stroke='%23095D7F' stroke-width='1.0'/><path d='M15.5 17a4 4 0 0 1 3 0' stroke='%23095D7F' stroke-width='1.1' stroke-linecap='round'/></svg>");
}
.page--typeflow .typeIcon--tu-online{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='6' width='16' height='10' rx='2' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><rect x='9' y='17' width='6' height='2' rx='1' fill='%23095D7F'/><circle cx='12' cy='11' r='2' fill='%23A7F3D0'/></svg>");
}
.page--typeflow .typeIcon--tu-hybrid{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='3.5' y='7' width='9.5' height='10' rx='2' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.1'/><rect x='11' y='6' width='9.5' height='11' rx='2' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><circle cx='8' cy='12' r='1.6' fill='%23A7F3D0'/><circle cx='16' cy='12' r='1.6' fill='%23FCA5A5'/></svg>");
}
.page--typeflow .typeIcon--tu-nopref{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='8' fill='%23E9D5FF' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 12h8' stroke='%23095D7F' stroke-width='1.6' stroke-linecap='round'/><circle cx='12' cy='8.5' r='1.2' fill='%23095D7F'/></svg>");
}

/* Disabled Continue */
.page--child-type #btnTypeContinue:disabled,
.page--senior-who #btnSeniorWhoContinue:disabled,
.page--senior-age #btnSeniorAgeContinue:disabled,
.page--senior-type #btnSeniorTypeContinue:disabled,
.page--senior-mobility #btnSeniorMobilityContinue:disabled,
.page--adult-who #btnAdultWhoContinue:disabled,
.page--adult-age #btnAdultAgeContinue:disabled,
.page--adult-type #btnAdultTypeContinue:disabled,
.page--adult-independence #btnAdultIndependenceContinue:disabled,
.page--adult-tasks #btnAdultTasksContinue:disabled{
  opacity: .55;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}
/* =========================
   Child Care Type – Spacing Fix (Scoped)
========================= */

/* More space between last card and bottom buttons */
.page--child-type .typeGrid,
.page--senior-who .typeGrid,
.page--senior-age .typeGrid,
.page--senior-type .typeGrid,
.page--senior-mobility .typeGrid,
.page--adult-who .typeGrid,
.page--adult-age .typeGrid,
.page--adult-type .typeGrid,
.page--adult-independence .typeGrid{
  margin-bottom: 22px; /* was too tight */
}

/* Bottom bar spacing */
.page--child-type .bottomBar,
.page--senior-who .bottomBar,
.page--senior-age .bottomBar,
.page--senior-type .bottomBar,
.page--senior-mobility .bottomBar,
.page--senior-help .bottomBar,
.page--adult-who .bottomBar,
.page--adult-age .bottomBar,
.page--adult-type .bottomBar,
.page--adult-independence .bottomBar,
.page--adult-tasks .bottomBar{
  margin-top: 10px;
  padding-bottom: 18px;
}

/* When stacked (mobile) give buttons air */
.page--child-type .bottomBar--two,
.page--senior-who .bottomBar--two,
.page--senior-age .bottomBar--two,
.page--senior-type .bottomBar--two,
.page--senior-mobility .bottomBar--two,
.page--senior-help .bottomBar--two,
.page--adult-who .bottomBar--two,
.page--adult-age .bottomBar--two,
.page--adult-type .bottomBar--two,
.page--adult-independence .bottomBar--two,
.page--adult-tasks .bottomBar--two{
  gap: 14px; /* space between Back & Continue */
}

/* Buttons feel less cramped vertically */
.page--child-type .bottomBar .btn,
.page--senior-who .bottomBar .btn,
.page--senior-age .bottomBar .btn,
.page--senior-type .bottomBar .btn,
.page--senior-mobility .bottomBar .btn,
.page--senior-help .bottomBar .btn,
.page--adult-who .bottomBar .btn,
.page--adult-age .bottomBar .btn,
.page--adult-type .bottomBar .btn,
.page--adult-independence .bottomBar .btn,
.page--adult-tasks .bottomBar .btn{
  height: 56px; /* slightly taller, more premium */
}
/* =========================
   Child Care Type – Button Gap Fix (Scoped)
========================= */

/* Increase vertical gap between Back & Continue */
.page--child-type .bottomBar,
.page--senior-who .bottomBar,
.page--senior-age .bottomBar,
.page--senior-type .bottomBar,
.page--senior-mobility .bottomBar,
.page--senior-help .bottomBar,
.page--adult-who .bottomBar,
.page--adult-age .bottomBar,
.page--adult-type .bottomBar,
.page--adult-independence .bottomBar,
.page--adult-tasks .bottomBar{
  display: grid;
  gap: 18px;          /* 👈 this is the main fix */
  margin-top: 16px;
}

/* Extra breathing space at bottom */
.page--child-type .bottomBar,
.page--senior-who .bottomBar,
.page--senior-age .bottomBar,
.page--senior-type .bottomBar,
.page--senior-mobility .bottomBar,
.page--senior-help .bottomBar,
.page--adult-who .bottomBar,
.page--adult-age .bottomBar,
.page--adult-type .bottomBar,
.page--adult-independence .bottomBar,
.page--adult-tasks .bottomBar{
  padding-bottom: 24px;
}

/* Ensure buttons don’t collapse spacing */
.page--child-type .bottomBar .btn,
.page--senior-who .bottomBar .btn,
.page--senior-age .bottomBar .btn,
.page--senior-type .bottomBar .btn,
.page--senior-mobility .bottomBar .btn,
.page--senior-help .bottomBar .btn,
.page--adult-who .bottomBar .btn,
.page--adult-age .bottomBar .btn,
.page--adult-type .bottomBar .btn,
.page--adult-independence .bottomBar .btn,
.page--adult-tasks .bottomBar .btn{
  margin: 0;          /* safety reset */
}
/* =========================
   Child Care — Schedule (Scoped)
========================= */
.page--child-schedule .hint{
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 600;
  color: rgba(9,93,127,0.75);
}

.page--child-schedule .panel{
  margin-top: 14px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 26px rgba(9,93,127,0.10);
  animation: riseIn 340ms var(--ease) both;
}

.page--child-schedule .panel__row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.page--child-schedule .panel__row--stack{
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 12px;
}

.page--child-schedule .panel__title{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  font-size: 15px;
}
.page--child-schedule .panel__sub{
  margin-top: 2px;
  font-weight: 700;
  font-size: 13px;
  color: rgba(9,93,127,0.70);
}

/* Segmented control */
.page--child-schedule .seg{
  display: inline-flex;
  border-radius: 16px;
  background: rgba(241,248,254,0.85);
  border: 1px solid rgba(9,93,127,0.14);
  padding: 4px;
  gap: 6px;
}
.page--child-schedule .seg__btn{
  height: 40px;
  padding: 0 12px;
  border-radius: 14px;
  border: 0;
  cursor: pointer;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.82);
  transition: transform 240ms var(--ease), background 240ms var(--ease), color 240ms var(--ease);
}
.page--child-schedule .seg__btn:hover{ transform: translateY(-1px); }
.page--child-schedule .seg__btn.is-active{
  background: rgba(226,252,213,0.95);
  color: rgba(9,93,127,0.95);
  box-shadow: 0 10px 22px rgba(9,93,127,0.12);
}

/* Input shell (palette-only) */
.page--child-schedule .inputShell{
  height: 50px;
  border-radius: 16px;
  border: 1px solid rgba(9,93,127,0.16);
  background: rgba(241,248,254,0.92);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  transition: box-shadow 240ms var(--ease), background 240ms var(--ease);
}
.page--child-schedule .inputShell__icon{
  color: rgba(9,93,127,0.90);
}
.page--child-schedule .dateInput,
.page--child-schedule .timeInput{
  width: 100%;
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--child-schedule .inputShell:focus-within{
  background: rgba(226,252,213,0.55);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.65);
}

/* Days pills */
.page--child-schedule .pillRow{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.page--child-schedule .pill{
  height: 40px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.90);
  font-weight: 900;
  cursor: pointer;
  transition: transform 240ms var(--ease), background 240ms var(--ease), box-shadow 240ms var(--ease);
}
.page--child-schedule .pill:hover{ transform: translateY(-1px); }
.page--child-schedule .pill.is-selected{
  background: rgba(226,252,213,0.95);
  box-shadow: 0 10px 22px rgba(9,93,127,0.12);
}

/* Time chips */
.page--child-schedule .timeGrid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.page--child-schedule .timeChip{
  height: 46px;
  border-radius: 16px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.92);
  font-weight: 900;
  cursor: pointer;
  transition: transform 240ms var(--ease), background 240ms var(--ease), box-shadow 240ms var(--ease);
}
.page--child-schedule .timeChip:hover{ transform: translateY(-1px); }
.page--child-schedule .timeChip.is-selected{
  background: rgba(226,252,213,0.95);
  box-shadow: 0 12px 26px rgba(9,93,127,0.12);
}

.page--child-schedule .timeCustom{
  margin-top: 10px;
  display: grid;
  gap: 10px;
}
@media (min-width: 720px){
  .page--child-schedule .timeCustom{
    grid-template-columns: 1fr 1fr;
  }
}

/* Bottom spacing */
.page--child-schedule .bottomBar{
  margin-top: 16px;
  display: grid;
  gap: 18px;
  padding-bottom: 24px;
}
@supports (padding: env(safe-area-inset-bottom)){
  .page--child-schedule .bottomBar{
    padding-bottom: calc(24px + env(safe-area-inset-bottom));
  }
}
@media (min-width: 720px){
  .page--child-schedule .bottomBar{
    grid-template-columns: 1fr 1fr;
  }
}
/* =========================
   Schedule – UX polish + Flashy selections (Scoped)
========================= */

/* Field labels for time inputs */
.page--child-schedule .field{
  display: grid;
  gap: 8px;
}
.page--child-schedule .field__label{
  font-size: 13px;
  font-weight: 900;
  color: rgba(9,93,127,0.85);
}

/* Better time range layout */
.page--child-schedule .timeRange{
  margin-top: 10px;
  background: rgba(241,248,254,0.85);
  border: 1px solid rgba(9,93,127,0.12);
  border-radius: 18px;
  padding: 12px;
}
.page--child-schedule .timeRange__row{
  display: grid;
  gap: 12px;
}
@media (min-width: 720px){
  .page--child-schedule .timeRange__row{
    grid-template-columns: 1fr 1fr;
  }
}
.page--child-schedule .timeRange__meta{
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.page--child-schedule .timeRange__hint{
  font-size: 12px;
  font-weight: 700;
  color: rgba(9,93,127,0.72);
}

/* Mini button (palette only) */
.page--child-schedule .miniBtn{
  height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.16);
  background: rgba(226,252,213,0.90);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease);
}
.page--child-schedule .miniBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.16);
}
.page--child-schedule .miniBtn:active{ transform: translateY(1px); }

/* FLASHIER selected state (pills + chips) — mint glow + teal outline */
.page--child-schedule .pill.is-selected,
.page--child-schedule .timeChip.is-selected{
  background: rgba(226,252,213,0.98);
  border-color: rgba(9,93,127,0.28);
  box-shadow:
    0 14px 30px rgba(9,93,127,0.14),
    0 0 0 4px rgba(226,252,213,0.70);
}

/* Add a subtle animated highlight sweep (palette-only) */
.page--child-schedule .pill,
.page--child-schedule .timeChip{
  position: relative;
  overflow: hidden;
}
.page--child-schedule .pill::after,
.page--child-schedule .timeChip::after{
  content:"";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(226,252,213,0.65) 35%,
    transparent 70%
  );
  transform: translateX(-120%);
  transition: transform 520ms var(--ease);
  pointer-events: none;
}
.page--child-schedule .pill:hover::after,
.page--child-schedule .timeChip:hover::after{
  transform: translateX(120%);
}

/* Segmented active state more premium */
.page--child-schedule .seg__btn.is-active{
  background: rgba(226,252,213,0.98);
  border: 1px solid rgba(9,93,127,0.18);
  color: rgba(9,93,127,0.98);
  box-shadow:
    0 14px 30px rgba(9,93,127,0.14),
    0 0 0 4px rgba(226,252,213,0.70);
}

/* Hide recurring-only panels smoothly */
.page--child-schedule .is-hidden{
  display: none !important;
}
/* =========================
   Child Care – Schedule Review
========================= */
.page--child-review .reviewCard{
  margin-top: 14px;
  background: rgba(255,255,255,0.95);
  border-radius: 20px;
  border: 1px solid rgba(9,93,127,0.14);
  box-shadow: 0 16px 36px rgba(9,93,127,0.12);
  padding: 14px;
  display: grid;
  gap: 14px;
}

.page--child-review .reviewRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.page--child-review .reviewLabel{
  font-size: 13px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
}

.page--child-review .reviewValue{
  margin-top: 2px;
  font-size: 15px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

.page--child-review .editBtn{
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.18);
  background: rgba(226,252,213,0.9);
  color: rgba(9,93,127,0.95);
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.page--child-review .editBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(9,93,127,0.16);
}
/* =========================
   Schedule Review – Bottom Buttons Spacing Fix (Scoped)
========================= */

/* Ensure review page bottom bar has enough separation + breathing room */
.page--child-review .bottomBar{
  display: grid;
  gap: 18px;              /* 👈 creates clear space between Back and Looks good */
  margin-top: 18px;
  padding-bottom: 26px;   /* 👈 prevents hugging the bottom */
}

/* Make both buttons consistent and premium */
.page--child-review .bottomBar .btn{
  height: 56px;
  margin: 0;              /* safety reset */
}

/* iOS/Android gesture-safe padding */
@supports (padding: env(safe-area-inset-bottom)){
  .page--child-review .bottomBar{
    padding-bottom: calc(26px + env(safe-area-inset-bottom));
  }
}
/* =========================
   Child Care – Location (Scoped)
========================= */
.page--child-location .hint{
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 600;
  color: rgba(9,93,127,0.75);
}

/* Big location action */
.page--child-location .locBtn{
  margin-top: 14px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(226,252,213,0.70);
  box-shadow: 0 14px 30px rgba(9,93,127,0.12);
  cursor: pointer;
  text-align: left;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease);
  -webkit-tap-highlight-color: transparent;
}
.page--child-location .locBtn:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.26);
}
.page--child-location .locBtn:active{
  transform: translateY(1px) scale(0.995);
}

.page--child-location .locBtn__icon{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  color: rgba(9,93,127,0.95);
  font-size: 18px;
}
.page--child-location .locBtn__title{
  display: block;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--child-location .locBtn__sub{
  display: block;
  margin-top: 2px;
  font-weight: 700;
  font-size: 13px;
  color: rgba(9,93,127,0.75);
}
.page--child-location .locBtn__chev{
  font-size: 22px;
  color: rgba(9,93,127,0.75);
}

/* Inputs */
.page--child-location .textInput,
.page--child-location .selectInput{
  width: 100%;
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

.page--child-location .grid2{
  display: grid;
  gap: 12px;
}
@media (min-width: 720px){
  .page--child-location .grid2{
    grid-template-columns: 1fr 1fr;
  }
}

/* Bottom spacing */
.page--child-location .bottomBar{
  margin-top: 16px;
  display: grid;
  gap: 18px;
  padding-bottom: 24px;
}
@supports (padding: env(safe-area-inset-bottom)){
  .page--child-location .bottomBar{
    padding-bottom: calc(24px + env(safe-area-inset-bottom));
  }
}
@media (min-width: 720px){
  .page--child-location .bottomBar{
    grid-template-columns: 1fr 1fr;
  }
}
/* =========================
   Location – Professional Form Styling (Scoped)
========================= */

/* Make panel spacing & hierarchy tighter and cleaner */
.page--child-location .panel{
  margin-top: 14px;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 20px;
  padding: 14px;
  box-shadow: 0 16px 34px rgba(9,93,127,0.10);
}

/* Improve label rhythm */
.page--child-location .field{
  display: grid;
  gap: 8px;
}

.page--child-location .field__label{
  font-size: 13px;
  font-weight: 900;
  letter-spacing: -0.01em;
  color: rgba(9,93,127,0.88);
}

/* Input shell becomes more “app-like” */
.page--child-location .inputShell{
  height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.16);
  background: rgba(241,248,254,0.92);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  transition:
    transform 240ms var(--ease),
    box-shadow 240ms var(--ease),
    background 240ms var(--ease),
    border-color 240ms var(--ease);
}

.page--child-location .inputShell:hover{
  transform: translateY(-1px);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
}

.page--child-location .inputShell:focus-within{
  background: rgba(226,252,213,0.55);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
  border-color: rgba(9,93,127,0.26);
}

/* Icon badge look */
.page--child-location .inputShell__icon{
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.12);
  color: rgba(9,93,127,0.95);
  flex: 0 0 auto;
}

/* Inputs */
.page--child-location .textInput,
.page--child-location .selectInput{
  width: 100%;
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  font-size: 14px;
}

/* Placeholder tone (still palette via opacity only) */
.page--child-location .textInput::placeholder{
  color: rgba(9,93,127,0.45);
  font-weight: 800;
}

/* Make select look consistent */
.page--child-location .selectInput{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 34px; /* space for chevron */
}

/* Chevron inside select shell */
.page--child-location .inputShell{
  position: relative;
}
.page--child-location .inputShell:has(.selectInput)::after{
  content: "▾";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(9,93,127,0.70);
  font-weight: 900;
  pointer-events: none;
}

/* Grid spacing (fix cramped look) */
.page--child-location .grid2{
  margin-top: 10px;
  display: grid;
  gap: 12px;
}

.page--child-location .panel__row--stack{
  gap: 12px;
}
/* =========================
   Child Care – Budget (Scoped)
========================= */
.page--child-budget .hint{
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 600;
  color: rgba(9,93,127,0.75);
}

/* Big rate card */
.page--child-budget .rateHero{
  margin-top: 14px;
  background: rgba(9,93,127,0.95);
  border-radius: 22px;
  padding: 18px;
  box-shadow: 0 20px 44px rgba(9,93,127,0.22);
  position: relative;
  overflow: hidden;
  animation: riseIn 420ms var(--ease) both;
}

/* subtle mint glow overlay */
.page--child-budget .rateHero::after{
  content:"";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    circle at 18% 20%,
    rgba(226,252,213,0.18),
    transparent 55%
  );
  pointer-events: none;
}

.page--child-budget .rateHero__top{
  position: relative;
  z-index: 1;
}

.page--child-budget .rateHero__label{
  font-size: 11px;
  letter-spacing: .12em;
  font-weight: 900;
  color: rgba(226,252,213,0.92);
}

.page--child-budget .rateHero__value{
  margin-top: 10px;
  display: flex;
  align-items: baseline;
  gap: 6px;
  color: #fff;
  font-weight: 900;
}
.page--child-budget .rateHero__money{
  font-size: 20px;
  opacity: .95;
}
.page--child-budget #rateValue{
  font-size: 46px;
  letter-spacing: -0.02em;
}
.page--child-budget .rateHero__unit{
  font-size: 16px;
  opacity: .9;
}

/* Slider */
.page--child-budget .rateHero__sliderArea{
  position: relative;
  z-index: 1;
  margin-top: 16px;
}

.page--child-budget .rateSlider{
  width: 100%;
  accent-color: #E2FCD5; /* palette */
  height: 4px;
}

.page--child-budget .rateRange{
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 800;
  color: rgba(226,252,213,0.85);
}

/* Panel */
.page--child-budget .panel{
  margin-top: 14px;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 20px;
  padding: 14px;
  box-shadow: 0 16px 34px rgba(9,93,127,0.10);
}

.page--child-budget .chipGrid{
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

/* Chips */
.page--child-budget .budgetChip{
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.92);
  font-weight: 900;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease);
  position: relative;
  overflow: hidden;
}
.page--child-budget .budgetChip:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.12);
}
.page--child-budget .budgetChip:active{
  transform: translateY(1px) scale(0.99);
}

/* Flashy selected (palette-only) */
.page--child-budget .budgetChip.is-selected{
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  border-color: rgba(226,252,213,0.40);
  box-shadow:
    0 16px 34px rgba(9,93,127,0.18),
    0 0 0 4px rgba(226,252,213,0.65);
}

/* Market card */
.page--child-budget .marketCard{
  margin-top: 14px;
  background: rgba(226,252,213,0.60);
  border: 1px solid rgba(9,93,127,0.12);
  border-radius: 20px;
  padding: 14px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
}

.page--child-budget .marketCard__icon{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.94);
  border: 1px solid rgba(9,93,127,0.12);
  color: rgba(9,93,127,0.95);
}

.page--child-budget .marketCard__title{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--child-budget .marketCard__sub{
  margin-top: 4px;
  font-weight: 700;
  font-size: 13px;
  color: rgba(9,93,127,0.80);
}

/* Bottom spacing */
.page--child-budget .bottomBar{
  margin-top: 16px;
  display: grid;
  gap: 18px;
  padding-bottom: 24px;
}
@supports (padding: env(safe-area-inset-bottom)){
  .page--child-budget .bottomBar{
    padding-bottom: calc(24px + env(safe-area-inset-bottom));
  }
}
/* =========================
   Child Care – Preferences (Scoped)
========================= */
.page--child-pref .hint{
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 600;
  color: rgba(9,93,127,0.75);
}

.page--child-pref .prefList{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}

.page--child-pref .prefCard{
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 20px;
  padding: 14px;
  box-shadow: 0 14px 30px rgba(9,93,127,0.10);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
  position: relative;
  overflow: hidden;
}

.page--child-pref .prefCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.14);
  border-color: rgba(9,93,127,0.22);
}

/* Mint highlight panel */
.page--child-pref .prefCard::after{
  content:"";
  position: absolute;
  inset: 10px;
  border-radius: 16px;
  background: rgba(226,252,213,0);
  transform: scaleX(0.94);
  transform-origin: left center;
  transition: background 240ms var(--ease), transform 240ms var(--ease);
  z-index: 0;
}
.page--child-pref .prefCard:hover::after{
  background: rgba(226,252,213,0.55);
  transform: scaleX(1);
}
.page--child-pref .prefCard.is-selected::after{
  background: rgba(226,252,213,0.90);
  transform: scaleX(1);
}

/* Ensure content above highlight */
.page--child-pref .prefCard__left,
.page--child-pref .prefCard__right{
  position: relative;
  z-index: 1;
}

.page--child-pref .prefCard__left{
  display: flex;
  align-items: center;
  gap: 12px;
}

.page--child-pref .prefIcon{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(241,248,254,0.95);
  border: 1px solid rgba(9,93,127,0.12);
  color: rgba(9,93,127,0.95);
}

.page--child-pref .prefTitle{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--child-pref .prefSub{
  margin-top: 3px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(9,93,127,0.72);
}

/* Mini pills (Nice/Must) */
.page--child-pref .prefCard__right{
  display: inline-flex;
  gap: 8px;
  flex-wrap: nowrap;
}

.page--child-pref .pillMini{
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.90);
  font-weight: 900;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease);
}

.page--child-pref .pillMini:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.12);
}

.page--child-pref .pillMini.is-active{
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  border-color: rgba(226,252,213,0.40);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
}

/* Skip */
.page--child-pref .skipLink{
  margin-top: 10px;
  width: 100%;
  background: transparent;
  border: 0;
  color: rgba(9,93,127,0.80);
  font-weight: 900;
  padding: 10px 0;
  cursor: pointer;
  transition: transform 240ms var(--ease);
}
.page--child-pref .skipLink:hover{
  transform: translateY(-1px);
}

/* Bottom spacing */
.page--child-pref .bottomBar{
  margin-top: 16px;
  display: grid;
  gap: 18px;
  padding-bottom: 24px;
}
@supports (padding: env(safe-area-inset-bottom)){
  .page--child-pref .bottomBar{
    padding-bottom: calc(24px + env(safe-area-inset-bottom));
  }
}
@media (min-width: 720px){
  .page--child-pref .bottomBar{
    grid-template-columns: 1fr 1fr;
  }
}
/* =========================
   Child Care – Special Instructions (Scoped)
========================= */
.page--child-notes .hint{
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 600;
  color: rgba(9,93,127,0.75);
}

.page--child-notes .noteChips{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.page--child-notes .noteChip{
  height: 40px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.92);
  font-weight: 900;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease);
  position: relative;
  overflow: hidden;
}
.page--child-notes .noteChip:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.12);
}
.page--child-notes .noteChip:active{
  transform: translateY(1px) scale(0.99);
}
.page--child-notes .noteChip::after{
  content:"";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 0%, rgba(226,252,213,0.65) 35%, transparent 70%);
  transform: translateX(-120%);
  transition: transform 520ms var(--ease);
  pointer-events: none;
}
.page--child-notes .noteChip:hover::after{
  transform: translateX(120%);
}

.page--child-notes .noteHead{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
}

.page--child-notes .counter{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.75);
  background: rgba(226,252,213,0.65);
  border: 1px solid rgba(9,93,127,0.12);
  border-radius: 999px;
  padding: 6px 10px;
}

.page--child-notes .noteBox{
  border-radius: 20px;
  border: 1px solid rgba(9,93,127,0.16);
  background: rgba(241,248,254,0.92);
  padding: 12px;
  transition: box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
}
.page--child-notes .noteBox:focus-within{
  background: rgba(226,252,213,0.55);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
  border-color: rgba(9,93,127,0.26);
}
.page--child-notes textarea{
  width: 100%;
  min-height: 150px;
  resize: vertical;
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 800;
  color: rgba(9,93,127,0.95);
  font-size: 14px;
  line-height: 1.45;
}
.page--child-notes textarea::placeholder{
  color: rgba(9,93,127,0.45);
  font-weight: 800;
}

.page--child-notes .noteActions{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
}

.page--child-notes .miniBtn{
  height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.16);
  background: rgba(226,252,213,0.90);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease);
}
.page--child-notes .miniBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.16);
}
.page--child-notes .miniBtn:active{ transform: translateY(1px); }

.page--child-notes .miniBtn--ghost{
  background: rgba(241,248,254,0.92);
}

/* Bottom spacing */
.page--child-notes .bottomBar{
  margin-top: 16px;
  display: grid;
  gap: 18px;
  padding-bottom: 24px;
}
@supports (padding: env(safe-area-inset-bottom)){
  .page--child-notes .bottomBar{
    padding-bottom: calc(24px + env(safe-area-inset-bottom));
  }
}
@media (min-width: 720px){
  .page--child-notes .bottomBar{
    grid-template-columns: 1fr 1fr;
  }
}
/* =========================
   Special Instructions – Layout Fix (Scoped)
========================= */

/* Make textarea look like a premium input card (not a thin line) */
.page--child-notes .noteBox{
  padding: 14px;
  border-radius: 20px;
}

/* Force a proper height so it never collapses */
.page--child-notes textarea{
  min-height: 170px;     /* 👈 key fix */
  resize: none;          /* feels like an app */
  padding: 2px 2px;
}

/* Footer actions aligned and not cramped */
.page--child-notes .noteFooter{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
}

/* Make action pills equal and tidy */
.page--child-notes .noteFooter .miniBtn{
  height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  min-width: 120px;
}

/* Ghost button looks intentional */
.page--child-notes .miniBtn--ghost{
  background: rgba(241,248,254,0.92);
  border-color: rgba(9,93,127,0.14);
}

/* Keep bottom bar always two buttons on mobile too (no weird single button layout) */
.page--child-notes .bottomBar.bottomBar--two{
  display: grid;
  grid-template-columns: 1fr 1fr;  /* 👈 forces Back + Continue */
  gap: 14px;
}

/* If screen is very narrow, stack but keep spacing */
@media (max-width: 340px){
  .page--child-notes .bottomBar.bottomBar--two{
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
/* =========================
   Special Instructions – Premium Fix (Scoped)
========================= */

/* Give the whole note panel a clearer structure */
.page--child-notes .panel--note{
  padding: 0; /* we will pad inside noteCard */
  border: 0;
  background: transparent;
  box-shadow: none;
}

/* The actual card */
.page--child-notes .noteCard{
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 22px;
  padding: 14px;
  box-shadow: 0 18px 40px rgba(9,93,127,0.10);
}

/* Header layout */
.page--child-notes .noteCard__head{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

/* Counter pill looks premium */
.page--child-notes .counter{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.82);
  background: rgba(226,252,213,0.80);
  border: 1px solid rgba(9,93,127,0.12);
  border-radius: 999px;
  padding: 7px 10px;
  white-space: nowrap;
}

/* Textarea container becomes a real input card */
.page--child-notes .noteCard__input{
  border-radius: 20px;
  border: 1px solid rgba(9,93,127,0.16);
  background: rgba(241,248,254,0.92);
  padding: 12px;
  transition: box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
}

.page--child-notes .noteCard__input:focus-within{
  background: rgba(226,252,213,0.55);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
  border-color: rgba(9,93,127,0.26);
}

/* Force proper height + clean typography */
.page--child-notes .noteCard__input textarea{
  width: 100%;
  min-height: 170px;   /* key */
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 800;
  color: rgba(9,93,127,0.95);
  font-size: 14px;
  line-height: 1.5;
  resize: none;        /* app feel */
}

.page--child-notes .noteCard__input textarea::placeholder{
  color: rgba(9,93,127,0.45);
  font-weight: 800;
}

/* Actions aligned, not floating */
.page--child-notes .noteCard__actions{
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.page--child-notes .noteCard__actions .miniBtn{
  height: 42px;
  border-radius: 999px;
  width: 100%;
  justify-content: center;
}

/* Ghost button looks subtle */
.page--child-notes .miniBtn--ghost{
  background: rgba(241,248,254,0.92);
  border: 1px solid rgba(9,93,127,0.14);
}

/* Make the chips panel look less cramped */
.page--child-notes .noteChips{
  margin-top: 12px;
}

/* Bottom buttons: always clean and spaced */
.page--child-notes .bottomBar.bottomBar--two{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media (max-width: 360px){
  .page--child-notes .bottomBar.bottomBar--two{
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
/* =========================
   Child Care – Matching (Scoped)
========================= */
.page--child-match .matchWrap{
  min-height: calc(100vh - 72px);
  display: grid;
  align-content: start;
  gap: 14px;
  padding-bottom: 24px;
}

.page--child-match .matchHero{
  margin-top: 10px;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 22px;
  padding: 18px 16px;
  box-shadow: 0 18px 40px rgba(9,93,127,0.10);
  position: relative;
  overflow: hidden;
  text-align: center;
}

.page--child-match .matchRing{
  width: 120px;
  height: 120px;
  margin: 10px auto 0;
  border-radius: 999px;
  border: 3px solid rgba(226,252,213,0.95);
  box-shadow: 0 0 0 10px rgba(226,252,213,0.35);
  animation: ringSpin 1.2s linear infinite;
}

.page--child-match .matchPulse{
  position: absolute;
  left: 50%;
  top: 44px;
  width: 140px;
  height: 140px;
  transform: translateX(-50%);
  border-radius: 999px;
  background: radial-gradient(circle, rgba(226,252,213,0.55), transparent 60%);
  animation: pulse 1.2s var(--ease) infinite;
  pointer-events: none;
}

.page--child-match .matchIcon{
  position: absolute;
  left: 50%;
  top: 78px;
  transform: translateX(-50%);
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  border: 1px solid rgba(226,252,213,0.35);
  box-shadow: 0 16px 34px rgba(9,93,127,0.22);
}

.page--child-match .matchTitle{
  margin-top: 16px;
  font-size: 18px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

.page--child-match .matchSub{
  margin-top: 6px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(9,93,127,0.72);
}

/* Summary card */
.page--child-match .matchSummary{
  background: rgba(241,248,254,0.92);
  border: 1px solid rgba(9,93,127,0.12);
  border-radius: 22px;
  padding: 14px;
  box-shadow: 0 14px 28px rgba(9,93,127,0.08);
}

.page--child-match .matchSummary__row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 8px;
  border-radius: 14px;
}
.page--child-match .matchSummary__row + .matchSummary__row{
  margin-top: 6px;
}

.page--child-match .msLabel{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.70);
}
.page--child-match .msValue{
  font-size: 13px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  text-align: right;
}

.page--child-match .bottomBar{
  display: grid;
  gap: 18px;
  padding-bottom: 24px;
}
@supports (padding: env(safe-area-inset-bottom)){
  .page--child-match .bottomBar{
    padding-bottom: calc(24px + env(safe-area-inset-bottom));
  }
}

/* Animations */
@keyframes ringSpin{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}
@keyframes pulse{
  0%{ transform: translateX(-50%) scale(0.96); opacity: .75; }
  50%{ transform: translateX(-50%) scale(1.02); opacity: 1; }
  100%{ transform: translateX(-50%) scale(0.96); opacity: .75; }
}
/* =========================
   Child Care – Results List (Scoped)
========================= */
.page--child-results .resultsHead{
  margin-top: 6px;
}
.page--child-results .resultsHead__title{
  margin: 0;
}
.page--child-results .resultsHead__sub{
  margin: 6px 0 0;
  font-size: 13px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}

/* Sticky tools */
.page--child-results .resultsTools{
  margin-top: 12px;
  position: sticky;
  top: 62px;
  z-index: 5;
  background: rgba(241,248,254,0.92);
  border: 1px solid rgba(9,93,127,0.12);
  border-radius: 22px;
  padding: 12px;
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
  backdrop-filter: blur(8px);
}

.page--child-results .searchShell{
  height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.95);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  transition: box-shadow 240ms var(--ease), border-color 240ms var(--ease), transform 240ms var(--ease);
}
.page--child-results .searchShell:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
}
.page--child-results .searchShell:focus-within{
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
  border-color: rgba(9,93,127,0.22);
}

.page--child-results .searchShell__icon{
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(241,248,254,0.95);
  border: 1px solid rgba(9,93,127,0.10);
  color: rgba(9,93,127,0.95);
}

.page--child-results .searchInput{
  width: 100%;
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  font-size: 14px;
}
.page--child-results .searchInput::placeholder{
  color: rgba(9,93,127,0.45);
  font-weight: 800;
}

.page--child-results .toolsRow{
  margin-top: 10px;
  display: grid;
  gap: 10px;
}
@media (min-width: 720px){
  .page--child-results .toolsRow{
    grid-template-columns: 1fr auto;
    align-items: center;
  }
}

.page--child-results .chipRow{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.page--child-results .filterChip{
  height: 38px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.94);
  color: rgba(9,93,127,0.92);
  font-weight: 900;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease);
  position: relative;
  overflow: hidden;
}
.page--child-results .filterChip:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.12);
}
.page--child-results .filterChip.is-selected{
  background: rgba(226,252,213,0.95);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
}

/* Sort */
.page--child-results .sortShell{
  height: 42px;
  border-radius: 16px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.94);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  justify-content: space-between;
}
.page--child-results .sortShell__label{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.70);
}
.page--child-results .sortSelect{
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

/* Cards */
.page--child-results .resultsList{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}

.page--child-results .cgCard{
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 18px 40px rgba(9,93,127,0.10);
  padding: 12px;
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 12px;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease);
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
}
.page--child-results .cgCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 46px rgba(9,93,127,0.14);
  border-color: rgba(9,93,127,0.22);
}
.page--child-results .cgCard:active{
  transform: translateY(1px) scale(0.995);
}

.page--child-results .cgCard__media{
  display: grid;
  place-items: center;
}
.page--child-results .cgAvatar{
  width: 62px;
  height: 62px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.80);
  border: 1px solid rgba(9,93,127,0.12);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
}

.page--child-results .cgTop{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}
.page--child-results .cgName{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--child-results .cgPrice{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--child-results .cgPrice span{
  font-weight: 800;
  font-size: 12px;
  color: rgba(9,93,127,0.70);
}

.page--child-results .cgMeta{
  margin-top: 6px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
  color: rgba(9,93,127,0.75);
}
.page--child-results .cgRating{
  color: rgba(9,93,127,0.95);
}
.page--child-results .cgDot{
  opacity: .6;
}

.page--child-results .cgBadges{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.page--child-results .badge{
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.90);
  font-weight: 900;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
}
.page--child-results .badge--mint{
  background: rgba(226,252,213,0.95);
  border-color: rgba(9,93,127,0.18);
}

.page--child-results .cgActions{
  margin-top: 12px;
  display: flex;
  gap: 10px;
}
.page--child-results .miniCta{
  height: 38px;
  padding: 0 12px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  font-weight: 900;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease);
}
.page--child-results .miniCta:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.16);
}
.page--child-results .miniCta--ghost{
  background: rgba(241,248,254,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  color: rgba(9,93,127,0.92);
}

/* breathing room at end */
.page--child-results .bottomPad{
  height: 18px;
}
/* =========================
   Results List – Compact care.com-like (Scoped)
========================= */
.page--child-results .resultsTop{
  margin-top: 6px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.page--child-results .rtH1{
  margin: 0;
  font-size: 18px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--child-results .rtSub{
  margin: 6px 0 0;
  font-size: 12.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.72);
}

.page--child-results .tinyBtn{
  height: 34px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.92);
  font-weight: 900;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
}
.page--child-results .tinyBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.10);
}
.page--child-results .tinyBtn__icon{
  margin-right: 6px;
  opacity: .85;
}

/* Location pill */
.page--child-results .locPill{
  margin-top: 10px;
  width: 100%;
  height: 44px;
  border-radius: 16px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.95);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  cursor: pointer;
  box-shadow: 0 12px 24px rgba(9,93,127,0.06);
}
.page--child-results .locDot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(226,252,213,0.95);
  border: 2px solid rgba(9,93,127,0.55);
}
.page--child-results .locPill__text{
  flex: 1;
  text-align: left;
  font-weight: 900;
  color: rgba(9,93,127,0.92);
}
.page--child-results .locPill__chev{
  color: rgba(9,93,127,0.70);
  font-weight: 900;
}

/* Compact search */
.page--child-results .searchShell--compact{
  margin-top: 10px;
  height: 46px;
  border-radius: 16px;
}
.page--child-results .searchShell--compact .searchShell__icon{
  width: 30px;
  height: 30px;
  border-radius: 12px;
}
.page--child-results .searchShell--compact .searchInput{
  font-size: 13.5px;
}

/* Chips + sort */
.page--child-results .chipRow--compact{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.page--child-results .filterChip--compact{
  height: 34px;
  padding: 0 10px;
  font-size: 12.5px;
}
.page--child-results .sortShell--compact{
  height: 34px;
  border-radius: 999px;
  padding: 0 10px;
  margin-left: auto;
}
.page--child-results .sortShell--compact .sortSelect{
  font-size: 12.5px;
}

/* Compact list */
.page--child-results .resultsList--compact{
  margin-top: 12px;
  display: grid;
  gap: 12px;
}

/* New compact card */
.page--child-results .cgCard2{
  border-radius: 20px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 16px 34px rgba(9,93,127,0.10);
  padding: 12px;
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 12px;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), border-color 220ms var(--ease);
  -webkit-tap-highlight-color: transparent;
}
.page--child-results .cgCard2:hover{
  transform: translateY(-2px);
  box-shadow: 0 20px 40px rgba(9,93,127,0.14);
  border-color: rgba(9,93,127,0.22);
}

.page--child-results .cgAvatar2{
  width: 52px;
  height: 52px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.80);
  border: 1px solid rgba(9,93,127,0.12);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
  font-size: 13px;
}

.page--child-results .cgHead{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.page--child-results .cgName2{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

/* Heart (compact) */
.page--child-results .heartBtn{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.90);
  font-weight: 900;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--child-results .heartBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.12);
}
.page--child-results .heartBtn:active{ transform: translateY(1px) scale(0.99); }

.page--child-results .cgMeta2{
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.72);
}
.page--child-results .cgStars{ color: rgba(9,93,127,0.95); }
.page--child-results .cgDot{ opacity: .6; }

/* Bullet highlights like care.com */
.page--child-results .cgBullets{
  margin: 10px 0 0;
  padding-left: 16px;
  display: grid;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.80);
}
.page--child-results .cgBullets li{
  list-style: none;
  position: relative;
  padding-left: 16px;
}
.page--child-results .cgBullets li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: rgba(9,93,127,0.92);
  font-weight: 900;
}

/* footer row */
.page--child-results .cgFoot{
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

/* rate tag */
.page--child-results .rateTag{
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(226,252,213,0.85);
  border: 1px solid rgba(9,93,127,0.12);
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  display: inline-flex;
  align-items: center;
}

/* Next button compact */
.page--child-results .miniNext{
  height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  font-weight: 900;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
}
.page--child-results .miniNext:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.16);
}
/* =========================
   Results – Modern card upgrade (Scoped)
========================= */

/* Remove any layout reliance on header button */
.page--child-results .resultsTop{
  margin-top: 6px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

/* Search slightly cleaner */
.page--child-results .searchShell--compact{
  margin-top: 12px;
  background: rgba(255,255,255,0.96);
}

/* Make the whole list feel airy but compact */
.page--child-results .resultsList--compact{
  margin-top: 14px;
  gap: 14px;
}

/* Card: more premium surface */
.page--child-results .cgCard2{
  padding: 14px;
  border-radius: 22px;
  box-shadow: 0 18px 44px rgba(9,93,127,0.10);
  grid-template-columns: 56px 1fr;
}

/* Avatar: softer + more modern */
.page--child-results .cgAvatar2{
  width: 54px;
  height: 54px;
  border-radius: 20px;
  background: rgba(226,252,213,0.88);
  box-shadow: inset 0 0 0 1px rgba(9,93,127,0.10);
}

/* Heart button: more modern icon feel */
.page--child-results .heartBtn{
  width: 36px;
  height: 36px;
  border-radius: 14px;
  background: rgba(255,255,255,0.96);
  box-shadow: 0 12px 24px rgba(9,93,127,0.08);
}

/* Better hierarchy */
.page--child-results .cgName2{
  font-size: 14.5px;
  letter-spacing: -0.01em;
}

/* Meta line a bit calmer */
.page--child-results .cgMeta2{
  margin-top: 5px;
  font-size: 12.5px;
}

/* Bullets: cleaner, less heavy */
.page--child-results .cgBullets{
  margin-top: 10px;
  gap: 7px;
  font-size: 12.5px;
  color: rgba(9,93,127,0.78);
}
.page--child-results .cgBullets li{
  padding-left: 18px;
}
.page--child-results .cgBullets li::before{
  content: "✓";
  opacity: 0.9;
}

/* Footer: align rate + view nicely */
.page--child-results .cgFoot{
  margin-top: 12px;
}

/* Rate tag: looks like a modern pill chip */
.page--child-results .rateTag{
  height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(226,252,213,0.92);
  box-shadow: 0 10px 20px rgba(9,93,127,0.08);
}

/* View button: compact but premium */
.page--child-results .miniNext{
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  box-shadow: 0 14px 28px rgba(9,93,127,0.14);
}
.page--child-results .miniNext:active{
  transform: translateY(1px) scale(0.99);
}
/* =========================
   Child Care – Caregiver Profile (Scoped)
========================= */
.page--cg-profile .topbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.page--cg-profile .iconBtn--back{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
}
.page--cg-profile .iconBtn--back:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.10);
}
.page--cg-profile .brand--center{
  flex: 1;
  display: flex;
  justify-content: center;
}

/* Hero */
.page--cg-profile .cgHero{
  margin-top: 10px;
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 18px 44px rgba(9,93,127,0.10);
  padding: 14px;
}
.page--cg-profile .cgHero__top{
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 12px;
  align-items: start;
}
.page--cg-profile .cgPhoto{
  width: 64px;
  height: 64px;
  border-radius: 22px;
  background: rgba(226,252,213,0.88);
  border: 1px solid rgba(9,93,127,0.12);
  display: grid;
  place-items: center;
}
.page--cg-profile .cgInitials{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--cg-profile .cgNameRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.page--cg-profile .cgName{
  margin: 0;
  font-size: 18px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--cg-profile .heartBtn--profile{
  width: 38px;
  height: 38px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.92);
  font-weight: 900;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
}
.page--cg-profile .heartBtn--profile:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.12);
}

.page--cg-profile .cgMetaLine{
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.72);
}
.page--cg-profile .cgStars{ color: rgba(9,93,127,0.95); }
.page--cg-profile .cgDot{ opacity: .6; }
.page--cg-profile .cgTiny{ white-space: nowrap; }

.page--cg-profile .cgBadgesLine{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.page--cg-profile .cgHero__about{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(9,93,127,0.10);
}
.page--cg-profile .cgSectionTitle{
  margin: 0;
  font-size: 13px;
  font-weight: 900;
  color: rgba(9,93,127,0.88);
}
.page--cg-profile .cgAbout{
  margin-top: 8px;
  font-size: 13.5px;
  font-weight: 750;
  color: rgba(9,93,127,0.78);
  line-height: 1.45;
}

/* Panels */
.page--cg-profile .cgPanel{
  margin-top: 12px;
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(241,248,254,0.92);
  box-shadow: 0 14px 28px rgba(9,93,127,0.08);
  padding: 14px;
}
.page--cg-profile .cgPanelHead{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.page--cg-profile .pillTag{
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(226,252,213,0.90);
  border: 1px solid rgba(9,93,127,0.12);
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

/* Check list */
.page--cg-profile .cgChecks{
  margin: 10px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
  color: rgba(9,93,127,0.82);
  font-weight: 800;
  font-size: 12.5px;
}
.page--cg-profile .cgChecks li{
  list-style: none;
  padding-left: 18px;
  position: relative;
}
.page--cg-profile .cgChecks li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 900;
  color: rgba(9,93,127,0.92);
}

/* Availability */
.page--cg-profile .availGrid{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.page--cg-profile .availChip{
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.95);
  font-weight: 900;
  font-size: 12px;
  color: rgba(9,93,127,0.82);
}
.page--cg-profile .availChip.is-on{
  background: rgba(226,252,213,0.92);
  color: rgba(9,93,127,0.95);
}

/* Reviews */
.page--cg-profile .reviewCard{
  margin-top: 10px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.10);
  background: rgba(255,255,255,0.95);
  padding: 12px;
}
.page--cg-profile .reviewTop{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.page--cg-profile .reviewer{
  font-weight: 900;
  color: rgba(9,93,127,0.90);
}
.page--cg-profile .reviewStars{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.85);
}
.page--cg-profile .reviewText{
  margin-top: 8px;
  font-size: 13px;
  font-weight: 750;
  color: rgba(9,93,127,0.78);
  line-height: 1.45;
}

/* Sticky CTA bar */
.page--cg-profile .ctaBar{
  position: sticky;
  bottom: 0;
  z-index: 10;
  background: rgba(241,248,254,0.95);
  border-top: 1px solid rgba(9,93,127,0.12);
  padding: 10px 12px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  box-shadow: 0 -18px 40px rgba(9,93,127,0.10);
}
.page--cg-profile .ctaBtn{
  height: 44px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  font-weight: 900;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
}
.page--cg-profile .ctaBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.14);
}
.page--cg-profile .ctaBtn--ghost{
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  color: rgba(9,93,127,0.92);
}

/* give content room above sticky bar */
.page--cg-profile .bottomPad{
  height: 70px;
}
/* =========================
   Profile – Trust & Availability Polish
========================= */

/* TRUST BOX */
.page--cg-profile .trustBox{
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 18px;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.12);
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
}

.page--cg-profile .trustItem{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

.page--cg-profile .trustIcon{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid rgba(9,93,127,0.12);
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

/* AVAILABILITY */
.page--cg-profile .availabilityBox{
  margin-top: 10px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(241,248,254,0.95); /* lighter */
  border: 1px solid rgba(9,93,127,0.10);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.page--cg-profile .availDay{
  min-width: 46px;
  height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.12);
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.65);
}

.page--cg-profile .availDay.is-on{
  background: rgba(226,252,213,0.95);
  border-color: rgba(9,93,127,0.20);
  color: rgba(9,93,127,0.95);
  box-shadow: 0 8px 18px rgba(9,93,127,0.10);
}
/* =========================
   Auth Gate / Login Modal (Scoped)
========================= */
.page--auth .authStage{
  min-height: calc(100vh - 72px);
  display: grid;
  place-items: center;
  padding: 18px 14px 24px;
  position: relative;
}

/* Soft background */
.page--auth .authBg{
  position: fixed;
  inset: 0;
  background:
    radial-gradient(circle at 18% 18%, rgba(226,252,213,0.70), transparent 55%),
    radial-gradient(circle at 82% 22%, rgba(9,93,127,0.12), transparent 55%),
    radial-gradient(circle at 50% 88%, rgba(9,93,127,0.10), transparent 60%),
    rgba(241,248,254,0.92);
  z-index: 0;
}

/* Modal shell */
.page--auth .authModal{
  width: 100%;
  max-width: 420px;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 24px;
  padding: 14px;
  box-shadow: 0 24px 60px rgba(9,93,127,0.18);
  position: relative;
  z-index: 1;
  overflow: hidden;
  animation: authIn 420ms var(--ease) both;
}

/* subtle glow inside modal */
.page--auth .authModal::after{
  content:"";
  position: absolute;
  inset: -80px;
  background: radial-gradient(circle at 20% 20%, rgba(226,252,213,0.55), transparent 55%);
  pointer-events: none;
  opacity: .8;
}

.page--auth .authModal__top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  position: relative;
  z-index: 1;
}

.page--auth .authBadge{
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.85);
  border: 1px solid rgba(9,93,127,0.12);
  color: rgba(9,93,127,0.95);
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
}

.page--auth .authClose{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.92);
  font-weight: 900;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
  position: relative;
  z-index: 1;
}
.page--auth .authClose:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.10);
}

.page--auth .authTitle{
  margin: 10px 0 0;
  font-size: 20px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  position: relative;
  z-index: 1;
}
.page--auth .authSub{
  margin: 6px 0 0;
  font-size: 13.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
  position: relative;
  z-index: 1;
}

.page--auth .authProviders{
  margin-top: 14px;
  display: grid;
  gap: 10px;
  position: relative;
  z-index: 1;
}

/* Provider buttons */
.page--auth .providerBtn{
  height: 48px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  display: grid;
  grid-template-columns: 40px 1fr 24px;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
  text-align: left;
}
.page--auth .providerBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.12);
  background: rgba(226,252,213,0.45);
}
.page--auth .providerBtn:active{
  transform: translateY(1px) scale(0.995);
}

.page--auth .pIcon{
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.10);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
}
.page--auth .pIcon--solid{
  background: rgba(9,93,127,0.95);
  border-color: rgba(226,252,213,0.30);
  color: rgba(226,252,213,0.95);
}

.page--auth .pText{
  font-weight: 900;
  color: rgba(9,93,127,0.92);
  font-size: 14px;
}

.page--auth .pChev{
  font-weight: 900;
  color: rgba(9,93,127,0.60);
}

/* Divider */
.page--auth .authDivider{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  margin: 2px 0;
}
.page--auth .authDivider::before,
.page--auth .authDivider::after{
  content:"";
  height: 1px;
  background: rgba(9,93,127,0.12);
}
.page--auth .authDivider span{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.60);
}

.page--auth .authLegal{
  margin: 12px 0 0;
  font-size: 12px;
  font-weight: 700;
  color: rgba(9,93,127,0.68);
  position: relative;
  z-index: 1;
}
.page--auth .authLegal a{
  color: rgba(9,93,127,0.95);
  font-weight: 900;
  text-decoration: none;
  border-bottom: 1px solid rgba(9,93,127,0.18);
}

.page--auth .authFoot{
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
  color: rgba(9,93,127,0.75);
  position: relative;
  z-index: 1;
}
.page--auth .authLink{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  text-decoration: none;
  border-bottom: 1px solid rgba(9,93,127,0.18);
}

@keyframes authIn{
  from{ transform: translateY(10px) scale(0.985); opacity: 0; }
  to{ transform: translateY(0) scale(1); opacity: 1; }
}
/* =========================
   Auth Modal – Sleek & Alive (Override)
========================= */
.page--auth .authStage{
  min-height: calc(100vh - 72px);
  display: grid;
  place-items: center;
  padding: 18px 14px 26px;
  position: relative;
}

.page--auth .authModal{
  max-width: 420px;
  width: 100%;
  border-radius: 26px;
  padding: 16px;
  text-align: center; /* centered */
  position: relative;
  overflow: hidden;
}

/* Animated mint sheen */
.page--auth .authModal::before{
  content:"";
  position: absolute;
  inset: -120px;
  background: linear-gradient(120deg,
    transparent 0%,
    rgba(226,252,213,0.35) 35%,
    transparent 70%);
  transform: translateX(-30%);
  animation: sheen 4.2s var(--ease) infinite;
  pointer-events: none;
  opacity: .9;
}
@keyframes sheen{
  0%{ transform: translateX(-40%) rotate(8deg); }
  50%{ transform: translateX(40%) rotate(8deg); }
  100%{ transform: translateX(-40%) rotate(8deg); }
}

.page--auth .authTitle,
.page--auth .authSub,
.page--auth .authProviders,
.page--auth .authLegal,
.page--auth .authFoot,
.page--auth .authModal__top{
  position: relative;
  z-index: 1;
}

.page--auth .authModal__top{
  justify-content: space-between;
}

.page--auth .authTitle{
  margin-top: 10px;
  font-size: 20px;
}

.page--auth .authSub{
  margin-top: 6px;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}

/* Providers centered */
.page--auth .authProviders--center{
  margin-top: 14px;
  display: grid;
  gap: 10px;
}

/* New provider buttons */
.page--auth .providerBtn2{
  height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  display: grid;
  grid-template-columns: 44px 1fr 22px;
  align-items: center;
  padding: 0 12px;
  cursor: pointer;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease);
  text-align: left; /* readable */
  box-shadow: 0 14px 30px rgba(9,93,127,0.08);
}

.page--auth .providerBtn2:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 48px rgba(9,93,127,0.14);
  background: rgba(226,252,213,0.45);
}

.page--auth .providerBtn2:active{
  transform: translateY(1px) scale(0.995);
}

/* Icon container */
.page--auth .pMark{
  width: 38px;
  height: 38px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(241,248,254,0.95);
  border: 1px solid rgba(9,93,127,0.10);
  color: rgba(9,93,127,0.95);
}

.page--auth .pSvg{
  width: 20px;
  height: 20px;
}

.page--auth .pMark--brand{
  background: #ffffff;
}

.page--auth .pSvgBrand{
  width: 22px;
  height: 22px;
}

/* Text + chevron */
.page--auth .pText2{
  font-weight: 900;
  font-size: 14px;
  color: rgba(9,93,127,0.92);
}

.page--auth .pChev2{
  font-weight: 900;
  color: rgba(9,93,127,0.60);
  text-align: right;
}

/* Divider aligned */
.page--auth .authDivider2{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 10px;
  align-items: center;
  margin: 4px 0;
}
.page--auth .authDivider2::before,
.page--auth .authDivider2::after{
  content:"";
  height: 1px;
  background: rgba(9,93,127,0.12);
}
.page--auth .authDivider2 span{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.60);
}
/* =========================
   Auth Form (Email) – Premium
========================= */
.page--auth .authModal--form{
  text-align: left; /* forms read better left-aligned */
}

.page--auth .authToggle{
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.page--auth .toggleBtn{
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.80);
  font-weight: 900;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}

.page--auth .toggleBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
}

.page--auth .toggleBtn.is-active{
  background: rgba(226,252,213,0.92);
  color: rgba(9,93,127,0.95);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.65);
}

.page--auth .authForm{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}

.page--auth .field__label{
  display: block;
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.78);
  margin-bottom: 6px;
}

.page--auth .field__input{
  height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  display: grid;
  grid-template-columns: 40px 1fr 40px;
  align-items: center;
  padding: 0 10px;
  gap: 6px;
  box-shadow: 0 14px 30px rgba(9,93,127,0.08);
  transition: box-shadow 220ms var(--ease), border-color 220ms var(--ease), background 220ms var(--ease);
}

.page--auth .field__input:focus-within{
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
  background: rgba(226,252,213,0.25);
}

.page--auth .field__icon{
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(241,248,254,0.95);
  border: 1px solid rgba(9,93,127,0.10);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
}

.page--auth .field__input input{
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.92);
  font-size: 14px;
}

.page--auth .eyeBtn{
  width: 36px;
  height: 36px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(241,248,254,0.92);
  cursor: pointer;
  font-weight: 900;
  color: rgba(9,93,127,0.92);
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
}
.page--auth .eyeBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.10);
}

.page--auth .authSubmit{
  margin-top: 6px;
}

.page--auth .authLegal--tight{
  margin-top: 8px;
  text-align: center;
}

.page--auth .authFoot--tight{
  margin-top: 6px;
  text-align: center;
}

.page--auth .authLinkBtn{
  border: 0;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  cursor: pointer;
  border-bottom: 1px solid rgba(9,93,127,0.18);
  padding: 0;
}
/* =========================
   OTP UI – Premium
========================= */
.page--auth .field__input--split{
  grid-template-columns: 40px 1fr 0px;
}

.page--auth .selectInput{
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.92);
  font-size: 14px;
}

.page--auth .otpRow{
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
  margin-top: 6px;
}

.page--auth .otpBox{
  height: 54px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 14px 30px rgba(9,93,127,0.08);
  text-align: center;
  font-weight: 900;
  font-size: 18px;
  color: rgba(9,93,127,0.95);
  outline: none;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), border-color 220ms var(--ease), background 220ms var(--ease);
}
.page--auth .otpBox:focus{
  transform: translateY(-1px);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
  background: rgba(226,252,213,0.20);
}

.page--auth .otpHelp{
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.page--auth .linkBtn{
  border: 0;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.90);
  cursor: pointer;
  padding: 6px 0;
  border-bottom: 1px solid rgba(9,93,127,0.16);
}
.page--auth .linkBtn:disabled{
  opacity: .5;
  cursor: not-allowed;
  border-bottom-color: transparent;
}

@media (max-width: 360px){
  .page--auth .otpRow{ gap: 8px; }
  .page--auth .otpBox{ height: 50px; border-radius: 16px; }
}
/* =========================
   Messaging Screen
========================= */
.page--messages{
  background: rgba(241,248,254,0.95);
}

/* Header */
.page--messages .chatHeader{
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
}
.page--messages .chatAvatar{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: rgba(226,252,213,0.95);
  display: grid;
  place-items: center;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--messages .chatName{
  font-weight: 900;
  font-size: 14px;
}
.page--messages .chatStatus{
  font-size: 12px;
  color: rgba(9,93,127,0.65);
}

/* Chat body */
.page--messages .chatStage{
  padding: 10px 12px 76px;
}
.page--messages .chatBody{
  min-height: calc(100vh - 150px);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Empty */
.page--messages .chatEmpty{
  margin: auto;
  text-align: center;
  color: rgba(9,93,127,0.7);
}
.page--messages .chatEmptyIcon{
  font-size: 32px;
  margin-bottom: 6px;
}

/* Messages */
.page--messages .msg{
  display: flex;
}
.page--messages .msg--me{
  justify-content: flex-end;
}
.page--messages .msgBubble{
  max-width: 78%;
  padding: 10px 12px;
  border-radius: 18px;
  font-size: 13.5px;
  line-height: 1.4;
}
.page--messages .msg--me .msgBubble{
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  border-bottom-right-radius: 6px;
}
.page--messages .msg--them .msgBubble{
  background: #ffffff;
  border: 1px solid rgba(9,93,127,0.12);
  color: rgba(9,93,127,0.9);
  border-bottom-left-radius: 6px;
}

/* Composer */
.page--messages .chatComposer{
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px;
  display: flex;
  gap: 8px;
  background: rgba(255,255,255,0.95);
  border-top: 1px solid rgba(9,93,127,0.12);
}
.page--messages .chatComposer textarea{
  flex: 1;
  resize: none;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  padding: 10px 12px;
  font-size: 13.5px;
}
.page--messages .sendBtn{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  border: 0;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-weight: 900;
  cursor: pointer;
}
.page--auth .providerBtn2--demo{
  background: rgba(226,252,213,0.55);
  border-color: rgba(9,93,127,0.18);
}
.page--auth .providerBtn2--demo:hover{
  background: rgba(226,252,213,0.75);
}
/* =========================
   Messaging Header – Focus Mode
========================= */
.page--messages .topbar--chat{
  display: flex;
  align-items: center;
  gap: 12px;
}

.page--messages .chatHeader{
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
}

.page--messages .iconBtn--back{
  flex-shrink: 0;
}
/* =========================
   Messaging Header – Balanced + Premium
========================= */
.page--messages .topbar--chat{
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(255,255,255,0.92);
  border-bottom: 1px solid rgba(9,93,127,0.10);
}

.page--messages .iconBtn--chatInfo{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.92);
  font-weight: 900;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease);
}
.page--messages .iconBtn--chatInfo:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.10);
}

/* Center block gets an intentional “pill” feel */
.page--messages .chatHeader{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  border-radius: 16px;
  background: rgba(241,248,254,0.90);
  border: 1px solid rgba(9,93,127,0.10);
  box-shadow: 0 10px 22px rgba(9,93,127,0.06);
  overflow: hidden;
}

.page--messages .chatAvatar{
  width: 36px;
  height: 36px;
  border-radius: 14px;
  background: rgba(226,252,213,0.95);
  display: grid;
  place-items: center;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  flex-shrink: 0;
}

.page--messages .chatMeta{
  min-width: 0;
}

.page--messages .chatName{
  font-weight: 900;
  font-size: 13.5px;
  color: rgba(9,93,127,0.95);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page--messages .chatStatus{
  font-size: 11.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.62);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* =========================
   Request Care Flow
========================= */
.page--request{
  background: rgba(241,248,254,0.95);
}

.page--request .topbar--request{
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(255,255,255,0.92);
  border-bottom: 1px solid rgba(9,93,127,0.10);
}

.page--request .topTitle__h{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  font-size: 14.5px;
}
.page--request .topTitle__s{
  margin-top: 2px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
}

.page--request .reqCard{
  margin-top: 12px;
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 18px 44px rgba(9,93,127,0.10);
  padding: 14px;
}

.page--request .reqCard--soft{
  background: rgba(226,252,213,0.30);
}

.page--request .reqCg{
  display: flex;
  align-items: center;
  gap: 10px;
}

.page--request .reqAvatar{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  background: rgba(226,252,213,0.95);
  display: grid;
  place-items: center;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

.page--request .reqCgName{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

.page--request .reqCgSub{
  margin-top: 2px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
}

.page--request .reqRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid rgba(9,93,127,0.08);
}
.page--request .reqRow:first-child{ border-top: 0; padding-top: 0; }

.page--request .reqLabel{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.70);
}
.page--request .reqValue{
  font-size: 12.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  text-align: right;
}
.page--request .reqValue--note{
  font-weight: 800;
  color: rgba(9,93,127,0.78);
}

.page--request .reqNoteHead{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.page--request .reqHint{
  margin-top: 3px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.62);
}

.page--request .counterPill{
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(241,248,254,0.92);
  border: 1px solid rgba(9,93,127,0.12);
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.80);
  white-space: nowrap;
}

.page--request .reqTextarea{
  margin-top: 10px;
  width: 100%;
  min-height: 110px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  padding: 12px;
  font-size: 13.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.88);
  outline: none;
  transition: box-shadow 220ms var(--ease), border-color 220ms var(--ease), background 220ms var(--ease);
}
.page--request .reqTextarea:focus{
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
  background: rgba(226,252,213,0.22);
}

.page--request .quickChips{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.page--request .qc{
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.95);
  color: rgba(9,93,127,0.90);
  font-weight: 900;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--request .qc:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
  background: rgba(226,252,213,0.40);
}

/* Confirm */
.page--request .confirmTop{
  display: flex;
  align-items: center;
  gap: 10px;
}
.page--request .confirmMeta{ min-width: 0; }
.page--request .confirmBox{
  margin-top: 12px;
  border-radius: 18px;
  background: rgba(241,248,254,0.92);
  border: 1px solid rgba(9,93,127,0.10);
  padding: 10px 12px;
}

.page--request .agreeRow{
  margin-top: 12px;
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 12.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.78);
}

.page--request .stepsMini{
  margin: 10px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.page--request .stepsMini li{
  list-style: none;
  padding-left: 18px;
  position: relative;
  font-weight: 800;
  color: rgba(9,93,127,0.82);
}
.page--request .stepsMini li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 900;
  color: rgba(9,93,127,0.92);
}

/* Bottom padding */
.page--request .bottomPad{ height: 80px; }
/* =========================
   Request flow CTA – Fix & Perfect
========================= */
.page--request .ctaBar--sticky{
  position: sticky;
  bottom: 0;
  z-index: 20;
  background: rgba(241,248,254,0.96);
  border-top: 1px solid rgba(9,93,127,0.12);
  box-shadow: 0 -18px 44px rgba(9,93,127,0.10);
  padding: 10px 12px;
}

.page--request .ctaBtn--primary{
  width: 100%;
  height: 50px;
  border: 0;
  border-radius: 999px;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.96);
  font-weight: 900;
  font-size: 14px;
  letter-spacing: 0.2px;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), filter 220ms var(--ease);
}

.page--request .ctaBtn--primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.18);
}

.page--request .ctaBtn--primary:active{
  transform: translateY(1px) scale(0.995);
  box-shadow: 0 10px 22px rgba(9,93,127,0.14);
}

.page--request .ctaBtn--primary:disabled{
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(0.1);
  box-shadow: none;
  transform: none;
}
/* =========================
   Verified mini badge (premium)
========================= */
.page--request .reqCgMeta{
  flex: 1;
  min-width: 0;
}

.page--request .reqCgNameRow{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.page--request .verifyMini{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  padding: 0 9px;
  border-radius: 999px;
  background: rgba(226,252,213,0.70);
  border: 1px solid rgba(9,93,127,0.12);
  font-size: 11.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  white-space: nowrap;
  box-shadow: 0 10px 20px rgba(9,93,127,0.08);
}

.page--request .verifyIcon{
  width: 16px;
  height: 16px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-size: 11px;
  line-height: 1;
}
.page--request .quickChips{ margin-bottom: 6px; }
/* =========================
   Request – Caregiver header alignment (Perfect)
========================= */
.page--request .reqCg{
  align-items: center;
}

.page--request .reqCgMeta{
  flex: 1;
  min-width: 0;
  display: grid;
  gap: 4px; /* tighter */
}

.page--request .reqCgTopLine{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.page--request .reqCgName{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page--request .reqCgSub{
  margin: 0;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
  line-height: 1.1;
}

/* Slightly smaller, cleaner badge */
.page--request .verifyMini{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 20px;              /* smaller */
  padding: 0 8px;            /* tighter */
  border-radius: 999px;
  background: rgba(226,252,213,0.70);
  border: 1px solid rgba(9,93,127,0.12);
  font-size: 11px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  white-space: nowrap;
  box-shadow: 0 10px 18px rgba(9,93,127,0.07);
}

.page--request .verifyIcon{
  width: 14px;
  height: 14px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-size: 10px;
  line-height: 1;
}
/* =========================
   Request – Verified badge (Right-aligned, correct)
========================= */
.page--request .reqCg{
  display: flex;
  align-items: center;
  gap: 12px;
}

.page--request .reqCgMeta{
  flex: 1;
  min-width: 0;
}

.page--request .reqCgName{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  line-height: 1.15;
}

.page--request .reqCgSub{
  margin-top: 3px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
  line-height: 1.15;
}

/* Verified badge on far right */
.page--request .verifyMini--right{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(226,252,213,0.65);
  border: 1px solid rgba(9,93,127,0.12);
  font-size: 11.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  white-space: nowrap;
  box-shadow: 0 8px 18px rgba(9,93,127,0.07);
}

/* Tiny trust icon */
.page--request .verifyMini--right .verifyIcon{
  width: 14px;
  height: 14px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-size: 10px;
  line-height: 1;
}
/* =========================
   Payment Screen
========================= */
.page--pay{
  background: rgba(241,248,254,0.95);
}

.page--pay .topbar--pay{
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(255,255,255,0.92);
  border-bottom: 1px solid rgba(9,93,127,0.10);
}

.page--pay .payTrust{
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.page--pay .trustChip{
  height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.10);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 900;
  font-size: 12px;
  color: rgba(9,93,127,0.90);
}

.page--pay .tDot{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-size: 12px;
  line-height: 1;
}

.page--pay .payCard{
  margin-top: 12px;
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 18px 44px rgba(9,93,127,0.10);
  padding: 14px;
}

.page--pay .payCard__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
}

.page--pay .payCard__title,
.page--pay .payCard__title{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

.page--pay .payHint{
  margin: 6px 0 0;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
}

.page--pay .payRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid rgba(9,93,127,0.08);
}
.page--pay .payRow:first-child{ border-top: 0; padding-top: 0; }

.page--pay .payLabel{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.70);
}
.page--pay .payValue{
  font-size: 12.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  text-align: right;
}

/* Plans */
.page--pay .planGrid{
  margin-top: 12px;
  display: grid;
  gap: 10px;
}

.page--pay .planOption{
  border-radius: 20px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  padding: 12px;
  cursor: pointer;
  display: block;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}

.page--pay .planOption input{ display:none; }

.page--pay .planOption:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.12);
  background: rgba(226,252,213,0.35);
}

.page--pay .planOption.is-on{
  background: rgba(226,252,213,0.55);
  border-color: rgba(9,93,127,0.18);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
}

.page--pay .planTop{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.page--pay .planName{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

.page--pay .planPill{
  height: 22px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.10);
  font-weight: 900;
  font-size: 11.5px;
  color: rgba(9,93,127,0.88);
}
.page--pay .planPill--alt{
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  border-color: rgba(9,93,127,0.20);
}

.page--pay .planPrice{
  margin-top: 8px;
  font-size: 22px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--pay .planPrice span{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.70);
}

.page--pay .planDesc{
  margin-top: 6px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
}

.page--pay .feeNote{
  margin-top: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 18px;
  background: rgba(226,252,213,0.35);
  border: 1px solid rgba(9,93,127,0.10);
  font-weight: 900;
  font-size: 12px;
  color: rgba(9,93,127,0.85);
}

/* Form grid */
.page--pay .payGrid2{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.page--pay .miniLock{
  font-size: 12px;
  opacity: .9;
}

.page--pay .payFine{
  margin-top: 10px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
  text-align: center;
}

/* Success */
.page--pay .paySuccess{
  margin-top: 18px;
  text-align: center;
}

.page--pay .successMark{
  width: 74px;
  height: 74px;
  margin: 0 auto 10px;
  border-radius: 24px;
  background: rgba(226,252,213,0.60);
  border: 1px solid rgba(9,93,127,0.12);
  display: grid;
  place-items: center;
  box-shadow: 0 22px 48px rgba(9,93,127,0.12);
}

.page--pay .successDot{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  display: grid;
  place-items: center;
  font-weight: 900;
}

.page--pay .successTitle{
  margin: 6px 0 0;
  font-size: 20px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

.page--pay .successSub{
  margin: 8px auto 0;
  max-width: 320px;
  font-size: 13px;
  font-weight: 800;
  color: rgba(9,93,127,0.70);
}

/* Ghost CTA */
.page--pay .ctaBtn--ghost{
  width: 100%;
  height: 50px;
  margin-top: 10px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  color: rgba(9,93,127,0.92);
  font-weight: 900;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--pay .ctaBtn--ghost:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.10);
  background: rgba(226,252,213,0.35);
}
/* =========================
   Payment – Premium Layout Fix
========================= */
.page--pay{
  background: rgba(241,248,254,0.95);
}

/* Premium header */
.page--pay .payTop{
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  gap: 10px;
  padding: 12px 12px;
  background: rgba(255,255,255,0.92);
  border-bottom: 1px solid rgba(9,93,127,0.10);
}
.page--pay .payTop__h{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  font-size: 15px;
  line-height: 1.1;
}
.page--pay .payTop__s{
  margin-top: 3px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
}
.page--pay .payTop__lock{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(226,252,213,0.45);
  display: grid;
  place-items: center;
}

/* Trust chips */
.page--pay .payTrust{
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.page--pay .trustChip{
  height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.10);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 900;
  font-size: 12px;
  color: rgba(9,93,127,0.88);
  box-shadow: 0 12px 26px rgba(9,93,127,0.08);
}
.page--pay .trustIcon{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 12px;
  line-height: 1;
}
.page--pay .trustIcon--green{ background: #22C55E; } /* icon-only color OK */
.page--pay .trustIcon--blue{ background: #3B82F6; }
.page--pay .trustIcon--amber{ background: #F59E0B; }

/* Cards */
.page--pay .payCard{
  margin-top: 12px;
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 18px 44px rgba(9,93,127,0.10);
  padding: 14px;
}
.page--pay .payCard--soft{
  background: rgba(226,252,213,0.22);
}

.page--pay .payCard__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
}

.page--pay .payCard__title{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}

/* Verified badge */
.page--pay .verifiedBadge{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(226,252,213,0.65);
  border: 1px solid rgba(9,93,127,0.12);
  font-weight: 900;
  font-size: 11.5px;
  color: rgba(9,93,127,0.95);
  white-space: nowrap;
}
.page--pay .vDot{
  width: 14px;
  height: 14px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-size: 10px;
}

/* Rows */
.page--pay .payRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid rgba(9,93,127,0.08);
}
.page--pay .payRow:first-child{ border-top: 0; padding-top: 0; }

.page--pay .payRow--note .payValue{ font-weight: 800; }
.page--pay .payRow--total .payLabel,
.page--pay .payRow--total .payValue{
  font-size: 13px;
  font-weight: 900;
}

.page--pay .payLabel{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.70);
}
.page--pay .payValue{
  font-size: 12.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  text-align: right;
}
.page--pay .payValue--muted{
  color: rgba(9,93,127,0.70);
}

/* Divider mini */
.page--pay .dividerMini{
  height: 1px;
  background: rgba(9,93,127,0.10);
  margin: 6px 0;
}

.page--pay .payHint--tight{
  margin-top: 8px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.70);
}

/* Plan options – keep but tighten */
.page--pay .planOption{
  border-radius: 20px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  padding: 12px;
  cursor: pointer;
  display: block;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--pay .planOption.is-on{
  background: rgba(226,252,213,0.55);
  border-color: rgba(9,93,127,0.18);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
}

/* Payment method inputs – make them match your premium style */
.page--pay .payForm .field__input{
  height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  display: grid;
  grid-template-columns: 40px 1fr 40px;
  align-items: center;
  padding: 0 10px;
  gap: 6px;
  box-shadow: 0 14px 30px rgba(9,93,127,0.08);
  transition: box-shadow 220ms var(--ease), border-color 220ms var(--ease), background 220ms var(--ease);
}
.page--pay .payForm .field__input:focus-within{
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.70);
  background: rgba(226,252,213,0.18);
}
.page--pay .payForm .field__icon{
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(241,248,254,0.95);
  border: 1px solid rgba(9,93,127,0.10);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
}
.page--pay .payForm input{
  border: 0;
  outline: none;
  background: transparent;
  font-weight: 900;
  color: rgba(9,93,127,0.92);
  font-size: 14px;
}
/* =========================
   Payment CTA – Perfect
========================= */
.page--pay .ctaBar--sticky{
  position: sticky;
  bottom: 0;
  z-index: 30;
  background: rgba(241,248,254,0.98);
  border-top: 1px solid rgba(9,93,127,0.12);
  box-shadow: 0 -18px 44px rgba(9,93,127,0.10);
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
}

.page--pay .ctaBtn--primary{
  width: 100%;
  height: 52px;
  border: 0;
  border-radius: 999px;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.96);
  font-weight: 900;
  font-size: 14px;
  letter-spacing: 0.2px;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), filter 220ms var(--ease);
}

.page--pay .ctaBtn--primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.18);
}

.page--pay .ctaBtn--primary:active{
  transform: translateY(1px) scale(0.995);
  box-shadow: 0 10px 22px rgba(9,93,127,0.14);
}

.page--pay .ctaBtn--primary:disabled{
  opacity: 0.6;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

.page--pay .ctaBtn--primary.is-loading{
  filter: brightness(1.02);
}
/* =========================
   Payment Expiry + CVC – FINAL ALIGNMENT FIX
========================= */
.page--pay .payGrid2{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.page--pay .field{
  display: flex;
  flex-direction: column;
}

.page--pay .field__label{
  font-size: 12px;
  font-weight: 900;
  margin-bottom: 6px;
  color: rgba(9,93,127,0.75);
}

.page--pay .field__input{
  height: 52px;
  display: grid;
  grid-template-columns: 36px 1fr 28px;
  align-items: center;
  padding: 0 10px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 14px 30px rgba(9,93,127,0.08);
}

.page--pay .field__icon{
  width: 28px;
  height: 28px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(241,248,254,0.95);
  border: 1px solid rgba(9,93,127,0.10);
  font-weight: 900;
}

.page--pay .field__trail{
  width: 18px;
  height: 18px;
}

.page--pay .field__input input{
  height: 100%;
  border: 0;
  outline: none;
  background: transparent;
  font-size: 14px;
  font-weight: 900;
  color: rgba(9,93,127,0.92);
}
/* =====================================================
   FORCE ALIGNMENT: Expiry + CVC (wins all conflicts)
   Put this at the VERY BOTTOM of styles.css
===================================================== */

.page--pay .payForm .payGrid2{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  align-items: start;
}

.page--pay .payForm .payGrid2 .field{
  margin: 0 !important;
}

.page--pay .payForm .payGrid2 .field__label{
  display: block;
  min-height: 16px;          /* forces same label height */
  margin: 0 0 6px 0 !important;
  line-height: 1.1;
}

/* 🔥 override the generic .payForm .field__input */
.page--pay .payForm .payGrid2 .field__input{
  height: 52px !important;
  display: grid !important;
  grid-template-columns: 36px 1fr 28px !important; /* icon | input | trailing */
  align-items: center !important;
  padding: 0 10px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(9,93,127,0.14) !important;
  background: rgba(255,255,255,0.96) !important;
  box-shadow: 0 14px 30px rgba(9,93,127,0.08) !important;
}

.page--pay .payForm .payGrid2 .field__icon{
  width: 28px !important;
  height: 28px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
}

.page--pay .payForm .payGrid2 .field__input input{
  height: 100% !important;
  width: 100% !important;
  border: 0 !important;
  outline: none !important;
  background: transparent !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  color: rgba(9,93,127,0.92) !important;
}

.page--pay .payForm .payGrid2 .field__trail{
  width: 18px !important;
  height: 18px !important;
}
/* =========================
   Payment Success – Premium polish
========================= */
.page--pay .paySuccess{
  margin-top: 16px;
  padding-bottom: 10px;
}

/* More stylish icon */
.page--pay .successMark{
  width: 82px;
  height: 82px;
  margin: 0 auto 12px;
  border-radius: 26px;
  background:
    radial-gradient(circle at 30% 30%, rgba(226,252,213,0.95), rgba(226,252,213,0.45) 55%, rgba(241,248,254,0.0) 75%),
    rgba(241,248,254,0.95);
  border: 1px solid rgba(9,93,127,0.12);
  box-shadow: 0 26px 60px rgba(9,93,127,0.14);
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
}

.page--pay .successMark::after{
  content: "";
  position: absolute;
  inset: -40%;
  background: radial-gradient(circle, rgba(9,93,127,0.18), rgba(9,93,127,0) 60%);
  transform: rotate(18deg);
}

.page--pay .successDot{
  width: 38px;
  height: 38px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(9,93,127,0.98), rgba(9,93,127,0.85));
  color: rgba(226,252,213,0.98);
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 16px;
  position: relative;
  z-index: 1;
  box-shadow: 0 16px 34px rgba(9,93,127,0.22);
}

/* Title + subtitle tighter and more confident */
.page--pay .successTitle{
  margin: 6px 0 0;
  font-size: 20px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  letter-spacing: -0.2px;
}

.page--pay .successSub{
  margin: 8px auto 0;
  max-width: 320px;
  font-size: 13px;
  font-weight: 800;
  color: rgba(9,93,127,0.70);
  line-height: 1.35;
}

/* Space between summary + CTAs */
.page--pay .paySuccess .payCard{
  margin-top: 14px;
}

.page--pay .nextHint{
  margin: 10px auto 14px;
  max-width: 340px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 18px;
  background: rgba(226,252,213,0.35);
  border: 1px solid rgba(9,93,127,0.10);
  font-weight: 900;
  font-size: 12px;
  color: rgba(9,93,127,0.88);
}

.page--pay .nextDot{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  display: grid;
  place-items: center;
  font-size: 12px;
}

/* CTA spacing */
.page--pay .paySuccess .ctaBtn--primary{
  margin-top: 6px;
}
.page--pay .paySuccess .ctaBtn--ghost{
  margin-top: 10px;
}
/* =========================
   Payment Success Header – Premium
========================= */
.page--pay .paySuccessTop{
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  gap: 10px;
  padding: 12px 12px;
  background:
    radial-gradient(circle at 20% 10%, rgba(226,252,213,0.55), rgba(226,252,213,0.0) 55%),
    rgba(255,255,255,0.92);
  border-bottom: 1px solid rgba(9,93,127,0.10);
}

.page--pay .paySuccessTop__center{
  text-align: center;
}

.page--pay .paySuccessTop__pill{
  margin: 0 auto;
  width: fit-content;
  height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(226,252,213,0.65);
  border: 1px solid rgba(9,93,127,0.12);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 900;
  font-size: 12px;
  color: rgba(9,93,127,0.92);
  box-shadow: 0 12px 26px rgba(9,93,127,0.08);
}

.page--pay .paySuccessTop__pill .pillDot{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-size: 12px;
  line-height: 1;
}

.page--pay .paySuccessTop__title{
  margin-top: 6px;
  font-size: 14px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  letter-spacing: -0.1px;
}

.page--pay .paySuccessTop__ghost{
  width: 40px;
  height: 40px;
}
/* =========================
   Payment Success Header – No Back Button
========================= */
.page--pay .paySuccessTop--centered{
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 14px 12px;
  text-align: center;
}
/* =========================
   Request Status Screen
========================= */
.page--status{
  background: rgba(241,248,254,0.95);
}

/* Header (same premium style used in success) */
.page--status .statusTop{
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 14px 12px;
  text-align: center;
  background:
    radial-gradient(circle at 20% 10%, rgba(226,252,213,0.55), rgba(226,252,213,0.0) 55%),
    rgba(255,255,255,0.92);
  border-bottom: 1px solid rgba(9,93,127,0.10);
}

.page--status .statusTop__pill{
  margin: 0 auto;
  width: fit-content;
  height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(226,252,213,0.65);
  border: 1px solid rgba(9,93,127,0.12);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 900;
  font-size: 12px;
  color: rgba(9,93,127,0.92);
  box-shadow: 0 12px 26px rgba(9,93,127,0.08);
}

.page--status .pillDot{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-size: 12px;
  line-height: 1;
}

.page--status .statusTop__title{
  margin-top: 6px;
  font-size: 14px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  letter-spacing: -0.1px;
}

/* Cards */
.page--status .statusCard{
  margin-top: 12px;
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 18px 44px rgba(9,93,127,0.10);
  padding: 14px;
}

.page--status .statusCard--soft{
  background: rgba(226,252,213,0.22);
}

.page--status .statusCard__title{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  margin-bottom: 10px;
}

/* Caregiver row */
.page--status .statusCg{
  display: flex;
  align-items: center;
  gap: 12px;
}

.page--status .statusAvatar{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  background: rgba(226,252,213,0.95);
  display: grid;
  place-items: center;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  flex-shrink: 0;
}

.page--status .statusCgMeta{
  flex: 1;
  min-width: 0;
}

.page--status .statusCgNameRow{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.page--status .statusCgName{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page--status .statusCgSub{
  margin-top: 3px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
}

/* Reuse verified badge styles from payment */
.page--status .verifiedBadge{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(226,252,213,0.65);
  border: 1px solid rgba(9,93,127,0.12);
  font-weight: 900;
  font-size: 11.5px;
  color: rgba(9,93,127,0.95);
  white-space: nowrap;
}
.page--status .vDot{
  width: 14px;
  height: 14px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-size: 10px;
}

/* Status chip */
.page--status .statusChip{
  height: 26px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  font-weight: 900;
  font-size: 12px;
  white-space: nowrap;
}

/* Timeline */
.page--status .timeline{
  display: grid;
  gap: 10px;
}

.page--status .tItem{
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 10px 10px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.10);
  background: rgba(241,248,254,0.92);
}

.page--status .tDot{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.95);
}

.page--status .tItem.is-done .tDot{
  background: rgba(226,252,213,0.85);
}

.page--status .tTitle{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  font-size: 13px;
}
.page--status .tSub{
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
  margin-top: 2px;
}

.page--status .tTime{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.70);
  white-space: nowrap;
}

/* Details rows */
.page--status .statusRow{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid rgba(9,93,127,0.08);
}
.page--status .statusRow:first-child{ border-top: 0; padding-top: 0; }

.page--status .statusLabel{
  font-size: 12px;
  font-weight: 900;
  color: rgba(9,93,127,0.70);
}
.page--status .statusValue{
  font-size: 12.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  text-align: right;
}

.page--status .statusHint{
  margin: 10px 0 0;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.70);
  text-align: center;
}

.page--status .bottomPad{ height: 92px; }

/* CTA layout */
.page--status .ctaBar--double{
  display: grid;
  gap: 10px;
}
/* =====================================================
   GLOBAL CTA SYSTEM (applies everywhere)
   Put this at the VERY BOTTOM of styles.css
===================================================== */

/* CTA bar */
.ctaBar{
  width: 100%;
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
}

.ctaBar--sticky{
  position: sticky;
  bottom: 0;
  z-index: 40;
  background: rgba(241,248,254,0.98);
  border-top: 1px solid rgba(9,93,127,0.12);
  box-shadow: 0 -18px 44px rgba(9,93,127,0.10);
}

.ctaBar--single{
  display: block;
}

.ctaBar--double{
  display: grid;
  gap: 10px;
}

/* Base button */
.ctaBtn{
  width: 100%;
  height: 52px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 14px;
  letter-spacing: 0.2px;
  cursor: pointer;
  border: 0;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease), border-color 220ms var(--ease);
}

/* Primary */
.ctaBtn--primary{
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.96);
}
.ctaBtn--primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.18);
}
.ctaBtn--primary:active{
  transform: translateY(1px) scale(0.995);
  box-shadow: 0 10px 22px rgba(9,93,127,0.14);
}

/* Secondary (perfect for cancel / less important actions) */
.ctaBtn--secondary{
  background: rgba(255,255,255,0.96);
  color: rgba(9,93,127,0.92);
  border: 1px solid rgba(9,93,127,0.14);
}
.ctaBtn--secondary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.10);
  background: rgba(226,252,213,0.25);
}
.ctaBtn--secondary:active{
  transform: translateY(1px) scale(0.995);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
}

/* Disabled */
.ctaBtn:disabled{
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
/* =========================
   Pet Care (uses same system + palette)
========================= */
.page--pet{
  background: rgba(241,248,254,0.95);
}

/* Cards */
.page--pet .petCard{
  margin-top: 12px;
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 18px 44px rgba(9,93,127,0.10);
  padding: 14px;
}

.page--pet .petCard__title{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  margin-bottom: 10px;
}

/* Option cards (type/service) */
.page--pet .petTypeGrid,
.page--pet .petServiceGrid{
  display: grid;
  gap: 10px;
}

.page--pet .petTypeOption,
.page--pet .petServiceOption{
  width: 100%;
  border-radius: 20px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  display: grid;
  grid-template-columns: 44px 1fr 18px;
  align-items: center;
  gap: 10px;
  padding: 12px;
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease), border-color 220ms var(--ease);
}

.page--pet .petTypeOption:hover,
.page--pet .petServiceOption:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.12);
  background: rgba(226,252,213,0.35);
}

/* ACTIVE (mint highlight like your Child Care card hover) */
.page--pet .petTypeOption.is-on,
.page--pet .petServiceOption.is-on{
  background: rgba(226,252,213,0.62);
  border-color: rgba(9,93,127,0.18);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
}

.page--pet .petIcon{
  width: 40px;
  height: 40px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.10);
  font-size: 18px;
}
.page--pet .petIcon--mini{ font-size: 16px; }

.page--pet .petTypeText{
  min-width: 0;
  text-align: left;
}

.page--pet .petTypeName{
  display: block;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page--pet .petTypeSub{
  display: block;
  margin-top: 3px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.65);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page--pet .petChevron{
  font-weight: 900;
  color: rgba(9,93,127,0.60);
}

/* Stepper */
.page--pet .petStepper{
  display: grid;
  grid-template-columns: 52px 1fr 52px;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border-radius: 20px;
  background: rgba(241,248,254,0.92);
  border: 1px solid rgba(9,93,127,0.10);
}

.page--pet .stepBtn{
  height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  font-weight: 900;
  font-size: 22px;
  color: rgba(9,93,127,0.92);
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--pet .stepBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(9,93,127,0.10);
  background: rgba(226,252,213,0.25);
}
.page--pet .stepBtn:active{ transform: translateY(1px) scale(0.99); }

.page--pet .stepValue{
  text-align: center;
}
.page--pet .stepNum{
  font-weight: 900;
  font-size: 22px;
  color: rgba(9,93,127,0.95);
}
.page--pet .stepHint{
  margin-top: 2px;
  font-weight: 800;
  font-size: 12px;
  color: rgba(9,93,127,0.65);
}

.page--pet .petMiniNote{
  margin-top: 10px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(9,93,127,0.70);
  text-align: center;
}

.page--pet .bottomPad{ height: 92px; }
.page--pet .bottomBar{
  display: grid;
  gap: 18px;
  margin-top: 16px;
  padding-bottom: 24px;
}
.page--pet .bottomBar--two{
  gap: 14px;
}
.page--pet .bottomBar .btn{
  margin: 0;
  height: 56px;
}
/* =========================
   Expert Help – Intro Screen
========================= */
.page--expert{
  background: rgba(241,248,254,0.95);
}

/* Hero */
.page--expert .expertIntro{
  margin-top: 20px;
  text-align: center;
}

.page--expert .expertIntro__icon{
  width: 72px;
  height: 72px;
  margin: 0 auto 14px;
  border-radius: 24px;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.12);
  display: grid;
  place-items: center;
  box-shadow: 0 22px 46px rgba(9,93,127,0.12);
}

.page--expert .expertDot{
  font-size: 28px;
}

.page--expert .expertIntro__title{
  font-size: 20px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  margin: 0;
}

.page--expert .expertIntro__sub{
  margin: 10px auto 0;
  max-width: 320px;
  font-size: 13.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.70);
  line-height: 1.4;
}

/* Trust */
.page--expert .expertTrust{
  margin-top: 22px;
  display: grid;
  gap: 10px;
}

.page--expert .expertTrust__item{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(9,93,127,0.10);
  font-weight: 900;
  font-size: 13px;
  color: rgba(9,93,127,0.90);
  box-shadow: 0 14px 32px rgba(9,93,127,0.08);
}

/* Reuse colored trust icons */
.page--expert .trustIcon{
  width: 20px;
  height: 20px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 12px;
  color: #fff;
}
.page--expert .trustIcon--green{ background: #22C55E; }
.page--expert .trustIcon--blue{ background: #3B82F6; }
.page--expert .trustIcon--amber{ background: #F59E0B; }

/* Steps */
.page--expert .expertSteps{
  margin-top: 22px;
}

.page--expert .expertSteps__title{
  font-weight: 900;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
  margin-bottom: 10px;
}

.page--expert .expertStep{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(241,248,254,0.92);
  border: 1px solid rgba(9,93,127,0.10);
  margin-bottom: 10px;
}

.page--expert .stepDot{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: rgba(9,93,127,0.95);
  color: rgba(226,252,213,0.95);
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 13px;
}

.page--expert .stepText{
  font-weight: 900;
  font-size: 13px;
  color: rgba(9,93,127,0.88);
}

.page--expert .bottomPad{
  height: 90px;
}
/* =========================
   Expert Help — Status
========================= */
.page--expert-status .panel{
  margin-top: 16px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 26px rgba(9,93,127,0.10);
}
.page--expert-status .panel__row--stack{
  display: grid;
  gap: 10px;
}
.page--expert-status .panel__title{
  font-weight: 900;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--expert-status .panel__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--expert-status .reqSummary{
  display: grid;
  gap: 10px;
}
.page--expert-status .reqRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(241,248,254,0.92);
  border: 1px solid rgba(9,93,127,0.10);
}
.page--expert-status .reqLabel{
  font-weight: 800;
  font-size: 13px;
  color: rgba(9,93,127,0.80);
}
.page--expert-status .reqValue{
  font-weight: 900;
  font-size: 13px;
  color: rgba(9,93,127,0.95);
}
/* =========================
   Expert Help — Intake
========================= */
.page--expert-intake .panel{
  margin-top: 14px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 26px rgba(9,93,127,0.10);
}
.page--expert-intake .panel__row--stack{
  display: grid;
  gap: 10px;
}
.page--expert-intake .panel__title{
  font-weight: 900;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--expert-intake .panel__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--expert-intake .field{
  display: grid;
  gap: 6px;
}
.page--expert-intake .field__label{
  font-weight: 800;
  font-size: 12px;
  color: rgba(9,93,127,0.80);
}
.page--expert-intake .inputShell{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  transition: border-color 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--expert-intake .inputShell:hover{
  border-color: rgba(9,93,127,0.28);
}
.page--expert-intake .inputShell:focus-within{
  border-color: rgba(9,93,127,0.40);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
  background: rgba(226,252,213,0.35);
}
.page--expert-intake .inputShell__icon{
  font-size: 16px;
}
.page--expert-intake .textInput,
.page--expert-intake .selectInput{
  width: 100%;
  border: 0;
  background: transparent;
  outline: none;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--expert-intake .ehTextarea{
  width: 100%;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  padding: 12px;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
  resize: vertical;
  min-height: 90px;
  transition: border-color 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--expert-intake .ehTextarea:focus{
  outline: none;
  border-color: rgba(9,93,127,0.40);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
  background: rgba(226,252,213,0.35);
}
.page--expert-intake .chipGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (min-width: 720px){
  .page--expert-intake .chipGrid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.page--expert-intake .budgetChip{
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  font-weight: 800;
  font-size: 13px;
  color: rgba(9,93,127,0.92);
  cursor: pointer;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.page--expert-intake .budgetChip.is-selected{
  background: rgba(226,252,213,0.85);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
}
.page--expert-intake .bottomBar{
  display: grid;
  gap: 18px;
  margin-top: 16px;
  padding-bottom: 24px;
}
.page--expert-intake .bottomBar--two{
  gap: 14px;
}
.page--expert-intake .bottomBar .btn{
  margin: 0;
  height: 56px;
}
/* =========================
   Caregiver — Registration + Verification
========================= */
.page--caregiver .panel{
  margin-top: 14px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 26px rgba(9,93,127,0.10);
}
.page--caregiver .panel__row--stack{
  display: grid;
  gap: 10px;
}
.page--caregiver .panel__title{
  font-weight: 900;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--caregiver .panel__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--caregiver .field{
  display: grid;
  gap: 6px;
}
.page--caregiver .field__label{
  font-weight: 800;
  font-size: 12px;
  color: rgba(9,93,127,0.80);
}
.page--caregiver .inputShell{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  transition: border-color 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--caregiver .inputShell:hover{
  border-color: rgba(9,93,127,0.28);
}
.page--caregiver .inputShell:focus-within{
  border-color: rgba(9,93,127,0.40);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
  background: rgba(226,252,213,0.35);
}
.page--caregiver .inputShell__icon{
  font-size: 16px;
}
.page--caregiver .textInput,
.page--caregiver .selectInput{
  width: 100%;
  border: 0;
  background: transparent;
  outline: none;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--caregiver .chipGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (min-width: 720px){
  .page--caregiver .chipGrid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.page--caregiver .budgetChip{
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  font-weight: 800;
  font-size: 13px;
  color: rgba(9,93,127,0.92);
  cursor: pointer;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.page--caregiver .budgetChip.is-selected{
  background: rgba(226,252,213,0.85);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
}
.page--caregiver .pillRow{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.page--caregiver .pill{
  height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  font-weight: 800;
  font-size: 12px;
  color: rgba(9,93,127,0.92);
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), border-color 220ms var(--ease), background 220ms var(--ease);
}
.page--caregiver .pill:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.12);
}
.page--caregiver .pill.is-selected{
  background: rgba(226,252,213,0.85);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 3px rgba(226,252,213,0.55);
}
.page--caregiver .typeGrid{
  margin-top: 8px;
  display: grid;
  gap: 10px;
}
.page--caregiver .typeCard{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
}
.page--caregiver .typeCard::after{
  content:"";
  position: absolute;
  top: 8px; bottom: 8px;
  left: 8px; right: 8px;
  background: rgba(226,252,213,0.0);
  border-radius: 14px;
  transform: scaleX(0.92);
  transform-origin: left center;
  transition: background 240ms var(--ease), transform 240ms var(--ease);
  z-index: 0;
}
.page--caregiver .typeCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}
.page--caregiver .typeCard:hover::after{
  background: rgba(226,252,213,0.85);
  transform: scaleX(1);
}
.page--caregiver .typeCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--caregiver .typeCard.is-selected::after{
  background: rgba(226,252,213,0.95);
  transform: scaleX(1);
}
.page--caregiver .typeCard__left,
.page--caregiver .typeCard__chev{
  position: relative;
  z-index: 1;
}
.page--caregiver .typeCard__left{
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.page--caregiver .typeIcon{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--caregiver .typeCard__title{
  display: block;
  font-size: 15px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--caregiver .typeCard__sub{
  display: block;
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}
.page--caregiver .typeCard__chev{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.12);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 5l7 7-7 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transform: translateX(0);
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background-color 240ms var(--ease);
}
.page--caregiver .typeCard:hover .typeCard__chev{
  transform: translateX(3px);
  box-shadow: 0 10px 18px rgba(9,93,127,0.12);
  border-color: rgba(9,93,127,0.22);
  background-color: rgba(226,252,213,0.85);
}
.page--caregiver .caregiverIcon--id{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='6' width='16' height='12' rx='2' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><circle cx='9' cy='12' r='2' fill='%23A7F3D0'/><path d='M13 10h5' stroke='%23095D7F' stroke-width='1.2'/><path d='M13 14h4' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--caregiver .caregiverIcon--selfie{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='7' width='14' height='10' rx='2' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><circle cx='12' cy='12' r='2.5' fill='%23FCA5A5'/><path d='M9 9h2' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--caregiver .caregiverIcon--bg{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='6' y='5' width='12' height='14' rx='2' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.1'/><path d='M9 9h6' stroke='%23095D7F' stroke-width='1.2'/><path d='M9 12h6' stroke='%23095D7F' stroke-width='1.2'/><path d='M9 15h4' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--caregiver .bottomBar{
  display: grid;
  gap: 18px;
  margin-top: 16px;
  padding-bottom: 24px;
}
.page--caregiver .bottomBar--two{ gap: 14px; }
.page--caregiver .bottomBar .btn{ margin: 0; height: 56px; }
/* =========================
   Skilled Professional - Shared UI
========================= */
.page--pro .panel{
  margin-top: 14px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 26px rgba(9,93,127,0.10);
}
.page--pro .panel__row--stack{
  display: grid;
  gap: 10px;
}
.page--pro .panel__title{
  font-weight: 900;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--pro .panel__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--pro .field{
  display: grid;
  gap: 6px;
}
.page--pro .field__label{
  font-weight: 800;
  font-size: 12px;
  color: rgba(9,93,127,0.80);
}
.page--pro .inputShell{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  transition: border-color 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--pro .inputShell:hover{
  border-color: rgba(9,93,127,0.28);
}
.page--pro .inputShell:focus-within{
  border-color: rgba(9,93,127,0.40);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
  background: rgba(226,252,213,0.35);
}
.page--pro .inputShell__icon{
  font-size: 16px;
}
.page--pro .textInput,
.page--pro .selectInput{
  width: 100%;
  border: 0;
  background: transparent;
  outline: none;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--pro .inputShell--textarea{
  align-items: stretch;
}
.page--pro textarea.textInput{
  min-height: 110px;
  resize: vertical;
  padding-top: 6px;
  padding-bottom: 6px;
}
.page--pro .chipGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (min-width: 720px){
  .page--pro .chipGrid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.page--pro .budgetChip{
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  font-weight: 800;
  font-size: 13px;
  color: rgba(9,93,127,0.92);
  cursor: pointer;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.page--pro .budgetChip.is-selected{
  background: rgba(226,252,213,0.85);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
}
.page--pro .pillRow{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.page--pro .pill{
  height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  font-weight: 800;
  font-size: 12px;
  color: rgba(9,93,127,0.92);
  cursor: pointer;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), border-color 220ms var(--ease), background 220ms var(--ease);
}
.page--pro .pill:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(9,93,127,0.12);
}
.page--pro .pill.is-selected{
  background: rgba(226,252,213,0.85);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 3px rgba(226,252,213,0.55);
}
.page--pro .typeGrid{
  margin-top: 8px;
  display: grid;
  gap: 10px;
}
.page--pro .typeCard{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
}
.page--pro .typeCard::after{
  content:"";
  position: absolute;
  top: 8px; bottom: 8px;
  left: 8px; right: 8px;
  background: rgba(226,252,213,0.0);
  border-radius: 14px;
  transform: scaleX(0.92);
  transform-origin: left center;
  transition: background 240ms var(--ease), transform 240ms var(--ease);
  z-index: 0;
}
.page--pro .typeCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}
.page--pro .typeCard:hover::after{
  background: rgba(226,252,213,0.85);
  transform: scaleX(1);
}
.page--pro .typeCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--pro .typeCard.is-selected::after{
  background: rgba(226,252,213,0.95);
  transform: scaleX(1);
}
.page--pro .typeCard__left,
.page--pro .typeCard__chev{
  position: relative;
  z-index: 1;
}
.page--pro .typeCard__left{
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.page--pro .typeIcon{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--pro .typeCard__title{
  display: block;
  font-size: 15px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--pro .typeCard__sub{
  display: block;
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}
.page--pro .typeCard__chev{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.12);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 5l7 7-7 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transform: translateX(0);
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background-color 240ms var(--ease);
}
.page--pro .typeCard:hover .typeCard__chev{
  transform: translateX(3px);
  box-shadow: 0 10px 18px rgba(9,93,127,0.12);
  border-color: rgba(9,93,127,0.22);
  background-color: rgba(226,252,213,0.85);
}
.page--pro .proIcon--license{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='4' width='14' height='16' rx='2' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><circle cx='12' cy='10' r='2' fill='%23A7F3D0'/><path d='M9 14h6' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--pro .proIcon--npi{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4.5' y='6' width='15' height='12' rx='2' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 10h8' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 14h6' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--pro .proIcon--bg{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='6' y='5' width='12' height='14' rx='2' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.1'/><path d='M9 9h6' stroke='%23095D7F' stroke-width='1.2'/><path d='M9 12h6' stroke='%23095D7F' stroke-width='1.2'/><path d='M9 15h4' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--pro .bottomBar{
  display: grid;
  gap: 18px;
  margin-top: 16px;
  padding-bottom: 24px;
}
.page--pro .bottomBar--two{ gap: 14px; }
.page--pro .bottomBar .btn{ margin: 0; height: 56px; }
.page--pro .matchSummary{
  display: grid;
  gap: 10px;
}
.page--pro .matchSummary__item{
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.95);
}
.page--pro .msLabel{
  font-size: 11.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.70);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.page--pro .msValue{
  font-size: 14px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--pro .shiftList{
  display: grid;
  gap: 12px;
}
.page--pro .shiftCard{
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
  padding: 12px 14px;
  display: grid;
  gap: 10px;
}
.page--pro .shiftCard__head{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}
.page--pro .shiftTitle{
  font-size: 15px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--pro .shiftSub{
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--pro .shiftTag{
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(226,252,213,0.85);
  font-size: 11.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.page--pro .shiftTag--new{
  background: rgba(226,252,213,0.95);
}
.page--pro .shiftMeta{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 12.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.78);
}
.page--pro .shiftMeta__item{
  display: inline-flex;
  gap: 6px;
  align-items: center;
}
.page--pro .shiftActions{
  display: grid;
}
.page--pro .shiftBtn{
  height: 46px;
  border-radius: 14px;
  font-weight: 900;
}
.page--pro .statusHero{
  margin-top: 10px;
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 18px 44px rgba(9,93,127,0.10);
  padding: 16px;
  text-align: center;
}
.page--pro .statusIcon{
  width: 54px;
  height: 54px;
  border-radius: 20px;
  margin: 0 auto 10px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.85);
  border: 1px solid rgba(9,93,127,0.14);
  font-size: 26px;
}
.page--pro .statusTitle{
  margin: 0;
  font-size: 18px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--pro .statusSub{
  margin-top: 6px;
  font-size: 13.5px;
  font-weight: 750;
  color: rgba(9,93,127,0.78);
}
.page--pro .checkinActions{
  display: grid;
  gap: 10px;
}
.page--pro .checkinBtn{
  height: 52px;
  border-radius: 16px;
  font-weight: 900;
}
.page--pro .checkinBtn--ghost{
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  color: rgba(9,93,127,0.90);
}
.page--pro .hint--mini{
  font-size: 12px;
  margin-top: 6px;
}
.page--pro .walletPanel{
  display: grid;
  gap: 12px;
}
.page--pro .walletBalance{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.page--pro .walletAmount{
  font-size: 20px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--pro .walletBtn{
  height: 46px;
  border-radius: 14px;
  font-weight: 900;
}
.page--pro .walletBtn--ghost{
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  color: rgba(9,93,127,0.90);
}
.page--pro .walletMethod{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.page--pro .walletMethod__title{
  font-size: 14px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--pro .walletMethod__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--pro .walletList{
  display: grid;
  gap: 10px;
}
.page--pro .walletRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.95);
}
.page--pro .walletRow__title{
  font-size: 13.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--pro .walletRow__sub{
  font-size: 12px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--pro .walletRow__amount{
  font-size: 14px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
/* =========================
   Facility + Agency - Shared UI
========================= */
.page--facility .panel,
.page--agency .panel{
  margin-top: 14px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 26px rgba(9,93,127,0.10);
}
.page--facility .panel__row--stack,
.page--agency .panel__row--stack{
  display: grid;
  gap: 10px;
}
.page--facility .panel__title,
.page--agency .panel__title{
  font-weight: 900;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--facility .panel__sub,
.page--agency .panel__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--facility .field,
.page--agency .field{
  display: grid;
  gap: 6px;
}
.page--facility .field__label,
.page--agency .field__label{
  font-weight: 800;
  font-size: 12px;
  color: rgba(9,93,127,0.80);
}
.page--facility .inputShell,
.page--agency .inputShell{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  transition: border-color 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}
.page--facility .inputShell:hover,
.page--agency .inputShell:hover{
  border-color: rgba(9,93,127,0.28);
}
.page--facility .inputShell:focus-within,
.page--agency .inputShell:focus-within{
  border-color: rgba(9,93,127,0.40);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
  background: rgba(226,252,213,0.35);
}
.page--facility .inputShell__icon,
.page--agency .inputShell__icon{
  font-size: 16px;
}
.page--facility .textInput,
.page--facility .selectInput,
.page--agency .textInput,
.page--agency .selectInput{
  width: 100%;
  border: 0;
  background: transparent;
  outline: none;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--facility .chipGrid,
.page--agency .chipGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (min-width: 720px){
  .page--facility .chipGrid,
  .page--agency .chipGrid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.page--facility .budgetChip,
.page--agency .budgetChip{
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  font-weight: 800;
  font-size: 13px;
  color: rgba(9,93,127,0.92);
  cursor: pointer;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.page--facility .budgetChip.is-selected,
.page--agency .budgetChip.is-selected{
  background: rgba(226,252,213,0.85);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
}
.page--facility .typeGrid,
.page--agency .typeGrid{
  margin-top: 8px;
  display: grid;
  gap: 10px;
}
.page--facility .typeCard,
.page--agency .typeCard{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
}
.page--facility .typeCard::after,
.page--agency .typeCard::after{
  content:"";
  position: absolute;
  top: 8px; bottom: 8px;
  left: 8px; right: 8px;
  background: rgba(226,252,213,0.0);
  border-radius: 14px;
  transform: scaleX(0.92);
  transform-origin: left center;
  transition: background 240ms var(--ease), transform 240ms var(--ease);
  z-index: 0;
}
.page--facility .typeCard:hover,
.page--agency .typeCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}
.page--facility .typeCard:hover::after,
.page--agency .typeCard:hover::after{
  background: rgba(226,252,213,0.85);
  transform: scaleX(1);
}
.page--facility .typeCard.is-selected,
.page--agency .typeCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--facility .typeCard.is-selected::after,
.page--agency .typeCard.is-selected::after{
  background: rgba(226,252,213,0.95);
  transform: scaleX(1);
}
.page--facility .typeCard__left,
.page--facility .typeCard__chev,
.page--agency .typeCard__left,
.page--agency .typeCard__chev{
  position: relative;
  z-index: 1;
}
.page--facility .typeCard__left,
.page--agency .typeCard__left{
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.page--facility .typeIcon,
.page--agency .typeIcon{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--facility .typeCard__title,
.page--agency .typeCard__title{
  display: block;
  font-size: 15px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--facility .typeCard__sub,
.page--agency .typeCard__sub{
  display: block;
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}
.page--facility .typeCard__chev,
.page--agency .typeCard__chev{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.12);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 5l7 7-7 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transform: translateX(0);
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background-color 240ms var(--ease);
}
.page--facility .typeCard:hover .typeCard__chev,
.page--agency .typeCard:hover .typeCard__chev{
  transform: translateX(3px);
  box-shadow: 0 10px 18px rgba(9,93,127,0.12);
  border-color: rgba(9,93,127,0.22);
  background-color: rgba(226,252,213,0.85);
}
.page--facility .bottomBar,
.page--agency .bottomBar{
  display: grid;
  gap: 18px;
  margin-top: 16px;
  padding-bottom: 24px;
}
.page--facility .bottomBar--two,
.page--agency .bottomBar--two{ gap: 14px; }
.page--facility .bottomBar .btn,
.page--agency .bottomBar .btn{ margin: 0; height: 56px; }
.page--facility .matchSummary,
.page--agency .matchSummary{
  display: grid;
  gap: 10px;
}
.page--facility .matchSummary__item,
.page--agency .matchSummary__item{
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.95);
}
.page--facility .msLabel,
.page--agency .msLabel{
  font-size: 11.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.70);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.page--facility .msValue,
.page--agency .msValue{
  font-size: 14px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--facility .shiftList,
.page--agency .shiftList{
  display: grid;
  gap: 12px;
}
.page--facility .shiftCard,
.page--agency .shiftCard{
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
  padding: 12px 14px;
  display: grid;
  gap: 10px;
}
.page--facility .shiftCard__head,
.page--agency .shiftCard__head{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}
.page--facility .shiftTitle,
.page--agency .shiftTitle{
  font-size: 15px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--facility .shiftSub,
.page--agency .shiftSub{
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--facility .shiftTag,
.page--agency .shiftTag{
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(226,252,213,0.85);
  font-size: 11.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.page--facility .shiftTag--new,
.page--agency .shiftTag--new{
  background: rgba(226,252,213,0.95);
}
.page--facility .shiftMeta,
.page--agency .shiftMeta{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 12.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.78);
}
.page--facility .shiftMeta__item,
.page--agency .shiftMeta__item{
  display: inline-flex;
  gap: 6px;
  align-items: center;
}
.page--facility .shiftActions,
.page--agency .shiftActions{
  display: grid;
}
.page--facility .shiftBtn,
.page--agency .shiftBtn{
  height: 46px;
  border-radius: 14px;
  font-weight: 900;
}
.page--facility .facBtn--small,
.page--agency .facBtn--small{
  height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}
.page--facility .appList,
.page--agency .appList{
  display: grid;
  gap: 10px;
}
.page--facility .appCard,
.page--agency .appCard{
  display: grid;
  grid-template-columns: 48px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.95);
}
.page--facility .appCard__left,
.page--agency .appCard__left{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: rgba(226,252,213,0.85);
  border: 1px solid rgba(9,93,127,0.12);
  display: grid;
  place-items: center;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--facility .appCard__name,
.page--agency .appCard__name{
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  font-size: 14px;
}
.page--facility .appCard__sub,
.page--agency .appCard__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--facility .appBtn,
.page--agency .appBtn{
  height: 38px;
  border-radius: 12px;
  font-weight: 900;
  padding: 0 12px;
}
.page--facility .checkList{
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.page--facility .checkList li{
  list-style: none;
  padding-left: 18px;
  position: relative;
  color: rgba(9,93,127,0.80);
  font-weight: 800;
  font-size: 12.5px;
}
.page--facility .checkList li::before{
  content: "\2713";
  position: absolute;
  left: 0;
  top: 0;
  color: rgba(9,93,127,0.92);
  font-weight: 900;
}
.page--facility .payMethod{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.page--facility .payMethod__title{
  font-size: 14px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--facility .payMethod__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--facility .progressList{
  display: grid;
  gap: 10px;
}
.page--facility .progressItem{
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: start;
}
.page--facility .progressDot{
  width: 12px;
  height: 12px;
  border-radius: 999px;
  border: 2px solid rgba(9,93,127,0.35);
  margin-top: 4px;
}
.page--facility .progressDot--done{
  background: rgba(226,252,213,0.95);
  border-color: rgba(9,93,127,0.65);
}
.page--facility .progressTitle{
  font-size: 13.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--facility .progressSub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--facility .facIcon--ein{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='4' width='14' height='16' rx='2' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 9h8' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 13h6' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--facility .facIcon--license{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='6' y='5' width='12' height='14' rx='2' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><path d='M9 10h6' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--facility .facIcon--rep{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='9' r='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.1'/><path d='M6 19c1.5-3 4-4.5 6-4.5s4.5 1.5 6 4.5' fill='none' stroke='%23095D7F' stroke-width='1.1'/></svg>");
}
.page--agency .agencyIcon--ein{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='4' width='14' height='16' rx='2' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 9h8' stroke='%23095D7F' stroke-width='1.2'/><path d='M8 13h6' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--agency .agencyIcon--license{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='6' y='5' width='12' height='14' rx='2' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><path d='M9 10h6' stroke='%23095D7F' stroke-width='1.2'/></svg>");
}
.page--agency .agencyIcon--rep{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='9' r='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.1'/><path d='M6 19c1.5-3 4-4.5 6-4.5s4.5 1.5 6 4.5' fill='none' stroke='%23095D7F' stroke-width='1.1'/></svg>");
}
.page--agency .agencyIcon--starter{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='8' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 12h8' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/><path d='M12 8v8' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/></svg>");
}
.page--agency .agencyIcon--growth{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4.5' y='13' width='4' height='6' rx='1' fill='%23FDE68A' stroke='%23095D7F' stroke-width='1.1'/><rect x='10' y='9' width='4' height='10' rx='1' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><rect x='15.5' y='6' width='4' height='13' rx='1' fill='%23FCA5A5' stroke='%23095D7F' stroke-width='1.1'/></svg>");
}
.page--agency .agencyIcon--scale{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 4l2.2 4.6 5.1.7-3.7 3.6.9 5.1L12 15.8 7.5 18l.9-5.1L4.7 9.3l5.1-.7L12 4z' fill='%23C7D2FE' stroke='%23095D7F' stroke-width='1.1' stroke-linejoin='round'/><circle cx='12' cy='12' r='2' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.1'/></svg>");
}
/* =========================
   Caregiver - Profile Setup
========================= */
.page--caregiver-profile .profileHero{
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 12px;
  align-items: center;
}
.page--caregiver-profile .profilePhoto{
  width: 72px;
  height: 72px;
  border-radius: 22px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(226,252,213,0.75);
  display: grid;
  place-items: center;
  box-shadow: 0 12px 24px rgba(9,93,127,0.12);
}
.page--caregiver-profile .profileInitials{
  font-weight: 900;
  font-size: 16px;
  color: rgba(9,93,127,0.95);
}
.page--caregiver-profile .profileHero__info{
  display: grid;
  gap: 6px;
}
.page--caregiver-profile .pill--action{
  height: 34px;
  padding: 0 14px;
  font-size: 12px;
}
.page--caregiver-profile .inputShell--textarea{
  align-items: stretch;
}
.page--caregiver-profile textarea.textInput{
  min-height: 110px;
  resize: vertical;
  padding-top: 6px;
  padding-bottom: 6px;
}
/* =========================
   Caregiver - Matches Dashboard
========================= */
.page--caregiver-matches .panel--summary{
  background: rgba(241,248,254,0.92);
}
.page--caregiver-matches .matchSummary{
  display: grid;
  gap: 10px;
}
.page--caregiver-matches .matchSummary__item{
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(255,255,255,0.95);
}
.page--caregiver-matches .msLabel{
  font-size: 11.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.70);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.page--caregiver-matches .msValue{
  font-size: 14px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--caregiver-matches .matchList{
  display: grid;
  gap: 12px;
}
.page--caregiver-matches .matchCard{
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 14px 28px rgba(9,93,127,0.10);
  padding: 12px 14px;
  display: grid;
  gap: 10px;
}
.page--caregiver-matches .matchCard.is-hidden{
  display: none;
}
.page--caregiver-matches .matchCard__head{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}
.page--caregiver-matches .matchTitle{
  font-size: 15px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--caregiver-matches .matchSub{
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--caregiver-matches .matchTag{
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(226,252,213,0.85);
  font-size: 11.5px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.page--caregiver-matches .matchTag--priority{
  background: rgba(191,219,254,0.75);
}
.page--caregiver-matches .matchTag--new{
  background: rgba(226,252,213,0.95);
}
.page--caregiver-matches .matchMeta{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 12.5px;
  font-weight: 800;
  color: rgba(9,93,127,0.78);
}
.page--caregiver-matches .matchMeta__item{
  display: inline-flex;
  gap: 6px;
  align-items: center;
}
.page--caregiver-matches .matchActions{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.page--caregiver-matches .matchBtn{
  height: 46px;
  border-radius: 14px;
  font-weight: 900;
}
.page--caregiver-matches .matchBtn--ghost{
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  color: rgba(9,93,127,0.90);
}
/* =========================
   Expert Help — Pre-screen
========================= */
.page--expert-prescreen .panel{
  margin-top: 14px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 26px rgba(9,93,127,0.10);
}
.page--expert-prescreen .panel__row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.page--expert-prescreen .panel__row--stack{
  display: grid;
  gap: 10px;
}
.page--expert-prescreen .panel__title{
  font-weight: 900;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--expert-prescreen .panel__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}

.page--expert-prescreen .chipGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (min-width: 720px){
  .page--expert-prescreen .chipGrid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.page--expert-prescreen .budgetChip{
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(241,248,254,0.92);
  font-weight: 800;
  font-size: 13px;
  color: rgba(9,93,127,0.92);
  cursor: pointer;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease), background var(--dur) var(--ease);
  -webkit-tap-highlight-color: transparent;
}
.page--expert-prescreen .budgetChip:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(9,93,127,0.12);
}
.page--expert-prescreen .budgetChip.is-selected{
  background: rgba(226,252,213,0.85);
  border-color: rgba(9,93,127,0.22);
  box-shadow: 0 0 0 4px rgba(226,252,213,0.55);
}

.page--expert-prescreen .typeGrid{
  margin-top: 8px;
  display: grid;
  gap: 10px;
}
.page--expert-prescreen .typeCard{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
}
.page--expert-prescreen .typeCard::after{
  content:"";
  position: absolute;
  top: 8px; bottom: 8px;
  left: 8px; right: 8px;
  background: rgba(226,252,213,0.0);
  border-radius: 14px;
  transform: scaleX(0.92);
  transform-origin: left center;
  transition: background 240ms var(--ease), transform 240ms var(--ease);
  z-index: 0;
}
.page--expert-prescreen .typeCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}
.page--expert-prescreen .typeCard:hover::after{
  background: rgba(226,252,213,0.85);
  transform: scaleX(1);
}
.page--expert-prescreen .typeCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--expert-prescreen .typeCard.is-selected::after{
  background: rgba(226,252,213,0.95);
  transform: scaleX(1);
}
.page--expert-prescreen .typeCard__left,
.page--expert-prescreen .typeCard__chev{
  position: relative;
  z-index: 1;
}
.page--expert-prescreen .typeCard__left{
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.page--expert-prescreen .typeIcon{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  color: rgba(9,93,127,0.95);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--expert-prescreen .typeCard__title{
  display: block;
  font-size: 15px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--expert-prescreen .typeCard__sub{
  display: block;
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}
.page--expert-prescreen .typeCard__chev{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.12);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 5l7 7-7 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transform: translateX(0);
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background-color 240ms var(--ease);
}
.page--expert-prescreen .typeCard:hover .typeCard__chev{
  transform: translateX(3px);
  box-shadow: 0 10px 18px rgba(9,93,127,0.12);
  border-color: rgba(9,93,127,0.22);
  background-color: rgba(226,252,213,0.85);
}
.page--expert-prescreen .bottomBar{
  display: grid;
  gap: 18px;
  margin-top: 16px;
  padding-bottom: 24px;
}
.page--expert-prescreen .bottomBar--two{
  gap: 14px;
}
.page--expert-prescreen .bottomBar .btn{
  margin: 0;
  height: 56px;
}

.page--expert-prescreen .expertUrgencyIcon--asap{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M13 3L5 13h6l-1 8 8-10h-6l1-8z' fill='%23F97316' stroke='%23095D7F' stroke-width='1.1' stroke-linejoin='round'/></svg>");
}
.page--expert-prescreen .expertUrgencyIcon--soon{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='6' width='16' height='14' rx='3' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 4v3' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><path d='M16 4v3' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><circle cx='12' cy='13' r='2' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.0'/></svg>");
}
.page--expert-prescreen .expertUrgencyIcon--later{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='5' y='7' width='14' height='12' rx='3' fill='%23E9D5FF' stroke='%23095D7F' stroke-width='1.1'/><path d='M9 7V5' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><path d='M15 7V5' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><path d='M9 12h6' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/><path d='M9 15h4' stroke='%23095D7F' stroke-width='1.2' stroke-linecap='round'/></svg>");
}
/* =========================
   Expert Help — Plan
========================= */
.page--expert-fee .panel{
  margin-top: 14px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(9,93,127,0.14);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 26px rgba(9,93,127,0.10);
}
.page--expert-fee .panel__row--stack{
  display: grid;
  gap: 10px;
}
.page--expert-fee .panel__title{
  font-weight: 900;
  font-size: 14px;
  color: rgba(9,93,127,0.95);
}
.page--expert-fee .panel__sub{
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.70);
}
.page--expert-fee .typeGrid{
  margin-top: 8px;
  display: grid;
  gap: 10px;
}
.page--expert-fee .typeCard{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(9,93,127,0.14);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
  cursor: pointer;
  text-align: left;
  position: relative;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), background 240ms var(--ease), border-color 240ms var(--ease);
}
.page--expert-fee .typeCard::after{
  content:"";
  position: absolute;
  top: 8px; bottom: 8px;
  left: 8px; right: 8px;
  background: rgba(226,252,213,0.0);
  border-radius: 14px;
  transform: scaleX(0.92);
  transform-origin: left center;
  transition: background 240ms var(--ease), transform 240ms var(--ease);
  z-index: 0;
}
.page--expert-fee .typeCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.16);
  border-color: rgba(9,93,127,0.28);
}
.page--expert-fee .typeCard:hover::after{
  background: rgba(226,252,213,0.85);
  transform: scaleX(1);
}
.page--expert-fee .typeCard.is-selected{
  border-color: rgba(9,93,127,0.38);
  box-shadow: 0 18px 44px rgba(9,93,127,0.20);
}
.page--expert-fee .typeCard.is-selected::after{
  background: rgba(226,252,213,0.95);
  transform: scaleX(1);
}
.page--expert-fee .typeCard__left,
.page--expert-fee .typeCard__chev{
  position: relative;
  z-index: 1;
}
.page--expert-fee .typeCard__left{
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.page--expert-fee .typeIcon{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(9,93,127,0.14);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}
.page--expert-fee .typeCard__title{
  display: block;
  font-size: 15px;
  font-weight: 900;
  color: rgba(9,93,127,0.95);
}
.page--expert-fee .typeCard__sub{
  display: block;
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(9,93,127,0.75);
}
.page--expert-fee .typeCard__chev{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(226,252,213,0.55);
  border: 1px solid rgba(9,93,127,0.12);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23095D7F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 5l7 7-7 7'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transform: translateX(0);
  transition: transform 240ms var(--ease), box-shadow 240ms var(--ease), border-color 240ms var(--ease), background-color 240ms var(--ease);
}
.page--expert-fee .typeCard:hover .typeCard__chev{
  transform: translateX(3px);
  box-shadow: 0 10px 18px rgba(9,93,127,0.12);
  border-color: rgba(9,93,127,0.22);
  background-color: rgba(226,252,213,0.85);
}
.page--expert-fee .expertPlanIcon--monthly{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='6' width='16' height='12' rx='3' fill='%23BFDBFE' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 10h8' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/><path d='M8 14h5' stroke='%23095D7F' stroke-width='1.3' stroke-linecap='round'/></svg>");
}
.page--expert-fee .expertPlanIcon--annual{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='4' y='6' width='16' height='12' rx='3' fill='%23A7F3D0' stroke='%23095D7F' stroke-width='1.1'/><path d='M8 12h8' stroke='%23095D7F' stroke-width='1.4' stroke-linecap='round'/><circle cx='16.5' cy='10' r='1.6' fill='%23FCA5A5' stroke='%23095D7F' stroke-width='1.0'/></svg>");
}
.page--expert-fee .bottomBar{
  display: grid;
  gap: 18px;
  margin-top: 16px;
  padding-bottom: 24px;
}
.page--expert-fee .bottomBar--two{ gap: 14px; }
.page--expert-fee .bottomBar .btn{ margin: 0; height: 56px; }
/* =========================
   Expert Help – Back CTA
========================= */
.page--expert .expertBack{
  margin-top: 10px;
  text-align: center;
}

.page--expert .expertBack__btn{
  background: transparent;
  border: 0;
  padding: 6px 10px;
  font-weight: 900;
  font-size: 13px;
  color: rgba(9,93,127,0.85);
  cursor: pointer;
  transition: color 180ms ease, transform 180ms ease;
}

.page--expert .expertBack__btn:hover{
  color: rgba(9,93,127,1);
  transform: translateX(-2px);
}
/* =====================================================
   GLOBAL TOP HEADER (logo left, hamburger right)
   Put at VERY BOTTOM of styles.css
===================================================== */

.appTop{
  height: 56px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(255,255,255,0.92);
  border-bottom: 1px solid rgba(9,93,127,0.10);
}

.appTop__logo{
  height: 28px;              /* key: prevents oversized logo */
  width: auto;
  max-width: 70%;
  object-fit: contain;
  display: block;
}

.appTop__menu{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid rgba(9,93,127,0.12);
  background: rgba(241,248,254,0.95);
  color: rgba(9,93,127,0.95);
  font-weight: 900;
  font-size: 16px;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), background 220ms var(--ease);
}

.appTop__menu:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(9,93,127,0.12);
  background: rgba(226,252,213,0.25);
}

.appTop__menu:active{
  transform: translateY(1px);
  box-shadow: 0 10px 22px rgba(9,93,127,0.10);
}
/* =========================================
   FIX: Expert Help header logo alignment
   (DO NOT CHANGE HEADER STRUCTURE)
========================================= */

.page--expert .topbar{
  height: 56px;
  align-items: center;
}

.page--expert .topbar .logo{
  height: 28px;       /* same as landing */
  width: auto;
  max-width: 70%;
  object-fit: contain;
  display: block;
}

.page--expert .iconBtn--menu{
  width: 40px;
  height: 40px;
}