@font-face {
    font-family: "Pretendard Variable";
    src: url("/static/fonts/PretendardVariable.woff2") format("woff2");
    font-style: normal;
    font-weight: 45 920;
    font-display: swap;
}

:root {
    color-scheme: light;
    --pricing-bg: #ffffff;
    --pricing-paper: #f7f8fa;
    --pricing-ink: #17191c;
    --pricing-muted: #5d626a;
    --pricing-rule: #d9dde3;
    --pricing-blue: #0064df;
    --pricing-blue-dark: #0056c2;
    --pricing-action-bg: #005ecb;
    --pricing-action-hover: #004da8;
    --pricing-blue-pale: #eef5ff;
    --pricing-shell: 1120px;
}

* { box-sizing: border-box; }

html {
    overflow-x: clip;
    background: var(--pricing-bg);
    color: var(--pricing-ink);
    font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    scroll-behavior: smooth;
    text-rendering: optimizeLegibility;
}

body.pricing-page {
    margin: 0;
    overflow-x: clip;
    background: var(--pricing-bg);
    color: var(--pricing-ink);
    -webkit-font-smoothing: antialiased;
}

body.pricing-page a { color: inherit; }
body.pricing-page img { display: block; max-width: 100%; }

.pricing-shell,
.pricing-header__inner {
    width: min(100%, calc(var(--pricing-shell) + 32px));
    margin-inline: auto;
    padding-inline: 16px;
}

.pricing-header {
    position: relative;
    z-index: 10;
    border-bottom: 1px solid var(--pricing-rule);
    background: color-mix(in srgb, var(--pricing-bg) 96%, transparent);
}

.pricing-header__inner {
    min-height: 62px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: max(8px, env(safe-area-inset-top));
    padding-bottom: 8px;
}

.pricing-wordmark,
.pricing-header__nav a,
.pricing-jump-list a,
.pricing-action,
.pricing-text-action { text-decoration: none; }

.pricing-header__nav { display: flex; align-items: center; gap: 20px; }
.pricing-header__nav > a:not(.pricing-header__account) { display: none; }
.pricing-header__account {
    max-width: 146px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 14px;
    font-weight: 760;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-decoration: underline !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 4px;
}

.pricing-hero { padding: 58px 0 70px; }
.pricing-hero h1,
.pricing-section-heading h2,
.pricing-shared h2,
.pricing-final h2 {
    margin: 0;
    font-weight: 870;
    letter-spacing: -0.058em;
    line-height: 1.12;
    text-wrap: balance;
    word-break: keep-all;
}
.pricing-hero h1 { font-size: clamp(36px, 10.2vw, 50px); }
.pricing-hero > .pricing-shell > p {
    max-width: 35rem;
    margin: 20px 0 0;
    color: #4f5359;
    font-size: 17px;
    line-height: 1.65;
    text-wrap: pretty;
    word-break: keep-all;
}

.pricing-classroom-account-status {
    max-width: 760px;
    margin: 18px 0 0;
    padding: 12px 14px;
    border-left: 3px solid var(--pricing-blue);
    background: var(--pricing-blue-pale);
    color: var(--pricing-ink) !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
    word-break: keep-all;
}

.pricing-jump-list { display: grid; margin-top: 38px; border-top: 1px solid var(--pricing-ink); }
.pricing-jump-list a {
    min-height: 76px;
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid var(--pricing-rule);
}
.pricing-jump-list span { color: var(--pricing-blue); font-size: 12px; font-weight: 830; }
.pricing-jump-list strong { font-size: 18px; letter-spacing: -0.025em; }
.pricing-jump-list b { color: var(--pricing-blue); font-size: 17px; }

.pricing-notice {
    width: min(calc(100% - 32px), var(--pricing-shell));
    margin: 20px auto;
    padding: 14px 16px;
    border: 1px solid #b7c9df;
    background: var(--pricing-blue-pale);
    color: #315f92;
    font-size: 14px;
    line-height: 1.55;
}

.pricing-personal { padding: 76px 0; border-top: 1px solid var(--pricing-rule); background: var(--pricing-paper); }
.pricing-section-heading { display: grid; gap: 15px; }
.pricing-section-heading h2,
.pricing-shared h2,
.pricing-final h2 { font-size: clamp(32px, 8.5vw, 48px); }
.pricing-section-heading > p,
.pricing-shared__headline p,
.pricing-final p {
    max-width: 42rem;
    margin: 0;
    color: var(--pricing-muted);
    font-size: 16px;
    line-height: 1.65;
    text-wrap: pretty;
    word-break: keep-all;
}

.pricing-plan-list { display: grid; margin-top: 34px; border-top: 1px solid var(--pricing-ink); }
.pricing-plan { display: grid; align-content: start; padding: 30px 0 34px; border-bottom: 1px solid var(--pricing-rule); }
.pricing-plan__heading { display: grid; align-content: start; }
.pricing-plan__heading > span { color: var(--pricing-blue); font-size: 13px; font-weight: 850; }
.pricing-plan h3 { margin: 9px 0 0; font-size: 22px; letter-spacing: -0.035em; line-height: 1.35; word-break: keep-all; }
.pricing-plan__offer {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 7px 10px;
    margin-top: 19px;
}
.pricing-plan__offer-label {
    width: fit-content;
    color: var(--pricing-blue);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: -0.02em;
}
.pricing-plan__list-price {
    width: fit-content;
    color: #767b83;
    font-size: 13px;
    font-weight: 700;
}
.pricing-plan__price {
    min-height: 52px;
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin: 22px 0 0;
    font-size: clamp(36px, 10vw, 48px);
    font-weight: 880;
    letter-spacing: -0.055em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.pricing-plan__offer .pricing-plan__price { grid-column: 1 / -1; margin-top: 0; }
.pricing-plan__price strong { font: inherit; white-space: nowrap; }
.pricing-plan__price small { color: #4f5359; font-size: 15px; font-weight: 700; letter-spacing: -0.02em; }
.pricing-plan__summary { min-height: 48px; margin: 15px 0 0; color: #555b64; font-size: 14px; line-height: 1.6; text-wrap: pretty; word-break: keep-all; }

.pricing-feature-table { margin-top: 25px; border-top: 1px solid var(--pricing-rule); }
.pricing-feature-row {
    min-height: 58px;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid var(--pricing-rule);
    font-size: 15px;
    line-height: 1.45;
    word-break: keep-all;
}
.pricing-feature-state { color: var(--pricing-blue); font-size: 11px; font-weight: 840; }
.pricing-feature-row--muted { color: #8b9097; }
.pricing-feature-row--muted .pricing-feature-state { color: #8b9097; }

.pricing-action {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 25px;
    border: 1px solid var(--pricing-ink);
    border-radius: 8px;
    font-size: 15px;
    font-weight: 830;
    transition-property: background-color, border-color, color, transform;
    transition-duration: 150ms;
    transition-timing-function: ease;
}
.pricing-action--primary { border-color: var(--pricing-action-bg); background: var(--pricing-action-bg); color: #fff !important; }
.pricing-action--secondary { background: #fff; color: var(--pricing-ink); }
.pricing-action--primary:hover { border-color: var(--pricing-action-hover); background: var(--pricing-action-hover); }
.pricing-action--secondary:hover { background: #f0f2f5; }
.pricing-action:active { transform: scale(0.96); }
.pricing-plan__hint { min-height: 42px; margin: 10px 0 0; color: #666b73; font-size: 12px; line-height: 1.5; text-align: center; word-break: keep-all; }

.pricing-shared { padding: 82px 0; border-top: 1px solid #c9d9ed; background: var(--pricing-blue-pale); }
.pricing-shared__headline { display: grid; gap: 36px; }
.pricing-shared__headline > div:first-child { display: grid; gap: 18px; }
.pricing-shared__formula { display: grid; align-content: end; gap: 9px; }
.pricing-shared__formula > span { color: #555b64; font-size: 13px; font-weight: 720; }
.pricing-shared__formula strong { display: grid; gap: 1px; font-size: clamp(27px, 7.4vw, 36px); letter-spacing: -0.045em; line-height: 1.18; font-variant-numeric: tabular-nums; }

.pricing-shared__facts,
.pricing-classroom__facts {
    display: grid;
    margin: 36px 0 0;
    padding: 0;
    border-top: 1px solid var(--pricing-ink);
}
.pricing-shared__facts > div,
.pricing-classroom__facts > div { display: grid; grid-template-columns: 106px minmax(0, 1fr); gap: 12px; padding: 18px 0; border-bottom: 1px solid #c9d9ed; }
.pricing-shared__facts dt,
.pricing-classroom__facts dt { color: var(--pricing-blue); font-size: 12px; font-weight: 830; }
.pricing-shared__facts dd,
.pricing-classroom__facts dd { margin: 0; font-size: 16px; font-weight: 780; letter-spacing: -0.02em; }
.pricing-shared__policy { display: grid; gap: 12px; margin-top: 28px; }
.pricing-shared__policy p { margin: 0; color: #50565f; font-size: 14px; line-height: 1.65; text-wrap: pretty; word-break: keep-all; }

.pricing-shared-examples {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    margin: 34px -16px 0;
    padding: 0 16px 9px;
    scroll-padding-inline: 16px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
}
.pricing-shared-examples::-webkit-scrollbar { display: none; }
.pricing-shared-examples figure { flex: 0 0 calc(100vw - 48px); margin: 0; scroll-snap-align: start; }
.pricing-shared-example {
    display: grid;
    min-height: 178px;
    padding: 22px;
    align-content: center;
    gap: 13px;
    border: 1px solid var(--pricing-rule);
    background: var(--pricing-paper);
}
.pricing-shared-example__case {
    width: fit-content;
    padding: 4px 8px;
    border: 1px solid var(--pricing-rule);
    border-radius: 999px;
    color: var(--pricing-muted);
    font-size: 12px;
    font-weight: 800;
}
.pricing-shared-example strong { font-size: clamp(18px, 4.8vw, 24px); letter-spacing: -0.04em; line-height: 1.25; }
.pricing-shared-example__result { color: var(--pricing-blue); font-size: 15px; font-weight: 800; }
.pricing-shared-examples figcaption { margin-top: 11px; font-size: 15px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.4; word-break: keep-all; }

.pricing-classroom { padding: 82px 0; border-top: 1px solid var(--pricing-rule); }
.pricing-section-heading--classroom { gap: 20px; }
.pricing-classroom__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 38px; }
.pricing-classroom__facts > div { grid-template-columns: 1fr; gap: 6px; padding: 18px 12px 18px 0; }
.pricing-classroom__facts > div:nth-child(even) { padding-left: 12px; border-left: 1px solid var(--pricing-rule); }
.pricing-classroom__price-layout { display: grid; gap: 32px; margin-top: 42px; }

.pricing-classroom-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.pricing-classroom-table caption { padding: 0 0 15px; border-bottom: 1px solid var(--pricing-ink); font-size: 18px; font-weight: 820; text-align: left; }
.pricing-classroom-table th,
.pricing-classroom-table td { padding: 18px 5px; border-bottom: 1px solid var(--pricing-rule); font-size: 13px; text-align: right; }
.pricing-classroom-table th:first-child { padding-left: 0; text-align: left; }
.pricing-classroom-table td:last-child { padding-right: 0; }
.pricing-classroom-table thead th { color: #666b73; font-size: 11px; font-weight: 700; }
.pricing-classroom-table tbody th { font-size: 14px; }
.pricing-classroom-table tbody td:last-child { color: var(--pricing-blue); font-weight: 820; }
.pricing-classroom__tax-note { margin: 12px 0 0; color: #717680; font-size: 12px; line-height: 1.55; }

.pricing-classroom__per-person { display: grid; border-top: 1px solid var(--pricing-ink); }
.pricing-classroom__per-person > div { display: grid; gap: 5px; padding: 21px 0; border-bottom: 1px solid var(--pricing-rule); }
.pricing-classroom__per-person span { color: #555b64; font-size: 13px; }
.pricing-classroom__per-person strong { font-size: 20px; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.pricing-classroom__per-person small { color: #666b73; font-size: 12px; }
.pricing-text-action {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-self: start;
    margin-top: 22px;
    color: var(--pricing-blue) !important;
    font-size: 14px;
    font-weight: 820;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.pricing-final { padding: 88px 0 112px; border-top: 1px solid var(--pricing-rule); background: var(--pricing-paper); text-align: center; }
.pricing-final__inner { display: grid; justify-items: center; }
.pricing-final p { margin-top: 18px; }
.pricing-final__actions { width: 100%; max-width: 420px; display: grid; gap: 3px; margin-top: 26px; }
.pricing-final__actions .pricing-action,
.pricing-final__actions .pricing-text-action { width: 100%; margin-top: 0; justify-self: stretch; }
.pricing-final__actions .pricing-text-action { justify-content: center; }

.pricing-footer { border-top: 1px solid var(--pricing-rule); background: var(--pricing-paper); }
.pricing-footer__inner { display: grid; gap: 22px; padding-top: 30px; padding-bottom: max(40px, env(safe-area-inset-bottom)); color: #555b64; font-size: 14px; }
.pricing-footer nav { display: flex; flex-wrap: wrap; gap: 14px 20px; }
.pricing-footer a { min-height: 44px; display: inline-flex; align-items: center; text-underline-offset: 3px; }

.pricing-header a:focus-visible,
.pricing-jump-list a:focus-visible,
.pricing-action:focus-visible,
.pricing-text-action:focus-visible,
.pricing-footer a:focus-visible { outline: 3px solid rgba(0, 100, 223, 0.28); outline-offset: 4px; }

@media (min-width: 720px) {
    .pricing-shell,
    .pricing-header__inner { width: min(100%, calc(var(--pricing-shell) + 64px)); padding-inline: 32px; }
    .pricing-header__inner { min-height: 72px; }
    .pricing-header__nav > a:not(.pricing-header__account) { min-height: 44px; display: inline-flex; align-items: center; font-size: 14px; font-weight: 680; }

    .pricing-hero { padding: 94px 0 110px; }
    .pricing-hero h1 { font-size: clamp(58px, 5.2vw, 76px); }
    .pricing-hero > .pricing-shell > p { font-size: 19px; }
    .pricing-jump-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pricing-jump-list a { grid-template-columns: 1fr auto; gap: 6px 14px; padding: 22px 26px; border-right: 1px solid var(--pricing-rule); }
    .pricing-jump-list a:first-child { padding-left: 0; }
    .pricing-jump-list a:last-child { padding-right: 0; border-right: 0; }
    .pricing-jump-list span { grid-column: 1 / -1; }
    .pricing-jump-list strong { font-size: 20px; }

    .pricing-personal { padding: 110px 0; }
    .pricing-section-heading { grid-template-columns: minmax(0, 1fr) minmax(360px, 0.72fr); align-items: end; gap: 70px; }
    .pricing-section-heading h2,
    .pricing-shared h2,
    .pricing-final h2 { font-size: clamp(46px, 4vw, 58px); }
    .pricing-plan-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pricing-plan { padding: 38px 44px 42px; border-bottom: 1px solid var(--pricing-rule); }
    .pricing-plan:first-child { padding-left: 0; padding-right: 48px; border-right: 1px solid var(--pricing-rule); }
    .pricing-plan:last-child { padding-right: 0; padding-left: 48px; }
    .pricing-plan__heading { min-height: 223px; }
    .pricing-plan__price { font-size: 50px; }

    .pricing-shared { padding: 112px 0; }
    .pricing-shared__headline { grid-template-columns: minmax(0, 1.2fr) minmax(360px, 0.8fr); align-items: end; gap: 90px; }
    .pricing-shared__facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pricing-shared__facts > div { grid-template-columns: 1fr; gap: 8px; padding: 22px 24px; border-right: 1px solid #c9d9ed; }
    .pricing-shared__facts > div:first-child { padding-left: 0; }
    .pricing-shared__facts > div:last-child { padding-right: 0; border-right: 0; }
    .pricing-shared__policy { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 50px; }
    .pricing-shared-examples { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; overflow: visible; margin: 40px 0 0; padding: 0; }
    .pricing-shared-examples figure { width: auto; }

    .pricing-classroom { padding: 112px 0; }
    .pricing-classroom__facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pricing-classroom__facts > div { padding: 20px 24px; border-right: 1px solid var(--pricing-rule); }
    .pricing-classroom__facts > div:nth-child(even) { padding-left: 24px; border-left: 0; }
    .pricing-classroom__facts > div:nth-child(3n + 1) { padding-left: 0; }
    .pricing-classroom__facts > div:nth-child(3n) { padding-right: 0; border-right: 0; }
    .pricing-classroom__price-layout { grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.8fr); align-items: start; gap: 70px; margin-top: 56px; }
    .pricing-classroom-table th,
    .pricing-classroom-table td { padding-top: 21px; padding-bottom: 21px; font-size: 15px; }
    .pricing-classroom-table thead th { font-size: 12px; }

    .pricing-final { padding: 124px 0 142px; }
    .pricing-final__actions { max-width: none; grid-template-columns: auto auto; justify-content: center; align-items: center; gap: 16px; }
    .pricing-final__actions .pricing-action { width: auto; padding-inline: 30px; }
    .pricing-final__actions .pricing-text-action { width: auto; }
    .pricing-footer__inner { grid-template-columns: auto 1fr; align-items: start; }
    .pricing-footer nav { justify-content: flex-end; }
}

@media (max-width: 379px) {
    .pricing-hero h1 { font-size: 33px; }
    .pricing-jump-list a { grid-template-columns: 70px minmax(0, 1fr) auto; }
    .pricing-feature-row { grid-template-columns: 40px minmax(0, 1fr); font-size: 14px; }
    .pricing-classroom-table th,
    .pricing-classroom-table td { font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .pricing-action { transition: none; }
}

/* Plan disclosure and comparison surface */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.pricing-disclosures {
    margin-top: 40px;
    border-top: 1px solid var(--pricing-ink);
}

.pricing-plan-group-label {
    margin: 0;
    padding: 18px 0 4px;
    color: var(--pricing-muted);
    font-size: 12px;
    font-weight: 820;
    letter-spacing: -0.015em;
}

.pricing-plan-group-label--classroom {
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid var(--pricing-ink);
}

.pricing-disclosure {
    scroll-margin-top: 18px;
    border-bottom: 1px solid var(--pricing-rule);
}

.pricing-disclosure__heading {
    margin: 0;
}

.pricing-disclosure__trigger {
    width: 100%;
    min-height: 92px;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto 20px;
    align-items: center;
    gap: 10px;
    padding: 16px 0;
    border: 0;
    background: transparent;
    color: var(--pricing-ink);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition-property: background-color, color;
    transition-duration: 160ms;
    transition-timing-function: ease;
}

.pricing-disclosure__trigger:hover {
    background: color-mix(in srgb, var(--pricing-blue) 4%, transparent);
}

.pricing-disclosure__trigger:active .pricing-disclosure__chevron {
    transform: scale(0.88) rotate(45deg);
}

.pricing-disclosure[data-open="true"] .pricing-disclosure__trigger:active .pricing-disclosure__chevron {
    transform: scale(0.88) rotate(225deg);
}

.pricing-disclosure__kind {
    color: var(--pricing-blue);
    font-size: 11px;
    font-weight: 840;
}

.pricing-disclosure__name,
.pricing-disclosure__price {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.pricing-disclosure__name strong {
    font-size: 19px;
    font-weight: 850;
    letter-spacing: -0.03em;
}

.pricing-disclosure__name small,
.pricing-disclosure__price small {
    color: var(--pricing-muted);
    font-size: 11px;
    font-weight: 650;
    line-height: 1.35;
    word-break: keep-all;
}

.pricing-disclosure__price {
    justify-items: end;
    text-align: right;
}

.pricing-disclosure__price strong {
    max-width: 94px;
    font-size: 14px;
    font-weight: 820;
    letter-spacing: -0.025em;
    line-height: 1.25;
    word-break: keep-all;
    font-variant-numeric: tabular-nums;
}

.pricing-disclosure__chevron {
    width: 12px;
    height: 12px;
    border-right: 2px solid var(--pricing-blue);
    border-bottom: 2px solid var(--pricing-blue);
    transform: rotate(45deg);
    transform-origin: center;
    transition-property: transform;
    transition-duration: 240ms;
    transition-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1);
}

.pricing-disclosure[data-open="true"] .pricing-disclosure__chevron {
    transform: rotate(225deg);
}

.pricing-disclosure__panel {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition-property: grid-template-rows, opacity;
    transition-duration: 280ms, 180ms;
    transition-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1), ease;
}

.pricing-disclosure[data-open="true"] .pricing-disclosure__panel {
    grid-template-rows: 1fr;
    opacity: 1;
}

.pricing-disclosure__panel-inner {
    min-height: 0;
    overflow: hidden;
}

.pricing-plan-detail {
    display: grid;
    padding: 28px 0 42px;
}

.pricing-plan-detail__intro {
    display: grid;
    gap: 16px;
}

.pricing-plan-detail__intro > div:first-child {
    display: grid;
    gap: 8px;
}

.pricing-plan-detail__intro > div:first-child > span {
    color: var(--pricing-blue);
    font-size: 12px;
    font-weight: 840;
}

.pricing-plan-detail__intro h3,
.pricing-section-heading h3,
.pricing-shared h3 {
    margin: 0;
    font-size: clamp(27px, 7.2vw, 40px);
    font-weight: 860;
    letter-spacing: -0.05em;
    line-height: 1.16;
    text-wrap: balance;
    word-break: keep-all;
}

.pricing-plan-detail .pricing-plan__summary {
    min-height: 0;
    margin-top: 0;
}

.pricing-plan-detail .pricing-action {
    width: 100%;
}

.pricing-pro-actions {
    display: grid;
    margin-top: 26px;
}

.pricing-pro-actions .pricing-action {
    width: 100%;
    margin-top: 0;
}

.pricing-shared {
    margin-top: 4px;
    padding: 36px 20px 40px;
    border-top: 1px solid #c9d9ed;
    background: var(--pricing-blue-pale);
}

.pricing-shared__headline > div:first-child {
    gap: 13px;
}

.pricing-shared__headline p {
    margin: 0;
}

.pricing-shared-examples__cue {
    margin: 30px 0 -20px;
    color: var(--pricing-muted);
    font-size: 12px;
    font-weight: 760;
}

.pricing-classroom {
    padding: 34px 0 44px;
    border-top: 0;
}

.pricing-section-heading--classroom {
    gap: 16px;
}

.pricing-classroom__callout {
    display: grid;
    gap: 7px;
    margin-top: 24px;
    padding: 20px;
    border-left: 3px solid var(--pricing-blue);
    background: var(--pricing-blue-pale);
}

.pricing-classroom__callout span {
    color: var(--pricing-blue);
    font-size: 11px;
    font-weight: 850;
}

.pricing-classroom__callout strong {
    font-size: 17px;
    line-height: 1.5;
    letter-spacing: -0.025em;
    word-break: keep-all;
}

.pricing-classroom__contact {
    display: grid;
    margin-top: 28px;
}

.pricing-classroom__contact .pricing-action {
    width: 100%;
    margin-top: 0;
}

.pricing-classroom__contact p {
    margin: 10px 0 0;
    color: var(--pricing-muted);
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
}

.pricing-comparison {
    padding: 78px 0 88px;
    border-top: 1px solid var(--pricing-rule);
    background: var(--pricing-paper);
}

.pricing-comparison__frame {
    margin-top: 36px;
    border-top: 1px solid var(--pricing-ink);
}

.pricing-comparison-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-variant-numeric: tabular-nums;
}

.pricing-comparison-table thead {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--pricing-paper);
}

.pricing-comparison-table__feature {
    width: 34%;
}

.pricing-comparison-table th,
.pricing-comparison-table td {
    padding: 14px 4px;
    border-right: 1px solid var(--pricing-rule);
    border-bottom: 1px solid var(--pricing-rule);
    vertical-align: middle;
    text-align: center;
    font-size: 12px;
    line-height: 1.35;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.pricing-comparison-table th:last-child,
.pricing-comparison-table td:last-child {
    border-right: 0;
}

.pricing-comparison-table thead th {
    height: 72px;
    color: var(--pricing-ink);
    font-weight: 820;
}

.pricing-comparison-table thead .pricing-comparison-table__groups th {
    height: auto;
    padding-top: 11px;
    padding-bottom: 11px;
    color: var(--pricing-muted);
    font-size: 10.5px;
    font-weight: 760;
    letter-spacing: -0.01em;
}

.pricing-comparison-table thead .pricing-comparison-table__groups th:nth-child(2) {
    border-right-color: var(--pricing-ink);
}

.pricing-comparison-table thead th:first-child {
    color: var(--pricing-muted);
    font-size: 11px;
    text-align: left;
}

.pricing-comparison-table thead strong,
.pricing-comparison-table thead small {
    display: block;
}

.pricing-comparison-table thead strong {
    font-size: 13px;
    letter-spacing: -0.025em;
}

.pricing-comparison-table thead small {
    margin-top: 5px;
    color: var(--pricing-muted);
    font-size: 10.5px;
    font-weight: 650;
    line-height: 1.25;
}

.pricing-comparison-table tbody th {
    padding-left: 0;
    padding-right: 10px;
    text-align: left;
    font-weight: 760;
}

.pricing-comparison-table td > span {
    display: block;
    font-size: 17px;
    font-weight: 850;
    line-height: 1;
}

.pricing-comparison-table td > small {
    display: block;
    margin-top: 4px;
    color: var(--pricing-muted);
    font-size: 10.5px;
    font-weight: 650;
    line-height: 1.3;
}

.pricing-comparison-table .is-yes > span {
    color: var(--pricing-blue);
}

.pricing-comparison-table .is-no {
    color: #696f76;
}

.pricing-comparison-table .is-limit strong {
    font-size: 13px;
    font-weight: 850;
    letter-spacing: -0.02em;
}

.pricing-comparison-table .has-policy-text td,
.pricing-comparison-table .is-policy {
    font-size: 11px;
    font-weight: 720;
    line-height: 1.4;
}

.pricing-comparison-table .has-policy-text td > small {
    font-size: 10.5px;
}

.pricing-disclosure__trigger:focus-visible,
.pricing-header a:focus-visible,
.pricing-action:focus-visible,
.pricing-text-action:focus-visible,
.pricing-footer a:focus-visible {
    outline: 3px solid rgba(0, 100, 223, 0.28);
    outline-offset: 4px;
}

@media (min-width: 720px) {
    .pricing-disclosures {
        margin-top: 54px;
    }

    .pricing-plan-group-label {
        padding: 22px 24px 6px;
        font-size: 13px;
    }

    .pricing-plan-group-label--classroom {
        margin-top: 30px;
        padding-top: 28px;
    }

    .pricing-disclosure__trigger {
        min-height: 104px;
        grid-template-columns: 90px minmax(0, 1fr) minmax(160px, auto) 26px;
        gap: 22px;
        padding: 20px 24px;
    }

    .pricing-disclosure:first-child .pricing-disclosure__trigger {
        padding-top: 22px;
    }

    .pricing-disclosure__kind {
        font-size: 12px;
    }

    .pricing-disclosure__name {
        grid-template-columns: 150px minmax(0, 1fr);
        align-items: baseline;
        gap: 22px;
    }

    .pricing-disclosure__name strong {
        font-size: 23px;
    }

    .pricing-disclosure__name small,
    .pricing-disclosure__price small {
        font-size: 13px;
    }

    .pricing-disclosure__price strong {
        max-width: none;
        font-size: 18px;
    }

    .pricing-disclosure__panel-inner {
        padding-inline: 24px;
    }

    .pricing-plan-detail {
        padding: 48px 0 58px;
    }

    .pricing-plan-detail__intro {
        grid-template-columns: minmax(0, 1fr) minmax(380px, 0.72fr);
        align-items: end;
        gap: 72px;
    }

    .pricing-plan-detail--pro .pricing-plan-detail__intro {
        grid-template-columns: minmax(0, 0.85fr) minmax(300px, 0.7fr) minmax(330px, 0.75fr);
        align-items: end;
        gap: 42px;
    }

    .pricing-plan-detail__intro h3,
    .pricing-section-heading h3,
    .pricing-shared h3 {
        font-size: 40px;
    }

    .pricing-plan-detail .pricing-feature-table {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin-top: 36px;
    }

    .pricing-plan-detail .pricing-feature-row:nth-child(odd) {
        padding-right: 28px;
        border-right: 1px solid var(--pricing-rule);
    }

    .pricing-plan-detail .pricing-feature-row:nth-child(even) {
        padding-left: 28px;
    }

    .pricing-plan-detail .pricing-action {
        width: min(100%, 360px);
        justify-self: end;
    }

    .pricing-plan-detail__intro + .pricing-feature-table + .pricing-action {
        margin-top: 30px;
    }

    .pricing-plan__hint {
        width: min(100%, 420px);
        justify-self: end;
    }

    .pricing-pro-actions {
        width: min(100%, 420px);
        justify-self: end;
        margin-top: 34px;
    }

    .pricing-shared {
        margin-top: 0;
        padding: 54px 48px 58px;
    }

    .pricing-shared-examples__cue {
        display: none;
    }

    .pricing-classroom {
        padding: 50px 0 60px;
    }

    .pricing-classroom__callout {
        grid-template-columns: 150px minmax(0, 1fr);
        align-items: center;
        gap: 24px;
        padding: 23px 26px;
    }

    .pricing-classroom__contact {
        width: min(100%, 360px);
        margin-left: auto;
    }

    .pricing-classroom__contact p {
        text-align: left;
    }

    .pricing-comparison {
        padding: 112px 0 124px;
    }

    .pricing-comparison__frame {
        margin-top: 52px;
    }

    .pricing-comparison-table__feature {
        width: 31%;
    }

    .pricing-comparison-table th,
    .pricing-comparison-table td {
        padding: 20px 18px;
        font-size: 15px;
    }

    .pricing-comparison-table thead th {
        height: 96px;
    }

    .pricing-comparison-table thead .pricing-comparison-table__groups th {
        padding-top: 14px;
        padding-bottom: 14px;
        font-size: 12px;
    }

    .pricing-comparison-table thead th:first-child {
        font-size: 13px;
    }

    .pricing-comparison-table thead strong {
        font-size: 20px;
    }

    .pricing-comparison-table thead small,
    .pricing-comparison-table td > small {
        font-size: 12px;
    }

    .pricing-comparison-table td > span {
        font-size: 21px;
    }

    .pricing-comparison-table .is-limit strong {
        font-size: 17px;
    }

    .pricing-comparison-table .has-policy-text td,
    .pricing-comparison-table .is-policy {
        font-size: 14px;
    }
}

@media (max-width: 379px) {
    .pricing-disclosure__trigger {
        grid-template-columns: 42px minmax(0, 1fr) auto 18px;
        gap: 8px;
    }

    .pricing-disclosure__name strong {
        font-size: 18px;
    }

    .pricing-disclosure__name small {
        font-size: 12px;
    }

    .pricing-disclosure__price strong {
        max-width: 78px;
        font-size: 12px;
    }

    .pricing-comparison__frame {
        border-top: 0;
    }

    .pricing-comparison-table,
    .pricing-comparison-table tbody {
        display: block;
        width: 100%;
    }

    .pricing-comparison-table colgroup,
    .pricing-comparison-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
        border: 0;
    }

    .pricing-comparison-table tbody tr {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        border-top: 1px solid var(--pricing-ink);
    }

    .pricing-comparison-table tbody th {
        grid-column: 1 / -1;
        padding: 13px 4px 9px;
        border-right: 0;
        border-bottom: 0;
        background: var(--pricing-paper);
        font-size: 13px;
        line-height: 1.35;
    }

    .pricing-comparison-table tbody td {
        min-width: 0;
        min-height: 70px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        padding: 9px 5px 11px;
        font-size: 12px;
        line-height: 1.35;
        overflow-wrap: normal;
        word-break: keep-all;
    }

    .pricing-comparison-table tbody td::before {
        display: block;
        color: var(--pricing-muted);
        font-size: 12px;
        font-weight: 760;
        line-height: 1;
    }

    .pricing-comparison-table tbody td:nth-of-type(1)::before {
        content: "Lite";
    }

    .pricing-comparison-table tbody td:nth-of-type(2)::before {
        content: "Pro";
    }

    .pricing-comparison-table tbody td:nth-of-type(3)::before {
        content: "Classroom";
    }

    .pricing-comparison-table .has-policy-text td,
    .pricing-comparison-table .is-policy {
        font-size: 12px;
    }

    .pricing-comparison-table td > small,
    .pricing-comparison-table .has-policy-text td > small {
        margin-top: 0;
        font-size: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pricing-disclosure__trigger,
    .pricing-disclosure__chevron,
    .pricing-disclosure__panel {
        transition-duration: 0.001ms !important;
    }
}