.marketing-page {
    --mk-green-950: #122d1c;
    --mk-green-900: #1f4930;
    --mk-green-800: #315f40;
    --mk-green-700: #52775a;
    --mk-cream-100: #fffdf8;
    --mk-cream-200: #f8f3e9;
    --mk-cream-300: #eee5d4;
    --mk-gold-500: #c78c22;
    --mk-gold-600: #7a4b00;
    --mk-gold-200: #f4dfb2;
    --mk-sage-500: #55786d;
    --mk-coral-500: #a95848;
    --mk-blue-500: #416f9b;
    --mk-ink: #15261b;
    --mk-muted: #56645a;
    --mk-line: #d8d2c6;
    --mk-white: #ffffff;
    --mk-focus: #173e27;
    --mk-focus-halo: #ffffff;
    --mk-focus-inner-width: 3px;
    --mk-focus-outer-width: 6px;
    --mk-display-font: Georgia, "Times New Roman", serif;
    --mk-body-font: "Hanken Grotesk", Aptos, "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
    --mk-display-xl: clamp(3rem, 7vw, 6.5rem);
    --mk-display-lg: clamp(2.5rem, 5vw, 4.5rem);
    --mk-display-md: clamp(2rem, 3.5vw, 3.25rem);
    --mk-body-lg: 1.125rem;
    --mk-label: .75rem;
    --mk-content-max: 86.25rem;
    --mk-reading-max: 42rem;
    --mk-header-height: 5rem;
    --mk-section-space: clamp(4rem, 9vw, 8rem);
    --mk-stage-desktop: 44rem;
    --mk-stage-mobile: 15rem;
    --mk-stage-min-height: 36rem;
    --mk-icon-size: 3rem;
    --mk-mark-size: 2.75rem;
    --mk-device-bar: 2.75rem;
    --mk-stage-shadow: 0 2rem 5rem rgba(18, 45, 28, .2);
    --mk-card-shadow: 0 1rem 2.5rem rgba(18, 45, 28, .1);
    --mk-hairline: 1px;
    --mk-press-offset: 1px;
    color: var(--mk-ink);
    background: var(--mk-cream-100);
    font-family: var(--mk-body-font);
    overflow-x: clip;
}

.marketing-page h1,
.marketing-page h2,
.marketing-page h3 {
    color: inherit;
}

.marketing-page .skip-link {
    color: var(--mk-green-950);
    background: var(--mk-gold-200);
}

.marketing-page .mk-container {
    inline-size: min(100%, var(--mk-content-max));
    margin-inline: auto;
    padding-inline: clamp(var(--s5), 5vw, var(--s16));
}

.marketing-page .mk-header {
    position: relative;
    z-index: 20;
    min-block-size: var(--mk-header-height);
    color: var(--mk-green-900);
    background: var(--mk-white);
    border-block-end: var(--mk-hairline) solid var(--mk-cream-300);
}

.marketing-page .mk-header__inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--s8);
    inline-size: min(100%, var(--mk-content-max));
    min-block-size: var(--mk-header-height);
    margin-inline: auto;
    padding-inline: clamp(var(--s5), 5vw, var(--s16));
}

.marketing-page .mk-brand {
    display: inline-grid;
    align-content: center;
    gap: var(--s1);
    min-block-size: var(--target-min);
    color: var(--mk-green-900);
}

.marketing-page .mk-brand__wordmark {
    font-family: var(--mk-display-font);
    font-size: var(--type-h2);
    font-weight: 700;
    letter-spacing: -.04em;
    line-height: 1;
}

.marketing-page .mk-brand__mark {
    color: var(--mk-gold-500);
}

.marketing-page .mk-brand__tagline {
    color: var(--mk-muted);
    font-family: var(--mk-body-font);
    font-size: var(--mk-label);
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.2;
}

.marketing-page .mk-mini-mark {
    display: grid;
    place-items: center;
    inline-size: var(--mk-mark-size);
    aspect-ratio: 1;
    border-radius: var(--r-field);
    color: var(--mk-green-950);
    background: var(--mk-gold-500);
    box-shadow: inset 0 0 0 var(--mk-hairline) color-mix(in srgb, var(--mk-white) 30%, transparent);
    font-weight: 800;
}

.marketing-page .mk-navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--s8);
    color: var(--mk-muted);
    font-size: var(--type-small);
    font-weight: 700;
}

.marketing-page .mk-navigation a,
.marketing-page .mk-link-action,
.marketing-page .mk-footer__links a {
    display: inline-flex;
    align-items: center;
    min-block-size: var(--target-min);
    transition: color var(--motion-micro);
}

.marketing-page .mk-navigation a:hover,
.marketing-page .mk-navigation a:focus-visible,
.marketing-page .mk-link-action:hover,
.marketing-page .mk-link-action:focus-visible {
    color: var(--mk-gold-600);
}

.marketing-page .mk-header__actions,
.marketing-page .mk-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--s3);
}

.marketing-page .mk-link-action {
    padding-inline: var(--s3);
    color: var(--mk-green-900);
    font-weight: 700;
}

.marketing-page .mk-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-block-size: var(--target-min);
    padding: var(--s3) var(--s5);
    border: var(--mk-hairline) solid transparent;
    border-radius: var(--r-button);
    font-weight: 750;
    text-align: center;
    transition: color var(--motion-micro), background var(--motion-micro), border-color var(--motion-micro), box-shadow var(--motion-micro), transform var(--motion-micro);
}

.marketing-page .mk-button:hover {
    box-shadow: var(--mk-card-shadow);
}

.marketing-page .mk-button:active {
    transform: translateY(var(--mk-press-offset));
}

.marketing-page .mk-button--primary {
    color: var(--mk-white);
    background: linear-gradient(135deg, var(--mk-green-900), var(--mk-green-700));
}

.marketing-page .mk-button--primary:hover {
    background: var(--mk-green-800);
}

.marketing-page .mk-button--secondary {
    color: var(--mk-green-900);
    background: transparent;
    border-color: var(--mk-line);
}

.marketing-page .mk-button--secondary:hover {
    border-color: var(--mk-gold-500);
    background: var(--mk-white);
}

.marketing-page .mk-button--gold {
    color: var(--mk-green-950);
    background: var(--mk-gold-500);
}

.marketing-page .mk-button--gold:hover {
    background: var(--mk-gold-200);
}

.marketing-page .mk-button--green-secondary {
    color: var(--mk-white);
    border-color: color-mix(in srgb, var(--mk-white) 35%, transparent);
}

.marketing-page .mk-button--green-secondary:hover {
    background: color-mix(in srgb, var(--mk-white) 10%, transparent);
}

.marketing-page .mk-eyebrow,
.marketing-page .mk-product-label {
    margin: 0;
    color: var(--mk-gold-600);
    font-size: var(--mk-label);
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.marketing-page .mk-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--mk-gold-200) 58%, transparent), transparent 24rem),
        radial-gradient(circle at 8% 90%, color-mix(in srgb, var(--mk-green-700) 12%, transparent), transparent 28rem),
        linear-gradient(120deg, var(--mk-cream-100), var(--mk-cream-200));
}

.marketing-page .mk-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .35;
    background-image: linear-gradient(color-mix(in srgb, var(--mk-green-900) 7%, transparent) var(--mk-hairline), transparent var(--mk-hairline)), linear-gradient(90deg, color-mix(in srgb, var(--mk-green-900) 7%, transparent) var(--mk-hairline), transparent var(--mk-hairline));
    background-size: var(--s16) var(--s16);
    mask-image: linear-gradient(to right, transparent, var(--mk-green-950));
}

.marketing-page .mk-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, .76fr) minmax(0, 1.24fr);
    align-items: center;
    gap: clamp(var(--s8), 5vw, var(--s16));
    min-block-size: calc(100dvh - var(--mk-header-height));
    padding-block: var(--mk-section-space);
}

.marketing-page .mk-hero__copy {
    position: relative;
    z-index: 2;
}

.marketing-page .mk-hero h1 {
    max-inline-size: 11ch;
    margin: var(--s4) 0 var(--s6);
    color: var(--mk-green-900);
    font-family: var(--mk-display-font);
    font-size: var(--mk-display-xl);
    font-weight: 500;
    line-height: .88;
    letter-spacing: -.055em;
    text-wrap: balance;
}

.marketing-page .mk-hero h1 em,
.marketing-page .mk-capabilities h2 em {
    color: var(--mk-gold-600);
    font-weight: 500;
}

.marketing-page .mk-hero__lede {
    max-inline-size: 55ch;
    margin: 0;
    color: var(--mk-muted);
    font-size: var(--mk-body-lg);
    line-height: 1.7;
}

.marketing-page .mk-hero .mk-actions {
    margin-block-start: var(--s8);
}

.marketing-page .mk-hero__note {
    max-inline-size: 48ch;
    margin: var(--s5) 0 0;
    color: var(--mk-muted);
    font-size: var(--type-small);
}

.marketing-page .mk-product-stage {
    position: relative;
    min-inline-size: 0;
    min-block-size: var(--mk-stage-min-height);
}

.marketing-page .mk-stage-lines {
    position: absolute;
    inset: 0;
    inline-size: 100%;
    block-size: 100%;
    overflow: visible;
    fill: none;
    stroke: color-mix(in srgb, var(--mk-gold-500) 40%, transparent);
    stroke-width: var(--mk-hairline);
    stroke-dasharray: var(--s2) var(--s3);
}

.marketing-page .mk-desktop {
    position: absolute;
    inset: 0 0 auto auto;
    inline-size: min(100%, var(--mk-stage-desktop));
    overflow: hidden;
    border: var(--s2) solid var(--mk-green-900);
    border-radius: var(--r-panel);
    background: var(--mk-cream-100);
    box-shadow: var(--mk-stage-shadow);
    transform: rotate(1deg);
}

.marketing-page .mk-device-bar {
    display: flex;
    align-items: center;
    gap: var(--s2);
    block-size: var(--mk-device-bar);
    padding-inline: var(--s4);
    background: var(--mk-green-900);
}

.marketing-page .mk-device-bar span {
    inline-size: var(--s2);
    aspect-ratio: 1;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--mk-white) 55%, transparent);
}

.marketing-page .mk-device-bar span:first-child {
    background: var(--mk-gold-500);
}

.marketing-page .mk-desktop__shell {
    display: grid;
    grid-template-columns: var(--s16) minmax(0, 1fr);
    min-block-size: calc(var(--mk-stage-min-height) - var(--mk-device-bar));
}

.marketing-page .mk-desktop__rail {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--s5);
    padding-block: var(--s4);
    background: var(--mk-green-950);
}

.marketing-page .mk-desktop__rail .mk-mini-mark {
    inline-size: var(--s8);
    font-size: var(--type-small);
}

.marketing-page .mk-desktop__rail > span:not(.mk-mini-mark) {
    inline-size: var(--s6);
    block-size: var(--s2);
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--mk-white) 24%, transparent);
}

.marketing-page .mk-desktop__content {
    min-inline-size: 0;
    padding: var(--s6);
}

.marketing-page .mk-product-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--s4);
}

.marketing-page .mk-product-heading p,
.marketing-page .mk-product-heading h2 {
    margin: 0;
}

.marketing-page .mk-product-heading p {
    color: var(--mk-muted);
    font-size: var(--type-small);
}

.marketing-page .mk-product-heading h2 {
    margin-block-start: var(--s1);
    color: var(--mk-green-900);
    font-size: var(--type-h3);
}

.marketing-page .mk-product-status {
    flex: 0 0 auto;
    padding: var(--s2) var(--s3);
    border-radius: var(--r-pill);
    color: var(--mk-sage-500);
    background: color-mix(in srgb, var(--mk-sage-500) 12%, var(--mk-white));
    font-size: var(--mk-label);
    font-weight: 800;
}

.marketing-page .mk-record-banner {
    display: flex;
    align-items: center;
    gap: var(--s3);
    margin-block: var(--s5);
    padding: var(--s4);
    border-radius: var(--r-card);
    color: var(--mk-white);
    background: linear-gradient(120deg, var(--mk-green-950), var(--mk-green-700));
}

.marketing-page .mk-record-banner__mark {
    display: grid;
    place-items: center;
    inline-size: var(--mk-icon-size);
    aspect-ratio: 1;
    border-radius: var(--r-field);
    color: var(--mk-green-950);
    background: var(--mk-gold-500);
    font-size: var(--mk-label);
    font-weight: 800;
}

.marketing-page .mk-record-banner div {
    display: grid;
    gap: var(--s1);
}

.marketing-page .mk-record-banner span:last-child {
    color: var(--mk-cream-300);
    font-size: var(--mk-label);
}

.marketing-page .mk-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
    gap: var(--s4);
}

.marketing-page .mk-product-panel {
    min-inline-size: 0;
    padding: var(--s4);
    border: var(--mk-hairline) solid var(--mk-line);
    border-radius: var(--r-card);
    background: var(--mk-white);
}

.marketing-page .mk-product-panel--tint {
    background: var(--mk-cream-200);
}

.marketing-page .mk-product-panel h3 {
    margin: var(--s1) 0 var(--s3);
    color: var(--mk-green-900);
    font-size: var(--type-body);
}

.marketing-page .mk-activity-list,
.marketing-page .mk-record-list,
.marketing-page .mk-mobile__list,
.marketing-page .mk-palette-card ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.marketing-page .mk-activity-list li {
    display: grid;
    grid-template-columns: var(--s3) minmax(0, 1fr);
    gap: var(--s2);
    padding-block: var(--s3);
    border-block-start: var(--mk-hairline) solid var(--mk-line);
}

.marketing-page .mk-activity-list li > div,
.marketing-page .mk-mobile__student > div {
    display: grid;
    gap: var(--s1);
}

.marketing-page .mk-activity-list strong,
.marketing-page .mk-activity-list span,
.marketing-page .mk-record-list dt,
.marketing-page .mk-record-list dd {
    font-size: var(--mk-label);
}

.marketing-page .mk-activity-list span,
.marketing-page .mk-record-list dt {
    color: var(--mk-muted);
}

.marketing-page .mk-activity-dot {
    inline-size: var(--s2);
    aspect-ratio: 1;
    margin-block-start: var(--s1);
    border-radius: var(--r-pill);
}

.marketing-page .mk-activity-dot--gold { background: var(--mk-gold-500); }
.marketing-page .mk-activity-dot--sage { background: var(--mk-sage-500); }
.marketing-page .mk-activity-dot--blue { background: var(--mk-blue-500); }

.marketing-page .mk-record-list > div {
    display: flex;
    justify-content: space-between;
    gap: var(--s3);
    padding-block: var(--s3);
    border-block-start: var(--mk-hairline) solid var(--mk-line);
}

.marketing-page .mk-record-list dd {
    margin: 0;
    color: var(--mk-sage-500);
    font-weight: 800;
}

.marketing-page .mk-mobile {
    position: absolute;
    inset: auto auto 0 0;
    z-index: 3;
    inline-size: min(42%, var(--mk-stage-mobile));
    min-block-size: calc(var(--mk-stage-min-height) - var(--s10));
    padding: var(--s5) var(--s4);
    border: var(--s2) solid var(--mk-green-950);
    border-radius: var(--r-hero);
    color: var(--mk-ink);
    background: var(--mk-cream-100);
    box-shadow: var(--mk-stage-shadow);
    transform: rotate(-2deg);
}

.marketing-page .mk-mobile__speaker {
    inline-size: var(--s10);
    block-size: var(--s1);
    margin: 0 auto var(--s5);
    border-radius: var(--r-pill);
    background: var(--mk-green-900);
}

.marketing-page .mk-mobile__header {
    display: flex;
    align-items: center;
    gap: var(--s2);
    margin-block-end: var(--s8);
    color: var(--mk-muted);
    font-size: var(--mk-label);
    font-weight: 800;
}

.marketing-page .mk-mobile__header .mk-mini-mark {
    inline-size: var(--s8);
    font-size: var(--mk-label);
}

.marketing-page .mk-mobile h2 {
    margin: var(--s2) 0 var(--s5);
    color: var(--mk-green-900);
    font-family: var(--mk-display-font);
    font-size: var(--type-h2);
    font-weight: 500;
    line-height: 1.08;
}

.marketing-page .mk-mobile__student {
    display: flex;
    align-items: center;
    gap: var(--s3);
    padding: var(--s3);
    border-radius: var(--r-card);
    background: var(--mk-gold-200);
}

.marketing-page .mk-mobile__student > span {
    display: grid;
    place-items: center;
    inline-size: var(--mk-icon-size);
    aspect-ratio: 1;
    border-radius: var(--r-field);
    color: var(--mk-white);
    background: var(--mk-green-800);
    font-size: var(--mk-label);
    font-weight: 800;
}

.marketing-page .mk-mobile__student small {
    color: var(--mk-muted);
}

.marketing-page .mk-mobile__list {
    margin-block-start: var(--s4);
}

.marketing-page .mk-mobile__list li {
    display: grid;
    gap: var(--s1);
    padding-block: var(--s3);
    border-block-start: var(--mk-hairline) solid var(--mk-line);
    font-size: var(--mk-label);
}

.marketing-page .mk-mobile__list span {
    color: var(--mk-muted);
}

.marketing-page .mk-customization,
.marketing-page .mk-capabilities,
.marketing-page .mk-record-story,
.marketing-page .mk-trust,
.marketing-page .mk-launch,
.marketing-page .mk-final-cta {
    scroll-margin-block-start: var(--mk-header-height);
    padding-block: var(--mk-section-space);
}

.marketing-page .mk-customization {
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--mk-green-700) 8%, transparent), transparent 28%),
        var(--mk-gold-200);
}

.marketing-page .mk-customization__grid,
.marketing-page .mk-capabilities__grid,
.marketing-page .mk-launch__grid {
    display: grid;
    grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr);
    align-items: center;
    gap: clamp(var(--s8), 7vw, var(--s16));
}

.marketing-page .mk-section-copy h2,
.marketing-page .mk-section-heading h2,
.marketing-page .mk-trust__heading h2,
.marketing-page .mk-final-cta h2 {
    margin: var(--s3) 0 var(--s5);
    color: var(--mk-green-950);
    font-family: var(--mk-display-font);
    font-size: var(--mk-display-lg);
    font-weight: 500;
    line-height: .98;
    letter-spacing: -.04em;
}

.marketing-page .mk-section-copy > p:last-of-type,
.marketing-page .mk-section-heading > p:last-child,
.marketing-page .mk-final-cta p {
    max-inline-size: 60ch;
    color: var(--mk-muted);
    line-height: 1.7;
}

.marketing-page .mk-brand-proof {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--s4);
    margin: 0;
    padding: var(--s4);
    border: var(--mk-hairline) solid color-mix(in srgb, var(--mk-gold-600) 24%, transparent);
    border-radius: var(--r-hero);
    background: color-mix(in srgb, var(--mk-white) 72%, transparent);
    box-shadow: var(--mk-card-shadow);
    list-style: none;
}

.marketing-page .mk-brand-card,
.marketing-page .mk-palette-card,
.marketing-page .mk-site-card {
    position: relative;
    min-inline-size: 0;
    padding: var(--s5);
    border-radius: var(--r-card);
    background: var(--mk-white);
}

.marketing-page .mk-brand-card {
    display: grid;
    align-items: center;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--s3);
}

.marketing-page .mk-brand-card > div {
    display: grid;
    gap: var(--s1);
}

.marketing-page .mk-brand-card p,
.marketing-page .mk-site-card span {
    color: var(--mk-muted);
}

.marketing-page .mk-school-mark {
    display: grid;
    place-items: center;
    inline-size: var(--mk-icon-size);
    aspect-ratio: 1;
    border-radius: var(--r-pill);
    color: var(--mk-white);
    background: linear-gradient(145deg, var(--mk-green-800), var(--mk-green-950));
    font-family: var(--mk-display-font);
    font-size: var(--type-h3);
}

.marketing-page .mk-brand-card p,
.marketing-page .mk-palette-card p,
.marketing-page .mk-site-card p {
    margin: 0 0 var(--s3);
    color: var(--mk-muted);
    font-size: var(--mk-label);
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.marketing-page .mk-proof-connector {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-end: calc(var(--s3) * -1);
    z-index: 2;
    display: grid;
    place-items: center;
    inline-size: var(--s5);
    aspect-ratio: 1;
    border-radius: var(--r-pill);
    color: var(--mk-green-950);
    background: var(--mk-gold-200);
    font-weight: 800;
    transform: translate(50%, -50%);
}

.marketing-page .mk-palette-card ul {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s3);
}

.marketing-page .mk-palette-card li {
    display: flex;
    align-items: center;
    gap: var(--s2);
    font-size: var(--mk-label);
    font-weight: 700;
}

.marketing-page .mk-swatch {
    inline-size: var(--s5);
    aspect-ratio: 1;
    border: var(--mk-hairline) solid var(--mk-line);
    border-radius: var(--r-pill);
}

.marketing-page .mk-swatch--green { background: var(--mk-green-800); }
.marketing-page .mk-swatch--gold { background: var(--mk-gold-500); }
.marketing-page .mk-swatch--sage { background: var(--mk-sage-500); }

.marketing-page .mk-site-card {
    display: grid;
    gap: var(--s2);
}

.marketing-page .mk-capabilities {
    background: var(--mk-cream-100);
}

.marketing-page .mk-capabilities__grid {
    align-items: start;
}

.marketing-page .mk-section-copy--sticky {
    position: sticky;
    inset-block-start: calc(var(--mk-header-height) + var(--s8));
}

.marketing-page .mk-text-link {
    display: inline-flex;
    align-items: center;
    gap: var(--s2);
    min-block-size: var(--target-min);
    margin-block-start: var(--s4);
    color: var(--mk-gold-600);
    font-weight: 800;
}

.marketing-page .mk-text-link span {
    transition: transform var(--motion-micro);
}

.marketing-page .mk-text-link:hover span,
.marketing-page .mk-text-link:focus-visible span {
    transform: translateX(var(--s1));
}

.marketing-page .mk-capability-list {
    border-block-start: var(--mk-hairline) solid var(--mk-line);
}

.marketing-page .mk-capability-list article {
    display: grid;
    grid-template-columns: var(--mk-icon-size) minmax(0, 1fr);
    gap: var(--s5);
    padding-block: var(--s8);
    border-block-end: var(--mk-hairline) solid var(--mk-line);
}

.marketing-page .mk-capability-number {
    color: var(--mk-gold-600);
    font-family: var(--mk-display-font);
    font-size: var(--type-h3);
}

.marketing-page .mk-capability-list h3 {
    margin: 0 0 var(--s2);
    color: var(--mk-green-900);
    font-size: var(--type-h2);
}

.marketing-page .mk-capability-list p {
    max-inline-size: 58ch;
    margin: 0;
    color: var(--mk-muted);
    line-height: 1.65;
}

.marketing-page .mk-record-story {
    background: var(--mk-cream-200);
}

.marketing-page .mk-section-heading {
    max-inline-size: var(--mk-reading-max);
    margin-inline: auto;
    text-align: center;
}

.marketing-page .mk-role-composition {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(12rem, .72fr) repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: var(--s4);
    margin-block-start: var(--s12);
}

.marketing-page .mk-role {
    min-inline-size: 0;
    padding: var(--s5);
    border-block-start: var(--s1) solid var(--mk-blue-500);
    background: var(--mk-white);
    box-shadow: var(--mk-card-shadow);
}

.marketing-page .mk-role--teacher { border-block-start-color: var(--mk-sage-500); }
.marketing-page .mk-role--parent { border-block-start-color: var(--mk-gold-500); }
.marketing-page .mk-role--student { border-block-start-color: var(--mk-coral-500); }

.marketing-page .mk-role > span {
    color: var(--mk-muted);
    font-size: var(--mk-label);
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.marketing-page .mk-role h3 {
    margin: var(--s3) 0;
    color: var(--mk-green-900);
    font-size: var(--type-h3);
}

.marketing-page .mk-role p {
    margin: 0;
    color: var(--mk-muted);
    font-size: var(--type-small);
    line-height: 1.6;
}

.marketing-page .mk-record-core {
    display: grid;
    place-items: center;
    gap: var(--s2);
    min-block-size: calc(var(--mk-stage-mobile) - var(--s4));
    padding: var(--s5);
    border-radius: var(--r-pill);
    color: var(--mk-white);
    background: radial-gradient(circle at 30% 20%, var(--mk-green-700), var(--mk-green-950));
    box-shadow: var(--mk-stage-shadow);
    text-align: center;
}

.marketing-page .mk-record-core__mark {
    display: grid;
    place-items: center;
    inline-size: var(--mk-icon-size);
    aspect-ratio: 1;
    border-radius: var(--r-field);
    color: var(--mk-green-950);
    background: var(--mk-gold-500);
    font-weight: 800;
}

.marketing-page .mk-record-core small {
    color: var(--mk-cream-300);
}

.marketing-page .mk-green-sequence {
    color: var(--mk-white);
    background:
        radial-gradient(circle at 82% 22%, color-mix(in srgb, var(--mk-green-700) 65%, transparent), transparent 30rem),
        var(--mk-green-950);
}

.marketing-page .mk-trust,
.marketing-page .mk-launch {
    border-block-end: var(--mk-hairline) solid color-mix(in srgb, var(--mk-white) 16%, transparent);
}

.marketing-page .mk-trust__heading {
    display: grid;
    grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr);
    align-items: end;
    gap: var(--s8);
    margin-block-end: var(--s12);
}

.marketing-page .mk-trust__heading h2,
.marketing-page .mk-launch h2,
.marketing-page .mk-final-cta h2 {
    color: var(--mk-white);
}

.marketing-page .mk-trust .mk-eyebrow,
.marketing-page .mk-launch .mk-eyebrow,
.marketing-page .mk-final-cta .mk-eyebrow {
    color: var(--mk-gold-200);
}

.marketing-page .mk-trust__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--mk-hairline);
    background: color-mix(in srgb, var(--mk-white) 18%, transparent);
}

.marketing-page .mk-trust__grid article {
    padding: var(--s8);
    background: var(--mk-green-950);
}

.marketing-page .mk-trust__index {
    color: var(--mk-gold-500);
    font-family: var(--mk-display-font);
    font-size: var(--type-h3);
}

.marketing-page .mk-trust__grid h3 {
    margin: var(--s8) 0 var(--s3);
    color: var(--mk-white);
    font-size: var(--type-h2);
}

.marketing-page .mk-trust__grid p,
.marketing-page .mk-launch .mk-section-copy > p:last-of-type,
.marketing-page .mk-launch__steps p,
.marketing-page .mk-final-cta p {
    color: var(--mk-cream-300);
}

.marketing-page .mk-trust__grid p {
    max-inline-size: 55ch;
    margin: 0;
    line-height: 1.7;
}

.marketing-page .mk-launch__grid {
    align-items: start;
}

.marketing-page .mk-launch__steps {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    border-block-start: var(--mk-hairline) solid color-mix(in srgb, var(--mk-white) 18%, transparent);
}

.marketing-page .mk-launch__steps li {
    display: grid;
    grid-template-columns: var(--mk-icon-size) minmax(0, 1fr);
    gap: var(--s5);
    padding-block: var(--s6);
    border-block-end: var(--mk-hairline) solid color-mix(in srgb, var(--mk-white) 18%, transparent);
}

.marketing-page .mk-launch__steps li > span {
    color: var(--mk-gold-500);
    font-family: var(--mk-display-font);
    font-size: var(--type-h3);
}

.marketing-page .mk-launch__steps strong {
    color: var(--mk-white);
    font-size: var(--type-h3);
}

.marketing-page .mk-launch__steps p {
    margin: var(--s2) 0 0;
}

.marketing-page .mk-final-cta__inner {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, .6fr);
    align-items: end;
    gap: var(--s8);
}

.marketing-page .mk-final-cta .mk-actions {
    justify-content: flex-end;
}

.marketing-page .mk-footer {
    color: var(--mk-cream-300);
    background: var(--mk-green-950);
    border-block-start: var(--mk-hairline) solid color-mix(in srgb, var(--mk-white) 16%, transparent);
}

.marketing-page .mk-footer__inner {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--s8);
    inline-size: min(100%, var(--mk-content-max));
    margin-inline: auto;
    padding: var(--s12) clamp(var(--s5), 5vw, var(--s16));
}

.marketing-page .mk-brand--footer {
    color: var(--mk-white);
}

.marketing-page .mk-brand--footer .mk-brand__tagline {
    color: var(--mk-cream-300);
}

.marketing-page .mk-footer__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--s2) var(--s5); color: var(--mk-cream-300); font-size: var(--type-small); font-weight: 700;
}
.marketing-page .mk-footer__links a:hover, .marketing-page .mk-footer__links a:focus-visible { color: var(--mk-gold-200); }
.marketing-page .mk-legal-hero { padding-block: clamp(var(--s12), 9vw, var(--s16)); background: linear-gradient(135deg, var(--mk-cream-100), var(--mk-white)); border-block-end: var(--mk-hairline) solid var(--mk-cream-400); }
.marketing-page .mk-legal-hero h1 { max-inline-size: 12ch; margin: var(--s3) 0 var(--s4); color: var(--mk-green-900); font-family: var(--mk-serif); font-size: clamp(2.8rem, 7vw, 5.6rem); line-height: .96; }
.marketing-page .mk-legal-hero p:last-child { max-inline-size: 46rem; margin: 0; font-size: var(--type-lead); line-height: 1.65; }
.marketing-page .mk-legal, .marketing-page .mk-contact { padding-block: clamp(var(--s10), 8vw, var(--s16)); background: var(--mk-white); }
.marketing-page .mk-legal__grid { display:grid; grid-template-columns:minmax(13rem,.34fr) minmax(0,1fr); gap:clamp(var(--s8),7vw,var(--s16)); }
.marketing-page .mk-legal__grid aside { align-self:start; padding:var(--s6); background:var(--mk-cream-100); border:var(--mk-hairline) solid var(--mk-cream-400); border-radius:var(--mk-radius-lg); }
.marketing-page .mk-legal__grid aside p, .marketing-page .mk-legal__content p { line-height:1.7; }
.marketing-page .mk-legal__content { display:grid; gap:var(--s8); max-inline-size:52rem; }
.marketing-page .mk-legal__content section { padding-block-end:var(--s7); border-block-end:var(--mk-hairline) solid var(--mk-cream-400); }
.marketing-page .mk-legal__content h2 { margin:0 0 var(--s3); color:var(--mk-green-900); font-family:var(--mk-serif); font-size:clamp(1.6rem,3vw,2.25rem); }
.marketing-page .mk-contact-page { display:grid; grid-template-columns:minmax(15rem,.72fr) minmax(0,1.28fr); gap:clamp(var(--s8),7vw,var(--s16)); align-items:start; }
.marketing-page .mk-contact-intro { position:sticky; top:7rem; }
.marketing-page .mk-contact-intro h2 { margin:var(--s3) 0 var(--s4); color:var(--mk-green-900); font-family:var(--mk-serif); font-size:clamp(2rem,4vw,3.5rem); line-height:1; }
.marketing-page .mk-contact-intro > p { line-height:1.7; }
.marketing-page .mk-contact-note { margin-block:var(--s7); padding:var(--s5); background:var(--mk-cream-100); border-inline-start:3px solid var(--mk-gold-500); }
.marketing-page .mk-contact-note p { margin:var(--s2) 0 0; } .marketing-page .mk-contact-email { font-weight:700; }
.marketing-page .mk-contact-card { padding:clamp(var(--s6),5vw,var(--s10)); background:var(--mk-cream-100); border:var(--mk-hairline) solid var(--mk-cream-400); border-radius:var(--mk-radius-lg); box-shadow:0 1.5rem 4rem rgb(17 58 48 / .08); }
.marketing-page .mk-contact-form { display:grid; gap:var(--s5); } .marketing-page .mk-form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s5); }
.marketing-page .mk-contact-form label { display:grid; gap:var(--s2); color:var(--mk-green-900); font-weight:750; } .marketing-page .mk-contact-form label > span { color:var(--mk-muted); font-weight:500; }
.marketing-page .mk-contact-form input, .marketing-page .mk-contact-form select, .marketing-page .mk-contact-form textarea { inline-size:100%; padding:.9rem 1rem; color:var(--mk-green-900); background:var(--mk-white); border:var(--mk-hairline) solid var(--mk-cream-500); border-radius:.65rem; font:inherit; }
.marketing-page .mk-contact-form textarea { resize:vertical; min-block-size:11rem; } .marketing-page .mk-contact-form input:focus, .marketing-page .mk-contact-form select:focus, .marketing-page .mk-contact-form textarea:focus { outline:3px solid rgb(174 139 62 / .24); border-color:var(--mk-gold-700); }
.marketing-page .mk-contact-form small { color:#8b2d2d; font-weight:650; } .marketing-page .mk-contact-hp { position:absolute; inline-size:1px; block-size:1px; overflow:hidden; clip-path:inset(50%); }
.marketing-page .mk-contact-submit { display:flex; gap:var(--s5); align-items:center; justify-content:space-between; padding-block-start:var(--s3); } .marketing-page .mk-contact-submit p { max-inline-size:30rem; margin:0; color:var(--mk-muted); font-size:var(--type-small); line-height:1.5; }
.marketing-page .mk-contact-success, .marketing-page .mk-contact-error { margin-block-end:var(--s5); padding:var(--s4) var(--s5); border-radius:.65rem; } .marketing-page .mk-contact-success { background:#e8f3ed; color:var(--mk-green-900); } .marketing-page .mk-contact-error { background:#fae9e7; color:#76251f; }
@media (max-width:48rem) { .marketing-page .mk-legal__grid, .marketing-page .mk-contact-page, .marketing-page .mk-form-row { grid-template-columns:minmax(0,1fr); } .marketing-page .mk-contact-intro { position:static; } .marketing-page .mk-contact-submit { align-items:stretch; flex-direction:column; } .marketing-page .mk-legal-hero { padding-block:var(--s10); } }
@media (max-width: 64rem) {
    .marketing-page .mk-header__inner { gap: var(--s4); }
    .marketing-page .mk-navigation { gap: var(--s3); font-size: var(--type-label); white-space: nowrap;
    }

    .marketing-page .mk-hero__grid {
        grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
        gap: clamp(var(--s6), 4vw, var(--s10));
        padding-block: clamp(var(--s10), 8vw, var(--s16));
    }

    .marketing-page .mk-product-stage {
        min-block-size: calc(var(--mk-stage-min-height) - var(--s8));
    }

    .marketing-page .mk-desktop__content {
        padding: var(--s4);
    }

    .marketing-page .mk-role-composition {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .marketing-page .mk-record-core {
        grid-column: 1 / -1;
        grid-row: 1;
        justify-self: center;
        inline-size: var(--mk-stage-mobile);
    }
}

@media (max-width: 48rem) {
    .marketing-page .mk-header__inner {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .marketing-page .mk-navigation {
        display: none;
    }

    .marketing-page .mk-header__actions {
        justify-content: flex-end;
    }

    .marketing-page .mk-hero__grid,
    .marketing-page .mk-customization__grid,
    .marketing-page .mk-capabilities__grid,
    .marketing-page .mk-launch__grid,
    .marketing-page .mk-final-cta__inner,
    .marketing-page .mk-trust__heading {
        grid-template-columns: minmax(0, 1fr);
    }

    .marketing-page .mk-hero__grid {
        min-block-size: auto;
    }

    .marketing-page .mk-product-stage {
        min-block-size: calc(var(--mk-stage-min-height) + var(--s8));
    }

    .marketing-page .mk-section-copy--sticky {
        position: static;
    }

    .marketing-page .mk-brand-proof,
    .marketing-page .mk-trust__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .marketing-page .mk-proof-connector {
        inset-block-start: auto;
        inset-block-end: calc(var(--s3) * -1);
        inset-inline-end: 50%;
        transform: translate(50%, 50%) rotate(90deg);
    }

    .marketing-page .mk-final-cta .mk-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 40rem) {
    .marketing-page .mk-header__inner {
        min-block-size: var(--mk-header-height);
        gap: var(--s2);
        padding-inline: var(--s4);
    }

    .marketing-page .mk-brand {
        gap: 0;
    }

    .marketing-page .mk-header .mk-brand__wordmark {
        font-size: var(--type-small);
    }

    .marketing-page .mk-header .mk-brand__tagline {
        display: none;
    }

    .marketing-page .mk-header__actions {
        min-inline-size: 0;
        flex-wrap: nowrap;
        justify-content: flex-end;
        gap: var(--s1);
    }

    .marketing-page .mk-link-action {
        padding-inline: var(--s1);
        font-size: var(--type-small);
        white-space: nowrap;
    }

    .marketing-page .mk-header__actions .mk-button {
        padding-inline: var(--s2);
        font-size: var(--type-small);
        white-space: nowrap;
    }

    .marketing-page .mk-header__actions .language-switcher {
        display: none;
    }

    .marketing-page .mk-container {
        padding-inline: var(--s4);
    }

    .marketing-page .mk-hero__grid {
        gap: var(--s8);
        padding-block: var(--s10);
    }

    .marketing-page .mk-hero h1 {
        max-inline-size: 12ch;
        margin-block-end: var(--s4);
        font-size: clamp(2.75rem, 13vw, var(--mk-display-lg));
        line-height: .94;
    }

    .marketing-page .mk-hero__lede {
        font-size: var(--type-body);
        line-height: 1.6;
    }

    .marketing-page .mk-hero .mk-actions {
        margin-block-start: var(--s6);
    }

    .marketing-page .mk-actions,
    .marketing-page .mk-actions .mk-button {
        inline-size: 100%;
    }

    .marketing-page .mk-product-stage {
        display: grid;
        gap: var(--s5);
        min-block-size: auto;
    }

    .marketing-page .mk-stage-lines {
        display: none;
    }

    .marketing-page .mk-desktop,
    .marketing-page .mk-mobile {
        position: relative;
        inset: auto;
        inline-size: 100%;
        min-block-size: 0;
        transform: none;
    }

    .marketing-page .mk-desktop__shell {
        grid-template-columns: var(--s12) minmax(0, 1fr);
        min-block-size: 0;
    }

    .marketing-page .mk-dashboard-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .marketing-page .mk-product-heading {
        display: grid;
    }

    .marketing-page .mk-product-status {
        inline-size: max-content;
    }

    .marketing-page .mk-mobile__header {
        margin-block-end: var(--s5);
    }

    .marketing-page .mk-role-composition {
        grid-template-columns: minmax(0, 1fr);
    }

    .marketing-page .mk-record-core {
        grid-column: auto;
        inline-size: var(--mk-stage-mobile);
    }

    .marketing-page .mk-trust__grid article {
        padding: var(--s6) 0;
    }

    .marketing-page .mk-footer__inner,
    .marketing-page .mk-footer__links {
        display: grid;
        justify-content: stretch;
    }
}

@media (prefers-reduced-motion: reduce) {
    .marketing-page,
    .marketing-page *,
    .marketing-page *::before,
    .marketing-page *::after {
        scroll-behavior: auto;
        transition-duration: .01ms;
    }
}

.marketing-page :is(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: none;
    box-shadow:
        0 0 0 var(--mk-focus-inner-width) var(--mk-focus),
        0 0 0 var(--mk-focus-outer-width) var(--mk-focus-halo);
}

/* UI10A — Meeting-ready landing, original visual assets, and procurement-safe assurance. */
.marketing-page .mk-brand {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--s3);
}

.marketing-page .mk-brand-symbol {
    inline-size: 2.9rem;
    block-size: 2.9rem;
    flex: 0 0 auto;
    object-fit: contain;
    object-position: center;
}

.marketing-page .mk-brand__copy {
    display: grid;
    gap: .2rem;
    min-inline-size: 0;
}

.marketing-page .mk-header .language-switcher {
    --c-ink: var(--mk-ink);
    --c-text: var(--mk-ink);
    --c-line: var(--mk-line);
    --c-surface: var(--mk-white);
    --c-surface-mid: var(--mk-cream-200);
    --brand-link: var(--mk-green-900);
    --brand-primary: var(--mk-green-900);
    --brand-primary-soft: var(--mk-cream-200);
}

.marketing-page .mk-hero__signals {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s2) var(--s4);
    margin: var(--s5) 0 0;
    padding: 0;
    color: var(--mk-green-900);
    list-style: none;
}

.marketing-page .mk-hero__signals li {
    display: inline-flex;
    align-items: center;
    gap: var(--s2);
    font-size: var(--mk-label);
}

.marketing-page .mk-hero__signals li > span {
    inline-size: .55rem;
    block-size: .55rem;
    border: 2px solid var(--mk-white);
    border-radius: 50%;
    background: var(--mk-gold-500);
    box-shadow: 0 0 0 2px var(--mk-green-900);
}

.marketing-page .mk-mini-brand {
    display: block;
    inline-size: var(--mk-mark-size);
    block-size: var(--mk-mark-size);
    border-radius: .75rem;
    box-shadow: 0 .35rem .9rem rgba(18, 45, 28, .2);
}

.marketing-page .mk-desktop__rail .mk-mini-brand {
    inline-size: var(--s8);
    block-size: var(--s8);
}

.marketing-page .mk-mock-nav-icon {
    display: grid;
    place-items: center;
    inline-size: 2.15rem;
    block-size: 2.15rem;
    border: 1px solid color-mix(in srgb, var(--mk-white) 12%, transparent);
    border-radius: .65rem;
    color: color-mix(in srgb, var(--mk-white) 72%, transparent);
    background: color-mix(in srgb, var(--mk-white) 7%, transparent);
}

.marketing-page .mk-mock-nav-icon:first-of-type {
    color: var(--mk-green-950);
    background: var(--mk-gold-200);
}

.marketing-page .mk-mock-nav-icon::before {
    content: "";
    inline-size: 1.05rem;
    block-size: 1.05rem;
    background: currentColor;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.marketing-page .mk-record-banner__seal {
    inline-size: var(--mk-icon-size);
    block-size: var(--mk-icon-size);
    flex: 0 0 auto;
    border-radius: 50%;
    box-shadow: 0 .45rem 1rem rgba(0, 0, 0, .18);
}

.marketing-page .mk-mobile__header .mk-mini-brand {
    inline-size: var(--s8);
    block-size: var(--s8);
}

.marketing-page .mk-mobile__student > img {
    inline-size: 3.25rem;
    block-size: 3.25rem;
    object-fit: cover;
    border: 2px solid var(--mk-white);
    border-radius: 1rem;
    box-shadow: 0 .35rem .9rem rgba(18, 45, 28, .14);
}

.marketing-page .mk-assurance {
    scroll-margin-block-start: var(--mk-header-height);
    padding-block: var(--mk-section-space);
    color: var(--mk-white);
    background:
        radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--mk-gold-500) 24%, transparent), transparent 22rem),
        linear-gradient(145deg, var(--mk-green-950), var(--mk-green-900));
}

.marketing-page .mk-assurance__heading {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(20rem, .95fr);
    align-items: end;
    gap: var(--s10);
    margin-block-end: var(--s10);
}

.marketing-page .mk-assurance__heading h2 {
    max-inline-size: 17ch;
    margin: var(--s3) 0 0;
    color: var(--mk-white);
    font-family: var(--mk-display-font);
    font-size: var(--mk-display-md);
    font-weight: 500;
    line-height: 1.02;
    letter-spacing: -.035em;
}

.marketing-page .mk-assurance__heading > p {
    margin: 0;
    color: var(--mk-cream-300);
    font-size: var(--mk-body-lg);
    line-height: 1.7;
}

.marketing-page .mk-assurance .mk-eyebrow {
    color: var(--mk-gold-200);
}

.marketing-page .mk-assurance__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--s3);
}

.marketing-page .mk-assurance__grid article {
    display: grid;
    align-content: start;
    gap: var(--s3);
    min-block-size: 17rem;
    padding: var(--s6);
    border: 1px solid color-mix(in srgb, var(--mk-white) 18%, transparent);
    border-radius: var(--r-card);
    background: color-mix(in srgb, var(--mk-white) 7%, transparent);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mk-white) 8%, transparent);
}

.marketing-page .mk-assurance__icon {
    display: grid;
    place-items: center;
    inline-size: 3.25rem;
    block-size: 3.25rem;
    border-radius: 1rem;
    color: var(--mk-green-950);
    background: var(--mk-gold-200);
}

.marketing-page .mk-assurance__icon svg {
    inline-size: 1.6rem;
    block-size: 1.6rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.marketing-page .mk-assurance__grid h3 {
    margin: var(--s2) 0 0;
    color: var(--mk-white);
    font-size: 1.15rem;
}

.marketing-page .mk-assurance__grid p {
    margin: 0;
    color: var(--mk-cream-300);
    font-size: var(--type-small);
    line-height: 1.65;
}

.marketing-page .mk-assurance__note {
    margin: var(--s6) 0 0;
    padding: var(--s4) var(--s5);
    border-inline-start: .25rem solid var(--mk-gold-500);
    color: var(--mk-cream-300);
    background: color-mix(in srgb, var(--mk-white) 6%, transparent);
    font-size: var(--type-small);
    line-height: 1.6;
}

.marketing-page .mk-assurance__note strong {
    color: var(--mk-white);
}

.marketing-page .mk-community {
    padding-block: var(--mk-section-space);
    background: linear-gradient(180deg, var(--mk-cream-100), var(--mk-cream-200));
}

.marketing-page .mk-community__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(22rem, .92fr);
    align-items: center;
    gap: clamp(var(--s8), 7vw, var(--s16));
}

.marketing-page .mk-community__visual {
    position: relative;
    margin: 0;
    padding: clamp(var(--s4), 3vw, var(--s8));
    border: 1px solid var(--mk-line);
    border-radius: var(--r-hero);
    background: var(--mk-white);
    box-shadow: var(--mk-card-shadow);
}

.marketing-page .mk-community__visual::before {
    content: "";
    position: absolute;
    inset: var(--s4);
    z-index: 0;
    border: 1px dashed color-mix(in srgb, var(--mk-gold-500) 38%, transparent);
    border-radius: calc(var(--r-hero) - var(--s2));
    pointer-events: none;
}

.marketing-page .mk-community__visual img {
    position: relative;
    z-index: 1;
    inline-size: 100%;
}

.marketing-page .mk-community .mk-section-copy h2 {
    margin-block: var(--s3) var(--s5);
}

.marketing-page .mk-community__signals {
    display: grid;
    gap: var(--s2);
    margin: var(--s6) 0 0;
    padding: 0;
    list-style: none;
}

.marketing-page .mk-community__signals li {
    display: grid;
    grid-template-columns: minmax(9rem, .6fr) minmax(0, 1fr);
    gap: var(--s4);
    padding-block: var(--s3);
    border-block-start: 1px solid var(--mk-line);
}

.marketing-page .mk-community__signals strong {
    color: var(--mk-green-900);
}

.marketing-page .mk-community__signals span {
    color: var(--mk-muted);
    font-size: var(--type-small);
    line-height: 1.55;
}

.marketing-page .mk-school-crest {
    inline-size: 4.75rem;
    block-size: 4.75rem;
    object-fit: contain;
    filter: drop-shadow(0 .45rem .65rem rgba(18, 45, 28, .12));
}

.marketing-page .mk-record-core__seal {
    inline-size: 5rem;
    block-size: 5rem;
    border-radius: 50%;
    box-shadow: 0 .75rem 1.5rem rgba(0, 0, 0, .24);
}

.marketing-page .mk-footer__identity {
    display: grid;
    gap: var(--s4);
}

.marketing-page .mk-footer__note {
    max-inline-size: 34rem;
    margin: 0;
    color: var(--mk-cream-300);
    font-size: var(--type-small);
    line-height: 1.55;
}

@media (max-width: 64rem) {
    .marketing-page .mk-assurance__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .marketing-page .mk-assurance__grid article {
        min-block-size: 14rem;
    }

    .marketing-page .mk-community__grid {
        grid-template-columns: minmax(0, 1fr) minmax(19rem, .8fr);
        gap: var(--s8);
    }
}

@media (max-width: 48rem) {
    .marketing-page .mk-assurance__heading,
    .marketing-page .mk-community__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .marketing-page .mk-assurance__heading {
        gap: var(--s5);
    }

    .marketing-page .mk-community__visual {
        order: 2;
    }

    .marketing-page .mk-footer__inner {
        align-items: flex-start;
    }
}

@media (max-width: 40rem) {
    .marketing-page .mk-brand-symbol {
        inline-size: 2.45rem;
        block-size: 2.45rem;
    }

    .marketing-page .mk-header .mk-brand__wordmark {
        font-size: .9rem;
    }

    .marketing-page .mk-hero__signals {
        display: grid;
    }

    .marketing-page .mk-assurance__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .marketing-page .mk-assurance__grid article {
        min-block-size: 0;
        padding: var(--s5);
    }

    .marketing-page .mk-community__signals li {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--s1);
    }

    .marketing-page .mk-mobile__student > img {
        inline-size: 3rem;
        block-size: 3rem;
    }
}

@media (max-width: 30rem) {
    .marketing-page .mk-header__actions .mk-button {
        display: none;
    }

    .marketing-page .mk-header__actions {
        gap: .25rem;
    }
}

@media (prefers-contrast: more) {
    .marketing-page :is(.mk-assurance__grid article, .mk-community__visual, .mk-assurance__note) {
        border-width: 2px;
    }
}

@media (forced-colors: active) {
    .marketing-page .mk-assurance,
    .marketing-page .mk-assurance__grid article,
    .marketing-page .mk-assurance__note {
        color: CanvasText;
        background: Canvas;
        border-color: CanvasText;
    }

    .marketing-page .mk-assurance :is(h2, h3, p, strong, .mk-eyebrow) { color: CanvasText; }
    .marketing-page .mk-assurance__icon { color: ButtonText; background: ButtonFace; border: 1px solid ButtonText; }
    .marketing-page .mk-mock-nav-icon { color: CanvasText; background: Canvas; border-color: CanvasText; }
}


/* ==========================================================================
   CON8CT — public marketing landing (v2, matches desktop_home mockup)
   Scope: .con8ct-landing  (applied on <body class="marketing-page con8ct-landing">)
   ========================================================================== */

.con8ct-landing {
    /* palette */
    --ls-green-950: #0b3324;
    --ls-green-900: var(--platform-action-primary);
    --ls-green-800: var(--platform-action-hover);
    --ls-green-700: #1c6a4c;
    --ls-ink: #16241d;
    --ls-body: #4d5b53;
    --ls-muted: #6f7a72;
    --ls-gold: #b7822b;
    --ls-gold-400: #d5a75a;
    --ls-gold-200: #e8d3a6;
    --ls-indigo: #5b62c9;
    --ls-sage: #8ea48f;
    --ls-cream: #f7f4ec;
    --ls-panel: #f6f3ea;
    --ls-line: #e7e2d6;
    --ls-line-soft: #efebe1;
    --ls-white: #fff;

    /* type */
    --ls-serif: "Playfair Display", "Lora", Georgia, "Times New Roman", serif;
    --ls-sans: "Hanken Grotesk", "Poppins", Aptos, "Segoe UI", system-ui, sans-serif;

    /* rhythm */
    --ls-radius-lg: 1.15rem;
    --ls-radius: .75rem;
    --ls-radius-sm: .5rem;
    --ls-section: clamp(3.25rem, 6vw, 5.25rem);
    --ls-shadow: 0 .75rem 2rem rgba(14, 58, 40, .07);

    color: var(--ls-ink);
    background: var(--ls-white);
    font-family: var(--ls-sans);
    scroll-behavior: smooth;
}

.con8ct-landing .mk-container {
    inline-size: min(1200px, 100% - 3rem);
    margin-inline: auto;
    padding-inline: 0;
}

.con8ct-landing :focus-visible {
    outline: 3px solid var(--ls-green-800);
    outline-offset: 3px;
    border-radius: 4px;
}

/* shared icon sizing ------------------------------------------------------ */
.con8ct-landing .ic {
    display: block;
    inline-size: 1em;
    block-size: 1em;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.con8ct-landing .ic--fill {
    fill: currentColor;
    stroke: none;
}

/* ==========================================================================
   Header
   ========================================================================== */
.con8ct-landing .landing-header {
    position: sticky;
    inset-block-start: 0;
    z-index: 50;
    background: rgba(255, 255, 254, .96);
    border-block-end: 1px solid var(--ls-line-soft);
    backdrop-filter: blur(12px);
}

.con8ct-landing .landing-header__inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.5rem;
    inline-size: min(1200px, 100% - 3rem);
    min-block-size: 4.75rem;
    margin-inline: auto;
    padding-inline: 0;
}

.con8ct-landing .landing-brand {
    display: flex;
    align-items: center;
    gap: .8rem;
    text-decoration: none;
}

.con8ct-landing .landing-brand .mk-brand-symbol {
    inline-size: 3rem;
    block-size: 3rem;
    object-fit: contain;
}

.con8ct-landing .mk-brand__copy {
    display: grid;
    gap: .18rem;
}

.con8ct-landing .mk-brand__wordmark {
    font-family: var(--ls-serif);
    font-size: 1.6rem;
    font-weight: 500;
    letter-spacing: .01em;
    line-height: 1;
    color: var(--ls-green-900);
}

.con8ct-landing .mk-brand__wordmark span {
    color: var(--ls-gold);
}

.con8ct-landing .mk-brand__tagline {
    font-size: .58rem;
    font-weight: 600;
    letter-spacing: .02em;
    color: var(--ls-muted);
}

.con8ct-landing .landing-nav {
    display: flex;
    justify-content: center;
    gap: 2.1rem;
}

.con8ct-landing .landing-nav a {
    font-size: .82rem;
    font-weight: 600;
    color: var(--ls-ink);
    text-decoration: none;
    padding-block: .35rem;
    border-block-end: 2px solid transparent;
    transition: color .18s ease, border-color .18s ease;
}

.con8ct-landing .landing-nav a:hover,
.con8ct-landing .landing-nav a[aria-current="page"] {
    color: var(--ls-green-800);
    border-block-end-color: var(--ls-gold-400);
}

.con8ct-landing .landing-header__actions {
    display: flex;
    align-items: center;
    gap: .6rem;
}

/* ==========================================================================
   Buttons
   ========================================================================== */
.con8ct-landing .mk-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    min-block-size: 2.6rem;
    padding: 0 1.15rem;
    border: 1px solid transparent;
    border-radius: .45rem;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.con8ct-landing .mk-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 .5rem 1.25rem rgba(14, 58, 40, .16);
}

.con8ct-landing .mk-button:active {
    transform: translateY(0);
    box-shadow: none;
}

.con8ct-landing .mk-button--primary {
    background: var(--ls-green-900);
    color: var(--ls-white);
}

.con8ct-landing .mk-button--primary:hover {
    background: var(--ls-green-800);
}

.con8ct-landing .mk-button--secondary {
    background: var(--ls-white);
    border-color: #cfd8d0;
    color: var(--ls-green-900);
}

.con8ct-landing .mk-button--secondary:hover {
    border-color: var(--ls-green-800);
}

.con8ct-landing .mk-button--gold {
    background: var(--ls-gold-400);
    color: #40300f;
}

.con8ct-landing .mk-button--gold:hover {
    background: #e0b76d;
}

.con8ct-landing .landing-signin {
    display: inline-flex;
    align-items: center;
    min-block-size: 2.6rem;
    padding: 0 1.1rem;
    border: 1px solid #d3dbd4;
    border-radius: .45rem;
    font-size: .82rem;
    font-weight: 600;
    color: var(--ls-ink);
    text-decoration: none;
    transition: border-color .18s ease, color .18s ease;
}

.con8ct-landing .landing-signin:hover {
    border-color: var(--ls-green-800);
    color: var(--ls-green-800);
}

/* mobile menu ------------------------------------------------------------- */
.con8ct-landing .landing-menu {
    display: none;
    position: relative;
}

.con8ct-landing .landing-menu summary {
    display: grid;
    gap: 4px;
    padding: .7rem;
    list-style: none;
    cursor: pointer;
}

.con8ct-landing .landing-menu summary::-webkit-details-marker {
    display: none;
}

.con8ct-landing .landing-menu summary span {
    inline-size: 1.3rem;
    block-size: 2px;
    border-radius: 2px;
    background: var(--ls-green-900);
}

.con8ct-landing .landing-menu nav {
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: 3.1rem;
    display: grid;
    min-inline-size: 15rem;
    padding: .6rem;
    border: 1px solid var(--ls-line);
    border-radius: .7rem;
    background: var(--ls-white);
    box-shadow: 0 1rem 3rem rgba(14, 58, 40, .14);
}

.con8ct-landing .landing-menu nav a {
    padding: .7rem .8rem;
    border-radius: .4rem;
    font-size: .85rem;
    font-weight: 600;
    color: var(--ls-ink);
    text-decoration: none;
}

.con8ct-landing .landing-menu nav a:hover {
    background: var(--ls-panel);
    color: var(--ls-green-800);
}

/* ==========================================================================
   Hero
   ========================================================================== */
.con8ct-landing .landing-hero {
    position: relative;
    overflow: hidden;
    background: radial-gradient(120% 90% at 50% 0%, #fffdf8 0%, var(--ls-cream) 62%, #f2eee3 100%);
}

.con8ct-landing .leaf-watermark {
    position: absolute;
    z-index: 0;
    display: block;
    block-size: auto;
    object-fit: contain;
    opacity: .3;
    pointer-events: none;
    user-select: none;
}

.con8ct-landing .leaf-watermark--hero-left {
    inline-size: 15rem;
    inset-inline-start: -3.5rem;
    inset-block-start: 3rem;
}

.con8ct-landing .leaf-watermark--hero-right {
    inline-size: 17rem;
    inset-inline-end: -3rem;
    inset-block-start: 1rem;
    transform: none;
}

.con8ct-landing .landing-hero__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    align-items: center;
    gap: 2.5rem;
    padding-block: clamp(2.5rem, 5vw, 4rem);
}

.con8ct-landing .landing-eyebrow {
    margin: 0 0 1.1rem;
    color: var(--ls-gold);
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .17em;
    text-transform: uppercase;
}

.con8ct-landing .landing-hero h1 {
    margin: 0;
    max-inline-size: 12ch;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(2.5rem, 3.9vw, 3.6rem);
    line-height: 1.14;
    letter-spacing: -.015em;
    color: #12251c;
}

.con8ct-landing .landing-hero h1 em {
    font-style: normal;
    color: var(--ls-green-800);
}

.con8ct-landing .landing-lede {
    max-inline-size: 30rem;
    margin: 1.4rem 0 0;
    font-size: .92rem;
    line-height: 1.95;
    color: var(--ls-body);
}

.con8ct-landing .landing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-block-start: 1.9rem;
}

.con8ct-landing .landing-signals {
    display: flex;
    flex-wrap: wrap;
    gap: 1.6rem;
    margin: 2.1rem 0 0;
    padding: 0;
    list-style: none;
}

.con8ct-landing .landing-signals li {
    display: flex;
    align-items: center;
    gap: .55rem;
    font-size: .76rem;
    color: #4f5c55;
}

.con8ct-landing .signal-mark {
    display: grid;
    place-items: center;
    inline-size: 2rem;
    block-size: 2rem;
    border: 1px solid #dbe0d4;
    border-radius: 50%;
    background: rgba(255, 255, 255, .7);
    color: var(--ls-green-800);
    font-size: .95rem;
    flex: 0 0 auto;
}

/* device stage ------------------------------------------------------------ */
.con8ct-landing .landing-devices {
    position: relative;
    z-index: 1;
    min-block-size: 27rem;
    font-family: var(--ls-sans);
}

.con8ct-landing .device-desktop,
.con8ct-landing .device-phone,
.con8ct-landing .device-tablet {
    position: absolute;
    background: var(--ls-white);
    border: .45rem solid #17201a;
    box-shadow: 0 1.5rem 3rem rgba(20, 40, 30, .18);
    overflow: hidden;
}

/* laptop */
.con8ct-landing .laptop-wrap {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
    inline-size: 80%;
}

.con8ct-landing .device-desktop {
    position: relative;
    inline-size: 100%;
    border-radius: .8rem;
}

.con8ct-landing .device-desktop::after {
    content: "";
    position: absolute;
    inset-block-start: .18rem;
    inset-inline-start: 50%;
    inline-size: .25rem;
    block-size: .25rem;
    border-radius: 50%;
    background: #3a4640;
    transform: translateX(-50%);
}

.con8ct-landing .device-base {
    position: relative;
    display: block;
    inline-size: 112%;
    margin-inline-start: -6%;
    block-size: .95rem;
    border-radius: 0 0 .6rem .6rem;
    background: linear-gradient(#d5d9d6, #a7aeaa);
    box-shadow: 0 .7rem 1.4rem rgba(20, 40, 30, .16);
}

.con8ct-landing .device-base::after {
    content: "";
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 44%;
    inline-size: 12%;
    block-size: .22rem;
    border-radius: 0 0 .3rem .3rem;
    background: #98a09b;
}

.con8ct-landing .device-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .55rem .8rem;
    border-block-end: 1px solid #edeae3;
}

.con8ct-landing .device-top b {
    font-family: var(--ls-serif);
    font-size: .8rem;
    font-weight: 500;
    color: var(--ls-green-900);
}

.con8ct-landing .device-top b span {
    color: var(--ls-gold);
}

.con8ct-landing .device-dots {
    display: flex;
    align-items: center;
    gap: .35rem;
    color: #b7bfb9;
    font-size: .55rem;
}

.con8ct-landing .device-avatar {
    display: inline-block;
    vertical-align: middle;
    inline-size: 1.05rem;
    block-size: 1.05rem;
    border-radius: 50%;
    background: linear-gradient(140deg, var(--ls-green-700), var(--ls-green-950));
}

.con8ct-landing .device-shell {
    display: grid;
    grid-template-columns: 6.4rem minmax(0, 1fr);
    min-block-size: 19rem;
    background: #fcfcfa;
}

.con8ct-landing .device-shell aside {
    display: grid;
    align-content: start;
    gap: .5rem;
    padding: .7rem .45rem;
    border-inline-end: 1px solid #efece6;
    background: #fbfbf9;
    font-size: .52rem;
    color: #7b857f;
}

.con8ct-landing .device-shell aside span,
.con8ct-landing .device-shell aside b {
    display: flex;
    align-items: center;
    gap: .3rem;
    padding: .28rem .35rem;
    border-radius: .28rem;
}

.con8ct-landing .device-shell aside b {
    background: #eef1ec;
    color: var(--ls-green-900);
    font-weight: 700;
}

.con8ct-landing .device-shell aside i {
    inline-size: .5rem;
    block-size: .5rem;
    border: 1px solid currentColor;
    border-radius: 50%;
    opacity: .55;
    flex: 0 0 auto;
}

.con8ct-landing .device-content {
    padding: .95rem 1rem;
}

.con8ct-landing .device-kicker {
    margin: 0;
    font-size: .8rem;
    font-weight: 700;
    color: #1b2c23;
}

.con8ct-landing .device-content > small {
    display: block;
    margin-block-start: .2rem;
    font-size: .55rem;
    color: #97a09a;
}

.con8ct-landing .mock-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .6rem;
    margin-block-start: .85rem;
}

.con8ct-landing .mock-grid section {
    min-block-size: 5.4rem;
    padding: .6rem;
    border: 1px solid #edeae3;
    border-radius: .45rem;
    background: var(--ls-white);
}

.con8ct-landing .mock-grid section > b {
    font-size: .55rem;
    color: #33443b;
}

.con8ct-landing .mock-row {
    margin: .45rem 0 0;
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .5rem;
    color: #6d7872;
}

.con8ct-landing .mock-dot {
    inline-size: .5rem;
    block-size: .5rem;
    border-radius: 50%;
    flex: 0 0 auto;
}

.con8ct-landing .mock-dot--gold { background: var(--ls-gold-400); }
.con8ct-landing .mock-dot--green { background: var(--ls-sage); }

.con8ct-landing .mock-calendar {
    margin: .5rem 0 0;
    font-size: .48rem;
    line-height: 1.7;
    color: #8a938d;
}

.con8ct-landing .mock-calendar b {
    color: var(--ls-green-800);
}

/* phone */
.con8ct-landing .device-phone {
    z-index: 5;
    inline-size: 25%;
    inset-inline-start: 32%;
    inset-block-end: 0;
    padding: 1rem .7rem .5rem;
    border-radius: 1.6rem;
    min-block-size: 16.5rem;
}

.con8ct-landing .phone-notch {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 32%;
    inline-size: 36%;
    block-size: .4rem;
    border-radius: 0 0 .45rem .45rem;
    background: #17201a;
}

.con8ct-landing .device-phone > small {
    display: block;
    font-size: .58rem;
    line-height: 1.5;
    color: #55625b;
}

.con8ct-landing .device-phone > small b {
    display: block;
    font-size: .7rem;
    color: #1b2c23;
}

.con8ct-landing .device-phone h3,
.con8ct-landing .device-phone h4 {
    margin: .8rem 0 .35rem;
    font-size: .58rem;
    font-weight: 700;
    color: #33443b;
}

.con8ct-landing .phone-row {
    margin: 0;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .45rem 0;
    border-block-end: 1px solid #f1efe9;
    font-size: .52rem;
}

.con8ct-landing .phone-row .avatar {
    inline-size: 1.1rem;
    block-size: 1.1rem;
    border-radius: 50%;
    background: linear-gradient(140deg, #d9c6a4, #8fa08f);
    flex: 0 0 auto;
}

.con8ct-landing .phone-row span {
    display: grid;
    gap: .1rem;
}

.con8ct-landing .phone-row em {
    font-style: normal;
    font-size: .44rem;
    color: #98a09a;
}

.con8ct-landing .phone-row b {
    margin-inline-start: auto;
    color: #b9c0bb;
}

.con8ct-landing .device-bottom {
    position: absolute;
    inset-block-end: .4rem;
    inset-inline: .5rem;
    display: flex;
    justify-content: space-around;
    padding-block-start: .4rem;
    border-block-start: 1px solid #f1efe9;
    color: var(--ls-green-700);
    font-size: .62rem;
}

/* tablet */
.con8ct-landing .device-tablet {
    z-index: 4;
    inline-size: 43%;
    inset-inline-end: 0;
    inset-block-end: 0;
    padding: .8rem .75rem;
    border-radius: 1.1rem;
    min-block-size: 18rem;
    background: #fbfbf8;
}

.con8ct-landing .tablet-top {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .62rem;
    color: #b6bdb8;
}

.con8ct-landing .tablet-top b {
    margin-inline-end: auto;
    font-family: var(--ls-serif);
    font-size: .78rem;
    font-weight: 500;
    color: #1b2c23;
}

.con8ct-landing .device-tablet h4 {
    margin: .85rem 0 .4rem;
    font-size: .58rem;
    font-weight: 700;
    color: #33443b;
}

.con8ct-landing .tablet-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
}

.con8ct-landing .tablet-grid span {
    display: grid;
    gap: .25rem;
    padding: .55rem;
    border: 1px solid #eeebe4;
    border-radius: .45rem;
    background: var(--ls-white);
    font-size: .5rem;
    color: #7c857f;
}

.con8ct-landing .tablet-grid b {
    font-size: .95rem;
    color: #1b2c23;
}

.con8ct-landing .tablet-grid b small {
    font-size: .5rem;
    font-weight: 400;
    color: #98a09a;
}

.con8ct-landing .tablet-feed {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: .45rem 0 0;
    padding: .5rem;
    border: 1px solid #eeebe4;
    border-radius: .45rem;
    background: var(--ls-white);
    font-size: .5rem;
}

.con8ct-landing .tablet-feed span {
    display: grid;
    gap: .1rem;
}

.con8ct-landing .tablet-feed em {
    font-style: normal;
    font-size: .44rem;
    color: #98a09a;
}

.con8ct-landing .tablet-feed time {
    margin-inline-start: auto;
    color: #a8afa9;
    font-size: .44rem;
}

.con8ct-landing .feed-mark {
    display: grid;
    place-items: center;
    inline-size: 1.05rem;
    block-size: 1.05rem;
    border-radius: 50%;
    background: #eef1ec;
    color: var(--ls-green-700);
    font-size: .55rem;
    flex: 0 0 auto;
}

/* ==========================================================================
   Section frame
   ========================================================================== */
.con8ct-landing .landing-section {
    padding-block: var(--ls-section);
}

.con8ct-landing .landing-heading {
    max-inline-size: 46rem;
    margin: 0 auto 2.5rem;
    text-align: center;
}

.con8ct-landing .landing-heading h2 {
    margin: 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(1.75rem, 2.7vw, 2.35rem);
    line-height: 1.28;
    letter-spacing: -.01em;
    color: #12251c;
}

.con8ct-landing .landing-heading h2 em {
    font-style: normal;
    color: var(--ls-green-800);
}

.con8ct-landing .landing-heading > p:last-child {
    margin: .7rem 0 0;
    font-size: .85rem;
    color: var(--ls-muted);
}

.con8ct-landing .heading-rule {
    inline-size: 3.5rem;
    block-size: 1px;
    margin: 1.3rem auto 0;
    border: 0;
    background: var(--ls-gold-200);
}

/* ==========================================================================
   What makes CON8CT different
   ========================================================================== */
.con8ct-landing .feature-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.con8ct-landing .feature-grid article {
    display: grid;
    align-content: start;
    justify-items: center;
    gap: .65rem;
    padding: .5rem 1rem;
    border-inline-start: 1px solid var(--ls-line-soft);
    text-align: center;
}

.con8ct-landing .feature-grid article:first-child {
    border-inline-start: 0;
}

.con8ct-landing .feature-grid .ic {
    font-size: 2.4rem;
    color: var(--ls-green-800);
}

.con8ct-landing .feature-grid h3 {
    margin: .4rem 0 0;
    font-size: .7rem;
    font-weight: 800;
    line-height: 1.45;
    letter-spacing: .01em;
    text-transform: uppercase;
    color: #15352a;
}

.con8ct-landing .feature-grid p {
    margin: 0;
    font-size: .72rem;
    line-height: 1.8;
    color: var(--ls-body);
}

/* ==========================================================================
   Panels (roles + pricing sit on soft beige plates)
   ========================================================================== */
.con8ct-landing .landing-plate {
    position: relative;
    overflow: hidden;
    padding: clamp(2rem, 3.6vw, 3rem) clamp(1.25rem, 3vw, 2.5rem);
    border-radius: var(--ls-radius-lg);
    background: var(--ls-panel);
}

.con8ct-landing .plate-space {
    padding-block: 1.25rem;
}

/* ==========================================================================
   Roles
   ========================================================================== */
.con8ct-landing .role-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
}

.con8ct-landing .role-card {
    display: flex;
    flex-direction: column;
    border: 1px solid #ebe6dc;
    border-radius: var(--ls-radius);
    background: var(--ls-white);
    box-shadow: var(--ls-shadow);
    transition: transform .22s ease, box-shadow .22s ease;
    --role-color: var(--ls-green-800);
}

.con8ct-landing .role-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 1.1rem 2.4rem rgba(14, 58, 40, .12);
}

.con8ct-landing .role-card.teacher { --role-color: #a8791f; }
.con8ct-landing .role-card.parent { --role-color: var(--ls-green-800); }
.con8ct-landing .role-card.student { --role-color: var(--ls-indigo); }

.con8ct-landing .role-art {
    position: relative;
    flex: 0 0 auto;
    block-size: 8.5rem;
    border-radius: var(--ls-radius) var(--ls-radius) 0 0;
    background: linear-gradient(150deg, #e6ecdf, #b9c8b7);
}

.con8ct-landing .role-card.teacher .role-art { background: linear-gradient(150deg, #f0e5cd, #cbae74); }
.con8ct-landing .role-card.parent .role-art { background: linear-gradient(150deg, #e3ebe2, #9db6a3); }
.con8ct-landing .role-card.student .role-art { background: linear-gradient(150deg, #e3e5f1, #a7aed4); }

.con8ct-landing .role-art img {
    inline-size: 100%;
    block-size: 100%;
    border-radius: inherit;
    object-fit: cover;
    display: block;
}

.con8ct-landing .role-badge {
    position: absolute;
    inset-block-end: -1.35rem;
    inset-inline-start: 1.1rem;
    display: grid;
    place-items: center;
    inline-size: 2.7rem;
    block-size: 2.7rem;
    border: 3px solid var(--ls-white);
    border-radius: 50%;
    background: var(--role-color);
    color: var(--ls-white);
    font-size: 1.15rem;
}

.con8ct-landing .role-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 2.1rem 1.15rem 1.25rem;
}

.con8ct-landing .role-card h3 {
    margin: 0 0 .55rem;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: 1.15rem;
    color: var(--role-color);
}

.con8ct-landing .role-card > .role-body > p {
    margin: 0 0 1rem;
    font-size: .74rem;
    line-height: 1.75;
    color: var(--ls-body);
}

.con8ct-landing .role-card ul {
    display: grid;
    gap: .45rem;
    margin: 0 0 1.1rem;
    padding: 0;
    list-style: none;
}

.con8ct-landing .role-card li {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .73rem;
    color: #3f4c45;
}

.con8ct-landing .role-card li .ic {
    font-size: .95rem;
    color: var(--role-color);
    flex: 0 0 auto;
}

.con8ct-landing .role-link {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin-block-start: auto;
    font-size: .74rem;
    font-weight: 700;
    color: var(--role-color);
    text-decoration: none;
}

.con8ct-landing .role-link .ic {
    font-size: .9rem;
    transition: transform .18s ease;
}

.con8ct-landing .role-link:hover .ic {
    transform: translateX(3px);
}

/* ==========================================================================
   Pricing
   ========================================================================== */
.con8ct-landing .pricing-shell {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, .78fr) minmax(0, 2.05fr);
    gap: 1.75rem;
    align-items: start;
}

.con8ct-landing .pricing-intro h2 {
    margin: 0 0 1.2rem;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(1.55rem, 2.3vw, 1.95rem);
    line-height: 1.28;
    color: #12251c;
}

.con8ct-landing .pricing-intro ul {
    display: grid;
    gap: .5rem;
    margin: 0 0 1.1rem;
    padding: 0;
    list-style: none;
}

.con8ct-landing .pricing-intro li {
    display: flex;
    align-items: center;
    gap: .55rem;
    font-size: .78rem;
    color: #3f4c45;
}

.con8ct-landing .pricing-intro li .ic {
    font-size: 1rem;
    color: var(--ls-gold);
    flex: 0 0 auto;
}

.con8ct-landing .pricing-intro > p {
    margin: 0 0 1.3rem;
    max-inline-size: 17rem;
    font-size: .74rem;
    line-height: 1.8;
    color: var(--ls-body);
}

.con8ct-landing .leaf-watermark--pricing {
    inline-size: 11rem;
    inset-inline-start: 14%;
    inset-block-end: 2rem;
    opacity: .5;
}

.con8ct-landing .pricing-tiers {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border: 1px solid #ece7dc;
    border-radius: var(--ls-radius);
    background: var(--ls-white);
}

.con8ct-landing .pricing-tiers article {
    display: grid;
    align-content: start;
    justify-items: center;
    gap: .15rem;
    padding: 1.5rem 1rem;
    border-inline-start: 1px solid var(--ls-line-soft);
    text-align: center;
}

.con8ct-landing .pricing-tiers article:first-child {
    border-inline-start: 0;
}

.con8ct-landing .pricing-tiers .tier-band {
    margin: 0;
    display: grid;
    gap: .1rem;
    font-size: .58rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #6f7a72;
}

.con8ct-landing .pricing-tiers .tier-band b {
    font-family: var(--ls-serif);
    font-size: 1.45rem;
    font-weight: 500;
    letter-spacing: 0;
    color: #12251c;
}

.con8ct-landing .pricing-tiers .tier-price {
    margin: .9rem 0 0;
    font-family: var(--ls-serif);
    font-size: 1.95rem;
    font-weight: 500;
    color: #12251c;
}

.con8ct-landing .pricing-tiers .tier-cycle {
    margin: .1rem 0 0;
    font-size: .68rem;
    color: var(--ls-muted);
}

.con8ct-landing .pricing-tiers .tier-note {
    margin: .9rem 0 0;
    font-size: .69rem;
    line-height: 1.8;
    color: var(--ls-body);
}

.con8ct-landing .pricing-tiers .tier--best {
    position: relative;
    margin-block: -1.1rem -1px;
    padding-block-start: 2.5rem;
    border: 1px solid var(--ls-gold-200);
    border-radius: .7rem;
    background: #fffdf8;
}

.con8ct-landing .pricing-tiers .tier-flag {
    position: absolute;
    inset-block-start: -.85rem;
    inset-inline-start: 50%;
    transform: translateX(-50%);
    padding: .3rem .7rem;
    border-radius: .3rem;
    background: linear-gradient(135deg, #c08f31, #a8791f);
    color: #fff;
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .1em;
    white-space: nowrap;
}

.con8ct-landing .pricing-note {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    max-inline-size: 44rem;
    margin: 1.6rem auto 0;
    padding: 0;
    font-size: .74rem;
    line-height: 1.85;
    color: var(--ls-body);
}

.con8ct-landing .pricing-note strong {
    color: #12251c;
}

.con8ct-landing .note-mark {
    display: grid;
    place-items: center;
    inline-size: 2.1rem;
    block-size: 2.1rem;
    border-radius: 50%;
    background: #eaeee5;
    color: var(--ls-green-700);
    flex: 0 0 auto;
}

.con8ct-landing .note-mark .ic {
    font-size: 1.05rem;
}

/* ==========================================================================
   Trust
   ========================================================================== */
.con8ct-landing .trust-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.con8ct-landing .trust-grid article {
    display: grid;
    align-content: start;
    justify-items: center;
    gap: .6rem;
    padding: .5rem 1.1rem;
    border-inline-start: 1px solid var(--ls-line-soft);
    text-align: center;
}

.con8ct-landing .trust-grid article:first-child {
    border-inline-start: 0;
}

.con8ct-landing .trust-grid .ic {
    font-size: 2rem;
    color: var(--ls-green-800);
}

.con8ct-landing .trust-grid h3 {
    margin: .3rem 0 0;
    font-size: .76rem;
    font-weight: 800;
    color: #15352a;
}

.con8ct-landing .trust-grid p {
    margin: 0;
    font-size: .72rem;
    line-height: 1.8;
    color: var(--ls-body);
}

/* ==========================================================================
   Final CTA
   ========================================================================== */
.con8ct-landing .final-landing-cta {
    padding-block: 0 0;
}

.con8ct-landing .final-landing-cta__inner {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1.75rem;
    min-block-size: 11.5rem;
    padding: 2rem clamp(1.5rem, 3vw, 2.5rem);
    border-radius: var(--ls-radius-lg) var(--ls-radius-lg) 0 0;
    background: linear-gradient(100deg, #0e3a28 0%, #14503a 55%, #16563e 100%);
    color: #fff;
}

.con8ct-landing .cta-photo {
    position: absolute;
    inset-block: 0;
    inset-inline-end: 0;
    inline-size: 46%;
    object-fit: cover;
    opacity: .95;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 42%);
    mask-image: linear-gradient(90deg, transparent 0%, #000 42%);
    pointer-events: none;
}

.con8ct-landing .cta-mark {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    inline-size: 5.5rem;
    block-size: 5.5rem;
    border: 1px solid rgba(213, 167, 90, .75);
    border-radius: 50%;
    color: var(--ls-gold-400);
}

.con8ct-landing .cta-mark span {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    transform: translate(-50%, -50%);
    font-family: var(--ls-serif);
    font-size: 2.6rem;
    line-height: 1;
}

.con8ct-landing .cta-mark .ic {
    font-size: 3.4rem;
    opacity: .85;
}

.con8ct-landing .final-landing-cta__copy {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 1.5rem 2rem;
    max-inline-size: 46rem;
}

.con8ct-landing .final-landing-cta h2 {
    grid-column: 1 / -1;
    margin: 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    line-height: 1.25;
    color: #fff;
}

.con8ct-landing .final-landing-cta p {
    margin: 0;
    max-inline-size: 20rem;
    font-size: .78rem;
    line-height: 1.7;
    color: #d7e4dc;
}

.con8ct-landing .final-landing-cta .landing-actions {
    margin: 0;
}

.con8ct-landing .final-landing-cta .mk-button--secondary {
    background: transparent;
    border-color: rgba(255, 255, 255, .75);
    color: #fff;
}

.con8ct-landing .final-landing-cta .mk-button--secondary:hover {
    background: rgba(255, 255, 255, .12);
    border-color: #fff;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.con8ct-landing .landing-footer {
    padding-block: 1.5rem .9rem;
    background: var(--ls-green-950);
    color: #dce7de;
}

.con8ct-landing .landing-footer__grid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}

.con8ct-landing .landing-footer .mk-brand__wordmark {
    color: #fff;
    font-size: 1.4rem;
}

.con8ct-landing .landing-footer .mk-brand--footer .mk-brand__tagline {
    color: #b9cdc0;
}

.con8ct-landing .landing-footer nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.6rem;
}

.con8ct-landing .landing-footer nav :is(a, button[data-analytics-preferences]) {
    font-size: .78rem;
    color: #dce7de;
    text-decoration: none;
}

.con8ct-landing .landing-footer nav button[data-analytics-preferences] {
    padding: 0;
}

.con8ct-landing .landing-footer nav :is(a, button[data-analytics-preferences]):hover {
    color: var(--ls-gold-400);
}

.con8ct-landing .footer-social {
    display: flex;
    gap: .6rem;
}

.con8ct-landing .footer-social a {
    display: grid;
    place-items: center;
    inline-size: 2.1rem;
    block-size: 2.1rem;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 50%;
    color: #dce7de;
    font-size: 1rem;
    text-decoration: none;
    transition: border-color .18s ease, color .18s ease;
}

.con8ct-landing .footer-social a:hover {
    border-color: var(--ls-gold-400);
    color: var(--ls-gold-400);
}

.con8ct-landing .landing-footer__bottom {
    margin-block-start: .9rem;
    padding-block-start: .8rem;
    border-block-start: 1px solid rgba(255, 255, 255, .14);
    text-align: center;
    font-size: .68rem;
    color: #a9c0b1;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 78rem) {
    .con8ct-landing .feature-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1.5rem 0;
    }

    .con8ct-landing .feature-grid article:nth-child(3n+1) {
        border-inline-start: 0;
    }

    .con8ct-landing .role-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .con8ct-landing .trust-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1.5rem 0;
    }

    .con8ct-landing .trust-grid article:nth-child(3n+1) {
        border-inline-start: 0;
    }
}

@media (max-width: 64rem) {
    .con8ct-landing .landing-nav,
    .con8ct-landing .landing-header__actions > .landing-language {
        display: none;
    }

    .con8ct-landing .landing-menu {
        display: block;
    }

    /* The brand takes the free space so the menu button stays on the end edge. */
    .con8ct-landing .landing-header__inner {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .con8ct-landing .landing-header__actions {
        justify-content: flex-end;
    }

    .con8ct-landing .landing-hero__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .con8ct-landing .landing-hero__copy {
        max-inline-size: 38rem;
    }

    .con8ct-landing .landing-hero h1 {
        max-inline-size: none;
    }

    .con8ct-landing .pricing-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .con8ct-landing .leaf-watermark--pricing {
        display: none;
    }

    .con8ct-landing .final-landing-cta__copy {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .con8ct-landing .cta-photo {
        inline-size: 34%;
        opacity: .35;
    }
}

@media (max-width: 56rem) {
    .con8ct-landing .landing-signin,
    .con8ct-landing .landing-header__actions > .mk-button {
        display: none;
    }

    .con8ct-landing .pricing-tiers {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .con8ct-landing .pricing-tiers article:nth-child(3) {
        border-inline-start: 0;
    }

    .con8ct-landing .pricing-tiers .tier--best {
        margin-block: 1.4rem -1px;
    }
}

@media (max-width: 48rem) {
    .con8ct-landing .mk-container {
        inline-size: min(1200px, 100% - 2rem);
    }

    .con8ct-landing .landing-devices {
        display: grid;
        gap: 1rem;
        min-block-size: 0;
    }

    .con8ct-landing .laptop-wrap,
    .con8ct-landing .device-tablet {
        position: relative;
        inset: auto;
        inline-size: 100%;
    }

    .con8ct-landing .device-base,
    .con8ct-landing .device-phone {
        display: none;
    }

    .con8ct-landing .device-shell {
        grid-template-columns: 5rem minmax(0, 1fr);
        min-block-size: 15rem;
    }

    .con8ct-landing .feature-grid,
    .con8ct-landing .role-grid,
    .con8ct-landing .trust-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.75rem;
    }

    .con8ct-landing .feature-grid article,
    .con8ct-landing .trust-grid article {
        border-inline-start: 0;
    }

    .con8ct-landing .final-landing-cta__inner {
        grid-template-columns: minmax(0, 1fr);
        justify-items: start;
    }

    .con8ct-landing .cta-photo {
        display: none;
    }

    .con8ct-landing .landing-footer__grid {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 34rem) {
    .con8ct-landing .landing-brand .mk-brand__tagline {
        display: none;
    }

    .con8ct-landing .leaf-watermark--hero-left,
    .con8ct-landing .leaf-watermark--hero-right {
        display: none;
    }

    .con8ct-landing .pricing-tiers {
        grid-template-columns: minmax(0, 1fr);
    }

    .con8ct-landing .pricing-tiers article {
        border-inline-start: 0;
        border-block-start: 1px solid var(--ls-line-soft);
    }

    .con8ct-landing .pricing-tiers article:first-child {
        border-block-start: 0;
    }

    .con8ct-landing .pricing-tiers .tier--best {
        margin-inline: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .con8ct-landing,
    .con8ct-landing * {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}

/* scroll reveal ----------------------------------------------------------- */
.has-js .con8ct-landing [data-reveal] {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .55s ease, transform .55s ease;
}

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

@media (prefers-reduced-motion: reduce) {
    .has-js .con8ct-landing [data-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* ==========================================================================
   CON8CT — public site v3
   Header + mobile menu upgrade, and the shared primitives used by the
   Solutions, Pricing and About Us pages. Scope: .con8ct-landing
   ========================================================================== */
.con8ct-landing {
    --ls-header-h: 4.75rem;
}

/* --- header ---------------------------------------------------------------- */
.con8ct-landing .landing-header__inner {
    gap: 1.25rem;
}

.con8ct-landing .landing-nav {
    gap: clamp(1.1rem, 2.2vw, 2.1rem);
    flex-wrap: nowrap;
}

.con8ct-landing .landing-nav a {
    white-space: nowrap;
}

.con8ct-landing .landing-nav a[aria-current="page"] {
    font-weight: 700;
    border-block-end-color: var(--ls-gold);
}

.con8ct-landing .landing-header__actions {
    gap: .5rem;
}

/* --- hamburger ------------------------------------------------------------- */
.con8ct-landing .landing-menu > summary {
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 5px;
    inline-size: 2.85rem;
    block-size: 2.85rem;
    padding: 0;
    border: 1px solid var(--ls-line);
    border-radius: .55rem;
    background: var(--ls-white);
    transition: border-color .18s ease, background-color .18s ease;
}

.con8ct-landing .landing-menu > summary:hover {
    border-color: var(--ls-green-800);
    background: var(--ls-panel);
}

.con8ct-landing .landing-menu > summary span {
    transition: transform .22s ease, opacity .16s ease;
}

.con8ct-landing .landing-menu[open] > summary span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.con8ct-landing .landing-menu[open] > summary span:nth-child(2) {
    opacity: 0;
}

.con8ct-landing .landing-menu[open] > summary span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* --- mobile sheet ---------------------------------------------------------- */
.con8ct-landing .landing-menu[open]::after {
    content: "";
    position: fixed;
    inset: var(--ls-header-h) 0 0;
    z-index: 1;
    background: rgba(11, 51, 36, .34);
}

/* The language switcher rides in the shared public header and in the mobile
   sheet, so it inherits the landing type scale rather than the app shell's. */
.con8ct-landing .landing-header__actions .language-switcher > summary {
    min-block-size: 2.6rem;
    padding-inline: .6rem;
}

.con8ct-landing .landing-menu__language {
    padding: .2rem .35rem .45rem;
}

.con8ct-landing .landing-menu__language .language-switcher {
    position: static;
}

/* In the sheet the choices open inline under the control instead of as a
   floating panel. The summary stays visible: a closed <details> hides its own
   content at the UA level, so hiding the summary would leave no way to open it. */
.con8ct-landing .landing-menu__language .language-switcher > form {
    position: static;
    inset: auto;
    display: grid;
    grid-auto-flow: column;
    min-inline-size: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.con8ct-landing .landing-menu__language .language-switcher button {
    justify-content: center;
    border: 1px solid var(--ls-line);
    border-radius: .55rem;
}

.con8ct-landing .landing-menu > nav {
    position: fixed;
    inset-block-start: var(--ls-header-h);
    inset-inline: 0;
    z-index: 2;
    display: grid;
    gap: 0;
    min-inline-size: 0;
    max-block-size: calc(100dvh - var(--ls-header-h));
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: .5rem clamp(1.5rem, 5vw, 2.25rem) 1.9rem;
    border: 0;
    border-block-start: 1px solid var(--ls-line-soft);
    border-radius: 0;
    background: var(--ls-white);
    box-shadow: 0 1.5rem 3rem rgba(14, 58, 40, .18);
}

.con8ct-landing .landing-menu nav a {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-block-size: 3.25rem;
    padding: .5rem .25rem;
    border-radius: 0;
    border-block-end: 1px solid var(--ls-line-soft);
    font-size: 1rem;
    font-weight: 600;
}

.con8ct-landing .landing-menu nav a:hover {
    background: transparent;
    color: var(--ls-green-800);
}

.con8ct-landing .landing-menu nav a[aria-current="page"] {
    color: var(--ls-green-800);
}

.con8ct-landing .landing-menu nav a[aria-current="page"]::before {
    content: "";
    inline-size: 3px;
    block-size: 1.1rem;
    border-radius: 3px;
    background: var(--ls-gold);
}

.con8ct-landing .landing-menu__label {
    margin: 1.15rem 0 .2rem;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--ls-muted);
}

.con8ct-landing .landing-menu__actions {
    display: grid;
    gap: .6rem;
    margin-block-start: 1.25rem;
}

.con8ct-landing .landing-menu__actions .mk-button,
.con8ct-landing .landing-menu__actions .landing-signin {
    display: inline-flex;
    inline-size: 100%;
    min-block-size: 3rem;
    font-size: .92rem;
}

.con8ct-landing.nav-open {
    overflow: hidden;
}

@media (max-width: 56rem) {
    .con8ct-landing .landing-header__actions > .mk-button {
        display: inline-flex;
    }

    .con8ct-landing .landing-header__actions > .landing-signin {
        display: none;
    }
}

@media (max-width: 30rem) {
    .con8ct-landing .landing-header__actions > .mk-button {
        display: none;
    }
}

/* --- shared page primitives ------------------------------------------------ */
.con8ct-landing .page-hero {
    position: relative;
    overflow: hidden;
    padding-block: clamp(2.5rem, 5vw, 4rem) clamp(2.5rem, 5vw, 4rem);
    background: linear-gradient(180deg, var(--ls-white) 0%, var(--ls-cream) 100%);
}

.con8ct-landing .page-hero--plain {
    background: var(--ls-white);
}

.con8ct-landing .page-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    align-items: center;
    gap: clamp(1.75rem, 4vw, 3.5rem);
}

.con8ct-landing .page-hero--center .page-hero__grid {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    text-align: center;
}

.con8ct-landing .page-hero h1 {
    margin: .55rem 0 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(2rem, 3.9vw, 3.1rem);
    line-height: 1.16;
    letter-spacing: -.015em;
    color: #12251c;
    text-wrap: balance;
}

.con8ct-landing .page-hero h1 em {
    font-style: normal;
    color: var(--ls-green-800);
}

.con8ct-landing .page-hero__lede {
    margin: 1.1rem 0 0;
    max-inline-size: 34rem;
    font-size: .95rem;
    line-height: 1.85;
    color: var(--ls-body);
}

.con8ct-landing .page-hero--center .page-hero__lede {
    margin-inline: auto;
}

.con8ct-landing .page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
    margin-block-start: 1.6rem;
}

.con8ct-landing .page-hero--center .page-actions {
    justify-content: center;
}

/* development note ---------------------------------------------------------- */
.con8ct-landing .dev-note {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-block-start: 1.4rem;
    font-size: .78rem;
    color: var(--ls-muted);
}

.con8ct-landing .dev-note .ic {
    font-size: .95rem;
    color: var(--ls-gold);
}

.con8ct-landing .dev-badge {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .4rem .85rem;
    border: 1px solid var(--ls-gold-200);
    border-radius: 100px;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ls-gold);
}

.con8ct-landing .dev-badge i {
    inline-size: 6px;
    block-size: 6px;
    border-radius: 50%;
    background: var(--ls-gold-400);
}

/* reusable closing CTA band -------------------------------------------------- */
.con8ct-landing .cta-band {
    position: relative;
    overflow: hidden;
    margin-block-start: var(--ls-section);
    padding-block: clamp(2.75rem, 5vw, 4rem);
    background: var(--ls-green-900);
    color: #eaf1e8;
}

.con8ct-landing .cta-band__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(1.5rem, 4vw, 3rem);
}

.con8ct-landing .cta-band h2 {
    margin: 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(1.6rem, 2.6vw, 2.2rem);
    line-height: 1.24;
    color: var(--ls-white);
    text-wrap: balance;
}

.con8ct-landing .cta-band p {
    margin: .7rem 0 0;
    font-size: .88rem;
    color: #c6d6c6;
}

.con8ct-landing .cta-band .page-actions {
    margin-block-start: 0;
}

.con8ct-landing .cta-band .mk-button--secondary {
    background: transparent;
    border-color: rgba(255, 255, 255, .45);
    color: var(--ls-white);
}

.con8ct-landing .cta-band .mk-button--secondary:hover {
    background: rgba(255, 255, 255, .1);
    border-color: var(--ls-white);
}

.con8ct-landing .cta-band .dev-note {
    color: #a9bfa9;
}

.con8ct-landing .cta-band .leaf-watermark {
    opacity: .13;
}

@media (max-width: 56rem) {
    .con8ct-landing .page-hero__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .con8ct-landing .cta-band__inner {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ==========================================================================
   Solutions page
   ========================================================================== */
.con8ct-landing .sol-signals {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(1.25rem, 3vw, 2.5rem);
    margin: 2rem 0 0;
    padding: 0;
    list-style: none;
}

.con8ct-landing .sol-signals li {
    display: grid;
    justify-items: start;
    gap: .55rem;
    max-inline-size: 8.5rem;
    font-size: .74rem;
    font-weight: 600;
    line-height: 1.5;
    color: var(--ls-body);
}

.con8ct-landing .sol-signals .signal-mark {
    display: grid;
    place-items: center;
    inline-size: 2.9rem;
    block-size: 2.9rem;
    border: 1px solid var(--ls-line);
    border-radius: 50%;
    background: var(--ls-white);
    color: var(--ls-green-800);
}

.con8ct-landing .sol-signals .ic {
    font-size: 1.35rem;
}

/* solution card grid -------------------------------------------------------- */
.con8ct-landing .sol-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1.1rem;
    margin-block-start: 2.5rem;
}

.con8ct-landing .sol-card {
    display: flex;
    flex-direction: column;
    gap: .55rem;
    padding: 1.5rem 1.25rem 1.35rem;
    border: 1px solid var(--ls-line);
    border-radius: var(--ls-radius);
    background: var(--ls-white);
    box-shadow: var(--ls-shadow);
    text-align: center;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.con8ct-landing .sol-card:hover {
    transform: translateY(-3px);
    border-color: var(--ls-sage);
    box-shadow: 0 1rem 2.25rem rgba(14, 58, 40, .12);
}

.con8ct-landing .sol-card__mark {
    display: grid;
    place-items: center;
    inline-size: 3rem;
    block-size: 3rem;
    margin-inline: auto;
    border-radius: 50%;
    background: #eef3ea;
    color: var(--ls-green-800);
}

.con8ct-landing .sol-card__mark .ic {
    font-size: 1.4rem;
}

.con8ct-landing .sol-card h3 {
    margin: .35rem 0 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: 1.02rem;
    line-height: 1.3;
    color: #12251c;
}

.con8ct-landing .sol-card p {
    margin: 0;
    font-size: .76rem;
    line-height: 1.75;
    color: var(--ls-body);
}

.con8ct-landing .sol-card .role-link,
.con8ct-landing .card-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    margin-block-start: auto;
    padding-block-start: .85rem;
    font-size: .76rem;
    font-weight: 700;
    color: var(--ls-green-800);
    text-decoration: none;
}

.con8ct-landing .card-link .ic {
    font-size: .85rem;
    transition: transform .18s ease;
}

.con8ct-landing .card-link:hover .ic {
    transform: translateX(3px);
}

/* mission plate ------------------------------------------------------------- */
.con8ct-landing .mission-shell {
    display: grid;
    grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
    gap: clamp(1.25rem, 3vw, 2.5rem);
    align-items: stretch;
}

.con8ct-landing .mission-card {
    display: grid;
    align-content: end;
    gap: .7rem;
    padding: clamp(1.5rem, 2.6vw, 2.1rem);
    border-radius: var(--ls-radius);
    background: linear-gradient(165deg, var(--ls-green-900) 0%, #16553c 100%);
    color: #dfeadd;
}

.con8ct-landing .mission-card p:first-child {
    margin: 0;
    font-size: .8rem;
    color: #b9cdb8;
}

.con8ct-landing .mission-card h3 {
    margin: 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(1.4rem, 2.2vw, 1.85rem);
    line-height: 1.25;
    color: var(--ls-white);
}

.con8ct-landing .mission-card p:last-child {
    margin: .3rem 0 0;
    font-size: .8rem;
    line-height: 1.8;
}

.con8ct-landing .reason-list {
    display: grid;
    align-content: center;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.con8ct-landing .reason-list > li {
    display: grid;
    grid-template-columns: 2.6rem minmax(0, 1fr);
    gap: 1rem;
    padding-block: 1.05rem;
    border-block-start: 1px solid var(--ls-line-soft);
}

.con8ct-landing .reason-list > li:first-child {
    border-block-start: 0;
    padding-block-start: 0;
}

.con8ct-landing .reason-list .ic {
    font-size: 1.5rem;
    color: var(--ls-green-800);
}

.con8ct-landing .reason-list strong {
    display: block;
    font-size: .88rem;
    color: #12251c;
}

.con8ct-landing .reason-list span {
    display: block;
    margin-block-start: .2rem;
    font-size: .78rem;
    line-height: 1.7;
    color: var(--ls-body);
}

.con8ct-landing .section-label {
    margin: 0 0 1.1rem;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ls-gold);
}

/* role strip ---------------------------------------------------------------- */
.con8ct-landing .role-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.1rem;
    margin-block-start: 2.25rem;
}

.con8ct-landing .role-tile {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: 1.5rem 1.35rem 1.35rem;
    border: 1px solid var(--ls-line);
    border-radius: var(--ls-radius);
    background: var(--ls-white);
    scroll-margin-block-start: 6rem;
    transition: transform .18s ease, box-shadow .18s ease;
}

.con8ct-landing .role-tile:hover {
    transform: translateY(-3px);
    box-shadow: 0 1rem 2.25rem rgba(14, 58, 40, .12);
}

.con8ct-landing .role-tile::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    block-size: 3px;
    border-end-start-radius: var(--ls-radius);
    border-end-end-radius: var(--ls-radius);
    background: var(--role-tint, var(--ls-sage));
}

.con8ct-landing .role-tile--admin { --role-tint: var(--ls-green-900); }
.con8ct-landing .role-tile--teacher { --role-tint: var(--ls-sage); }
.con8ct-landing .role-tile--parent { --role-tint: var(--ls-gold-400); }
.con8ct-landing .role-tile--student { --role-tint: #5c7f8c; }

.con8ct-landing .role-tile__mark {
    display: grid;
    place-items: center;
    inline-size: 2.8rem;
    block-size: 2.8rem;
    border-radius: .8rem;
    background: #eef3ea;
    color: var(--ls-green-800);
}

.con8ct-landing .role-tile__mark .ic {
    font-size: 1.35rem;
}

.con8ct-landing .role-tile h3 {
    margin: .5rem 0 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: 1.15rem;
    color: #12251c;
}

.con8ct-landing .role-tile p {
    margin: 0;
    font-size: .78rem;
    line-height: 1.75;
    color: var(--ls-body);
}

.con8ct-landing .role-tile ul {
    display: grid;
    gap: .4rem;
    margin: .55rem 0 0;
    padding: 0;
    list-style: none;
}

.con8ct-landing .role-tile li {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    font-size: .78rem;
    color: var(--ls-body);
}

.con8ct-landing .role-tile li .ic {
    flex: 0 0 auto;
    margin-block-start: .18rem;
    font-size: .85rem;
    color: var(--role-tint, var(--ls-sage));
}

@media (max-width: 78rem) {
    .con8ct-landing .sol-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 64rem) {
    .con8ct-landing .mission-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .con8ct-landing .role-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 48rem) {
    .con8ct-landing .sol-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 34rem) {
    .con8ct-landing .sol-grid,
    .con8ct-landing .role-strip {
        grid-template-columns: minmax(0, 1fr);
    }

    .con8ct-landing .sol-signals li {
        max-inline-size: 6.5rem;
    }
}

/* ==========================================================================
   Pricing page
   ========================================================================== */
.con8ct-landing .price-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
    align-items: stretch;
    margin-block-start: 2.75rem;
}

.con8ct-landing .price-card {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 1.9rem 1.5rem 1.75rem;
    border: 1px solid var(--ls-line);
    border-radius: var(--ls-radius);
    background: var(--ls-white);
    box-shadow: var(--ls-shadow);
    text-align: center;
}

.con8ct-landing .price-card--best {
    border-color: var(--ls-gold-200);
    box-shadow: 0 1rem 2.5rem rgba(183, 130, 43, .16);
}

.con8ct-landing .price-flag {
    position: absolute;
    inset-block-start: -.85rem;
    inset-inline: 1rem;
    padding: .35rem .6rem;
    border-radius: .35rem;
    background: var(--ls-gold);
    color: #fff;
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.con8ct-landing .price-card__head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .8rem;
    padding-block-end: 1.1rem;
    border-block-end: 1px solid var(--ls-gold-200);
}

.con8ct-landing .price-card__mark {
    display: grid;
    place-items: center;
    inline-size: 2.9rem;
    block-size: 2.9rem;
    border: 1px solid var(--ls-line);
    border-radius: 50%;
    background: #f4f6f1;
    color: var(--ls-green-800);
}

.con8ct-landing .price-card__mark .ic {
    font-size: 1.4rem;
}

.con8ct-landing .price-band {
    margin: 0;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    line-height: 1.5;
    color: var(--ls-body);
    text-align: start;
}

.con8ct-landing .price-band b {
    display: block;
    font-family: var(--ls-serif);
    font-size: 1.55rem;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    color: #12251c;
}

.con8ct-landing .price-amount {
    margin: 1.35rem 0 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(2.1rem, 3vw, 2.7rem);
    line-height: 1;
    letter-spacing: -.01em;
    color: #12251c;
    font-variant-numeric: tabular-nums;
}

.con8ct-landing .price-cycle {
    margin: .45rem 0 0;
    font-size: .8rem;
    color: var(--ls-muted);
}

.con8ct-landing .price-note {
    margin: 1.15rem 0 0;
    font-size: .8rem;
    line-height: 1.8;
    color: var(--ls-body);
}

/* included strip ------------------------------------------------------------ */
.con8ct-landing .included-strip {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 2.6fr);
    align-items: center;
    gap: clamp(1.25rem, 3vw, 2.5rem);
    margin-block-start: 1.5rem;
    padding: clamp(1.4rem, 2.4vw, 1.9rem);
    border: 1px solid var(--ls-line-soft);
    border-radius: var(--ls-radius);
    background: var(--ls-panel);
}

.con8ct-landing .included-strip__title {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.con8ct-landing .included-strip__title .disc {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    inline-size: 3.2rem;
    block-size: 3.2rem;
    border-radius: 50%;
    background: var(--ls-green-800);
    color: #fff;
}

.con8ct-landing .included-strip__title .disc .ic {
    font-size: 1.5rem;
    stroke-width: 2.2;
}

.con8ct-landing .included-strip__title h2 {
    margin: 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(1.15rem, 1.9vw, 1.45rem);
    line-height: 1.3;
    color: #12251c;
}

.con8ct-landing .included-list {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
}

.con8ct-landing .included-list li {
    display: grid;
    justify-items: center;
    gap: .55rem;
    padding-inline: .75rem;
    border-inline-start: 1px solid var(--ls-line);
    font-size: .74rem;
    line-height: 1.55;
    text-align: center;
    color: var(--ls-body);
}

.con8ct-landing .included-list li:first-child {
    border-inline-start: 0;
}

.con8ct-landing .included-list .ic {
    font-size: 1.6rem;
    color: var(--ls-green-800);
}

/* promise cards ------------------------------------------------------------- */
.con8ct-landing .info-duo {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    gap: clamp(1.25rem, 3vw, 2.5rem);
    margin-block-start: 1.25rem;
    padding: clamp(1.4rem, 2.4vw, 1.9rem);
    border: 1px solid var(--ls-line-soft);
    border-radius: var(--ls-radius);
    background: var(--ls-panel);
}

.con8ct-landing .info-item {
    display: grid;
    grid-template-columns: 3.2rem minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.con8ct-landing .info-item + .info-item {
    border-inline-start: 1px solid var(--ls-line);
    padding-inline-start: clamp(1.25rem, 3vw, 2.5rem);
}

.con8ct-landing .info-item .disc {
    display: grid;
    place-items: center;
    inline-size: 3.2rem;
    block-size: 3.2rem;
    border-radius: 50%;
    background: #e9efe6;
    color: var(--ls-green-800);
}

.con8ct-landing .info-item .disc .ic {
    font-size: 1.45rem;
}

.con8ct-landing .info-item h3 {
    margin: .25rem 0 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: 1.15rem;
    color: #12251c;
}

.con8ct-landing .info-item p {
    margin: .4rem 0 0;
    font-size: .8rem;
    line-height: 1.8;
    color: var(--ls-body);
}

/* long run + question box ---------------------------------------------------- */
.con8ct-landing .ask-box {
    display: grid;
    grid-template-columns: 2.9rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
    border-radius: var(--ls-radius-sm);
    background: #eef2ea;
}

.con8ct-landing .ask-box .ic {
    font-size: 1.6rem;
    color: var(--ls-green-800);
}

.con8ct-landing .ask-box strong {
    display: block;
    font-size: .88rem;
    color: #12251c;
}

.con8ct-landing .ask-box span {
    display: block;
    margin-block-start: .15rem;
    font-size: .78rem;
    color: var(--ls-body);
}

.con8ct-landing .fineprint {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.5rem 3rem;
    margin-block-start: 1.75rem;
    font-size: .72rem;
    color: var(--ls-muted);
    text-align: center;
}

@media (max-width: 78rem) {
    .con8ct-landing .price-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 64rem) {
    .con8ct-landing .included-strip,
    .con8ct-landing .info-duo {
        grid-template-columns: minmax(0, 1fr);
    }

    .con8ct-landing .info-item + .info-item {
        border-inline-start: 0;
        border-block-start: 1px solid var(--ls-line);
        padding-inline-start: 0;
        padding-block-start: 1.25rem;
    }
}

@media (max-width: 48rem) {
    .con8ct-landing .included-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.25rem 0;
    }

    .con8ct-landing .included-list li:nth-child(odd) {
        border-inline-start: 0;
    }

    .con8ct-landing .ask-box {
        grid-template-columns: 2.9rem minmax(0, 1fr);
    }

    .con8ct-landing .ask-box .mk-button {
        grid-column: 1 / -1;
    }
}

@media (max-width: 34rem) {
    .con8ct-landing .price-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ==========================================================================
   About Us page
   ========================================================================== */
.con8ct-landing .about-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    align-items: center;
    gap: clamp(1.75rem, 4vw, 3rem);
}

.con8ct-landing .about-rule {
    inline-size: 3.5rem;
    block-size: 2px;
    margin: 1.4rem 0 0;
    border: 0;
    background: var(--ls-gold-400);
}

.con8ct-landing .about-stage {
    position: relative;
    min-block-size: clamp(17rem, 30vw, 22rem);
    border-radius: var(--ls-radius-lg);
    overflow: hidden;
    background:
        radial-gradient(120% 90% at 78% 18%, rgba(232, 211, 166, .55) 0%, rgba(232, 211, 166, 0) 62%),
        linear-gradient(160deg, #1b5a3d 0%, #0e3a28 58%, #0b3324 100%);
}

.con8ct-landing .about-stage .leaf-watermark {
    opacity: .16;
}

.con8ct-landing .about-stage__mark {
    position: absolute;
    inset-block-start: clamp(1.5rem, 3vw, 2.5rem);
    inset-inline-start: clamp(1.5rem, 3vw, 2.5rem);
    display: grid;
    place-items: center;
    inline-size: 4.5rem;
    block-size: 4.5rem;
    border: 1px solid rgba(232, 211, 166, .5);
    border-radius: 50%;
    color: var(--ls-gold-200);
}

.con8ct-landing .about-stage__mark .ic {
    font-size: 2.1rem;
}

.con8ct-landing .about-note {
    position: absolute;
    inset-block-end: clamp(1rem, 2.5vw, 1.75rem);
    inset-inline: clamp(1rem, 2.5vw, 1.75rem);
    display: grid;
    grid-template-columns: 3.2rem minmax(0, 1fr);
    gap: 1rem;
    padding: 1.15rem 1.25rem;
    border-radius: var(--ls-radius);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 1rem 2.5rem rgba(11, 51, 36, .28);
}

.con8ct-landing .about-note .disc {
    display: grid;
    place-items: center;
    inline-size: 3.2rem;
    block-size: 3.2rem;
    border-radius: 50%;
    background: #dfe7d9;
    color: var(--ls-green-800);
}

.con8ct-landing .about-note .disc .ic {
    font-size: 1.5rem;
}

.con8ct-landing .about-note h2 {
    margin: 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: 1.05rem;
    line-height: 1.35;
    color: #12251c;
}

.con8ct-landing .about-note p {
    margin: .4rem 0 0;
    font-size: .76rem;
    line-height: 1.75;
    color: var(--ls-body);
}

/* faith statement ----------------------------------------------------------- */
.con8ct-landing .faith-plate {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: center;
    padding: clamp(1.75rem, 3vw, 2.5rem) clamp(1.5rem, 3vw, 2.75rem);
}

.con8ct-landing .faith-plate h2 {
    margin: 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(1.3rem, 2.1vw, 1.7rem);
    color: #12251c;
}

.con8ct-landing .faith-plate p {
    margin: 1rem 0 0;
    font-size: .82rem;
    line-height: 1.85;
    color: var(--ls-body);
}

.con8ct-landing .faith-quote {
    border-inline-start: 2px solid var(--ls-gold-200);
    padding-inline-start: clamp(1.25rem, 3vw, 2.25rem);
}

.con8ct-landing .faith-quote blockquote {
    margin: 0;
    font-family: var(--ls-serif);
    font-style: italic;
    font-size: clamp(.95rem, 1.6vw, 1.1rem);
    line-height: 1.7;
    color: #1c3b2c;
}

.con8ct-landing .faith-quote cite {
    display: block;
    margin-block-start: .8rem;
    font-family: var(--ls-serif);
    font-style: italic;
    font-size: .82rem;
    color: var(--ls-muted);
}

/* story --------------------------------------------------------------------- */
.con8ct-landing .story-grid {
    display: grid;
    grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: center;
}

.con8ct-landing .story-copy h2 {
    margin: 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    line-height: 1.25;
    color: #12251c;
}

.con8ct-landing .story-copy p {
    margin: 1rem 0 0;
    font-size: .82rem;
    line-height: 1.9;
    color: var(--ls-body);
}

.con8ct-landing .pillar-stack {
    display: grid;
    gap: 1rem;
}

.con8ct-landing .pillar {
    display: grid;
    grid-template-columns: 3.4rem minmax(0, 1fr);
    gap: 1.15rem;
    align-items: start;
    padding: clamp(1.25rem, 2.2vw, 1.75rem);
    border-radius: var(--ls-radius);
    background: var(--ls-panel);
}

.con8ct-landing .pillar .disc {
    display: grid;
    place-items: center;
    inline-size: 3.4rem;
    block-size: 3.4rem;
    border-radius: 50%;
    background: var(--ls-white);
    color: var(--ls-green-800);
}

.con8ct-landing .pillar .disc .ic {
    font-size: 1.55rem;
}

.con8ct-landing .pillar h3 {
    margin: .3rem 0 0;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: 1.2rem;
    color: #12251c;
}

.con8ct-landing .pillar p {
    margin: .45rem 0 0;
    font-size: .8rem;
    line-height: 1.85;
    color: var(--ls-body);
}

/* purpose ------------------------------------------------------------------- */
.con8ct-landing .purpose-shell {
    display: grid;
    grid-template-columns: 5.5rem minmax(0, 1.2fr) minmax(0, 1.4fr);
    gap: clamp(1.25rem, 3vw, 2.25rem);
    align-items: center;
}

.con8ct-landing .purpose-shell > .disc {
    display: grid;
    place-items: center;
    inline-size: 5.5rem;
    block-size: 5.5rem;
    border-radius: 50%;
    background: #b9c7ab;
    color: var(--ls-green-950);
}

.con8ct-landing .purpose-shell > .disc .ic {
    font-size: 2.4rem;
}

.con8ct-landing .purpose-shell h2 {
    margin: 0 0 .8rem;
    font-family: var(--ls-serif);
    font-weight: 500;
    font-size: clamp(1.3rem, 2.1vw, 1.7rem);
    color: #12251c;
}

.con8ct-landing .purpose-shell p {
    margin: 0;
    font-size: .8rem;
    line-height: 1.9;
    color: var(--ls-body);
}

.con8ct-landing .purpose-points {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
}

.con8ct-landing .purpose-points li {
    display: grid;
    justify-items: center;
    gap: .5rem;
    padding-inline: .8rem;
    border-inline-start: 1px solid var(--ls-line);
    text-align: center;
}

.con8ct-landing .purpose-points li:first-child {
    border-inline-start: 0;
}

.con8ct-landing .purpose-points .ic {
    font-size: 1.6rem;
    color: var(--ls-green-800);
}

.con8ct-landing .purpose-points strong {
    font-size: .76rem;
    color: #12251c;
}

.con8ct-landing .purpose-points span {
    font-size: .72rem;
    line-height: 1.6;
    color: var(--ls-body);
}

@media (max-width: 64rem) {
    .con8ct-landing .about-hero__grid,
    .con8ct-landing .faith-plate,
    .con8ct-landing .story-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .con8ct-landing .faith-quote {
        border-inline-start: 0;
        border-block-start: 2px solid var(--ls-gold-200);
        padding-inline-start: 0;
        padding-block-start: 1.25rem;
    }

    .con8ct-landing .purpose-shell {
        grid-template-columns: 4.5rem minmax(0, 1fr);
    }

    .con8ct-landing .purpose-points {
        grid-column: 1 / -1;
    }
}

@media (max-width: 34rem) {
    .con8ct-landing .about-note {
        position: static;
        margin: 1rem;
    }

    .con8ct-landing .about-stage {
        min-block-size: 0;
        padding-block-start: 7rem;
    }

    .con8ct-landing .purpose-points {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.25rem 0;
    }

    .con8ct-landing .purpose-points li:nth-child(odd) {
        border-inline-start: 0;
    }
}

/* --- botanical watermarks: page-scale overrides ----------------------------- */
.con8ct-landing .page-hero .leaf-watermark--hero-left {
    inline-size: 9rem;
    inset-block-start: auto;
    inset-block-end: -2.5rem;
    inset-inline-start: -2.5rem;
    opacity: .28;
}

.con8ct-landing .page-hero .leaf-watermark--hero-right {
    inline-size: 10rem;
    inset-block-start: -2rem;
    inset-inline-end: -2.5rem;
    opacity: .28;
}

.con8ct-landing .cta-band .leaf-watermark {
    inline-size: 11rem;
}

.con8ct-landing .cta-band .leaf-watermark--hero-left {
    inset-block-start: auto;
    inset-block-end: -3rem;
    inset-inline-start: -2rem;
}

.con8ct-landing .cta-band .leaf-watermark--hero-right {
    inset-block-start: -2.5rem;
    inset-inline-end: -2rem;
}

.con8ct-landing .mission-card .leaf-watermark {
    inline-size: 8rem;
    inset-inline-start: auto;
    inset-inline-end: -1.75rem;
    inset-block-end: -2.5rem;
    opacity: .16;
}

.con8ct-landing .about-stage .leaf-watermark {
    inline-size: 12rem;
    inset-block-start: -2.5rem;
    inset-inline-end: -2.5rem;
}

.con8ct-landing .cta-band {
    margin-block-start: clamp(1.5rem, 3vw, 2.75rem);
}

/* --- two-device stage (Solutions hero) -------------------------------------- */
.con8ct-landing .landing-devices--duo {
    min-block-size: 24rem;
}

.con8ct-landing .landing-devices--duo .laptop-wrap {
    inset-inline-start: auto;
    inset-inline-end: 0;
    inline-size: 82%;
}

.con8ct-landing .landing-devices--duo .device-phone {
    inset-inline-start: 0;
    inset-block-end: 4%;
    inline-size: 27%;
}

@media (max-width: 48rem) {
    .con8ct-landing .landing-devices--duo {
        min-block-size: 0;
    }

    .con8ct-landing .landing-devices--duo .laptop-wrap {
        inset-inline-end: auto;
        inline-size: 100%;
    }
}

/* --- mobile sheet: buttons keep their own colours --------------------------- */
.con8ct-landing .landing-menu__actions a {
    border-block-end: 0;
    justify-content: center;
}

.con8ct-landing .landing-menu__actions .mk-button--primary {
    color: var(--ls-white);
}

.con8ct-landing .landing-menu__actions .mk-button--gold {
    color: #40300f;
}

.con8ct-landing .landing-menu__actions .mk-button--secondary,
.con8ct-landing .landing-menu__actions .landing-signin {
    color: var(--ls-green-900);
}

.con8ct-landing .landing-menu__actions a[aria-current="page"]::before {
    content: none;
}

/* centred page heroes carry their botanicals at the top ---------------------- */
.con8ct-landing .page-hero--center .leaf-watermark--hero-left {
    inset-block-start: 1.5rem;
    inset-block-end: auto;
}

/* ==========================================================================
   Shared header pieces on the public site
   The profile toggle comes from fragments/site_header.html and is styled in
   con8ct.css; these rules settle it into the landing header's proportions.
   ========================================================================== */
.con8ct-landing .account-menu > summary {
    min-block-size: 2.6rem;
    padding: .22rem .6rem .22rem .28rem;
    border: 1px solid #d3dbd4;
    border-radius: .45rem;
    background: var(--ls-white);
    box-shadow: none;
}

.con8ct-landing .account-menu > summary:hover,
.con8ct-landing .account-menu[open] > summary {
    border-color: var(--ls-green-800);
    background: var(--ls-white);
}

.con8ct-landing .account-menu__avatar {
    inline-size: 1.95rem;
    block-size: 1.95rem;
    background: var(--ls-panel);
    color: var(--ls-green-800);
}

.con8ct-landing .account-menu__who strong {
    color: var(--ls-ink);
    font-size: .82rem;
    font-weight: 700;
}

.con8ct-landing .account-menu__who small {
    color: var(--ls-muted);
    font-size: .68rem;
}

.con8ct-landing .account-menu__caret {
    stroke: var(--ls-muted);
}

.con8ct-landing .account-menu__panel {
    border: 1px solid var(--ls-line);
    border-radius: .7rem;
    background: var(--ls-white);
    box-shadow: 0 1rem 3rem rgba(14, 58, 40, .14);
}

.con8ct-landing .account-menu__panel > a {
    font-size: .85rem;
    color: var(--ls-ink);
}

.con8ct-landing .account-menu__panel > a:hover {
    background: var(--ls-panel);
    color: var(--ls-green-800);
}

/* Footer wordmark now carries the same emblem as every other surface. */
.con8ct-landing .mk-brand--footer {
    display: flex;
    align-items: center;
    gap: .8rem;
}

.con8ct-landing .mk-brand-symbol--footer {
    inline-size: 2.75rem;
    block-size: 2.75rem;
    object-fit: contain;
}