/* =========================================================================
   Muskie Musik Academy — site stylesheet
   Ported verbatim from the design-system tokens + components (see
   /root/muskie/uploads/design_handoff_muskie_musik_website). Values are not
   altered — only consolidated into one file and translated from React
   components into plain HTML/CSS classes.
   ========================================================================= */

/* ---- fonts (tokens/fonts.css) ---- */
@import url("https://fonts.googleapis.com/css2?family=Signika:wght@400;500;600;700&family=Source+Sans+3:ital,wght@0,400;0,600;0,700;1,400&family=Shantell+Sans:ital,wght@0,500;0,700;1,600&display=swap");

/* ---- color tokens (tokens/colors.css) ---- */
:root{
  --wine-900:#3D0917;
  --wine-800:#4F0C1E;
  --wine-700:#681028;
  --wine-600:#7F1832;
  --wine-500:#9A2440;
  --wine-300:#C9788C;
  --wine-100:#F1DDE2;
  --wine-050:#FAF0F2;

  --ink-900:#101818;
  --ink-800:#1F2A2A;
  --ink-700:#374242;
  --ink-500:#5C6666;
  --ink-300:#9BA3A3;
  --ink-200:#C7CDCD;
  --ink-100:#E4E7E6;

  --paper:#FBF8F4;
  --paper-2:#F4EFE8;
  --white:#FFFFFF;

  --brass-700:#8A6218;
  --brass-500:#C8922F;
  --brass-300:#E7C583;
  --brass-100:#FBF0DA;

  --success-600:#2F6B4F;
  --success-100:#E2F0E8;
  --warning-600:#9A6412;
  --warning-100:#FBF0DA;
  --danger-600:#A32020;
  --danger-100:#F8E4E2;
  --info-600:#2A5A73;
  --info-100:#E3EEF3;

  --brand:var(--wine-700);
  --brand-hover:var(--wine-800);
  --brand-active:var(--wine-900);
  --brand-tint:var(--wine-050);
  --accent:var(--brass-500);

  --text-strong:var(--ink-900);
  --text-body:var(--ink-800);
  --text-muted:var(--ink-500);
  --text-on-brand:#FFF6F8;
  --text-link:var(--wine-700);
  --text-link-hover:var(--wine-500);

  --surface-page:var(--paper);
  --surface-card:var(--white);
  --surface-sunken:var(--paper-2);
  --surface-brand:var(--wine-700);
  --surface-ink:var(--ink-900);

  --border-hairline:var(--ink-100);
  --border-strong:var(--ink-900);
  --border-brand:var(--wine-700);
  --focus-ring:var(--wine-500);

  /* ---- typography (tokens/typography.css) ---- */
  --font-heading:"Signika","Trebuchet MS",system-ui,sans-serif;
  --font-body:"Source Sans 3",-apple-system,"Segoe UI",sans-serif;
  --font-script:"Shantell Sans","Signika",cursive;
  --font-mono:ui-monospace,"SFMono-Regular",Menlo,monospace;

  --fs-display:clamp(2.75rem,5vw,4.25rem);
  --fs-h1:2.5rem;
  --fs-h2:1.875rem;
  --fs-h3:1.375rem;
  --fs-h4:1.125rem;
  --fs-lead:1.1875rem;
  --fs-body:1.0625rem;
  --fs-small:0.9375rem;
  --fs-caption:0.8125rem;
  --fs-eyebrow:0.75rem;

  --lh-tight:1.06;
  --lh-heading:1.18;
  --lh-body:1.6;
  --lh-loose:1.75;

  --fw-regular:400;
  --fw-medium:500;
  --fw-semibold:600;
  --fw-bold:700;

  --ls-display:-0.01em;
  --ls-heading:-0.005em;
  --ls-eyebrow:0.14em;

  --text-display:var(--fw-bold) var(--fs-display)/var(--lh-tight) var(--font-heading);
  --text-h2:var(--fw-semibold) var(--fs-h2)/var(--lh-heading) var(--font-heading);
  --text-h3:var(--fw-semibold) var(--fs-h3)/var(--lh-heading) var(--font-heading);
  --text-copy:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-body);

  /* ---- spacing (tokens/spacing.css) ---- */
  --space-0:0;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;
  --space-9:96px;
  --space-10:128px;

  --gutter:var(--space-5);
  --section-y:var(--space-9);
  --card-pad:var(--space-5);
  --container:1140px;
  --container-narrow:720px;

  /* ---- radii (tokens/radii.css) ---- */
  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:14px;
  --radius-xl:22px;
  --radius-pill:999px;
  --radius-circle:50%;
  --border-width:1px;
  --border-width-strong:2px;

  /* ---- elevation (tokens/elevation.css) ---- */
  --shadow-none:none;
  --shadow-sm:0 1px 2px rgba(16,24,24,.08);
  --shadow-card:0 2px 6px rgba(16,24,24,.07), 0 12px 28px -18px rgba(16,24,24,.22);
  --shadow-raised:0 6px 14px rgba(16,24,24,.10), 0 22px 44px -24px rgba(61,9,23,.28);
  --shadow-overlay:0 24px 64px -12px rgba(16,24,24,.42);
  --shadow-inset-line:inset 0 -1px 0 var(--border-hairline);
  --ring-focus:0 0 0 3px rgba(154,36,64,.32);

  /* ---- motion (tokens/motion.css) ---- */
  --ease-standard:cubic-bezier(.2,.6,.2,1);
  --ease-out:cubic-bezier(0,.6,.3,1);
  --ease-in:cubic-bezier(.5,0,1,.5);
  --dur-fast:120ms;
  --dur-base:200ms;
  --dur-slow:340ms;
  --transition-ui:background-color var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-base) var(--ease-standard), transform var(--dur-fast) var(--ease-standard);
}

/* ---- base (tokens/base.css) ---- */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--text-copy);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{font-family:var(--font-heading);color:var(--text-strong);letter-spacing:var(--ls-heading);line-height:var(--lh-heading);margin:0 0 var(--space-3)}
h1{font-size:var(--fs-h1);font-weight:var(--fw-bold)}
h2{font-size:var(--fs-h2);font-weight:var(--fw-semibold)}
h3{font-size:var(--fs-h3);font-weight:var(--fw-semibold)}
h4{font-size:var(--fs-h4);font-weight:var(--fw-semibold)}
p{margin:0 0 var(--space-4)}
a{color:var(--text-link);text-decoration-thickness:1px;text-underline-offset:3px;transition:color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--text-link-hover)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.eyebrow{font-family:var(--font-heading);font-size:var(--fs-eyebrow);font-weight:var(--fw-semibold);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--wine-700)}
.script{font-family:var(--font-script);font-weight:700}
.container{max-width:var(--container);margin:0 auto;padding:0 var(--space-5)}

img{max-width:100%}
button{font:inherit}

/* ---- components (components/components.css) ---- */
.mm-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-family:var(--font-heading);font-weight:var(--fw-semibold);border:var(--border-width-strong) solid transparent;border-radius:var(--radius-pill);cursor:pointer;text-decoration:none;transition:var(--transition-ui)}
.mm-btn--md{font-size:1rem;padding:11px 24px}
.mm-btn--sm{font-size:.875rem;padding:7px 16px}
.mm-btn--lg{font-size:1.125rem;padding:15px 32px}
.mm-btn--primary{background:var(--wine-700);color:var(--text-on-brand);border-color:var(--wine-700)}
.mm-btn--primary:hover{background:var(--wine-800);border-color:var(--wine-800)}
.mm-btn--primary:active{background:var(--wine-900);transform:translateY(1px)}
.mm-btn--secondary{background:transparent;color:var(--wine-700);border-color:var(--wine-700)}
.mm-btn--secondary:hover{background:var(--wine-050)}
.mm-btn--secondary:active{background:var(--wine-100);transform:translateY(1px)}
.mm-btn--ghost{background:transparent;color:var(--ink-800);border-color:transparent;border-radius:var(--radius-md)}
.mm-btn--ghost:hover{background:var(--paper-2)}
.mm-btn--ghost:active{transform:translateY(1px)}
.mm-btn--brass{background:var(--brass-500);color:var(--ink-900);border-color:var(--brass-500)}
.mm-btn--brass:hover{background:var(--brass-300)}
.mm-btn--brass:active{background:var(--brass-700);color:#fff;transform:translateY(1px)}
.mm-btn:disabled,.mm-btn[aria-disabled="true"]{opacity:.42;cursor:not-allowed;transform:none}
.mm-btn:focus-visible{outline:none;box-shadow:var(--ring-focus)}
.mm-btn--block{width:100%}

.mm-iconbtn{display:inline-flex;align-items:center;justify-content:center;border:var(--border-width) solid var(--border-hairline);background:var(--white);color:var(--ink-800);border-radius:var(--radius-circle);cursor:pointer;transition:var(--transition-ui)}
.mm-iconbtn--sm{width:32px;height:32px}
.mm-iconbtn--md{width:40px;height:40px}
.mm-iconbtn--lg{width:48px;height:48px}
.mm-iconbtn:hover{background:var(--wine-050);border-color:var(--wine-300);color:var(--wine-700)}
.mm-iconbtn:active{transform:translateY(1px)}
.mm-iconbtn--plain{border-color:transparent;background:transparent}
.mm-iconbtn:focus-visible{outline:none;box-shadow:var(--ring-focus)}

.mm-field{display:flex;flex-direction:column;gap:var(--space-2)}
.mm-label{font-family:var(--font-heading);font-size:var(--fs-small);font-weight:var(--fw-semibold);color:var(--ink-800);display:block}
.mm-label__req{color:var(--wine-600)}
.mm-hint{font-size:var(--fs-caption);color:var(--text-muted)}
.mm-error{font-size:var(--fs-caption);color:var(--danger-600);font-weight:var(--fw-semibold)}
.mm-input,.mm-select,.mm-textarea{font:var(--text-copy);color:var(--text-body);background:var(--white);border:var(--border-width) solid var(--ink-200);border-radius:var(--radius-md);padding:10px 12px;transition:var(--transition-ui);width:100%}
.mm-textarea{min-height:110px;resize:vertical}
.mm-input::placeholder,.mm-textarea::placeholder{color:var(--ink-300)}
.mm-input:hover,.mm-select:hover,.mm-textarea:hover{border-color:var(--ink-300)}
.mm-input:focus,.mm-select:focus,.mm-textarea:focus{outline:none;border-color:var(--wine-500);box-shadow:var(--ring-focus)}
.mm-input[aria-invalid="true"],.mm-textarea[aria-invalid="true"]{border-color:var(--danger-600)}
.mm-input:disabled,.mm-select:disabled{background:var(--paper-2);color:var(--ink-300);cursor:not-allowed}
.mm-select{appearance:none;padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,var(--ink-500) 50%),linear-gradient(135deg,var(--ink-500) 50%,transparent 50%);background-position:calc(100% - 18px) 52%,calc(100% - 13px) 52%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}

.mm-choice{display:inline-flex;align-items:flex-start;gap:var(--space-3);cursor:pointer;font-size:var(--fs-body);color:var(--text-body)}
.mm-choice input{position:absolute;opacity:0;width:0;height:0}
.mm-choice__box{flex:none;width:20px;height:20px;margin-top:2px;border:var(--border-width-strong) solid var(--ink-300);background:var(--white);transition:var(--transition-ui);display:grid;place-items:center}
.mm-choice--check .mm-choice__box{border-radius:var(--radius-sm)}
.mm-choice--radio .mm-choice__box{border-radius:var(--radius-circle)}
.mm-choice:hover .mm-choice__box{border-color:var(--wine-500)}
.mm-choice input:checked + .mm-choice__box{background:var(--wine-700);border-color:var(--wine-700)}
.mm-choice input:focus-visible + .mm-choice__box{box-shadow:var(--ring-focus)}
.mm-choice__mark{width:11px;height:11px;color:#fff;opacity:0;transition:opacity var(--dur-fast) var(--ease-standard)}
.mm-choice input:checked + .mm-choice__box .mm-choice__mark{opacity:1}
.mm-choice--radio .mm-choice__mark{width:8px;height:8px;border-radius:var(--radius-circle);background:#fff}
.mm-choice[data-disabled="true"]{opacity:.45;cursor:not-allowed}
.mm-choice__sub{display:block;font-size:var(--fs-caption);color:var(--text-muted)}

.mm-switch{display:inline-flex;align-items:center;gap:var(--space-3);cursor:pointer;font-size:var(--fs-body);border:none;background:none;padding:0}
.mm-switch__track{position:relative;flex:none;width:46px;height:26px;border-radius:var(--radius-pill);background:var(--ink-200);transition:var(--transition-ui)}
.mm-switch__knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:var(--radius-circle);background:#fff;box-shadow:var(--shadow-sm);transition:transform var(--dur-base) var(--ease-standard)}
.mm-switch[data-on="true"] .mm-switch__track{background:var(--wine-700)}
.mm-switch[data-on="true"] .mm-switch__knob{transform:translateX(20px)}
.mm-switch:hover .mm-switch__track{background:var(--ink-300)}
.mm-switch[data-on="true"]:hover .mm-switch__track{background:var(--wine-800)}
.mm-switch[data-disabled="true"]{opacity:.45;cursor:not-allowed}
.mm-switch:focus-visible{outline:none}
.mm-switch:focus-visible .mm-switch__track{box-shadow:var(--ring-focus)}

.mm-card{background:var(--surface-card);border:var(--border-width) solid var(--border-hairline);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:var(--card-pad)}
.mm-card--flat{box-shadow:none}
.mm-card--sunken{background:var(--surface-sunken);box-shadow:none;border-color:transparent}
.mm-card--ink{background:var(--surface-ink);border-color:var(--ink-800);color:var(--paper);box-shadow:none}
.mm-card--brand{background:var(--surface-brand);border-color:var(--wine-800);color:var(--text-on-brand);box-shadow:none}
.mm-card--ink h3,.mm-card--brand h3{color:inherit}
.mm-card--interactive{cursor:pointer;transition:var(--transition-ui)}
.mm-card--interactive:hover{box-shadow:var(--shadow-raised);border-color:var(--wine-300);transform:translateY(-2px)}
.mm-card--interactive:active{transform:translateY(0)}
a.mm-card{text-decoration:none;display:block;color:inherit}

.mm-badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-heading);font-size:var(--fs-caption);font-weight:var(--fw-semibold);padding:3px 10px;border-radius:var(--radius-pill);letter-spacing:.01em}
.mm-badge--brand{background:var(--wine-100);color:var(--wine-800)}
.mm-badge--ink{background:var(--ink-900);color:var(--paper)}
.mm-badge--brass{background:var(--brass-100);color:var(--brass-700)}
.mm-badge--success{background:var(--success-100);color:var(--success-600)}
.mm-badge--warning{background:var(--warning-100);color:var(--warning-600)}
.mm-badge--danger{background:var(--danger-100);color:var(--danger-600)}
.mm-badge--info{background:var(--info-100);color:var(--info-600)}
.mm-badge--outline{background:transparent;color:var(--wine-700);box-shadow:inset 0 0 0 1px var(--wine-300)}

.mm-tag{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-small);color:var(--ink-800);background:var(--white);border:var(--border-width) solid var(--ink-200);border-radius:var(--radius-pill);padding:5px 12px;transition:var(--transition-ui)}
.mm-tag--selected{background:var(--wine-700);border-color:var(--wine-700);color:var(--text-on-brand)}
.mm-tag--clickable{cursor:pointer}
.mm-tag--clickable:hover{border-color:var(--wine-500);color:var(--wine-700)}
.mm-tag--selected.mm-tag--clickable:hover{background:var(--wine-800);color:var(--text-on-brand)}
button.mm-tag{font-family:inherit}

.mm-tabs{display:flex;gap:var(--space-5);border-bottom:var(--border-width) solid var(--border-hairline)}
.mm-tabs__tab{position:relative;font-family:var(--font-heading);font-size:var(--fs-body);font-weight:var(--fw-semibold);color:var(--text-muted);background:none;border:none;padding:0 0 12px;cursor:pointer;transition:var(--transition-ui)}
.mm-tabs__tab:hover{color:var(--ink-900)}
.mm-tabs__tab[aria-selected="true"]{color:var(--wine-700)}
.mm-tabs__tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:var(--radius-pill);background:var(--wine-700)}
.mm-tabs__tab:focus-visible{outline:none;box-shadow:var(--ring-focus);border-radius:var(--radius-sm)}

.mm-dialog__scrim{position:fixed;inset:0;background:rgba(16,24,24,.5);backdrop-filter:blur(3px);display:grid;place-items:center;padding:var(--space-5);z-index:60}
.mm-dialog{background:var(--surface-card);border-radius:var(--radius-xl);box-shadow:var(--shadow-overlay);max-width:520px;width:100%;padding:var(--space-6);border-top:6px solid var(--wine-700);animation:mm-dialog-in var(--dur-slow) var(--ease-standard)}
@keyframes mm-dialog-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.mm-dialog__head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4)}
.mm-dialog__actions{display:flex;gap:var(--space-3);justify-content:flex-end;margin-top:var(--space-5)}

.mm-toast{display:flex;align-items:flex-start;gap:var(--space-3);background:var(--ink-900);color:var(--paper);border-radius:var(--radius-md);box-shadow:var(--shadow-raised);padding:var(--space-3) var(--space-4);max-width:420px;font-size:var(--fs-small)}
.mm-toast__bar{flex:none;width:4px;align-self:stretch;border-radius:var(--radius-pill);background:var(--brass-500)}
.mm-toast--success .mm-toast__bar{background:#79C79E}
.mm-toast--danger .mm-toast__bar{background:#E8837C}
.mm-toast__title{font-family:var(--font-heading);font-weight:var(--fw-semibold);display:block}
.mm-toast__body{opacity:.82}
.mm-toast__x{display:grid;place-items:center;width:16px;height:16px;border:none;background:transparent;color:var(--paper);cursor:pointer;opacity:.7;font-size:14px;line-height:1;padding:0;margin-left:auto}
.mm-toast__x:hover{opacity:1}

.mm-logo{display:inline-flex;align-items:center;gap:var(--space-3);text-decoration:none;color:inherit}
.mm-logo img{display:block}
.mm-logo__word{font-family:var(--font-heading);font-weight:var(--fw-bold);line-height:1.05;letter-spacing:-.01em}
.mm-logo__word small{display:block;font-family:var(--font-body);font-weight:var(--fw-regular);letter-spacing:.16em;text-transform:uppercase;opacity:.75}

.mm-sechead{display:flex;flex-direction:column;gap:var(--space-2);max-width:640px}
.mm-sechead--center{margin:0 auto;text-align:center;align-items:center}
.mm-sechead__title{font-family:var(--font-heading);font-weight:var(--fw-bold);font-size:var(--fs-h2);line-height:var(--lh-heading);color:var(--text-strong);margin:0}
.mm-sechead__sub{color:var(--text-muted);font-size:var(--fs-lead);margin:0}

.mm-classcard{display:flex;flex-direction:column;gap:var(--space-3)}
.mm-classcard__top{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3)}
.mm-classcard__ages{font-family:var(--font-heading);font-size:var(--fs-caption);font-weight:var(--fw-semibold);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--wine-700)}
.mm-classcard__name{font-family:var(--font-heading);font-size:var(--fs-h3);font-weight:var(--fw-semibold);color:var(--text-strong);margin:0}
.mm-classcard__desc{margin:0;color:var(--text-body);font-size:var(--fs-small);line-height:var(--lh-body)}
.mm-classcard__meta{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);align-items:center;border-top:var(--border-width) solid var(--border-hairline);padding-top:var(--space-3);margin-top:auto}
.mm-classcard__price{font-family:var(--font-heading);font-weight:var(--fw-bold);font-size:var(--fs-h4);color:var(--wine-700)}
.mm-classcard__price span{font-family:var(--font-body);font-weight:var(--fw-regular);font-size:var(--fs-caption);color:var(--text-muted)}
.mm-classcard__times{display:flex;flex-wrap:wrap;gap:var(--space-2)}

.mm-teacher{display:flex;gap:var(--space-5);align-items:flex-start}
.mm-teacher__photo{flex:none;width:104px;height:104px;border-radius:var(--radius-circle);background:var(--paper-2);border:3px solid var(--wine-700);object-fit:cover;display:grid;place-items:center;font-family:var(--font-script);font-size:1.75rem;color:var(--wine-700);overflow:hidden}
.mm-teacher__name{font-family:var(--font-heading);font-size:var(--fs-h3);font-weight:var(--fw-semibold);margin:0}
.mm-teacher__role{font-size:var(--fs-small);color:var(--wine-700);font-weight:var(--fw-semibold);margin:0 0 var(--space-2)}
.mm-teacher__bio{margin:0;font-size:var(--fs-small);line-height:var(--lh-body);color:var(--text-body)}

/* ---- reduced motion (README requirement) ---- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
}

/* =========================================================================
   Site-chrome + page layout (new, plain-HTML port of SiteChrome.jsx /
   HomeScreen.jsx / ClassesScreen.jsx / FacultyScreen.jsx / EnrollScreen.jsx —
   markup only, all values above are unchanged tokens)
   ========================================================================= */

.mm-announce{background:var(--ink-900);color:var(--paper);text-align:center;padding:9px var(--space-4);font-size:var(--fs-caption);font-family:var(--font-heading);letter-spacing:.02em}

.mm-header{position:sticky;top:0;z-index:20;background:rgba(251,248,244,.92);backdrop-filter:blur(8px);box-shadow:var(--shadow-inset-line)}
.mm-header__row{display:flex;align-items:center;justify-content:space-between;height:88px;gap:var(--space-5)}
.mm-header__nav{display:flex;align-items:center;gap:var(--space-5)}
.mm-header__link{font-family:var(--font-heading);font-weight:600;font-size:var(--fs-small);text-decoration:none;color:var(--ink-700)}
.mm-header__link:hover{color:var(--wine-500)}
.mm-header__link[aria-current="page"]{color:var(--wine-700)}

.mm-footer{background:var(--wine-700);color:var(--text-on-brand);margin-top:var(--space-9);padding:var(--space-8) 0 var(--space-6)}
.mm-footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--space-7);align-items:start}
.mm-footer__blurb{margin-top:var(--space-4);max-width:32ch;opacity:.85;font-size:var(--fs-small)}
.mm-footer__eyebrow{color:var(--brass-300)}
.mm-footer__text{margin-top:var(--space-3);font-size:var(--fs-small);opacity:.9}
.mm-footer__cta{color:var(--brass-300);font-size:var(--fs-small);font-weight:600;display:inline-block;margin-top:var(--space-2)}
.mm-footer__bottom{margin-top:var(--space-6);padding-top:var(--space-4);border-top:1px solid rgba(255,246,248,.22);font-size:var(--fs-caption);opacity:.7}

/* Home hero */
.mm-hero{background:var(--paper-2);padding:var(--space-9) 0;border-bottom:1px solid var(--border-hairline)}
.mm-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--space-8);align-items:center}
.mm-hero__title{font:var(--text-display);letter-spacing:var(--ls-display);margin:var(--space-3) 0 var(--space-4)}
.mm-hero__lead{font-size:var(--fs-lead);color:var(--text-body);max-width:46ch}
.mm-hero__ctas{display:flex;gap:var(--space-3);margin-top:var(--space-5);flex-wrap:wrap}
.mm-hero__badges{display:flex;gap:var(--space-2);margin-top:var(--space-5);flex-wrap:wrap}
.mm-hero__art{display:grid;place-items:center}

.mm-section{padding:var(--space-8) 0 0}
.mm-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gutter);margin-top:var(--space-6);align-items:stretch}
.mm-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter);margin-top:var(--space-6)}

.mm-ink-callout{display:grid;grid-template-columns:1fr auto;gap:var(--space-6);align-items:center;padding:var(--space-7);border-radius:var(--radius-xl)}
.mm-ink-callout h2{color:var(--paper);margin:var(--space-2) 0 var(--space-3)}
.mm-ink-callout p{margin:0;opacity:.82;max-width:52ch}
.mm-ink-callout__tags{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-top:var(--space-4)}
.mm-ink-callout__tags .mm-tag{background:transparent;border-color:rgba(255,246,248,.3);color:var(--paper)}

.mm-faculty-preview{display:flex;flex-direction:column;gap:var(--space-3);text-align:left}
.mm-faculty-preview .mm-teacher__photo{width:72px;height:72px;font-size:1.2rem}

.mm-footnote{margin-top:var(--space-4);font-size:var(--fs-small);color:var(--text-muted)}

/* Classes screen */
.mm-filterbar{display:flex;gap:var(--space-2);margin-bottom:var(--space-5);align-items:center;flex-wrap:wrap}
.mm-filterbar__label{font-size:var(--fs-caption);color:var(--text-muted);margin-right:4px}

.mm-rate-row{display:grid;grid-template-columns:1.4fr 1fr auto auto;gap:var(--space-5);align-items:center;padding:var(--space-4) var(--space-5)}
.mm-rate-row + .mm-rate-row{border-top:1px solid var(--border-hairline)}
.mm-rate-row__name{font-family:var(--font-heading);font-weight:600;color:var(--text-strong)}
.mm-rate-row__ages{font-size:var(--fs-small);color:var(--text-muted)}
.mm-rate-row__price{font-family:var(--font-heading);font-weight:700;color:var(--wine-700)}
.mm-rate-row__price span{font-family:var(--font-body);font-weight:400;font-size:var(--fs-caption);color:var(--text-muted)}

.mm-sunken-cta{margin-top:var(--space-6);display:flex;gap:var(--space-5);align-items:center;justify-content:space-between;flex-wrap:wrap}

/* Faculty screen */
.mm-faculty-list{display:flex;flex-direction:column;gap:var(--gutter);margin-top:var(--space-6)}
.mm-brand-cta{margin-top:var(--space-6);display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);padding:var(--space-6);flex-wrap:wrap}

/* Enroll screen */
.mm-enroll-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:var(--gutter);margin-top:var(--space-6);align-items:start}
.mm-enroll-form{display:flex;flex-direction:column;gap:var(--space-5)}
.mm-enroll-2col{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.mm-radio-row{display:flex;gap:var(--space-6);flex-wrap:wrap}
.mm-check-stack{display:flex;flex-direction:column;gap:var(--space-3)}
.mm-form-actions{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap}
.mm-summary{display:flex;flex-direction:column;gap:var(--space-3)}
.mm-summary__badges{display:flex;gap:var(--space-2);flex-wrap:wrap}
.mm-summary hr{border:none;border-top:1px solid var(--border-hairline);margin:var(--space-2) 0}
.mm-toast-anchor{position:fixed;bottom:var(--space-5);left:var(--space-5);z-index:80}

@media (max-width: 860px){
  .mm-hero__grid{grid-template-columns:1fr}
  .mm-hero__art{order:-1}
  .mm-grid-3{grid-template-columns:1fr}
  .mm-grid-2{grid-template-columns:1fr}
  .mm-ink-callout{grid-template-columns:1fr}
  .mm-footer__grid{grid-template-columns:1fr}
  .mm-enroll-grid{grid-template-columns:1fr}
  .mm-enroll-2col{grid-template-columns:1fr}
  .mm-rate-row{grid-template-columns:1fr;text-align:left}
  .mm-header__row{height:auto;padding:var(--space-3) 0;flex-wrap:wrap}
  .mm-header__nav{flex-wrap:wrap;gap:var(--space-4)}
}