/* Mysore Masala Studios / guidebook v2; established tokens and logo system retained / 02 October 2026 */
@font-face {
  font-family: "MMS Anton";
  src: url("fonts/Anton-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "MMS Nunito Sans";
  src: url("fonts/NunitoSans[YTLC,opsz,wdth,wght].ttf") format("truetype");
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
}
@font-face {
  font-family: "MMS Barlow";
  src: url("fonts/BarlowCondensed-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "MMS Fredoka";
  src: url("fonts/Fredoka-Semibold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "MMS Bree";
  src: url("fonts/BreeSerif-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "MMS Sora";
  src: url("fonts/Sora-Semibold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
}
.mms-page {
  --mms-paper: #FBF1E3;
  --mms-parchment: #F0DFC7;
  --mms-chilli: #B93216;
  --mms-roasted: #92270F;
  --mms-gold: #ECA434;
  --mms-leaf: #53612E;
  --mms-espresso: #2B1B12;
  --mms-brown: #725B46;
  --mms-sand: #CBB392;
  --mms-bg: var(--mms-paper);
  --mms-surface: var(--mms-parchment);
  --mms-text: var(--mms-espresso);
  --mms-muted: var(--mms-brown);
  --mms-heading: var(--mms-chilli);
  --mms-action: var(--mms-chilli);
  --mms-action-text: var(--mms-paper);
  --mms-hover: var(--mms-roasted);
  --mms-link: var(--mms-chilli);
  --mms-focus: var(--mms-leaf);
  --mms-input-border: var(--mms-brown);
  --mms-success: var(--mms-leaf);
  --mms-error: var(--mms-chilli);
  background: var(--mms-bg);
  color: var(--mms-text);
  font-family: "MMS Nunito Sans", system-ui, sans-serif;
  font-weight: 400;
  font-size: clamp(1rem, 1.1vw, 1.125rem);
  line-height: 1.55;
  font-synthesis: none;
}
.mms-page *, .mms-page *::before, .mms-page *::after { box-sizing: border-box; }
.mms-page [data-brand-theme="dark"] {
  --mms-bg: var(--mms-espresso);
  --mms-surface: var(--mms-espresso);
  --mms-text: var(--mms-paper);
  --mms-muted: var(--mms-parchment);
  --mms-heading: var(--mms-paper);
  --mms-action: var(--mms-paper);
  --mms-action-text: var(--mms-chilli);
  --mms-hover: var(--mms-parchment);
  --mms-link: var(--mms-gold);
  --mms-focus: var(--mms-gold);
  --mms-input-border: var(--mms-sand);
  --mms-success: var(--mms-paper);
  --mms-error: var(--mms-gold);
}
.mms-page [data-brand-theme="story"] {
  --mms-bg: var(--mms-chilli);
  --mms-surface: var(--mms-chilli);
  --mms-text: var(--mms-paper);
  --mms-muted: var(--mms-paper);
  --mms-heading: var(--mms-paper);
  --mms-action: var(--mms-paper);
  --mms-action-text: var(--mms-chilli);
  --mms-hover: var(--mms-parchment);
  --mms-link: var(--mms-paper);
  --mms-focus: var(--mms-paper);
  --mms-input-border: var(--mms-paper);
  --mms-success: var(--mms-paper);
  --mms-error: var(--mms-paper);
}
.mms-section { background: var(--mms-bg); color: var(--mms-text); padding-block: clamp(3rem, 6vw, 6rem); }
.mms-container { width: min(1200px, calc(100% - 48px)); margin-inline: auto; }
.mms-heading { font-family: "MMS Anton", Impact, sans-serif; font-weight: 400; color: var(--mms-heading); line-height: 1.05; margin: 0 0 24px; }
.mms-heading--hero { font-size: clamp(3rem, 7vw, 5.5rem); }
.mms-heading--section { font-size: clamp(2rem, 4vw, 3rem); }
.mms-body { max-width: 65ch; margin: 0 0 24px; }
.mms-eyebrow { font-size: 0.75rem; letter-spacing: 0.08em; font-weight: 700; text-transform: uppercase; color: var(--mms-muted); }
.mms-surface { padding: 32px; border-radius: 12px; background: var(--mms-surface); color: var(--mms-text); }
.mms-art { display: block; width: 100%; height: auto; border-radius: 8px; }
.mms-logo { display: block; width: 120px; height: auto; flex-shrink: 0; }
.mms-logo--horizontal { width: 220px; }
.mms-logo--micro { width: 32px; }
.mms-button { display: inline-flex; justify-content: center; align-items: center; gap: 12px; min-height: 44px; padding: 12px 24px; border: 1px solid transparent; border-radius: 8px; font: inherit; font-weight: 700; line-height: 1.2; text-decoration: none; cursor: pointer; }
.mms-button--primary { background: var(--mms-action); color: var(--mms-action-text); }
.mms-button--primary:hover { background: var(--mms-hover); }
.mms-button--secondary { background: transparent; color: var(--mms-link); border-color: currentColor; }
.mms-button--secondary:hover { text-decoration: underline; }
.mms-link { color: var(--mms-link); text-decoration: underline; text-underline-offset: 0.2em; }
.mms-field { width: 100%; min-height: 44px; padding: 12px 16px; border: 1px solid var(--mms-input-border); border-radius: 8px; background: var(--mms-bg); color: var(--mms-text); font: inherit; }
.mms-field::placeholder { color: var(--mms-muted); opacity: 1; }
.mms-status { font-weight: 700; }
.mms-status--success { color: var(--mms-success); }
.mms-status--error { color: var(--mms-error); }
.mms-page :is(a, button, input, textarea, select):focus-visible { outline: 3px solid var(--mms-focus); outline-offset: 4px; }
.mms-page :is(button, input, textarea, select):disabled { opacity: 0.6; cursor: not-allowed; }
/* One campaign-scoped heading variation per artifact. Never apply to the logo. */
.mms-type--compact { font-family: "MMS Barlow", sans-serif; font-weight: 700; }
.mms-type--rounded { font-family: "MMS Fredoka", sans-serif; font-weight: 600; }
.mms-type--story { font-family: "MMS Bree", serif; font-weight: 400; }
.mms-type--technical { font-family: "MMS Sora", sans-serif; font-weight: 600; }
.mms-type--friendly { font-family: "MMS Nunito Sans", sans-serif; font-weight: 800; }
@media (max-width: 600px) { .mms-surface { padding: 24px; } }
@media (prefers-reduced-motion: reduce) { .mms-page *, .mms-page *::before, .mms-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }