/* Variant A: Light, trustworthy theme for 45+ */
:root{
  --brand-bg:#f7f7f5;             /* warm white */
  --brand-surface:#ffffff;         /* cards */
  --brand-text:#1a1f2a;            /* graphite/dark */
  --brand-text-muted:#626a7a;      /* muted */
  --brand-accent:#2a6f6b;          /* steel green-blue */
  --brand-accent-weak:rgba(42,111,107,.12);
  --brand-border:#e7e7e2;
}

html#html, body#body{background:var(--brand-bg);color:var(--brand-text);font-family:Inter18pt, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif}

/* Containers */
.step__container{background:transparent}
.step__img{box-shadow:0 10rem 20rem rgba(0,0,0,.08);background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,0))}
.step__card{background:var(--brand-surface);box-shadow:0 8rem 24rem rgba(0,0,0,.06);border:1px solid var(--brand-border)}
.step__card p{color:var(--brand-text)}
.step__card p span.--underline{color:var(--brand-text);text-decoration-color:var(--brand-accent)}
.step__card.--name p{color:var(--brand-text-muted);font-variant-numeric:tabular-nums;}
.step__card.--name p .num{font-feature-settings:"tnum" 1, "ss01" 1;letter-spacing:.01em}
.step__card.--name p .unit{opacity:.85}

/* Buttons */
.button{background:var(--brand-accent);box-shadow:0 12rem 18rem -10rem rgba(0,0,0,.2), inset 0 -4rem 8rem rgba(0,0,0,.08);border:1px solid var(--brand-accent-weak);color:#fff}
.button.--no{background:#eef4f3;color:var(--brand-text);border-color:var(--brand-accent-weak)}
.button.--lg{min-width:280rem}

/* Loader */
.step__loader span{background:var(--brand-accent)}

/* Motion: fade-only, no translate shifts */
.loading{opacity:0;transition:opacity .6s ease}
.loading.loaded{opacity:1}

/* Rounded visuals */
.step__img, .step__img img, .step__card{border-radius:12px}

/* Scrollbar (subtle) */
.step__container::-webkit-scrollbar-track{background:rgba(0,0,0,.04)}
.step__container::-webkit-scrollbar-thumb{background:rgba(0,0,0,.18)}
.step__container::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.28)}

/* Typography and readability for 45+ */
@media (min-width:0px){
  body#body{line-height:1.6}
  .step__card p{line-height:1.6}
  .button{font-size:1em;letter-spacing:.02em}
}

/* Progress bar */
.progress{position:sticky;top:0;left:0;z-index:10;display:flex;align-items:center;gap:8rem;height:22rem;padding:0 12rem;background:rgba(255,255,255,.7);backdrop-filter:saturate(110%) blur(8px)}
.progress__bar{height:6rem;width:0;background:linear-gradient(90deg,var(--brand-accent),#3f8b86);border-radius:999px;box-shadow:0 4rem 10rem rgba(0,0,0,.15)}
.progress::before{content:"";position:absolute;inset:auto 12rem 8rem 12rem;height:6rem;background:#e9eeed;border-radius:999px}
.progress__bar{position:absolute;inset:auto 12rem 8rem 12rem}
.progress__label{margin-left:auto;font-size:.75em;color:var(--brand-text-muted)}

/* Emoji softening (kept minimal) */
.emoji{display:inline-block;filter:saturate(.8) contrast(.95) opacity(.95);font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",emoji}
@media (prefers-reduced-motion: reduce){.emoji{transform:none}}

