:root,
html[data-theme="light"] {
    --m-bg: #eef3f7;
    --m-bg-warm: #f4ebe0;
    --m-ink: #142033;
    --m-muted: #5d6b7c;
    --m-brand: #1f4d6e;
    --m-brand-deep: #163a54;
    --m-brand-soft: #d7e6ef;
    --m-accent: #c87941;
    --m-card: #fff;
    --m-line: #e4ebf1;
    --m-ok: #1f7a4d;
    --m-danger: #b42318;
    --m-shadow: 0 18px 48px rgba(20, 32, 51, 0.11);
    --m-font: "Onest", "Segoe UI", sans-serif;
    --m-hero: linear-gradient(145deg, #102d42 0%, #1f4d6e 56%, #285f7d 100%);
    --m-hero-card: #fff;
    --m-toggle-bg: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] {
    --m-bg: #0f1720;
    --m-bg-warm: #1a2836;
    --m-ink: #e8eef4;
    --m-muted: #9aabbc;
    --m-brand: #7eb7d0;
    --m-brand-deep: #b7d7e6;
    --m-brand-soft: #1c3344;
    --m-accent: #d49a63;
    --m-card: #182430;
    --m-line: #2a3a4a;
    --m-ok: #6dcca0;
    --m-danger: #ff8d84;
    --m-shadow: 0 18px 48px rgba(0, 0, 0, 0.3);
    --m-hero: linear-gradient(145deg, #0c1822 0%, #132836 56%, #173b50 100%);
    --m-hero-card: #1c2a38;
    --m-toggle-bg: rgba(255, 255, 255, 0.1);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body.marketing-page {
    margin: 0;
    color: var(--m-ink);
    font-family: var(--m-font);
    background:
        radial-gradient(circle at 12% 0%, var(--m-bg-warm), transparent 34rem),
        var(--m-bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    transition: background 180ms ease, color 180ms ease;
}

.m-container {
    width: min(1180px, calc(100% - 2rem));
    margin-inline: auto;
}

.m-nav {
    position: absolute;
    inset: 0 0 auto;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-block: 1rem;
}

.m-logo,
.m-logo:hover {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    text-decoration: none;
}

.logo-mark {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
}

.logo-mark .logo-img {
    display: block;
    width: auto;
    height: 2.35rem;
}

.logo-dom-label {
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
    color: inherit;
    white-space: nowrap;
}

.m-nav .logo-dom-label {
    color: #fff;
}

.logo-mark .logo-img--for-dark {
    display: none;
}

html[data-theme="dark"] .logo-mark .logo-img--for-light {
    display: none;
}

html[data-theme="dark"] .logo-mark .logo-img--for-dark {
    display: block;
}

.m-nav .logo-img--for-light {
    display: none;
}

.m-nav .logo-img--for-dark {
    display: block;
}

.logo-mark--sm .logo-img {
    height: 2.15rem;
}

.logo-mark--md .logo-img {
    height: 2.55rem;
}

.m-nav-actions {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.m-link {
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.92rem;
    font-weight: 600;
    text-decoration: none;
}

.m-link:hover {
    color: #fff;
    text-decoration: none;
}

.theme-toggle {
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 12px;
    background: var(--m-toggle-bg);
    color: #fff;
    font-size: 1.05rem;
    line-height: 1;
    cursor: pointer;
}

.m-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.8rem;
    padding: 0.72rem 1.2rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font: inherit;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.m-btn:hover {
    transform: translateY(-1px);
    text-decoration: none;
}

.m-btn-primary {
    color: #163a54;
    background: #fff;
    box-shadow: 0 12px 30px rgba(5, 18, 28, 0.2);
}

.m-btn-primary:hover {
    color: #102d42;
    box-shadow: 0 16px 34px rgba(5, 18, 28, 0.27);
}

.m-btn-ghost {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.12);
}

.m-btn-ghost:hover {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.55);
    background: rgba(255, 255, 255, 0.13);
}

.m-hero {
    position: relative;
    min-height: 44rem;
    overflow: hidden;
    color: #fff;
    background: var(--m-hero);
}

.m-hero-visual {
    position: absolute;
    inset: 0;
    opacity: 0.9;
    background:
        radial-gradient(circle at 84% 18%, rgba(200, 121, 65, 0.24), transparent 28rem),
        radial-gradient(circle at 8% 84%, rgba(126, 183, 208, 0.15), transparent 24rem),
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: auto, auto, 48px 48px, 48px 48px;
    transform: scale(1.04);
    will-change: transform;
}

.m-hero-grain {
    position: absolute;
    inset: 0;
    opacity: 0.12;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    mix-blend-mode: soft-light;
}

.m-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(30rem, 0.98fr);
    gap: clamp(2.5rem, 6vw, 5.5rem);
    align-items: center;
    padding-block: 8.5rem 5.5rem;
}

.m-hero-content {
    animation: m-rise 700ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.m-hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0 0 1.2rem;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.m-hero-kicker::before {
    width: 1.8rem;
    height: 1px;
    background: var(--m-accent);
    content: "";
}

.m-hero-title {
    max-width: 14ch;
    margin: 0 0 1.25rem;
    font-size: clamp(3rem, 5.7vw, 5rem);
    font-weight: 700;
    letter-spacing: -0.055em;
    line-height: 0.98;
}

.m-hero-title span {
    color: #f3c58a;
}

.m-hero-copy {
    max-width: 35rem;
    margin: 0 0 1.7rem;
    color: rgba(255, 255, 255, 0.86);
    font-size: clamp(1.05rem, 1.6vw, 1.18rem);
    font-weight: 400;
    line-height: 1.65;
}

.m-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
}

.m-hero-points {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem 1.2rem;
    margin: 1.4rem 0 0;
    padding: 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.84rem;
    font-weight: 600;
    list-style: none;
}

.m-hero-points li {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.m-hero-points li::before {
    width: 0.38rem;
    height: 0.38rem;
    border-radius: 50%;
    background: #f3c58a;
    content: "";
}

.m-dashboard {
    padding: 1.05rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 24px;
    color: var(--m-ink);
    background: var(--m-hero-card);
    box-shadow: 0 34px 80px rgba(3, 13, 21, 0.32);
    animation: m-rise 700ms 100ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

html[data-theme="dark"] .m-dashboard {
    border-color: rgba(126, 183, 208, 0.32);
    box-shadow: 0 34px 80px rgba(0, 0, 0, 0.48);
}

.m-dashboard-head,
.m-dashboard-card-head,
.m-issue-preview-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.m-dashboard-head {
    padding: 0.2rem 0.15rem 0.9rem;
}

.m-dashboard-head > div {
    display: grid;
    gap: 0.2rem;
}

.m-dashboard-label,
.m-feature-label {
    color: var(--m-muted);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.m-dashboard-chip,
.m-status {
    padding: 0.3rem 0.6rem;
    border-radius: 999px;
    color: var(--m-brand-deep);
    background: var(--m-brand-soft);
    font-size: 0.72rem;
    font-weight: 700;
}

.m-dashboard-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
    margin-bottom: 0.55rem;
}

.m-dashboard-metric,
.m-dashboard-card {
    border: 1px solid var(--m-line);
    border-radius: 16px;
    background: color-mix(in srgb, var(--m-card) 90%, var(--m-brand-soft));
}

.m-dashboard-metric {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
    padding: 0.75rem;
}

.m-dashboard-metric span,
.m-dashboard-metric small,
.m-dashboard-issue small {
    color: var(--m-muted);
    font-size: 0.68rem;
}

.m-dashboard-metric strong {
    overflow: hidden;
    font-size: 1.25rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.m-dashboard-metric--alert {
    border-color: color-mix(in srgb, var(--m-danger) 30%, var(--m-line));
}

.m-dashboard-metric--alert strong {
    color: var(--m-danger);
}

.m-dashboard-card {
    margin-top: 0.55rem;
    padding: 0.8rem 0.85rem;
}

.m-dashboard-card-head {
    align-items: baseline;
    margin-bottom: 0.65rem;
    font-size: 0.79rem;
}

.m-dashboard-card-head span {
    color: var(--m-brand);
    font-size: 0.7rem;
    font-weight: 700;
}

.m-progress {
    height: 0.52rem;
    overflow: hidden;
    border-radius: 999px;
    background: var(--m-line);
}

.m-progress span {
    display: block;
    width: 84%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--m-brand), #4b8ba8);
}

.m-dashboard-legend {
    display: flex;
    gap: 1rem;
    margin-top: 0.55rem;
    color: var(--m-muted);
    font-size: 0.68rem;
}

.m-dot {
    display: inline-block;
    width: 0.45rem;
    height: 0.45rem;
    margin-right: 0.25rem;
    border-radius: 50%;
}

.m-dot--ok {
    background: var(--m-ok);
}

.m-dot--warn {
    background: var(--m-danger);
}

.m-dashboard-issue {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 0.6rem;
    align-items: center;
    padding: 0.55rem 0;
    border-top: 1px solid var(--m-line);
}

.m-dashboard-issue > div {
    display: grid;
    gap: 0.08rem;
}

.m-dashboard-issue strong {
    font-size: 0.76rem;
}

.m-dashboard-time {
    color: var(--m-muted);
    font-size: 0.65rem;
}

.m-issue-mark {
    width: 0.62rem;
    height: 0.62rem;
    border: 2px solid var(--m-accent);
    border-radius: 50%;
}

.m-issue-mark--progress {
    border-color: var(--m-brand);
    background: var(--m-brand);
}

.m-summary {
    position: relative;
    z-index: 2;
    border-bottom: 1px solid var(--m-line);
    background: var(--m-card);
}

.m-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.m-summary-grid > div {
    display: grid;
    gap: 0.2rem;
    padding: 1.35rem 1.2rem;
    border-right: 1px solid var(--m-line);
}

.m-summary-grid > div:last-child {
    border-right: 0;
}

.m-summary-grid strong {
    font-size: 0.92rem;
}

.m-summary-grid span {
    color: var(--m-muted);
    font-size: 0.78rem;
}

.m-section {
    padding: clamp(4.5rem, 8vw, 7rem) 0;
}

.m-section-alt {
    border-block: 1px solid var(--m-line);
    background: color-mix(in srgb, var(--m-card) 45%, var(--m-bg));
}

.m-section-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.78fr);
    gap: 2.5rem;
    align-items: end;
}

.m-kicker {
    display: inline-block;
    margin-bottom: 0.85rem;
    color: var(--m-brand);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.m-title {
    max-width: 17ch;
    margin: 0;
    font-size: clamp(2.15rem, 4vw, 3.6rem);
    font-weight: 700;
    letter-spacing: -0.045em;
    line-height: 1.03;
}

.m-lead {
    max-width: 39rem;
    margin: 0;
    color: var(--m-muted);
    font-size: 1.05rem;
    font-weight: 400;
    line-height: 1.7;
}

.m-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
    margin-top: 2.7rem;
}

.m-feature-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1.35rem;
    border: 1px solid var(--m-line);
    border-radius: 18px;
    background: var(--m-card);
    box-shadow: 0 8px 24px rgba(20, 32, 51, 0.05);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.m-feature-item:hover {
    border-color: color-mix(in srgb, var(--m-brand) 35%, var(--m-line));
    box-shadow: var(--m-shadow);
    transform: translateY(-3px);
}

.m-icon {
    position: relative;
    width: 2.7rem;
    height: 2.7rem;
    margin-bottom: 1.35rem;
    border-radius: 12px;
    background: var(--m-brand-soft);
}

.m-icon::before {
    position: absolute;
    inset: 0.7rem;
    background: var(--m-brand);
    content: "";
    -webkit-mask: var(--m-icon) no-repeat center / contain;
    mask: var(--m-icon) no-repeat center / contain;
}

.m-icon[data-icon="cash"] {
    --m-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f4d6e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='6' width='19' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3Cpath d='M6 12h.01M18 12h.01'/%3E%3C/svg%3E");
}

.m-icon[data-icon="issue"] {
    --m-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f4d6e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 9v4M12 17h.01M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3C/svg%3E");
}

.m-icon[data-icon="megaphone"] {
    --m-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f4d6e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 11 18-5v12L3 13v-2zM11.6 16.8a3.5 3.5 0 0 1-6.3 1.7L5 16'/%3E%3C/svg%3E");
}

.m-icon[data-icon="unit"] {
    --m-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f4d6e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V8l8-5 8 5v13M9 21v-8h6v8'/%3E%3C/svg%3E");
}

.m-icon[data-icon="people"] {
    --m-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f4d6e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='3.5'/%3E%3Cpath d='M22 21v-2a3.5 3.5 0 0 0-2.5-3.35M16.5 3.6a3.5 3.5 0 0 1 0 6.8'/%3E%3C/svg%3E");
}

.m-icon[data-icon="key"] {
    --m-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f4d6e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='15' r='4'/%3E%3Cpath d='M11.5 12.5 20 4M16.5 7.5 19 10'/%3E%3C/svg%3E");
}

.m-feature-label {
    margin-bottom: 0.55rem;
    color: var(--m-brand);
}

.m-feature-item h3,
.m-audience-item h3,
.m-process-item h3,
.m-issue-preview h3 {
    margin: 0 0 0.5rem;
    font-size: 1.12rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.m-feature-item p,
.m-audience-item p,
.m-process-item p,
.m-issue-preview > p {
    margin: 0;
    color: var(--m-muted);
    font-size: 0.94rem;
    line-height: 1.6;
}

.m-audience-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
    margin-top: 2.7rem;
}

.m-audience-item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1rem;
    min-height: 11rem;
    padding: 1.4rem;
    border: 1px solid var(--m-line);
    border-radius: 18px;
    background: var(--m-card);
}

.m-audience-number {
    color: var(--m-accent);
    font-size: 0.75rem;
    font-weight: 800;
}

.m-split {
    display: grid;
    grid-template-columns: minmax(0, 0.88fr) minmax(25rem, 0.72fr);
    gap: clamp(3rem, 8vw, 7rem);
    align-items: center;
}

.m-process-grid {
    display: grid;
    gap: 0;
    margin-top: 2rem;
}

.m-process-item {
    display: grid;
    grid-template-columns: 2.3rem 1fr;
    gap: 0.8rem;
    padding: 1rem 0;
    border-bottom: 1px solid var(--m-line);
}

.m-process-item > span {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 10px;
    color: var(--m-brand);
    background: var(--m-brand-soft);
    font-size: 0.75rem;
    font-weight: 800;
}

.m-issue-preview {
    padding: clamp(1.4rem, 3vw, 2rem);
    border: 1px solid var(--m-line);
    border-radius: 24px;
    background: var(--m-card);
    box-shadow: var(--m-shadow);
}

.m-issue-preview-head {
    align-items: center;
}

.m-issue-preview-head > div {
    display: grid;
    gap: 0.35rem;
}

.m-issue-preview-head h3 {
    font-size: 1.25rem;
}

.m-status {
    color: var(--m-accent);
    background: color-mix(in srgb, var(--m-accent) 14%, var(--m-card));
}

.m-issue-preview > p {
    margin-top: 1rem;
}

.m-timeline {
    display: grid;
    gap: 0;
    margin: 1.5rem 0 0;
    padding: 0;
    list-style: none;
}

.m-timeline li {
    position: relative;
    display: grid;
    gap: 0.16rem;
    min-height: 4rem;
    padding: 0 0 1.2rem 2rem;
}

.m-timeline li::before {
    position: absolute;
    top: 0.22rem;
    left: 0.15rem;
    width: 0.72rem;
    height: 0.72rem;
    border: 2px solid var(--m-line);
    border-radius: 50%;
    background: var(--m-card);
    content: "";
}

.m-timeline li::after {
    position: absolute;
    top: 1.05rem;
    bottom: 0;
    left: 0.53rem;
    width: 1px;
    background: var(--m-line);
    content: "";
}

.m-timeline li:last-child::after {
    display: none;
}

.m-timeline .is-done::before {
    border-color: var(--m-ok);
    background: var(--m-ok);
    box-shadow: inset 0 0 0 2px var(--m-card);
}

.m-timeline .is-current::before {
    border-color: var(--m-accent);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--m-accent) 16%, transparent);
}

.m-timeline strong {
    font-size: 0.9rem;
}

.m-timeline span {
    color: var(--m-muted);
    font-size: 0.78rem;
}

.m-cta {
    position: relative;
    overflow: hidden;
    padding: clamp(4rem, 8vw, 6rem) 0;
    color: #fff;
}

.m-cta-bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 82% 18%, rgba(200, 121, 65, 0.3), transparent 30rem),
        var(--m-hero);
}

.m-cta-bg::after {
    position: absolute;
    inset: 0;
    opacity: 0.7;
    background:
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 48px 48px;
    content: "";
}

.m-cta-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.m-cta-kicker {
    margin-bottom: 0.8rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.m-cta-title {
    margin: 0 0 0.7rem;
    font-size: clamp(2.3rem, 5vw, 4rem);
    font-weight: 700;
    letter-spacing: -0.045em;
    line-height: 1;
}

.m-cta-text {
    max-width: 35rem;
    margin: 0 0 1.4rem;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1rem;
    line-height: 1.6;
}

.m-cta-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.65rem;
}

.m-btn-cta {
    min-width: 10rem;
    color: #163a54;
    background: #fff;
}

.m-btn-cta-ghost {
    min-width: 10rem;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.34);
    background: rgba(255, 255, 255, 0.08);
}

.m-btn-cta-ghost:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
}

.m-footer {
    padding: 1.3rem 0 1.6rem;
    border-top: 1px solid var(--m-line);
    color: var(--m-muted);
    background: var(--m-card);
    font-size: 0.88rem;
}

.m-footer-row,
.m-footer-actions {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.m-footer-row {
    justify-content: space-between;
}

.m-footer .theme-toggle {
    color: var(--m-brand);
    border-color: var(--m-line);
    background: var(--m-bg);
}

.m-footer a {
    color: var(--m-brand);
    font-weight: 700;
    text-decoration: none;
}

.m-footer a:hover {
    text-decoration: underline;
}

[data-reveal] {
    transition: opacity 650ms cubic-bezier(0.22, 1, 0.36, 1), transform 650ms cubic-bezier(0.22, 1, 0.36, 1);
}

.motion-ready [data-reveal] {
    opacity: 0;
    transform: translateY(20px);
}

[data-reveal].is-visible {
    opacity: 1;
    transform: none;
}

:where(a, button):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--m-accent) 72%, #fff);
    outline-offset: 3px;
}

@keyframes m-rise {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 1020px) {
    .m-hero-grid {
        grid-template-columns: 1fr;
        max-width: 48rem;
    }

    .m-hero-content {
        max-width: 42rem;
    }

    .m-dashboard {
        max-width: 39rem;
    }

    .m-feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .m-audience-grid {
        grid-template-columns: 1fr;
    }

    .m-audience-item {
        min-height: 0;
    }
}

@media (max-width: 900px) {
    .m-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .m-summary-grid > div {
        padding: 1rem;
        border-bottom: 1px solid var(--m-line);
    }

    .m-summary-grid > div:nth-child(2) {
        border-right: 0;
    }

    .m-summary-grid > div:nth-child(n + 3) {
        border-bottom: 0;
    }
}

@media (max-width: 760px) {
    .m-nav-actions .m-link--section {
        display: none;
    }

    .m-hero-grid {
        padding-block: 6.5rem 3.5rem;
    }

    .m-hero-title {
        font-size: clamp(2.7rem, 13vw, 4rem);
    }

    .m-section-heading,
    .m-split {
        grid-template-columns: 1fr;
    }

    .m-section-heading {
        gap: 1.2rem;
    }

    .m-split {
        gap: 2.5rem;
    }
}

@media (max-width: 560px) {
    .m-container {
        width: min(100% - 1.25rem, 1180px);
    }

    .logo-mark--md .logo-img {
        height: 2.1rem;
    }

    .m-nav {
        gap: 0.5rem;
    }

    .m-nav-actions {
        gap: 0.45rem;
    }

    .m-nav .m-link {
        font-size: 0.82rem;
    }

    .m-nav .m-btn {
        min-height: 2.5rem;
        padding-inline: 0.8rem;
        font-size: 0.82rem;
    }

    .theme-toggle {
        width: 2.4rem;
        height: 2.4rem;
    }

    .m-hero-grid {
        gap: 1.75rem;
        padding-top: 5.8rem;
    }

    .m-hero-kicker {
        font-size: 0.68rem;
    }

    .m-hero-title {
        font-size: clamp(2.45rem, 13vw, 3.4rem);
    }

    .m-hero-copy {
        font-size: 1rem;
    }

    .m-cta-row,
    .m-cta-actions {
        width: 100%;
        gap: 0.9rem;
    }

    .m-cta-row .m-btn,
    .m-cta-actions .m-btn {
        flex: 1 1 100%;
    }

    .m-hero-points {
        display: none;
    }

    .m-dashboard {
        padding: 0.7rem;
        border-radius: 19px;
    }

    .m-dashboard-metrics {
        grid-template-columns: 1fr 1fr;
    }

    .m-dashboard-metric:last-child {
        grid-column: 1 / -1;
    }

    .m-dashboard-legend {
        display: grid;
        gap: 0.35rem;
    }

    .m-feature-grid {
        grid-template-columns: 1fr;
    }

    .m-title {
        font-size: clamp(2rem, 10vw, 2.8rem);
    }

    .m-footer-row {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 360px) {
    .m-nav .theme-toggle {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    [data-reveal] {
        opacity: 1;
        transform: none;
    }
}