/* Minimal website style (2026-10-16): Inter Tight, black and white with muted
   blue only on the main button and links. Every public page uses it.
   2026-10-24, owner's pick "B, one screen": smaller, thinner headings
   (regular weight), half the space, body text still 15px; the home page is
   one screen like an app, and long step lists fold behind a tap (<details>). */
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/inter-tight-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/inter-tight-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/inter-tight-latin-600-normal.woff2") format("woff2"); }

:root {
  --m-ink: #1F2328;
  --m-ink-2: #4B5058;
  --m-line: #E6E6E6;
  --m-soft: #F6F6F6;
  --m-bg: #FFFFFF;
  --m-accent: #2B4C7E;
  --m-accent-hover: #213B63;
  --m-font: "Helvetica Neue", Helvetica, Arial, sans-serif; /* owner's pick B, 2026-10-27: the zip's font */
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.m-site { margin: 0; background: var(--m-bg); color: var(--m-ink); font: 400 15px/1.55 var(--m-font); -webkit-font-smoothing: antialiased; }
.m-site h1, .m-site h2, .m-site h3, .m-site p, .m-site ol, .m-site ul { margin: 0; padding: 0; }
.m-site a { color: inherit; }
.m-site img { display: block; max-width: 100%; height: auto; }
.m-site :focus-visible { outline: 2px solid var(--m-ink); outline-offset: 3px; }
.m-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.m-skip { position: absolute; left: 16px; top: -60px; background: var(--m-ink); color: var(--m-bg); padding: 10px 14px; border-radius: 8px; text-decoration: none; z-index: 20; }
.m-skip:focus { top: 12px; }

.m-wrap { max-width: 1040px; margin: 0 auto; padding: 0 24px; }

/* Header */
.m-head .m-wrap { height: 58px; display: flex; align-items: center; gap: 32px; }
/* The logo is the name in Inter Tight (owner's pick, 2026-10-16). */
.m-site .m-logo { font-weight: 600; font-size: 21px; line-height: 1; letter-spacing: -0.03em; color: var(--m-ink); text-decoration: none; }
.m-nav { margin-left: auto; display: flex; align-items: center; gap: 22px; font-size: 15px; }
.m-nav a { text-decoration: none; color: var(--m-ink-2); }
.m-nav a:hover, .m-nav a.m-signin { color: var(--m-ink); }
/* Header (2026-10-24): just the logo and Sign in; the footer has the other links. */

/* Buttons */
.m-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border: 0; border-radius: 10px; background: var(--m-accent); color: var(--m-bg); font: 500 15px var(--m-font); text-decoration: none; cursor: pointer; }
.m-site a.m-btn { color: var(--m-bg); }
.m-btn:hover { background: var(--m-accent-hover); }

/* Sections: space does the separating */
.m-hero { padding: 20px 0 28px; }
.m-section { padding: 24px 0; border-top: 1px solid var(--m-line); }
@media (min-width: 900px) {
  .m-hero { padding: 36px 0 40px; }
  .m-section { padding: 32px 0; }
}

.m-site h1 { font-weight: 400; font-size: clamp(1.7rem, 4vw, 2.4rem); line-height: 1.14; letter-spacing: -0.02em; max-width: 13em; text-wrap: balance; }
.m-site .m-lede { margin-top: 12px; font-size: 1rem; color: var(--m-ink-2); max-width: 32em; }
.m-site h2 { font-weight: 400; font-size: clamp(1.2rem, 2.2vw, 1.4rem); line-height: 1.25; letter-spacing: -0.012em; text-wrap: balance; }

/* The idea box */
.m-idea { margin-top: 20px; max-width: 560px; display: grid; gap: 12px; }
.m-idea textarea { width: 100%; min-height: 76px; padding: 12px 14px; font: 400 15px/1.5 var(--m-font); color: var(--m-ink); background: var(--m-bg); border: 1px solid #CFCFCF; border-radius: 10px; resize: vertical; }
.m-idea textarea::placeholder { color: #8A8A8A; }
.m-idea textarea:focus { outline: none; border-color: var(--m-ink); }
.m-idea .m-error { font-size: 15px; color: #B3261E; }
.m-idea .m-btn { width: 100%; }
.m-site .m-small { margin-top: 4px; font-size: 15px; color: var(--m-ink-2); }
.m-small a { color: var(--m-accent); text-underline-offset: 3px; }
@media (min-width: 600px) { .m-idea .m-btn { width: auto; justify-self: start; } }

/* Heading on the left, three short lines on the right */
.m-split { display: grid; gap: 24px; }
@media (min-width: 900px) { .m-split { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 64px; } }
.m-lines { list-style: none; display: grid; gap: 12px; }
.m-lines h3 { font-weight: 500; font-size: 1rem; letter-spacing: -0.01em; }
.m-site .m-lines p { margin-top: 2px; color: var(--m-ink-2); max-width: 34em; }
ol.m-lines { counter-reset: m; }
ol.m-lines li { counter-increment: m; display: grid; grid-template-columns: 32px minmax(0, 1fr); }
@media (min-width: 900px) { ul.m-lines li { padding-left: 32px; } }
ol.m-lines li::before { content: counter(m); color: var(--m-ink-2); font-size: 1rem; line-height: 1.6; }

/* Close */
.m-close { padding: 28px 0; border-top: 1px solid var(--m-line); }
.m-close .m-btn { margin-top: 16px; }
@media (min-width: 900px) { .m-close { padding: 36px 0; } }

/* Current page in the header */
.m-nav a[aria-current="page"] { color: var(--m-ink); }

/* Inner pages: a plain top with a headline and one sentence */
.m-page { padding: 20px 0 24px; }
@media (min-width: 900px) { .m-page { padding: 32px 0 32px; } }
.m-actions { margin-top: 24px; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
.m-link { color: var(--m-accent); font-weight: 500; text-underline-offset: 3px; }
.m-site a.m-link { color: var(--m-accent); }
.m-btn-line { background: transparent; color: var(--m-ink); box-shadow: inset 0 0 0 1px #CFCFCF; }
.m-site a.m-btn-line { color: var(--m-ink); }
.m-btn-line:hover { background: var(--m-soft); }
.m-site .m-after { margin-top: 14px; color: var(--m-ink-2); }
.m-after a { color: var(--m-accent); text-underline-offset: 3px; }

/* Pricing: three plain columns, no boxes */
.m-plans { display: grid; gap: 28px; }
@media (min-width: 900px) { .m-plans { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; } .m-plans.is-one { grid-template-columns: minmax(0, 1fr); max-width: 420px; } }
/* Disabled: light grey with dark grey text (sharp), not a faded button. */
.m-btn:disabled, .m-btn:disabled:hover { background: #ECEDEF; color: #4B5058; cursor: default; box-shadow: none; }
.m-site .m-plan-note:empty { display: none; }
.m-plan { display: flex; flex-direction: column; gap: 16px; padding-top: 24px; border-top: 1px solid var(--m-ink); min-width: 0; }
/* One plan alone (Pricing has no heading above it): no rule on top. */
.m-plans.is-one .m-plan { border-top: 0; padding-top: 0; }
.m-plan h2 { font-size: 1.25rem; }
.m-site .m-price { font-size: 1.8rem; font-weight: 500; letter-spacing: -0.02em; line-height: 1.1; }
.m-price small { font-size: 1rem; font-weight: 400; color: var(--m-ink-2); letter-spacing: 0; }
.m-plan ul { list-style: none; display: grid; gap: 10px; color: var(--m-ink-2); }
.m-plan .m-btn { align-self: flex-start; margin-top: auto; }
.m-plan ul { margin-bottom: 8px; }
.m-site .m-plan .m-small { margin-top: 0; }

/* Forms */
.m-form { display: grid; gap: 24px; max-width: 520px; }
.m-field { display: grid; gap: 8px; }
.m-label { font-size: 15px; font-weight: 500; }
.m-input { width: 100%; min-height: 44px; padding: 10px 14px; font: 400 15px/1.4 var(--m-font); color: var(--m-ink); background: var(--m-bg); border: 1px solid #CFCFCF; border-radius: 10px; }
textarea.m-input { min-height: 140px; resize: vertical; line-height: 1.5; }
.m-input:focus { outline: none; border-color: var(--m-ink); }
.m-input[aria-invalid="true"] { border-color: #B3261E; }
.m-choice { display: flex; gap: 8px; flex-wrap: wrap; border: 0; margin: 0; padding: 0; }
.m-choice legend { font-size: 15px; font-weight: 500; margin-bottom: 8px; padding: 0; }
.m-choice label { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 1px solid #CFCFCF; border-radius: 10px; cursor: pointer; }
.m-choice label:has(input:checked) { border-color: var(--m-ink); }
.m-choice input { accent-color: var(--m-accent); margin: 0; }
.m-site .m-error { font-size: 15px; color: #B3261E; }
.m-done { max-width: 520px; padding: 20px 0; border-top: 1px solid var(--m-ink); }
.m-site .m-done p { margin-top: 6px; color: var(--m-ink-2); }

/* Long reading pages (privacy, terms): text only, one column */
.m-doc { max-width: 720px; }
.m-doc h2 { font-size: 1.2rem; margin-top: 36px; }
.m-doc .legal-section:first-of-type h2, .m-doc .legal-toc h2 { margin-top: 0; }
.m-doc .legal-toc { margin: 40px 0 8px; padding: 24px 0; border-top: 1px solid var(--m-line); border-bottom: 1px solid var(--m-line); }
.m-doc .legal-toc h2 { font-size: 1rem; }
.m-doc .legal-toc ol { margin-top: 12px; padding-left: 20px; display: grid; gap: 6px; }
.m-doc p, .m-doc ul, .m-doc ol { margin-top: 14px; }
.m-doc ul { padding-left: 20px; display: grid; gap: 8px; }
.m-doc li { color: var(--m-ink); }
.m-doc a { color: var(--m-accent); text-underline-offset: 3px; }
.m-doc .banner.pending { display: block; margin: 14px 0; padding: 14px 16px; background: var(--m-soft); border-radius: 10px; font-size: 15px; color: var(--m-ink-2); }
.m-doc .banner.pending strong { color: var(--m-ink); font-weight: 500; }

/* Footer */
.m-foot { border-top: 1px solid var(--m-line); padding: 20px 0 24px; font-size: 14px; color: var(--m-ink-2); }
.m-foot .m-wrap { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.m-foot a { text-decoration: none; }
.m-foot a:hover { color: var(--m-ink); }
.m-foot span { width: 100%; }
@media (min-width: 900px) { .m-foot span { width: auto; margin-right: auto; } }

/* Easy on the eyes (owner, 2026-10-16: "doesn't hurt eyes, not constrained,
   clear, not scratchy or blurry"). Softer ink instead of near-black, a darker
   grey so secondary text isn't thin and faint, a touch more letter spacing
   (Inter Tight is narrow), normal font rendering, nothing smaller than 15px. */
:root { --m-ink: #1F2328; --m-ink-2: #4B5058; }
body.m-site {
  -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; text-rendering: optimizeLegibility;
  letter-spacing: 0.01em; line-height: 1.55;
}
.m-site h1 { letter-spacing: -0.005em; line-height: 1.14; }
.m-site h2, .m-site h3, .m-site .m-price { letter-spacing: 0; }
.m-site .m-logo { letter-spacing: -0.01em; }
.m-site .m-lede { max-width: 36em; line-height: 1.6; }
.m-site .m-lines p { max-width: 38em; }
.m-site .m-small, .m-site .m-after, .m-nav, .m-doc .banner.pending { font-size: 15px; }
.m-foot { font-size: 15px; }
.m-input, .m-idea textarea { letter-spacing: 0.01em; }
.m-input::placeholder, .m-idea textarea::placeholder { color: #767B82; }

/* "More lively" (owner's pick, 2026-10-16): a light blue top, blue step
   numbers, a grey band on the second section in a row and a blue close.
   Text colours stay those of the readability pass (no thin or pale text). */
.m-site { --m-tint: #F2F5FA; --m-tint-2: #E3EAF4; --m-band: #F7F8FA; }
.m-site .m-hero, .m-site .m-page { background: linear-gradient(180deg, var(--m-tint) 0%, var(--m-bg) 100%); }
.m-site h1 { font-weight: 400; }
.m-site .m-lines h3 { font-weight: 500; }
.m-site ol.m-lines li { grid-template-columns: 38px minmax(0, 1fr); }
.m-site ol.m-lines li::before { width: 26px; height: 26px; border-radius: 50%; background: var(--m-accent); color: #FFFFFF; display: grid; place-items: center; font-size: 15px; font-weight: 600; line-height: 1; }
@media (min-width: 900px) { .m-site ul.m-lines li { padding-left: 38px; } }
.m-site .m-section + .m-section { background: var(--m-band); border-top: 0; }
.m-site .m-close { background: var(--m-accent); color: #FFFFFF; border-top: 0; }
.m-site .m-close h2, .m-site .m-close .m-small, .m-site .m-close p { color: #FFFFFF; }
.m-site .m-close a:not(.m-btn) { color: #FFFFFF; }
.m-site .m-close a.m-btn { background: #FFFFFF; color: var(--m-accent); }
.m-site .m-close a.m-btn:hover { background: var(--m-tint); }
.m-site .m-close :focus-visible { outline-color: #FFFFFF; }

/* Shorter pages (2026-10-16): two lists side by side on desktop. */
.m-duo { display: grid; gap: 28px; }
@media (min-width: 900px) { .m-duo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; } }
.m-duo > div { display: grid; gap: 14px; align-content: start; min-width: 0; }

.m-site .m-duo ul.m-lines li { padding-left: 0; }

/* One screen (2026-10-24, owner's pick "B"). The home page is the question,
   the idea box and three quick links, centred in one screen like an app. */
body.m-site.m-onescreen { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.m-onescreen main { flex: 1; display: flex; }
.m-onescreen .m-hero { flex: 1; display: flex; align-items: center; }
.m-onescreen .m-hero .m-wrap { width: 100%; max-width: 640px; text-align: center; }
.m-onescreen h1, .m-onescreen .m-lede { margin-left: auto; margin-right: auto; }
.m-onescreen .m-idea { margin-left: auto; margin-right: auto; text-align: left; }
.m-onescreen .m-idea .m-btn { width: 100%; justify-self: stretch; }
.m-quick { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 18px; list-style: none; }
.m-site .m-quick a { display: inline-block; padding: 7px 14px; border: 1px solid var(--m-tint-2); border-radius: 999px; background: #FFFFFF; color: var(--m-ink); font-size: 15px; text-decoration: none; transition: border-color 160ms ease; }
.m-site .m-quick a:hover { border-color: #C9D6EA; }
.m-onescreen .m-foot { padding: 12px 0 14px; }

/* Step lists that fold: the title shows, the detail opens on tap. */
.m-site .m-lines details > summary { cursor: pointer; list-style: none; font-weight: 500; }
.m-site .m-lines details > summary::-webkit-details-marker { display: none; }
.m-site .m-lines details > summary::after { content: "+"; margin-left: 8px; color: var(--m-accent); }
.m-site .m-lines details[open] > summary::after { content: "\2013"; }
.m-site .m-lines details > p { margin-top: 4px; }
@media (prefers-reduced-motion: reduce) { .m-site .m-quick a { transition: none; } }

/* Home: "Find ideas" is a small blue link under the button, on the left (2026-10-24). */
.m-onescreen .m-find { max-width: 560px; margin: 12px auto 0; text-align: left; font-size: 0.9375rem; }
.m-onescreen .m-find a { color: var(--m-accent); font-weight: 600; text-decoration: none; }
.m-onescreen .m-find a::after { content: " \2192"; }
.m-onescreen .m-find a:hover { text-decoration: underline; }

/* New home (2026-10-27, owner's pick A): sprout logo, "dream" in a blue italic,
   the idea box as a white card, on a light blue tint. Still one screen. */
.m-site { --m-warm: #FBF8F3; --m-serif: Georgia, "Times New Roman", serif; }
.m-site .m-logo { display: inline-flex; align-items: center; gap: 9px; font-weight: 700; letter-spacing: -0.035em; }
.m-mark { width: 30px; height: 30px; border-radius: 9px; background: #E8EEF7; color: var(--m-accent); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.m-mark svg { width: 18px; height: 18px; }
body.m-warm { background: linear-gradient(180deg, #E9F0F9 0%, #F3F6FB 55%, #F8FAFD 100%); }
body.m-warm .m-head { background: transparent; border-bottom: 0; }
body.m-warm .m-foot { background: transparent; }
.m-warm h1 { font-weight: 500; letter-spacing: -0.035em; font-size: clamp(2.3rem, 6vw, 3.6rem); line-height: 1.04; }
.m-warm h1 em { font-family: var(--m-serif); font-style: italic; font-weight: 400; color: var(--m-accent); letter-spacing: -0.01em; }
.m-warm .m-lede { font-size: 1.0625rem; color: #4B5058; }
.m-card-idea { background: #FFFFFF; border-radius: 18px; padding: 14px; border: 1px solid #E6E6E6; box-shadow: 0 12px 32px -18px rgba(17,24,39,.18); }
.m-card-idea textarea { border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 6px 4px !important; min-height: 92px; resize: none; font-size: 1rem; }
.m-card-idea textarea:focus { outline: none; }
.m-card-idea:focus-within { box-shadow: 0 0 0 2px rgba(43,76,126,.35), 0 12px 32px -12px rgba(43,76,126,.25); }
.m-card-idea .m-btn { width: 100%; border-radius: 12px; }
.m-warm .m-find { margin-top: 14px; font-size: 0.9375rem; }
.m-warm .m-find a { color: var(--m-accent); font-weight: 600; text-decoration: none; }
.m-warm .m-find a::after { content: " \2192"; }
body.m-warm .m-hero { background: transparent !important; }
body.m-warm .m-head { background: transparent !important; border-bottom: 0 !important; box-shadow: none !important; }
body.m-warm .m-foot { background: transparent !important; border-top: 0 !important; }


.m-opt-a .m-hero .m-wrap { max-width: 640px; text-align: center; }
.m-opt-a .m-card-idea { max-width: 560px; margin: 26px auto 0; text-align: left; }
.m-opt-a .m-find { max-width: 560px; margin-left: auto; margin-right: auto; text-align: left; }
/* The owner's logo file (2026-10-27): the mark draws its own dark blue square. */
.m-mark { background: none !important; box-shadow: none !important; border-radius: 0; width: 30px; height: 30px; }
.m-mark svg { width: 30px; height: 30px; display: block; }
.m-site .m-logo, .m-brand, .m-app .e-auth-logo { color: #1D2633; }

/* ===== Polished and warmer, every website page (2026-10-27) =====
   The home page's look: light blue tint behind everything, content on white
   cards with soft shadows and round corners, no divider lines. */
body.m-site { background: linear-gradient(180deg, #E9F0F9 0, #F3F6FB 520px, #F6F8FC 100%) fixed; }
.m-site .m-head, .m-site .m-hero, .m-site .m-page, .m-site .m-foot { background: transparent !important; border-top: 0 !important; border-bottom: 0 !important; box-shadow: none !important; }
.m-site h1 { font-weight: 500; letter-spacing: -0.035em; }
.m-site .m-section, .m-site .m-section + .m-section { background: transparent; border-top: 0; padding: 14px 0; }
.m-site .m-section > .m-wrap { background: #FFFFFF; border-radius: 22px; padding: 28px 24px;
  margin: 0 max(12px, calc((100% - 1040px) / 2)); box-shadow: 0 1px 2px rgba(17,24,39,.04), 0 14px 36px -20px rgba(43,76,126,.22); }
@media (min-width: 768px) { .m-site .m-section > .m-wrap { padding: 36px 40px; } }
.m-site .m-close { background: transparent; border-top: 0; padding: 14px 0 36px; }
.m-site .m-close > .m-wrap { background: var(--m-accent); color: #FFFFFF; border-radius: 22px; padding: 32px 28px;
  margin: 0 max(12px, calc((100% - 1040px) / 2)); box-shadow: 0 18px 40px -22px rgba(43,76,126,.55); }
.m-site .m-btn, .m-site .m-input, .m-site .m-choice label { border-radius: 12px; }
.m-site .m-plan, .m-site .m-done { border-top: 0; }
.m-doc .legal-toc { border: 0; background: #F3F6FB; border-radius: 16px; padding: 20px 22px; }

/* ===== The zip's look, website (2026-10-27, owner: "the one I uploaded looks better";
   look only: one-screen home, own words, Sign in only in the header) =====
   Finer and smaller: 15px text, 40px buttons, thin-bordered cards, white header and footer. */
body.m-site { background: linear-gradient(180deg, #EEF3F9 0, #F7F9FC 380px) no-repeat, #F7F9FC; color: #1F2933; }
body.m-site.m-warm { background: linear-gradient(180deg, #E9F0F9 0, #F3F6FB 60%, #F7F9FC 100%) !important; }
.m-site .m-head { background: #FFFFFF !important; border-bottom: 1px solid #E8ECF2 !important; }
body.m-warm .m-head { background: rgba(255,255,255,.75) !important; }
.m-head .m-wrap { height: 64px; }
.m-site .m-logo { font-size: 20px; color: #1D2633; }
.m-site .m-signin { font-size: 14px; font-weight: 600; color: #374151; }
.m-site h1 { font-weight: 500; letter-spacing: -0.045em; color: #1F2933; }
.m-site .m-lede { font-size: 1rem; color: #4B5563; }
.m-site .m-btn { min-height: 40px; padding: 0 18px; font-size: 14px; font-weight: 600; border-radius: 8px; }
.m-site .m-input { border-radius: 8px; font-size: 15px; }
.m-site .m-section > .m-wrap { border: 1px solid #E6EBF2; border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.m-site .m-close > .m-wrap { background: #F1F5FA; color: #1F2933; border: 1px solid #E3EAF3; border-radius: 14px; box-shadow: none;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding: 20px 24px; }
.m-site .m-close h2 { font-size: 1rem; font-weight: 500; color: #374151; margin: 0; }
.m-site .m-close a.m-btn { background: var(--m-accent); color: #FFFFFF; }
.m-site .m-close a.m-btn:hover { background: var(--m-accent-hover); }
.m-site .m-foot { background: #FFFFFF !important; border-top: 1px solid #E8ECF2 !important; font-size: 13px; color: #6B7280; padding: 22px 0; }
body.m-warm .m-foot { background: transparent !important; border-top: 0 !important; }
.m-card-idea { border: 1px solid #E6EBF2; border-radius: 14px; box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 12px 28px -20px rgba(43,76,126,.25); }
.m-card-idea .m-btn { border-radius: 8px; }
.m-doc .legal-toc { border-radius: 12px; }

/* Steps and points as small cards with a number badge (the zip's look, 2026-10-27). */
.m-site .m-section.m-plain > .m-wrap { background: transparent; border: 0; box-shadow: none; padding-left: 0; padding-right: 0; }
.m-site .m-cards { gap: 10px; }
.m-site .m-cards li { display: block !important; padding: 16px 18px !important; background: #FFFFFF; border: 1px solid #E6EBF2; border-radius: 14px; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.m-site .m-section > .m-wrap .m-cards li { background: #FAFBFD; box-shadow: none; }
.m-site .m-section.m-plain > .m-wrap .m-cards li { background: #FFFFFF; }
.m-site .m-cards h3 { font-size: 1rem; font-weight: 500; color: #1F2933; margin: 0; }
.m-site .m-cards p { margin-top: 6px !important; font-size: 14px; color: #4B5563; }
.m-site ol.m-cards li::before { content: counter(m, decimal-leading-zero); display: inline-grid; place-items: center; width: 32px; height: 28px; margin-bottom: 12px;
  border-radius: 8px; background: #EEF3FA; color: #2B4C7E; font-size: 12px; font-weight: 700; line-height: 1; }
.m-site .m-duo h2 { font-size: 1.15rem; font-weight: 500; margin-bottom: 12px; }
.m-site .m-section.m-plain > .m-wrap { margin: 0 auto; padding: 0 24px; }
/* Arial/Helvetica (owner's pick B, 2026-10-27) is wider than Inter Tight: no extra letter spacing. */
body.m-site, body.m-app, .m-site .m-btn, .m-app .e-btn, .m-app .btn { letter-spacing: normal; }