/* MaxiCoin — generated from tokens.json */
:root, [data-theme="light"] {
  --maxi-red: #d63b49; /* Brand red, from the logo's MAXI. Primary buttons and key highlights; text and links on `surface` (4.6:1 light, 5.5:1 dark). Put `on-red` text on it. */
  --maxi-red-strong: #b82f3c; /* Hover and pressed state of `maxi-red`; focus ring (3:1+ on every surface); red text on `maxi-red-tint`. */
  --maxi-red-tint: #fbe9eb; /* Quiet red ground for selected rows and brand callouts; text on it is `ink` or `maxi-red-strong`. */
  --on-red: #ffffff; /* Text and icons on `maxi-red` and `maxi-red-strong` fills. */
  --coin-grey: #7f7f7f; /* Brand grey, from the logo's COIN. Decorative fills and display text 24px+ only: 4.0:1 on white fails body text — use `ink-muted` for small text. */
  --ink: #1f1f1f; /* Headings and body text on `surface`, `surface-subtle` and `maxi-red-tint`. */
  --ink-muted: #595959; /* Secondary text, captions and labels on `surface` and `surface-subtle` (6.4:1+ both themes). */
  --surface: #ffffff; /* Page background. */
  --surface-subtle: #f5f5f5; /* Cards, panels and table headers on `surface`. */
  --border: #e0e0e0; /* Decorative dividers and card outlines; never the only edge of a control. */
  --border-strong: #8a8a8a; /* Input and control borders (3:1+ on `surface` and `surface-subtle`). */
}
[data-theme="dark"] {
  --maxi-red: #e8606c;
  --maxi-red-strong: #f07a84;
  --maxi-red-tint: #3a1c20;
  --on-red: #141414;
  --coin-grey: #7f7f7f;
  --ink: #f2f2f2;
  --ink-muted: #b3b3b3;
  --surface: #141414;
  --surface-subtle: #1f1f1f;
  --border: #333333;
  --border-strong: #6b6b6b;
}
:root {
  --space-1: 4px; /* Icon-to-label gaps, tight inline spacing. */
  --space-2: 8px; /* Gaps inside controls and between related items. */
  --space-3: 16px; /* Card padding, form field gaps. */
  --space-4: 24px; /* Gaps between cards and groups. */
  --space-5: 48px; /* Section spacing and page margins. */
  --radius-sm: 2px; /* Tags, checkboxes. */
  --radius-md: 4px; /* Buttons, inputs. */
  --radius-lg: 8px; /* Cards, panels, dialogs. */
  --font-sans: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --text-wordmark: 400 48px/52px var(--font-sans); /* Uppercase, regular weight, wide tracking, echoing the logo. Hero lines only; never replaces the logo. */
  --text-h1: 700 32px/40px var(--font-sans); /* Page titles in `ink`. */
  --text-h2: 700 24px/32px var(--font-sans); /* Section titles in `ink`. */
  --text-h3: 700 18px/26px var(--font-sans); /* Card and panel titles in `ink`. */
  --text-body: 400 16px/24px var(--font-sans); /* Default copy in `ink`. */
  --text-small: 400 14px/20px var(--font-sans); /* Helper text and table cells, `ink` or `ink-muted`. */
  --text-label: 700 12px/16px var(--font-sans); /* Uppercase overlines and field labels in `ink-muted`. */
}
.wordmark {
  font-family: var(--font-sans);
  font-size: 48px;
  line-height: 52px;
  font-weight: 400;
  letter-spacing: 0.12em;
}
.h1 {
  font-family: var(--font-sans);
  font-size: 32px;
  line-height: 40px;
  font-weight: 700;
  letter-spacing: 0;
}
.h2 {
  font-family: var(--font-sans);
  font-size: 24px;
  line-height: 32px;
  font-weight: 700;
  letter-spacing: 0;
}
.h3 {
  font-family: var(--font-sans);
  font-size: 18px;
  line-height: 26px;
  font-weight: 700;
  letter-spacing: 0;
}
.body {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  letter-spacing: 0;
}
.small {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: 0;
}
.label {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

body { margin: 0; font-family: var(--font-sans); background: var(--surface); color: var(--ink); }
.mc-row { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: flex-start; padding: var(--space-4); }
.mc-row-center { align-items: center; }

/* Button */
.mc-btn { font-family: var(--font-sans); font-size: 15px; font-weight: 700; line-height: 20px; height: 40px; padding: 0 var(--space-4); border-radius: var(--radius-md); border: 1px solid transparent; cursor: pointer; display: inline-flex; align-items: center; gap: var(--space-2); }
.mc-btn-sm { font-size: 14px; height: 32px; padding: 0 var(--space-3); }
.mc-btn-primary { background: var(--maxi-red); color: var(--on-red); }
.mc-btn-primary:hover { background: var(--maxi-red-strong); }
.mc-btn-secondary { background: var(--surface); color: var(--ink); border-color: var(--border-strong); }
.mc-btn-secondary:hover { background: var(--surface-subtle); }
.mc-btn-quiet { background: transparent; color: var(--maxi-red-strong); }
.mc-btn-quiet:hover { background: var(--maxi-red-tint); }
.mc-btn:disabled { opacity: .45; cursor: not-allowed; }
.mc-btn:focus-visible, .mc-input:focus-visible { outline: 2px solid var(--maxi-red-strong); outline-offset: 2px; }

/* Input */
.mc-field { display: flex; flex-direction: column; gap: var(--space-1); width: 280px; }
.mc-field-label { font-size: 14px; line-height: 20px; font-weight: 700; color: var(--ink); }
.mc-input { font-family: var(--font-sans); font-size: 16px; line-height: 24px; height: 40px; box-sizing: border-box; padding: 0 var(--space-3); border-radius: var(--radius-md); border: 1px solid var(--border-strong); background: var(--surface); color: var(--ink); font-variant-numeric: tabular-nums; }
.mc-input::placeholder { color: var(--ink-muted); }
.mc-input:disabled { background: var(--surface-subtle); color: var(--ink-muted); }
.mc-input-invalid { border: 2px solid var(--maxi-red-strong); padding: 0 calc(var(--space-3) - 1px); }
.mc-field-hint { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.mc-field-error { font-size: 14px; line-height: 20px; color: var(--maxi-red-strong); font-weight: 700; display: flex; gap: var(--space-2); align-items: center; }
.mc-field-error-mark { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 50%; background: var(--maxi-red-strong); color: var(--on-red); font-size: 12px; line-height: 1; flex: none; }

/* Card */
.mc-card { box-sizing: border-box; width: 300px; padding: var(--space-3); border-radius: var(--radius-lg); border: 1px solid var(--border); background: var(--surface); color: var(--ink); display: flex; flex-direction: column; gap: var(--space-2); }
.mc-card-subtle { background: var(--surface-subtle); border-color: transparent; }
.mc-card-eyebrow { font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); }
.mc-card-title { margin: 0; font-size: 18px; line-height: 26px; font-weight: 700; }
.mc-card-body { font-size: 16px; line-height: 24px; }
.mc-card-footer { margin-top: var(--space-2); padding-top: var(--space-3); border-top: 1px solid var(--border); display: flex; gap: var(--space-2); }
.mc-figure { font-size: 32px; line-height: 40px; font-weight: 700; font-variant-numeric: tabular-nums; }

html{scroll-behavior:smooth}
.mod-tab{scroll-margin-top:16px}
.sent-panel{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:32px;background:#ffffff;border-radius:8px;outline:none}
.sent-panel[hidden]{display:none}
body{margin:0}
.hero{background-color:#ffffff;background-image:linear-gradient(90deg,#ffffff 0%,#ffffff 47%,rgba(255,255,255,.55) 58%,rgba(255,255,255,0) 70%),url(assets/push-the-button-hero.webp);background-size:auto,max(1000px,70vw) auto;background-position:0 0,right -280px center;background-repeat:no-repeat}
@media (max-width:760px){
.hdr{flex-wrap:nowrap !important;gap:12px !important;padding:12px 16px !important}
.hdr-logo{height:40px !important}
.hdr-right{flex-wrap:nowrap !important;gap:12px !important}
.hdr-tel{font-size:16px !important;white-space:nowrap}
.hdr .mc-btn{padding:0 16px;white-space:nowrap}
.hero{background-image:none;margin-bottom:48px !important}
.hero::before{content:"";display:block;height:62vw;background-image:url(assets/push-the-button-hero.webp);background-size:cover;background-position:72% center}
.hero-in{min-height:0 !important;padding:24px 16px 0 !important;gap:16px !important}
.hero-h{font-size:34px !important;line-height:40px !important}
}
a{color:#d63b49}a:hover{color:#b82f3c}
.fld{width:100%;box-sizing:border-box;min-height:44px;padding:10px 12px;border:1px solid #8a8a8a;border-radius:4px;background:#fff;color:#1f1f1f;font:16px/24px Arial,"Helvetica Neue",Helvetica,sans-serif}
.fld:focus,.btn:focus-visible,.chk input:focus-visible{outline:2px solid #b82f3c;outline-offset:2px}
.btn{cursor:pointer}.btn:hover{background:#b82f3c !important}
.btnd:hover{background:#f07a84 !important}.btnd:focus-visible{outline:2px solid #f07a84;outline-offset:2px}
.mods{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.mod-tab{grid-row:1;display:flex;flex-direction:column;align-items:flex-start;gap:12px;text-align:left;padding:24px 16px;background:#f5f5f5;border:1px solid #e0e0e0;border-radius:8px;color:#1f1f1f;font:16px/24px Arial,"Helvetica Neue",Helvetica,sans-serif;cursor:pointer}
.mod-tab:hover{border-color:#8a8a8a}
.mod-tab[aria-expanded="true"]{border-color:#d63b49;background:#fbe9eb}
.mod-tab:focus-visible{outline:2px solid #b82f3c;outline-offset:2px}
.mod-text{display:flex;flex-direction:column;gap:8px}
.mod-name{font-size:20px;line-height:26px;font-weight:700}
.mod-sum{font-size:14px;line-height:21px;color:#595959}
.mod-chev{display:none;flex:none;color:#595959}
.mod-panel{grid-row:2;grid-column:1/-1;background:#ffffff;border:1px solid #d63b49;border-radius:8px;padding:32px;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.mod-panel[hidden]{display:none}
.mod-list{margin:0;padding:0;list-style:none;width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}
.mod-list li{position:relative;padding-left:20px;color:#1f1f1f}
.mod-list li::before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;border-radius:2px;background:#d63b49}
@media (max-width:900px){.mods{grid-template-columns:minmax(0,1fr);gap:8px}.mod-tab,.mod-panel{grid-row:auto}.mod-tab{flex-direction:row;align-items:center;gap:16px;padding:16px;min-height:44px}.mod-text{flex:1;gap:2px}.mod-chev{display:block}.mod-tab[aria-expanded="true"] .mod-chev{transform:rotate(180deg)}.mod-panel{padding:20px 16px;margin-bottom:8px}.mod-list{grid-template-columns:minmax(0,1fr)}}
.chk{display:flex;align-items:center;gap:8px;min-height:44px;font-size:16px;color:#1f1f1f}
.chk input{width:20px;height:20px;accent-color:#d63b49;margin:0}
