/**
 * PayfastPOS marketing homepage design samples
 * Namespaced per sample (ms01–ms22) to avoid collisions.
 * ms16–ms22 = NEW high-impact bright set.
 */

.ms-body {
    margin: 0;
    min-height: 100vh;
    font-family: "Source Sans 3", "Segoe UI", sans-serif;
    color: #0b1220;
}

.ms-nav {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1.5rem;
    backdrop-filter: blur(10px);
}

.ms-preview-mode .ms-nav { top: 48px; }

.ms-nav-brand {
    font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
    font-size: 1.55rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    text-decoration: none;
    color: inherit;
}
.ms-nav-brand span { color: #6a9a00; }

.ms-nav-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
}
.ms-nav-quiet {
    font-size: .9rem;
    color: inherit;
    opacity: .7;
    text-decoration: none;
    margin-right: .35rem;
}
.ms-nav-quiet:hover { opacity: 1; }

.ms-preview-bar {
    position: sticky;
    top: 0;
    z-index: 40;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .65rem 1.25rem;
    background: #0b1220;
    color: #eef2f6;
    font-size: .92rem;
}
.ms-preview-bar a { color: #b6ff3b; text-decoration: none; }
.ms-preview-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.ms-preview-select, .ms-g-btn-select {
    border: 0;
    cursor: pointer;
    background: #b6ff3b;
    color: #0b1220;
    font-weight: 700;
    padding: .45rem .85rem;
    border-radius: 6px;
    font-family: inherit;
}
.ms-preview-link {
    border: 1px solid rgb(238 242 246 / 35%);
    color: #eef2f6 !important;
    padding: .4rem .75rem;
    border-radius: 6px;
}
.ms-preview-hint { opacity: .75; font-size: .85rem; }
.ms-live-badge {
    display: inline-block;
    background: #b6ff3b;
    color: #0b1220;
    font-weight: 700;
    font-size: .78rem;
    padding: .25rem .55rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.ms-footer {
    padding: 2.5rem 1.5rem 3rem;
    text-align: center;
    font-size: .92rem;
}
.ms-footer-line { margin: .4rem 0; opacity: .8; }
.ms-footer a { color: inherit; }

/* Gallery */
.ms-gallery {
    margin: 0;
    min-height: 100vh;
    background: linear-gradient(180deg, #f7fafc 0%, #eef3f7 100%);
    color: #0b1220;
    font-family: "Source Sans 3", sans-serif;
}
.ms-gallery-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 2rem 1.5rem 1rem;
    max-width: 1200px;
    margin: 0 auto;
}
.ms-gallery-kicker {
    font-family: "Barlow Condensed", sans-serif;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 700;
    color: #6a9a00;
    margin: 0 0 .35rem;
}
.ms-gallery-head h1 {
    font-family: "Barlow Condensed", sans-serif;
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    line-height: 1.05;
    margin: 0 0 .5rem;
    max-width: 18ch;
}
.ms-gallery-head p { max-width: 52ch; margin: 0; color: #3d4a5c; line-height: 1.5; }
.ms-gallery-head code {
    background: #fff;
    border: 1px solid #d5dde7;
    padding: .1rem .35rem;
    border-radius: 4px;
    font-size: .9em;
}
.ms-gallery-actions { display: flex; flex-direction: column; gap: .5rem; align-items: flex-start; }
.ms-g-badge {
    font-size: .8rem;
    background: #0b1220;
    color: #b6ff3b;
    padding: .35rem .65rem;
    border-radius: 6px;
}
.ms-gallery-flash {
    max-width: 1200px;
    margin: 0 auto 1rem;
    padding: .75rem 1rem;
    background: #e8f8c8;
    border: 1px solid #b6ff3b;
    border-radius: 8px;
    width: calc(100% - 3rem);
}
.ms-gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.25rem;
    padding: 1rem 1.5rem 3rem;
    max-width: 1200px;
    margin: 0 auto;
}
.ms-g-card {
    background: #fff;
    border: 1px solid #d9e1ea;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.ms-g-card.is-live { outline: 2px solid #b6ff3b; }
.ms-g-card.is-new { outline: 2px solid #9fe01f; box-shadow: 0 8px 24px rgb(182 255 59 / 18%); }
.ms-g-new {
    position: absolute;
    top: .65rem;
    left: .65rem;
    background: #0b1220;
    color: #b6ff3b;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: .28rem .5rem;
    border-radius: 4px;
}
.ms-g-shot {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 140px;
    padding: 1rem;
    text-decoration: none;
    color: #0b1220;
    background: linear-gradient(135deg, #f0f4f8, #e4ebf2);
}
.ms-g-shot-label {
    font-family: "Barlow Condensed", sans-serif;
    font-size: 2.4rem;
    font-weight: 800;
    line-height: 1;
}
.ms-g-shot-title { font-weight: 700; margin-top: .35rem; }
.ms-g-body { padding: 1rem 1.1rem 1.2rem; flex: 1; display: flex; flex-direction: column; }
.ms-g-num { margin: 0; font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: #6a9a00; font-weight: 700; }
.ms-g-body h2 { font-family: "Barlow Condensed", sans-serif; font-size: 1.35rem; margin: .25rem 0 .4rem; }
.ms-g-body p { margin: 0 0 1rem; color: #4a5568; font-size: .95rem; line-height: 1.45; flex: 1; }
.ms-g-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.ms-g-btn {
    display: inline-block;
    text-decoration: none;
    border: 1px solid #c5d0dc;
    background: #fff;
    color: #0b1220;
    padding: .45rem .8rem;
    border-radius: 6px;
    font-weight: 600;
    font-size: .9rem;
}
.ms-g-btn-volt { background: #b6ff3b; border-color: #9fe01f; color: #0b1220; }

/* Gallery thumbnail atmospheres */
.ms-g-shot-01-bright-professional { background: linear-gradient(135deg,#fff,#e8f5d0 60%,#d7eefc); }
.ms-g-shot-02-soft-bay-editorial { background: linear-gradient(160deg,#dfeaf3,#f0f7fb); }
.ms-g-shot-03-minimal-typographic { background: #fff; border-bottom: 1px solid #e5e7eb; }
.ms-g-shot-04-split-product { background: linear-gradient(90deg,#f8fafc 50%,#1c232d 50%); color: #0b1220; }
.ms-g-shot-04-split-product .ms-g-shot-title { color: #0b1220; text-shadow: 0 0 12px #fff; }
.ms-g-shot-05-light-retail { background: linear-gradient(135deg,#eef6ff,#dce9f7); }
.ms-g-shot-06-warm-daylight { background: linear-gradient(135deg,#fffdf8,#f0ebe0); }
.ms-g-shot-07-magazine-feature { background: linear-gradient(120deg,#f6f8fa,#e8f5d8); }
.ms-g-shot-08-banded-sections { background: repeating-linear-gradient(180deg,#f4f6f8 0 28px,#e8edf2 28px 56px); }
.ms-g-shot-09-photo-interior { background: radial-gradient(ellipse at 50% 0%,#dbe7f0,#f9fafb 70%); }
.ms-g-shot-10-monochrome-volt { background: #f5f5f5; border-bottom: 3px solid #b6ff3b; }
.ms-g-shot-11-wide-luxury { background: #fbfcfd; padding-top: 2.5rem; }
.ms-g-shot-12-feature-grid { background: linear-gradient(180deg,#fff,#eef3f7); }
.ms-g-shot-13-centered-statement { background: radial-gradient(circle at 50% 40%,#f4f9ef,#fff); text-align: center; align-items: center; }
.ms-g-shot-14-enterprise-bluegray { background: linear-gradient(135deg,#e8eef5,#f5f7fa); }
.ms-g-shot-15-compact-conversion { background: linear-gradient(90deg,#e8f8c8,#fff 45%); }
.ms-g-shot-16-volt-surge { background: linear-gradient(135deg,#fff 10%,#e8ff9a 45%,#b6ff3b 100%); }
.ms-g-shot-17-daylight-rush { background: linear-gradient(120deg,#fffef8,#c8e8ff 50%,#b6ff3b 110%); }
.ms-g-shot-18-electric-clear { background: linear-gradient(160deg,#ffffff,#f0fff0 40%,#d7f56a); }
.ms-g-shot-19-stadium-light { background: radial-gradient(ellipse at 50% 0%,#fff 0%,#e8f8c8 40%,#d4eefc 100%); }
.ms-g-shot-20-impact-white { background: #fff; border-bottom: 4px solid #b6ff3b; }
.ms-g-shot-21-bay-blast { background: linear-gradient(145deg,#e8f7ff,#fff 40%,#d4ff6a); }
.ms-g-shot-22-kinetic-counter { background: repeating-linear-gradient(115deg,#fff 0 18px,#e8ff9a 18px 28px,#d7f0ff 28px 40px); }

/* ── ms01 ── */
.ms01-body { background: linear-gradient(180deg,#fff 0%,#f4f7fa 42%,#eef3f7 100%); color: #0b1220; }
.ms01-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms01-nav-brand span, .ms01-brand span { color: #6a9a00; }
.ms01-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms01-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms01-btn-primary:hover { filter: brightness(.97); }
.ms01-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms01-btn-ghost:hover { background: #f4f7fa; }
.ms01-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms01-hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 80% 45% at 10% -5%,rgb(182 255 59 / 14%),transparent 50%),radial-gradient(ellipse 70% 40% at 95% 8%,rgb(56 189 248 / 12%),transparent 48%),linear-gradient(180deg,#fff 0%,#f4f7fa 42%,#eef3f7 100%); pointer-events: none; }
.ms01-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms01-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms01-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms01-lead { font-size: 1.1rem; line-height: 1.55; color: #4a5568; max-width: 38ch; margin: 0 0 1.25rem; }
.ms01-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms01-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: linear-gradient(145deg,#1c232d,#2a3645); color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms01-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms01-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms01-panel-meta { opacity: .8; font-size: .9rem; }
.ms01-sec { padding: 3rem 1.5rem; }
.ms01-wrap { max-width: 920px; margin: 0 auto; }
.ms01-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms01-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms01-sec p { margin: 0 0 1rem; line-height: 1.55; color: #4a5568; max-width: 58ch; }
.ms01-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms01-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms01-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms01-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms01-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms01-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms01-trial .ms01-wrap { max-width: 700px; }
.ms01-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms01-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms01-trial .ms01-cta { justify-content: center; }
.ms01-footer { color: #4a5568; }
@media (min-width: 860px) { .ms01-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms02 ── */
.ms02-body { background: linear-gradient(160deg,#f0f7fb 0%,#e8f0f6 40%,#dfeaf3 100%); color: #122033; }
.ms02-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #122033; }
.ms02-nav-brand span, .ms02-brand span { color: #6a9a00; }
.ms02-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms02-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms02-btn-primary:hover { filter: brightness(.97); }
.ms02-btn-ghost { background: #fff; color: #122033; border-color: rgb(11 18 32 / 16%); }
.ms02-btn-ghost:hover { background: #f4f7fa; }
.ms02-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms02-hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 70% 50% at 80% 0%,rgb(56 189 248 / 18%),transparent 55%),linear-gradient(160deg,#f0f7fb 0%,#e8f0f6 40%,#dfeaf3 100%); pointer-events: none; }
.ms02-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms02-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms02-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms02-lead { font-size: 1.1rem; line-height: 1.55; color: #516579; max-width: 38ch; margin: 0 0 1.25rem; }
.ms02-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms02-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: linear-gradient(160deg,#243447,#3d5a73); color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms02-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms02-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms02-panel-meta { opacity: .8; font-size: .9rem; }
.ms02-sec { padding: 3rem 1.5rem; }
.ms02-wrap { max-width: 920px; margin: 0 auto; }
.ms02-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms02-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms02-sec p { margin: 0 0 1rem; line-height: 1.55; color: #516579; max-width: 58ch; }
.ms02-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms02-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms02-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms02-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms02-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms02-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms02-trial .ms02-wrap { max-width: 700px; }
.ms02-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms02-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms02-trial .ms02-cta { justify-content: center; }
.ms02-footer { color: #516579; }
.ms02-sec-a { background: #fff; }
.ms02-sec-b { background: rgb(11 18 32 / 3%); }
.ms02-sec-c { background: #fff; }
.ms02-sec-d { background: rgb(182 255 59 / 10%); }
@media (min-width: 860px) { .ms02-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms03 ── */
.ms03-body { background: #ffffff; color: #0b1220; }
.ms03-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms03-nav-brand span, .ms03-brand span { color: #6a9a00; }
.ms03-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms03-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms03-btn-primary:hover { filter: brightness(.97); }
.ms03-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms03-btn-ghost:hover { background: #f4f7fa; }
.ms03-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms03-hero-bg { position: absolute; inset: 0; background: #ffffff; pointer-events: none; }
.ms03-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms03-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms03-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms03-lead { font-size: 1.1rem; line-height: 1.55; color: #5a6570; max-width: 38ch; margin: 0 0 1.25rem; }
.ms03-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms03-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: #0b1220; color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms03-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms03-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms03-panel-meta { opacity: .8; font-size: .9rem; }
.ms03-sec { padding: 3rem 1.5rem; }
.ms03-wrap { max-width: 920px; margin: 0 auto; }
.ms03-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms03-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms03-sec p { margin: 0 0 1rem; line-height: 1.55; color: #5a6570; max-width: 58ch; }
.ms03-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms03-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms03-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms03-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms03-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms03-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms03-trial .ms03-wrap { max-width: 700px; }
.ms03-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms03-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms03-trial .ms03-cta { justify-content: center; }
.ms03-footer { color: #5a6570; }
.ms03-hero-visual { display: none; }
.ms03-hero h1 { max-width: 12ch; font-size: clamp(2.8rem, 7vw, 4.4rem); }
.ms03-sec { border-top: 1px solid #e5e7eb; }
.ms03-list li { background: transparent; border: 0; border-left: 3px solid #b6ff3b; border-radius: 0; }

/* ── ms04 ── */
.ms04-body { background: linear-gradient(90deg,#f8fafc 0%,#eef2f6 100%); color: #0b1220; }
.ms04-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms04-nav-brand span, .ms04-brand span { color: #6a9a00; }
.ms04-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms04-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms04-btn-primary:hover { filter: brightness(.97); }
.ms04-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms04-btn-ghost:hover { background: #f4f7fa; }
.ms04-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms04-hero-bg { position: absolute; inset: 0; background: linear-gradient(90deg,#f8fafc 0%,#eef2f6 100%); pointer-events: none; }
.ms04-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms04-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms04-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms04-lead { font-size: 1.1rem; line-height: 1.55; color: #4b5563; max-width: 38ch; margin: 0 0 1.25rem; }
.ms04-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms04-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: linear-gradient(135deg,#12161c,#2e3845); color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms04-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms04-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms04-panel-meta { opacity: .8; font-size: .9rem; }
.ms04-sec { padding: 3rem 1.5rem; }
.ms04-wrap { max-width: 920px; margin: 0 auto; }
.ms04-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms04-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms04-sec p { margin: 0 0 1rem; line-height: 1.55; color: #4b5563; max-width: 58ch; }
.ms04-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms04-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms04-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms04-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms04-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms04-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms04-trial .ms04-wrap { max-width: 700px; }
.ms04-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms04-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms04-trial .ms04-cta { justify-content: center; }
.ms04-footer { color: #4b5563; }
@media (min-width: 860px) { .ms04-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms05 ── */
.ms05-body { background: linear-gradient(180deg,#fbfdff 0%,#eef6ff 55%,#e8f1fa 100%); color: #102033; }
.ms05-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #102033; }
.ms05-nav-brand span, .ms05-brand span { color: #6a9a00; }
.ms05-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms05-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms05-btn-primary:hover { filter: brightness(.97); }
.ms05-btn-ghost { background: #fff; color: #102033; border-color: rgb(11 18 32 / 16%); }
.ms05-btn-ghost:hover { background: #f4f7fa; }
.ms05-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms05-hero-bg { position: absolute; inset: 0; background: radial-gradient(circle at 20% 20%,rgb(182 255 59 / 12%),transparent 40%),linear-gradient(180deg,#fbfdff 0%,#eef6ff 55%,#e8f1fa 100%); pointer-events: none; }
.ms05-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms05-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms05-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms05-lead { font-size: 1.1rem; line-height: 1.55; color: #52667a; max-width: 38ch; margin: 0 0 1.25rem; }
.ms05-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms05-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: linear-gradient(160deg,#1e3a5f,#2f5f8a); color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms05-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms05-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms05-panel-meta { opacity: .8; font-size: .9rem; }
.ms05-sec { padding: 3rem 1.5rem; }
.ms05-wrap { max-width: 920px; margin: 0 auto; }
.ms05-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms05-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms05-sec p { margin: 0 0 1rem; line-height: 1.55; color: #52667a; max-width: 58ch; }
.ms05-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms05-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms05-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms05-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms05-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms05-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms05-trial .ms05-wrap { max-width: 700px; }
.ms05-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms05-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms05-trial .ms05-cta { justify-content: center; }
.ms05-footer { color: #52667a; }
@media (min-width: 860px) { .ms05-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms06 ── */
.ms06-body { background: linear-gradient(180deg,#fffdf8 0%,#f7f3ea 50%,#f0ebe0 100%); color: #1a1814; }
.ms06-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #1a1814; }
.ms06-nav-brand span, .ms06-brand span { color: #6a9a00; }
.ms06-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms06-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms06-btn-primary:hover { filter: brightness(.97); }
.ms06-btn-ghost { background: #fff; color: #1a1814; border-color: rgb(11 18 32 / 16%); }
.ms06-btn-ghost:hover { background: #f4f7fa; }
.ms06-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms06-hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 60% 40% at 90% 10%,rgb(255 220 160 / 25%),transparent 50%),linear-gradient(180deg,#fffdf8 0%,#f7f3ea 50%,#f0ebe0 100%); pointer-events: none; }
.ms06-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms06-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms06-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms06-lead { font-size: 1.1rem; line-height: 1.55; color: #6b6358; max-width: 38ch; margin: 0 0 1.25rem; }
.ms06-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms06-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: linear-gradient(145deg,#2c2924,#4a453c); color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms06-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms06-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms06-panel-meta { opacity: .8; font-size: .9rem; }
.ms06-sec { padding: 3rem 1.5rem; }
.ms06-wrap { max-width: 920px; margin: 0 auto; }
.ms06-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms06-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms06-sec p { margin: 0 0 1rem; line-height: 1.55; color: #6b6358; max-width: 58ch; }
.ms06-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms06-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms06-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms06-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms06-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms06-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms06-trial .ms06-wrap { max-width: 700px; }
.ms06-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms06-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms06-trial .ms06-cta { justify-content: center; }
.ms06-footer { color: #6b6358; }
@media (min-width: 860px) { .ms06-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms07 ── */
.ms07-body { background: #f6f8fa; color: #111827; }
.ms07-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #111827; }
.ms07-nav-brand span, .ms07-brand span { color: #6a9a00; }
.ms07-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms07-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms07-btn-primary:hover { filter: brightness(.97); }
.ms07-btn-ghost { background: #fff; color: #111827; border-color: rgb(11 18 32 / 16%); }
.ms07-btn-ghost:hover { background: #f4f7fa; }
.ms07-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms07-hero-bg { position: absolute; inset: 0; background: linear-gradient(120deg,rgb(182 255 59 / 8%),transparent 40%),#f6f8fa; pointer-events: none; }
.ms07-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms07-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms07-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms07-lead { font-size: 1.1rem; line-height: 1.55; color: #4b5563; max-width: 38ch; margin: 0 0 1.25rem; }
.ms07-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms07-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: #12161c; color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms07-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms07-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms07-panel-meta { opacity: .8; font-size: .9rem; }
.ms07-sec { padding: 3rem 1.5rem; }
.ms07-wrap { max-width: 920px; margin: 0 auto; }
.ms07-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms07-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms07-sec p { margin: 0 0 1rem; line-height: 1.55; color: #4b5563; max-width: 58ch; }
.ms07-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms07-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms07-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms07-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms07-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms07-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms07-trial .ms07-wrap { max-width: 700px; }
.ms07-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms07-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms07-trial .ms07-cta { justify-content: center; }
.ms07-footer { color: #4b5563; }
.ms07-sec-a .ms07-wrap { max-width: 720px; }
.ms07-sec-b { border-top: 1px solid #d9e1ea; border-bottom: 1px solid #d9e1ea; }
.ms07-hero h1 { max-width: 14ch; font-size: clamp(2.4rem, 6vw, 3.8rem); }
@media (min-width: 900px) { .ms07-hero-inner { grid-template-columns: 1.3fr .7fr; gap: 3rem; } }

/* ── ms08 ── */
.ms08-body { background: #f4f6f8; color: #0f172a; }
.ms08-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0f172a; }
.ms08-nav-brand span, .ms08-brand span { color: #6a9a00; }
.ms08-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms08-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms08-btn-primary:hover { filter: brightness(.97); }
.ms08-btn-ghost { background: #fff; color: #0f172a; border-color: rgb(11 18 32 / 16%); }
.ms08-btn-ghost:hover { background: #f4f7fa; }
.ms08-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms08-hero-bg { position: absolute; inset: 0; background: #f4f6f8; pointer-events: none; }
.ms08-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms08-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms08-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms08-lead { font-size: 1.1rem; line-height: 1.55; color: #64748b; max-width: 38ch; margin: 0 0 1.25rem; }
.ms08-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms08-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: #1c232d; color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms08-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms08-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms08-panel-meta { opacity: .8; font-size: .9rem; }
.ms08-sec { padding: 3rem 1.5rem; }
.ms08-wrap { max-width: 920px; margin: 0 auto; }
.ms08-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms08-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms08-sec p { margin: 0 0 1rem; line-height: 1.55; color: #64748b; max-width: 58ch; }
.ms08-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms08-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms08-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms08-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms08-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms08-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms08-trial .ms08-wrap { max-width: 700px; }
.ms08-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms08-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms08-trial .ms08-cta { justify-content: center; }
.ms08-footer { color: #64748b; }
.ms08-sec-a { background: #fff; }
.ms08-sec-b { background: rgb(11 18 32 / 3%); }
.ms08-sec-c { background: #fff; }
.ms08-sec-d { background: rgb(182 255 59 / 10%); }

/* ── ms09 ── */
.ms09-body { background: linear-gradient(180deg,#f9fafb 0%,#eef2f5 100%); color: #0b1220; }
.ms09-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms09-nav-brand span, .ms09-brand span { color: #6a9a00; }
.ms09-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms09-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms09-btn-primary:hover { filter: brightness(.97); }
.ms09-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms09-btn-ghost:hover { background: #f4f7fa; }
.ms09-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms09-hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 90% 60% at 50% 0%,rgb(200 220 235 / 80%),transparent 70%),linear-gradient(180deg,#f9fafb 0%,#eef2f5 100%); pointer-events: none; }
.ms09-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms09-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms09-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms09-lead { font-size: 1.1rem; line-height: 1.55; color: #5b6775; max-width: 38ch; margin: 0 0 1.25rem; }
.ms09-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms09-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: linear-gradient(180deg,#dbe7f0,#b8c9d8); color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms09-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms09-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms09-panel-meta { opacity: .8; font-size: .9rem; }
.ms09-sec { padding: 3rem 1.5rem; }
.ms09-wrap { max-width: 920px; margin: 0 auto; }
.ms09-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms09-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms09-sec p { margin: 0 0 1rem; line-height: 1.55; color: #5b6775; max-width: 58ch; }
.ms09-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms09-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms09-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms09-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms09-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms09-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms09-trial .ms09-wrap { max-width: 700px; }
.ms09-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms09-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms09-trial .ms09-cta { justify-content: center; }
.ms09-footer { color: #5b6775; }
.ms09-panel { color: #0b1220; min-height: 220px; }
.ms09-panel-mark { color: #3d5a00; }
@media (min-width: 860px) { .ms09-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms10 ── */
.ms10-body { background: #ffffff; color: #0a0a0a; }
.ms10-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0a0a0a; }
.ms10-nav-brand span, .ms10-brand span { color: #6a9a00; }
.ms10-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms10-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms10-btn-primary:hover { filter: brightness(.97); }
.ms10-btn-ghost { background: #fff; color: #0a0a0a; border-color: rgb(11 18 32 / 16%); }
.ms10-btn-ghost:hover { background: #f4f7fa; }
.ms10-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms10-hero-bg { position: absolute; inset: 0; background: #ffffff; pointer-events: none; }
.ms10-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms10-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms10-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms10-lead { font-size: 1.1rem; line-height: 1.55; color: #525252; max-width: 38ch; margin: 0 0 1.25rem; }
.ms10-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms10-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: #0a0a0a; color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms10-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms10-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms10-panel-meta { opacity: .8; font-size: .9rem; }
.ms10-sec { padding: 3rem 1.5rem; }
.ms10-wrap { max-width: 920px; margin: 0 auto; }
.ms10-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms10-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms10-sec p { margin: 0 0 1rem; line-height: 1.55; color: #525252; max-width: 58ch; }
.ms10-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms10-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms10-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms10-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms10-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms10-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms10-trial .ms10-wrap { max-width: 700px; }
.ms10-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms10-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms10-trial .ms10-cta { justify-content: center; }
.ms10-footer { color: #525252; }
.ms10-nav-brand span, .ms10-brand span { color: #b6ff3b; }
.ms10-eyebrow { color: #0a0a0a; }
.ms10-chips span { background: #0a0a0a; border-radius: 0; }
.ms10-chips span:last-child { background: #b6ff3b; }
.ms10-btn { border-radius: 0; }
.ms10-panel { border-radius: 0; }
.ms10-list li { border-radius: 0; }

/* ── ms11 ── */
.ms11-body { background: #fbfcfd; color: #0b1220; }
.ms11-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms11-nav-brand span, .ms11-brand span { color: #6a9a00; }
.ms11-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms11-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms11-btn-primary:hover { filter: brightness(.97); }
.ms11-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms11-btn-ghost:hover { background: #f4f7fa; }
.ms11-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms11-hero-bg { position: absolute; inset: 0; background: #fbfcfd; pointer-events: none; }
.ms11-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms11-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms11-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms11-lead { font-size: 1.1rem; line-height: 1.55; color: #6b7280; max-width: 38ch; margin: 0 0 1.25rem; }
.ms11-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms11-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: #1c232d; color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms11-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms11-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms11-panel-meta { opacity: .8; font-size: .9rem; }
.ms11-sec { padding: 3rem 1.5rem; }
.ms11-wrap { max-width: 920px; margin: 0 auto; }
.ms11-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms11-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms11-sec p { margin: 0 0 1rem; line-height: 1.55; color: #6b7280; max-width: 58ch; }
.ms11-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms11-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms11-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms11-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms11-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms11-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms11-trial .ms11-wrap { max-width: 700px; }
.ms11-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms11-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms11-trial .ms11-cta { justify-content: center; }
.ms11-footer { color: #6b7280; }
.ms11-hero { padding: 7rem 1.5rem 5rem; }
.ms11-hero h1 { max-width: 12ch; font-size: clamp(2.6rem, 6vw, 4rem); }
.ms11-lead { font-size: 1.2rem; }
.ms11-sec { padding: 4.5rem 1.5rem; }

/* ── ms12 ── */
.ms12-body { background: linear-gradient(180deg,#ffffff 0%,#f3f6f9 100%); color: #0b1220; }
.ms12-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms12-nav-brand span, .ms12-brand span { color: #6a9a00; }
.ms12-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms12-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms12-btn-primary:hover { filter: brightness(.97); }
.ms12-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms12-btn-ghost:hover { background: #f4f7fa; }
.ms12-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms12-hero-bg { position: absolute; inset: 0; background: linear-gradient(180deg,#ffffff 0%,#f3f6f9 100%); pointer-events: none; }
.ms12-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms12-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms12-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms12-lead { font-size: 1.1rem; line-height: 1.55; color: #4b5563; max-width: 38ch; margin: 0 0 1.25rem; }
.ms12-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms12-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: #243041; color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms12-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms12-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms12-panel-meta { opacity: .8; font-size: .9rem; }
.ms12-sec { padding: 3rem 1.5rem; }
.ms12-wrap { max-width: 920px; margin: 0 auto; }
.ms12-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms12-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms12-sec p { margin: 0 0 1rem; line-height: 1.55; color: #4b5563; max-width: 58ch; }
.ms12-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms12-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms12-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms12-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms12-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms12-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms12-trial .ms12-wrap { max-width: 700px; }
.ms12-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms12-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms12-trial .ms12-cta { justify-content: center; }
.ms12-footer { color: #4b5563; }
.ms12-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin-top: 1.25rem; }
.ms12-grid2 article { padding: 0; }
.ms12-grid2 h3 { font-family: "Barlow Condensed", sans-serif; font-size: 1.35rem; margin: 0 0 .35rem; }
.ms12-grid2 p { margin: 0; }
@media (max-width: 700px) { .ms12-grid2 { grid-template-columns: 1fr; } }

/* ── ms13 ── */
.ms13-body { background: radial-gradient(ellipse 80% 50% at 50% 0%,#f4f9ef,#ffffff 55%); color: #0b1220; }
.ms13-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms13-nav-brand span, .ms13-brand span { color: #6a9a00; }
.ms13-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms13-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms13-btn-primary:hover { filter: brightness(.97); }
.ms13-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms13-btn-ghost:hover { background: #f4f7fa; }
.ms13-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms13-hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 80% 50% at 50% 0%,#f4f9ef,#ffffff 55%); pointer-events: none; }
.ms13-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms13-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms13-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms13-lead { font-size: 1.1rem; line-height: 1.55; color: #5a6570; max-width: 38ch; margin: 0 0 1.25rem; }
.ms13-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms13-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: #12161c; color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms13-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms13-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms13-panel-meta { opacity: .8; font-size: .9rem; }
.ms13-sec { padding: 3rem 1.5rem; }
.ms13-wrap { max-width: 920px; margin: 0 auto; }
.ms13-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms13-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms13-sec p { margin: 0 0 1rem; line-height: 1.55; color: #5a6570; max-width: 58ch; }
.ms13-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms13-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms13-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms13-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms13-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms13-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms13-trial .ms13-wrap { max-width: 700px; }
.ms13-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms13-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms13-trial .ms13-cta { justify-content: center; }
.ms13-footer { color: #5a6570; }
.ms13-hero-inner { text-align: center; justify-items: center; }
.ms13-hero-copy { display: flex; flex-direction: column; align-items: center; }
.ms13-lead { max-width: 42ch; }
.ms13-cta { justify-content: center; }
.ms13-hero-visual { width: min(360px, 100%); }
.ms13-hero h1 { max-width: none; }

/* ── ms14 ── */
.ms14-body { background: linear-gradient(180deg,#f5f7fa 0%,#e8eef5 100%); color: #152033; }
.ms14-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #152033; }
.ms14-nav-brand span, .ms14-brand span { color: #6a9a00; }
.ms14-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms14-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms14-btn-primary:hover { filter: brightness(.97); }
.ms14-btn-ghost { background: #fff; color: #152033; border-color: rgb(11 18 32 / 16%); }
.ms14-btn-ghost:hover { background: #f4f7fa; }
.ms14-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms14-hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 50% 40% at 0% 0%,rgb(100 140 180 / 15%),transparent 50%),linear-gradient(180deg,#f5f7fa 0%,#e8eef5 100%); pointer-events: none; }
.ms14-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms14-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms14-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms14-lead { font-size: 1.1rem; line-height: 1.55; color: #5a6b7d; max-width: 38ch; margin: 0 0 1.25rem; }
.ms14-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms14-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: linear-gradient(145deg,#2a3a4d,#3d5168); color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms14-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms14-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms14-panel-meta { opacity: .8; font-size: .9rem; }
.ms14-sec { padding: 3rem 1.5rem; }
.ms14-wrap { max-width: 920px; margin: 0 auto; }
.ms14-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms14-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms14-sec p { margin: 0 0 1rem; line-height: 1.55; color: #5a6b7d; max-width: 58ch; }
.ms14-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms14-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms14-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms14-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms14-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms14-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms14-trial .ms14-wrap { max-width: 700px; }
.ms14-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms14-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms14-trial .ms14-cta { justify-content: center; }
.ms14-footer { color: #5a6b7d; }
@media (min-width: 860px) { .ms14-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms15 ── */
.ms15-body { background: #ffffff; color: #0b1220; }
.ms15-nav { background: rgb(255 255 255 / 90%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms15-nav-brand span, .ms15-brand span { color: #6a9a00; }
.ms15-btn { display: inline-block; text-decoration: none; font-weight: 700; padding: .7rem 1.1rem; border-radius: 8px; border: 1px solid transparent; font-size: .95rem; }
.ms15-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms15-btn-primary:hover { filter: brightness(.97); }
.ms15-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms15-btn-ghost:hover { background: #f4f7fa; }
.ms15-hero { position: relative; padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; }
.ms15-hero-bg { position: absolute; inset: 0; background: linear-gradient(90deg,rgb(182 255 59 / 10%),transparent 40%),#ffffff; pointer-events: none; }
.ms15-hero-inner { position: relative; max-width: 1100px; margin: 0 auto; display: grid; gap: 2rem; align-items: center; }
.ms15-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .35rem; line-height: .95; }
.ms15-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.05; margin: 0 0 .75rem; max-width: 16ch; font-weight: 800; }
.ms15-lead { font-size: 1.1rem; line-height: 1.55; color: #4b5563; max-width: 38ch; margin: 0 0 1.25rem; }
.ms15-cta { display: flex; flex-wrap: wrap; gap: .65rem; }
.ms15-panel { border-radius: 16px; padding: 1.5rem; min-height: 180px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: #12161c; color: #eef2f6; box-shadow: 0 18px 40px rgb(11 18 32 / 12%); }
.ms15-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #b6ff3b; }
.ms15-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; font-weight: 800; }
.ms15-panel-meta { opacity: .8; font-size: .9rem; }
.ms15-sec { padding: 3rem 1.5rem; }
.ms15-wrap { max-width: 920px; margin: 0 auto; }
.ms15-eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms15-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.7rem, 3.5vw, 2.3rem); margin: 0 0 .6rem; line-height: 1.1; }
.ms15-sec p { margin: 0 0 1rem; line-height: 1.55; color: #4b5563; max-width: 58ch; }
.ms15-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms15-list li { background: rgb(255 255 255 / 75%); border: 1px solid rgb(11 18 32 / 8%); padding: .55rem .7rem; border-radius: 8px; font-weight: 600; font-size: .92rem; }
.ms15-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms15-chips span { background: #0b1220; color: #eef2f6; padding: .4rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ms15-chips span:last-child { background: #b6ff3b; color: #0b1220; }
.ms15-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms15-trial .ms15-wrap { max-width: 700px; }
.ms15-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 2.5rem); margin: 0 0 .6rem; }
.ms15-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms15-trial .ms15-cta { justify-content: center; }
.ms15-footer { color: #4b5563; }
.ms15-hero { padding: 3rem 1.5rem 2rem; }
.ms15-sec { padding: 1.75rem 1.5rem; }
.ms15-sec-d { display: none; }
.ms15-trial { padding: 2.5rem 1.5rem; }

@media (max-width: 640px) {
  .ms-gallery-head h1 { max-width: none; }
  .ms-preview-bar { align-items: flex-start; }
}

/* ═══════════════════════════════════════════
   HIGH IMPACT SET — ms16–ms22 (bright / wow)
   ═══════════════════════════════════════════ */

@keyframes ms-rise {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes ms-beam-sweep {
  0%, 100% { opacity: .35; transform: translateX(-8%) skewX(-12deg); }
  50% { opacity: .85; transform: translateX(8%) skewX(-12deg); }
}
@keyframes ms-burst-pulse {
  0%, 100% { transform: scale(1); opacity: .55; }
  50% { transform: scale(1.12); opacity: 1; }
}
@keyframes ms-streak {
  0% { transform: translateX(-40%) translateY(10%); opacity: 0; }
  40% { opacity: .9; }
  100% { transform: translateX(60%) translateY(-20%); opacity: 0; }
}
@keyframes ms-sun-glow {
  0%, 100% { transform: scale(1); opacity: .55; }
  50% { transform: scale(1.08); opacity: .85; }
}
@keyframes ms-pulse-ring {
  0% { transform: scale(.7); opacity: .7; }
  100% { transform: scale(1.35); opacity: 0; }
}
@keyframes ms-flood {
  0%, 100% { opacity: .45; }
  50% { opacity: .9; }
}
@keyframes ms-slash {
  0%, 100% { transform: translateX(-6%) rotate(-18deg); }
  50% { transform: translateX(6%) rotate(-18deg); }
}
@keyframes ms-spark {
  0%, 100% { transform: scale(.9) rotate(0deg); opacity: .7; }
  50% { transform: scale(1.15) rotate(8deg); opacity: 1; }
}
@keyframes ms-blast {
  0%, 100% { transform: scale(1); opacity: .5; }
  50% { transform: scale(1.18); opacity: .95; }
}
@keyframes ms-stripe-run {
  0% { background-position: 0 0; }
  100% { background-position: 120px 0; }
}
@keyframes ms-slide-in {
  from { opacity: 0; transform: translateX(-28px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes ms-ticker-line {
  0% { transform: scaleX(0); transform-origin: left; }
  100% { transform: scaleX(1); transform-origin: left; }
}

/* ── ms16 Volt surge ── */
.ms16-body { background: linear-gradient(180deg,#ffffff 0%,#f7ffe8 45%,#eef8ff 100%); color: #0b1220; }
.ms16-nav { background: rgb(255 255 255 / 92%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms16-nav-brand span, .ms16-brand span { color: #6a9a00; }
.ms16-btn { display: inline-block; text-decoration: none; font-weight: 800; padding: .8rem 1.2rem; border-radius: 8px; border: 1px solid transparent; font-size: 1rem; }
.ms16-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; box-shadow: 0 8px 24px rgb(182 255 59 / 35%); }
.ms16-btn-primary:hover { filter: brightness(.97); transform: translateY(-1px); }
.ms16-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms16-hero { position: relative; min-height: min(88vh, 720px); padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; display: flex; align-items: center; }
.ms16-hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 70% 50% at 85% 20%,rgb(182 255 59 / 45%),transparent 55%),radial-gradient(ellipse 50% 40% at 10% 80%,rgb(56 189 248 / 18%),transparent 50%),#fff; pointer-events: none; }
.ms16-beam { position: absolute; height: 3px; width: 55%; background: linear-gradient(90deg,transparent,#b6ff3b,transparent); animation: ms-beam-sweep 3.2s ease-in-out infinite; }
.ms16-beam-a { top: 22%; left: 10%; animation-delay: 0s; }
.ms16-beam-b { top: 48%; left: 30%; width: 40%; animation-delay: .6s; }
.ms16-beam-c { top: 72%; left: 5%; width: 50%; animation-delay: 1.2s; }
.ms16-hero-inner { position: relative; max-width: 1120px; margin: 0 auto; width: 100%; display: grid; gap: 2rem; align-items: center; }
.ms16-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(3rem, 8vw, 4.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .2rem; line-height: .92; }
.ms16-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.6rem, 7vw, 4.4rem); line-height: .98; margin: 0 0 .75rem; max-width: 12ch; font-weight: 800; }
.ms16-lead { font-size: 1.15rem; line-height: 1.5; color: #3d4a5c; max-width: 36ch; margin: 0 0 1.35rem; }
.ms16-cta { display: flex; flex-wrap: wrap; gap: .7rem; }
.ms16-rise { opacity: 0; animation: ms-rise .7s ease forwards; }
.ms16-rise-2 { animation-delay: .12s; }
.ms16-rise-3 { animation-delay: .22s; }
.ms16-rise-4 { animation-delay: .32s; }
.ms16-burst { position: relative; width: min(340px, 100%); aspect-ratio: 1; margin-inline: auto; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle at 40% 35%,#fff,#e8ff9a 45%,#b6ff3b 70%,#9fe01f); box-shadow: 0 24px 60px rgb(182 255 59 / 40%), 0 0 0 1px rgb(11 18 32 / 6%); }
.ms16-burst-ring { position: absolute; inset: 8%; border: 2px solid rgb(11 18 32 / 12%); border-radius: 50%; animation: ms-burst-pulse 2.4s ease-in-out infinite; }
.ms16-burst-ring-2 { inset: -4%; border-color: rgb(182 255 59 / 55%); animation-delay: .7s; }
.ms16-burst-core { font-family: "Barlow Condensed", sans-serif; font-size: 3.2rem; font-weight: 800; letter-spacing: .12em; color: #0b1220; z-index: 1; }
.ms16-burst-meta { position: absolute; bottom: 18%; font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: #3d5a00; z-index: 1; }
.ms16-sec { padding: 3.25rem 1.5rem; }
.ms16-wrap { max-width: 960px; margin: 0 auto; }
.ms16-eyebrow { font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms16-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; line-height: 1.05; }
.ms16-sec p { margin: 0 0 1rem; line-height: 1.55; color: #3d4a5c; max-width: 58ch; }
.ms16-sec-punch { background: #0b1220; color: #eef2f6; }
.ms16-sec-punch p, .ms16-sec-punch .ms16-eyebrow { color: #b6ff3b; }
.ms16-sec-punch h2 { color: #fff; }
.ms16-punch-row { display: grid; gap: 1.75rem; }
.ms16-punches { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.ms16-punches li { display: flex; flex-direction: column; gap: .15rem; padding: .85rem 1rem; background: rgb(255 255 255 / 6%); border-left: 4px solid #b6ff3b; }
.ms16-punches strong { font-family: "Barlow Condensed", sans-serif; font-size: 1.35rem; color: #fff; }
.ms16-punches span { color: #9aa7b5; font-size: .92rem; }
.ms16-sec-a { background: #fff; }
.ms16-sec-b { background: rgb(182 255 59 / 12%); }
.ms16-sec-d { background: #f4f9ef; }
.ms16-sec-modules {
  background:
    radial-gradient(ellipse 70% 50% at 50% 0%, rgb(182 255 59 / 18%), transparent 55%),
    radial-gradient(ellipse 50% 40% at 100% 80%, rgb(56 189 248 / 12%), transparent 50%),
    #ffffff;
}
.ms16-wrap-wide { max-width: 1100px; }
.ms16-modules-lead { margin: 0 0 1.75rem; max-width: 42rem; }
.ms16-addons {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 1rem;
}
.ms16-addon {
  border: 1px solid rgb(11 18 32 / 10%);
  border-radius: 10px;
  padding: 1.15rem 1.2rem;
  background: #ffffff;
  box-shadow: 0 8px 22px rgb(11 18 32 / 4%);
  transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.ms16-addon:hover {
  border-color: rgb(106 154 0 / 45%);
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgb(182 255 59 / 18%);
}
.ms16-addon h3 {
  font-family: "Barlow Condensed", sans-serif;
  font-size: 1.35rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .02em;
  margin: 0 0 .35rem;
  color: #0b1220;
  line-height: 1.1;
}
.ms16-addon p {
  margin: 0 0 .7rem;
  color: #4a5b6d;
  font-size: .96rem;
  line-height: 1.4;
  max-width: none;
}
.ms16-addon-price {
  font-family: "IBM Plex Mono", monospace;
  color: #5f8a00;
  font-size: .94rem;
  font-weight: 600;
}
.ms16-trial { padding: 3.5rem 1.5rem; text-align: center; background: linear-gradient(135deg,#0b1220,#1c232d); color: #eef2f6; }
.ms16-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; }
.ms16-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms16-trial .ms16-cta { justify-content: center; }
.ms16-footer { color: #4a5568; }
@media (min-width: 900px) {
  .ms16-hero-inner { grid-template-columns: 1.15fr .85fr; }
  .ms16-punch-row { grid-template-columns: 1fr 1fr; align-items: start; }
}

/* ── ms17 Daylight rush ── */
.ms17-body { background: linear-gradient(180deg,#fffef8 0%,#e8f4ff 50%,#f2ffe0 100%); color: #0b1220; }
.ms17-nav { background: rgb(255 255 255 / 92%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms17-nav-brand span, .ms17-brand span { color: #6a9a00; }
.ms17-btn { display: inline-block; text-decoration: none; font-weight: 800; padding: .8rem 1.2rem; border-radius: 8px; border: 1px solid transparent; font-size: 1rem; }
.ms17-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; box-shadow: 0 8px 24px rgb(182 255 59 / 30%); }
.ms17-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms17-hero { position: relative; min-height: min(88vh, 720px); padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; display: flex; align-items: center; }
.ms17-hero-bg { position: absolute; inset: 0; background: linear-gradient(135deg,#fffef8 0%,#d9efff 48%,#e8ffb0 100%); pointer-events: none; }
.ms17-sun { position: absolute; top: -8%; right: -5%; width: min(420px, 55vw); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle,#fff 0%,rgb(255 240 160 / 70%) 35%,rgb(182 255 59 / 25%) 55%,transparent 70%); animation: ms-sun-glow 4s ease-in-out infinite; }
.ms17-streak { position: absolute; height: 4px; width: 70%; background: linear-gradient(90deg,transparent,#fff,rgb(182 255 59 / 80%),transparent); border-radius: 999px; animation: ms-streak 2.8s ease-in-out infinite; }
.ms17-streak-1 { top: 28%; left: 0; animation-delay: 0s; }
.ms17-streak-2 { top: 52%; left: 10%; width: 55%; animation-delay: .9s; }
.ms17-streak-3 { top: 70%; left: -5%; width: 65%; animation-delay: 1.6s; }
.ms17-hero-inner { position: relative; max-width: 1120px; margin: 0 auto; width: 100%; display: grid; gap: 2rem; align-items: center; }
.ms17-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(3rem, 8vw, 4.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .2rem; line-height: .92; }
.ms17-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.6rem, 7vw, 4.2rem); line-height: .98; margin: 0 0 .75rem; max-width: 12ch; font-weight: 800; }
.ms17-lead { font-size: 1.15rem; line-height: 1.5; color: #3d4a5c; max-width: 36ch; margin: 0 0 1.35rem; }
.ms17-cta { display: flex; flex-wrap: wrap; gap: .7rem; }
.ms17-in { opacity: 0; animation: ms-rise .65s ease forwards; }
.ms17-in-2 { animation-delay: .1s; }
.ms17-in-3 { animation-delay: .2s; }
.ms17-in-4 { animation-delay: .3s; }
.ms17-panel { border-radius: 20px; padding: 2rem 1.75rem; min-height: 240px; display: flex; flex-direction: column; justify-content: flex-end; gap: .4rem; background: linear-gradient(160deg,#ffffff,#e8f8ff 60%,#d8ff8a); border: 1px solid rgb(11 18 32 / 8%); box-shadow: 0 28px 50px rgb(56 189 248 / 18%); }
.ms17-panel-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: #3d5a00; }
.ms17-panel-title { font-family: "Barlow Condensed", sans-serif; font-size: 2.4rem; font-weight: 800; color: #0b1220; }
.ms17-panel-meta { font-weight: 600; color: #3d4a5c; }
.ms17-sec { padding: 3.25rem 1.5rem; }
.ms17-wrap { max-width: 960px; margin: 0 auto; }
.ms17-eyebrow { font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms17-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; line-height: 1.05; }
.ms17-sec p { margin: 0 0 1rem; line-height: 1.55; color: #3d4a5c; max-width: 58ch; }
.ms17-band { background: linear-gradient(90deg,#b6ff3b 0%,#d7f56a 40%,#c8e8ff 100%); }
.ms17-band p { color: #0b1220; }
.ms17-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms17-chips span { background: #0b1220; color: #eef2f6; padding: .45rem .75rem; border-radius: 6px; font-size: .88rem; font-weight: 700; }
.ms17-chips span:last-child { background: #fff; color: #0b1220; }
.ms17-sec-a { background: #fff; }
.ms17-sec-b { background: rgb(56 189 248 / 10%); }
.ms17-sec-d { background: #fffef8; }
.ms17-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms17-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; }
.ms17-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms17-trial .ms17-cta { justify-content: center; }
.ms17-footer { color: #4a5568; }
@media (min-width: 900px) { .ms17-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms18 Electric clear ── */
.ms18-body { background: #ffffff; color: #0b1220; }
.ms18-nav { background: rgb(255 255 255 / 94%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms18-nav-brand span, .ms18-brand span { color: #6a9a00; }
.ms18-btn { display: inline-block; text-decoration: none; font-weight: 800; padding: .8rem 1.2rem; border-radius: 6px; border: 1px solid transparent; font-size: 1rem; }
.ms18-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms18-btn-ghost { background: transparent; color: #0b1220; border-color: rgb(11 18 32 / 18%); }
.ms18-hero { position: relative; min-height: min(88vh, 720px); padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; display: flex; align-items: center; }
.ms18-hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 60% 50% at 70% 40%,rgb(182 255 59 / 22%),transparent 60%),#fff; pointer-events: none; }
.ms18-grid { position: absolute; inset: 0; background-image: linear-gradient(rgb(11 18 32 / 4%) 1px, transparent 1px), linear-gradient(90deg, rgb(11 18 32 / 4%) 1px, transparent 1px); background-size: 48px 48px; mask-image: radial-gradient(ellipse 70% 60% at 60% 40%,#000 20%,transparent 75%); }
.ms18-pulse { position: absolute; top: 35%; right: 12%; width: 180px; height: 180px; border: 2px solid #b6ff3b; border-radius: 50%; animation: ms-pulse-ring 2.2s ease-out infinite; }
.ms18-pulse-2 { width: 260px; height: 260px; top: 28%; right: 6%; animation-delay: .7s; border-color: rgb(56 189 248 / 45%); }
.ms18-hero-inner { position: relative; max-width: 1120px; margin: 0 auto; width: 100%; display: grid; gap: 2rem; align-items: center; }
.ms18-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(3rem, 8vw, 4.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .2rem; line-height: .92; }
.ms18-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.6rem, 7vw, 4.2rem); line-height: .98; margin: 0 0 .75rem; max-width: 14ch; font-weight: 800; }
.ms18-lead { font-size: 1.15rem; line-height: 1.5; color: #3d4a5c; max-width: 36ch; margin: 0 0 1.35rem; }
.ms18-cta { display: flex; flex-wrap: wrap; gap: .7rem; }
.ms18-snap { opacity: 0; animation: ms-rise .55s cubic-bezier(.2,.8,.2,1) forwards; }
.ms18-snap-2 { animation-delay: .08s; }
.ms18-snap-3 { animation-delay: .16s; }
.ms18-snap-4 { animation-delay: .24s; }
.ms18-glass { position: relative; padding: 2rem; min-height: 250px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: rgb(255 255 255 / 75%); backdrop-filter: blur(10px); border: 1px solid rgb(11 18 32 / 10%); border-radius: 16px; box-shadow: 0 20px 50px rgb(11 18 32 / 8%); overflow: hidden; }
.ms18-glass-edge { position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(135deg,rgb(182 255 59 / 35%),transparent 40%,rgb(56 189 248 / 25%)); opacity: .9; pointer-events: none; }
.ms18-glass-mark, .ms18-glass-title, .ms18-glass-meta { position: relative; z-index: 1; }
.ms18-glass-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: #6a9a00; }
.ms18-glass-title { font-family: "Barlow Condensed", sans-serif; font-size: 2.6rem; font-weight: 800; }
.ms18-glass-meta { color: #3d4a5c; font-weight: 600; }
.ms18-sec { padding: 3.25rem 1.5rem; }
.ms18-wrap { max-width: 960px; margin: 0 auto; }
.ms18-eyebrow { font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms18-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; line-height: 1.05; }
.ms18-sec p { margin: 0 0 1rem; line-height: 1.55; color: #3d4a5c; max-width: 58ch; }
.ms18-volt-band { background: #b6ff3b; }
.ms18-volt-band .ms18-eyebrow, .ms18-volt-band p { color: #0b1220; }
.ms18-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.ms18-list li { border-left: 3px solid #b6ff3b; padding: .55rem .7rem; font-weight: 700; background: #f7fafc; }
.ms18-sec-a { background: #f8fafc; }
.ms18-sec-b { background: #fff; }
.ms18-sec-d { background: #f0fff0; }
.ms18-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms18-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; }
.ms18-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms18-trial .ms18-cta { justify-content: center; }
.ms18-footer { color: #4a5568; }
@media (min-width: 900px) { .ms18-hero-inner { grid-template-columns: 1.1fr .9fr; } }

/* ── ms19 Stadium light ── */
.ms19-body { background: linear-gradient(180deg,#ffffff 0%,#f2f8ff 40%,#f4ffe8 100%); color: #0b1220; }
.ms19-nav { background: rgb(255 255 255 / 92%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms19-nav-brand span, .ms19-brand span { color: #6a9a00; }
.ms19-btn { display: inline-block; text-decoration: none; font-weight: 800; padding: .8rem 1.2rem; border-radius: 8px; border: 1px solid transparent; font-size: 1rem; }
.ms19-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; box-shadow: 0 0 0 4px rgb(182 255 59 / 25%); }
.ms19-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms19-hero { position: relative; min-height: min(90vh, 740px); padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; display: flex; align-items: center; }
.ms19-hero-bg { position: absolute; inset: 0; background: #f7fbff; pointer-events: none; }
.ms19-flood { position: absolute; top: -20%; width: 45%; height: 90%; background: linear-gradient(180deg,rgb(255 255 255 / 95%),rgb(182 255 59 / 35%),transparent); filter: blur(2px); animation: ms-flood 3.5s ease-in-out infinite; }
.ms19-flood-l { left: 5%; transform: skewX(-8deg); }
.ms19-flood-r { right: 5%; transform: skewX(8deg); animation-delay: 1s; background: linear-gradient(180deg,rgb(255 255 255 / 95%),rgb(56 189 248 / 28%),transparent); }
.ms19-floor { position: absolute; left: 0; right: 0; bottom: 0; height: 28%; background: linear-gradient(180deg,transparent,rgb(182 255 59 / 18%)); }
.ms19-hero-inner { position: relative; max-width: 1120px; margin: 0 auto; width: 100%; display: grid; gap: 2rem; align-items: center; }
.ms19-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(3rem, 8vw, 4.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .2rem; line-height: .92; }
.ms19-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.5rem, 6.5vw, 4rem); line-height: .98; margin: 0 0 .75rem; max-width: 14ch; font-weight: 800; }
.ms19-lead { font-size: 1.15rem; line-height: 1.5; color: #3d4a5c; max-width: 36ch; margin: 0 0 1.35rem; }
.ms19-cta { display: flex; flex-wrap: wrap; gap: .7rem; }
.ms19-up { opacity: 0; animation: ms-rise .7s ease forwards; }
.ms19-up-2 { animation-delay: .12s; }
.ms19-up-3 { animation-delay: .22s; }
.ms19-up-4 { animation-delay: .32s; }
.ms19-arena { padding: 2rem; min-height: 250px; display: flex; flex-direction: column; justify-content: flex-end; gap: .35rem; background: linear-gradient(180deg,#fff,#e8ffb8); border: 2px solid #0b1220; border-radius: 12px; box-shadow: 0 0 0 8px rgb(182 255 59 / 25%), 0 30px 50px rgb(11 18 32 / 10%); }
.ms19-arena-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: #3d5a00; }
.ms19-arena-title { font-family: "Barlow Condensed", sans-serif; font-size: 2.5rem; font-weight: 800; }
.ms19-arena-meta { font-weight: 700; color: #3d4a5c; }
.ms19-sec { padding: 3.25rem 1.5rem; }
.ms19-wrap { max-width: 960px; margin: 0 auto; }
.ms19-eyebrow { font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms19-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; line-height: 1.05; }
.ms19-sec p { margin: 0 0 1rem; line-height: 1.55; color: #3d4a5c; max-width: 58ch; }
.ms19-spotlight { background: #0b1220; color: #fff; }
.ms19-spotlight .ms19-eyebrow { color: #b6ff3b; }
.ms19-spotlight p { color: #9aa7b5; }
.ms19-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms19-chips span { background: #b6ff3b; color: #0b1220; padding: .45rem .75rem; border-radius: 6px; font-size: .88rem; font-weight: 800; }
.ms19-sec-a { background: #fff; }
.ms19-sec-b { background: #eef8ff; }
.ms19-sec-d { background: #f4ffe8; }
.ms19-trial { padding: 3.5rem 1.5rem; text-align: center; background: linear-gradient(90deg,#b6ff3b,#e8ff9a); color: #0b1220; }
.ms19-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; }
.ms19-trial p { color: #1c232d; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms19-trial .ms19-cta { justify-content: center; }
.ms19-trial .ms19-btn-ghost { background: #fff; }
.ms19-footer { color: #4a5568; }
@media (min-width: 900px) { .ms19-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms20 Impact white ── */
.ms20-body { background: #ffffff; color: #0b1220; }
.ms20-nav { background: #fff; border-bottom: 3px solid #b6ff3b; color: #0b1220; }
.ms20-nav-brand span, .ms20-brand span { color: #b6ff3b; -webkit-text-stroke: 0; }
.ms20-btn { display: inline-block; text-decoration: none; font-weight: 800; padding: .85rem 1.25rem; border-radius: 0; border: 2px solid transparent; font-size: 1rem; }
.ms20-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #0b1220; }
.ms20-btn-ghost { background: #fff; color: #0b1220; border-color: #0b1220; }
.ms20-hero { position: relative; min-height: min(88vh, 720px); padding: 5rem 1.5rem 3.5rem; overflow: hidden; display: flex; align-items: center; }
.ms20-hero-bg { position: absolute; inset: 0; background: #fff; pointer-events: none; }
.ms20-slash { position: absolute; top: 10%; right: -10%; width: 55%; height: 70%; background: linear-gradient(115deg,transparent 30%,rgb(182 255 59 / 55%) 50%,transparent 70%); animation: ms-slash 4s ease-in-out infinite; }
.ms20-spark { position: absolute; bottom: 12%; right: 18%; width: 90px; height: 90px; background: #b6ff3b; clip-path: polygon(50% 0%, 62% 38%, 100% 38%, 70% 60%, 82% 100%, 50% 75%, 18% 100%, 30% 60%, 0% 38%, 38% 38%); animation: ms-spark 2.2s ease-in-out infinite; }
.ms20-hero-inner { position: relative; max-width: 1120px; margin: 0 auto; width: 100%; display: grid; gap: 2rem; align-items: center; }
.ms20-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(3.2rem, 9vw, 5rem); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; margin: 0 0 .15rem; line-height: .9; }
.ms20-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.8rem, 7.5vw, 4.6rem); line-height: .95; margin: 0 0 .75rem; max-width: 12ch; font-weight: 800; }
.ms20-lead { font-size: 1.18rem; line-height: 1.5; color: #1c232d; max-width: 34ch; margin: 0 0 1.4rem; font-weight: 600; }
.ms20-cta { display: flex; flex-wrap: wrap; gap: .7rem; }
.ms20-pop { opacity: 0; animation: ms-rise .6s cubic-bezier(.2,.9,.2,1) forwards; }
.ms20-pop-2 { animation-delay: .1s; }
.ms20-pop-3 { animation-delay: .2s; }
.ms20-pop-4 { animation-delay: .3s; }
.ms20-mark { width: min(300px, 100%); aspect-ratio: 1; margin-inline: auto; display: grid; place-content: center; gap: .35rem; text-align: center; background: #0b1220; color: #b6ff3b; border: 4px solid #b6ff3b; box-shadow: 16px 16px 0 #b6ff3b; }
.ms20-mark-bolt { width: 48px; height: 72px; margin: 0 auto; background: #b6ff3b; clip-path: polygon(55% 0, 20% 48%, 45% 48%, 40% 100%, 80% 45%, 55% 45%); animation: ms-spark 1.8s ease-in-out infinite; }
.ms20-mark-label { font-family: "Barlow Condensed", sans-serif; font-size: 2.4rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ms20-mark-sub { font-family: "IBM Plex Mono", monospace; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: #eef2f6; }
.ms20-sec { padding: 3.25rem 1.5rem; }
.ms20-wrap { max-width: 960px; margin: 0 auto; }
.ms20-eyebrow { font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms20-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; line-height: 1.05; }
.ms20-sec p { margin: 0 0 1rem; line-height: 1.55; color: #3d4a5c; max-width: 58ch; }
.ms20-ink-band { background: #0b1220; color: #fff; }
.ms20-ink-band .ms20-eyebrow { color: #b6ff3b; }
.ms20-punches { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .65rem; }
.ms20-punches li { padding: .7rem 0; border-bottom: 1px solid rgb(238 242 246 / 15%); font-size: 1.05rem; }
.ms20-punches strong { color: #b6ff3b; }
.ms20-sec-a { background: #fff; }
.ms20-sec-b { background: #f7ffe8; }
.ms20-sec-d { background: #fff; border-top: 3px solid #b6ff3b; }
.ms20-trial { padding: 3.5rem 1.5rem; text-align: center; background: #b6ff3b; color: #0b1220; }
.ms20-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; }
.ms20-trial p { margin: 0 auto 1.25rem; max-width: 46ch; font-weight: 600; }
.ms20-trial .ms20-cta { justify-content: center; }
.ms20-trial .ms20-btn-primary { background: #0b1220; color: #b6ff3b; border-color: #0b1220; }
.ms20-footer { color: #4a5568; }
@media (min-width: 900px) { .ms20-hero-inner { grid-template-columns: 1.2fr .8fr; } }

/* ── ms21 Bay blast ── */
.ms21-body { background: linear-gradient(180deg,#e8f7ff 0%,#ffffff 40%,#f2ffe0 100%); color: #0b1220; }
.ms21-nav { background: rgb(255 255 255 / 92%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms21-nav-brand span, .ms21-brand span { color: #6a9a00; }
.ms21-btn { display: inline-block; text-decoration: none; font-weight: 800; padding: .8rem 1.2rem; border-radius: 8px; border: 1px solid transparent; font-size: 1rem; }
.ms21-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms21-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms21-hero { position: relative; min-height: min(88vh, 720px); padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; display: flex; align-items: center; }
.ms21-hero-bg { position: absolute; inset: 0; background: linear-gradient(145deg,#d9f0ff,#fff 45%,#e8ff9a); pointer-events: none; }
.ms21-wash { position: absolute; inset: -10%; background: radial-gradient(ellipse 50% 45% at 75% 35%,rgb(56 189 248 / 35%),transparent 60%),radial-gradient(ellipse 40% 40% at 20% 70%,rgb(182 255 59 / 40%),transparent 55%); }
.ms21-blast { position: absolute; top: 20%; right: 8%; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle,#fff 0%,#b6ff3b 40%,transparent 70%); animation: ms-blast 2.6s ease-in-out infinite; }
.ms21-blast-2 { top: 45%; right: 22%; width: 140px; height: 140px; animation-delay: .8s; background: radial-gradient(circle,#fff 0%,rgb(56 189 248 / 70%) 40%,transparent 70%); }
.ms21-hero-inner { position: relative; max-width: 1120px; margin: 0 auto; width: 100%; display: grid; gap: 2rem; align-items: center; }
.ms21-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(3rem, 8vw, 4.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .2rem; line-height: .92; }
.ms21-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.6rem, 7vw, 4.2rem); line-height: .98; margin: 0 0 .75rem; max-width: 12ch; font-weight: 800; }
.ms21-lead { font-size: 1.15rem; line-height: 1.5; color: #2a3645; max-width: 36ch; margin: 0 0 1.35rem; }
.ms21-cta { display: flex; flex-wrap: wrap; gap: .7rem; }
.ms21-go { opacity: 0; animation: ms-rise .7s ease forwards; }
.ms21-go-2 { animation-delay: .1s; }
.ms21-go-3 { animation-delay: .2s; }
.ms21-go-4 { animation-delay: .3s; }
.ms21-orb { position: relative; width: min(320px, 100%); aspect-ratio: 1; margin-inline: auto; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg,#ffffff,#c8e8ff 50%,#b6ff3b); box-shadow: 0 24px 60px rgb(56 189 248 / 30%); }
.ms21-orb-ring { position: absolute; inset: 10%; border: 2px dashed rgb(11 18 32 / 20%); border-radius: 50%; animation: ms-burst-pulse 3s ease-in-out infinite; }
.ms21-orb-core { font-family: "Barlow Condensed", sans-serif; font-size: 3.4rem; font-weight: 800; letter-spacing: .14em; color: #0b1220; z-index: 1; }
.ms21-orb-meta { position: absolute; bottom: 18%; font-family: "IBM Plex Mono", monospace; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: #2a3645; z-index: 1; }
.ms21-sec { padding: 3.25rem 1.5rem; }
.ms21-wrap { max-width: 960px; margin: 0 auto; }
.ms21-eyebrow { font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms21-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; line-height: 1.05; }
.ms21-sec p { margin: 0 0 1rem; line-height: 1.55; color: #3d4a5c; max-width: 58ch; }
.ms21-bay-band { background: linear-gradient(90deg,#38bdf8,#b6ff3b); color: #0b1220; }
.ms21-bay-band .ms21-eyebrow { color: #0b1220; }
.ms21-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms21-chips span { background: #0b1220; color: #eef2f6; padding: .45rem .75rem; border-radius: 6px; font-size: .88rem; font-weight: 700; }
.ms21-sec-a { background: #fff; }
.ms21-sec-b { background: rgb(56 189 248 / 10%); }
.ms21-sec-d { background: #f2ffe0; }
.ms21-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms21-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; }
.ms21-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms21-trial .ms21-cta { justify-content: center; }
.ms21-footer { color: #4a5568; }
@media (min-width: 900px) { .ms21-hero-inner { grid-template-columns: 1.15fr .85fr; } }

/* ── ms22 Kinetic counter ── */
.ms22-body { background: #ffffff; color: #0b1220; }
.ms22-nav { background: rgb(255 255 255 / 94%); border-bottom: 1px solid rgb(11 18 32 / 8%); color: #0b1220; }
.ms22-nav-brand span, .ms22-brand span { color: #6a9a00; }
.ms22-btn { display: inline-block; text-decoration: none; font-weight: 800; padding: .8rem 1.2rem; border-radius: 8px; border: 1px solid transparent; font-size: 1rem; }
.ms22-btn-primary { background: #b6ff3b; color: #0b1220; border-color: #9fe01f; }
.ms22-btn-ghost { background: #fff; color: #0b1220; border-color: rgb(11 18 32 / 16%); }
.ms22-hero { position: relative; min-height: min(88vh, 720px); padding: 4.5rem 1.5rem 3.5rem; overflow: hidden; display: flex; align-items: center; }
.ms22-hero-bg { position: absolute; inset: 0; background: #fff; pointer-events: none; overflow: hidden; }
.ms22-stripe { position: absolute; height: 28%; width: 140%; left: -20%; background: repeating-linear-gradient(115deg, transparent 0 22px, rgb(182 255 59 / 35%) 22px 34px, rgb(56 189 248 / 22%) 34px 46px); animation: ms-stripe-run 8s linear infinite; opacity: .85; }
.ms22-stripe-a { top: 0; }
.ms22-stripe-b { top: 28%; animation-duration: 10s; animation-direction: reverse; opacity: .55; }
.ms22-stripe-c { top: 52%; animation-duration: 7s; }
.ms22-stripe-d { top: 76%; animation-duration: 11s; animation-direction: reverse; opacity: .4; }
.ms22-hero-inner { position: relative; max-width: 1120px; margin: 0 auto; width: 100%; display: grid; gap: 2rem; align-items: center; }
.ms22-brand { font-family: "Barlow Condensed", sans-serif; font-size: clamp(3rem, 8vw, 4.6rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .2rem; line-height: .92; }
.ms22-hero h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.6rem, 7vw, 4.2rem); line-height: .98; margin: 0 0 .75rem; max-width: 12ch; font-weight: 800; }
.ms22-lead { font-size: 1.15rem; line-height: 1.5; color: #2a3645; max-width: 36ch; margin: 0 0 1.35rem; background: rgb(255 255 255 / 85%); padding: .15rem 0; }
.ms22-cta { display: flex; flex-wrap: wrap; gap: .7rem; }
.ms22-slide { opacity: 0; animation: ms-slide-in .65s ease forwards; }
.ms22-slide-2 { animation-delay: .1s; }
.ms22-slide-3 { animation-delay: .2s; }
.ms22-slide-4 { animation-delay: .3s; }
.ms22-ticker { padding: 1.75rem; min-height: 240px; display: flex; flex-direction: column; justify-content: flex-end; gap: .45rem; background: #0b1220; color: #eef2f6; border-radius: 12px; box-shadow: 12px 12px 0 #b6ff3b; }
.ms22-ticker-mark { font-family: "IBM Plex Mono", monospace; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: #b6ff3b; }
.ms22-ticker-title { font-family: "Barlow Condensed", sans-serif; font-size: 2.5rem; font-weight: 800; }
.ms22-ticker-line { display: block; height: 4px; width: 100%; background: #b6ff3b; animation: ms-ticker-line 1.1s ease forwards .4s; transform: scaleX(0); }
.ms22-ticker-meta { font-weight: 600; color: #9aa7b5; }
.ms22-sec { padding: 3.25rem 1.5rem; }
.ms22-wrap { max-width: 960px; margin: 0 auto; }
.ms22-eyebrow { font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #6a9a00; margin: 0 0 .4rem; }
.ms22-sec h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; line-height: 1.05; }
.ms22-sec p { margin: 0 0 1rem; line-height: 1.55; color: #3d4a5c; max-width: 58ch; }
.ms22-motion-band { background: repeating-linear-gradient(115deg,#b6ff3b 0 24px,#d7f56a 24px 48px); color: #0b1220; }
.ms22-motion-band .ms22-eyebrow { color: #0b1220; }
.ms22-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ms22-chips span { background: #0b1220; color: #eef2f6; padding: .45rem .75rem; border-radius: 6px; font-size: .88rem; font-weight: 700; }
.ms22-sec-a { background: #fff; }
.ms22-sec-b { background: #f0f7ff; }
.ms22-sec-d { background: #f7ffe8; }
.ms22-trial { padding: 3.5rem 1.5rem; text-align: center; background: #0b1220; color: #eef2f6; }
.ms22-trial h2 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(1.9rem, 4vw, 2.6rem); margin: 0 0 .6rem; }
.ms22-trial p { color: #9aa7b5; margin: 0 auto 1.25rem; max-width: 46ch; }
.ms22-trial .ms22-cta { justify-content: center; }
.ms22-footer { color: #4a5568; }
@media (min-width: 900px) { .ms22-hero-inner { grid-template-columns: 1.15fr .85fr; } }

@media (prefers-reduced-motion: reduce) {
  .ms16-rise, .ms17-in, .ms18-snap, .ms19-up, .ms20-pop, .ms21-go, .ms22-slide,
  .ms16-beam, .ms16-burst-ring, .ms17-streak, .ms17-sun, .ms18-pulse,
  .ms19-flood, .ms20-slash, .ms20-spark, .ms20-mark-bolt, .ms21-blast, .ms21-orb-ring,
  .ms22-stripe, .ms22-ticker-line {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .ms22-ticker-line { transform: scaleX(1) !important; }
}