:root {
    --ink: #0A0E2B;
    --ink-2: #0A0E2B;
    --ink-3: #0A0E2B;
    --paper: #FFFFFF;
    --white: #FFFFFF;
    --text: #0A0E2B;
    --muted: rgba(10, 14, 43, 0.62);
    --line: rgba(10, 14, 43, 0.021);
    --primary: #0A0E2B;
    --primary-deep: #0A0E2B;
    --primary-light: #1c2150;
    --primary-lighter: #2a3070;
    --primary-tint: #e8ecf7;
    --primary-mist: #f3f5fb;
    --navy: #0A0E2B;
    --secondary: #950101;
    --secondary-light: #b73838;
    --secondary-lighter: #d24d4d;
    --accent: rgba(10, 14, 43, 0.08);
    --gold: var(--secondary);
    --wine: var(--secondary);
    --cyan: rgba(10, 14, 43, 0.06);
    --silver: rgba(10, 14, 43, 0.048);
    --green: var(--primary);
    --green-deep: var(--primary-deep);
    --blue: var(--primary);
    --beige: var(--accent);
    --beige-soft: rgba(10, 14, 43, 0.04);
    --shadow: 0 18px 48px rgba(10, 14, 43, 0.10);
    --radius: 8px;
    --container: 1180px;
    --section-pad: clamp(22px, 3vw, 36px);
    --band-bg: transparent;
    --band-alt-bg: transparent;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

[id] {
    scroll-margin-top: 78px;
}

body {
    margin: 0;
    font-family: "IBM Plex Sans", sans-serif;
    background: var(--white);
    color: var(--text);
    line-height: 1.55;
    font-size: 15px;
}

body::before {
    content: none;
}

a {
    color: inherit;
}

button,
input,
select,
textarea {
    font: inherit;
}

.loading-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    color: var(--ink);
}

.site-header {
    position: relative;
    z-index: 20;
    min-height: 76px;
    padding: 12px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2));
    display: flex;
    align-items: center;
    gap: 28px;
    background: linear-gradient(120deg, #0A0E2B 0%, #1c2150 100%);
    border-bottom: 1px solid var(--secondary);
    color: var(--white);
    font-family: Arial, sans-serif;
}

.brand-mark {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    min-width: 230px;
}

.brand-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
}

.brand-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: transparent;
}

.brand-mark strong,
.brand-mark small {
    display: block;
}

.brand-mark strong {
    color: var(--white);
    font-size: 1.18rem;
    line-height: 1.05;
    letter-spacing: 0.22em;
    font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
    font-weight: 400;
    text-transform: uppercase;
}

.brand-mark small {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.68rem;
    font-family: Arial, sans-serif;
    font-weight: 500;
}

.header-menu {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 28px;
}

.main-nav {
    flex: 1;
    display: flex;
    justify-content: center;
    gap: 24px;
}

.menu-toggle {
    display: none;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    border: 1px solid rgba(10, 14, 43, 0.048);
    border-radius: var(--radius);
    background: #0A0E2B;
    cursor: pointer;
}

.menu-toggle span {
    width: 20px;
    height: 2px;
    border-radius: 999px;
    background: var(--white);
    transition: transform 180ms ease, opacity 180ms ease;
}

.menu-open .menu-toggle span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.menu-open .menu-toggle span:nth-child(2) {
    opacity: 0;
}

.menu-open .menu-toggle span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.main-nav a,
.header-action {
    text-decoration: none;
    font-weight: 600;
    font-size: 0.8rem;
}

.main-nav a {
    color: rgba(255, 255, 255, 0.76);
}

.main-nav a:hover,
.main-nav a.active {
    color: var(--white);
}

.header-action,
.btn-primary,
.btn-secondary,
.plan-card a,
.service-card a,
.lead-form button,
.admin-header a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius);
    padding: 0 18px;
    text-decoration: none;
    font-weight: 800;
}

.header-action {
    font-size: 0.8rem;
    font-weight: 600;
}

.header-action,
.btn-primary,
.lead-form button,
.admin-header a {
    background: linear-gradient(135deg, #0A0E2B 0%, #1c2150 100%);
    color: var(--white);
    border: 1px solid var(--primary);
    box-shadow: 0 8px 20px rgba(10, 14, 43, 0.18);
    transition: background 220ms ease, transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}

.header-action:hover,
.btn-primary:hover,
.lead-form button:hover,
.admin-header a:hover {
    background: linear-gradient(135deg, #0A0E2B 0%, #2a3070 100%);
    transform: translateY(-2px);
    box-shadow: 0 12px 26px rgba(10, 14, 43, 0.28);
}

.btn-secondary {
    color: var(--ink);
    border: 1px solid var(--line);
    background: var(--white);
}

.section-block,
.about-section,
.process-section,
.plans-section,
.courses-section,
.contact-section,
.site-footer {
    width: min(calc(100% - 36px), var(--container));
    margin-inline: auto;
    padding-inline: 0;
}

.hero-section {
    width: 100%;
    max-width: none;
    display: grid;
    grid-template-columns: minmax(0, 0.98fr) minmax(340px, 0.9fr);
    align-items: start;
    gap: clamp(28px, 5vw, 58px);
    padding-block: 48px 56px;
    padding-inline: max(clamp(18px, 4vw, 54px), calc((100vw - var(--container)) / 2));
    background: transparent;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    color: var(--secondary);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 15px;
}

h1,
h2 {
    font-family: "Libre Baskerville", serif;
    color: var(--ink);
    line-height: 1.05;
    margin: 0;
    letter-spacing: 0;
}

h1:focus,
h2:focus {
    outline: none;
}

h1 {
    font-size: clamp(2.25rem, 4vw, 3.65rem);
    max-width: 660px;
}

h1 em {
    color: var(--secondary);
    font-style: normal;
}

h2 {
    font-size: clamp(1.75rem, 3vw, 2.85rem);
}

h3,
p {
    margin-top: 0;
}

.hero-copy p,
.section-heading p,
.about-section p,
.courses-section p,
.contact-section p {
    color: var(--muted);
    font-size: 1rem;
}

.hero-copy p {
    max-width: 610px;
    margin: 18px 0 0;
}

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

.hero-visual {
    min-height: 430px;
    position: relative;
    border-radius: var(--radius);
    background:
        linear-gradient(140deg, rgba(255, 255, 255, 0.94), rgba(10, 14, 43, 0.120)),
        radial-gradient(circle at 70% 25%, rgba(10, 14, 43, 0.036), transparent 16rem);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.hero-visual::before {
    content: "";
    position: absolute;
    inset: 42px;
    border-radius: var(--radius);
    border: 1px dashed rgba(10, 14, 43, 0.021);
}

.hero-carousel.hero-visual {
    position: relative;
    overflow: hidden;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.hero-carousel.hero-visual::before {
    display: none;
}

.hero-carousel-stage {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 430px;
    border-radius: var(--radius);
    overflow: hidden;
    background: linear-gradient(140deg, rgba(255, 255, 255, 0.6), rgba(10, 14, 43, 0.060));
    animation: heroSlideFade 520ms cubic-bezier(.2, .78, .24, 1);
}

@keyframes heroSlideFade {
    from {
        opacity: 0;
        transform: scale(1.02);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.hero-carousel-stage img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}

.hero-carousel-placeholder {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    color: var(--primary);
    background:
        linear-gradient(135deg, rgba(10, 14, 43, 0.063), rgba(255, 255, 255, 0.88)),
        repeating-linear-gradient(90deg, rgba(10, 14, 43, 0.08) 0 1px, transparent 1px 14px);
}

.hero-carousel-placeholder span {
    font-family: var(--font-sans);
    font-size: 2.4rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    color: rgba(10, 14, 43, 0.78);
}

.hero-carousel-caption {
    position: absolute;
    left: 22px;
    bottom: 18px;
    max-width: min(60%, 360px);
    padding: 10px 14px;
    border-radius: 6px;
    background: linear-gradient(180deg, transparent 0%, rgba(10, 14, 43, 0.083) 100%);
    color: var(--white);
    pointer-events: none;
}

.hero-carousel-caption strong {
    display: block;
    font-family: var(--font-sans);
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 2px;
    text-shadow: 0 1px 3px rgba(10, 14, 43, 0.060);
}

.hero-carousel-caption p {
    margin: 0;
    font-size: 0.76rem;
    line-height: 1.35;
    color: rgba(255, 255, 255, 0.78);
    text-shadow: 0 1px 2px rgba(10, 14, 43, 0.35);
}

.hero-carousel-controls {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
}

.hero-carousel-controls > * {
    pointer-events: auto;
}

.hero-carousel-dots {
    position: absolute;
    right: 14px;
    bottom: 14px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(10, 14, 43, 0.068);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.hero-carousel-dots button {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.55);
    cursor: pointer;
    transition: background 200ms ease, width 200ms ease, transform 200ms ease;
}

.hero-carousel-dots button.active {
    background: rgba(255, 255, 255, 1);
    width: 22px;
    border-radius: 999px;
}

.hero-carousel-dots button:hover {
    transform: scale(1.2);
    background: rgba(255, 255, 255, 0.9);
}

.hero-carousel-nav {
    display: contents;
}

.hero-carousel-nav button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(10, 14, 43, 0.12);
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.1rem;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    box-shadow: none;
    opacity: 0.45;
    transition: background 220ms ease, color 220ms ease, opacity 220ms ease, transform 220ms ease;
}

.hero-carousel-nav button:first-child {
    left: 12px;
}

.hero-carousel-nav button:last-child {
    right: 12px;
}

.hero-carousel:hover .hero-carousel-nav button,
.hero-carousel:focus-within .hero-carousel-nav button {
    opacity: 0.85;
}

.hero-carousel-nav button:hover {
    background: rgba(10, 14, 43, 0.083);
    color: var(--white);
    opacity: 1;
    transform: translateY(-50%) scale(1.06);
}

.dashboard-card,
.floating-card {
    position: absolute;
    border-radius: var(--radius);
    background: var(--white);
    border: 1px solid var(--line);
    box-shadow: 0 18px 50px rgba(10, 14, 43, 0.024);
}

.main-dashboard {
    inset: 70px 46px auto 46px;
    min-height: 220px;
    padding: 24px;
}

.dashboard-card span,
.floating-card span {
    color: var(--muted);
    font-size: 0.88rem;
}

.dashboard-card strong,
.floating-card strong {
    display: block;
    color: var(--ink);
    font-size: 1.14rem;
    margin-top: 5px;
}

.bars {
    height: 110px;
    display: flex;
    align-items: end;
    gap: 16px;
    margin-top: 36px;
}

.bars i {
    flex: 1;
    border-radius: 8px 8px 0 0;
    background: linear-gradient(180deg, var(--accent), var(--primary));
}

.floating-card {
    padding: 18px;
    min-width: 170px;
}

.document-card {
    left: 28px;
    bottom: 54px;
}

.check-card {
    right: 30px;
    bottom: 92px;
}

.announcement-widget {
    position: fixed;
    top: 50%;
    right: clamp(12px, calc((100vw - var(--container)) / 2 - 240px), 40px);
    transform: translateY(-50%);
    width: 260px;
    z-index: 60;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--white);
    box-shadow: 0 18px 44px rgba(10, 14, 43, 0.2);
    animation: announcementSlideIn 420ms cubic-bezier(.2, .78, .24, 1);
}

@keyframes announcementSlideIn {
    from { opacity: 0; transform: translate(40px, -50%); }
    to { opacity: 1; transform: translate(0, -50%); }
}

.announcement-close {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(10, 14, 43, 0.08);
    color: var(--primary);
    font-size: 1.05rem;
    line-height: 1;
    cursor: pointer;
    transition: background 200ms ease, color 200ms ease, transform 200ms ease;
}

.announcement-close:hover {
    background: var(--secondary);
    color: var(--white);
    transform: scale(1.08);
}

.announcement-image {
    width: 100%;
    height: 150px;
    overflow: hidden;
    border-radius: 6px;
    background: var(--primary-tint);
}

.announcement-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.announcement-body strong {
    display: block;
    font-family: var(--font-sans);
    font-size: 1rem;
    font-weight: 700;
    color: var(--ink);
    margin-bottom: 6px;
}

.announcement-body p {
    margin: 0 0 10px;
    font-size: 0.82rem;
    line-height: 1.4;
    color: var(--muted);
}

.announcement-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--secondary);
    color: var(--white);
    font-size: 0.74rem;
    font-weight: 700;
    text-decoration: none;
    transition: background 200ms ease, transform 200ms ease;
}

.announcement-cta:hover {
    background: #b73838;
    transform: translateY(-1px);
}

@media (max-width: 1080px) {
    .announcement-widget {
        display: none;
    }
}

.services-mini {
    width: min(calc(100% - 36px), var(--container));
    margin: 4px auto 40px;
    position: relative;
    z-index: 3;
}

.services-mini-window {
    overflow: hidden;
    padding: 2px;
}

.services-mini-track {
    --visible: 4;
    --total: 1;
    --active-index: 0;
    --gap: 16px;
    display: flex;
    gap: var(--gap);
    align-items: stretch;
    width: calc((100% + var(--gap)) * var(--total) / var(--visible) - var(--gap));
    transform: translateX(calc(var(--active-index) * -1 * (100% / var(--total))));
    transition: transform 540ms cubic-bezier(.2, .78, .24, 1);
}

.services-mini-track.is-resetting {
    transition: none;
}

.service-mini-card {
    flex: 0 0 calc((100% - var(--gap) * (var(--total) - 1)) / var(--total));
    min-width: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--white);
    box-shadow: 0 12px 28px rgba(10, 14, 43, 0.08);
    text-decoration: none;
    color: var(--ink);
    overflow: hidden;
    transition: transform 240ms cubic-bezier(.2, .78, .24, 1),
                box-shadow 240ms ease,
                border-color 240ms ease;
}

.service-mini-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 46px rgba(10, 14, 43, 0.14);
    border-color: rgba(10, 14, 43, 0.22);
}

.service-mini-image {
    width: 100%;
    height: 150px;
    overflow: hidden;
    background: var(--primary-tint);
}

.service-mini-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 480ms ease;
}

.service-mini-card:hover .service-mini-image img {
    transform: scale(1.05);
}

.service-mini-image-placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--primary-mist) 0%, var(--primary-tint) 100%);
}

.service-mini-body {
    padding: 16px 18px 18px;
}

.service-mini-body h3 {
    margin: 0 0 6px;
    color: var(--ink);
    font-family: var(--font-sans);
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.25;
}

.service-mini-body p {
    margin: 0;
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.4;
}

.services-mini-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 14px;
}

.services-mini-dots {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.services-mini-dots button {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(10, 14, 43, 0.24);
    cursor: pointer;
    transition: background 200ms ease, width 200ms ease, transform 200ms ease;
}

.services-mini-dots button.active {
    background: var(--primary);
    width: 22px;
    border-radius: 999px;
}

.services-mini-dots button:hover {
    transform: scale(1.15);
    background: rgba(10, 14, 43, 0.55);
}

.services-mini-nav {
    display: inline-flex;
    gap: 6px;
}

.services-mini-nav button {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(10, 14, 43, 0.16);
    border-radius: 50%;
    background: var(--white);
    color: var(--ink);
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    transition: background 200ms ease, color 200ms ease, transform 200ms ease, border-color 200ms ease;
}

.services-mini-nav button:hover {
    background: var(--primary);
    color: var(--white);
    border-color: var(--primary);
    transform: translateY(-1px);
}

.service-carousel-controls {
    display: none;
}

@media (max-width: 980px) {
    .services-mini-track {
        --visible: 2;
    }
}

@media (max-width: 560px) {
    .services-mini-track {
        --visible: 1;
    }

    .services-page .service-grid {
        display: flex;
        grid-template-columns: none;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 10px;
    }

    .services-page .service-card {
        flex: 0 0 100%;
        width: 100%;
        scroll-snap-align: start;
        scroll-snap-stop: always;
        min-height: auto;
    }

    .services-page .plans-grid {
        display: flex;
        grid-template-columns: none;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 10px;
    }

    .services-page .plan-card {
        flex: 0 0 100%;
        width: 100%;
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .service-carousel-controls {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 14px;
        margin-top: 14px;
    }
}

.kpi-section {
    width: 100%;
    max-width: none;
    margin: 48px 0;
    padding: 52px max(clamp(18px, 4vw, 54px), calc((100vw - var(--container)) / 2));
    background: linear-gradient(180deg, var(--primary-mist) 0%, var(--primary-tint) 100%);
    border-block: 1px solid rgba(28, 33, 80, 0.18);
    color: var(--ink);
}

.kpi-section > .section-heading {
    width: min(100%, var(--container));
    margin: 0 auto 28px;
}

.kpi-grid {
    width: min(100%, var(--container));
    margin-inline: auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.kpi-card {
    position: relative;
    display: grid;
    grid-template-rows: auto auto auto;
    gap: 10px;
    padding: 26px 22px;
    text-align: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--white);
    box-shadow: 0 12px 28px rgba(10, 14, 43, 0.06);
    transition: transform 260ms cubic-bezier(.2,.78,.24,1),
                box-shadow 260ms ease,
                border-color 260ms ease;
}

.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 46px rgba(10, 14, 43, 0.12);
    border-color: rgba(10, 14, 43, 0.060);
}

.kpi-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin: 0 auto;
    border-radius: 50%;
    background: rgba(10, 14, 43, 0.063);
    color: var(--primary);
}

.kpi-icon svg {
    width: 24px;
    height: 24px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.kpi-value {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 2px;
    font-family: var(--font-serif, "Playfair Display", serif);
    font-size: clamp(2.4rem, 4vw, 3.2rem);
    font-weight: 700;
    color: var(--ink);
    line-height: 1;
    letter-spacing: -0.01em;
}

.kpi-suffix {
    color: var(--secondary);
    font-size: 0.7em;
    font-weight: 700;
}

.kpi-label {
    margin: 0;
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.35;
    letter-spacing: 0.02em;
}

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

@media (max-width: 480px) {
    .kpi-grid {
        grid-template-columns: 1fr;
    }
}

.strip-section {
    margin-inline: clamp(18px, 5vw, 72px);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    transform: translateY(-34px);
}

.strip-section article {
    padding: 22px;
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.9);
    color: var(--ink);
    box-shadow: var(--shadow);
}

.strip-section span {
    font-weight: 800;
}

.strip-section p {
    color: #0A0E2B;
    margin: 8px 0 0;
}

.blog-section {
    padding: 48px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2)) 50px;
    background: transparent;
}

.blog-section .section-heading {
    margin-bottom: 24px;
}

.blog-section .section-heading .eyebrow {
    color: var(--secondary);
}

.blog-section h2 {
    font-family: "IBM Plex Sans", sans-serif;
    font-size: clamp(1.7rem, 2.3vw, 2.2rem);
    font-weight: 800;
}

.blog-more {
    width: fit-content;
    min-height: 44px;
    margin: 22px auto 0;
    padding: 0 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: var(--radius);
    background: var(--primary);
    color: var(--white);
    text-decoration: none;
    font-weight: 800;
    box-shadow: 0 14px 30px rgba(10, 14, 43, 0.027);
}

.blog-more::after {
    content: ">";
    font-weight: 900;
}

.section-block,
.about-section,
.process-section,
.plans-section,
.courses-section,
.contact-section {
    padding-block: 56px;
}

.section-block.compact {
    padding-block: 28px 52px;
}

.section-block.values-section {
    width: 100%;
    max-width: none;
    padding: 52px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2));
    margin-top: 0;
    margin-bottom: 0;
    background: var(--band-alt-bg);
    border: 0;
    border-radius: 0;
}

.section-block.values-section > .section-heading,
.section-block.values-section > .value-grid {
    width: min(100%, var(--container));
    margin-inline: auto;
}

.section-heading {
    max-width: 720px;
    margin-bottom: 28px;
}

.section-heading.centered {
    margin-inline: auto;
    text-align: center;
}

.section-heading.centered p {
    margin-inline: auto;
}

.service-grid,
.value-grid,
.process-grid,
.plans-grid,
.content-columns,
.contact-section {
    display: grid;
    gap: 16px;
}

.service-grid {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.service-card,
.value-grid article,
.process-grid article,
.plan-card,
.testimonial-stack blockquote,
.blog-list a,
.lead-form,
.admin-grid article {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.84);
    box-shadow: 0 14px 42px rgba(10, 14, 43, 0.08);
}

.service-card {
    min-height: 196px;
    padding: 0 22px 22px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.service-card-image {
    width: calc(100% + 44px);
    height: 170px;
    margin: 0 -22px 18px;
    overflow: hidden;
    background: var(--primary-tint);
}

.service-card-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 480ms ease;
}

.service-card:hover .service-card-image img {
    transform: scale(1.05);
}

.service-card-image-placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--primary-mist) 0%, var(--primary-tint) 100%);
}

.card-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: var(--radius);
    background: var(--beige-soft);
    color: var(--green-deep);
    font-size: 0.8rem;
    font-weight: 900;
    letter-spacing: 0.03em;
}

.card-icon svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.service-card small {
    color: var(--green-deep);
    font-weight: 800;
    margin-top: 18px;
}

.service-card h3,
.value-grid h3,
.process-grid h3,
.plan-card h3 {
    color: var(--ink);
    font-size: 1.05rem;
    margin: 14px 0 8px;
}

.service-card p,
.service-details,
.value-grid p,
.process-grid p,
.plan-card p,
.plan-card li {
    color: var(--muted);
}

.service-details {
    margin: 0 0 16px;
    padding-left: 18px;
    display: grid;
    gap: 5px;
    font-size: 0.88rem;
}

.service-card a {
    margin-top: auto;
    color: var(--green-deep);
    border: 1px solid rgba(10, 14, 43, 0.033);
    width: fit-content;
}

.services-page {
    padding-bottom: 0;
}

.services-hero {
    width: min(calc(100% - 36px), var(--container));
    margin: 0 auto;
    padding: clamp(54px, 8vw, 92px) 0 28px;
}

.services-hero h1 {
    max-width: 880px;
}

.services-hero p {
    max-width: 720px;
    margin: 18px 0 0;
    color: var(--muted);
    font-size: 1.05rem;
}

.services-page-block {
    scroll-margin-top: 96px;
}

.services-page .plans-section {
    padding-top: 34px;
}

.services-page .plans-grid {
    max-width: 920px;
    margin-inline: auto;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.services-page .section-block {
    padding-top: 44px;
}

#servicios-lista > .section-heading {
    max-width: none;
}

#servicios-lista > .section-heading h2 {
    font-size: clamp(1.5rem, 2.4vw, 2.2rem);
}

@media (min-width: 640px) {
    #servicios-lista > .section-heading h2 {
        white-space: nowrap;
    }
}

.services-page .service-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.services-page .service-card {
    min-height: 300px;
}

/* Desktop: arrange like the "Cómo trabajamos" board (3 cards then 2,
   no step numbers) instead of a plain auto-fit grid. Mobile carousel
   (≤560px) is untouched. */
@media (min-width: 641px) {
    .services-page .service-grid {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 16px;
        align-items: start;
    }

    .services-page .service-card:nth-child(5n + 1),
    .services-page .service-card:nth-child(5n + 2),
    .services-page .service-card:nth-child(5n + 3) {
        grid-column: span 2;
    }

    .services-page .service-card:nth-child(5n + 4),
    .services-page .service-card:nth-child(5n + 5) {
        grid-column: span 3;
    }

    .services-page .service-card {
        min-height: 0;
        padding: 0 16px 16px;
    }

    .services-page .service-card-image {
        height: 100px;
        width: calc(100% + 32px);
        margin: 0 -16px 12px;
    }

    .services-page .service-card h3 {
        font-size: 0.95rem;
        margin: 10px 0 6px;
    }

    .services-page .service-details {
        font-size: 0.82rem;
        gap: 3px;
        margin-bottom: 10px;
    }

    .services-page .service-card a {
        margin-top: 10px;
        font-size: 0.85rem;
        padding: 8px 14px;
    }
}

.services-sat-section {
    margin-top: 10px;
}

.quick-tools-section {
    padding: 12px clamp(18px, 5vw, 72px) 82px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.quick-tools-section article {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 20px;
    align-items: start;
    padding: 30px;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 14px 42px rgba(10, 14, 43, 0.08);
}

.quick-tools-section h2 {
    font-size: clamp(1.65rem, 2.4vw, 2.6rem);
}

.quick-tools-section p {
    color: var(--muted);
}

.about-section {
    width: 100%;
    max-width: none;
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 24px;
    padding: 58px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2)) 50px;
    background: var(--band-bg);
    border: 0;
    border-radius: 0;
    margin-top: 0;
    margin-bottom: 0;
}

.about-section > * {
    min-width: 0;
}

.about-section h2,
.about-section .eyebrow {
    color: var(--secondary);
}

.about-section p {
    color: var(--muted);
}

.mission-grid {
    display: grid;
    gap: 18px;
}

.mission-grid article {
    padding: 24px;
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid var(--line);
    box-shadow: 0 14px 42px rgba(10, 14, 43, 0.08);
}

.mission-grid span {
    color: var(--green-deep);
    font-weight: 800;
}

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

.value-grid article {
    min-height: 186px;
    padding: 22px 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    overflow: hidden;
}

.value-grid article::after {
    content: "";
    position: absolute;
    inset: auto 18px 0 18px;
    height: 4px;
    border-radius: 999px 999px 0 0;
    background: linear-gradient(90deg, var(--primary), var(--accent));
    opacity: 0.75;
}

.value-grid .card-icon {
    margin-bottom: 8px;
    background: rgba(10, 14, 43, 0.063);
    color: var(--primary);
}

.process-section {
    width: 100%;
    max-width: none;
    padding: 34px max(clamp(18px, 4vw, 54px), calc((100vw - var(--container)) / 2));
    background: transparent;
    border: 0;
    border-radius: 0;
}

.process-section > .section-heading,
.process-section > .process-board {
    width: min(100%, var(--container));
    margin-inline: auto;
}

.process-board {
    min-height: auto;
    margin-top: 22px;
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
    align-items: start;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.process-board::before,
.process-board::after {
    display: none;
}

@keyframes processBoardFloat {
    0%, 100% { transform: translate(0, 0); }
    50% { transform: translate(-14px, 12px); }
}

.process-timeline {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 32px 30px;
    padding: 20px 4px 12px;
    overflow: visible;
}

.process-timeline::before {
    display: none;
}

.process-step {
    min-height: 150px;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 34px 84px minmax(0, 1fr);
    align-content: center;
    gap: 12px;
    padding: 16px 14px;
    border: 1px solid rgba(10, 14, 43, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 10px 24px rgba(10, 14, 43, 0.06);
    transition: transform 260ms cubic-bezier(.2,.78,.24,1),
                box-shadow 260ms ease,
                border-color 260ms ease,
                background 260ms ease;
}

.process-step:nth-child(even) {
    margin-left: 0;
    transform: none;
}

.process-step:hover {
    border-color: rgba(10, 14, 43, 0.075);
    box-shadow: 0 22px 46px rgba(10, 14, 43, 0.024),
                0 0 0 4px rgba(10, 14, 43, 0.033);
    transform: translateY(-5px);
    background: rgba(255, 255, 255, 0.96);
}

.process-step:nth-child(even):hover {
    transform: translateY(-5px);
}

.process-step::before {
    display: none;
}

.process-step::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
    background: rgba(10, 14, 43, 0.083);
    border-radius: 999px;
}

.process-step-1::after,
.process-step-2::after {
    left: 100%;
    top: 50%;
    width: 30px;
    height: 1px;
    transform: translateY(-50%);
}

.process-step-1 {
    grid-column: 1 / 3;
    grid-row: 1;
}

.process-step-2 {
    grid-column: 3 / 5;
    grid-row: 1;
}

.process-step-3 {
    grid-column: 5 / 7;
    grid-row: 1;
}

.process-step-3::after {
    display: none;
}

.process-step-4 {
    grid-column: 1 / 4;
    grid-row: 2;
}

.process-step-5 {
    grid-column: 4 / 7;
    grid-row: 2;
}

.process-step-4,
.process-step-5 {
    margin-top: 4px;
}

.process-step-4::after {
    left: 100%;
    top: 50%;
    width: 30px;
    height: 1px;
    transform: translateY(-50%);
}

.process-step-5::after {
    display: none;
}

@keyframes processLineFlow {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

@keyframes processLineFlowV {
    0% { background-position: 0 200%; }
    100% { background-position: 0 -200%; }
}

.process-step:nth-child(1) {
    animation-delay: 40ms;
}

.process-step:nth-child(2) {
    animation-delay: 120ms;
}

.process-step:nth-child(3) {
    animation-delay: 200ms;
}

.process-step:nth-child(4) {
    animation-delay: 280ms;
}

.process-step:nth-child(5) {
    animation-delay: 360ms;
}

.process-step.is-visible {
    animation-name: processPulseIn;
    animation-duration: 620ms;
    animation-timing-function: cubic-bezier(.2, .78, .24, 1);
}

@keyframes processPulseIn {
    0% {
        opacity: 0;
        transform: translateY(22px) scale(0.98);
    }
    65% {
        opacity: 1;
        transform: translateY(-4px) scale(1.01);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.process-step:nth-child(even).is-visible {
    animation-name: processPulseInEven;
}

@keyframes processPulseInEven {
    0% {
        opacity: 0;
        transform: translateY(48px) scale(0.98);
    }
    65% {
        opacity: 1;
        transform: translateY(22px) scale(1.01);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.process-number {
    width: 34px;
    height: 34px;
    font-size: 0.86rem;
    display: grid;
    place-items: center;
    border: 1px solid rgba(10, 14, 43, 0.033);
    border-radius: 50%;
    color: var(--white);
    font-weight: 800;
    background: linear-gradient(135deg, #0A0E2B 0%, #1c2150 100%);
    box-shadow: 0 8px 18px rgba(10, 14, 43, 0.18),
                0 0 0 0 rgba(10, 14, 43, 0.45);
    transition: transform 260ms ease, box-shadow 260ms ease;
    position: relative;
    z-index: 2;
}

.process-step:hover .process-number {
    transform: scale(1.1) rotate(-4deg);
    box-shadow: 0 10px 22px rgba(10, 14, 43, 0.033),
                0 0 0 6px rgba(10, 14, 43, 0.027);
}

.process-image {
    grid-column: 2;
    width: 100%;
    height: 84px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(10, 14, 43, 0.033);
    border-radius: 6px;
    color: var(--primary);
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(10, 14, 43, 0.051), rgba(255, 255, 255, 0.84)),
        repeating-linear-gradient(90deg, rgba(10, 14, 43, 0.08) 0 1px, transparent 1px 12px);
    transition: transform 320ms ease;
}

.process-step:hover .process-image {
    transform: scale(1.04);
}

.process-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 480ms ease;
}

.process-step:hover .process-image img {
    transform: scale(1.08);
}

.process-image span {
    color: rgba(10, 14, 43, 0.72);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.12em;
}

.process-copy {
    grid-column: 3;
    min-width: 0;
}

.process-copy small {
    display: block;
    margin-bottom: 4px;
    color: var(--primary);
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.process-copy h3 {
    margin: 0 0 6px;
    color: var(--ink);
    font-family: var(--font-sans);
    font-size: 0.92rem;
    line-height: 1.22;
}

.process-copy p {
    margin: 0;
    color: var(--muted);
    font-size: 0.74rem;
    line-height: 1.4;
}

.process-reminder {
    align-self: start;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(190px, 0.72fr) minmax(0, 1fr) minmax(280px, 1fr);
    gap: 14px 22px;
    align-items: center;
    width: 100%;
    min-height: 0;
    padding: clamp(12px, 1.7vw, 18px);
    border: 1px solid rgba(10, 14, 43, 0.09);
    border-radius: 6px;
    background: var(--white);
    color: var(--ink);
    box-shadow: 0 24px 52px rgba(10, 14, 43, 0.06);
}

.process-reminder::before {
    content: "";
    position: absolute;
    left: clamp(14px, 2vw, 22px);
    top: clamp(14px, 2vw, 22px);
    width: 54px;
    height: 3px;
    display: block;
    margin-bottom: 0;
    background: var(--accent);
    border-radius: 999px;
}

.process-reminder strong {
    display: block;
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: center;
    margin: 0;
    color: var(--ink);
    font-family: var(--font-serif);
    font-size: clamp(1.18rem, 1.7vw, 1.45rem);
    line-height: 1.1;
}

.process-reminder p {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    margin: 0;
    color: var(--muted);
    font-size: 0.8rem;
    line-height: 1.5;
    text-align: justify;
}

.process-reminder ul {
    grid-column: 3;
    grid-row: 1 / span 2;
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.process-reminder li {
    padding-top: 7px;
    border-top: 1px solid rgba(10, 14, 43, 0.12);
    color: var(--ink);
    font-size: 0.78rem;
}

.team-section {
    width: min(calc(100% - 36px), var(--container));
    margin-inline: auto;
    padding: 62px 0 70px;
    background: var(--white);
}

.team-flow {
    max-width: 860px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
    position: relative;
}

.team-flow::before {
    content: "";
    position: absolute;
    top: 75px;
    left: 15%;
    right: 15%;
    height: 2px;
    background: var(--line);
}

.team-flow article {
    position: relative;
    z-index: 1;
    text-align: center;
}

.team-photo-frame {
    width: 150px;
    height: 150px;
    margin: 0 auto 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(10, 14, 43, 0.120), rgba(255, 255, 255, 0.96));
    border: 5px solid var(--white);
    box-shadow: 0 0 0 1px var(--line), 0 16px 34px rgba(10, 14, 43, 0.12);
}

.team-photo-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.team-photo-frame span {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-sans);
    font-size: 1.55rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.team-flow strong {
    display: block;
    border: 2px solid var(--ink);
    border-radius: var(--radius);
    padding: 10px 12px;
    background: var(--white);
    color: var(--ink);
}

.team-flow small {
    display: block;
    margin-top: 10px;
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.7;
}

.plans-grid {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.plan-card {
    position: relative;
    padding: 24px;
}

.plan-card.featured {
    border-color: rgba(10, 14, 43, 0.62);
    transform: translateY(-12px);
}

.plan-badge {
    position: absolute;
    top: 18px;
    right: 18px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--accent);
    color: var(--ink);
    font-size: 0.76rem;
    font-weight: 800;
}

.plan-card strong {
    display: block;
    color: var(--ink);
    font-size: 1.08rem;
    margin: 14px 0;
}

.plan-card ul {
    padding: 0;
    list-style: none;
    display: grid;
    gap: 9px;
}

.plan-card li::before {
    content: "✓";
    color: var(--green-deep);
    font-weight: 900;
    margin-right: 8px;
}

.plan-card a {
    width: 100%;
    margin-top: 14px;
    background: var(--primary);
    color: var(--white);
}

.courses-section {
    width: 100%;
    max-width: none;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 24px;
    align-items: center;
    padding: 56px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2));
    background:
        linear-gradient(135deg, rgba(10, 14, 43, 0.072), rgba(10, 14, 43, 0.12)),
        var(--beige-soft);
    border-radius: 0;
}

.courses-section > * {
    min-width: 0;
}

.courses-page {
    min-height: calc(100vh - 76px);
    padding-bottom: 0;
}

.courses-construction {
    width: min(calc(100% - 36px), var(--container));
    margin: 0 auto;
    padding: 34px 0 clamp(54px, 8vw, 96px);
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.75fr);
    gap: clamp(28px, 5vw, 72px);
    align-items: center;
}

.courses-construction p {
    max-width: 650px;
    margin: 18px 0 26px;
    color: var(--muted);
    font-size: 1.05rem;
}

.courses-status-card {
    padding: clamp(24px, 4vw, 36px);
    border: 1px solid rgba(10, 14, 43, 0.027);
    border-radius: var(--radius);
    background:
        radial-gradient(circle at 85% 10%, rgba(10, 14, 43, 0.072), transparent 12rem),
        rgba(255, 255, 255, 0.9);
    box-shadow: var(--shadow);
}

.courses-status-card span {
    color: var(--green-deep);
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-size: 0.76rem;
}

.courses-status-card strong {
    display: block;
    margin: 14px 0 18px;
    color: var(--ink);
    font-family: "Libre Baskerville", serif;
    font-size: clamp(1.55rem, 2.4vw, 2.25rem);
    line-height: 1.08;
}

.courses-status-card ul {
    display: grid;
    gap: 10px;
    margin: 0;
    padding-left: 18px;
    color: var(--muted);
}

.sat-section {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    display: grid;
    grid-template-columns: 0.92fr 1.08fr;
    gap: 32px;
    align-items: start;
    padding: 64px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2)) 58px;
    background: transparent;
}

/* ── Courses public page ── */
.courses-hero {
    padding: 48px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2)) 48px;
    text-align: center;
    background: var(--primary);
    color: #fff;
}

.courses-hero h1 {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 600;
    margin: 12px 0 16px;
    color: #fff;
}

.courses-hero p {
    font-size: 1.1rem;
    opacity: 0.82;
    max-width: 620px;
    margin-inline: auto;
}

.courses-catalog {
    padding: 56px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2));
}

.courses-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
    gap: 28px;
}

.course-card {
    background: #fff;
    border: 1px solid #e4e8f0;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.2s, transform 0.2s;
}

.course-card:hover {
    box-shadow: 0 8px 32px rgba(10, 14, 43, 0.12);
    transform: translateY(-2px);
}

.course-card-image {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--primary);
}

.course-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.course-card-body {
    padding: 20px 22px 22px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.course-card-meta {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}

.course-badge-level {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    background: #f0f4ff;
    color: var(--primary);
    padding: 3px 10px;
    border-radius: 20px;
}

.course-badge-sub {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    background: var(--secondary);
    color: #fff;
    padding: 3px 10px;
    border-radius: 20px;
}

.course-card-body h2 {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--primary);
    margin: 0;
    line-height: 1.3;
}

.course-card-body p {
    font-size: 0.92rem;
    color: #555;
    line-height: 1.5;
    margin: 0;
}

.course-instructor,
.course-duration {
    font-size: 0.82rem;
    color: #888;
}

.course-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid #f0f4ff;
}

.course-price {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary);
}

/* ── Subscription plans ── */
.subscription-plans-section {
    padding: 64px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2));
    background: #f5f7ff;
}

.subscription-plans-header {
    text-align: center;
    margin-bottom: 40px;
}

.subscription-plans-header h2 {
    font-size: clamp(1.6rem, 3vw, 2.2rem);
    font-weight: 600;
    color: var(--primary);
    margin: 8px 0 12px;
}

.subscription-plans-header p {
    max-width: 560px;
    margin-inline: auto;
    color: #555;
}

.subscription-plans-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: 24px;
    max-width: 960px;
    margin-inline: auto;
}

.subscription-plan-card {
    background: #fff;
    border: 2px solid #e4e8f0;
    border-radius: 14px;
    padding: 28px 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
    transition: box-shadow 0.2s;
}

.subscription-plans-grid .subscription-plan-card {
    padding: 0;
    overflow: hidden;
    height: 560px;
}

.subscription-plans-grid .plan-card-body {
    flex: 1 1 50%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 24px 24px 28px;
    overflow-y: auto;
}

.subscription-plans-grid .plan-card-body .btn-primary {
    margin-top: auto;
}

.subscription-plan-card.featured {
    border-color: var(--secondary);
    box-shadow: 0 4px 24px rgba(149, 1, 1, 0.1);
}

.plan-card-image {
    overflow: hidden;
    background: var(--primary-tint);
}

.plan-card-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.subscription-plans-grid .subscription-plan-card > .plan-card-image:first-child {
    flex: 1 1 50%;
    min-height: 0;
    border-radius: 0;
}

.subscription-plans-single {
    max-width: 960px;
    margin-inline: auto;
}

.subscription-plan-card-wide {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 32px;
    padding: 36px;
}

.subscription-plan-card-wide .plan-card-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.subscription-plan-card-wide .plan-card-image {
    height: 100%;
    min-height: 260px;
    border-radius: 12px;
}

@media (max-width: 720px) {
    .subscription-plan-card-wide {
        grid-template-columns: 1fr;
        padding: 24px;
    }

    .subscription-plan-card-wide .plan-card-image {
        order: -1;
        min-height: 200px;
    }
}

.plan-badge {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    background: var(--secondary);
    color: #fff;
    padding: 4px 12px;
    border-radius: 20px;
    width: fit-content;
}

.subscription-plan-card h3 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--primary);
    margin: 0;
}

.plan-price-block {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.plan-price {
    font-size: 2rem;
    font-weight: 800;
    color: var(--primary);
}

.plan-period {
    font-size: 0.85rem;
    color: #888;
}

.plan-benefits {
    list-style: none;
    padding: 0;
    margin: 4px 0 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
}

.plan-benefits li {
    font-size: 0.9rem;
    color: #444;
    padding-left: 18px;
    position: relative;
}

.plan-benefits li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--secondary);
    font-weight: 700;
}

/* ── Admin course/lesson/material editors ── */
.admin-course-editor {
    border-left: 3px solid var(--primary);
}

.admin-sub-section {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e8ecf5;
}

.admin-lesson-editor {
    background: #f5f7ff;
    border: 1px solid #d0d8f0;
    border-radius: 8px;
    padding: 14px;
    margin-bottom: 10px;
}

.admin-material-editor {
    display: flex;
    gap: 8px;
    align-items: flex-end;
    background: #eef2ff;
    border-radius: 6px;
    padding: 8px 10px;
    margin-bottom: 6px;
}

.admin-material-editor label {
    flex: 1;
    min-width: 0;
}

.admin-material-editor button {
    background: transparent;
    border: 1px solid #c0c8e0;
    color: var(--secondary);
    font-weight: 700;
    border-radius: 4px;
    padding: 4px 8px;
    cursor: pointer;
    flex-shrink: 0;
    align-self: flex-end;
    margin-bottom: 2px;
}

.admin-upload-row {
    grid-column: 1 / -1;
    display: flex;
    align-items: flex-end;
    gap: 10px;
}

.admin-upload-row > label:first-child {
    flex: 1;
    min-width: 0;
}

.admin-upload-btn {
    position: relative !important;
    display: inline-flex !important;
    align-items: center;
    padding: 7px 14px;
    background: var(--primary);
    color: #fff !important;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    margin-bottom: 2px;
}

.admin-upload-btn input[type="file"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.admin-upload-error {
    grid-column: 1 / -1;
    font-size: 0.78rem;
    color: var(--secondary);
    margin-top: 4px;
}

.sat-section > * {
    min-width: 0;
}

.sat-copy h2 {
    max-width: 640px;
}

.sat-copy p {
    max-width: 560px;
    color: var(--muted);
    font-size: 1rem;
}

.help-card,
.mini-testimonials,
.sat-form {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(10, 14, 43, 0.120);
    box-shadow: 0 16px 45px rgba(10, 14, 43, 0.08);
}

.help-card {
    display: grid;
    gap: 6px;
    max-width: 510px;
    margin-top: 28px;
    padding: 20px;
}

.help-card strong {
    color: var(--ink);
}

.help-card span {
    color: var(--muted);
}

.mini-testimonials {
    max-width: 510px;
    min-height: 230px;
    margin-top: 18px;
    padding: 20px;
}

.mini-testimonials span {
    display: block;
    color: var(--ink);
    font-size: 1.12rem;
    font-weight: 800;
    margin-bottom: 16px;
}

.sat-testimonial-list {
    display: grid;
    gap: 14px;
}

.sat-testimonial-list blockquote {
    margin: 0;
    padding: 15px;
    border: 1px solid rgba(10, 14, 43, 0.024);
    border-radius: var(--radius);
    background: linear-gradient(180deg, rgba(10, 14, 43, 0.033), rgba(255, 255, 255, 0.86));
}

.sat-testimonial-list p {
    margin: 0 0 14px;
    color: var(--ink);
    font-size: 0.98rem;
}

.sat-testimonial-list cite {
    color: var(--green-deep);
    font-style: normal;
    font-weight: 800;
}

.sat-testimonial-list cite span {
    display: block;
    color: var(--muted);
    font-weight: 500;
}

.sat-form {
    padding: 22px;
    display: grid;
    gap: 14px;
}

.person-toggle {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 6px;
    background: #0A0E2B;
    border-radius: var(--radius);
}

.person-toggle button,
.sat-form button {
    min-height: 42px;
    border-radius: var(--radius);
    border: 0;
    font-weight: 800;
}

.person-toggle button {
    background: transparent;
    color: var(--muted);
}

.person-toggle button.active {
    background: var(--white);
    color: var(--primary);
    box-shadow: 0 8px 24px rgba(10, 14, 43, 0.08);
}

.sat-form label {
    color: var(--ink);
    font-weight: 800;
}

.sat-form select,
.sat-contact-step input,
.sat-form fieldset label {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--white);
}

.sat-form select,
.sat-contact-step input {
    margin-top: 8px;
    padding: 13px;
}

.sat-form fieldset {
    display: grid;
    gap: 10px;
    border: 0;
    padding: 0;
    margin: 8px 0 0;
}

.sat-form legend {
    margin-bottom: 10px;
    color: var(--ink);
    font-weight: 900;
}

.sat-form fieldset label {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 14px;
    color: var(--muted);
}

.sat-request-form fieldset {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sat-request-form fieldset legend {
    grid-column: 1 / -1;
}

.sat-request-form fieldset label {
    cursor: pointer;
    transition: border-color 0.18s ease, background-color 0.18s ease, transform 0.18s ease;
}

.sat-request-form fieldset label.selected {
    border-color: rgba(10, 14, 43, 0.063);
    background: rgba(10, 14, 43, 0.039);
}

.sat-request-form fieldset label:hover {
    transform: translateY(-1px);
    border-color: rgba(10, 14, 43, 0.048);
}

.sat-summary {
    display: grid;
    gap: 7px;
    padding: 16px;
    border: 1px solid rgba(10, 14, 43, 0.027);
    border-radius: var(--radius);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(10, 14, 43, 0.027));
}

.sat-summary span {
    color: var(--green-deep);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.sat-summary strong {
    color: var(--ink);
}

.sat-summary p,
.sat-summary small {
    margin: 0;
    color: var(--muted);
}

.sat-summary ul {
    margin: 4px 0 0;
    padding-left: 18px;
    color: var(--muted);
}

.sat-form button {
    background: var(--primary);
    color: var(--white);
}

.sat-submit-link {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    border: 0;
    border-radius: var(--radius);
    background: var(--primary);
    color: var(--white);
    text-decoration: none;
    font-weight: 900;
    cursor: pointer;
}

.sat-contact-step {
    display: grid;
    gap: 14px;
    margin-top: 4px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.74);
}

.sat-contact-step label {
    display: grid;
    gap: 3px;
}

.sat-contact-step input {
    color: var(--ink);
    font-weight: 700;
}

.sat-contact-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
}

.sat-form .sat-back-button,
.sat-whatsapp-link {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: var(--radius);
    font-weight: 900;
    text-decoration: none;
}

.sat-form .sat-back-button {
    border: 1px solid var(--line);
    background: var(--white);
    color: var(--ink);
}

.sat-whatsapp-link {
    background: #0A0E2B;
    color: var(--white);
    box-shadow: none;
    cursor: not-allowed;
    opacity: 0.72;
    transition: background-color 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease, transform 0.18s ease;
}

.sat-whatsapp-link.is-ready {
    background: #0A0E2B;
    box-shadow: 0 14px 30px rgba(10, 14, 43, 0.033);
    cursor: pointer;
    opacity: 1;
}

.sat-whatsapp-link.is-ready:hover {
    transform: translateY(-1px);
}

.sat-whatsapp-link svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.sat-help-card {
    position: relative;
    grid-template-columns: auto 1fr;
    align-items: start;
    gap: 6px 14px;
}

.sat-help-card .help-icon {
    grid-row: 1 / span 3;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(10, 14, 43, 0.027);
    color: var(--primary);
    font-weight: 900;
}

.sat-help-card a {
    width: fit-content;
    color: var(--primary);
    text-decoration: none;
    font-weight: 800;
}

.sat-carousel > span {
    color: var(--muted);
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.sat-carousel blockquote {
    margin: 0;
}

.sat-carousel .stars {
    color: var(--gold);
    letter-spacing: 0.08em;
    margin-bottom: 10px;
    font-size: 1.02rem;
    font-weight: 900;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}

.testimonial-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 18px;
}

.testimonial-dots,
.testimonial-controls > div:last-child {
    display: flex;
    gap: 8px;
}

.testimonial-dots button {
    width: 7px;
    height: 7px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #0A0E2B;
}

.testimonial-dots button.active {
    width: 9px;
    height: 9px;
    background: var(--primary);
}

.testimonial-controls > div:last-child button {
    width: 30px;
    height: 30px;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: var(--white);
    color: var(--primary);
    font-weight: 900;
}

.sat-carousel-slide {
    animation: testimonialSlideIn 0.42s ease both;
}

@keyframes testimonialSlideIn {
    from {
        opacity: 0;
        transform: translateX(18px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.sat-request-form {
    gap: 18px;
    background: rgba(10, 14, 43, 0.120);
}

.sat-request-form .person-toggle {
    padding: 5px;
}

.sat-request-form .person-toggle button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.sat-regime-field {
    padding: 14px;
    border: 1px solid rgba(10, 14, 43, 0.042);
    border-radius: var(--radius);
    background: rgba(10, 14, 43, 0.06);
    transition: border-color 0.18s ease, background-color 0.18s ease;
}

.sat-regime-field.is-valid {
    border-color: rgba(10, 14, 43, 0.068);
    background: rgba(10, 14, 43, 0.07);
}

.sat-valid-hint {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 10px;
    color: #0A0E2B;
    font-size: 0.84rem;
    font-weight: 800;
}

.sat-valid-hint::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

.sat-request-form fieldset {
    grid-template-columns: 1fr;
}

.sat-request-form fieldset label {
    min-height: 48px;
    color: var(--ink);
}

.sat-request-form fieldset label.selected {
    border-color: rgba(10, 14, 43, 0.38);
    background: rgba(10, 14, 43, 0.08);
}

.sat-request-form input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--ink);
}

.sat-selected-count {
    margin: 0;
    color: var(--muted);
    font-size: 0.92rem;
}

.course-preview {
    min-height: 230px;
    padding: 26px;
    border-radius: var(--radius);
    background: var(--white);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}

.course-preview span {
    color: var(--green-deep);
    font-weight: 800;
}

.course-preview strong {
    display: block;
    color: var(--ink);
    font-family: "Libre Baskerville", serif;
    font-size: 1.85rem;
    line-height: 1.1;
    margin: 14px 0;
}

.content-columns {
    grid-template-columns: 0.9fr 1.1fr;
}

.testimonial-stack,
.blog-card-grid {
    display: grid;
    gap: 14px;
}

.testimonial-stack blockquote,
.blog-card {
    margin: 0;
    padding: 20px;
    text-decoration: none;
}

.blog-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 560px) {
    .blog-card-grid {
        display: flex;
        grid-template-columns: none;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 10px;
    }

    .blog-card {
        flex: 0 0 100%;
        width: 100%;
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }
}

.blog-card {
    display: grid;
    padding: 0;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 2px;
    box-shadow: 0 14px 36px rgba(10, 14, 43, 0.12);
}

.blog-card strong,
.blog-card small,
.blog-card p {
    margin-inline: 20px;
}

.blog-card strong {
    margin-top: 18px;
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.25;
}

.blog-card small {
    margin-top: 10px;
    margin-bottom: 18px;
    color: var(--muted);
    border-top: 1px solid var(--line);
    padding-top: 14px;
}

.blog-card p {
    color: var(--muted);
    margin-bottom: 18px;
}

.blog-image {
    height: 180px;
    display: block;
    background:
        linear-gradient(135deg, rgba(10, 14, 43, 0.027), rgba(10, 14, 43, 0.027)),
        var(--beige-soft);
    position: relative;
}

.blog-image::after {
    content: "";
    position: absolute;
    inset: 34px 24px;
    border-radius: var(--radius);
    border: 2px solid rgba(10, 14, 43, 0.027);
}

.blog-image-1 {
    background:
        linear-gradient(135deg, rgba(10, 14, 43, 0.042), rgba(10, 14, 43, 0.030)),
        repeating-linear-gradient(90deg, transparent 0 15px, rgba(10, 14, 43,.1) 15px 18px),
        #0A0E2B;
}

.blog-image-2 {
    background:
        linear-gradient(135deg, rgba(10, 14, 43, 0.036), rgba(10, 14, 43, 0.036)),
        #0A0E2B;
}

.blog-image-3 {
    background:
        linear-gradient(135deg, rgba(10, 14, 43, 0.027), rgba(10, 14, 43, 0.12)),
        #0A0E2B;
}

@keyframes fadeLift {
    from {
        opacity: 0;
        transform: translate3d(var(--reveal-x, 0), var(--reveal-y, 18px), 0) scale(var(--reveal-scale, 1));
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes softScaleIn {
    from {
        opacity: 0;
        transform: translate3d(var(--reveal-x, 0), var(--reveal-y, 8px), 0) scale(var(--reveal-scale, 0.985));
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

.hero-copy,
.hero-visual,
.services-hero,
.courses-construction > div,
.service-mini-card,
.blog-card,
.about-section,
.value-grid article,
.process-grid article,
.team-flow article,
.service-card,
.plan-card,
.courses-section,
.sat-copy,
.sat-form,
.contact-section,
.site-footer {
    --reveal-animation: fadeLift;
    --reveal-x: 0;
    --reveal-y: 18px;
    --reveal-scale: 1;
}

.hero-visual,
.about-section,
.courses-section,
.sat-form {
    --reveal-animation: softScaleIn;
}

.hero-visual {
    --reveal-delay: 0.08s;
    --reveal-x: 18px;
    --reveal-y: 0;
}

.hero-copy,
.services-hero,
.sat-copy {
    --reveal-x: -18px;
    --reveal-y: 0;
}

.sat-form {
    --reveal-x: 18px;
    --reveal-y: 0;
}

.about-section,
.courses-section,
.contact-section,
.site-footer {
    --reveal-y: 10px;
    --reveal-scale: 0.99;
}

.team-flow article:nth-child(odd),
.process-grid article:nth-child(odd),
.value-grid article:nth-child(odd) {
    --reveal-x: -14px;
    --reveal-y: 12px;
}

.team-flow article:nth-child(even),
.process-grid article:nth-child(even),
.value-grid article:nth-child(even) {
    --reveal-x: 14px;
    --reveal-y: 12px;
}

.service-card:nth-child(3n + 1),
.plan-card:nth-child(1),
.blog-card:nth-child(1) {
    --reveal-x: -16px;
    --reveal-y: 14px;
}

.service-card:nth-child(3n + 2),
.plan-card:nth-child(2),
.blog-card:nth-child(2) {
    --reveal-x: 0;
    --reveal-y: 18px;
}

.service-card:nth-child(3n),
.plan-card:nth-child(3),
.blog-card:nth-child(3) {
    --reveal-x: 16px;
    --reveal-y: 14px;
}

.service-mini-card:nth-child(1),
.service-card:nth-child(1),
.value-grid article:nth-child(1),
.process-grid article:nth-child(1),
.plan-card:nth-child(1),
.blog-card:nth-child(1) {
    --reveal-delay: 0.05s;
}

.service-mini-card:nth-child(2),
.service-card:nth-child(2),
.value-grid article:nth-child(2),
.process-grid article:nth-child(2),
.plan-card:nth-child(2),
.blog-card:nth-child(2) {
    --reveal-delay: 0.12s;
}

.service-mini-card:nth-child(3),
.service-card:nth-child(3),
.value-grid article:nth-child(3),
.process-grid article:nth-child(3),
.plan-card:nth-child(3),
.blog-card:nth-child(3) {
    --reveal-delay: 0.19s;
}

.service-mini-card:nth-child(4),
.service-card:nth-child(4),
.value-grid article:nth-child(4) {
    --reveal-delay: 0.26s;
}

.service-card:nth-child(5) {
    --reveal-delay: 0.08s;
}

.service-card:nth-child(6) {
    --reveal-delay: 0.15s;
}

.service-card:nth-child(7) {
    --reveal-delay: 0.22s;
}

.service-card:nth-child(8) {
    --reveal-delay: 0.29s;
}

.service-card:nth-child(9) {
    --reveal-delay: 0.36s;
}

.reveal-on-scroll {
    opacity: 0;
    transform: translate3d(var(--reveal-x, 0), var(--reveal-y, 18px), 0) scale(var(--reveal-scale, 1));
    will-change: opacity, transform;
}

.reveal-on-scroll.is-visible {
    animation: var(--reveal-animation, fadeLift) 0.7s ease both;
    animation-delay: var(--reveal-delay, 0s);
}

.reveal-on-scroll:not(.is-visible) {
    animation: none;
}

.service-mini-card,
.service-card,
.value-grid article,
.process-grid article,
.plan-card,
.blog-card,
.mission-grid article {
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.service-mini-card:hover,
.service-card:hover,
.value-grid article:hover,
.process-grid article:hover,
.plan-card:hover,
.blog-card:hover,
.mission-grid article:hover {
    transform: translateY(-4px);
    border-color: rgba(10, 14, 43, 0.042);
    box-shadow: 0 18px 44px rgba(10, 14, 43, 0.12);
}

.main-nav a,
.header-action,
.btn-primary,
.btn-secondary,
.service-card a,
.plan-card a,
.blog-more {
    transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.header-action:hover,
.btn-primary:hover,
.btn-secondary:hover,
.service-card a:hover,
.plan-card a:hover,
.blog-more:hover {
    transform: translateY(-2px);
}

.testimonial-stack p {
    color: var(--ink);
    font-size: 1.05rem;
}

.testimonial-stack cite {
    color: var(--green-deep);
    font-style: normal;
    font-weight: 800;
}

.testimonial-stack cite span,
.blog-list span {
    display: block;
    color: var(--muted);
    font-weight: 500;
}

.blog-list strong {
    color: var(--ink);
    display: block;
    margin: 8px 0;
}

.blog-list p {
    color: var(--muted);
    margin: 0;
}

.contact-section {
    width: 100%;
    max-width: none;
    grid-template-columns: 0.8fr 1.2fr;
    padding: 58px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2));
    background: var(--band-alt-bg);
    border: 0;
    border-radius: 0;
}

.contact-section > * {
    min-width: 0;
}

.contact-section-single {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
}

.contact-section-single > div {
    max-width: 640px;
}

.contact-section-single .lead-form {
    width: 100%;
    max-width: 640px;
    text-align: left;
}

.contact-section .eyebrow {
    color: var(--secondary);
}

.contact-section h2 {
    color: var(--ink);
}

.contact-section p {
    color: var(--muted);
}

.lead-form {
    padding: 28px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.12);
}

.lead-form label {
    color: var(--ink);
    font-weight: 800;
}

.lead-form .full,
.lead-form button {
    grid-column: 1 / -1;
}

.lead-form input,
.lead-form select,
.lead-form textarea {
    width: 100%;
    margin-top: 7px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.94);
    color: var(--ink);
    padding: 12px 13px;
}

.site-footer {
    width: 100%;
    margin-inline: 0;
    padding-inline: 18px;
    padding-block: 42px;
    background: linear-gradient(180deg, #0A0E2B 0%, #1c2150 100%);
    color: rgba(255, 255, 255, 0.74);
    border-top: 2px solid var(--secondary);
    font-family: Arial, sans-serif;
}

.footer-inner {
    width: min(100%, var(--container));
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(240px, 1.3fr) minmax(160px, 0.7fr) minmax(190px, 0.8fr) 150px;
    gap: 32px;
    align-items: start;
}

.site-footer strong {
    display: block;
    color: var(--white);
    font-size: 0.96rem;
    font-weight: 700;
}

.footer-logo {
    width: 54px;
    height: 54px;
    object-fit: cover;
    border-radius: var(--radius);
    border: 1px solid rgba(10, 14, 43, 0.042);
    display: block;
    margin-bottom: 12px;
}

.site-footer p {
    max-width: 440px;
    color: rgba(255, 255, 255, 0.68);
    margin: 8px 0 0;
    font-family: Arial, sans-serif;
    font-weight: 400;
    font-size: 0.88rem;
}

.footer-links {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.footer-links span,
.footer-globe-wrap span {
    color: var(--white);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.site-footer a {
    color: rgba(255, 255, 255, 0.74);
    text-decoration: none;
    width: fit-content;
    font-size: 0.86rem;
    font-weight: 400;
}

.site-footer a:hover {
    color: var(--accent);
}

.footer-globe-wrap {
    justify-self: end;
    display: grid;
    justify-items: center;
    gap: 12px;
    padding: 16px 18px 14px;
    border-radius: var(--radius);
    border: 1px solid rgba(10, 14, 43, 0.033);
    background:
        radial-gradient(circle at 30% 20%, rgba(10, 14, 43, 0.024), transparent 58%),
        linear-gradient(145deg, #0A0E2B, #0A0E2B);
    box-shadow: 0 18px 36px rgba(10, 14, 43, 0.024);
}

.footer-globe-wrap span {
    padding: 6px 10px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.10);
    color: rgba(255, 255, 255, 0.92);
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35);
}

.footer-globe {
    width: 126px;
    max-width: 100%;
    border-radius: 0;
    border: 0;
    display: block;
    object-fit: contain;
    object-position: center;
    background: transparent;
    filter: drop-shadow(0 10px 20px rgba(10, 14, 43, 0.027));
    box-shadow: none;
}

.footer-video {
    aspect-ratio: 1 / 1;
    object-fit: contain;
    mix-blend-mode: screen;
}

.admin-shell {
    min-height: 100vh;
    padding: clamp(22px, 4vw, 56px);
    background:
        radial-gradient(circle at 12% 8%, rgba(42, 48, 112, 0.10), transparent 30%),
        linear-gradient(180deg, #f7f9fc 0%, #ffffff 42%, #f3f6fb 100%);
}

.admin-header {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    margin: 0 auto 22px;
    max-width: 1600px;
    padding: 20px;
    border: 1px solid rgba(10, 14, 43, 0.08);
    border-radius: 14px;
    background: linear-gradient(135deg, #050816, #0A0E2B 62%, #1c2150);
    color: var(--white);
    box-shadow: 0 22px 60px rgba(10, 14, 43, 0.16);
}

.admin-header span {
    color: rgba(216, 230, 255, 0.78);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: 0.78rem;
    font-weight: 800;
}

.admin-header h1 {
    margin: 4px 0 6px;
    color: var(--white);
    font-size: clamp(1.9rem, 3vw, 3.2rem);
}

.admin-header p {
    margin: 0;
    color: rgba(255, 255, 255, 0.72);
}

.admin-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.admin-actions form {
    margin: 0;
}

.admin-actions button,
.admin-actions a,
.admin-savebar button,
.admin-section-save button,
.admin-section-tools button,
.admin-card-editor-header button,
.admin-preview-header button,
.admin-component-preview-list button,
.admin-preview-modal-actions button {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius);
    padding: 0 16px;
    background: var(--white);
    color: var(--ink);
    font-size: 0.9rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease;
}

.admin-actions a,
.admin-section-save button {
    background: #1188ad;
    color: var(--white);
    border-color: #1188ad;
    box-shadow: 0 12px 26px rgba(17, 136, 173, 0.22);
}

.admin-actions button {
    background: rgba(255, 255, 255, 0.10);
    color: var(--white);
}

.admin-actions button:hover,
.admin-actions a:hover,
.admin-savebar button:hover,
.admin-section-save button:hover,
.admin-section-tools button:hover,
.admin-card-editor-header button:hover,
.admin-preview-header button:hover,
.admin-component-preview-list button:hover,
.admin-preview-modal-actions button:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 30px rgba(10, 14, 43, 0.15);
}

.admin-actions form + button,
.admin-card-editor-header button {
    color: var(--secondary);
    background: #fff7f7;
    border-color: rgba(149, 1, 1, 0.18);
}

.admin-actions form + button:hover,
.admin-card-editor-header button:hover {
    background: var(--secondary);
    color: var(--white);
    border-color: var(--secondary);
}

.admin-status {
    margin-bottom: 18px;
    padding: 14px 16px;
    border: 1px solid rgba(10, 14, 43, 0.030);
    border-radius: var(--radius);
    background: rgba(10, 14, 43, 0.08);
    color: var(--green-deep);
    font-weight: 800;
}

.admin-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 410px);
    gap: 22px;
    align-items: start;
    max-width: 1600px;
    margin: 0 auto;
}

.admin-preview-panel {
    position: sticky;
    top: 24px;
    order: 2;
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(10, 14, 43, 0.120));
    box-shadow: 0 18px 52px rgba(10, 14, 43, 0.10);
}

.admin-preview-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.admin-preview-header span,
.admin-preview-panel p {
    color: var(--muted);
    font-size: 0.78rem;
}

.admin-preview-header span {
    display: block;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.admin-preview-header strong {
    display: block;
    color: var(--ink);
    font-size: 1rem;
}

.admin-preview-header button {
    min-height: 36px;
    color: var(--ink);
}

.admin-preview-frame {
    height: min(68vh, 720px);
    min-height: 460px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--white);
}

.admin-preview-frame iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

.admin-component-preview-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.admin-component-preview-list span {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.admin-component-preview-list button {
    min-height: 36px;
    background: rgba(255, 255, 255, 0.86);
    font-size: 0.86rem;
}

.admin-component-preview-list button:hover {
    border-color: rgba(10, 14, 43, 0.051);
    color: var(--green-deep);
}

.admin-preview-panel p {
    margin: 0;
}

.admin-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: grid;
    place-items: center;
    padding: 22px;
    background: rgba(10, 14, 43, 0.56);
    backdrop-filter: blur(10px);
}

.admin-preview-modal {
    width: min(100%, 1380px);
    max-height: calc(100vh - 44px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: var(--radius);
    background: #0A0E2B;
    box-shadow: 0 30px 90px rgba(10, 14, 43, 0.051);
}

.admin-preview-modal header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid var(--line);
}

.admin-preview-modal header span {
    color: var(--green-deep);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.admin-preview-modal h2 {
    margin: 4px 0 0;
    font-size: clamp(1.35rem, 2vw, 2rem);
}

.admin-preview-modal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.admin-preview-modal-actions button {
    min-height: 38px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--white);
    color: var(--ink);
    padding: 0 14px;
    font-weight: 900;
    cursor: pointer;
}

.admin-preview-modal-actions button.active {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--white);
}

.admin-modal-frame-wrap {
    height: calc(100vh - 150px);
    min-height: 520px;
    display: grid;
    justify-items: center;
    overflow: auto;
    padding: 18px;
    background:
        linear-gradient(45deg, rgba(10, 14, 43, 0.06) 25%, transparent 25%),
        linear-gradient(-45deg, rgba(10, 14, 43, 0.06) 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, rgba(10, 14, 43, 0.06) 75%),
        linear-gradient(-45deg, transparent 75%, rgba(10, 14, 43, 0.06) 75%),
        #0A0E2B;
    background-size: 28px 28px;
    background-position: 0 0, 0 14px, 14px -14px, -14px 0;
}

.admin-modal-frame-wrap iframe {
    width: min(100%, 1366px);
    min-height: 100%;
    border: 0;
    border-radius: var(--radius);
    background: var(--white);
    box-shadow: 0 18px 50px rgba(10, 14, 43, 0.033);
}

.admin-modal-frame-wrap.mobile iframe {
    width: 390px;
}

.admin-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.admin-grid article {
    padding: 24px;
}

.admin-grid strong,
.admin-grid span {
    display: block;
}

.admin-grid strong {
    color: var(--ink);
    font-size: 1.1rem;
}

.admin-grid span {
    color: var(--muted);
    margin-top: 8px;
}

.admin-editor {
    order: 1;
    display: grid;
    gap: 12px;
    min-width: 0;
    counter-reset: admin-panel;
}

.admin-panel {
    counter-increment: admin-panel;
    padding: 0;
    border: 1px solid rgba(10, 14, 43, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 12px 30px rgba(10, 14, 43, 0.06);
    overflow: hidden;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.admin-panel:hover {
    border-color: rgba(17, 136, 173, 0.28);
    box-shadow: 0 18px 42px rgba(10, 14, 43, 0.09);
}

.admin-panel h2 {
    margin: 0 0 18px;
    font-size: clamp(1.35rem, 2.2vw, 2rem);
}

.admin-panel p {
    color: var(--muted);
    margin: 0;
}

.admin-panel-toggle {
    width: 100%;
    min-height: 64px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 12px;
    border: 0;
    background:
        linear-gradient(90deg, rgba(10, 14, 43, 0.045), transparent 42%),
        rgba(255, 255, 255, 0.96);
    color: var(--ink);
    padding: 14px clamp(16px, 2.5vw, 24px);
    text-align: left;
    cursor: pointer;
}

.admin-panel-toggle::before {
    content: counter(admin-panel, decimal-leading-zero);
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(10, 14, 43, 0.12);
    border-radius: 50%;
    background: var(--ink);
    color: var(--white);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.06em;
}

.admin-panel-toggle::after {
    content: "";
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(17, 136, 173, 0.20);
    border-radius: 50%;
    background: rgba(17, 136, 173, 0.10);
    color: #1188ad;
    font-size: 1.1rem;
    font-weight: 900;
    transition: transform 160ms ease, background 160ms ease, color 160ms ease;
    background-image:
        linear-gradient(45deg, transparent 50%, currentColor 50%),
        linear-gradient(135deg, currentColor 50%, transparent 50%);
    background-position: calc(50% - 4px) 52%, calc(50% + 4px) 52%;
    background-size: 8px 8px, 8px 8px;
    background-repeat: no-repeat;
}

.admin-panel-toggle span {
    font-family: "IBM Plex Sans", sans-serif;
    font-size: clamp(1rem, 1.3vw, 1.18rem);
    font-weight: 900;
    letter-spacing: 0;
}

.admin-panel-toggle strong {
    min-width: 78px;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(10, 14, 43, 0.07);
    color: var(--ink);
    font-family: "IBM Plex Sans", sans-serif;
    font-size: 0.82rem;
    font-weight: 900;
}

.admin-panel-toggle[aria-expanded="true"] {
    border-bottom: 1px solid var(--line);
    background:
        linear-gradient(90deg, rgba(17, 136, 173, 0.13), transparent 48%),
        var(--white);
}

.admin-panel-toggle[aria-expanded="true"] strong {
    background: #1188ad;
    color: var(--white);
}

.admin-panel-toggle[aria-expanded="true"]::after {
    transform: rotate(180deg);
    background: var(--ink);
    color: var(--white);
}

.admin-panel-body {
    padding: clamp(18px, 2.6vw, 28px);
}

.admin-form-grid,
.admin-card-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.admin-card-list.three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-card-list.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.admin-card-list.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 16px;
}

.admin-section-tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 clamp(18px, 2.6vw, 28px);
    margin-top: 18px;
}

.admin-section-tools strong {
    color: var(--ink);
    font-size: 1rem;
}

.admin-section-tools button,
.admin-card-editor-header button {
    min-height: 36px;
    padding: 0 12px;
}

.admin-section-tools button {
    background: #eff8fb;
    color: #0a6f8f;
    border-color: rgba(17, 136, 173, 0.22);
}

.admin-card-editor {
    display: grid;
    gap: 12px;
    padding: 16px;
    border: 1px solid rgba(10, 14, 43, 0.075);
    border-radius: 12px;
    background: var(--white);
    box-shadow: 0 8px 24px rgba(10, 14, 43, 0.04);
}

.admin-card-editor strong {
    color: var(--ink);
}

.admin-card-editor-header {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
}

.admin-card-editor-header button {
    min-height: 34px;
}

.admin-panel label {
    display: grid;
    gap: 7px;
    color: var(--ink);
    font-size: 0.88rem;
    font-weight: 850;
}

.admin-panel label.wide,
.admin-card-editor .wide {
    grid-column: 1 / -1;
}

.admin-panel input,
.admin-panel select,
.admin-panel textarea {
    width: 100%;
    border: 1px solid rgba(10, 14, 43, 0.10);
    border-radius: var(--radius);
    background: var(--white);
    color: var(--ink);
    padding: 11px 12px;
    font-weight: 650;
    transition: border-color 150ms ease, box-shadow 150ms ease, background 150ms ease;
}

.admin-panel input:focus,
.admin-panel select:focus,
.admin-panel textarea:focus {
    outline: 0;
    border-color: #1188ad;
    box-shadow: 0 0 0 4px rgba(17, 136, 173, 0.14);
    background: #fbfdff;
}

.admin-panel textarea {
    resize: vertical;
}

.admin-panel .check-row {
    grid-template-columns: auto 1fr;
    align-items: center;
    width: fit-content;
}

.admin-panel .check-row input {
    width: auto;
}

.muted-panel {
    background: rgba(10, 14, 43, 0.120);
}

.admin-savebar {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: flex-end;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 30px rgba(10, 14, 43, 0.06);
}

.admin-savebar a {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    border-radius: var(--radius);
    background: var(--ink);
    color: var(--white);
    font-weight: 900;
    text-decoration: none;
}

.admin-section-save {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 0 clamp(18px, 2.6vw, 28px) clamp(18px, 2.6vw, 28px);
}

.admin-section-save span {
    color: #0a6f8f;
    font-size: 0.9rem;
    font-weight: 850;
}

.admin-login-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background: linear-gradient(135deg, var(--paper), #0A0E2B);
}

.admin-login-card {
    width: min(100%, 440px);
    padding: clamp(26px, 5vw, 42px);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--shadow);
}

.admin-login-card span {
    color: var(--green-deep);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.admin-login-card h1 {
    margin: 12px 0;
    font-size: clamp(2rem, 6vw, 3rem);
}

.admin-login-card p {
    margin: 0 0 22px;
    color: var(--muted);
}

.purchase-credentials {
    display: grid;
    gap: 6px;
    margin: 0 0 22px;
    padding: 14px 16px;
    border: 1px dashed var(--line);
    border-radius: var(--radius);
    background: var(--primary-tint);
    font-size: 0.92rem;
}

.admin-login-card > a:not(.btn-primary) {
    display: block;
    margin-top: 14px;
    color: var(--muted);
}

.admin-login-form {
    display: grid;
    gap: 15px;
}

.admin-login-form label {
    display: grid;
    gap: 7px;
    color: var(--ink);
    font-weight: 800;
}

.admin-login-form input {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0 13px;
    color: var(--ink);
}

.admin-login-form button {
    min-height: 46px;
    border: 0;
    border-radius: var(--radius);
    background: var(--green);
    color: var(--white);
    font-weight: 900;
    cursor: pointer;
}

.admin-login-form input:disabled,
.admin-login-form button:disabled {
    cursor: not-allowed;
    opacity: 0.68;
}

.client-login-shell {
    background: linear-gradient(135deg, var(--paper), #0A0E2B);
}

.admin-login-error {
    margin-bottom: 16px;
    padding: 12px 14px;
    border-radius: var(--radius);
    background: rgba(10, 14, 43, 0.08);
    color: #0A0E2B;
    font-weight: 800;
}

@media (max-width: 980px) {
    .site-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 12px 16px;
    }

    .brand-mark {
        min-width: 0;
    }

    .menu-toggle {
        display: inline-flex;
    }

    .header-menu {
        grid-column: 1 / -1;
        width: 100%;
        display: none;
        align-items: stretch;
        gap: 14px;
        padding-top: 8px;
    }

    .menu-open .header-menu {
        display: grid;
    }

    .main-nav {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        justify-content: stretch;
        gap: 0;
        overflow: hidden;
        border: 1px solid rgba(10, 14, 43, 0.033);
        border-radius: var(--radius);
        background: #0A0E2B;
    }

    .main-nav a {
        min-height: 42px;
        display: flex;
        align-items: center;
        padding: 0 14px;
        border-bottom: 1px solid rgba(10, 14, 43, 0.024);
    }

    .main-nav a:last-child {
        border-bottom: 0;
    }

    .header-action {
        width: fit-content;
    }

    .hero-section,
    .about-section,
    .courses-section,
    .courses-construction,
    .sat-section,
    .content-columns,
    .contact-section,
    .footer-inner,
    .admin-header {
        grid-template-columns: 1fr;
    }

    .hero-section {
        min-height: auto;
        padding-top: 48px;
    }

    .hero-visual {
        min-height: 420px;
    }

    .strip-section,
    .services-mini,
    .service-grid,
    .quick-tools-section,
    .value-grid,
    .process-grid,
    .team-flow,
    .plans-grid,
    .blog-card-grid,
    .admin-grid {
        grid-template-columns: 1fr;
    }

    .admin-form-grid,
    .admin-card-list,
    .admin-card-list.three,
    .admin-card-list.four,
    .admin-card-list.two {
        grid-template-columns: 1fr;
    }

    .admin-workspace {
        grid-template-columns: 1fr;
    }

    .admin-preview-panel {
        position: static;
        order: 0;
    }

    .admin-preview-frame {
        height: 420px;
        min-height: 420px;
    }

    .admin-modal-backdrop {
        padding: 10px;
    }

    .admin-preview-modal header {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-modal-frame-wrap {
        min-height: 480px;
        height: calc(100vh - 180px);
        padding: 10px;
    }

    .admin-savebar {
        align-items: stretch;
        flex-direction: column;
    }

    .process-board {
        min-height: auto;
        display: grid;
        grid-template-columns: 1fr;
        gap: 22px;
        padding: 20px;
    }

    .process-board::before,
    .process-board::after {
        display: none;
    }

    .process-timeline {
        grid-template-columns: 1fr;
        padding-left: 48px;
    }

    .process-timeline::before {
        left: 20px;
        right: auto;
        top: 24px;
        bottom: 24px;
        width: 2px;
        height: auto;
        border: 0;
        border-radius: 999px;
        background: linear-gradient(180deg, var(--navy), var(--primary), rgba(10, 14, 43, 0.120));
        transform: none;
    }

    .process-step,
    .process-step-1,
    .process-step-2,
    .process-step-3,
    .process-step-4,
    .process-step-5 {
        position: relative;
        grid-column: 1 / -1;
        grid-row: auto;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: 100%;
        transform: none;
    }

    .process-step.is-visible,
    .process-step:nth-child(even).is-visible {
        animation-name: processPulseIn;
    }

    .process-step:nth-child(even) {
        margin-left: 0;
    }

    .process-step::before {
        display: none;
    }

    .process-step::after {
        display: block;
        left: -26px;
        top: 50%;
        width: 26px;
        height: 2px;
        transform: none;
    }

    .process-step-3::after,
    .process-step-5::after {
        display: block;
        left: -26px;
        top: 50%;
        width: 26px;
        height: 2px;
    }

    .process-reminder {
        position: relative;
        grid-column: 1 / -1;
        grid-row: auto;
        grid-template-columns: 1fr;
        right: auto;
        bottom: auto;
        width: 100%;
        transform: none;
    }

    .process-reminder::before {
        position: static;
    }

    .process-reminder strong,
    .process-reminder p,
    .process-reminder ul {
        grid-column: 1;
        grid-row: auto;
    }

    .team-flow::before {
        left: 50%;
        right: auto;
        top: 42px;
        bottom: 42px;
        width: 2px;
        height: auto;
    }

    .team-photo-frame {
        width: 124px;
        height: 124px;
    }

    .strip-section {
        transform: none;
        margin-top: 0;
    }

    .plan-card.featured {
        transform: none;
    }

    .footer-globe-wrap {
        justify-self: start;
        justify-items: start;
    }

    .quick-tools-section article {
        grid-template-columns: 1fr;
    }

    .sat-request-form fieldset {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .hero-section,
    .services-hero,
    .courses-construction,
    .section-block,
    .about-section,
    .process-section,
    .team-section,
    .plans-section,
    .courses-section,
    .sat-section,
    .contact-section,
    .site-footer {
        padding-inline: 16px;
    }

    .about-section,
    .section-block.values-section,
    .process-section,
    .courses-section,
    .contact-section {
        padding-inline: 18px;
    }

    .hero-visual {
        min-height: 360px;
    }

    .process-board {
        padding: 16px;
    }

    .process-timeline {
        gap: 14px;
        padding-left: 40px;
    }

    .process-timeline::before {
        left: 17px;
    }

    .process-step {
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 12px;
        padding: 16px;
    }

    .process-step::before {
        display: none;
    }

    .process-step::after {
        left: -22px;
        width: 22px;
    }

    .process-number {
        width: 38px;
        height: 38px;
    }

    .process-image {
        grid-column: 1;
        grid-row: 2;
        width: 44px;
        height: 44px;
    }

    .process-copy {
        grid-column: 2;
        grid-row: 1 / span 2;
    }

    .main-dashboard {
        inset: 58px 22px auto 22px;
    }

    .floating-card {
        min-width: 138px;
    }

    .document-card {
        left: 18px;
        bottom: 36px;
    }

    .check-card {
        right: 18px;
        bottom: 72px;
    }

    .lead-form {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}
    grid-column: 1;
    grid-row: 1;

/* ===== Admin Cursos — tabs + list/detail UI ===== */
.ac-workspace {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 16px 48px;
}

.ac-tabs {
    display: flex;
    border-bottom: 2px solid rgba(10, 14, 43, 0.1);
    margin-bottom: 28px;
}

.ac-tab {
    padding: 11px 24px;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    font-size: 0.93rem;
    font-weight: 700;
    color: var(--muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.15s, border-color 0.15s;
}

.ac-tab--active {
    color: var(--primary);
    border-bottom-color: var(--primary);
}

.ac-tab-count {
    background: var(--primary-mist);
    border: 1px solid rgba(10, 14, 43, 0.1);
    padding: 1px 7px;
    border-radius: 10px;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--primary);
}

.ac-columns {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.ac-list-col {
    width: 256px;
    flex-shrink: 0;
    background: #fff;
    border: 1px solid rgba(10, 14, 43, 0.1);
    border-radius: 10px;
    overflow: hidden;
    position: sticky;
    top: 80px;
}

.ac-list-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 14px;
    border-bottom: 1px solid rgba(10, 14, 43, 0.08);
    background: var(--primary-mist);
}

.ac-list-header span {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.ac-list-header button {
    font-size: 0.78rem;
    font-weight: 700;
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 5px 12px;
    cursor: pointer;
}

.ac-list {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: calc(100vh - 260px);
    overflow-y: auto;
}

.ac-list-item {
    padding: 10px 14px;
    border-bottom: 1px solid rgba(10, 14, 43, 0.06);
    transition: background 0.12s;
}

.ac-list-item:hover { background: var(--primary-mist); }

.ac-list-item--active {
    background: var(--primary-tint);
    border-left: 3px solid var(--primary);
    padding-left: 11px;
}

.ac-list-item-main {
    cursor: pointer;
    margin-bottom: 6px;
}

.ac-list-item-name {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ac-list-item-meta {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.ac-list-item-actions {
    display: flex;
    gap: 6px;
}

.ac-list-item-actions button {
    flex: 1;
    font-size: 0.74rem;
    font-weight: 700;
    padding: 5px 8px;
    border-radius: 5px;
    border: 1px solid rgba(10, 14, 43, 0.15);
    background: #fff;
    color: var(--primary);
    cursor: pointer;
}

.ac-btn-danger-sm {
    background: #fee2e2 !important;
    color: #b91c1c !important;
    border-color: #fca5a5 !important;
}

.ac-list-empty {
    padding: 24px 16px;
    color: var(--muted);
    font-size: 0.84rem;
    text-align: center;
}

.ac-chip {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.ac-chip--ok  { background: #d1fae5; color: #065f46; }
.ac-chip--off { background: #f3f4f6; color: #6b7280; }
.ac-chip--hi  { background: #dbeafe; color: #1e40af; }

.ac-detail-col {
    flex: 1;
    min-width: 0;
    background: #fff;
    border: 1px solid rgba(10, 14, 43, 0.1);
    border-radius: 10px;
    padding: 22px 26px 28px;
}

.ac-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(10, 14, 43, 0.08);
    flex-wrap: wrap;
}

.ac-detail-header h2 {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
}

.ac-detail-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.ac-save-msg {
    font-size: 0.8rem;
    color: var(--muted);
}

.ac-btn-primary {
    padding: 7px 18px;
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
}

.ac-btn-danger {
    padding: 7px 16px;
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fca5a5;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
}

.ac-placeholder {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    background: var(--primary-mist);
    border: 1px dashed rgba(10, 14, 43, 0.14);
    border-radius: 10px;
    color: var(--muted);
    font-size: 0.9rem;
}

.ac-sub-section {
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid rgba(10, 14, 43, 0.08);
}

.ac-sub-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.ac-sub-header h3 {
    margin: 0;
    font-size: 0.94rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.ac-sub-header button {
    font-size: 0.82rem;
    font-weight: 700;
    background: var(--primary-tint);
    color: var(--primary);
    border: 1px solid rgba(10, 14, 43, 0.15);
    border-radius: 5px;
    padding: 5px 12px;
    cursor: pointer;
}

.ac-lesson-card {
    border: 1px solid rgba(10, 14, 43, 0.09);
    border-radius: 8px;
    margin-bottom: 10px;
    overflow: hidden;
}

.ac-lesson-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: var(--primary-mist);
    border-bottom: 1px solid rgba(10, 14, 43, 0.06);
}

.ac-lesson-card-header strong {
    font-size: 0.87rem;
    font-weight: 700;
}

.ac-lesson-card-header > div {
    display: flex;
    align-items: center;
    gap: 6px;
}

.ac-remove-btn {
    background: none;
    border: none;
    color: var(--secondary);
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
    padding: 0 4px;
    font-weight: 700;
}

.ac-lesson-body {
    padding: 14px;
}

.ac-materials-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.ac-materials-header strong {
    font-size: 0.84rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.ac-materials-header button {
    font-size: 0.76rem;
    font-weight: 700;
    background: none;
    color: var(--primary);
    border: 1px solid rgba(10, 14, 43, 0.2);
    border-radius: 4px;
    padding: 3px 10px;
    cursor: pointer;
}

.ac-plans-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.ac-plans-toolbar button:first-child {
    font-size: 0.85rem;
    font-weight: 700;
    padding: 8px 18px;
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
}

.ac-plans-toolbar button:not(:first-child) {
    font-size: 0.85rem;
    font-weight: 700;
    padding: 8px 18px;
    background: #fff;
    color: var(--primary);
    border: 1px solid rgba(10, 14, 43, 0.2);
    border-radius: 6px;
    cursor: pointer;
}

@media (max-width: 768px) {
    .ac-columns {
        flex-direction: column;
    }

    .ac-list-col {
        width: 100%;
        position: static;
    }

    .ac-list {
        max-height: 240px;
    }
}

/* Inherit admin-panel form styles into ac-detail-col */
.ac-detail-col label {
    display: grid;
    gap: 7px;
    color: var(--ink);
    font-size: 0.88rem;
    font-weight: 850;
}

.ac-detail-col label.wide,
.ac-lesson-body .wide {
    grid-column: 1 / -1;
}

.ac-detail-col .check-row {
    grid-template-columns: auto 1fr;
    align-items: center;
    width: fit-content;
}

.ac-detail-col .check-row input {
    width: auto;
}

.ac-detail-col input,
.ac-detail-col select,
.ac-detail-col textarea {
    width: 100%;
    border: 1px solid rgba(10, 14, 43, 0.10);
    border-radius: var(--radius);
    background: var(--white);
    color: var(--ink);
    padding: 11px 12px;
    font-weight: 650;
    font-size: 0.95rem;
    font-family: inherit;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.ac-detail-col input:focus,
.ac-detail-col select:focus,
.ac-detail-col textarea:focus {
    outline: none;
    border-color: rgba(10, 14, 43, 0.35);
    box-shadow: 0 0 0 3px rgba(10, 14, 43, 0.07);
}

.ac-detail-col textarea {
    resize: vertical;
}

/* Fix admin-card-editor label/input styles (self-contained, not dependent on .admin-panel ancestor) */
.admin-card-editor label {
    display: grid;
    gap: 7px;
    color: var(--ink);
    font-size: 0.88rem;
    font-weight: 850;
}

.admin-card-editor label.wide {
    grid-column: 1 / -1;
}

.admin-card-editor .check-row {
    grid-template-columns: auto 1fr;
    align-items: center;
    width: fit-content;
}

.admin-card-editor .check-row input {
    width: auto;
}

.admin-card-editor input,
.admin-card-editor select,
.admin-card-editor textarea {
    width: 100%;
    border: 1px solid rgba(10, 14, 43, 0.10);
    border-radius: var(--radius);
    background: var(--white);
    color: var(--ink);
    padding: 11px 12px;
    font-weight: 650;
    font-size: 0.95rem;
    font-family: inherit;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.admin-card-editor input:focus,
.admin-card-editor select:focus,
.admin-card-editor textarea:focus {
    outline: none;
    border-color: rgba(10, 14, 43, 0.35);
    box-shadow: 0 0 0 3px rgba(10, 14, 43, 0.07);
}

.admin-card-editor textarea {
    resize: vertical;
}

/* Plan assignment section */
.ac-plan-assign {
    margin-top: 4px;
}

.ac-plan-assign-title {
    display: block;
    font-size: 0.88rem;
    font-weight: 850;
    color: var(--ink);
    margin-bottom: 10px;
}

.ac-plan-assign-empty {
    font-size: 0.84rem;
    color: var(--muted);
    margin: 0;
}

.ac-plan-assign-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ac-plan-assign-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    padding: 8px 12px;
    border: 1px solid rgba(10, 14, 43, 0.09);
    border-radius: 6px;
    background: var(--primary-mist);
    transition: background 0.12s;
}

.ac-plan-assign-item:hover {
    background: var(--primary-tint);
}

.ac-plan-assign-item input[type="checkbox"] {
    width: auto;
    margin: 0;
    cursor: pointer;
    accent-color: var(--primary);
}

.ac-plan-assign-item span:nth-child(2) {
    flex: 1;
}


/* Fix: generic label color/display rules (ac-detail-col, admin-card-editor)
   were overriding .admin-upload-btn's own white-text/inline-flex styling
   because compound selectors (.parent label) outrank single-class .admin-upload-btn */
.ac-detail-col .admin-upload-btn,
.admin-card-editor .admin-upload-btn {
    display: inline-flex;
    color: #fff;
    grid-column: auto;
}

/* ── Course detail page ── */
.course-detail-back {
    display: inline-block;
    margin-bottom: 24px;
    color: var(--primary);
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
}

.course-detail-back:hover {
    text-decoration: underline;
}

.course-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 420px) 1fr;
    gap: 36px;
    align-items: start;
}

.course-detail-image {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 12px;
    background: var(--primary);
}

.course-detail-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.course-detail-body h1 {
    font-size: clamp(1.6rem, 3vw, 2.1rem);
    font-weight: 600;
    color: var(--primary);
    margin: 8px 0 6px;
}

.course-detail-description {
    margin-top: 16px;
    color: #444;
    line-height: 1.7;
    white-space: pre-line;
}

.course-detail-body .course-card-footer {
    border-top: 1px solid #f0f4ff;
}

.course-detail-lessons {
    margin-top: 48px;
}

.course-detail-lessons h2 {
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--primary);
    margin-bottom: 16px;
}

.course-lesson-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.course-lesson-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: #fff;
    border: 1px solid #e4e8f0;
    border-radius: 10px;
    padding: 14px 18px;
}

.course-lesson-item strong {
    color: var(--primary);
    font-size: 0.98rem;
}

.course-lesson-item p {
    margin: 4px 0 0;
    color: #666;
    font-size: 0.86rem;
}

.course-lesson-locked {
    color: #aab;
    font-size: 0.9rem;
    flex-shrink: 0;
}

@media (max-width: 760px) {
    .course-detail-layout {
        grid-template-columns: 1fr;
    }
}

/* ── Watch course (cliente portal) ── */
.watch-course-player {
    max-width: 900px;
    margin: 0 auto 32px;
    border-radius: 12px;
    overflow: hidden;
    background: #000;
}

.watch-course-player video {
    width: 100%;
    display: block;
    aspect-ratio: 16 / 9;
}

.lesson-accordion {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 900px;
    margin: 32px auto 0;
}

.lesson-accordion-item {
    border: 1px solid #e4e8f0;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

.lesson-accordion-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    background: none;
    border: none;
    cursor: pointer;
    font: inherit;
    font-weight: 600;
    color: var(--primary);
    text-align: left;
}

.lesson-accordion-header:hover {
    background: #f7f9fc;
}

.lesson-accordion-chevron {
    flex-shrink: 0;
    transition: transform 0.2s;
    color: #888;
}

.lesson-accordion-item.expanded .lesson-accordion-chevron {
    transform: rotate(180deg);
}

.lesson-accordion-body {
    padding: 0 18px 18px;
    border-top: 1px solid #f0f4ff;
    padding-top: 14px;
}

.lesson-accordion-body p {
    margin: 0 0 14px;
    color: #555;
    line-height: 1.6;
}

.lesson-accordion-body .watch-course-player {
    max-width: 100%;
    margin-bottom: 16px;
}

.lesson-materials-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* ── Account bar (cursos page only) ── */
.account-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    flex-wrap: wrap;
    padding: 10px max(clamp(18px, 5vw, 72px), calc((100vw - var(--container)) / 2));
    background: var(--primary-mist, #eef1fa);
    border-bottom: 1px solid rgba(10, 14, 43, 0.08);
    font-size: 0.86rem;
    color: var(--muted, #555);
}

.account-bar-link {
    font-weight: 700;
    color: var(--primary);
    text-decoration: none;
}

.account-bar-link:hover {
    text-decoration: underline;
}

.account-bar-btn {
    background: none;
    border: none;
    font: inherit;
    cursor: pointer;
    padding: 0;
}

/* ── Purchase guide (como-inscribirme) ── */
.purchase-guide-steps {
    list-style: none;
    margin: 40px 0 0;
    padding: 0;
    max-width: 720px;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.purchase-guide-step {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    background: #fff;
    border: 1px solid #e4e8f0;
    border-radius: 12px;
    padding: 20px 24px;
}

.purchase-guide-step-number {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1rem;
}

.purchase-guide-step h3 {
    margin: 2px 0 6px;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--primary);
}

.purchase-guide-step p {
    margin: 0;
    color: #555;
    line-height: 1.6;
    white-space: pre-line;
}

/* ── Blog: real image inside decorative .blog-image slot ── */
.blog-image {
    overflow: hidden;
}

.blog-image img {
    width: 100%;
    height: 100%;
    min-height: 124px;
    object-fit: cover;
    display: block;
}

/* ── Blog post (full article page) ── */
.blog-post {
    max-width: 760px;
    margin: 0 auto;
}

.blog-post-image {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 12px;
    margin-bottom: 28px;
    background: var(--primary);
}

.blog-post-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-post h1 {
    font-size: clamp(1.6rem, 3vw, 2.2rem);
    font-weight: 600;
    color: var(--primary);
    margin: 0 0 10px;
}

.blog-post-meta {
    display: flex;
    gap: 14px;
    color: var(--muted);
    font-size: 0.88rem;
    margin-bottom: 24px;
}

.blog-post-content {
    color: #333;
    line-height: 1.8;
}

.blog-post-content p {
    margin: 0 0 18px;
}

.blog-post-content h2,
.blog-post-content h3 {
    color: var(--primary);
    margin: 28px 0 12px;
}

.blog-post-content img {
    max-width: 100%;
    border-radius: 10px;
    margin: 16px 0;
}

.blog-post-content a {
    color: var(--primary);
    text-decoration: underline;
}

/* ── Purchase guide: item summary + Mercado Pago block ── */
.purchase-item-summary {
    max-width: 720px;
    margin: 0 auto 24px;
    padding: 16px 20px;
    background: var(--primary-mist, #eef1fa);
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.purchase-item-summary span:first-child {
    color: var(--muted);
    font-size: 0.88rem;
}

.purchase-item-summary strong {
    color: var(--primary);
    font-size: 1.05rem;
}

.purchase-item-summary .course-price {
    margin-left: auto;
}

.purchase-mp-block {
    max-width: 720px;
    margin: 0 auto 24px;
    padding: 24px;
    border: 1px solid #e4e8f0;
    border-radius: 12px;
    text-align: center;
}

.purchase-mp-block h3 {
    margin: 0 0 8px;
    color: var(--primary);
    font-size: 1.1rem;
}

.purchase-mp-block p {
    margin: 0 0 16px;
    color: #555;
}

.purchase-mp-block button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.purchase-divider {
    max-width: 720px;
    margin: 0 auto 24px;
    text-align: center;
    position: relative;
    color: var(--muted);
    font-size: 0.86rem;
}

.purchase-divider::before,
.purchase-divider::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 40%;
    height: 1px;
    background: #e4e8f0;
}

.purchase-divider::before { left: 0; }
.purchase-divider::after { right: 0; }

/* ── Admin: payments table ── */
.admin-payments-table-wrap {
    overflow-x: auto;
    background: #fff;
    border: 1px solid rgba(10, 14, 43, 0.09);
    border-radius: 10px;
}

.admin-payments-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}

.admin-payments-table th,
.admin-payments-table td {
    padding: 12px 16px;
    text-align: left;
    white-space: nowrap;
}

.admin-payments-table thead th {
    background: var(--primary-mist, #eef1fa);
    color: var(--muted);
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 700;
}

.admin-payments-table tbody tr {
    border-top: 1px solid rgba(10, 14, 43, 0.06);
}

.admin-payments-table tbody tr:hover {
    background: var(--primary-mist, #eef1fa);
}

/* ── Chat widget ── */
.chat-widget {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 998;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
}

.chat-fab {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #fff;
    color: #fff;
    border: none;
    font-size: 1.4rem;
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(10, 14, 43, 0.28);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.15s;
    overflow: hidden;
    padding: 0;
}

.chat-fab img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.chat-fab-close {
    background: var(--primary);
}

.chat-fab:hover {
    transform: scale(1.06);
}

.chat-panel {
    width: min(340px, calc(100vw - 40px));
    max-height: min(520px, calc(100vh - 140px));
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(10, 14, 43, 0.22);
    overflow: hidden;
    animation: chatPanelIn 0.2s ease-out;
}

@keyframes chatPanelIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

.chat-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    background: var(--primary);
    color: #fff;
}

.chat-panel-header-identity {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.chat-panel-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    object-fit: cover;
    background: #fff;
    flex-shrink: 0;
}

.chat-panel-header-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.25;
}

.chat-panel-header-text strong {
    font-size: 0.92rem;
}

.chat-panel-header-text em {
    font-style: italic;
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.78);
}

.chat-close-btn {
    background: none;
    border: none;
    color: #fff;
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}

.chat-contact-toggle {
    padding: 8px 16px;
    border-bottom: 1px solid #f0f4ff;
}

.chat-contact-toggle button {
    background: none;
    border: none;
    color: var(--primary);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    padding: 0;
}

.chat-contact-form {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 10px 16px;
    border-bottom: 1px solid #f0f4ff;
}

.chat-contact-form input {
    border: 1px solid #e4e8f0;
    border-radius: 6px;
    padding: 7px 10px;
    font-size: 0.84rem;
}

.chat-messages {
    flex: 1;
    overflow-y: auto;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 180px;
}

.chat-suggestions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-self: flex-start;
    max-width: 92%;
}

.chat-suggestion-chip {
    background: #fff;
    border: 1px solid #e4e8f0;
    color: var(--primary);
    border-radius: 14px;
    padding: 8px 12px;
    font-size: 0.8rem;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.chat-suggestion-chip:hover {
    background: #f0f4ff;
    border-color: var(--primary);
}

.chat-suggestion-chip:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.chat-bubble {
    max-width: 85%;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 0.86rem;
    line-height: 1.5;
}

.chat-bubble p {
    margin: 0;
}

.chat-bubble-bot {
    align-self: flex-start;
    background: #f0f4ff;
    color: #222;
    border-bottom-left-radius: 4px;
}

.chat-bubble-visitor {
    align-self: flex-end;
    background: var(--primary);
    color: #fff;
    border-bottom-right-radius: 4px;
}

.chat-redirect-btn {
    margin-top: 8px;
    background: var(--secondary);
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 6px 12px;
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
}

.chat-input-row {
    display: flex;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid #f0f4ff;
}

.chat-input-row input {
    flex: 1;
    min-width: 0;
    border: 1px solid #e4e8f0;
    border-radius: 8px;
    padding: 9px 12px;
    font-size: 0.86rem;
}

.chat-input-row button {
    padding: 9px 16px;
    font-size: 0.84rem;
}

.chat-input-row button:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

@media (max-width: 480px) {
    .chat-widget {
        right: 12px;
        bottom: 12px;
    }
}

/* ── Plan quote WhatsApp modal ── */
.plan-quote-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(10, 14, 43, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    padding: 20px;
}

.plan-quote-modal {
    position: relative;
    background: #fff;
    border-radius: 14px;
    padding: 32px 28px 28px;
    width: min(420px, 100%);
    box-shadow: 0 30px 70px rgba(10, 14, 43, 0.3);
}

.plan-quote-modal .eyebrow {
    display: block;
    margin-bottom: 6px;
}

.plan-quote-modal h3 {
    margin: 0 0 10px;
    color: var(--primary);
    font-size: 1.3rem;
}

.plan-quote-modal p {
    margin: 0 0 20px;
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.5;
}

.plan-quote-modal label {
    display: block;
    font-size: 0.86rem;
    font-weight: 600;
    color: var(--ink);
    margin-bottom: 20px;
}

.plan-quote-modal label input {
    display: block;
    width: 100%;
    margin-top: 6px;
    border: 1px solid rgba(10, 14, 43, 0.16);
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 0.92rem;
}

.plan-quote-close {
    position: absolute;
    top: 12px;
    right: 14px;
    background: none;
    border: none;
    font-size: 1.4rem;
    line-height: 1;
    color: var(--muted);
    cursor: pointer;
    padding: 4px;
}

.plan-quote-send {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0.5;
    pointer-events: none;
}

.plan-quote-send.is-ready {
    opacity: 1;
    pointer-events: auto;
}

/* Plan card CTA button (was <a>, switched to <button> to dodge Blazor's
   enhanced-navigation intercepting href="#" clicks) */
.plan-quote-trigger {
    min-height: 44px;
    width: 100%;
    margin-top: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--radius);
    padding: 0 18px;
    background: var(--primary);
    color: var(--white);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.plan-quote-trigger:hover {
    transform: translateY(-2px);
}