/* Homepage-only presentation. Copy, native controls and course logic are unchanged. */
#page-site-index.ss-cinematic {
    --ss-cinema-ink: #0b0b0e;
    --ss-cinema-blue: #1f8cff;
    background: #fff;
}
#page-site-index.ss-cinematic .ss-home { background: #fff; padding-top: 60px; }
#page-site-index.ss-cinematic .ss-home * { letter-spacing: 0; }
#page-site-index.ss-cinematic .ss-shell { max-width: 1440px; padding-inline: 3rem; }
#page-site-index.ss-cinematic .navbar {
    background: #0b0b0e !important;
    border-bottom: 1px solid #242429;
    box-shadow: none;
    height: 60px;
}
#page-site-index.ss-cinematic .navbar .navbar-toggler { color: #fff; }
#page-site-index.ss-cinematic .navbar .navbar-toggler-icon { filter: invert(1); }
#page-site-index.ss-cinematic .navbar .navbar-brand,
#page-site-index.ss-cinematic .navbar .nav-link,
#page-site-index.ss-cinematic .navbar .usermenu .login,
#page-site-index.ss-cinematic .navbar .usermenu .login a,
#page-site-index.ss-cinematic .navbar .usermenu .dropdown-toggle,
#page-site-index.ss-cinematic .navbar .simplesearchform .btn,
#page-site-index.ss-cinematic .navbar .btn.nav-link { color: #fff !important; }
#page-site-index.ss-cinematic .navbar .primary-navigation .nav-link:hover,
#page-site-index.ss-cinematic .navbar .primary-navigation .nav-link.active,
#page-site-index.ss-cinematic .navbar .primary-navigation .nav-link:focus {
    background: #17171c;
    border-bottom-color: #1f8cff;
}
#page-site-index.ss-cinematic .navbar .ss-language-control {
    background: #111115;
    border-color: #51515a;
    border-radius: 6px;
    box-shadow: none;
    color: #fff;
}
#page-site-index.ss-cinematic .navbar .ss-lang-label { color: #d4d4da; }
#page-site-index.ss-cinematic .navbar .ss-language-control:hover,
#page-site-index.ss-cinematic .navbar .ss-language-control:focus { background: #202027; color: #fff; }
#page-site-index.ss-cinematic .navbar .dropdown-menu .dropdown-item { color: #0b0b0e !important; }
#page-site-index.ss-cinematic .navbar .form-check-label,
#page-site-index.ss-cinematic .navbar .custom-control-label { color: #dedee5; }
#page-site-index.ss-cinematic .navbar .langmenu .ss-lang-dropdown { max-height: min(560px, calc(100dvh - var(--ss-cinema-nav-height, 60px) - 16px)) !important; }
#page-site-index.ss-cinematic .ss-hero {
    display: block;
    min-height: 0;
    padding: 0;
    overflow: clip;
    background: #0b0b0e;
}
#page-site-index.ss-cinematic .ss-hero::before,
#page-site-index.ss-cinematic .ss-hero::after,
#page-site-index.ss-cinematic .ss-signal-primary::before { content: none; }
#page-site-index.ss-cinematic .ss-hero-main {
    position: relative;
    isolation: isolate;
    min-height: 610px;
    display: flex;
    align-items: center;
}
#page-site-index.ss-cinematic .ss-hero-grid { display: block; width: 100%; padding-block: 3rem; }
#page-site-index.ss-cinematic .ss-hero-copy { position: relative; z-index: 2; width: 49%; max-width: 670px; }
#page-site-index.ss-cinematic .ss-eyebrow,
#page-site-index.ss-cinematic .ss-signal-eyebrow {
    border: 0;
    border-radius: 0;
    padding: 0;
    background: none;
    box-shadow: none;
    color: #1f8cff;
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 1.15rem;
}
#page-site-index.ss-cinematic .ss-hero h1 {
    font-size: 3.125rem;
    font-weight: 800;
    line-height: 1.1;
    color: #fff;
    margin-bottom: 1.5rem;
    overflow-wrap: break-word;
    text-wrap: balance;
}
#page-site-index.ss-cinematic .ss-hero .lede { font-size: 1.125rem; line-height: 1.55; color: #efeff2; margin-bottom: .8rem; }
#page-site-index.ss-cinematic .ss-hero .supporting { font-size: .95rem; line-height: 1.6; color: #c3c3cd; }
#page-site-index.ss-cinematic .ss-cta-row { margin: 1.9rem 0 0; gap: .7rem; }
#page-site-index.ss-cinematic .ss-cta {
    font-size: .9375rem;
    line-height: 1.4;
    min-height: 46px;
    font-weight: 700;
    padding: .72rem 1.3rem;
    white-space: normal;
    text-align: center;
    max-width: 100%;
    overflow-wrap: break-word;
    transition: background-color 160ms, border-color 160ms, transform 160ms, box-shadow 160ms;
}
#page-site-index.ss-cinematic .ss-cta.primary { background: #1f8cff; border-color: #1f8cff; color: #0b0b0e; box-shadow: none; }
#page-site-index.ss-cinematic .ss-cta.primary:hover { background: #64afff; border-color: #64afff; color: #0b0b0e; transform: translateY(-2px); }
#page-site-index.ss-cinematic .ss-cta.ghost { background: transparent; border-color: #aaaab3; color: #fff; }
#page-site-index.ss-cinematic .ss-cta.ghost:hover { background: #24242b; border-color: #fff; transform: translateY(-2px); }
#page-site-index.ss-cinematic .ss-home a:focus-visible { outline: 3px solid #1f8cff; outline-offset: 5px; }
#page-site-index.ss-cinematic .ss-console-art {
    position: absolute;
    width: min(82%, 1260px);
    aspect-ratio: 3 / 2;
    inset-inline-end: -5rem;
    top: 50%;
    transform: translateY(-48%);
    z-index: 1;
    direction: ltr;
}
#page-site-index.ss-cinematic .ss-console-image { display: block; width: 100%; height: auto; mask-image: linear-gradient(to right, transparent, #000 18%); }
#page-site-index.ss-cinematic .ss-console-screen {
    display: flex;
    flex-direction: column;
    position: absolute;
    left: 0;
    top: 0;
    width: 800px;
    height: 560px;
    transform-origin: 0 0;
    visibility: hidden;
    overflow: hidden;
    background: #0b0b0e;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
}
#page-site-index.ss-cinematic .ss-console-screen.is-positioned { visibility: visible; }
#page-site-index.ss-cinematic .ss-console-screen:not(.is-positioned) { left: 30.5%; top: 17%; width: 46%; height: 49%; transform: skew(18deg, -5deg); }
#page-site-index.ss-cinematic .ss-console-screen:not(.is-positioned) .ss-console-caption { display: none; }
#page-site-index.ss-cinematic .ss-console-media { position: relative; display: block; flex: 1; min-height: 0; overflow: hidden; }
#page-site-index.ss-cinematic .ss-console-media img { width: 100%; height: 100%; display: block; object-fit: cover; }
#page-site-index.ss-cinematic .ss-console-play {
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
    display: grid;
    place-items: center;
    width: 82px;
    height: 82px;
    border-radius: 50%;
    color: #fff;
    background: #0071e3;
    border: 2px solid #81c3ff;
    box-shadow: 0 8px 24px #0007;
    font-size: 28px;
    transition: background-color 180ms, transform 180ms;
}
#page-site-index.ss-cinematic .ss-console-screen:hover .ss-console-play { background: #1f8cff; transform: translate(-50%, -50%) scale(1.08); }
#page-site-index.ss-cinematic .ss-console-caption { display: grid; gap: 10px; padding: 22px 28px 26px; text-align: start; }
#page-site-index.ss-cinematic .ss-console-caption > span { color: #89c7ff; font-size: 17px; line-height: 1.4; }
#page-site-index.ss-cinematic .ss-console-caption strong { color: #fff; font-size: 26px; line-height: 1.3; font-weight: 700; }
#page-site-index.ss-cinematic .ss-console-caption small { color: #dedee3; font-size: 20px; line-height: 1.4; }
#page-site-index.ss-cinematic.dir-rtl .ss-console-caption { direction: rtl; }
#page-site-index.ss-cinematic .ss-build-band { position: relative; z-index: 2; border-block: 1px solid #2b2b32; background: #0b0b0e; }
#page-site-index.ss-cinematic .ss-build-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.65fr); gap: 2rem; padding-block: 1.7rem; align-items: center; }
#page-site-index.ss-cinematic .ss-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; max-width: none; }
#page-site-index.ss-cinematic .ss-fact { padding: .5rem 1rem; border: 0; border-inline-end: 1px solid #414149; border-radius: 0; background: none; text-align: center; }
#page-site-index.ss-cinematic .ss-fact:first-child { padding-inline-start: 0; }
#page-site-index.ss-cinematic .ss-fact:last-child { border-inline-end: 0; }
#page-site-index.ss-cinematic .ss-fact-icon { display: block; color: #1f8cff; font-size: 1.7rem; margin-bottom: 1rem; }
#page-site-index.ss-cinematic .ss-fact:nth-child(1) .ss-fact-icon::before { content: "\f5fd"; }
#page-site-index.ss-cinematic .ss-fact:nth-child(2) .ss-fact-icon::before { content: "\f0e7"; }
#page-site-index.ss-cinematic .ss-fact:nth-child(3) .ss-fact-icon::before { content: "\f5a2"; }
#page-site-index.ss-cinematic .ss-fact .value { font-size: 1.2rem; color: #fff; font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; }
#page-site-index.ss-cinematic .ss-fact .label { color: #c3c3cd; font-size: .8rem; font-weight: 400; line-height: 1.5; margin-top: .5rem; }
#page-site-index.ss-cinematic .ss-campus-signal { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 2rem; align-items: center; }
#page-site-index.ss-cinematic .ss-signal-primary { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; overflow: visible; }
#page-site-index.ss-cinematic .ss-signal-eyebrow { font-size: .7rem; margin-bottom: .7rem; }
#page-site-index.ss-cinematic .ss-signal-primary strong { font-size: 1.3rem; font-weight: 700; line-height: 1.4; }
#page-site-index.ss-cinematic .ss-signal-primary p { font-size: .875rem; line-height: 1.65; margin-top: .6rem; color: #c3c3cd; }
#page-site-index.ss-cinematic .ss-signal-grid { gap: 0; }
#page-site-index.ss-cinematic .ss-signal-item { background: none; border: 0; border-bottom: 1px solid #33333a; border-radius: 0; padding: .65rem 0; }
#page-site-index.ss-cinematic .ss-signal-item:last-child { border-bottom: 0; }
#page-site-index.ss-cinematic .ss-signal-item span { color: #1f8cff; font-size: .7rem; font-weight: 600; }
#page-site-index.ss-cinematic .ss-signal-item strong { color: #eeeef2; font-size: .9rem; font-weight: 500; margin-top: .2rem; }
#page-site-index.ss-cinematic .ss-section { padding-block: 4rem; }
#page-site-index.ss-cinematic .ss-section.ss-light { background: #fff; }
#page-site-index.ss-cinematic .ss-light > .ss-shell > .ss-head { text-align: center; max-width: 850px; margin: 0 auto 2.5rem; }
#page-site-index.ss-cinematic .ss-head h2 { font-size: 2.25rem; font-weight: 800; line-height: 1.2; }
#page-site-index.ss-cinematic .ss-eyebrow-dark { color: #0064cf; }
#page-site-index.ss-cinematic .ss-openclaw-spotlight { padding: 2rem 0 3rem; border: 0; border-radius: 0; box-shadow: none; background: #fff; color: #0b0b0e; gap: 3rem; align-items: center; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); }
#page-site-index.ss-cinematic .ss-openclaw-copy h3 { color: #0b0b0e; font-size: 2rem; line-height: 1.2; font-weight: 800; }
#page-site-index.ss-cinematic .ss-openclaw-copy > p { color: #42424d; }
#page-site-index.ss-cinematic .ss-openclaw-kicker { color: #0064cf; }
#page-site-index.ss-cinematic .ss-openclaw-tags span { border: 0; border-radius: 0; border-inline-start: 2px solid #1f8cff; background: #f5f7fa; color: #24242d; }
#page-site-index.ss-cinematic .ss-openclaw-bridge { background: transparent; border-radius: 0; border: 0; border-inline-start: 2px solid #c7c7d0; padding-inline-start: 1rem; }
#page-site-index.ss-cinematic .ss-openclaw-business-link { color: #005fc7; }
#page-site-index.ss-cinematic .ss-cta.ghost-dark { background: transparent; border: 1px solid #7b7b88; color: #0b0b0e; }
#page-site-index.ss-cinematic .ss-openclaw-video { border-radius: 8px; background: #0b0b0e; border: 1px solid #29292f; box-shadow: 0 16px 40px #0b0b0e17; }
#page-site-index.ss-cinematic .ss-openclaw-video-frame { aspect-ratio: 16 / 9; background: #0b0b0e; }
#page-site-index.ss-cinematic .ss-openclaw-video-frame img { width: 100%; height: 100%; object-fit: cover; }
#page-site-index.ss-cinematic .ss-cards { gap: 0; border-top: 1px solid #dedee4; }
#page-site-index.ss-cinematic .ss-card { border: 0; border-bottom: 1px solid #dedee4; border-radius: 0; background: #fff; box-shadow: none; padding: 2rem; }
#page-site-index.ss-cinematic .ss-card:hover { background: #f7f9fc; box-shadow: none; transform: none; }
#page-site-index.ss-cinematic .ss-card h3 { font-weight: 700; line-height: 1.35; }
#page-site-index.ss-cinematic .ss-icon { border-radius: 6px; background: #f0f5fa; box-shadow: none; }
#page-site-index.ss-cinematic .ss-meeting-spotlight { box-shadow: none; margin-block: 1rem 3rem; border-radius: 0; border: 0; }
#page-site-index.ss-cinematic .ss-meeting-spotlight .ss-cta.ghost-dark { color: #fff; border-color: #aaaab3; }
#page-site-index.ss-cinematic .ss-op { border-radius: 0; border: 0; border-inline-start: 1px solid #414149; background: transparent; box-shadow: none; }
#page-site-index.ss-cinematic .ss-footer { background: #fff; border-top: 1px solid #dedee4; }
#page-site-index.ss-cinematic .ss-foot { border-radius: 0; background: transparent; box-shadow: none; }
#page-site-index.ss-cinematic .eupopup-container { background: #16161b !important; border: 1px solid #45454e; border-radius: 8px !important; box-shadow: 0 -8px 30px #0002 !important; padding: 1rem 1.25rem !important; }
#page-site-index.ss-cinematic .eupopup-container a:not(.eupopup-button) { color: #a6d1ff !important; }
#page-site-index.ss-cinematic .eupopup-container .eupopup-button { background: #1f8cff !important; color: #0b0b0e !important; box-shadow: none !important; }
@media (min-width: 1800px) {
    #page-site-index.ss-cinematic .ss-console-art { inset-inline-end: calc((100% - 1600px) / 2); width: 1260px; }
    #page-site-index.ss-cinematic .ss-console-image { mask-image: linear-gradient(to right, transparent, #000 18%, #000 88%, transparent); }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    #page-site-index.ss-cinematic .ss-console-art { transition: translate 300ms ease; }
    #page-site-index.ss-cinematic .ss-console-art:hover { translate: -3px -3px; }
}
@media (max-width: 1199px) {
    #page-site-index.ss-cinematic .ss-shell { padding-inline: 2rem; }
    #page-site-index.ss-cinematic .ss-hero h1 { font-size: 2.625rem; }
    #page-site-index.ss-cinematic .ss-hero-main { min-height: 570px; }
    #page-site-index.ss-cinematic .ss-build-grid { grid-template-columns: 1fr; gap: 2rem; }
    #page-site-index.ss-cinematic .ss-facts { max-width: 680px; margin-inline: auto; width: 100%; }
}
@media (min-width: 1200px) and (max-width: 1320px) {
    #page-site-index.ss-cinematic .ss-hero h1 { font-size: 2.75rem; }
    #page-site-index.ss-cinematic .ss-hero-main { min-height: 560px; }
}
@media (max-width: 1023px) {
    #page-site-index.ss-cinematic .ss-hero-main { display: flex; flex-direction: column; }
    #page-site-index.ss-cinematic .ss-hero-grid { order: 0; padding-block: 2.5rem .5rem; }
    #page-site-index.ss-cinematic .ss-hero-copy { width: 100%; max-width: 700px; }
    #page-site-index.ss-cinematic .ss-console-art { order: 1; position: relative; width: 100%; max-width: 900px; top: auto; inset-inline-end: auto; transform: none; margin-top: -1rem; }
    #page-site-index.ss-cinematic .ss-openclaw-spotlight { gap: 2rem; }
}
@media (max-width: 767px) {
    #page-site-index.ss-cinematic .ss-shell { padding-inline: 1.25rem; }
    #page-site-index.ss-cinematic .navbar .ss-language-control { min-height: 38px; }
    #page-site-index.ss-cinematic .ss-hero-grid { padding-block: 1.5rem 0; }
    #page-site-index.ss-cinematic .ss-hero-copy { max-width: none; }
    #page-site-index.ss-cinematic .ss-hero h1 { font-size: 1.875rem; line-height: 1.14; margin-bottom: 1rem; text-wrap: pretty; }
    #page-site-index.ss-cinematic .ss-eyebrow { margin-bottom: .8rem; font-size: .7rem; }
    #page-site-index.ss-cinematic .ss-hero .lede { font-size: 1rem; line-height: 1.5; margin-bottom: .6rem; }
    #page-site-index.ss-cinematic .ss-hero .supporting { font-size: .875rem; line-height: 1.5; }
    #page-site-index.ss-cinematic .ss-cta-row { margin-top: 1.15rem; gap: .6rem; }
    #page-site-index.ss-cinematic .ss-cta-row .ss-cta { width: 100%; min-height: 44px; font-size: .9rem; padding: .65rem 1rem; }
    #page-site-index.ss-cinematic .ss-home { padding-top: 108px; }
    #page-site-index.ss-cinematic .navbar { height: auto; min-height: 108px; flex-wrap: wrap !important; padding-inline: 1.25rem !important; padding-bottom: .5rem; }
    #page-site-index.ss-cinematic .navbar .navbar-brand { display: flex !important; order: -1; flex: 0 0 100%; max-width: 100%; height: 42px; margin: 0; padding: .6rem 0 .3rem; font-size: 1rem; line-height: 1.25; }
    #page-site-index.ss-cinematic .navbar .navbar-brand .sitename { white-space: normal; }
    #page-site-index.ss-cinematic .navbar .langmenu,
    #page-site-index.ss-cinematic .navbar .usermenu-container { height: 48px; }
    #page-site-index.ss-cinematic .navbar #usernavigation { height: auto !important; min-height: 48px; align-items: center; flex-wrap: wrap; max-width: calc(100% - 50px); }
    #page-site-index.ss-cinematic .navbar .divider { height: 24px !important; }
    #page-site-index.ss-cinematic .navbar .langmenu .dropdown-menu.show { position: fixed !important; top: calc(var(--ss-cinema-nav-height, 108px) + 4px) !important; inset-inline: .75rem !important; width: auto !important; transform: none !important; }
    #page-site-index.ss-cinematic .ss-console-art { width: min(130%, 540px); height: 250px; aspect-ratio: auto; overflow: clip; flex: none; margin: -.5rem 0 -1rem; transform: translateX(-5%); }
    #page-site-index.ss-cinematic .ss-build-grid { padding-block: 1.5rem; gap: 1.5rem; }
    #page-site-index.ss-cinematic .ss-fact { padding: .25rem .6rem; }
    #page-site-index.ss-cinematic .ss-fact-icon { font-size: 1.3rem; margin-bottom: .65rem; }
    #page-site-index.ss-cinematic .ss-fact .value { font-size: .9375rem; }
    #page-site-index.ss-cinematic .ss-fact .label { font-size: .6875rem; line-height: 1.5; }
    #page-site-index.ss-cinematic .ss-campus-signal { grid-template-columns: 1fr; gap: .7rem; }
    #page-site-index.ss-cinematic .ss-signal-primary strong { font-size: 1.125rem; }
    #page-site-index.ss-cinematic .ss-signal-primary p { font-size: .8125rem; }
    #page-site-index.ss-cinematic .ss-signal-grid { grid-template-columns: 1fr; }
    #page-site-index.ss-cinematic .ss-signal-item { padding-block: .55rem; }
    #page-site-index.ss-cinematic .ss-signal-item strong { font-size: .875rem; }
    #page-site-index.ss-cinematic .ss-section { padding-block: 2.5rem; }
    #page-site-index.ss-cinematic .ss-head h2 { font-size: 1.625rem; }
    #page-site-index.ss-cinematic .ss-light > .ss-shell > .ss-head { margin-bottom: 1.75rem; }
    #page-site-index.ss-cinematic .ss-openclaw-spotlight { grid-template-columns: 1fr; padding-block: 1rem 2rem; gap: 1.5rem; }
    #page-site-index.ss-cinematic .ss-openclaw-copy h3 { font-size: 1.75rem; }
    #page-site-index.ss-cinematic .ss-card { padding: 1.5rem 0; }
}
@media (prefers-reduced-motion: reduce) {
    #page-site-index.ss-cinematic .ss-home *,
    #page-site-index.ss-cinematic .ss-home *::before,
    #page-site-index.ss-cinematic .ss-home *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media print {
    #page-site-index.ss-cinematic .ss-console-art { display: none; }
    #page-site-index.ss-cinematic .ss-hero-copy { width: 100%; }
}
