/* MAP Interactive Quiz Profesional v4.4.1 — Homepage Overlap & Responsive Hero Hotfix */
:root {
    --home-v44-ink: #111827;
    --home-v44-muted: #667085;
    --home-v44-line: rgba(98, 78, 190, .14);
    --home-v44-purple: #6435e9;
    --home-v44-purple-dark: #3f1dac;
    --home-v44-violet: #8a5cff;
    --home-v44-blue: #2878ff;
    --home-v44-cyan: #18bfe7;
    --home-v44-green: #16a974;
    --home-v44-orange: #f59e0b;
    --home-v44-rose: #ec4899;
    --home-v44-surface: #ffffff;
    --home-v44-soft: #f5f6ff;
    --home-v44-shadow: 0 24px 80px rgba(53, 33, 118, .12);
    --home-v44-shadow-sm: 0 14px 38px rgba(53, 33, 118, .09);
}

.map-home-v44 {
    color: var(--home-v44-ink);
    background:
        radial-gradient(circle at 50% 0%, rgba(110, 72, 244, .08), transparent 34%),
        linear-gradient(180deg, #f8f8ff 0%, #ffffff 24%, #f8f9ff 100%);
    overflow: hidden;
}

.map-home-v44 *,
.map-home-v44 *::before,
.map-home-v44 *::after { box-sizing: border-box; }

.map-home-v44 a { text-decoration: none; }

.home-v44-hero {
    position: relative;
    padding: 54px 0 58px;
    isolation: isolate;
    overflow: hidden;
    background:
        linear-gradient(120deg, rgba(255,255,255,.92), rgba(248,247,255,.80)),
        radial-gradient(circle at 18% 8%, rgba(100,53,233,.17), transparent 31%),
        radial-gradient(circle at 88% 20%, rgba(40,120,255,.14), transparent 28%);
}

.home-v44-grid {
    position: absolute;
    inset: 0;
    z-index: -3;
    opacity: .45;
    background-image:
        linear-gradient(rgba(89, 62, 176, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(89, 62, 176, .055) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to bottom, #000 0%, transparent 94%);
}

.home-v44-glow {
    position: absolute;
    z-index: -2;
    border-radius: 999px;
    filter: blur(3px);
    pointer-events: none;
}

.home-v44-glow.glow-one {
    width: 330px;
    height: 330px;
    left: -170px;
    top: 18%;
    background: rgba(100,53,233,.14);
}

.home-v44-glow.glow-two {
    width: 420px;
    height: 420px;
    right: -250px;
    bottom: -100px;
    background: rgba(24,191,231,.12);
}

.min-vh-hero { min-height: 680px; }

.home-v44-kicker {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}

.home-v44-live,
.home-v44-version {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(100,53,233,.14);
    border-radius: 999px;
    padding: 8px 12px;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.home-v44-live {
    color: #4b27b7;
    background: rgba(100,53,233,.08);
}

.home-v44-live > span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #21b57f;
    box-shadow: 0 0 0 5px rgba(33,181,127,.12);
}

.home-v44-version {
    color: #195cc8;
    background: rgba(40,120,255,.08);
    border-color: rgba(40,120,255,.14);
}

.home-v44-title {
    margin: 0;
    max-width: 760px;
    font-size: clamp(3.1rem, 7vw, 6.5rem);
    line-height: .92;
    letter-spacing: -.065em;
    font-weight: 900;
    color: #161426;
}

.home-v44-title span {
    display: block;
    margin-top: 10px;
    color: transparent;
    background: linear-gradient(120deg, var(--home-v44-purple-dark), var(--home-v44-purple), var(--home-v44-blue));
    background-clip: text;
    -webkit-background-clip: text;
}

.home-v44-lead {
    max-width: 680px;
    margin: 26px 0 0;
    color: #5f6475;
    font-size: clamp(1.02rem, 1.7vw, 1.24rem);
    line-height: 1.75;
}

.home-v44-actions {
    position: relative;
    z-index: 3;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-top: 30px;
}

.home-v44-actions .btn,
.final-actions-v44 .btn,
.promo-actions-v44 .btn {
    min-height: 52px;
    border-radius: 16px;
    padding: 0 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    font-weight: 800;
    transition: transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease;
}

.home-v44-actions .btn:hover,
.final-actions-v44 .btn:hover,
.promo-actions-v44 .btn:hover { transform: translateY(-2px); }

.home-v44-primary {
    color: #fff;
    border: 0;
    background: linear-gradient(135deg, var(--home-v44-purple), #4b24c7 60%, #351793);
    box-shadow: 0 16px 32px rgba(87,45,211,.28);
}

.home-v44-primary:hover,
.home-v44-primary:focus { color: #fff; box-shadow: 0 20px 40px rgba(87,45,211,.36); }

.action-arrow { font-size: 1.35rem; margin-left: 4px; }

.home-v44-secondary {
    color: #2f255a;
    border: 1px solid rgba(80,63,146,.18);
    background: rgba(255,255,255,.82);
    box-shadow: 0 12px 28px rgba(52,39,103,.08);
}

.home-v44-secondary:hover { color: #3f1dac; border-color: rgba(100,53,233,.35); background: #fff; }

.home-v44-ghost {
    color: #4f5568;
    border: 1px solid transparent;
    background: transparent;
}

.home-v44-ghost:hover { color: #3f1dac; background: rgba(100,53,233,.06); }

.home-v44-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 22px;
    margin-top: 26px;
    color: #4f5669;
    font-size: .9rem;
    font-weight: 700;
}

.home-v44-trust > div { display: inline-flex; align-items: center; gap: 7px; }
.home-v44-trust i { color: #1aaa76; }

.home-v44-product-column {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 12px;
    min-width: 0;
    isolation: isolate;
}

.home-v44-product {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
    position: relative;
    z-index: 2;
    min-height: 596px;
    padding: 12px;
    border: 1px solid rgba(95,64,190,.17);
    border-radius: 30px;
    background: rgba(255,255,255,.76);
    box-shadow: 0 36px 100px rgba(56,34,134,.19);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.home-v44-product::before {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: -1;
    border-radius: 30px;
    padding: 1px;
    background: linear-gradient(135deg, rgba(139,92,246,.45), rgba(40,120,255,.15), rgba(255,255,255,.6));
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
}

.product-window-bar {
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 14px;
    color: #5b6070;
}

.window-dots { display: flex; gap: 6px; }
.window-dots span { width: 9px; height: 9px; border-radius: 50%; background: #d3d5df; }
.window-dots span:first-child { background: #ff6b6b; }
.window-dots span:nth-child(2) { background: #ffc857; }
.window-dots span:nth-child(3) { background: #2ed394; }
.window-title { display: flex; align-items: center; gap: 7px; font-size: .88rem; font-weight: 800; }
.window-title i { color: var(--home-v44-purple); }
.window-live { display: flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 900; letter-spacing: .08em; color: #14845c; }
.window-live span { width: 7px; height: 7px; border-radius: 50%; background: #16a974; box-shadow: 0 0 0 4px rgba(22,169,116,.12); }

.product-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
    padding: 6px;
    border-radius: 16px;
    background: #f2f2fa;
}

.product-tabs button {
    border: 0;
    border-radius: 12px;
    min-height: 40px;
    color: #73778a;
    background: transparent;
    font-size: .82rem;
    font-weight: 800;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: .2s ease;
}

.product-tabs button.active {
    color: #4421b8;
    background: #fff;
    box-shadow: 0 7px 18px rgba(67,42,136,.11);
}

.product-preview {
    margin-top: 10px;
    min-height: 500px;
    border-radius: 22px;
    padding: 22px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(249,249,255,.96));
    border: 1px solid rgba(95,64,190,.10);
    animation: previewInV44 .28s ease;
}

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

.arena-toolbar,
.classroom-head,
.obe-topline,
.architecture-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
}

.arena-chip,
.arena-timer {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
}

.arena-chip { color: #4725b6; background: #eee9ff; }
.arena-timer { color: #b44417; background: #fff1e8; }
.arena-question { margin: 22px 0 16px; font-size: 1.23rem; font-weight: 850; line-height: 1.45; letter-spacing: -.025em; }

.arena-options { display: grid; gap: 10px; }
.arena-options > div {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 49px;
    padding: 9px 12px;
    border: 1px solid #e6e5ee;
    border-radius: 14px;
    color: #5f6475;
    font-size: .9rem;
    font-weight: 700;
    background: #fff;
}
.arena-options > div span { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 9px; background: #f1f2f8; color: #4f5566; }
.arena-options > div.selected { color: #3d249e; border-color: rgba(100,53,233,.35); background: #f5f1ff; box-shadow: 0 8px 22px rgba(92,58,196,.09); }
.arena-options > div.selected span { color: #fff; background: var(--home-v44-purple); }

.arena-race { display: grid; gap: 12px; margin-top: 26px; padding-top: 20px; border-top: 1px dashed #dedce9; }
.race-track { display: grid; grid-template-columns: 25px minmax(0,1fr) 40px; align-items: center; gap: 8px; }
.race-track > strong { font-size: .78rem; color: #4e5364; text-align: right; }
.race-label { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 8px; background: #f3f3f8; font-size: .72rem; font-weight: 900; }
.race-line { position: relative; height: 34px; border-radius: 999px; background: repeating-linear-gradient(90deg, #f3f3f8 0 18px, #fafaff 18px 36px); overflow: hidden; }
.race-progress { position: absolute; inset: 0 auto 0 0; width: var(--progress); border-radius: inherit; background: linear-gradient(90deg, rgba(100,53,233,.10), rgba(40,120,255,.18)); }
.race-avatar { position: absolute; top: 4px; left: calc(var(--progress) - 26px); z-index: 2; display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; color: #fff; font-size: .58rem; font-weight: 900; border: 2px solid #fff; box-shadow: 0 5px 12px rgba(46,34,96,.20); }
.avatar-one { background: linear-gradient(135deg,#6435e9,#8a5cff); }
.avatar-two { background: linear-gradient(135deg,#2878ff,#18bfe7); }
.avatar-three { background: linear-gradient(135deg,#16a974,#4bd19e); }

.classroom-head span,
.obe-topline > div span,
.architecture-header > div span {
    display: block;
    margin-bottom: 4px;
    color: #6b45df;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .11em;
}
.classroom-head h2,
.obe-topline h2,
.architecture-header h3 { margin: 0; font-size: 1.3rem; font-weight: 900; letter-spacing: -.035em; }
.class-code { padding: 9px 11px; border-radius: 11px; background: #efeaff; color: #542cc5 !important; font-size: .75rem !important; letter-spacing: .1em !important; }
.classroom-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-top: 20px; }
.classroom-metrics article { display: flex; gap: 10px; align-items: center; min-width: 0; padding: 14px; border: 1px solid #e8e6f1; border-radius: 15px; background: #fff; }
.classroom-metrics article i { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; border-radius: 11px; color: #6435e9; background: #eee9ff; }
.classroom-metrics article strong { display: block; font-size: 1.05rem; line-height: 1; }
.classroom-metrics article span { display: block; margin-top: 5px; color: #8a8e9e; font-size: .64rem; white-space: nowrap; }
.learning-path-demo { margin-top: 22px; padding: 18px; border-radius: 18px; background: #f8f8fd; }
.path-item { display: flex; align-items: center; gap: 12px; min-height: 57px; }
.path-item > span { display: grid; place-items: center; flex: 0 0 auto; width: 35px; height: 35px; border-radius: 50%; color: #fff; background: #6435e9; font-size: .78rem; font-weight: 900; }
.path-item > div { flex: 1; min-width: 0; }
.path-item strong { display: block; font-size: .88rem; }
.path-item small { display: block; margin-top: 3px; color: #85899a; font-size: .72rem; }
.path-item em { border-radius: 999px; padding: 6px 8px; color: #2f6d55; background: #dcf7ec; font-size: .67rem; font-style: normal; font-weight: 800; }
.path-item.completed > span { background: #17a873; }
.path-item.locked > span { color: #777b8a; background: #e6e7ed; }
.path-connector { width: 2px; height: 18px; margin-left: 17px; background: #a78bfa; }
.path-connector.locked { background: #d8d9e0; }

.obe-score { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 18px; color: #fff; background: linear-gradient(135deg,#6435e9,#2878ff); font-size: 1rem; font-weight: 900; box-shadow: 0 12px 24px rgba(85,56,199,.22); }
.obe-flow-demo { display: grid; grid-template-columns: 1fr auto 1fr auto 1.2fr; align-items: center; gap: 8px; margin-top: 22px; }
.obe-flow-demo > i { color: #aaa4c5; }
.obe-node { padding: 13px 11px; border-radius: 14px; text-align: center; }
.obe-node span { display: block; font-size: .67rem; font-weight: 900; }
.obe-node strong { display: block; margin-top: 4px; font-size: 1rem; }
.node-cpl { color: #5c2ad5; background: #efeaff; }
.node-cpmk { color: #1d65c8; background: #e8f2ff; }
.node-sub { color: #117555; background: #e3f8ef; }
.obe-chart { display: grid; gap: 12px; margin-top: 24px; }
.obe-chart > div { display: grid; grid-template-columns: 100px 1fr 40px; gap: 10px; align-items: center; font-size: .72rem; color: #656a7b; }
.obe-chart > div > div { height: 9px; border-radius: 999px; background: #ececf3; overflow: hidden; }
.obe-chart i { display: block; width: var(--value); height: 100%; border-radius: inherit; background: linear-gradient(90deg,#6435e9,#2878ff); }
.obe-chart strong { color: #303446; font-size: .75rem; text-align: right; }
.obe-footer-note { display: flex; gap: 10px; align-items: flex-start; margin-top: 22px; padding: 13px; border-radius: 14px; color: #805016; background: #fff6dd; font-size: .76rem; line-height: 1.5; }
.obe-footer-note i { color: #e49516; }

.home-v44-floating {
    position: relative;
    inset: auto;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 11px;
    width: 100%;
    min-width: 0;
    min-height: 66px;
    padding: 12px 14px;
    border: 1px solid rgba(91,60,179,.13);
    border-radius: 17px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 12px 30px rgba(53,33,118,.09);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    overflow: hidden;
}
.home-v44-floating::after {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    border-radius: 17px 0 0 17px;
    background: linear-gradient(180deg,#6435e9,#2878ff);
}
.home-v44-floating i {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(135deg,#6435e9,#2878ff);
}
.home-v44-floating > div { min-width: 0; }
.home-v44-floating strong { display: block; font-size: .82rem; line-height: 1.2; }
.home-v44-floating span { display: block; margin-top: 3px; color: #7d8293; font-size: .67rem; line-height: 1.35; }
.floating-one,
.floating-two { left: auto; right: auto; top: auto; bottom: auto; }
.floating-two i { background: linear-gradient(135deg,#2878ff,#18bfe7); }
.floating-two::after { background: linear-gradient(180deg,#2878ff,#18bfe7); }

.home-v44-stat-strip { position: relative; z-index: 5; margin-top: -18px; }
.home-v44-stats {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 1px;
    border: 1px solid rgba(92,65,178,.12);
    border-radius: 24px;
    overflow: hidden;
    background: #e9e7f2;
    box-shadow: var(--home-v44-shadow-sm);
}
.home-v44-stats article { display: flex; align-items: center; gap: 13px; min-width: 0; padding: 22px; background: rgba(255,255,255,.96); }
.stat-icon { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; border-radius: 13px; color: #6435e9; background: #eee9ff; }
.home-v44-stats strong { display: block; font-size: 1rem; letter-spacing: -.02em; }
.home-v44-stats small { display: block; margin-top: 4px; color: #838798; font-size: .7rem; line-height: 1.35; }

.home-v44-section { padding: 92px 0; }
.home-v44-heading { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(280px,.75fr); align-items: end; gap: 32px; margin-bottom: 36px; }
.home-v44-heading.vertical { display: block; margin-bottom: 0; }
.home-v44-heading.centered { display: block; max-width: 760px; margin: 0 auto 40px; text-align: center; }
.home-v44-eyebrow { display: inline-block; margin-bottom: 10px; color: #6435e9; font-size: .75rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.home-v44-eyebrow.light { color: #dcd0ff; }
.home-v44-heading h2,
.quality-panel-v44 h2,
.promo-copy-v44 h2,
.final-cta-v44 h2 { margin: 0; font-size: clamp(2.1rem,4vw,3.7rem); line-height: 1.04; letter-spacing: -.055em; font-weight: 900; }
.home-v44-heading > p,
.home-v44-heading.vertical p,
.home-v44-heading.centered p { margin: 0; color: #6c7182; font-size: 1rem; line-height: 1.75; }
.home-v44-heading.vertical p { margin-top: 20px; }
.home-v44-heading.centered p { max-width: 650px; margin: 18px auto 0; }

.home-v44-bento { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 16px; }
.home-v44-feature {
    grid-column: span 4;
    position: relative;
    min-height: 300px;
    padding: 25px;
    border: 1px solid rgba(91,62,173,.11);
    border-radius: 24px;
    overflow: hidden;
    background: rgba(255,255,255,.88);
    box-shadow: 0 12px 36px rgba(53,33,118,.06);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.home-v44-feature::after { content: ""; position: absolute; width: 170px; height: 170px; right: -80px; bottom: -90px; border-radius: 50%; background: var(--feature-glow,rgba(100,53,233,.10)); }
.home-v44-feature:hover { transform: translateY(-5px); border-color: rgba(100,53,233,.24); box-shadow: 0 25px 55px rgba(53,33,118,.11); }
.home-v44-feature.feature-wide { grid-column: span 6; min-height: 320px; }
.feature-live { --feature-glow: rgba(100,53,233,.16); }
.feature-secure { --feature-glow: rgba(17,169,116,.14); }
.feature-classroom { --feature-glow: rgba(40,120,255,.13); }
.feature-obe { --feature-glow: rgba(138,92,255,.14); }
.feature-builder { --feature-glow: rgba(245,158,11,.14); }
.feature-intelligence { --feature-glow: rgba(24,191,231,.14); }
.feature-tools { --feature-glow: rgba(236,72,153,.12); }
.feature-gamification { --feature-glow: rgba(22,169,116,.12); }
.feature-topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; position: relative; z-index: 1; }
.feature-icon-v44 { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; color: #fff; background: linear-gradient(135deg,#6435e9,#2878ff); box-shadow: 0 11px 23px rgba(76,46,190,.20); }
.feature-secure .feature-icon-v44,
.feature-gamification .feature-icon-v44 { background: linear-gradient(135deg,#16a974,#36c48f); }
.feature-builder .feature-icon-v44 { background: linear-gradient(135deg,#f59e0b,#f97316); }
.feature-tools .feature-icon-v44 { background: linear-gradient(135deg,#ec4899,#8b5cf6); }
.feature-label-v44 { color: #8a8e9c; font-size: .66rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.home-v44-feature h3 { position: relative; z-index: 1; margin: 26px 0 12px; font-size: 1.42rem; line-height: 1.15; letter-spacing: -.035em; font-weight: 900; }
.home-v44-feature p { position: relative; z-index: 1; margin: 0; color: #707587; font-size: .91rem; line-height: 1.65; }
.feature-tags-v44 { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 7px; margin-top: 22px; }
.feature-tags-v44 span { padding: 6px 9px; border: 1px solid #ebe9f3; border-radius: 999px; color: #5d6273; background: rgba(255,255,255,.76); font-size: .67rem; font-weight: 800; }

.home-v44-obe-section { background: linear-gradient(180deg,rgba(242,240,255,.72),rgba(255,255,255,.75)); }
.obe-benefit-list { display: grid; gap: 12px; margin-top: 26px; }
.obe-benefit-list > div { display: flex; gap: 13px; align-items: flex-start; padding: 15px; border: 1px solid rgba(95,64,190,.10); border-radius: 16px; background: rgba(255,255,255,.72); }
.obe-benefit-list i { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; border-radius: 12px; color: #6435e9; background: #eee9ff; }
.obe-benefit-list strong { display: block; font-size: .88rem; }
.obe-benefit-list small { display: block; margin-top: 3px; color: #808596; line-height: 1.45; }
.home-v44-inline-link { margin-top: 24px; padding: 0; border: 0; color: #4b25bd; background: transparent; display: inline-flex; gap: 8px; align-items: center; font-weight: 850; }
.home-v44-inline-link:hover { color: #2f148c; }

.obe-architecture-card { padding: 28px; border: 1px solid rgba(95,64,190,.13); border-radius: 28px; background: rgba(255,255,255,.88); box-shadow: var(--home-v44-shadow); }
.architecture-badge { display: inline-flex; align-items: center; gap: 7px; padding: 8px 10px; border-radius: 999px; color: #167a58; background: #e5f8f0; font-size: .7rem; font-weight: 850; }
.architecture-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1.18fr; gap: 10px; align-items: center; margin-top: 28px; }
.architecture-column { display: grid; gap: 10px; }
.architecture-label { color: #8b8f9e; font-size: .66rem; font-weight: 900; letter-spacing: .1em; text-align: center; }
.architecture-node { position: relative; padding: 14px 12px; border-radius: 15px; }
.architecture-node span { display: block; font-size: .72rem; font-weight: 900; }
.architecture-node small { display: block; min-height: 32px; margin-top: 5px; color: #6d7282; font-size: .68rem; line-height: 1.35; }
.architecture-node strong { position: absolute; right: 10px; top: 10px; font-size: .7rem; }
.architecture-node.purple { background: #efeaff; color: #5f2dd5; }
.architecture-node.blue { background: #e9f3ff; color: #2369c7; }
.architecture-node.green { background: #e6f8f1; color: #167555; }
.architecture-node.amber { background: #fff4dc; color: #a36209; }
.architecture-arrow { color: #b1abc7; }
.architecture-insight { display: flex; align-items: flex-start; gap: 13px; margin-top: 24px; padding: 16px; border-radius: 17px; color: #71490c; background: linear-gradient(135deg,#fff6df,#fffaf0); }
.architecture-insight > span { display: grid; place-items: center; flex: 0 0 auto; width: 37px; height: 37px; border-radius: 12px; color: #fff; background: linear-gradient(135deg,#f59e0b,#f97316); }
.architecture-insight strong { display: block; font-size: .83rem; }
.architecture-insight p { margin: 5px 0 0; font-size: .74rem; line-height: 1.5; }

.teacher-flow-v44 { position: relative; display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.teacher-flow-v44::before { content: ""; position: absolute; left: 11%; right: 11%; top: 31px; height: 2px; background: linear-gradient(90deg,#a78bfa,#60a5fa,#34d399); opacity: .48; }
.teacher-step-v44 { position: relative; padding: 22px; border: 1px solid rgba(95,64,190,.10); border-radius: 22px; background: #fff; box-shadow: 0 12px 35px rgba(53,33,118,.06); }
.step-number-v44 { position: relative; z-index: 2; display: grid; place-items: center; width: 62px; height: 62px; margin-bottom: 22px; border: 7px solid #fff; border-radius: 50%; color: #fff; background: linear-gradient(135deg,#6435e9,#2878ff); box-shadow: 0 9px 22px rgba(76,46,190,.20); font-size: .82rem; font-weight: 900; }
.teacher-step-v44 h3 { margin: 0; font-size: 1.05rem; font-weight: 900; }
.teacher-step-v44 p { margin: 10px 0 0; color: #74798a; font-size: .84rem; line-height: 1.6; }

.home-v44-quality-section { padding-top: 42px; }
.quality-panel-v44 { position: relative; overflow: hidden; padding: clamp(28px,5vw,58px); border-radius: 32px; color: #fff; background: linear-gradient(135deg,#1f124b 0%,#3c1c91 47%,#144f9a 100%); box-shadow: 0 34px 90px rgba(35,20,86,.25); }
.quality-panel-v44::before { content: ""; position: absolute; width: 450px; height: 450px; right: -190px; top: -220px; border-radius: 50%; background: rgba(255,255,255,.09); }
.quality-panel-v44::after { content: ""; position: absolute; width: 250px; height: 250px; left: -130px; bottom: -140px; border-radius: 50%; background: rgba(24,191,231,.16); }
.quality-panel-v44 .row { position: relative; z-index: 1; }
.quality-panel-v44 p { max-width: 620px; margin: 20px 0 0; color: rgba(255,255,255,.74); line-height: 1.75; }
.quality-tags-v44 { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.quality-tags-v44 span { display: inline-flex; align-items: center; gap: 7px; padding: 8px 10px; border: 1px solid rgba(255,255,255,.13); border-radius: 999px; color: rgba(255,255,255,.9); background: rgba(255,255,255,.07); font-size: .72rem; font-weight: 750; }
.quality-tags-v44 i { color: #5ee3b3; }
.quality-dashboard-v44 { padding: 14px; border: 1px solid rgba(255,255,255,.13); border-radius: 24px; background: rgba(255,255,255,.09); backdrop-filter: blur(12px); }
.quality-summary-v44 { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.quality-summary-v44 > div { padding: 14px; border-radius: 15px; background: rgba(255,255,255,.09); }
.quality-summary-v44 span { display: block; color: rgba(255,255,255,.62); font-size: .63rem; }
.quality-summary-v44 strong { display: block; margin-top: 7px; font-size: 1.32rem; }
.quality-summary-v44 small { display: block; margin-top: 4px; color: #6ff0c1; font-size: .65rem; }
.quality-items-v44 { display: grid; gap: 8px; margin-top: 10px; }
.quality-items-v44 > div { display: grid; grid-template-columns: 42px 1fr auto; gap: 10px; align-items: center; padding: 12px; border-radius: 15px; background: rgba(255,255,255,.94); color: #29233e; }
.quality-id { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; color: #5428c3; background: #eee9ff; font-size: .72rem; font-weight: 900; }
.quality-items-v44 strong { display: block; font-size: .75rem; }
.quality-items-v44 small { display: block; margin-top: 4px; color: #888c9a; font-size: .64rem; }
.quality-state { padding: 6px 8px; border-radius: 999px; font-size: .61rem; font-weight: 850; }
.quality-state.good { color: #117555; background: #dcf7ec; }
.quality-state.warning { color: #985b08; background: #fff1cf; }
.quality-state.danger { color: #a72c3c; background: #fee5e8; }

.role-grid-v44 { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; }
.role-card-v44 { position: relative; overflow: hidden; min-height: 390px; padding: 32px; border: 1px solid rgba(95,64,190,.11); border-radius: 28px; background: #fff; box-shadow: var(--home-v44-shadow-sm); }
.role-card-v44::after { content: ""; position: absolute; width: 260px; height: 260px; right: -120px; top: -120px; border-radius: 50%; background: var(--role-glow); }
.role-card-v44.teacher { --role-glow: rgba(100,53,233,.11); }
.role-card-v44.student { --role-glow: rgba(40,120,255,.10); }
.role-icon-v44 { position: relative; z-index: 1; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; color: #fff; background: linear-gradient(135deg,#6435e9,#2878ff); box-shadow: 0 13px 28px rgba(76,46,190,.23); font-size: 1.3rem; }
.role-card-v44.student .role-icon-v44 { background: linear-gradient(135deg,#2878ff,#18bfe7); }
.role-card-v44 > span { display: block; position: relative; z-index: 1; margin-top: 24px; color: #7e8292; font-size: .68rem; font-weight: 900; letter-spacing: .11em; }
.role-card-v44 h3 { position: relative; z-index: 1; margin: 10px 0 0; max-width: 560px; font-size: 1.6rem; line-height: 1.15; letter-spacing: -.035em; font-weight: 900; }
.role-card-v44 ul { position: relative; z-index: 1; display: grid; gap: 12px; margin: 25px 0 0; padding: 0; list-style: none; color: #656a7b; }
.role-card-v44 li { display: flex; align-items: flex-start; gap: 9px; font-size: .86rem; }
.role-card-v44 li i { margin-top: 2px; color: #19a874; }
.role-card-v44 a { position: absolute; z-index: 1; left: 32px; bottom: 30px; display: inline-flex; align-items: center; gap: 8px; color: #4f27bd; font-weight: 850; }
.role-card-v44 a:hover { color: #2f148c; }

.home-v44-promo-section { padding-top: 36px; }
.promo-card-v44 { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0,1.2fr) minmax(260px,.8fr); align-items: center; gap: 30px; padding: clamp(30px,5vw,58px); border-radius: 32px; color: #fff; background: linear-gradient(135deg,#5a2ad3 0%,#752ee4 52%,#205fd1 100%); box-shadow: 0 32px 80px rgba(71,37,171,.24); }
.promo-decoration { position: absolute; border-radius: 50%; background: rgba(255,255,255,.08); }
.promo-decoration-one { width: 330px; height: 330px; right: -120px; top: -170px; }
.promo-decoration-two { width: 200px; height: 200px; left: -90px; bottom: -100px; }
.promo-copy-v44 { position: relative; z-index: 2; }
.promo-kicker-v44 { display: inline-flex; align-items: center; gap: 8px; padding: 8px 11px; border: 1px solid rgba(255,255,255,.17); border-radius: 999px; background: rgba(255,255,255,.09); font-size: .72rem; font-weight: 850; }
.promo-copy-v44 h2 { max-width: 760px; margin-top: 18px; }
.promo-copy-v44 p { max-width: 760px; margin: 18px 0 0; color: rgba(255,255,255,.79); line-height: 1.7; }
.promo-actions-v44 { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.promo-primary-v44 { color: #5427c5; background: #fff; border: 0; }
.promo-primary-v44:hover { color: #35158e; background: #fff; box-shadow: 0 14px 30px rgba(31,18,87,.18); }
.promo-secondary-v44 { color: #fff; border: 1px solid rgba(255,255,255,.24); background: rgba(255,255,255,.08); }
.promo-secondary-v44:hover { color: #fff; background: rgba(255,255,255,.14); }
.promo-visual-v44 { position: relative; z-index: 2; display: grid; place-items: center; min-height: 280px; }
.promo-center-v44 { display: grid; place-items: center; width: 150px; height: 150px; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; background: rgba(255,255,255,.12); box-shadow: inset 0 0 40px rgba(255,255,255,.09), 0 20px 50px rgba(29,16,81,.22); backdrop-filter: blur(14px); }
.promo-center-v44 i { font-size: 1.5rem; color: #f9d66d; }
.promo-center-v44 strong { font-size: 1.8rem; line-height: 1; }
.promo-center-v44 span { font-size: .72rem; color: rgba(255,255,255,.72); }
.promo-orbit { position: absolute; width: 230px; height: 230px; border: 1px dashed rgba(255,255,255,.30); border-radius: 50%; animation: spinV44 18s linear infinite; }
.promo-orbit.orbit-two { width: 290px; height: 290px; animation-direction: reverse; animation-duration: 24s; }
.promo-orbit span { position: absolute; top: -20px; left: calc(50% - 20px); display: grid; place-items: center; width: 40px; height: 40px; border-radius: 13px; color: #fff; background: rgba(255,255,255,.18); box-shadow: 0 10px 20px rgba(31,18,87,.17); }
@keyframes spinV44 { to { transform: rotate(360deg); } }

.home-v44-final-section { padding-top: 26px; }
.final-cta-v44 { display: flex; justify-content: space-between; align-items: center; gap: 30px; padding: clamp(30px,5vw,54px); border-radius: 30px; color: #fff; background: #151125; box-shadow: 0 28px 70px rgba(26,18,60,.20); }
.final-cta-v44 > div:first-child { max-width: 780px; }
.final-cta-v44 p { margin: 16px 0 0; color: rgba(255,255,255,.68); line-height: 1.65; }
.final-actions-v44 { display: flex; flex: 0 0 auto; flex-direction: column; gap: 10px; min-width: 220px; }
.final-primary-v44 { color: #fff; border: 0; background: linear-gradient(135deg,#7041ed,#3978f7); box-shadow: 0 14px 30px rgba(84,49,211,.28); }
.final-primary-v44:hover { color: #fff; }
.final-secondary-v44 { color: #fff; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.06); }
.final-secondary-v44:hover { color: #fff; background: rgba(255,255,255,.10); }

.reveal-v44 { opacity: 1; transform: none; transition: opacity .65s ease, transform .65s ease; }
.map-home-v44.v44-js .reveal-v44 { opacity: 0; transform: translateY(18px); }
.map-home-v44.v44-js .reveal-v44.is-visible { opacity: 1; transform: none; }

@media (max-width: 1199.98px) {
    .home-v44-hero { padding-top: 42px; }
    .min-vh-hero { min-height: auto; }
    .home-v44-title { max-width: 850px; }
    .home-v44-product-column { max-width: 760px; margin: 0 auto; }
    .home-v44-product { max-width: 760px; margin: 20px auto 0; }
    .home-v44-feature { grid-column: span 6; }
    .home-v44-feature.feature-wide { grid-column: span 6; }
    .architecture-flow { grid-template-columns: 1fr auto 1fr auto 1fr; }
    .teacher-flow-v44 { grid-template-columns: repeat(2,1fr); }
    .teacher-flow-v44::before { display: none; }
    .final-cta-v44 { align-items: flex-start; flex-direction: column; }
    .final-actions-v44 { flex-direction: row; min-width: 0; }
}

@media (max-width: 991.98px) {
    .home-v44-stats { grid-template-columns: repeat(2,1fr); }
    .home-v44-section { padding: 72px 0; }
    .home-v44-heading { grid-template-columns: 1fr; gap: 16px; align-items: start; }
    .home-v44-bento { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .home-v44-feature,
    .home-v44-feature.feature-wide { grid-column: span 1; }
    .architecture-flow { grid-template-columns: 1fr; }
    .architecture-arrow { transform: rotate(90deg); text-align: center; }
    .role-grid-v44 { grid-template-columns: 1fr; }
    .promo-card-v44 { grid-template-columns: 1fr; }
    .promo-visual-v44 { min-height: 240px; }
}

@media (max-width: 767.98px) {
    .home-v44-hero { padding: 34px 0 42px; }
    .home-v44-title { font-size: clamp(2.65rem,14vw,4.5rem); }
    .home-v44-lead { font-size: .98rem; }
    .home-v44-actions { align-items: stretch; }
    .home-v44-actions .btn { width: 100%; }
    .home-v44-trust { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
    .home-v44-product { min-height: 0; border-radius: 23px; padding: 8px; }
    .product-preview { min-height: 500px; padding: 16px; }
    .product-window-bar { padding: 0 8px; }
    .window-title { font-size: .72rem; }
    .home-v44-product-column { grid-template-columns: 1fr; gap: 10px; }
    .home-v44-floating { display: flex; min-height: 60px; padding: 10px 12px; }
    .classroom-metrics { grid-template-columns: 1fr; }
    .classroom-metrics article span { white-space: normal; }
    .obe-flow-demo { grid-template-columns: 1fr; }
    .obe-flow-demo > i { transform: rotate(90deg); text-align: center; }
    .obe-chart > div { grid-template-columns: 88px 1fr 36px; }
    .home-v44-stat-strip { margin-top: 0; padding-top: 16px; }
    .home-v44-stats { grid-template-columns: 1fr; border-radius: 20px; }
    .home-v44-stats article { padding: 17px; }
    .home-v44-section { padding: 58px 0; }
    .home-v44-heading h2,
    .quality-panel-v44 h2,
    .promo-copy-v44 h2,
    .final-cta-v44 h2 { font-size: clamp(2rem,10vw,3rem); }
    .home-v44-bento { grid-template-columns: 1fr; }
    .home-v44-feature { min-height: auto; padding: 22px; }
    .obe-architecture-card { padding: 20px; }
    .architecture-header { align-items: flex-start; }
    .teacher-flow-v44 { grid-template-columns: 1fr; }
    .quality-panel-v44 { border-radius: 24px; }
    .quality-summary-v44 { grid-template-columns: 1fr; }
    .quality-items-v44 > div { grid-template-columns: 38px 1fr; }
    .quality-state { grid-column: 2; justify-self: start; }
    .role-card-v44 { min-height: 430px; padding: 24px; }
    .role-card-v44 a { left: 24px; bottom: 24px; }
    .promo-card-v44 { border-radius: 24px; }
    .promo-actions-v44 .btn { width: 100%; }
    .promo-visual-v44 { min-height: 220px; transform: scale(.85); }
    .final-cta-v44 { border-radius: 24px; }
    .final-actions-v44 { width: 100%; flex-direction: column; }
    .final-actions-v44 .btn { width: 100%; }
}

@media (max-width: 420px) {
    .home-v44-kicker { gap: 7px; }
    .home-v44-live,
    .home-v44-version { padding: 7px 9px; font-size: .65rem; }
    .product-tabs button { font-size: .69rem; }
    .arena-question { font-size: 1.05rem; }
    .home-v44-trust { grid-template-columns: 1fr; }
    .home-v44-floating i { width: 34px; height: 34px; }
    .home-v44-floating strong { font-size: .78rem; }
}

@media (prefers-reduced-motion: reduce) {
    .map-home-v44 *,
    .map-home-v44 *::before,
    .map-home-v44 *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .001ms !important; }
    .reveal-v44 { opacity: 1; transform: none; }
}


/* v4.9.1 — Homepage Operator Entry */
.home-v49-operator-link{
    display:inline-flex;align-items:center;justify-content:center;gap:.58rem;
    min-height:48px;padding:.78rem 1rem;border:1px solid rgba(91,52,218,.18);
    border-radius:16px;background:rgba(255,255,255,.78);color:#4f2ec7;
    font-weight:800;box-shadow:0 10px 25px rgba(51,35,110,.07);
    backdrop-filter:blur(12px);transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.home-v49-operator-link:hover{transform:translateY(-2px);background:#fff;color:#3d20ad;box-shadow:0 16px 34px rgba(71,45,164,.13)}
.home-v49-operator-section{position:relative;padding:2rem 0 1.25rem;background:linear-gradient(180deg,#f8f7ff 0%,#fff 100%)}
.home-v49-operator-card{position:relative;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);gap:clamp(1.5rem,4vw,4rem);align-items:center;overflow:hidden;padding:clamp(1.5rem,4vw,3.25rem);border:1px solid rgba(91,52,218,.14);border-radius:34px;background:radial-gradient(circle at 0 0,rgba(124,92,255,.16),transparent 39%),linear-gradient(135deg,#171129 0%,#241947 55%,#35246b 100%);box-shadow:0 30px 70px rgba(39,26,89,.2);color:#fff}
.home-v49-operator-card::after{content:"";position:absolute;width:340px;height:340px;right:-120px;top:-180px;border-radius:50%;background:rgba(138,112,255,.15);pointer-events:none}
.home-v49-operator-copy,.home-v49-operator-form-wrap{position:relative;z-index:1}
.home-v49-operator-copy .home-v44-eyebrow{color:#cfc2ff}
.home-v49-operator-copy h2{max-width:760px;margin:.65rem 0 1rem;font-size:clamp(1.8rem,3.3vw,3.2rem);line-height:1.04;letter-spacing:-.045em;font-weight:900}
.home-v49-operator-copy p{max-width:720px;margin:0;color:rgba(255,255,255,.72);font-size:1.04rem;line-height:1.75}
.home-v49-operator-benefits{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.35rem}
.home-v49-operator-benefits span{display:inline-flex;align-items:center;gap:.45rem;padding:.58rem .75rem;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.08);font-size:.87rem;font-weight:750;color:#f6f3ff}
.home-v49-operator-benefits i{color:#64dfb1}
.home-v49-operator-form-wrap{padding:1.3rem;border:1px solid rgba(255,255,255,.14);border-radius:26px;background:rgba(255,255,255,.96);box-shadow:0 22px 50px rgba(7,4,24,.26);color:#1e1a2d}
.home-v49-operator-form-head{display:flex;align-items:center;gap:.85rem;margin-bottom:1rem}
.home-v49-operator-icon{display:grid;place-items:center;flex:0 0 52px;width:52px;height:52px;border-radius:17px;background:linear-gradient(135deg,#6b46ed,#4f2ec7);color:#fff;font-size:1.3rem;box-shadow:0 12px 24px rgba(91,52,218,.23)}
.home-v49-operator-form-head strong{display:block;font-size:1.08rem}.home-v49-operator-form-head small{display:block;margin-top:.15rem;color:#757083}
.home-v49-operator-form label{display:block;margin:0 0 .45rem;font-size:.86rem;font-weight:800;color:#393345}
.home-v49-code-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.7rem}
.home-v49-code-row input{min-height:52px;border:1px solid #ddd8eb;border-radius:15px;padding:.75rem 1rem;font-weight:850;letter-spacing:.075em;text-transform:uppercase;box-shadow:none}
.home-v49-code-row input:focus{border-color:#7653ec;box-shadow:0 0 0 .22rem rgba(91,52,218,.12)}
.home-v49-code-row button{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:52px;padding:.75rem 1.1rem;border:0;border-radius:15px;background:linear-gradient(135deg,#653ce5,#4f2ec7);color:#fff;font-weight:850;box-shadow:0 12px 24px rgba(91,52,218,.22)}
.home-v49-operator-form>small{display:block;margin-top:.65rem;color:#7b7588;line-height:1.5}
.home-v49-operator-full-link{display:inline-flex;align-items:center;gap:.4rem;margin-top:.85rem;color:#5632ce;font-size:.88rem;font-weight:800;text-decoration:none}
.home-v49-operator-full-link:hover{color:#3e1daf}
@media(max-width:1100px){.home-v49-operator-card{grid-template-columns:1fr}.home-v49-operator-form-wrap{max-width:760px}}
@media(max-width:700px){.home-v49-operator-section{padding:1.1rem 0}.home-v49-operator-card{padding:1.15rem;border-radius:24px}.home-v49-operator-copy h2{font-size:1.75rem}.home-v49-code-row{grid-template-columns:1fr}.home-v49-code-row button{width:100%}.home-v49-operator-benefits{display:grid}.home-v49-operator-benefits span{border-radius:14px}.home-v49-operator-link{width:100%}}