:root {
    --green-900: #184f3a;
    --green-800: #1d684a;
    --green-700: #237a57;
    --green-600: #2f936b;
    --green-300: #9fdfbd;
    --green-200: #c8ead8;
    --green-100: #ddf3e8;
    --green-50: #f0f8f4;
    --ink: #17231d;
    --ink-soft: #4f6258;
    --line: #dce8e1;
    --surface: #ffffff;
    --background: #f7faf8;
    --shadow-sm: 0 12px 35px rgba(30, 73, 51, 0.08);
    --shadow-lg: 0 28px 70px rgba(30, 73, 51, 0.14);
    --radius-sm: 12px;
    --radius-md: 20px;
    --radius-lg: 30px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    color: var(--ink);
    background: var(--background);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

body.menu-open { overflow: hidden; }

a { color: inherit; }

button, a { -webkit-tap-highlight-color: transparent; }

.container {
    width: min(1160px, calc(100% - 40px));
    margin-inline: auto;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: fixed;
    z-index: 1000;
    top: 12px;
    left: 12px;
    padding: 10px 16px;
    color: white;
    background: var(--green-900);
    border-radius: 8px;
    transform: translateY(-160%);
}

.skip-link:focus { transform: translateY(0); }

.site-header {
    position: sticky;
    z-index: 100;
    top: 0;
    border-bottom: 1px solid rgba(220, 232, 225, 0.82);
    background: rgba(247, 250, 248, 0.9);
    backdrop-filter: blur(16px);
}

.header-inner {
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--ink);
    font-size: 20px;
    font-weight: 760;
    letter-spacing: -0.04em;
    text-decoration: none;
}

.brand-mark {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    color: white;
    background: var(--green-700);
    border-radius: 11px;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0;
    box-shadow: 0 8px 20px rgba(35, 122, 87, 0.2);
}

.brand-accent { color: var(--green-700); }

.main-nav {
    display: flex;
    align-items: center;
    gap: 26px;
}

.main-nav a {
    color: var(--ink-soft);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s ease;
}

.main-nav a:hover, .main-nav a:focus-visible { color: var(--green-700); }

.main-nav .nav-login { color: var(--ink); margin-left: 8px; }

.button {
    min-height: 48px;
    padding: 12px 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: white;
    background: var(--green-700);
    border: 1px solid var(--green-700);
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(35, 122, 87, 0.17);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.button:hover, .button:focus-visible {
    color: white;
    background: var(--green-800);
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(35, 122, 87, 0.23);
}

.button-small { min-height: 40px; padding: 10px 16px; font-size: 13px; border-radius: 10px; }
.main-nav .button, .main-nav .button:hover { color: white; }

.button-secondary {
    color: var(--ink);
    background: transparent;
    border-color: var(--line);
    box-shadow: none;
}

.button-secondary:hover, .button-secondary:focus-visible {
    color: var(--green-800);
    background: var(--green-50);
    border-color: var(--green-200);
    box-shadow: none;
}

.nav-toggle { display: none; }

.hero {
    position: relative;
    min-height: 690px;
    display: grid;
    align-items: center;
    overflow: hidden;
    background: linear-gradient(180deg, #fbfdfc 0%, var(--background) 100%);
}

.hero-grid {
    position: relative;
    z-index: 2;
    padding-block: 90px 105px;
    display: grid;
    grid-template-columns: 1.02fr 0.98fr;
    align-items: center;
    gap: 80px;
}

.hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    pointer-events: none;
}

.hero-orb-one {
    width: 450px;
    height: 450px;
    top: -240px;
    right: -90px;
    background: rgba(159, 223, 189, 0.22);
}

.hero-orb-two {
    width: 220px;
    height: 220px;
    bottom: -120px;
    left: -70px;
    background: rgba(200, 234, 216, 0.35);
}

.eyebrow {
    margin: 0 0 18px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--green-700);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.eyebrow > span { width: 24px; height: 2px; background: currentColor; border-radius: 10px; }

h1, h2, h3, p { margin-top: 0; }

h1 {
    max-width: 690px;
    margin-bottom: 24px;
    font-size: clamp(44px, 5.3vw, 72px);
    line-height: 1.04;
    letter-spacing: -0.057em;
}

.hero-text {
    max-width: 610px;
    margin-bottom: 30px;
    color: var(--ink-soft);
    font-size: 19px;
    line-height: 1.7;
}

.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }

.hero-points {
    margin: 32px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 22px;
    list-style: none;
    color: var(--ink-soft);
    font-size: 13px;
    font-weight: 600;
}

.hero-points li { display: flex; align-items: center; gap: 7px; }
.hero-points li span { color: var(--green-700); font-weight: 900; }

.platform-visual {
    position: relative;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(200, 234, 216, 0.9);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    transform: rotate(1.2deg);
}

.platform-visual::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 28px -22px -22px 25px;
    background: var(--green-100);
    border-radius: var(--radius-lg);
}

.visual-header {
    min-height: 58px;
    padding: 0 20px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    color: #718078;
    border-bottom: 1px solid var(--line);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11px;
}

.window-dots { display: flex; gap: 5px; }
.window-dots span { width: 8px; height: 8px; background: var(--green-200); border-radius: 50%; }
.window-dots span:nth-child(2) { background: var(--green-300); }
.window-dots span:nth-child(3) { background: var(--green-600); }

.live-state { justify-self: end; display: flex; align-items: center; gap: 6px; color: var(--green-700); }
.live-state i { width: 7px; height: 7px; background: var(--green-600); border-radius: 50%; box-shadow: 0 0 0 4px var(--green-100); }

.visual-content { padding: 30px; }

.api-label {
    width: fit-content;
    margin: 0 auto;
    padding: 9px 16px;
    color: var(--green-800);
    background: var(--green-50);
    border: 1px solid var(--green-200);
    border-radius: 9px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.09em;
}

.connector { width: 2px; height: 29px; margin: 0 auto; background: var(--green-200); }
.connector span { display: block; width: 8px; height: 8px; background: var(--green-600); border-radius: 50%; transform: translate(-3px, 10px); }

.service-stack { display: grid; gap: 10px; }

.service-row {
    padding: 13px 15px;
    display: grid;
    grid-template-columns: 38px 1fr auto;
    align-items: center;
    gap: 12px;
    background: white;
    border: 1px solid var(--line);
    border-radius: 13px;
}

.service-row.active { border-color: var(--green-300); box-shadow: 0 7px 22px rgba(35, 122, 87, 0.08); }

.mini-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--green-800);
    background: var(--green-100);
    border-radius: 10px;
    font-size: 10px;
    font-weight: 800;
}

.service-row strong, .service-row small { display: block; }
.service-row strong { font-size: 13px; line-height: 1.3; }
.service-row small { margin-top: 2px; color: #7a8981; font-size: 10px; }
.service-check { color: var(--green-600); font-weight: 900; }

.code-line {
    margin-top: 15px;
    padding: 12px 14px;
    color: #a6bcb0;
    background: #1a2921;
    border-radius: 10px;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px;
}

.code-line span { color: var(--green-300); font-weight: 800; }
.code-line b { float: right; color: #8ad4aa; }

.section { padding-block: 110px; }

.section-heading {
    margin-bottom: 44px;
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    align-items: end;
    gap: 80px;
}

.section-heading h2, .center-heading h2, .trust-copy h2, .human-copy h2, .cta-inner h2 {
    margin-bottom: 0;
    font-size: clamp(34px, 4vw, 50px);
    line-height: 1.12;
    letter-spacing: -0.045em;
}

.section-heading > p, .center-heading > p, .human-copy > p, .trust-copy > p {
    margin-bottom: 0;
    color: var(--ink-soft);
    font-size: 16px;
    line-height: 1.75;
}

.services-section { background: white; }

.services-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 18px;
}

.service-card {
    grid-column: span 2;
    min-height: 370px;
    padding: 26px;
    background: var(--background);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.service-card:nth-child(4) { grid-column: 2 / span 2; }
.service-card.language-card { grid-column: 4 / span 2; }

.service-card:hover { transform: translateY(-5px); border-color: var(--green-300); box-shadow: var(--shadow-sm); }
.service-card.featured { background: var(--green-50); border-color: var(--green-200); }

.card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

.service-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: var(--green-700);
    background: white;
    border: 1px solid var(--green-200);
    border-radius: 14px;
}

.service-icon svg { width: 24px; height: 24px; fill: currentColor; }

.model-tag {
    padding: 5px 9px;
    color: var(--green-800);
    background: var(--green-100);
    border-radius: 30px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.model-tag.usage { color: #6c5a1d; background: #f3edda; }
.model-tag.specialized { color: #62517b; background: #ece7f3; }
.model-tag.pending { color: #725a13; background: #fff0bd; }

.service-card h3 { margin: 24px 0 10px; font-size: 20px; letter-spacing: -0.025em; }
.service-card p { min-height: 68px; margin-bottom: 18px; color: var(--ink-soft); font-size: 14px; line-height: 1.65; }
.service-card ul { margin: 0; padding: 16px 0 0; border-top: 1px solid var(--line); list-style: none; }
.service-card li { padding: 3px 0; color: #586b61; font-size: 12px; }
.service-card li::before { content: "·"; margin-right: 8px; color: var(--green-600); font-weight: 900; }

.center-heading { max-width: 700px; margin: 0 auto 52px; text-align: center; }
.center-heading .eyebrow { justify-content: center; }
.center-heading h2 { margin-bottom: 18px; }

.steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }

.step-card {
    position: relative;
    min-height: 240px;
    padding: 32px;
    overflow: hidden;
    background: white;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
}

.step-card:not(:last-child)::after {
    content: "→";
    position: absolute;
    z-index: 3;
    top: 50%;
    right: -17px;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    color: var(--green-700);
    background: var(--background);
    border: 1px solid var(--green-200);
    border-radius: 50%;
}

.step-number { color: var(--green-700); font-family: ui-monospace, monospace; font-size: 12px; font-weight: 800; }
.step-card h3 { margin: 48px 0 10px; font-size: 20px; }
.step-card p { margin: 0; color: var(--ink-soft); font-size: 14px; }

.trust-section { color: white; background: var(--green-900); }
.trust-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 100px; align-items: center; }
.eyebrow.light { color: var(--green-300); }
.trust-copy h2 { margin-bottom: 24px; }
.trust-copy > p { color: rgba(255,255,255,0.68); }
.text-link { margin-top: 30px; display: inline-flex; gap: 10px; color: var(--green-300); font-weight: 700; text-decoration: none; }

.trust-list { border-top: 1px solid rgba(255,255,255,0.14); }
.trust-list article { padding: 24px 4px; display: grid; grid-template-columns: 50px 1fr; gap: 14px; border-bottom: 1px solid rgba(255,255,255,0.14); }
.trust-list article > span { color: var(--green-300); font-family: ui-monospace, monospace; font-size: 11px; }
.trust-list h3 { margin: 0 0 5px; font-size: 17px; }
.trust-list p { margin: 0; color: rgba(255,255,255,0.62); font-size: 13px; }

.human-section { background: white; }
.human-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 100px; align-items: center; }

.human-visual {
    position: relative;
    min-height: 390px;
    display: grid;
    place-items: center;
    background: var(--green-50);
    border: 1px solid var(--green-200);
    border-radius: var(--radius-lg);
}

.human-circle {
    width: 180px;
    height: 180px;
    display: grid;
    place-items: center;
    background: white;
    border: 1px solid var(--green-200);
    border-radius: 50%;
    box-shadow: var(--shadow-sm);
}

.human-circle span { color: var(--green-700); font-size: 80px; font-weight: 800; letter-spacing: -0.08em; }

.human-note {
    position: absolute;
    padding: 11px 15px;
    color: var(--green-900);
    background: rgba(255,255,255,0.95);
    border: 1px solid var(--green-200);
    border-radius: 11px;
    box-shadow: var(--shadow-sm);
    font-size: 12px;
    font-weight: 700;
}

.note-one { top: 54px; right: 38px; }
.note-two { bottom: 55px; left: 30px; }
.human-copy h2 { margin-bottom: 24px; }
.values-row { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 10px; }
.values-row span { padding: 8px 13px; color: var(--green-800); background: var(--green-50); border: 1px solid var(--green-200); border-radius: 30px; font-size: 12px; font-weight: 700; }

.final-cta { padding-block: 80px; color: white; background: var(--green-700); }
.cta-inner { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 60px; }
.cta-inner h2 { max-width: 740px; font-size: clamp(32px, 4vw, 48px); }
.cta-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.button-light { color: var(--green-900); background: white; border-color: white; box-shadow: none; }
.button-light:hover { color: var(--green-900); background: var(--green-100); border-color: var(--green-100); }
.button-outline-light { color: white; background: transparent; border-color: rgba(255,255,255,0.5); box-shadow: none; }
.button-outline-light:hover { color: white; background: rgba(255,255,255,0.1); border-color: white; box-shadow: none; }

.site-footer { padding: 70px 0 26px; color: #c8d5ce; background: #132019; }
.footer-grid { display: grid; grid-template-columns: 1.7fr repeat(3, 0.6fr); gap: 58px; }
.footer-brand { color: white; }
.footer-grid > div:first-child p { max-width: 390px; margin: 20px 0 0; color: #8fa096; font-size: 14px; }
.footer-links { display: flex; flex-direction: column; gap: 9px; }
.footer-links strong { margin-bottom: 7px; color: white; font-size: 13px; }
.footer-links a { color: #9fb0a6; font-size: 13px; text-decoration: none; }
.footer-links a:hover { color: var(--green-300); }
.footer-bottom { margin-top: 55px; padding-top: 22px; display: flex; justify-content: space-between; gap: 20px; color: #73857a; border-top: 1px solid rgba(255,255,255,0.09); font-size: 11px; }
.footer-legal-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 18px; }
.footer-legal-links a { color: #8fa096; text-decoration: none; }
.footer-legal-links a:hover { color: var(--green-300); }

/* Public inner pages */
.page-hero {
    position: relative;
    padding-block: 100px 86px;
    overflow: hidden;
    background: linear-gradient(180deg, #fbfdfc, var(--green-50));
    border-bottom: 1px solid var(--line);
}

.page-hero::after {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    right: -150px;
    bottom: -230px;
    background: rgba(159, 223, 189, 0.22);
    border-radius: 50%;
}

.page-hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    align-items: end;
    gap: 85px;
}

.page-hero h1 { margin: 0; font-size: clamp(43px, 5.2vw, 68px); }
.page-lead { margin: 0 0 5px; color: var(--ink-soft); font-size: 18px; line-height: 1.75; }

.breadcrumb {
    width: fit-content;
    margin-bottom: 32px;
    display: block;
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.breadcrumb::before { content: "←"; margin-right: 7px; color: var(--green-700); }
.breadcrumb:hover { color: var(--green-700); }
.page-section { background: white; }

.product-list { border-top: 1px solid var(--line); }
.product-detail { padding: 48px 0; display: grid; grid-template-columns: 65px 1.25fr 0.75fr; gap: 44px; border-bottom: 1px solid var(--line); }
.product-index { padding-top: 7px; color: var(--green-600); font-family: ui-monospace, monospace; font-size: 12px; font-weight: 800; }
.product-summary h2 { margin: 20px 0 12px; font-size: clamp(26px, 3vw, 36px); line-height: 1.2; letter-spacing: -0.04em; }
.product-summary p { max-width: 650px; margin: 0; color: var(--ink-soft); }
.product-summary > .text-link { margin-top: 16px; font-size: 13px; }
.product-links { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.product-links .text-link { margin-top: 16px; font-size: 13px; }
.product-capabilities { padding: 24px; background: var(--background); border: 1px solid var(--line); border-radius: 16px; }
.product-capabilities h3 { margin-bottom: 14px; font-size: 13px; text-transform: uppercase; letter-spacing: 0.07em; }

.check-list { margin: 0; padding: 0; list-style: none; }
.check-list li { padding: 7px 0; color: var(--ink-soft); font-size: 13px; }
.check-list li::before { content: "✓"; margin-right: 9px; color: var(--green-600); font-weight: 900; }

.decision-section { padding-block: 95px; background: var(--green-50); }
.decision-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; align-items: center; gap: 90px; }
.decision-grid h2 { margin: 0; font-size: clamp(32px, 4vw, 48px); line-height: 1.14; letter-spacing: -0.045em; }
.decision-cards { display: grid; gap: 13px; }
.decision-cards article { padding: 22px; background: white; border: 1px solid var(--green-200); border-radius: 15px; }
.decision-cards strong { font-size: 15px; }
.decision-cards p { margin: 5px 0 0; color: var(--ink-soft); font-size: 13px; }

.page-cta { padding-block: 75px; color: white; background: var(--green-700); }
.page-cta-inner { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 55px; }
.page-cta h2 { max-width: 780px; margin: 0; font-size: clamp(31px, 4vw, 47px); line-height: 1.14; letter-spacing: -0.045em; }

.section-intro { max-width: 710px; margin-bottom: 48px; }
.section-intro h2 { margin-bottom: 18px; font-size: clamp(34px, 4vw, 50px); line-height: 1.12; letter-spacing: -0.045em; }
.section-intro > p:last-child { color: var(--ink-soft); }
.principles-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.principle-card { min-height: 245px; padding: 27px; background: var(--background); border: 1px solid var(--line); border-radius: var(--radius-md); }
.principle-card > span { color: var(--green-600); font-family: ui-monospace, monospace; font-size: 11px; font-weight: 800; }
.principle-card h3 { margin: 50px 0 9px; font-size: 18px; }
.principle-card p { margin: 0; color: var(--ink-soft); font-size: 13px; }

.security-flow { padding-block: 95px; color: white; background: var(--green-900); }
.security-flow-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; align-items: center; gap: 90px; }
.security-flow h2 { margin-bottom: 20px; font-size: clamp(34px, 4vw, 49px); line-height: 1.12; letter-spacing: -0.045em; }
.security-flow p { color: rgba(255,255,255,0.65); }
.flow-diagram { padding: 32px; display: grid; grid-template-columns: 1fr; gap: 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.13); border-radius: var(--radius-md); }
.flow-diagram div { padding: 17px; color: var(--green-900); background: white; border-radius: 12px; text-align: center; font-weight: 800; }
.flow-diagram span { color: var(--green-300); text-align: center; font-family: ui-monospace, monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em; }
.flow-diagram span::before, .flow-diagram span::after { content: "↓"; margin-inline: 9px; }

.responsible-grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 100px; }
.responsible-grid h2 { margin: 0; font-size: clamp(33px, 4vw, 48px); line-height: 1.13; letter-spacing: -0.045em; }
.responsibility-list { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.responsibility-list li { padding: 20px 4px; display: grid; grid-template-columns: 0.75fr 1.25fr; gap: 22px; border-bottom: 1px solid var(--line); }
.responsibility-list strong { font-size: 14px; }
.responsibility-list span { color: var(--ink-soft); font-size: 13px; }

.story-grid { display: grid; grid-template-columns: 0.8fr 1.2fr; align-items: center; gap: 95px; }
.story-card { min-height: 430px; display: grid; place-content: center; background: var(--green-50); border: 1px solid var(--green-200); border-radius: var(--radius-lg); text-align: center; }
.story-mark { color: var(--green-700); font-size: 120px; font-weight: 850; line-height: 1; letter-spacing: -0.09em; }
.story-card p { margin: 24px 0 0; color: var(--green-800); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.story-copy h2 { margin-bottom: 25px; font-size: clamp(35px, 4vw, 50px); line-height: 1.12; letter-spacing: -0.045em; }
.story-copy > p { color: var(--ink-soft); }

.values-section { padding-block: 105px; background: var(--green-50); }
.values-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.values-grid article { min-height: 260px; padding: 25px; background: white; border: 1px solid var(--green-200); border-radius: var(--radius-md); }
.values-grid article > span { color: var(--green-600); font-family: ui-monospace, monospace; font-size: 11px; }
.values-grid h3 { margin: 62px 0 8px; font-size: 19px; }
.values-grid p { margin: 0; color: var(--ink-soft); font-size: 13px; }

.vision-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 95px; }
.vision-grid h2 { margin: 0; font-size: clamp(34px, 4vw, 50px); line-height: 1.12; letter-spacing: -0.045em; }
.vision-copy > p { color: var(--ink-soft); font-size: 17px; }
.text-link.dark { color: var(--green-700); }

.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 95px; }
.contact-primary h2 { margin-bottom: 18px; font-size: clamp(36px, 4vw, 52px); line-height: 1.12; letter-spacing: -0.045em; }
.contact-primary > p { color: var(--ink-soft); }
.email-link { margin-top: 25px; display: inline-flex; align-items: center; gap: 10px; color: var(--green-700); font-size: clamp(20px, 3vw, 30px); font-weight: 800; text-decoration: none; letter-spacing: -0.03em; }
.email-link:hover { color: var(--green-900); }
.security-note { margin-top: 35px !important; padding: 14px 16px; background: var(--green-50); border: 1px solid var(--green-200); border-radius: 12px; font-size: 12px; }
.contact-topics { border-top: 1px solid var(--line); }
.contact-topics article { padding: 25px 3px; display: grid; grid-template-columns: 48px 1fr; gap: 15px; border-bottom: 1px solid var(--line); }
.contact-topics article > span { color: var(--green-600); font-family: ui-monospace, monospace; font-size: 11px; }
.contact-topics h3 { margin: 0 0 5px; font-size: 17px; }
.contact-topics p { margin: 0; color: var(--ink-soft); font-size: 13px; }

.contact-options { padding-block: 90px; background: var(--green-50); }
.options-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.options-grid article { padding: 36px; background: white; border: 1px solid var(--green-200); border-radius: var(--radius-md); }
.options-grid h2 { margin-bottom: 12px; font-size: 30px; letter-spacing: -0.04em; }
.options-grid p:not(.eyebrow) { color: var(--ink-soft); }
.options-grid .button { margin-top: 10px; }

/* Public service documentation */
.docs-index-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.docs-index-card { min-height: 360px; padding: 30px; display: flex; flex-direction: column; background: var(--background); border: 1px solid var(--line); border-radius: var(--radius-md); }
.docs-index-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
.docs-index-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.docs-index-top > span:first-child { color: var(--green-600); font-family: ui-monospace, monospace; font-size: 11px; font-weight: 800; }
.docs-index-card h2 { margin: 54px 0 11px; font-size: clamp(25px, 3vw, 34px); line-height: 1.16; letter-spacing: -0.04em; }
.docs-index-card > p { max-width: 640px; color: var(--ink-soft); font-size: 14px; }
.docs-price-preview { margin: auto 0 0; padding: 18px 0; display: grid; grid-template-columns: 1fr auto; gap: 2px 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.docs-price-preview small { color: var(--ink-soft); font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.docs-price-preview strong { grid-column: 1; font-size: 14px; }
.docs-price-preview span { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: var(--ink-soft); font-size: 11px; text-align: right; }
.docs-index-card > .text-link { margin-top: 20px; font-size: 13px; }

.docs-detail-section { padding-top: 90px; }
.docs-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; align-items: start; gap: 90px; }
.docs-main > section { padding: 0 0 52px; margin-bottom: 52px; border-bottom: 1px solid var(--line); }
.docs-main > section:last-child { margin-bottom: 0; border-bottom: 0; }
.docs-main h2 { margin: 0 0 18px; font-size: clamp(28px, 3.4vw, 41px); line-height: 1.14; letter-spacing: -0.04em; }
.docs-main > section > p:not(.eyebrow) { color: var(--ink-soft); font-size: 16px; line-height: 1.8; }
.docs-check-list { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 28px; }
.docs-check-list li { padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.docs-use-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.docs-use-grid article { min-height: 170px; padding: 20px; background: var(--green-50); border: 1px solid var(--green-200); border-radius: 15px; }
.docs-use-grid span { color: var(--green-600); font-family: ui-monospace, monospace; font-size: 10px; font-weight: 800; }
.docs-use-grid p { margin: 49px 0 0; color: var(--ink-soft); font-size: 13px; }
.docs-steps { margin: 0; padding: 0; list-style: none; counter-reset: docs-step; }
.docs-steps li { padding: 19px 0; display: grid; grid-template-columns: 36px 1fr; align-items: start; gap: 15px; border-bottom: 1px solid var(--line); }
.docs-steps li > span { width: 30px; height: 30px; display: grid; place-items: center; color: white; background: var(--green-700); border-radius: 50%; font-size: 11px; font-weight: 800; }
.docs-steps p { margin: 2px 0 0; color: var(--ink-soft); }
.docs-callout { padding: 26px; background: #18251e; border-radius: 18px; color: white; }
.docs-callout > strong { color: var(--green-300); font-size: 14px; }
.docs-callout > p { margin: 9px 0 0; color: rgba(255,255,255,.68); font-size: 13px; }
.docs-callout pre { margin: 22px 0 0; padding: 18px; overflow-x: auto; color: #b9e8ce; background: #0f1813; border: 1px solid rgba(255,255,255,.09); border-radius: 11px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; line-height: 1.7; white-space: pre-wrap; }
.docs-commercial { position: sticky; top: 104px; padding: 27px; background: var(--green-50); border: 1px solid var(--green-200); border-radius: 20px; }
.docs-commercial-row { padding: 14px 0; display: grid; grid-template-columns: .8fr 1.2fr; gap: 15px; border-bottom: 1px solid var(--green-200); }
.docs-commercial-row > span { color: var(--ink-soft); font-size: 11px; }
.docs-commercial-row > strong { font-size: 12px; text-align: right; }
.docs-pending-note { margin: 20px 0; padding: 13px; color: #6e5715; background: #fff6d9; border: 1px solid #eadba7; border-radius: 10px; font-size: 11px; line-height: 1.55; }
.docs-commercial .button { width: 100%; margin-top: 20px; }
.docs-legal-link { margin-top: 13px; display: block; color: var(--green-700); font-size: 11px; font-weight: 700; text-align: center; }

/* Legal pages */
.legal-hero { padding-block: 76px 68px; }
.legal-hero .page-hero-grid { grid-template-columns: 1fr; gap: 18px; }
.legal-hero h1 { max-width: 900px; }
.legal-hero .page-lead { max-width: 820px; }
.legal-updated { margin: 4px 0 0; color: var(--green-700); font-size: 12px; font-weight: 750; }
.legal-draft-banner { padding-block: 16px; color: #5d4210; background: #fff8df; border-bottom: 1px solid #ead9a0; }
.legal-draft-banner .container { display: flex; align-items: flex-start; gap: 12px; }
.legal-draft-banner strong { flex: 0 0 auto; }
.legal-draft-banner p { margin: 0; font-size: 13px; }
.legal-section { padding-block: 72px 95px; }
.legal-layout { display: grid; grid-template-columns: 245px minmax(0, 760px); align-items: start; justify-content: space-between; gap: 80px; }
.legal-nav { position: sticky; top: 100px; padding: 22px; display: flex; flex-direction: column; gap: 9px; background: var(--green-50); border: 1px solid var(--green-200); border-radius: 15px; }
.legal-nav strong { margin-bottom: 7px; color: var(--ink); font-size: 13px; }
.legal-nav a { padding: 8px 10px; color: var(--ink-soft); border-radius: 8px; font-size: 13px; text-decoration: none; }
.legal-nav a:hover, .legal-nav a[aria-current="page"] { color: var(--green-800); background: white; }
.legal-document { min-width: 0; }
.legal-document > p:first-child { margin-top: 0; font-size: 17px; }
.legal-document h2 { margin: 52px 0 14px; padding-top: 3px; font-size: clamp(25px, 3vw, 32px); letter-spacing: -0.035em; }
.legal-document h2:first-child { margin-top: 0; }
.legal-document h3 { margin: 28px 0 9px; font-size: 18px; }
.legal-document p, .legal-document li { color: var(--ink-soft); }
.legal-document li + li { margin-top: 8px; }
.legal-document a { color: var(--green-700); }
.legal-callout { margin: 26px 0; padding: 20px 22px; background: var(--green-50); border: 1px solid var(--green-200); border-radius: 13px; }
.legal-callout p { margin: 0; }
.legal-table-wrap { margin-block: 25px; overflow-x: auto; border: 1px solid var(--line); border-radius: 13px; }
.legal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.legal-table th, .legal-table td { padding: 15px; min-width: 130px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.legal-table th { color: var(--ink); background: var(--green-50); }
.legal-table td { color: var(--ink-soft); }
.legal-table tr:last-child td { border-bottom: 0; }

@media (max-width: 980px) {
    .nav-toggle {
        width: 42px;
        height: 42px;
        padding: 10px;
        display: grid;
        align-content: center;
        gap: 5px;
        background: white;
        border: 1px solid var(--line);
        border-radius: 10px;
        cursor: pointer;
    }

    .nav-toggle > span:not(.sr-only) { width: 100%; height: 2px; display: block; background: var(--ink); border-radius: 10px; }

    .main-nav {
        position: fixed;
        z-index: 99;
        inset: 76px 0 auto;
        padding: 28px 24px 34px;
        display: none;
        align-items: stretch;
        flex-direction: column;
        gap: 17px;
        background: rgba(247,250,248,0.98);
        border-bottom: 1px solid var(--line);
        box-shadow: var(--shadow-sm);
    }

    .main-nav.open { display: flex; }
    .main-nav a { font-size: 16px; }
    .main-nav .nav-login { margin: 8px 0 0; }
    .main-nav .button { width: 100%; }

    .hero-grid { grid-template-columns: 1fr; gap: 60px; padding-block: 75px 90px; }
    .hero-copy { max-width: 760px; }
    .platform-visual { width: min(620px, 95%); margin-inline: auto; }
    .section-heading { grid-template-columns: 1fr; gap: 18px; }
    .services-grid { grid-template-columns: repeat(2, 1fr); }
    .service-card, .service-card:nth-child(4), .service-card.language-card { grid-column: auto; }
    .language-card { grid-column: 1 / -1 !important; }
    .trust-grid, .human-grid { grid-template-columns: 1fr; gap: 60px; }
    .human-visual { order: 2; }
    .cta-inner { grid-template-columns: 1fr; gap: 35px; }
    .page-hero-grid, .decision-grid, .security-flow-grid, .responsible-grid, .story-grid, .vision-grid, .contact-grid, .legal-layout, .docs-detail-grid { grid-template-columns: 1fr; gap: 48px; }
    .docs-commercial { position: static; }
    .legal-nav { position: static; display: grid; grid-template-columns: repeat(2, 1fr); }
    .legal-nav strong { grid-column: 1 / -1; }
    .product-detail { grid-template-columns: 50px 1fr; }
    .product-capabilities { grid-column: 2; }
    .principles-grid { grid-template-columns: repeat(2, 1fr); }
    .values-grid { grid-template-columns: repeat(2, 1fr); }
    .page-cta-inner { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 38px; }
    .footer-grid > div:first-child { grid-column: 1 / -1; }
}

@media (max-width: 700px) {
    .container { width: min(100% - 28px, 1160px); }
    .header-inner { min-height: 68px; }
    .main-nav { inset: 68px 0 auto; }
    .hero { min-height: auto; }
    .hero-grid { padding-block: 62px 72px; gap: 50px; }
    h1 { font-size: clamp(40px, 12vw, 56px); }
    .hero-text { font-size: 17px; }
    .hero-actions, .hero-actions .button { width: 100%; }
    .hero-points { display: grid; }
    .platform-visual { width: calc(100% - 10px); transform: none; }
    .platform-visual::before { inset: 18px -8px -12px 10px; }
    .visual-header { padding-inline: 14px; grid-template-columns: auto 1fr; }
    .visual-header > span:nth-child(2) { display: none; }
    .visual-content { padding: 20px; }
    .section { padding-block: 78px; }
    .page-hero { padding-block: 65px 62px; }
    .page-hero h1 { font-size: clamp(39px, 12vw, 54px); }
    .page-lead { font-size: 16px; }
    .product-detail { padding: 37px 0; grid-template-columns: 1fr; gap: 18px; }
    .product-index { padding: 0; }
    .product-capabilities { grid-column: auto; }
    .principles-grid, .values-grid, .options-grid, .docs-index-grid, .docs-check-list, .docs-use-grid { grid-template-columns: 1fr; }
    .docs-index-card, .docs-index-card:last-child:nth-child(odd) { grid-column: auto; min-height: auto; }
    .docs-index-card h2 { margin-top: 38px; }
    .docs-price-preview { margin-top: 32px; }
    .principle-card, .values-grid article { min-height: auto; }
    .principle-card h3, .values-grid h3 { margin-top: 38px; }
    .responsibility-list li { grid-template-columns: 1fr; gap: 5px; }
    .story-card { min-height: 320px; }
    .story-mark { font-size: 90px; }
    .page-cta .button { width: 100%; }
    .services-grid, .steps-grid { grid-template-columns: 1fr; }
    .language-card { grid-column: auto !important; }
    .service-card { min-height: auto; }
    .service-card p { min-height: auto; }
    .step-card:not(:last-child)::after { display: none; }
    .trust-grid, .human-grid { gap: 45px; }
    .human-visual { min-height: 320px; }
    .human-circle { width: 145px; height: 145px; }
    .human-circle span { font-size: 64px; }
    .note-one { right: 16px; }
    .note-two { left: 14px; }
    .cta-actions, .cta-actions .button { width: 100%; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 45px 24px; }
    .footer-grid > div:first-child { grid-column: 1 / -1; }
    .footer-bottom { align-items: flex-start; flex-direction: column; }
    .footer-legal-links { justify-content: flex-start; }
    .legal-section { padding-block: 56px 75px; }
    .legal-nav { grid-template-columns: 1fr; }
    .legal-nav strong { grid-column: auto; }
    .legal-draft-banner .container { display: block; }
    .legal-draft-banner strong { display: block; margin-bottom: 5px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* Score — language learning landing */
.score-page {
    --score-violet: #5b4ae8;
    --score-violet-dark: #302685;
    --score-violet-soft: #ebe9ff;
    --score-orange: #ff7f50;
    --score-yellow: #ffd75e;
    --score-cream: #fbfaf5;
    --score-ink: #23213a;
    --score-muted: #656277;
    color: var(--score-ink);
    background: var(--score-cream);
}

.score-header { position: sticky; z-index: 100; top: 0; background: rgba(251,250,245,.9); border-bottom: 1px solid rgba(35,33,58,.08); backdrop-filter: blur(16px); }
.score-header-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.score-brand { display: inline-flex; align-items: center; gap: 9px; color: var(--score-ink); font-size: 24px; font-weight: 850; letter-spacing: -.055em; text-decoration: none; }
.score-brand-mark { width: 35px; height: 35px; display: grid; place-items: center; color: white; background: var(--score-violet); border-radius: 50% 50% 45% 55% / 48% 42% 58% 52%; font-size: 18px; font-weight: 850; letter-spacing: 0; transform: rotate(-7deg); box-shadow: 0 7px 18px rgba(91,74,232,.2); }
.score-brand-mark::first-letter { transform: rotate(7deg); }
.score-brand-dot { color: var(--score-orange); }
.score-nav a { color: var(--score-muted); }
.score-nav a:hover, .score-nav a:focus-visible { color: var(--score-violet); }
.score-nav .score-by { padding-left: 18px; border-left: 1px solid rgba(35,33,58,.12); color: var(--score-ink); font-size: 12px; }
.score-button { color: white; background: var(--score-violet); border-color: var(--score-violet); border-radius: 14px; box-shadow: 0 12px 28px rgba(91,74,232,.23); }
.score-button:hover, .score-button:focus-visible { color: white; background: var(--score-violet-dark); border-color: var(--score-violet-dark); box-shadow: 0 15px 33px rgba(91,74,232,.3); }
.score-button-small { min-height: 41px; padding: 9px 17px; border-radius: 11px; font-size: 13px; }
.score-nav .score-button, .score-nav .score-button:hover { color: white; }

.score-hero { position: relative; min-height: 740px; display: grid; align-items: center; overflow: hidden; background: radial-gradient(circle at 78% 30%, rgba(235,233,255,.9), transparent 30%), linear-gradient(180deg,#fff 0%,var(--score-cream) 100%); }
.score-blob { position: absolute; border-radius: 50%; pointer-events: none; }
.score-blob-one { width: 230px; height: 230px; left: -140px; top: 90px; background: rgba(255,215,94,.34); }
.score-blob-two { width: 340px; height: 340px; right: -250px; bottom: -140px; background: rgba(255,127,80,.16); }
.score-hero-grid { position: relative; z-index: 2; padding-block: 82px 100px; display: grid; grid-template-columns: .94fr 1.06fr; align-items: center; gap: 84px; }
.score-kicker { margin: 0 0 18px; color: var(--score-violet); font-size: 12px; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.score-kicker span { color: var(--score-orange); }
.score-hero h1 { max-width: 650px; margin-bottom: 25px; color: var(--score-ink); font-size: clamp(51px,6.3vw,82px); line-height: .98; letter-spacing: -.065em; }
.score-page em { color: var(--score-violet); font-family: Georgia, "Times New Roman", serif; font-weight: 500; }
.score-lead { max-width: 600px; margin-bottom: 31px; color: var(--score-muted); font-size: 18px; line-height: 1.72; }
.score-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; }
.score-text-link { display: inline-flex; align-items: center; gap: 10px; color: var(--score-ink); font-size: 14px; font-weight: 750; text-decoration: none; }
.score-play { width: 36px; height: 36px; display: grid; place-items: center; padding-left: 2px; color: var(--score-violet); background: white; border: 1px solid var(--score-violet-soft); border-radius: 50%; box-shadow: 0 8px 20px rgba(91,74,232,.1); font-size: 10px; }
.score-proof { margin-top: 42px; padding-top: 24px; display: flex; flex-wrap: wrap; gap: 13px 0; border-top: 1px solid rgba(35,33,58,.1); }
.score-proof span { padding: 0 19px; color: var(--score-muted); border-right: 1px solid rgba(35,33,58,.12); font-size: 11px; }
.score-proof span:first-child { padding-left: 0; }
.score-proof span:last-child { border-right: 0; }
.score-proof b { display: block; color: var(--score-ink); font-size: 14px; }

.score-app { position: relative; width: min(480px,100%); margin-inline: auto; padding: 25px; background: white; border: 1px solid rgba(91,74,232,.13); border-radius: 31px; box-shadow: 0 35px 80px rgba(48,38,133,.17); transform: rotate(1.3deg); }
.score-app::before { content:""; position:absolute; z-index:-1; inset:23px -20px -21px 26px; background:var(--score-yellow); border-radius:31px; transform:rotate(-3deg); opacity:.72; }
.score-app-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:24px; }
.score-app-brand { display:flex; align-items:center; gap:6px; font-size:15px; font-weight:850; letter-spacing:-.04em; }
.score-app-brand i { width:23px; height:23px; display:grid; place-items:center; color:white; background:var(--score-violet); border-radius:50%; font-size:11px; font-style:normal; }
.score-streak { padding:6px 9px; color:#8b5d00; background:#fff5cf; border-radius:20px; font-size:10px; font-weight:800; }
.score-lesson-meta { display:flex; justify-content:space-between; color:#868293; font-size:10px; font-weight:750; text-transform:uppercase; letter-spacing:.05em; }
.score-progress { height:6px; margin:10px 0 23px; overflow:hidden; background:#efedf7; border-radius:10px; }
.score-progress span { width:68%; height:100%; display:block; background:linear-gradient(90deg,var(--score-violet),#897df1); border-radius:inherit; }
.score-scenario { position:relative; padding:25px 20px 21px; background:#f7f6ff; border:1px solid #e6e3ff; border-radius:20px; text-align:center; }
.score-character { position:relative; width:67px; height:67px; margin:0 auto 13px; display:grid; place-items:center; color:#704330; background:#ffb797; border:5px solid white; border-radius:46% 54% 50% 50%; box-shadow:0 7px 16px rgba(91,74,232,.12); }
.score-character b { font-size:16px; }
.score-character span { position:absolute; top:-18px; right:-25px; padding:4px 7px; color:var(--score-violet-dark); background:white; border:1px solid #e6e3ff; border-radius:10px 10px 10px 2px; font-size:9px; font-weight:800; }
.score-scenario p { margin-bottom:5px; color:#7d788a; font-size:10px; }
.score-scenario h2 { margin-bottom:14px; font-size:18px; line-height:1.3; letter-spacing:-.02em; }
.score-scenario button { padding:7px 11px; color:var(--score-violet); background:white; border:1px solid #dedaff; border-radius:9px; font:inherit; font-size:10px; font-weight:750; }
.score-response { margin-top:12px; padding:13px 15px; display:flex; align-items:center; gap:12px; border:1px dashed #cbc5ff; border-radius:15px; }
.score-mic { width:36px; height:36px; display:grid; place-items:center; color:white; background:var(--score-violet); border-radius:50%; font-size:9px; box-shadow:0 0 0 5px var(--score-violet-soft); }
.score-response strong,.score-response small { display:block; }
.score-response strong { font-size:11px; }
.score-response small { margin-top:2px; color:#8a8696; font-size:9px; }
.score-feedback { margin-top:12px; padding:10px 12px; display:grid; grid-template-columns:27px 1fr auto; align-items:center; gap:9px; background:#edf9f0; border-radius:12px; color:#39714b; }
.score-feedback>span { width:27px; height:27px; display:grid; place-items:center; color:white; background:#54a96e; border-radius:50%; font-size:11px; }
.score-feedback p { margin:0; font-size:9px; line-height:1.4; }.score-feedback p strong { display:block; }.score-feedback>b { font-size:12px; }
.score-float { position:absolute; padding:9px 12px; background:white; border-radius:11px; box-shadow:0 13px 30px rgba(48,38,133,.15); font-size:10px; font-weight:850; }
.score-float-one { top:115px; right:-40px; color:var(--score-violet); transform:rotate(5deg); }.score-float-two { bottom:85px; left:-56px; color:#b34e28; transform:rotate(-5deg); }

.score-strip { padding-block:18px; color:white; background:var(--score-violet-dark); overflow:hidden; }
.score-strip .container { display:flex; justify-content:space-between; align-items:center; gap:24px; white-space:nowrap; }
.score-strip span { font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.score-strip i { color:var(--score-yellow); font-style:normal; }
.score-section { padding-block:115px; }
.score-section-heading { margin-bottom:54px; display:grid; grid-template-columns:1.05fr .75fr; align-items:end; gap:110px; }
.score-section h2,.score-feature-copy h2,.score-growth-copy h2,.score-cta h2 { margin:0; font-size:clamp(38px,4.6vw,58px); line-height:1.07; letter-spacing:-.055em; }
.score-section-heading>p,.score-feature-copy>p,.score-growth-copy>p { margin:0; color:var(--score-muted); font-size:16px; line-height:1.75; }
.score-method { background:white; }
.score-method-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.score-method-grid article { min-height:340px; padding:28px; background:var(--score-cream); border:1px solid rgba(35,33,58,.09); border-radius:22px; transition:transform .2s ease,box-shadow .2s ease; }
.score-method-grid article:hover { transform:translateY(-5px); box-shadow:0 20px 45px rgba(48,38,133,.08); }.score-method-grid article.raised { transform:translateY(-16px); background:#f5f3ff; border-color:#dedaff; }.score-method-grid article.raised:hover { transform:translateY(-21px); }
.score-step { display:block; color:#9995a3; font-family:ui-monospace,monospace; font-size:10px; font-weight:800; }
.score-card-symbol { width:62px; height:62px; margin:39px 0 28px; display:grid; place-items:center; border-radius:19px; font-size:25px; font-weight:900; transform:rotate(-4deg); }.score-card-symbol.orange { color:#a84928; background:#ffe0d5; }.score-card-symbol.violet { color:white; background:var(--score-violet); }.score-card-symbol.yellow { color:#7b5f00; background:var(--score-yellow); }
.score-method-grid h3 { margin-bottom:9px; font-size:21px; letter-spacing:-.03em; }.score-method-grid p { margin:0; color:var(--score-muted); font-size:14px; }

.score-games { position:relative; overflow:hidden; background:#fff4dc; }
.score-games::before { content:""; position:absolute; width:270px; height:270px; top:-175px; left:-110px; background:var(--score-orange); border-radius:50%; opacity:.16; }
.score-games-grid { position:relative; z-index:2; display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:100px; }
.score-games-copy>p:not(.score-kicker) { margin:25px 0 28px; color:var(--score-muted); font-size:16px; line-height:1.75; }
.score-game-types { display:flex; flex-wrap:wrap; gap:9px; }
.score-game-types span { padding:8px 12px; color:#7e472f; background:rgba(255,255,255,.76); border:1px solid rgba(255,127,80,.28); border-radius:30px; font-size:11px; font-weight:800; }
.score-puzzle { position:relative; padding:30px; background:white; border:1px solid rgba(255,127,80,.22); border-radius:26px; box-shadow:0 25px 60px rgba(115,65,35,.12); transform:rotate(1deg); }
.score-puzzle-top { display:flex; align-items:start; justify-content:space-between; gap:20px; }
.score-puzzle-top small,.score-puzzle-top strong { display:block; }.score-puzzle-top small { color:#9a7184; font-size:9px; font-weight:850; letter-spacing:.09em; }.score-puzzle-top strong { margin-top:4px; font-size:20px; letter-spacing:-.03em; }.score-puzzle-top>span { padding:6px 10px; color:#705800; background:#fff1b9; border-radius:20px; font-size:10px; font-weight:850; }
.score-puzzle>p { margin:26px 0 12px; color:var(--score-muted); font-size:12px; }
.score-puzzle-answer { min-height:58px; padding:11px; display:flex; align-items:center; flex-wrap:wrap; gap:7px; background:#f7f5ff; border:1px dashed #c8c1ff; border-radius:14px; }
.score-puzzle-answer span { padding:7px 10px; color:var(--score-violet-dark); background:white; border:1px solid #e1ddff; border-radius:8px; font-size:12px; font-weight:750; box-shadow:0 3px 8px rgba(48,38,133,.06); }
.score-puzzle-tiles { margin:13px 0 20px; display:flex; flex-wrap:wrap; gap:7px; }
.score-puzzle-tiles i { padding:7px 10px; color:#9a96a4; background:#f3f0ec; border-radius:8px; font-size:11px; font-style:normal; text-decoration:line-through; }
.score-puzzle-result { padding:12px 14px; display:grid; grid-template-columns:32px 1fr auto; align-items:center; gap:10px; color:#39714b; background:#edf9f0; border-radius:14px; }.score-puzzle-result>span { width:32px; height:32px; display:grid; place-items:center; color:white; background:#54a96e; border-radius:50%; font-weight:900; }.score-puzzle-result strong,.score-puzzle-result small { display:block; }.score-puzzle-result strong { font-size:12px; }.score-puzzle-result small { margin-top:2px; color:#6f9279; font-size:9px; }.score-puzzle-result>b { font-size:12px; }
.score-puzzle-badge { position:absolute; right:-30px; bottom:-29px; width:84px; height:84px; display:grid; place-content:center; color:#755900; background:var(--score-yellow); border:6px solid #fff4dc; border-radius:50%; text-align:center; transform:rotate(-7deg); box-shadow:0 12px 28px rgba(115,65,35,.14); }.score-puzzle-badge>small,.score-puzzle-badge>strong { display:block; line-height:1; }.score-puzzle-badge>small { font-size:8px; font-weight:850; letter-spacing:.05em; text-transform:uppercase; }.score-puzzle-badge>strong { margin-top:2px; font-size:20px; }

.score-experience { color:white; background:var(--score-violet-dark); overflow:hidden; }
.score-feature-grid { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:100px; }
.score-feature-visual { position:relative; min-height:490px; display:grid; align-content:center; }
.score-dialogue-card { width:76%; padding:23px; color:var(--score-ink); background:white; border-radius:20px; box-shadow:0 20px 50px rgba(10,8,40,.25); }.score-dialogue-card small,.score-dialogue-card strong,.score-dialogue-card>span,.score-dialogue-card>b { display:block; }.score-dialogue-card small { color:#8b8795; font-size:9px; font-weight:850; letter-spacing:.08em; }.score-dialogue-card strong { margin:12px 0 18px; font-size:18px; line-height:1.35; }.score-dialogue-card>span:not(.score-check) { color:var(--score-violet); font-size:10px; font-weight:800; }.score-dialogue-card>span.score-feedback-tip { margin-top:8px; padding:8px 10px; color:#675f8c; background:#f3f1ff; border-radius:8px; font-weight:700; }
.card-left { transform:rotate(-3deg); }.card-right { position:relative; margin:-10px 0 0 auto; transform:rotate(2deg); }.card-right>b { color:#4d9162; font-size:10px; }.score-check { position:absolute; top:-14px; right:-14px; width:38px; height:38px; display:grid!important; place-items:center; color:white!important; background:#55aa70; border:4px solid var(--score-violet-dark); border-radius:50%; }
.score-wave { height:51px; display:flex; align-items:center; justify-content:center; gap:5px; }.score-wave i { width:4px; height:var(--h,50%); background:#968bf4; border-radius:8px; }.score-wave i:nth-child(1),.score-wave i:nth-child(7){--h:20%}.score-wave i:nth-child(2),.score-wave i:nth-child(6){--h:45%}.score-wave i:nth-child(3),.score-wave i:nth-child(5){--h:70%}.score-wave i:nth-child(4){--h:95%}
.score-feature-copy .score-kicker { color:var(--score-yellow); }.score-feature-copy h2 em { color:#b8afff; }.score-feature-copy>p { margin:25px 0; color:rgba(255,255,255,.68); }.score-feature-copy ul { margin:0; padding:0; list-style:none; }.score-feature-copy li { padding:8px 0; color:rgba(255,255,255,.86); font-size:14px; }.score-feature-copy li span { margin-right:9px; color:var(--score-yellow); }

.score-growth { background:#fffdf7; }
.score-growth-grid { display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:100px; }
.score-growth-copy>p { margin:24px 0 32px; }.score-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.score-stats div { padding-right:12px; border-right:1px solid rgba(35,33,58,.12); }.score-stats div:last-child { border:0; }.score-stats strong,.score-stats span { display:block; }.score-stats strong { color:var(--score-violet); font-size:24px; letter-spacing:-.04em; }.score-stats span { color:var(--score-muted); font-size:10px; }
.score-chart-card { padding:31px; background:white; border:1px solid rgba(91,74,232,.14); border-radius:25px; box-shadow:0 25px 60px rgba(48,38,133,.1); }.score-chart-top { display:flex; align-items:start; justify-content:space-between; }.score-chart-top small,.score-chart-top strong { display:block; }.score-chart-top small { color:#8c8897; font-size:9px; font-weight:800; letter-spacing:.07em; }.score-chart-top strong { margin-top:5px; font-size:28px; }.score-chart-top>span { padding:6px 9px; color:#37734a; background:#edf8f0; border-radius:20px; font-size:9px; font-weight:800; }
.score-chart { position:relative; height:230px; margin:24px 0 20px; padding-top:12px; display:flex; align-items:end; justify-content:space-around; gap:13px; border-bottom:1px solid #ddd9ea; background:repeating-linear-gradient(to bottom,transparent 0,transparent 53px,#f0edf6 54px); }.score-chart i { position:relative; width:32px; height:var(--h); display:block; background:#dedaff; border-radius:9px 9px 0 0; }.score-chart i::before { content:attr(data-minutes); position:absolute; top:-19px; left:50%; color:#8b8796; font-size:8px; font-style:normal; transform:translateX(-50%); }.score-chart i.today { background:linear-gradient(180deg,var(--score-orange),#ffb092); }.score-chart i.pending { background:#f0edf4; }.score-chart b { position:absolute; bottom:-24px; left:0; width:100%; color:#8b8796; font-size:9px; font-style:normal; text-align:center; }.score-chart-goal { position:absolute; z-index:2; top:25%; left:0; right:0; height:1px; color:var(--score-violet); border-top:1px dashed rgba(91,74,232,.55); font-size:8px; font-weight:800; text-align:right; transform:translateY(-1px); }.score-chart-goal::after { content:""; padding-left:4px; background:white; }.score-chart-card>p { margin:30px 0 0; padding:13px; color:var(--score-muted); background:#f6f4ff; border-radius:12px; font-size:11px; }.score-chart-card>p span { color:var(--score-violet); }

.score-cta { position:relative; padding-block:105px; overflow:hidden; color:white; background:var(--score-violet); text-align:center; }.score-cta-shape { position:absolute; inset:auto -5% -35px; color:rgba(255,255,255,.055); font-size:clamp(70px,12vw,170px); font-weight:900; letter-spacing:-.07em; white-space:nowrap; transform:rotate(-3deg); }.score-cta-inner { position:relative; z-index:2; max-width:820px; }.score-cta .score-kicker { color:var(--score-yellow); }.score-cta h2 { font-size:clamp(43px,5.5vw,68px); }.score-cta h2 em { color:white; }.score-cta-inner>p:not(.score-kicker) { margin:22px auto 29px; color:rgba(255,255,255,.74); font-size:17px; }.score-button-light { color:var(--score-violet-dark); background:white; border-color:white; box-shadow:none; }.score-button-light:hover { color:var(--score-violet-dark); background:var(--score-yellow); border-color:var(--score-yellow); }.score-cta small { margin-top:15px; display:block; color:rgba(255,255,255,.62); font-size:10px; }
.score-footer { padding-block:50px 30px; color:#aaa6bc; background:#211d50; }.score-footer-inner { display:grid; grid-template-columns:1fr 1.2fr auto; align-items:center; gap:35px; }.score-brand-light { color:white; }.score-footer p { margin:0; font-size:12px; }.score-footer nav { display:flex; gap:18px; }.score-footer nav a { color:#bcb8cc; font-size:11px; text-decoration:none; }.score-footer nav a:hover { color:white; }.score-footer-inner>span { grid-column:1/-1; padding-top:22px; border-top:1px solid rgba(255,255,255,.1); font-size:10px; }

@media (max-width:980px) {
    .score-nav { background:rgba(251,250,245,.98); }
    .score-nav .score-by { padding-left:0; border-left:0; }
    .score-hero-grid,.score-feature-grid,.score-growth-grid,.score-games-grid { grid-template-columns:1fr; gap:70px; }
    .score-hero-copy { max-width:760px; }.score-app { width:min(520px,92%); }
    .score-section-heading { grid-template-columns:1fr; gap:22px; }.score-section-heading>p { max-width:650px; }
    .score-footer-inner { grid-template-columns:1fr 1fr; }.score-footer nav { justify-content:flex-end; }.score-footer p { grid-column:1/-1; grid-row:2; }
}

@media (max-width:700px) {
    .score-header-inner { min-height:68px; }.score-nav { inset:68px 0 auto; }.score-hero { min-height:auto; }.score-hero-grid { padding-block:61px 80px; gap:57px; }.score-hero h1 { font-size:clamp(48px,15vw,66px); }.score-lead { font-size:16px; }.score-actions,.score-actions .score-button { width:100%; }.score-text-link { margin-inline:auto; }.score-proof span { width:50%; padding:0 12px; }.score-proof span:nth-child(2) { border:0; }.score-proof span:last-child { width:100%; padding:13px 0 0; border-top:1px solid rgba(35,33,58,.08); }
    .score-app { width:calc(100% - 12px); padding:17px; transform:none; }.score-app::before { inset:15px -7px -13px 9px; transform:rotate(-1.5deg); }.score-float-one { right:-10px; }.score-float-two { left:-11px; bottom:73px; }.score-scenario { padding-inline:13px; }.score-strip .container { justify-content:flex-start; overflow:hidden; }.score-strip i:nth-of-type(n+3),.score-strip span:nth-of-type(n+4){display:none}
    .score-section { padding-block:80px; }.score-method-grid { grid-template-columns:1fr; }.score-method-grid article,.score-method-grid article.raised { min-height:auto; transform:none; }.score-method-grid article.raised:hover { transform:translateY(-5px); }.score-card-symbol { margin-block:28px 21px; }
    .score-feature-grid,.score-growth-grid,.score-games-grid { gap:55px; }.score-puzzle { padding:22px 17px; transform:none; }.score-puzzle-badge { right:-7px; bottom:-42px; }.score-puzzle-answer span { padding-inline:8px; }.score-feature-visual { min-height:410px; }.score-dialogue-card { width:88%; }.score-stats { gap:8px; }.score-stats strong { font-size:20px; }.score-chart-card { padding:22px 17px; }.score-chart { gap:7px; }.score-chart i { width:25px; }
    .score-cta { padding-block:80px; }.score-cta .score-button { width:100%; }.score-footer-inner { grid-template-columns:1fr; }.score-footer nav { justify-content:flex-start; flex-wrap:wrap; }.score-footer p { grid-column:auto; grid-row:auto; }.score-footer-inner>span { grid-column:auto; }
}