@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@400;700;800&family=DM+Sans:wght@400;500;700&display=swap');

:root{}

.mm-foundations-wrapper,
.mm-foundations-wrapper *,
.mm-foundations-wrapper *::before,
.mm-foundations-wrapper *::after{
  box-sizing:border-box;
}

.mm-foundations-wrapper{
  /* Brand palette (scoped to plugin wrapper so we do not override theme tokens) */
  --mm-primary:#005e6e;        /* primary teal */
  --mm-primary-tint-60:#669ea8;
  --mm-primary-tint-30:#b2cfd4;
  --mm-primary-2:#00afaf;      /* accent teal for gradients */
  --mm-ink:#0f172a;            /* near-black */
  --mm-muted:#64748b;          /* slate */
  --mm-border:#e2e8f0;         /* light border */
  --mm-bg:#f8fafc;             /* page bg */
  --mm-card:#ffffff;           /* card bg */
  --mm-text:#0f172a;           /* text */
  --mm-red:#f04438;            /* status red */
  --mm-amber:#f59e0b;          /* status amber */
  --mm-green:#22c55e;          /* status green */

  --mm-accent-teal:#00afaf;
  --mm-accent-lime:#c0e54c;
  --mm-accent-orange:#fcad2d;
  --mm-accent-violet:#5f4bef;

  --color-primary:#005e6e;
  --color-primary-tint-60:#669ea8;
  --color-primary-tint-30:#b2cfd4;
  --gradient-primary-soft:linear-gradient(135deg,#b2cfd4 0%,#669ea8 50%,#005e6e 100%);
  --gradient-primary-strong:linear-gradient(135deg,#005e6e 0%,#00afaf 100%);
  --color-accent-current-1:#00b3a6;
  --color-accent-current-2:#2ec4c9;
  --color-accent-teal:#00afaf;
  --color-accent-lime:#c0e54c;
  --color-accent-orange:#fcad2d;
  --color-accent-violet:#5f4bef;
  --color-accent-teal-tint-60:#66cfcf;
  --color-accent-teal-tint-30:#b2e7e7;
  --color-accent-lime-tint-60:#d9ef94;
  --color-accent-lime-tint-30:#ecf7c9;
  --color-accent-orange-tint-60:#fdce81;
  --color-accent-orange-tint-30:#fee6c0;
  --color-accent-violet-tint-60:#9f93f5;
  --color-accent-violet-tint-30:#cfc9fa;

  font-family:"DM Sans",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--mm-text);
  background:radial-gradient(circle at top,var(--color-primary-tint-30) 0,var(--mm-bg) 55%,#ffffff 100%);
  line-height:1.6;
}
.mm-foundations-wrapper h1,
.mm-foundations-wrapper h2,
.mm-foundations-wrapper h3,
.mm-foundations-wrapper h4,
.mm-foundations-wrapper h5,
.mm-foundations-wrapper h6,
.mm-foundations-wrapper .mm-hero-title,
.mm-foundations-wrapper .mm-brand{
  font-family:"Almarai",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

/* Basic layout utilities (Bootstrap-like, scoped so they do not affect the theme) */
.mm-foundations-wrapper .container{width:100%;max-width:1100px;margin:0 auto;padding:0 16px;box-sizing:border-box}
.mm-foundations-wrapper .d-flex{display:flex}
.mm-foundations-wrapper .flex-wrap{flex-wrap:wrap}
.mm-foundations-wrapper .justify-content-between{justify-content:space-between}
.mm-foundations-wrapper .align-items-center{align-items:center}
.mm-foundations-wrapper .align-items-start{align-items:flex-start}
.mm-foundations-wrapper .gap-2{gap:.5rem}
.mm-foundations-wrapper .mt-2{margin-top:.5rem}
.mm-foundations-wrapper .mt-3{margin-top:1rem}
.mm-foundations-wrapper .mt-4{margin-top:1.5rem}
.mm-foundations-wrapper .mb-2{margin-bottom:.5rem}
.mm-foundations-wrapper .mb-3{margin-bottom:1rem}
.mm-foundations-wrapper .mb-4{margin-bottom:1.5rem}
.mm-foundations-wrapper .my-3{margin-top:1rem;margin-bottom:1rem}
.mm-foundations-wrapper .mb-1{margin-bottom:.25rem}
.mm-foundations-wrapper .text-center{text-align:center}
.mm-foundations-wrapper .text-muted{color:var(--mm-muted)}
.mm-foundations-wrapper .fw-semibold{font-weight:600}
.mm-foundations-wrapper .h5{font-size:1.05rem}
.mm-foundations-wrapper .h4{font-size:1.2rem}

/* Form helpers used in contact modal */
.mm-foundations-wrapper .form-label{display:block;margin-bottom:.25rem;font-weight:500}
.mm-foundations-wrapper .form-control,
.mm-foundations-wrapper .form-select{
  width:100%;
  padding:.5rem .75rem;
  font:inherit;
  color:var(--mm-text);
  border:1px solid var(--mm-border);
  border-radius:10px;
  background:#ffffff;
  box-sizing:border-box;
}
.mm-foundations-wrapper .form-control:focus,
.mm-foundations-wrapper .form-select:focus{
  outline:none;
  border-color:var(--mm-primary);
  box-shadow:0 0 0 1px rgba(0,94,110,.35);
}
.mm-foundations-wrapper .form-check{display:flex;align-items:flex-start;gap:.35rem}
.mm-foundations-wrapper .form-check-input{margin-top:.25rem}
.mm-foundations-wrapper .form-text{font-size:.85rem;color:var(--mm-muted)}
.mm-foundations-wrapper .small{font-size:.85rem}

/* External start consent (shown under Elementor trigger button) */
.mm-start-consent{
  margin:14px auto 0;
  display:flex;
  flex-direction:column;
  gap:.5rem;
  max-width:720px;
  width:100%;
  text-align:left;
  font-family:inherit;
  color:#7a7a7a;
  font-size:13px;
}
.mm-start-consent-text{
  line-height:1.6;
  margin:0 0 21.034px;
}
.mm-start-consent-text p{
  margin:0 0 8px;
}
.mm-start-consent-text p:first-child{
  margin-top:8px;
}
.mm-start-consent-text ul{
  margin:0;
  padding-left:0;
  list-style:none;
}
.mm-start-consent-text li{
  margin:0 0 6px;
  padding-left:14px;
  position:relative;
}
.mm-start-consent-text li::before{
  content:"\2013";
  position:absolute;
  left:0;
  top:0;
  color:inherit;
}
.mm-start-consent-text strong{
  color:#5a5a5a;
  font-weight:600;
}
.mm-start-consent-text a{
  color:#000000;
  text-decoration:none;
}
.mm-start-consent-row{
  display:flex;
  align-items:flex-start;
  gap:.45rem;
  font-size:inherit;
  color:inherit;
  width:100%;
}
.mm-start-consent-input{
  margin-top:.2rem;
}
.mm-start-consent-label{
  line-height:1.35;
}
.mm-start-consent-alert{
  min-height:1.1rem;
  font-size:.85rem;
  color:#b42318;
  margin-left:1.35rem;
}
.mm-start-consent--error{
  border:1px solid #fda29b;
  background:#fff5f5;
  padding:10px 12px;
  border-radius:12px;
}
.mm-start-consent--error .mm-start-consent-row{
  color:#b42318;
}

/* Button base (variants are defined further down) */
.mm-foundations-wrapper .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.45rem 1.1rem;
  border-radius:999px;
  border:1px solid transparent;
  font-family:inherit;
  font-weight:500;
  line-height:1.2;
  cursor:pointer;
  text-decoration:none;
  white-space:nowrap;
}
.mm-foundations-wrapper .btn-lg{padding:.7rem 1.5rem;font-size:1rem}
.mm-foundations-wrapper .btn-sm{padding:.35rem 1rem;font-size:.85rem}
.mm-foundations-wrapper .btn:disabled{opacity:.6;cursor:not-allowed}

/* Contact modal (Bootstrap JS drives .show; styling is local to wrapper) */
.mm-foundations-wrapper .modal{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px 12px;
  z-index:2100;
  background:rgba(15,23,42,.75);
}
.mm-foundations-wrapper .modal.show{
  display:flex !important; /* flex so dialog can center vertically */
}
.mm-foundations-wrapper .modal-dialog{
  position:relative;
  top:auto;
  left:auto;
  transform:none;
  width:100%;
  max-width:520px;
  margin:0;
  padding:0 16px;
  box-sizing:border-box;
}
@media (max-width: 640px){
  .mm-foundations-wrapper .modal{
    padding:20px 12px;
    align-items:center;
  }
  .mm-foundations-wrapper .modal-dialog{
    position:relative;
    top:auto;
    left:auto;
    transform:none;
    width:100%;
    max-width:560px;
    padding:0;
    margin:0 auto;
  }
  .mm-foundations-wrapper .modal-content{
    margin:0 auto;
    max-height:calc(100vh - 64px);
  }
}
.mm-foundations-wrapper .modal-content{
  background:#ffffff;
  border-radius:16px;
  border:1px solid var(--mm-border);
  box-shadow:0 22px 60px rgba(15,23,42,.35);
  max-height:calc(100vh - 80px);
  overflow:auto;
  position:relative;
  padding-top:32px;
  padding-bottom:24px;
}
.mm-foundations-wrapper .modal-header,
.mm-foundations-wrapper .modal-body{
  padding:16px 18px;
}
.mm-foundations-wrapper #contactThanks{
  text-align:left;
}
.mm-foundations-wrapper #contactThanks ul{
  padding-left:18px;
  margin:10px 0;
}
.mm-foundations-wrapper #contactThanks li{
  margin:4px 0;
}
.mm-foundations-wrapper .modal-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--mm-border);
}
.mm-foundations-wrapper .modal-title{margin:0;font-size:1.1rem;font-weight:700}
.mm-foundations-wrapper .btn-close{
  position:absolute;
  top:10px;
  right:10px;
  width:34px;
  height:34px;
  border:none;
  border-radius:50%;
  background:#fff;
  color:#0f172a;
  padding:0;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(15,23,42,.25);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:1;
  z-index:5;
  font-size:18px;
}
.mm-foundations-wrapper .btn-close::before,
.mm-foundations-wrapper .btn-close::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:14px;
  height:2px;
  background:#0f172a;
  transform-origin:center;
}
.mm-foundations-wrapper .btn-close::before{transform:translate(-50%,-50%) rotate(45deg)}
.mm-foundations-wrapper .btn-close::after{transform:translate(-50%,-50%) rotate(-45deg)}

/* HERO */
.mm-hero{background:linear-gradient(90deg,var(--mm-primary),var(--mm-primary-2));color:#fff;padding:52px 0 40px;position:relative;overflow:hidden}
.mm-hero::before,
.mm-hero::after{content:"";position:absolute;border-radius:999px;filter:blur(12px);opacity:.15;pointer-events:none}
.mm-hero::before{width:420px;height:420px;background:radial-gradient(circle,var(--color-accent-lime) 0,transparent 65%);top:-180px;right:-120px}
.mm-hero::after{width:320px;height:320px;background:radial-gradient(circle,var(--color-accent-violet) 0,transparent 65%);bottom:-160px;left:-80px}
.mm-hero .container{position:relative;z-index:1}
.mm-hero-title{
  font-weight:700;
  margin:0 0 8px;
  font-size:2.4rem;
  color:#ffffff;
}
.mm-hero-sub{
  opacity:.9;
  margin:0 0 16px;
  max-width:540px;
  color:rgba(255,255,255,.9);
}
.mm-hero-grid{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
}
.mm-hero-copy{
  flex:1 1 320px;
  max-width:560px;
}
.mm-hero-points{
  list-style:none;
  padding:0;
  margin:0 0 16px;
  display:flex;
  flex-wrap:wrap;
  gap:8px 16px;
  font-size:.95rem;
  color:#e5e7eb;
}
.mm-hero-points li::before{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--mm-accent-lime);
  margin-right:6px;
}
.mm-hero-cta{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:12px;
  width:100%;
  max-width:360px;
}
.mm-hero-visual{
  flex:1 1 260px;
  display:flex;
  justify-content:center;
}
.mm-hero-visual-inner{
  position:relative;
  width:clamp(260px,30vw,360px);
  max-width:100%;
}
.mm-hero-fullstack{
  width:100%;
  height:auto;
  display:block;
  filter:drop-shadow(0 22px 45px rgba(15,23,42,.35));
  animation:mm-float 7s ease-in-out infinite;
}
.mm-hero-arrow{
  position:absolute;
  width:80px;
  height:auto;
  right:-40px;
  top:6%;
  opacity:.45;
  animation:mm-bob 5s ease-in-out infinite;
}
.mm-hero-house{
  position:absolute;
  width:110px;
  height:auto;
  right:-70px;
  bottom:-10px;
  opacity:.35;
  animation:mm-bob 6s ease-in-out infinite;
}
.mm-hero #startBtn{
  width:100%;
  max-width:360px;
  font-weight:700;
  border-radius:999px;
  padding:.7rem 1.8rem;
  background:#00afaf;
  color:#ffffff;
  border:1px solid #00afaf;
  box-shadow:none;
}
.mm-hero #startBtn:hover{
  background:#009c9c;
  border-color:#009c9c;
  box-shadow:none;
}
.mm-categories{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:12px;
  width:100%;
  max-width:360px;
  align-self:flex-start;
}
.mm-cat{display:flex;align-items:center;gap:10px;background:rgba(15,23,42,.86);border:1px solid rgba(148,163,184,.6);border-radius:999px;padding:8px 14px;color:#e5e7eb;box-shadow:0 18px 40px rgba(15,23,42,.5)}
.mm-cat{
  width:100%;
  min-width:0;
}
.mm-cat-emoji{width:67px;height:auto;display:block;flex-shrink:0}
.mm-cat-text span{font-size:12px;opacity:.9}
.mm-section{padding:32px 0}
.mm-section{max-width:900px;margin:0 auto}
.mm-section:not([hidden]){
  animation:mm-fade-up .45s ease-out;
}
.mm-progress{
  flex:1 1 220px;
  min-width:160px;
  height:8px;
  background:var(--mm-border);
  border-radius:999px;
  overflow:hidden;
}
.mm-progress-bar{height:100%;background:linear-gradient(90deg,var(--mm-primary),var(--mm-primary-2));transition:width .3s}
.mm-card{background:var(--mm-card);border:1px solid var(--mm-border);border-radius:16px;padding:22px;margin-bottom:20px;box-shadow:0 18px 45px rgba(15,23,42,.10)}
.mm-section-tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--mm-primary);margin-bottom:10px;padding:4px 12px;border-radius:999px;background:rgba(0,175,175,.08)}
.mm-question{margin:0 0 8px}
.mm-options{display:flex;flex-direction:column;gap:8px}
.mm-options{width:100%;max-width:720px}
.mm-option{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid var(--mm-border);border-radius:12px;cursor:pointer;width:100%;text-align:left;transition:background .15s,border-color .15s,box-shadow .15s,transform .15s}
.mm-option:hover{background:#ffffff;border-color:var(--color-primary-tint-60);box-shadow:0 12px 30px rgba(15,23,42,.08);transform:translateY(-1px)}
.mm-option input{margin-top:3px}
.mm-disclaimer{
  margin-top:18px;
  padding:14px 16px;
  border:1px solid var(--mm-border);
  border-radius:12px;
  background:linear-gradient(135deg,#f8fafc,#eef6f8);
  color:var(--mm-text);
  font-size:.9rem;
  line-height:1.55;
  box-shadow:0 10px 28px rgba(15,23,42,.08);
}
.mm-disclaimer strong{
  display:block;
  font-size:.78rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-bottom:6px;
  color:var(--mm-primary);
}
.mm-disclaimer a{
  color:var(--mm-primary);
  font-weight:700;
  text-decoration:underline;
}
.mm-disclaimer a:hover{
  color:#009c9c;
}
.mm-loading{
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:48px 0;
  min-height:220px;
  background:transparent;
}
/* Only show loader as flex when not hidden (so hidden attribute works) */
.mm-loading:not([hidden]){
  display:flex;
}
.mm-spinner{width:42px;height:42px;border:4px solid var(--mm-border);border-top-color:var(--mm-primary);border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes mm-float{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-10px);}
}
@keyframes mm-bob{
  0%,100%{transform:translateY(0) rotate(0deg);}
  50%{transform:translateY(-6px) rotate(-2deg);}
}
@keyframes mm-fade-up{
  from{opacity:0;transform:translateY(14px);}
  to{opacity:1;transform:translateY(0);}
}

/* SECTION MODEL (CROSS ICON) */
.mm-model-wrapper{
  display:flex;
  justify-content:center;
  margin-bottom:30px;
}
.mm-model{
  width:260px;
  height:260px;
  position:relative;
}
.mm-model svg{
  width:100%;
  height:100%;
  transform-origin:50% 50%;
}
.mm-donut-shadow{
  filter:drop-shadow(0 4px 18px rgba(2,6,23,.12));
}
.mm-model path{
  transform-box:fill-box;
  transform-origin:center;
}
/* subtle hover highlight on interactive wedges */
.mm-model path[role="button"]{
  cursor:pointer;
  transition:opacity .15s ease, transform .15s ease;
}
.mm-model path[role="button"]:hover{
  opacity:.92;
  transform:scale(1.01);
}

#mmModelCard .mm-model-heading{
  font-family:"Almarai", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight:400;
  text-align:center;
  font-size: 27px;
}
#mmModelCard .mm-model-layout{
  display:flex;
  gap:28px;
  align-items:flex-start;
  flex-wrap:wrap;
}
#mmModelCard .mm-model-left{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:12px;
  width:320px;
  max-width:100%;
}
#mmModelCard .mm-model-wrapper{
  justify-content:flex-start;
  margin-bottom:12px;
}
#mmModelCard .mm-legend{
  color:var(--mm-muted);
  text-align:left;
  line-height:1.4;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
#mmModelCard .mm-model-copy{
  flex:1 1 320px;
  max-width:560px;
  font-size:.95rem;
  color:var(--mm-text);
}
#mmModelCard .mm-legend-row{
  margin-top:18px;
  justify-content:center;
  align-items:center;
  text-align:center;
  gap:12px;
  width:100%;
  margin-left:auto;
  margin-right:auto;
}

@media (max-width: 768px){
  #mmModelCard .mm-model-layout{
    flex-direction:column;
    align-items:center;
    text-align:center;
  }
  #mmModelCard .mm-legend-row{
    justify-content:center;
    text-align:center;
  }
  #mmModelCard .mm-model-left{
    align-items:center;
  }
  #mmModelCard .mm-model-copy{
    text-align:center;
  }
}
@media (min-width: 769px){
  #mmModelCard .mm-model-layout{
    flex-wrap:nowrap;
    align-items:center;
  }
}

/* Section model: five wedges as simple blocks */
.red{color:var(--mm-red)}
.amber{color:var(--mm-amber)}
.green{color:var(--mm-green)}
.mm-legend{color:var(--mm-muted)}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;vertical-align:middle;margin-right:6px}
.dot-red{background:var(--mm-red)}
.dot-amber{background:var(--mm-amber)}
.dot-green{background:var(--mm-green)}

/* Accordion */
.mm-accordion .mm-acc-item{border:1px solid var(--mm-border);border-radius:12px;margin-bottom:10px;background:#ffffff}
.mm-acc-header{padding:12px 14px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;}
.mm-acc-toggle{
  font-size:22px;
  font-weight:800;
  color:var(--mm-primary);
  line-height:1;
  min-width:22px;
  text-align:center;
}

/* small icon shown next to each accordion section title */
.mm-acc-header .mm-acc-icon{
  width:auto;
  height:46px;
  aspect-ratio:1/1;
  object-fit:contain;
  flex-shrink:0;
  border-radius:6px;
  background:transparent;
}
@media (max-width:480px){
  .mm-acc-header .mm-acc-icon{
    height:36px;
  }
}

.mm-acc-body{padding:0 14px 12px 14px;display:none}
.mm-acc-item.open .mm-acc-body{display:block}

/* Give accordion a small gap from the element above and more breathing room inside items */
.mm-accordion {
  margin-top: 20px; /* space above the accordion block */
}
.mm-accordion .mm-acc-item {
  margin-top: 12px; /* small gap between items (keeps bottom gap already present) */
}
.mm-acc-body{
  padding-top:12px; /* extra space inside opened body so content isn't glued to header */
}

/* Terms tooltips */
.mm-term{border-bottom:1px dotted var(--mm-muted);cursor:help}
.mm-term[title]{position:relative}
.mm-highlight-green{color:inherit;}

/* Footer */
.mm-footer{padding:28px 0;color:var(--mm-muted)}
.mm-brand{font-weight:800;color:var(--mm-ink);display:flex;align-items:center;justify-content:center}
.mm-brand img{max-width:180px;height:auto;display:block}

/* Accessibility helpers */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mm-option:focus-within{outline:2px solid var(--mm-primary);outline-offset:3px}

/* Buttons (scoped so we do not alter theme buttons) */
.mm-cta-btn {
  padding:1rem 2.6rem;
  font-size:1.05rem;
  border-radius:40px;
  font-weight:600;
}



/* ========== BUTTONS (NEW) ========== */

/* Base CTA sizing – same as first big CTA */
#ctaBtn,
#downloadPdfBtn,
#restartBtn,
#finalCtaBtn{
  padding:1rem 2.6rem;
  font-size:1.05rem;
  border-radius:40px;
  font-weight:600;
}

/* Main teal button look */
.mm-foundations-wrapper .btn-primary{
  background:#00afaf;
  border:1px solid #00afaf;
  border-radius:40px;
  font-weight:600;
  box-shadow:none;
  color:#ffffff;
}
.mm-foundations-wrapper .btn-primary:hover{
  background:#009c9c;
  border-color:#009c9c;
  box-shadow:none;
}

/* DOWNLOAD = teal solid (same as CTA) */
#downloadPdfBtn{
  background:#00afaf;
  border-color:#00afaf;
  color:#ffffff;
}

/* START AGAIN = white pill with teal border */
#restartBtn{
  background:#ffffff;
  color:#0f172a;
  border:1px solid #00afaf;
}

/* Generic outline secondary (if used somewhere else) */
.mm-foundations-wrapper .btn-outline-secondary{
  border-radius:999px;
  border-color:var(--mm-border);
  color:var(--mm-muted);
  background:#ffffff;
}
.mm-foundations-wrapper .btn-outline-secondary:hover{
  border-color:var(--mm-primary);
  color:var(--mm-primary);
  background:#ffffff;
}

/* Results action buttons row */
.mm-results-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  align-items:center;
}

/* Mobile: full-width CTAs */
@media (max-width:480px){
  #ctaBtn,
  #downloadPdfBtn,
  #restartBtn,
  #finalCtaBtn{
    padding:.65rem 1.6rem;
    font-size:.95rem;
    width:100%;
    max-width:320px;
  }
}


/* Do not force special colour on pure anchor placeholders / mail links inside the plugin – let theme decide globally */
.mm-foundations-wrapper a[href^="#"],
.mm-foundations-wrapper a[href^="mailto:"]{
  color:inherit;
  text-decoration:inherit;
}

.mm-overall-eyebrow{
  margin:0 0 4px;
  font-size:.85rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

/* House icon + label on one line */
.mm-overall-heading{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 4px;
}

/* TITLE – bigger for “Solid Foundations” */
.mm-overall-label{
  font-family:"Almarai", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight:700;
  font-size:1.8rem;
  color:#0f172a;
  text-align:left;
}

/* Score sits just below heading */
.mm-overall-score{
  font-weight:600;
  font-size:.95rem;
  margin:0 0 4px;
  color:#0f172a;
}

.mm-results-intro{
  max-width:520px;
  margin:0 auto;
}
.mm-results-intro h2{
  color:#000000;
  font-family:"Almarai", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight:700;
}
.mm-results-categories{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  justify-content:center;
  align-items:stretch;
  margin:0 auto 24px;
  max-width:960px;
}
.mm-results-disclaimer{
  margin-top:0;
  margin-bottom:16px;
}
.mm-results-disclaimer h4{
  font-family:"Almarai", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight:800;
  font-size:1.15rem;
  margin:0 0 8px;
  color:#0f172a;
}
.mm-results-disclaimer p{
  margin:0 0 10px;
  color:#475569;
}
.mm-results-disclaimer-list ul{
  margin:0 0 10px 18px;
  padding:0;
  color:#0f172a;
}
.mm-results-disclaimer-list li{
  margin:4px 0;
}
.mm-results-disclaimer-privacy{
  display:inline-block;
  margin-top:4px;
  color:var(--mm-primary);
  font-weight:700;
  text-decoration:underline;
}
.mm-cat-results{
  flex:1 1 220px;
  min-width:220px;
  padding:10px 14px;
  background:#ffffff;
  border:1px solid #dee6ef;
  border-radius:16px;
  box-shadow:0 18px 45px rgba(15,23,42,.08);
  transition:transform .2s ease;
  text-align:left;
}
.mm-cat-results:hover{transform:translateY(-4px)}
.mm-cat-results .mm-cat-emoji{
  width:80px;
  height:auto;
  margin-bottom:6px;
}
/* Make the three “status” boxes match headings + tighten title/subtitle spacing */
.mm-cat-results .mm-cat-text strong{
  font-family:"Almarai", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight:800;
  font-size:1rem;
  line-height:1.1;
  margin:0 0 2px;
  color:#0f172a;
}

.mm-cat-results .mm-cat-text p{
  margin:0;
  font-size:.9rem;
  line-height:1.3;
  color:var(--mm-muted);
}

.mm-results-overall{
  border:1px solid #dee6ef;
  box-shadow:0 28px 65px rgba(15,23,42,.08);
}
.mm-results-overall-heading h3{
  font-family:"Almarai", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size:27px;
  line-height:1.2;
}
.mm-results-overall-heading{
  text-align:left;
}
@media (max-width: 640px){
  .mm-results-overall-heading{
    text-align:left;
  }
}

@media (min-width: 980px){
  .mm-results-categories{
    flex-wrap:nowrap;
    max-width:1100px;
    justify-content:space-between;
  }
  .mm-cat-results{
    flex:1 1 0;
    min-width:0;
  }
}

/* cross + text row */
.mm-results-overall .mm-overall-row{
  display:grid;
  grid-template-columns:minmax(240px, 0.6fr) minmax(320px, 1.1fr);
  align-items:flex-start;
  gap:16px 32px;
  text-align:left;
}

.mm-overall-left{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:flex-start;
}
.mm-overall-right{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:flex-start;
  justify-content:flex-start;
}

.mm-overall-cta-wrap{
  margin-top:12px;
  text-align:center;
}

.mm-overall-label{
  font-size:1.6rem;
  font-weight:700;
}

/* Pill badge for overall category (dark bubble style) */
.mm-overall-pill-wrap{
  width:100%;
  grid-column:1;
  justify-self:start;
}
.mm-overall-pill{
  display:inline-flex;
  align-items:center;
  gap:1px;
  padding:14px 40px 14px 23px;
  border-radius:999px;
  background:linear-gradient(135deg,#0e2738,#0a3a45);
  border:1px solid rgba(255,255,255,0.04);
  box-shadow:0 16px 36px rgba(0,0,0,0.28);
  color:#e5e7eb;
}
.mm-overall-pill .mm-overall-house{
  width:64px;
  height:auto;
  flex-shrink:0;
}
.mm-overall-pill-text{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.mm-overall-pill .mm-overall-label{
  color:#e5e7eb;
  font-size:1.1rem;
}
.mm-overall-pill-sub{
  color:#cbd5e1;
  font-size:.95rem;
  line-height:1.3;
  display:block;
}
@media (max-width: 640px){
  .mm-overall-pill{
    width:100%;
    justify-content:flex-start;
  }
}

.mm-overall-score{
  margin-top:4px;
  text-align:left;
}
.mm-overall-text{
  text-align:left;
  max-width:640px;
  margin-top:0;
}
.mm-overall-cta{
  width:100%;
  text-align:center;
}

.mm-results-overall-media{
  display:flex;
  align-items:center;
  gap:12px;
}
.mm-results-overall-media .mm-overall-house{
  max-width:84px;
  width:84px;
  height:auto;
  display:block;
  flex-shrink:0;
}

.mm-overall-cta{
  margin-top:18px;
  display:inline-block;
  align-items:center;
  text-align:center;
}
.mm-overall-cta .btn-primary{
  padding:1rem 2.6rem;
  font-size:1.05rem;
  border-radius:40px;
}

/* === MOBILE TWEAKS === */
@media (max-width: 768px){

  .mm-results-overall .mm-overall-row{
    grid-template-columns:1fr;
    gap:12px;
    text-align:left;
  }
  .mm-overall-left,
  .mm-overall-right{
    align-items:flex-start;
    width:100%;
  }
  .mm-overall-pill{
    justify-content:flex-start;
  }
  .mm-overall-pill-text{
    align-items:flex-start;
  }

  .mm-overall-cta .btn-primary{
    padding:.65rem 1.6rem;   /* chhota CTA */
    font-size:.95rem;
    width:100%;
    max-width:320px;
  }

  .mm-overall-logo-wrapper{
    order:-1;                 /* logo upar */
    padding-bottom:16px;
    justify-content:center;
  }
  .mm-overall-logo{
    width:180px;
    height:180px;
  }
}


/* SECTION CROSS SVG SIZE */
.mm-section-icon{
  width:240px;
  max-width:100%;
  height:auto;
  display:block;
  margin:0 auto;
}

.mm-scroll-prompt{
  position:relative;
  color:transparent;
  font-weight:600;
}
.mm-scroll-prompt::after{
  content:"↓ Scroll down for your detailed breakdown and helpful tips ↓";
  position:relative;
  display:block;
  color:var(--mm-muted);
}

.mm-results-actions{
  display:flex;
  flex-direction:column;
  gap:14px;
  justify-content:center;
  align-items:center;
  text-align:center;
  background:#ffffff;
  border:1px solid var(--mm-border);
  border-radius:16px;
  padding:22px 18px 20px;
  box-shadow:0 18px 45px rgba(15,23,42,.08);
}
.mm-restart-btn{
  padding:.45rem 1.4rem;
}
.mm-final-cta{
  margin-top:32px;
  padding:22px 18px 24px;
  background:#ffffff;
  border:1px solid var(--mm-border);
  border-radius:16px;
  box-shadow:0 18px 45px rgba(15,23,42,.08);
  text-align:center;
}

/* On-page results background (match /check page) */
body.mm-results-theme #resultsSection{
  position:relative;
  background:#00afaf60;
  background-image:url('https://mymoneymade.com/wp-content/uploads/2025/11/cropped-android-chrome-512x512-1.png');
  background-repeat:no-repeat;
  background-position:right -66px top -100px; /* tuck logo partially off-canvas top-right */
  background-size:280px;
  border-radius:18px;
  padding:38px 26px 42px;
  box-shadow:0 28px 65px rgba(15,23,42,.08);
  overflow:hidden;
  margin-top:24px;
}
body.mm-results-theme #resultsSection.mm-section{
  max-width:1100px;
  width:100%;
}
body.mm-results-theme #resultsSection > *{
  position:relative;
  z-index:1;
}

@media (max-width: 640px){
  body.mm-results-theme #resultsSection{
    padding:24px 18px 30px;
    margin-top:16px;
    background-position:right -48px top -63px;
    background-size:200px;
  }
  .mm-results-actions,
  .mm-final-cta{
    padding:18px 14px 20px;
    border-radius:14px;
  }
}

/* Force padding on mobile overlay views so content is not flush to header */
@media (max-width: 640px){
  body.mm-assessment-open.mm-results-theme #resultsSection{
    padding:24px 18px 30px !important;
    margin-top:16px !important;
  }
}


/* NEW — same style for both headings */
.mm-cta-heading{
  font-family:"Almarai", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight:800;
  font-size:1.2rem;   /* matches your .h4 size */
  line-height:1.2;
  color:#0f172a;
}
.mm-results-actions .mm-cta-heading,
.mm-final-cta .mm-cta-heading{
  margin-bottom:6px;
}


@media (max-width: 480px){
  .mm-model{width:220px;height:220px}
  .mm-categories{gap:10px;justify-content:center;align-items:center}
  .mm-cat{padding:8px 10px}
  .mm-foundations-wrapper .btn{white-space:normal}

  /* CTA button smaller + full width on mobile */
  #ctaBtn{
    font-size:0.9rem;
    padding:0.7rem 1.4rem;
    width:100%;
  }

  /* Slightly smaller heading on mobile */
  .mm-overall-label{
    font-size:1.5rem;
  }

  /* Stack + center everything on mobile */
  .mm-overall-row{
    flex-direction:column;
    text-align:center;
  }
  .mm-overall-logo-wrapper{
    order:-1; /* cross upar aa jaye mobile pe */
  }
}

/* Simple email gate modal */
.mm-email-modal{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:2000;
  background:rgba(15,23,42,.75);
  padding:18px;
}
.mm-email-modal.open{display:flex}
.mm-email-box{background:var(--mm-card);border:1px solid var(--mm-border);border-radius:12px;padding:16px;width:92%;max-width:420px;box-shadow:0 10px 30px rgba(2,6,23,.18)}
.mm-email-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.mm-email-row input{flex:1 1 auto;border:1px solid var(--mm-border);border-radius:10px;padding:10px}
.mm-email-row button{white-space:nowrap}
.mm-email-status{
  font-size:13px;
  color:#0f172a;
  display:flex;
  align-items:center;
  gap:8px;
}
.mm-email-spinner{
  display:inline-block;
  width:16px;
  height:16px;
  border:2px solid var(--mm-border);
  border-top-color:var(--mm-primary);
  border-radius:50%;
  animation:spin 1s linear infinite;
}

@media (max-width: 540px){
  .mm-email-box{
    width:94%;
    max-width:360px;
    padding:14px;
  }
  .mm-email-row{
    flex-direction:column;
    align-items:stretch;
  }
  .mm-email-row input,
  .mm-email-row button{
    width:100%;
  }
  .mm-email-box .btn{
    justify-content:center;
  }
  .mm-email-box .btn-link{
    width:100%;
    text-align:center;
  }
}

/* Donut center and tooltip */
.mm-model .mm-center-text{font-weight:700;fill:var(--mm-text)}
/* Use ID selector so theme styles cannot override tooltip colours */
#mmTip,
.mm-tip{
  position:fixed;
  z-index:2147483650;
  background:#0f172a; /* fixed dark so it does not depend on CSS vars */
  color:#fff;
  padding:8px 10px;
  border-radius:8px;
  font-size:12px;
  line-height:1.3;
  pointer-events:none;
  box-shadow:0 6px 20px rgba(2,6,23,.25);
  max-width:360px;
}
#mmTip .muted,
.mm-tip .muted{opacity:.8}

/* Legend pills */
.mm-legend-pills{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:10px;
  justify-content:center;
  align-items:stretch;
  margin-top:12px;
  width:100%;
}
.mm-pill{
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid rgba(0,94,110,.14);
  border-radius:14px;
  padding:10px 12px;
  background:linear-gradient(135deg, rgba(0,175,175,.08), rgba(0,94,110,.03));
  box-shadow:0 10px 28px rgba(2,6,23,.08);
  font-weight:600;
  color:var(--mm-ink);
}
.mm-dot{width:12px;height:12px;border-radius:999px;flex-shrink:0;box-shadow:0 0 0 2px #fff}
@media (max-width: 640px){
  .mm-legend-pills{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
}

/* Responsive header bar */
.mm-head{flex-wrap:wrap;gap:10px}
@media (max-width: 576px){
  .mm-head{flex-direction:column;align-items:stretch}
  .mm-progress{
    flex:none; /* remove 1 1 220px on mobile (no tall block) */
    width:92%;
  }
  .mm-section{
    padding:24px 12px;
  }
}

/* Tidy fieldset defaults */
.mm-card fieldset{border:0;margin:0;padding:0}
.mm-card legend{margin-bottom:10px}

/* Layout refinements */
main#app{padding:32px 0 48px}
.mm-hero .form-text{
  color:rgba(255,255,255,.86);
  text-align:left;
  margin-top:16px;
}

/* Wrapper and overall result image / copy */
.mm-foundations-wrapper{position:relative}
.mm-overall-row{
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  align-items:center;
}
.mm-overall-copy{flex:1 1 260px;min-width:0}
.mm-overall-media{display:flex;align-items:flex-start;gap:12px;margin-bottom:8px}
.mm-overall-house{max-width:90px;width:90px;height:auto;display:block;flex-shrink:0}
.mm-overall-text p{
  margin:0;
  font-size:.95rem;
  color:var(--mm-muted);
}
.mm-overall-cta .form-text{margin-top:4px}

@media (max-width: 768px){
  .mm-hero{padding:32px 0 24px}
  .mm-hero-title{font-size:1.9rem}
  .mm-hero-grid{
    flex-direction:column-reverse;
  }
  .mm-hero-visual-inner{
    width:220px;
  }
  .mm-hero-arrow,
  .mm-hero-house{
    display:none;
  }
  .mm-hero-copy{
    max-width:100%;
  }
  .mm-hero-cta{
    align-items:center;
  }
  .mm-hero .form-text{
    text-align:center;
  }
  .mm-categories{
    justify-content:center;
    align-items:center;
  }
  #questionSection.mm-section{padding-top:16px}
  .mm-overall-row{flex-direction:column;align-items:center}
  .mm-overall-copy{width:100%}
  .mm-overall-media{justify-content:center;text-align:left}
}

/* ========== PDF WRAPPER ========== */
#pdfContent .mm-pdf{
  font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  color:#0f172a;
  font-size:12px;
  line-height:1.5;
  padding:18px 24px 20px;
  margin:0 auto;
  max-width:190mm;
  box-sizing:border-box;
  background:#f4fbfd; /* light teal, same vibe as site hero */
}

/* ========== HEADER (LOGO + TITLE) ========== */
#pdfContent .mm-pdf-head{
  border-bottom:1px solid #e2e8f0;
  margin-bottom:14px;
  padding-bottom:8px;
}
#pdfContent .mm-pdf .brand-img{
  width:210px;
  height:auto;
  display:block;
  object-fit:contain;
}
#pdfContent .mm-pdf-head .title{
  font-size:16px;
  font-weight:700;
  margin-top:2px;
}
#pdfContent .mm-pdf-head .date{
  font-size:11px;
  color:#64748b;
}

/* ========== HEADINGS ========== */
#pdfContent .mm-pdf h2{
  font-size:18px;
  margin:12px 0 8px;
  page-break-after:avoid;
}
#pdfContent .mm-pdf h3{
  font-size:14px;
  margin:8px 0 6px;
  display:flex;
  align-items:center;
  gap:8px;
  page-break-after:avoid;
}

/* Generic blocks */
#pdfContent .mm-pdf .sec{
  margin-bottom:10px;
}
#pdfContent .mm-pdf .range{
  font-size:11px;
  color:#64748b;
  margin-left:4px;
}

/* Q&A blocks */
#pdfContent .mm-pdf .qblock{
  padding:8px 0;
  margin-bottom:6px;
  border-top:1px solid #e9eef3;
}
#pdfContent .mm-pdf .q{
  font-weight:600;
}
#pdfContent .mm-pdf .a{
  font-size:11px;
  color:#475569;
}
#pdfContent .mm-pdf .t{
  font-size:11px;
  margin-top:2px;
}

/* FOOTER */
#pdfContent .mm-pdf-foot{
  font-size:10px;
  color:#64748b;
  margin-top:12px;
  border-top:1px solid #e2e8f0;
  padding-top:6px;
}
#pdfContent .mm-pdf-foot .disclaimer{
  margin-top:4px;
}

/* ========== HERO CARD (Your Foundations Are) ========== */
#pdfContent .mm-pdf-hero{
  background:#ffffff;
  border-radius:18px;
  padding:20px 22px;
  margin-top:6px;
  display:flex;
  gap:24px;
  align-items:center;
}
#pdfContent .mm-pdf-hero-left{
  flex:0 0 auto;
  /* Match the on-page layout: place the cross/logo to the left with breathing room */
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding-left:12px;
  padding-right:16px;
}

/* LEFT: dynamic Make It Model cross, colour = overall result */
#pdfContent .mm-pdf-hero-cross{
  width:130px;
  height:130px;
  border-radius:26px;
  background:#fff7e6; /* soft background behind cross */
  display:flex;
  align-items:center;
  justify-content:center;
}
#pdfContent .mm-pdf-hero-svg{
  width:120px;
  height:120px;
  display:block;
}
#pdfContent .mm-pdf-hero-svg image{
  pointer-events:none;
  /* Ensure embedded image scales nicely for PDF and sits to the left inside its container */
  display:block;
  margin:0; /* align left inside the logo block to match on-page spacing */
  max-width:100%;
  height:auto;
  object-position:center;
}

/* Give the PDF logo container a right gap so text doesn't sit too close */
.mm-overall-logo-pdf{
  margin-right:14px;
}

#pdfContent .mm-pdf-hero-right{
  flex:1 1 auto;
}
#pdfContent .mm-pdf-hero-heading{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:4px;
}
#pdfContent .mm-pdf-hero-house{
  width:38px;
  height:38px;
  object-fit:contain;
}
#pdfContent .mm-pdf-hero-title{
  font-size:16px;
  font-weight:700;
}
#pdfContent .mm-pdf-hero-score{
  font-size:12px;
  font-weight:600;
  margin-top:2px;
}
#pdfContent .mm-pdf-hero-copy{
  font-size:11px;
  color:#475569;
  margin:6px 0 0;
}

/* ========== SECTION BREAKDOWN CARD (cross + legend + scores) ========== */
#pdfContent .mm-pdf .pdf-section-breakdown{
  margin-top:14px;
}
#pdfContent .mm-pdf .pdf-section-card{
  background:#ffffff;
  border-radius:18px;
  padding:22px 24px 18px;
}

/* 5-tile cross (grid, with per-section colours) */
#pdfContent .mm-pdf .pdf-foundation-cross{
  width:150px;
  height:150px;
  margin:0 auto 14px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:repeat(3,1fr);
  gap:8px;
}
#pdfContent .mm-pdf .pdf-cross-tile{
  border-radius:26px;
  display:flex;
  align-items:center;
  justify-content:center;
}
#pdfContent .mm-pdf .pdf-cross-tile img{
  width:32px;
  height:32px;
  object-fit:contain;
}
#pdfContent .mm-pdf .pdf-cross-top{ grid-column:2; grid-row:1; }
#pdfContent .mm-pdf .pdf-cross-left{ grid-column:1; grid-row:2; }
#pdfContent .mm-pdf .pdf-cross-center{ grid-column:2; grid-row:2; }
#pdfContent .mm-pdf .pdf-cross-right{ grid-column:3; grid-row:2; }
#pdfContent .mm-pdf .pdf-cross-bottom{ grid-column:2; grid-row:3; }

/* Legend (red / amber / green) */
#pdfContent .mm-pdf .pdf-section-legend{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  justify-content:center;
  font-size:10px;
  margin-bottom:8px;
}
#pdfContent .mm-pdf .legend-dot{
  width:7px;
  height:7px;
  border-radius:999px;
  display:inline-block;
  margin-right:6px;
}
#pdfContent .mm-pdf .legend-red{ background:#f04438; }
#pdfContent .mm-pdf .legend-amber{ background:#f59e0b; }
#pdfContent .mm-pdf .legend-green{ background:#22c55e; }

#pdfContent .mm-pdf .pdf-section-scores{
  font-size:10px;
  text-align:center;
  color:#334155;
  margin-top:4px;
}

/* ========== DETAILED Q&A ========== */
#pdfContent .mm-pdf .pdf-sec-icon{
  width:42px;
  height:auto;
  vertical-align:middle;
  margin-right:8px;
  display:inline-block;
  object-fit:contain;
}

#pdfContent .mm-pdf .sec,
#pdfContent .mm-pdf .qblock{
  page-break-inside:avoid;
  -webkit-column-break-inside:avoid;
  break-inside:avoid;
}
#pdfContent .mm-pdf h2,
#pdfContent .mm-pdf h3{
  page-break-after:avoid;
  break-inside:avoid;
}
#pdfContent .mm-pdf .sec + .sec{
  page-break-before:always;
  break-before:page;
  margin-top:8mm;
}

/* Lists */
#pdfContent .mm-pdf ul{
  padding-left:18px;
  margin:4px 0;
}
#pdfContent .mm-pdf li{
  margin:2px 0;
}
/* === NEW: screenshot images inside PDF === */
#pdfContent .mm-pdf-img-wrap{
  margin: 6px 0 10px;
}

#pdfContent .mm-pdf-img{
  display:block;
  max-width:100%;
  height:auto;
  border-radius:18px;
  box-shadow:0 4px 10px rgba(15, 23, 42, 0.12);
}
/* PDF cross logo – simple container, mask/mix-blend nahi (html2pdf friendly) */
.mm-overall-logo-pdf{
  width: 210px;
  height: 210px;
  border-radius: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* === PDF logo overlay helpers (cross + white symbol) === */
#pdfContent .mm-pdf .mm-pdf-logo-wrap{
  position: relative;
  width: 188px;
  height: 188px;
  display: inline-block;
}

#pdfContent .mm-pdf .mm-pdf-logo-wrap svg{
  width: 100%;
  height: 100%;
  display: block;
}

#pdfContent .mm-pdf .mm-pdf-logo-overlay{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}

#pdfContent .mm-pdf .mm-pdf-logo-wrap--small{
  width: 160px;
  height: 160px;
  margin: 0 auto;
}

.mm-overall-logo-pdf svg{
  width: 100%;
  height: 100%;
}
/* REMOVE TOP BLANK PAGE IN PDF */
#pdfContent {
  padding: 0 !important;
  margin: 0 !important;
}

.mm-pdf {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

html, body {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

@media print {
  body {
    margin: 0 !important;
    padding: 0 !important;
  }
}

.mm-assessment-overlay {
  position:fixed;
  inset:0;
  background:rgba(15,23,42,0.85);
  z-index:2147483646;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px 16px;
  overflow:auto;
  opacity:0;
  visibility:hidden;
  transition:opacity 0.25s ease;
  pointer-events:none;
}

body.mm-assessment-open .mm-assessment-overlay {
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

body.mm-contact-open .mm-overlay-logo,
body.mm-email-open .mm-overlay-logo{
  display:none !important;
}

body.mm-assessment-open .mm-foundations-wrapper {
    position:fixed;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width:min(100%,940px);
    max-height:calc(100vh - 32px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    border-radius:18px;
    background:#fff;
    z-index:2147483647;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    padding:16px 0 20px;
    min-height:calc(100vh - 32px);
  }


.mm-overlay-logo {
  position:absolute;
  top:18px;
  left:18px;
  display:none;
  z-index:2147483648;
}
  .mm-overlay-logo img {
    display:block;
    max-width:160px;
    height:auto;
  }
  body.mm-assessment-open .mm-overlay-logo {
    display:block;
  }
  body.mm-assessment-open .mm-footer .mm-brand {
    display:none;
  }
  body.mm-assessment-open .mm-footer {
    width:100%;
    margin-top:auto;
    padding-bottom:10px;
  }
  body.mm-assessment-open main#app {
    width:100%;
    max-width:960px;
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:center;
    gap:24px;
    padding:32px 20px 24px;
  }
  body.mm-assessment-open #questionSection,
  body.mm-assessment-open #resultsSection,
  body.mm-assessment-open #loadingSection {
    width:100%;
    max-width:960px;
    /* margin:0 auto; */
  }
  body.mm-assessment-open #loadingSection {
    text-align:center;
    flex-direction:column;
    align-items:center;
    gap:16px;
    padding:24px 0;
  }
  body.mm-assessment-open #loadingSection[hidden]{
    display:none !important;
  }
  body.mm-assessment-open #loadingSection:not([hidden]){
    display:flex;
  }

.mm-results-paper{
  background: #00afaf60;
  background-image:
    url('https://mymoneymade.com/wp-content/uploads/2025/11/cropped-android-chrome-512x512-1.png');
  background-repeat: no-repeat;
  background-position: center 120px;
  background-size: 260px;
  border-radius: 18px;
  padding: 12px 12px 24px;
}

  .mm-overlay-close {
    position: fixed;
    top: calc(env(safe-area-inset-top, 0px) + 16px) !important;
    right: calc(env(safe-area-inset-right, 0px) + 16px);
    z-index: 2147483648;

  /* Perfect circle */
  width: 48px;
  height: 48px;
  border-radius: 50%;

  background: #fff;
  color: #0f172a;

  font-size: 22px;
  font-weight: 800;
  line-height: 1;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.25);
  cursor: pointer;

  padding: 0; /* IMPORTANT */
}

.mm-overlay-close.mm-hide,
.mm-overlay-close.mm-overlay-contact-open{
  display:none !important;
}


body.admin-bar .mm-overlay-close{
  top:calc(46px + 12px);
}

@media (max-width: 640px){
  body.mm-assessment-open .mm-foundations-wrapper {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0 !important;
    padding: 12px 0 max(12px, env(safe-area-inset-bottom, 16px));
    overflow-y:auto;
  }
  body.mm-assessment-open main#app{
    padding: 64px 14px 20px;
    gap: 14px;
    justify-content: flex-start;
  }
  body.mm-assessment-open #questionSection,
  body.mm-assessment-open #resultsSection,
  body.mm-assessment-open #loadingSection{
    max-width: 100%;
    padding: 0;
  }
  body.mm-assessment-open #questionSection{
    margin-top: 12px;
  }
  .mm-overlay-logo {
    top: 18px;
    left: 14px;
  }
  .mm-overlay-logo img{
    max-width: 150px;
  }
  .mm-overlay-close {
    width: 46px;
    height: 46px;
    font-size: 20px;
    top: calc(env(safe-area-inset-top, 0px) + 18px) !important;
    right: calc(env(safe-area-inset-right, 0px) + 14px) !important;
  }
}

/* Front-end analytics shortcode */
.mm-analytics {
  margin: 20px 0;
  padding: 20px;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: linear-gradient(135deg, #f8fafc, #ecfeff);
  color: #0f172a;
}
.mm-analytics-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.mm-analytics-kicker {
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #475569;
  font-weight: 700;
}
.mm-analytics-title {
  margin: 4px 0 0;
  font-size: 20px;
  font-weight: 800;
  color: #0f172a;
}
.mm-analytics-pill {
  background: #0f172a;
  color: #fff;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
}
.mm-analytics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.mm-analytics-grid--wide {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.mm-analytics-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 14px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
}
.mm-analytics-label {
  font-size: 12px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #475569;
  margin-bottom: 4px;
  font-weight: 700;
}
.mm-analytics-value {
  font-size: 26px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 4px;
}
.mm-analytics-subtext {
  color: #64748b;
  font-size: 13px;
}
.mm-analytics-empty {
  margin: 12px 0 0;
  color: #475569;
}
.mm-analytics-bars {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 8px;
}
.mm-analytics-bar {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #0f172a;
}
.mm-analytics-bar-track {
  grid-column: 1 / span 2;
  width: 100%;
  height: 8px;
  background: #e2e8f0;
  border-radius: 999px;
  overflow: hidden;
}
.mm-analytics-bar-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #10b981, #22c55e);
  border-radius: 999px;
}
.mm-analytics-list {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mm-analytics-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  color: #0f172a;
}
.mm-analytics-list strong {
  font-size: 16px;
}
.mm-analytics-reset {
  margin-top: 8px;
}
.mm-analytics-reset button {
  background:#ef4444;
  color:#fff;
  border:none;
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  cursor:pointer;
}
.mm-analytics-reset button:hover {
  background:#dc2626;
}
.mm-analytics-reset-msg {
  margin:6px 0 0;
  color:#0f172a;
  font-weight:600;
}
@media (max-width: 640px){
  .mm-analytics {
    padding: 16px;
  }
  .mm-analytics-title {
    font-size: 18px;
  }
  .mm-analytics-value {
    font-size: 22px;
  }
}
