:root{
  --bg:#f7fbf6;
  --bg2:#eef5ee;
  --card:#ffffff;
  --ink:#20352c;
  --muted:#62746b;
  --line:#dbe8dd;
  --green:#6f9f8a;
  --green2:#4f806b;
  --green3:#375c4c;
  --sage:#e8f2ea;
  --sage2:#f2f7f0;
  --cream:#fff8eb;
  --gold:#b88936;
  --gold-soft:#f6e7c4;
  --shadow:0 20px 55px rgba(42,70,54,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;background:radial-gradient(circle at top,#fffdf7 0,#f7fbf6 42%,#edf5ed 100%);color:var(--ink);font-size:18px;line-height:1.5}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{width:min(1180px,92%);margin:auto}
.card{background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:30px;box-shadow:var(--shadow)}
.topbar{position:sticky;top:0;z-index:20;background:rgba(247,251,246,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:16px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900}
.logo{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,var(--green),#d9b86c);display:grid;place-items:center;color:white;box-shadow:var(--shadow)}
.nav small{color:var(--muted);font-weight:700}
.navActions{display:flex;gap:10px;align-items:center}
.pill{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--line);background:#fff;padding:9px 14px;border-radius:999px;color:var(--green2);font-weight:800;font-size:15px}
.h1{font-size:clamp(36px,5vw,66px);line-height:1.03;margin:18px 0 16px;letter-spacing:-1.6px}
.lead{font-size:22px;color:#4d6257;max-width:700px}
.hero{padding:44px 0 26px}
.grid{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:center}
.heroCard{padding:24px;background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:30px;box-shadow:var(--shadow)}
.metric{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--line)}
.metric:last-child{border-bottom:0}
.bar{width:160px;height:12px;border-radius:20px;background:#eef3ef;overflow:hidden}
.bar span{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,#d6bc71,var(--green))}
.ctaRow{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.btn{border:0;border-radius:18px;background:var(--green2);color:white;padding:16px 22px;font-weight:900;font-size:18px;cursor:pointer;box-shadow:0 12px 28px rgba(79,128,107,.22);display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn.secondary{background:#fff;color:var(--green2);border:1px solid var(--line);box-shadow:none}
.btn.gold{background:var(--gold)}
.btn.full{width:100%}
.smallBtn{padding:12px 16px;font-size:15px;border-radius:14px}
.section{padding:28px 0}
.sectionTitle{font-size:36px;letter-spacing:-.8px;margin:0 0 10px;line-height:1.1}
.muted{color:var(--muted)}
.disclaimer{font-size:14px;color:var(--muted);margin-top:18px}
.emailBox{display:flex;gap:10px;margin-top:16px}
.emailBox input,input[type=email],input[type=password],input[type=text]{width:100%;border:1px solid var(--line);border-radius:16px;padding:15px;font-size:18px;background:#fff;color:var(--ink)}

/* simulator */
.simulator{padding:24px}
.step{display:none}
.step.active{display:block}
.step h2{font-size:34px;margin:0 0 8px;line-height:1.15}
.choices{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}
.choice{border:1px solid var(--line);border-radius:20px;background:#fff;padding:18px;text-align:left;cursor:pointer;font-size:19px;color:var(--ink);transition:.15s}
.choice:hover,.choice.selected{border-color:var(--green);background:var(--sage);transform:translateY(-1px)}
.progress{height:12px;background:#edf4ee;border-radius:20px;overflow:hidden;margin:0 0 22px}
.progress.wide{width:100%}
.progress span{height:100%;width:0%;display:block;background:linear-gradient(90deg,var(--green),#d9b86c);transition:.3s}
.resultGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.risk{background:var(--cream);border:1px solid #f1dfb9;border-radius:22px;padding:18px}
.risk strong{display:block;font-size:28px;color:#b7791f}
.notice{padding:16px 18px;border-radius:20px;background:var(--sage);border:1px solid var(--line);color:#335445;line-height:1.5}
.softNotice{background:#f7faf7}
.footer{padding:28px 0;color:var(--muted);font-size:14px}
.adminTable{width:100%;border-collapse:collapse;background:#fff;border-radius:16px;overflow:hidden}
.adminTable th,.adminTable td{border-bottom:1px solid var(--line);padding:12px;text-align:left;font-size:15px}

/* member area */
.memberShell{padding:24px 0 40px}
.memberHero{padding:28px;display:grid;grid-template-columns:1.25fr .9fr;gap:22px;margin-bottom:18px;background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(242,247,240,.96))}
.memberTitle{font-size:clamp(34px,4vw,52px);line-height:1.03;letter-spacing:-1.2px;margin:12px 0 14px}
.memberLead{max-width:760px}
.heroBadges{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.miniBadge{display:inline-flex;align-items:center;padding:10px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px;font-weight:800;color:var(--green3)}
.successBadge{background:var(--sage);color:#315341}
.heroActions{margin-top:22px}
.memberHeroPanel{display:flex;align-items:stretch}
.statusCard{width:100%;border-radius:26px;border:1px solid var(--line);background:#fff;padding:22px}
.statusTop{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.eyebrow{display:inline-block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--green2);font-weight:900;margin-bottom:6px}
.statusCard h3{font-size:26px;line-height:1.1;margin:0 0 8px}
.statusDot{width:16px;height:16px;border-radius:50%;margin-top:6px;box-shadow:0 0 0 8px rgba(79,128,107,.12)}
.statusDot.isWarm{background:#d0a14e;box-shadow:0 0 0 8px rgba(208,161,78,.12)}
.statusDot.isLive{background:#5a9b72}
.progressCard{margin:18px 0;padding:16px;border-radius:20px;background:var(--sage2);border:1px solid var(--line)}
.progressMeta{display:flex;justify-content:space-between;gap:10px;margin-bottom:10px;font-weight:800;color:var(--green3)}
.statusList{margin:0;padding-left:20px;color:var(--muted)}
.statusList li+li{margin-top:8px}
.memberGrid{display:grid;grid-template-columns:270px 1fr;gap:18px}
.side{padding:18px;align-self:start;position:sticky;top:86px}
.sideHeading{font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--green2);font-weight:900;margin:4px 10px 14px}
.side a,.side button{display:block;width:100%;text-align:left;padding:14px 14px;border-radius:14px;border:0;background:transparent;color:var(--ink);font-weight:800;cursor:pointer}
.side a:hover,.side button:hover,.side a.active{background:var(--sage)}
.sidePromo{margin-top:18px;padding:16px;border-radius:20px;background:linear-gradient(135deg,#fff8eb,#ffffff);border:1px solid #f0e0bc;display:flex;gap:12px;align-items:flex-start}
.sidePromoIcon{width:42px;height:42px;border-radius:14px;background:#fff;display:grid;place-items:center;font-size:21px;border:1px solid #efdcb1}
.sidePromo p{margin:6px 0 0;color:var(--muted);font-size:15px}
.content{padding:24px}
.module{display:none}
.module.active{display:block}
.sectionHeaderRow{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin-bottom:14px}
.sectionHeaderRow.compact{margin-bottom:10px}
.shelfTitle{font-size:24px;margin:0}
.textLink{font-weight:900;color:var(--green2)}
.introLarge{font-size:20px;max-width:900px}
.statsGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:8px 0 24px}
.statCard{padding:18px;border-radius:22px;border:1px solid var(--line);background:#fff}
.statLabel{font-size:14px;text-transform:uppercase;letter-spacing:.07em;color:var(--green2);font-weight:900}
.statValue{font-size:34px;font-weight:900;line-height:1.05;margin:8px 0 4px}
.statCard p{margin:0;color:var(--muted)}
.shelfBlock{margin-top:24px}
.mediaRow{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.fullWidthRow{grid-template-columns:repeat(3,1fr)}
.mediaCard{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:0 10px 24px rgba(35,58,47,.08);transition:transform .16s ease, box-shadow .16s ease}
.mediaCard:hover{transform:translateY(-2px);box-shadow:0 18px 34px rgba(35,58,47,.12)}
.mediaCard img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#eef2ee}
.mediaMeta{padding:16px}
.mediaMeta h4{font-size:22px;line-height:1.15;margin:10px 0 6px}
.mediaMeta p{margin:0;color:var(--muted);font-size:16px}
.tag{display:inline-block;padding:6px 10px;border-radius:999px;background:var(--sage);color:var(--green2);font-weight:900;font-size:13px}
.goldTag{background:var(--gold-soft);color:#8b6123}
.lockedMedia{opacity:.84}
.lockOverlay{position:absolute;top:14px;right:14px;background:rgba(32,53,44,.72);color:#fff;border-radius:999px;padding:8px 10px;font-size:18px;backdrop-filter:blur(5px)}
.staticCard{cursor:default}
.detailGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px}
.detailCard{background:#fff;border:1px solid var(--line);border-radius:24px;padding:20px}
.detailCard h3{font-size:24px;line-height:1.15;margin:0 0 12px}
.detailCard p{margin:0 0 8px;color:var(--muted)}
.bulletList{margin:0;padding-left:20px;color:var(--ink)}
.bulletList li+li{margin-top:8px}
.bulletList.spaced li+li{margin-top:10px}
.cardTone{margin-top:20px;padding:22px;border-radius:26px;background:linear-gradient(135deg,#fff8eb,#ffffff);border:1px solid #f0e0bc;display:flex;align-items:center;justify-content:space-between;gap:18px}
.cardTone h3{font-size:28px;line-height:1.1;margin:6px 0 8px}
.cardTone p{margin:0;color:var(--muted)}
.lockedGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:10px}
.lockedFeature{padding:18px;border-radius:22px;border:1px solid var(--line);background:#fff}
.lockedFeature h3{font-size:22px;line-height:1.2;margin:0 0 8px}
.lockedFeature p{margin:0;color:var(--muted)}
.checkoutLayout{display:grid;grid-template-columns:360px 1fr;gap:16px;align-items:start}
.checkoutInfo{display:flex;flex-direction:column;gap:14px}
.checkoutBenefits{padding:20px;border-radius:24px;border:1px solid var(--line);background:#fff}
.checkoutBenefits h3{font-size:24px;margin:0 0 12px}
.pricePanel{margin-top:18px;padding:18px;border-radius:22px;background:var(--cream);border:1px solid #f1dfb9}
.priceLabel{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:#946b24;font-weight:900}
.priceValue{font-size:42px;font-weight:900;line-height:1.05;margin:8px 0 6px;color:#7d5a1a}
.pricePanel p{margin:0;color:#7c6a49}
.checkoutBox{min-height:620px;border:1px dashed var(--line);border-radius:24px;padding:14px;background:#fff}
.installHero{display:flex;justify-content:space-between;align-items:center;gap:20px}
.installPhone{width:88px;height:88px;border-radius:24px;background:#fff;display:grid;place-items:center;font-size:40px;border:1px solid #efdcb1;flex:0 0 auto}
.installGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.installCard{padding:20px;border-radius:24px;background:#fff;border:1px solid var(--line)}
.installIcon{width:54px;height:54px;border-radius:18px;background:var(--sage);display:grid;place-items:center;font-size:24px;margin-bottom:12px}
.installCard h3{font-size:24px;margin:0 0 10px}
.installCard ol{margin:0;padding-left:20px;color:var(--muted)}
.installCard li+li{margin-top:8px}

@media(max-width:980px){
  .memberHero,.memberGrid,.checkoutLayout,.installGrid,.statsGrid,.detailGrid,.lockedGrid,.mediaRow,.fullWidthRow,.grid,.resultGrid{grid-template-columns:1fr}
  .memberHeroPanel{display:block}
  .side{position:relative;top:auto}
}
@media(max-width:820px){
  body{font-size:17px}
  .choices{grid-template-columns:1fr}
  .hero{padding-top:28px}
  .heroCard{padding:18px}
  .h1{font-size:40px}
  .lead{font-size:19px}
  .memberTitle{font-size:36px}
  .memberLead,.introLarge{font-size:18px}
  .nav small{display:none}
  .navActions{width:100%;justify-content:flex-end}
  .emailBox,.heroActions,.ctaRow{flex-direction:column}
  .btn{width:100%}
  .sectionTitle{font-size:30px}
  .mediaMeta h4{font-size:20px}
  .detailCard h3,.installCard h3,.lockedFeature h3,.checkoutBenefits h3,.cardTone h3{font-size:22px}
}


/* checkout modal fix */
body.modalOpen{overflow:hidden}
.checkoutModal{position:fixed;inset:0;z-index:9999;display:none}
.checkoutModal.active{display:block}
.checkoutModalBackdrop{position:absolute;inset:0;background:rgba(25,42,35,.58);backdrop-filter:blur(8px)}
.checkoutModalPanel{
  position:relative;
  width:min(1120px,94vw);
  max-height:92vh;
  overflow:auto;
  margin:4vh auto;
  background:#fff;
  border:1px solid var(--line);
  border-radius:30px;
  box-shadow:0 32px 90px rgba(18,34,27,.28);
  padding:24px;
}
.checkoutModalClose{
  position:sticky;
  top:0;
  float:right;
  width:46px;
  height:46px;
  border:0;
  border-radius:16px;
  background:#f2f7f0;
  color:var(--green3);
  font-size:30px;
  font-weight:800;
  cursor:pointer;
  z-index:2;
}
.checkoutModalHeader{padding:6px 54px 16px 4px}
.checkoutModalHeader h2{font-size:clamp(30px,4vw,46px);line-height:1.05;margin:6px 0 8px}
.checkoutModalHeader p{font-size:18px;color:var(--muted);margin:0;max-width:820px}
.checkoutModalGrid{display:grid;grid-template-columns:330px 1fr;gap:16px;align-items:start}
.checkoutModalBenefits{border:1px solid var(--line);border-radius:24px;padding:18px;background:linear-gradient(135deg,#fff8eb,#fff)}
.checkoutModalBenefits h3{margin:0 0 12px;font-size:24px}
.checkoutModalBox{
  min-height:640px;
  border:1px dashed var(--line);
  border-radius:24px;
  padding:14px;
  background:#fff;
}
@media(max-width:900px){
  .checkoutModalPanel{width:96vw;max-height:94vh;margin:3vh auto;padding:18px;border-radius:24px}
  .checkoutModalGrid{grid-template-columns:1fr}
  .checkoutModalBox{min-height:620px}
  .checkoutModalHeader{padding-right:48px}
}



/* FINAL COMPACT CHECKOUT MODAL - payment first */
body.modalOpen{overflow:hidden}
.checkoutModal{position:fixed;inset:0;z-index:99999;display:none}
.checkoutModal.active{display:block}
.checkoutModalBackdrop{position:absolute;inset:0;background:rgba(25,42,35,.58);backdrop-filter:blur(8px)}
.checkoutModalPanel.compactCheckoutPanel{
  position:relative;
  width:min(720px,94vw) !important;
  max-height:94vh !important;
  overflow:auto !important;
  margin:3vh auto !important;
  background:#fff !important;
  border:1px solid var(--line) !important;
  border-radius:28px !important;
  box-shadow:0 32px 90px rgba(18,34,27,.28) !important;
  padding:16px !important;
}
.checkoutModalClose{
  position:sticky;
  top:0;
  float:right;
  width:44px;
  height:44px;
  border:0;
  border-radius:16px;
  background:#f2f7f0;
  color:var(--green3);
  font-size:30px;
  font-weight:900;
  cursor:pointer;
  z-index:3;
}
.compactCheckoutHeader{
  padding:2px 52px 10px 2px !important;
}
.compactCheckoutHeader h2{
  font-size:clamp(28px,4vw,38px) !important;
  line-height:1.05 !important;
  margin:4px 0 6px !important;
}
.compactCheckoutHeader p{
  font-size:16px !important;
  line-height:1.38 !important;
  margin:0 !important;
  color:var(--muted) !important;
}
.compactCheckoutBox{
  min-height:610px !important;
  border:1px solid var(--line) !important;
  border-radius:22px !important;
  padding:6px !important;
  background:#fff !important;
}
.compactTrustLine{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
  color:var(--green3);
  font-size:14px;
  font-weight:800;
}
.compactTrustLine span{
  background:var(--sage);
  border:1px solid var(--line);
  padding:8px 10px;
  border-radius:999px;
}
.checkoutModalGrid,
.checkoutModalBenefits,
.checkoutInfo,
.checkoutBenefits{
  display:none !important;
}
@media(max-width:600px){
  .checkoutModalPanel.compactCheckoutPanel{
    width:96vw !important;
    margin:2vh auto !important;
    max-height:96vh !important;
    padding:10px !important;
    border-radius:22px !important;
  }
  .checkoutModalClose{
    width:40px;
    height:40px;
    border-radius:14px;
    font-size:28px;
  }
  .compactCheckoutHeader{
    padding:2px 46px 8px 2px !important;
  }
  .compactCheckoutHeader h2{
    font-size:28px !important;
  }
  .compactCheckoutHeader p{
    font-size:14px !important;
  }
  .compactCheckoutBox{
    min-height:640px !important;
    padding:2px !important;
    border-radius:18px !important;
  }
  .compactTrustLine{
    font-size:12px;
    justify-content:flex-start;
  }
}


/* Stripe loading visibility fix */
.stripeLoading,
.checkoutStartBox{
  min-height:360px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px;
  color:var(--green3);
}
.stripeLoading span{color:var(--muted);font-size:15px}
.compactCheckoutBox{
  min-height:680px !important;
}
@media(max-width:600px){
  .compactCheckoutBox{min-height:700px !important}
}


/* Free guide library */
.openGuide{
  display:inline-flex;
  margin-top:12px;
  font-weight:900;
  color:var(--green2);
}
.mediaCard.staticCard{
  color:inherit;
}
.mediaCard.staticCard:hover .openGuide{
  transform:translateX(2px);
}



/* PWA fixed navigation for older users */
body{
  padding-bottom:96px;
}
.pwaBottomNav{
  position:fixed;
  left:50%;
  bottom:14px;
  transform:translateX(-50%);
  width:min(720px,94vw);
  min-height:74px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(14px);
  border:1px solid var(--line);
  border-radius:24px;
  box-shadow:0 18px 50px rgba(30,55,43,.20);
  z-index:9998;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
  padding:8px;
}
.pwaBottomNav a{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  min-height:56px;
  border-radius:18px;
  color:var(--green3);
  font-size:13px;
  font-weight:900;
  text-align:center;
  text-decoration:none;
}
.pwaBottomNav a span{
  font-size:22px;
  line-height:1;
}
.pwaBottomNav a strong{
  line-height:1.05;
}
.pwaBottomNav a:hover,
.pwaBottomNav a.active{
  background:var(--sage);
}
.pwaBottomNav .navPay{
  background:var(--gold);
  color:white;
  box-shadow:0 8px 20px rgba(184,137,54,.22);
}
.floatingBack{
  position:fixed;
  left:16px;
  bottom:104px;
  z-index:9997;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 16px;
  border-radius:999px;
  background:#fff;
  color:var(--green3);
  border:1px solid var(--line);
  box-shadow:0 12px 30px rgba(30,55,43,.16);
  font-size:16px;
  font-weight:900;
  text-decoration:none;
}
.floatingBack:hover{
  background:var(--sage);
}
@media(min-width:981px){
  .pwaBottomNav{
    width:min(560px,70vw);
    min-height:64px;
  }
  .pwaBottomNav a{
    min-height:48px;
  }
}
@media(max-width:600px){
  body{
    padding-bottom:104px;
  }
  .pwaBottomNav{
    bottom:10px;
    width:94vw;
    min-height:78px;
    border-radius:22px;
    padding:7px;
  }
  .pwaBottomNav a{
    min-height:60px;
    font-size:12px;
  }
  .pwaBottomNav a span{
    font-size:22px;
  }
  .floatingBack{
    left:12px;
    bottom:102px;
    min-height:46px;
    font-size:15px;
    padding:0 14px;
  }
  .navActions{
    display:none;
  }
}
@media(max-width:380px){
  .pwaBottomNav a strong{
    font-size:11px;
  }
}


/* Premium content pages */
.mediaCard[href^="premium/"]{
  text-decoration:none;
}
.mediaCard[href^="premium/"]:hover .openGuide{
  transform:translateX(2px);
}



/* v16 visual clarity: locked vs unlocked */
.accessMap{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin:18px 0;
}
.accessCard{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:18px;
  border-radius:26px;
  border:2px solid var(--line);
  background:#fff;
  box-shadow:0 10px 26px rgba(35,58,47,.07);
}
.accessIcon{
  width:54px;
  height:54px;
  border-radius:18px;
  display:grid;
  place-items:center;
  font-size:26px;
  flex:0 0 auto;
}
.accessCard h3{
  font-size:25px;
  line-height:1.1;
  margin:2px 0 8px;
}
.accessCard p{
  margin:0;
  color:var(--muted);
}
.unlockedAccess{
  border-color:#94c9a7;
  background:linear-gradient(135deg,#f2fbf4,#ffffff);
}
.unlockedAccess .accessIcon{
  background:#dff3e5;
}
.lockedAccess{
  border-color:#e4c17a;
  background:linear-gradient(135deg,#fff8eb,#ffffff);
}
.lockedAccess .accessIcon{
  background:#f6e7c4;
}
.smallInlineBtn{
  margin-top:12px;
  padding:12px 16px;
  font-size:16px;
  border-radius:14px;
}
.lockedNotice,
.unlockedNotice{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:18px;
  border-radius:24px;
  margin:14px 0 18px;
}
.lockedNotice{
  background:linear-gradient(135deg,#fff8eb,#fff);
  border:2px solid #e4c17a;
}
.unlockedNotice{
  background:linear-gradient(135deg,#edf9f0,#fff);
  border:2px solid #94c9a7;
}
.bigLock{
  width:52px;
  height:52px;
  border-radius:18px;
  display:grid;
  place-items:center;
  font-size:26px;
  background:#fff;
  border:1px solid var(--line);
  flex:0 0 auto;
}
.lockedNotice h3,
.unlockedNotice h3{
  font-size:24px;
  line-height:1.1;
  margin:0 0 6px;
}
.lockedNotice p,
.unlockedNotice p{
  margin:0;
  color:var(--muted);
}
.unlockedTag,
.unlockedPremiumTag{
  background:#dff3e5 !important;
  color:#315f42 !important;
  border:1px solid #9ccdAA;
}
.goldTag{
  background:#f6e7c4 !important;
  color:#7d5a1a !important;
  border:1px solid #e4c17a;
}
.lockedMedia{
  border:2px solid #e4c17a !important;
  background:linear-gradient(135deg,#fff8eb,#fff) !important;
  opacity:1 !important;
  filter:none !important;
}
.lockOverlay{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:88px;
  top:12px !important;
  right:12px !important;
  background:rgba(86,61,22,.88) !important;
  color:#fff !important;
  border-radius:999px !important;
  padding:9px 12px !important;
  font-size:14px !important;
  font-weight:900 !important;
}
.lockedVisual{
  position:relative;
  border:2px solid #e4c17a !important;
  background:linear-gradient(135deg,#fff8eb,#fff) !important;
}
.lockedBadge{
  display:inline-flex;
  margin-bottom:10px;
  padding:7px 10px;
  border-radius:999px;
  background:#7d5a1a;
  color:#fff;
  font-weight:900;
  font-size:13px;
}
.mediaCard[href^="free/"]{
  border:2px solid #94c9a7;
}
.mediaCard[href^="premium/"]{
  border:2px solid #94c9a7;
}
body:not(.paidUser) .mediaCard.lockedMedia{
  border-color:#e4c17a;
}
@media(max-width:900px){
  .accessMap{
    grid-template-columns:1fr;
  }
  .accessCard{
    padding:16px;
  }
}
@media(max-width:600px){
  .accessIcon,.bigLock{
    width:46px;
    height:46px;
    border-radius:16px;
    font-size:23px;
  }
  .accessCard h3,
  .lockedNotice h3,
  .unlockedNotice h3{
    font-size:21px;
  }
  .lockedNotice,
  .unlockedNotice{
    padding:15px;
  }
}


/* v17 premium app top */
.premiumTopbar{
  position:relative;
  background:linear-gradient(135deg,#eef8f0 0%,#f9fbf5 52%,#fff8eb 100%);
  border-bottom:1px solid rgba(111,159,138,.22);
  box-shadow:0 14px 34px rgba(34,57,46,.08);
  overflow:hidden;
}
.premiumTopbar:before{
  content:"";
  position:absolute;
  inset:auto -60px -85px auto;
  width:240px;
  height:240px;
  border-radius:50%;
  background:radial-gradient(circle,#dfeedd 0%,rgba(223,238,221,0) 70%);
  pointer-events:none;
}
.premiumTopbarInner{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);
  gap:20px;
  align-items:center;
  padding:18px 0 20px;
}
.premiumBrandBlock{
  display:flex;
  align-items:center;
  gap:16px;
  min-width:0;
}
.premiumLogoWrap{
  width:78px;
  height:78px;
  border-radius:24px;
  background:linear-gradient(135deg,#5c8f7d,#e5c46a);
  box-shadow:0 14px 28px rgba(49,95,66,.18);
  display:grid;
  place-items:center;
  flex:0 0 auto;
}
.premiumHeroLogo{
  width:auto !important;
  height:auto !important;
  background:transparent !important;
  box-shadow:none !important;
  font-size:36px;
}
.appEyebrow{
  display:inline-block;
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--green2);
}
.premiumBrandText h2{
  margin:4px 0 6px;
  font-size:clamp(28px,4vw,40px);
  line-height:1.02;
  letter-spacing:-.03em;
  color:var(--ink);
}
.premiumBrandText p{
  margin:0;
  font-size:15px;
  color:var(--muted);
  word-break:break-word;
}
.premiumTopbarAside{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
}
.topStatPill{
  display:grid;
  gap:2px;
  min-width:128px;
  padding:11px 14px;
  border-radius:18px;
  border:1px solid rgba(111,159,138,.28);
  background:rgba(255,255,255,.82);
  color:var(--green3);
  box-shadow:0 10px 20px rgba(34,57,46,.06);
}
.topStatPill span{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:800;
  opacity:.8;
}
.topStatPill strong{
  font-size:22px;
  line-height:1;
}
.planChip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 14px;
  border-radius:999px;
  font-size:14px;
  font-weight:900;
  border:1px solid transparent;
  box-shadow:0 10px 20px rgba(34,57,46,.06);
}
.planChipLive{
  background:#e3f5e8;
  color:#315f42;
  border-color:#9ccdAA;
}
.planChipWarm{
  background:#fff3d9;
  color:#7d5a1a;
  border-color:#e4c17a;
}
.memberHero{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#ffffff 0%,#f6fbf7 62%,#fffdfa 100%) !important;
  border:1px solid rgba(111,159,138,.2) !important;
  box-shadow:0 18px 44px rgba(34,57,46,.08) !important;
}
.memberHero:after{
  content:"";
  position:absolute;
  right:-34px;
  bottom:-52px;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle,#eef7eb 0%,rgba(238,247,235,0) 70%);
  pointer-events:none;
}
.memberTitle{
  font-size:clamp(38px,5vw,58px) !important;
  line-height:.98 !important;
  letter-spacing:-.04em;
}
.memberLead{
  max-width:760px;
  font-size:19px !important;
  line-height:1.45 !important;
}
.heroBadges{
  gap:10px !important;
}
.miniBadge{
  box-shadow:0 8px 18px rgba(34,57,46,.05);
}
@media(max-width:980px){
  .premiumTopbarInner{
    grid-template-columns:1fr;
    gap:14px;
  }
  .premiumTopbarAside{
    justify-content:flex-start;
  }
}
@media(max-width:600px){
  .premiumTopbarInner{
    padding:14px 0 16px;
  }
  .premiumBrandBlock{
    align-items:flex-start;
  }
  .premiumLogoWrap{
    width:64px;
    height:64px;
    border-radius:20px;
  }
  .premiumHeroLogo{
    font-size:30px;
  }
  .premiumBrandText h2{
    font-size:28px;
  }
  .premiumBrandText p{
    font-size:14px;
  }
  .topStatPill{
    min-width:118px;
    padding:10px 12px;
  }
  .topStatPill strong{
    font-size:20px;
  }
  .planChip{
    width:100%;
    justify-content:flex-start;
    padding:11px 14px;
  }
}


/* v18 app polish */
.appChromeBar{
  position:relative;
  background:linear-gradient(180deg,#f7fbf7 0%,#f1f7f2 100%);
  border-bottom:1px solid rgba(111,159,138,.18);
}
.appChromeInner{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:14px 0;
}
.appChromeBrand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.appChromeLogo{
  width:56px;
  height:56px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#5c8f7d,#e5c46a);
  box-shadow:0 10px 22px rgba(49,95,66,.16);
  font-size:28px;
  flex:0 0 auto;
}
.appChromeText h2{
  margin:0;
  font-size:clamp(22px,3vw,28px);
  line-height:1.05;
  letter-spacing:-.03em;
  color:var(--ink);
}
.appChromeText p{
  margin:4px 0 0;
  color:var(--muted);
  font-size:14px;
  word-break:break-word;
}
.appChromeActions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
  align-items:center;
}
.appInfoCard{
  display:grid;
  align-items:center;
  min-width:118px;
  padding:10px 12px;
  border-radius:16px;
  background:#fff;
  border:1px solid rgba(111,159,138,.22);
  box-shadow:0 8px 20px rgba(34,57,46,.05);
}
.appInfoCard span{
  font-size:11px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-weight:900;
  color:var(--green2);
}
.appInfoCard strong{
  margin-top:4px;
  font-size:24px;
  line-height:1;
  color:var(--green3);
}
.appStatusBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 14px;
  border-radius:16px;
  border:1px solid transparent;
  font-weight:900;
  font-size:14px;
  white-space:nowrap;
}
.appStatusBadge.isPremium{background:#e3f5e8;color:#315f42;border-color:#9ccdAA;}
.appStatusBadge.isFree{background:#fff3d9;color:#7d5a1a;border-color:#e4c17a;}
.appActionBtn{
  appearance:none;
  border:1px solid rgba(111,159,138,.22);
  background:#fff;
  color:var(--green3);
  min-height:44px;
  padding:0 16px;
  border-radius:16px;
  font-size:15px;
  font-weight:900;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-shadow:0 8px 18px rgba(34,57,46,.05);
}
button.appActionBtn{cursor:pointer;}
.appActionBtn.isGold{background:linear-gradient(180deg,#d8b04f 0%,#be8e2c 100%); color:#fff; border-color:#be8e2c;}
.compactPageBar .appChromeInner{padding:12px 0;}
.compactActions{gap:8px;}
.memberHero{margin-top:16px !important; padding:28px !important;}
.memberTitle{font-size:clamp(30px,4vw,46px) !important; line-height:1.02 !important;}
.memberLead{font-size:17px !important; line-height:1.45 !important;}
.pill{border-radius:14px !important;}
.heroActions .btn,.heroActions .btn.gold{min-height:52px;border-radius:16px;padding:0 18px;}
.premiumActionRow{display:grid !important;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch;margin-bottom:16px;}
.pageActionBtn{
  appearance:none;
  border:1px solid rgba(111,159,138,.22);
  background:#fff;
  color:var(--green3);
  min-height:54px;
  border-radius:16px;
  padding:0 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-size:16px;
  font-weight:900;
  box-shadow:0 8px 18px rgba(34,57,46,.05);
}
button.pageActionBtn{cursor:pointer;}
.premiumTop{margin-bottom:16px !important;}
.miniNav a{
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  border-radius:16px !important;
  background:#f5f8f4 !important;
  border:1px solid rgba(111,159,138,.16);
  font-size:16px;
}
.guideTop,.premiumTop{margin-top:8px;}
@media(max-width:980px){
  .appChromeInner{grid-template-columns:1fr;}
  .appChromeActions{justify-content:flex-start;}
}
@media(max-width:640px){
  .premiumTopbar,.appChromeBar{position:relative;}
  .appChromeLogo{width:50px;height:50px;border-radius:16px;font-size:24px;}
  .appChromeText h2{font-size:20px;}
  .appChromeText p{font-size:13px;}
  .appChromeActions{display:grid;grid-template-columns:1fr;align-items:stretch;}
  .appInfoCard,.appStatusBadge,.appActionBtn{width:100%;}
  .appStatusBadge,.appActionBtn{min-height:48px;}
  .memberHero{padding:22px !important;}
  .memberTitle{font-size:clamp(28px,8vw,38px) !important;}
  .premiumActionRow{grid-template-columns:1fr 1fr;}
  .pageActionBtn{min-height:50px;font-size:15px;padding:0 12px;}
}




/* v19 premium app dashboard */
body{
  background:linear-gradient(135deg,#f7faf6 0%,#f2f7f0 100%) !important;
}
.appShell{
  width:min(1500px,96vw);
  margin:14px auto 110px;
  display:grid;
  grid-template-columns:290px 1fr;
  gap:18px;
}
.appSidebar{
  position:sticky;
  top:14px;
  height:calc(100vh - 28px);
  overflow:auto;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(111,159,138,.18);
  border-radius:28px;
  box-shadow:0 18px 50px rgba(36,60,49,.08);
  padding:22px;
}
.sideBrand{
  display:flex;
  gap:14px;
  align-items:center;
  margin-bottom:28px;
}
.sideLogo{
  width:76px;
  height:76px;
  border-radius:24px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#4c8c64,#e2c158);
  font-size:36px;
  box-shadow:0 18px 30px rgba(76,140,100,.18);
  flex:0 0 auto;
}
.sideBrand h2{
  margin:0 0 8px;
  font-size:24px;
  line-height:1.06;
  letter-spacing:-.03em;
}
.sidePlanBadge{
  display:inline-flex;
  align-items:center;
  padding:7px 12px;
  border-radius:999px;
  background:#fff6dd;
  border:1px solid #ecd38f;
  color:#9a6a12;
  font-size:13px;
  font-weight:900;
  text-transform:uppercase;
}
.sideAppNav{
  display:grid;
  gap:9px;
}
.sideAppNav a{
  min-height:54px;
  display:flex;
  align-items:center;
  gap:14px;
  padding:0 16px;
  border-radius:16px;
  color:#234039;
  font-size:17px;
  font-weight:800;
  text-decoration:none;
}
.sideAppNav a span{
  width:24px;
  text-align:center;
  font-size:22px;
}
.sideAppNav a:hover,
.sideAppNav a.active{
  background:linear-gradient(135deg,#2f7b55,#4f9a6c);
  color:#fff;
  box-shadow:0 12px 24px rgba(47,123,85,.18);
}
.sideAppNav .sideLogout{
  margin-top:18px;
  color:#b33434;
}
.sideAppNav .sideLogout:hover{
  background:#fff0f0;
  color:#b33434;
  box-shadow:none;
}
.appMain{
  min-width:0;
  display:grid;
  gap:18px;
}
.appTopPanel{
  display:grid;
  grid-template-columns:1fr 400px;
  gap:18px;
}
.welcomeCard,
.premiumStatusCard,
.overviewPanel,
.journeyPanel,
.appContentCard{
  background:rgba(255,255,255,.94);
  border:1px solid rgba(111,159,138,.18);
  border-radius:26px;
  box-shadow:0 18px 44px rgba(36,60,49,.08);
}
.welcomeCard{
  display:flex;
  align-items:center;
  gap:22px;
  padding:26px 30px;
}
.avatarCircle{
  width:86px;
  height:86px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#6cac7f,#287851);
  color:#fff;
  font-size:28px;
  font-weight:900;
  box-shadow:0 16px 28px rgba(47,123,85,.18);
  flex:0 0 auto;
}
.welcomeText h1{
  margin:0 0 8px;
  font-size:clamp(30px,4vw,42px);
  letter-spacing:-.03em;
  line-height:1.05;
}
.welcomeText p{
  margin:0;
  color:var(--muted);
  font-size:19px;
}
.appMiniBadges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}
.appMiniBadges span{
  background:#f5faf5;
  border:1px solid rgba(111,159,138,.18);
  padding:8px 12px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
  color:var(--green3);
}
.premiumStatusCard{
  padding:24px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:16px;
  align-items:center;
}
.premiumStatusCard.isUnlocked{
  background:linear-gradient(135deg,#2f7b55,#4f9a6c);
  color:#fff;
}
.premiumStatusCard.isLocked{
  background:linear-gradient(135deg,#fff8eb,#fff);
  border-color:#e4c17a;
}
.statusCheck{
  width:54px;
  height:54px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.92);
  color:#2f7b55;
  font-size:30px;
  font-weight:900;
}
.statusMain strong{
  display:block;
  font-size:22px;
  line-height:1.1;
}
.statusMain span{
  display:block;
  margin-top:4px;
  opacity:.9;
}
.statusProgress{
  height:10px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.35);
  margin-top:12px;
}
.statusProgress span{
  display:block;
  height:100%;
  background:#e8c660;
  border-radius:999px;
}
.premiumStatusCard b{
  font-size:18px;
}
.quickActions h2,
.journeyPanel h2,
.overviewPanel h2{
  margin:0;
  font-size:24px;
}
.quickActions{
  display:grid;
  gap:14px;
}
.quickGrid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.quickCard{
  min-height:146px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:16px;
  padding:20px;
  border-radius:22px;
  border:1px solid rgba(111,159,138,.32);
  background:linear-gradient(135deg,#fbfffb,#ffffff);
  color:var(--ink);
  box-shadow:0 12px 28px rgba(36,60,49,.06);
}
.quickCard.goldQuick{
  border-color:#e4c17a;
  background:linear-gradient(135deg,#fff8eb,#fff);
}
.quickIcon{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:linear-gradient(135deg,#6bb875,#2f7b55);
  color:#fff;
  font-size:30px;
  box-shadow:0 14px 24px rgba(47,123,85,.18);
}
.goldQuick .quickIcon{
  background:linear-gradient(135deg,#edc75e,#be8e2c);
}
.quickCard strong{
  display:block;
  font-size:20px;
  line-height:1.15;
}
.quickCard span{
  display:block;
  margin-top:8px;
  color:var(--muted);
}
.quickCard em{
  font-style:normal;
  font-size:36px;
  color:var(--green3);
}
.overviewPanel,
.journeyPanel{
  padding:22px;
}
.overviewStats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-top:14px;
}
.overviewStat{
  display:flex;
  align-items:center;
  gap:18px;
  min-height:126px;
  border-radius:20px;
  border:1px solid rgba(111,159,138,.18);
  background:#fff;
  padding:18px;
}
.statRound{
  width:72px;
  height:72px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:32px;
  box-shadow:0 12px 24px rgba(0,0,0,.09);
}
.statRound.green{background:linear-gradient(135deg,#7bc58d,#2f7b55);}
.statRound.blue{background:linear-gradient(135deg,#8dc6e4,#4d91bd);}
.statRound.purple{background:linear-gradient(135deg,#c4a4de,#8d68bb);}
.statRound.orange{background:linear-gradient(135deg,#ffc392,#e29557);}
.overviewStat strong{
  display:block;
  font-size:38px;
  line-height:1;
}
.overviewStat span{
  display:block;
  margin-top:6px;
  font-weight:800;
}
.overviewStat small{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:14px;
}
.journeyCards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-top:16px;
}
.journeyCard{
  position:relative;
  overflow:hidden;
  min-height:230px;
  border-radius:20px;
  padding:22px;
  color:#fff;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  box-shadow:0 16px 34px rgba(36,60,49,.16);
}
.journeyBg{
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,#4c8c64,#263d32);
}
.journeyBg:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.55));
}
.food1{background:linear-gradient(135deg,#6da676,#354e38);}
.food2{background:linear-gradient(135deg,#d28f50,#365b3c);}
.food3{background:linear-gradient(135deg,#6d8b45,#333f31);}
.food4{background:linear-gradient(135deg,#bb7aa4,#372835);}
.journeyCard span,
.journeyCard h3,
.journeyCard p,
.journeyCard button{
  position:relative;
  z-index:1;
}
.journeyCard span{
  width:max-content;
  padding:7px 11px;
  border-radius:999px;
  background:rgba(91,173,98,.92);
  font-size:12px;
  font-weight:900;
}
.journeyCard h3{
  margin:16px 0 8px;
  font-size:28px;
  line-height:1.05;
}
.journeyCard p{
  margin:0;
  font-size:16px;
  line-height:1.35;
  opacity:.95;
}
.journeyCard button{
  position:absolute;
  right:16px;
  bottom:16px;
  width:48px;
  height:48px;
  border-radius:50%;
  border:0;
  background:#fff;
  color:var(--ink);
  font-size:34px;
  line-height:1;
  cursor:pointer;
}
.appContentGrid{
  display:block;
}
.appContentCard{
  padding:22px;
}
.appContentCard .module:not(#dashboard){
  max-width:1100px;
  margin:auto;
}
.pwaBottomNav{
  max-width:880px;
}
@media(max-width:1200px){
  .appShell{grid-template-columns:1fr;}
  .appSidebar{
    position:relative;
    top:auto;
    height:auto;
    display:block;
  }
  .sideAppNav{
    grid-template-columns:repeat(4,1fr);
  }
  .sideAppNav a{
    justify-content:center;
    text-align:center;
    flex-direction:column;
    gap:6px;
    padding:10px;
  }
  .appTopPanel{grid-template-columns:1fr;}
  .quickGrid,.overviewStats,.journeyCards{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:720px){
  .appShell{
    width:min(100%,94vw);
    margin-top:10px;
    gap:14px;
  }
  .appSidebar{
    border-radius:22px;
    padding:16px;
  }
  .sideBrand h2{font-size:21px;}
  .sideLogo{width:62px;height:62px;border-radius:20px;font-size:30px;}
  .sideAppNav{grid-template-columns:repeat(2,1fr);}
  .welcomeCard{
    align-items:flex-start;
    padding:20px;
  }
  .avatarCircle{width:62px;height:62px;font-size:22px;}
  .welcomeText h1{font-size:30px;}
  .welcomeText p{font-size:16px;}
  .premiumStatusCard{grid-template-columns:auto 1fr; padding:18px;}
  .premiumStatusCard b{grid-column:2;}
  .quickGrid,.overviewStats,.journeyCards{grid-template-columns:1fr;}
  .quickCard{min-height:120px;}
  .overviewStat{min-height:110px;}
}



/* v20 social proof */
.socialProofPanel{
  background:rgba(255,255,255,.94);
  border:1px solid rgba(111,159,138,.18);
  border-radius:26px;
  box-shadow:0 18px 44px rgba(36,60,49,.08);
  padding:22px;
}
.inlineSocial{
  margin:22px 0;
}
.landingSocial{
  margin-top:8px;
}
.testimonialGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.testimonialCard{
  background:linear-gradient(135deg,#fbfffb,#ffffff);
  border:1px solid rgba(111,159,138,.2);
  border-radius:22px;
  padding:18px;
  box-shadow:0 10px 24px rgba(36,60,49,.05);
}
.testimonialCard p{
  margin:10px 0 14px;
  color:#334d42;
  font-size:16px;
  line-height:1.45;
}
.testimonialCard strong{
  color:var(--green3);
  font-size:15px;
}
.stars{
  color:#c6922e;
  letter-spacing:2px;
  font-size:16px;
  font-weight:900;
}
.checkoutSocialProof{
  margin-bottom:16px;
  padding:18px;
  border-radius:22px;
  background:linear-gradient(135deg,#fff8eb,#fff);
  border:1px solid #f0e0bc;
}
.checkoutTestimonials{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:10px;
}
.checkoutTestimonials > div{
  background:#fff;
  border:1px solid rgba(111,159,138,.16);
  border-radius:18px;
  padding:14px;
}
.checkoutTestimonials p{
  margin:8px 0 10px;
  color:#334d42;
  font-size:15px;
  line-height:1.4;
}
.checkoutTestimonials strong{
  color:var(--green3);
  font-size:14px;
}
@media(max-width:900px){
  .testimonialGrid{
    grid-template-columns:1fr;
  }
  .checkoutTestimonials{
    grid-template-columns:1fr;
  }
}



/* v21 quiz-required gate */
.quizRequiredBanner{
  position:sticky;
  top:0;
  z-index:9999;
  background:linear-gradient(135deg,#fff8eb,#ffffff);
  border-bottom:1px solid #e4c17a;
  color:#5d4217;
  padding:13px 18px;
  text-align:center;
  font-size:16px;
  box-shadow:0 8px 24px rgba(86,61,22,.08);
}
.quizRequiredBanner strong{
  color:#7d5a1a;
}