/* Omega Academix homepage — WBS-style layout (uses tokens from oa-brand.css) */

.oa-section { padding: 96px 0; background: #fff; }
.oa-section--grey { background: var(--oa-grey); }

/* ── Hero ─────────────────────────────────────────────── */
.oa-hero { padding: 34px 0 70px; background: #fff; overflow: hidden; }
.oa-hero-grid { position: relative; display: grid; grid-template-columns: 46fr 54fr; }
.oa-hero-panel {
    position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; gap: 36px;
    min-height: 600px; margin-right: -2px; padding: 76px 48px 150px 64px; background: var(--oa-navy); color: #fff;
    clip-path: polygon(var(--oa-cut) 0, 100% 0, 100% calc(100% - 86px), calc(100% - 86px) 100%, 0 100%, 0 var(--oa-cut));
}
.oa-hero-panel .oa-kicker { color: var(--oa-orange-2); }
.oa-hero-panel h1 { margin: 18px 0 22px; font-size: clamp(36px, 4vw, 56px); font-weight: 700; line-height: 1.08; letter-spacing: -.02em; color: #fff !important; }
.oa-hero-panel h1 .highlight { color: var(--oa-orange-2); background: none; -webkit-text-fill-color: currentColor; }
.oa-hero-panel p { margin: 0; max-width: 460px; font-size: 18px; line-height: 1.7; color: rgba(255, 255, 255, .85); }
.oa-hero-actions { display: flex; flex-wrap: wrap; gap: 16px; }
.oa-hero-art { position: relative; align-self: start; height: calc(100% - 86px); min-height: 514px; overflow: hidden; background: #07285A; }
.oa-hero-stripes { position: absolute; z-index: 1; left: calc(46% - 86px); bottom: 0; width: 44%; height: 86px; }

.oa-art { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.oa-art * { transform-box: fill-box; }
.art-drift { animation: artDrift 18s linear infinite; }
@keyframes artDrift { to { transform: translateX(70px); } }
.art-ribbon rect { transform-origin: right; animation: artRibbon 1.2s cubic-bezier(.2, .7, .2, 1) both; }
.art-ribbon rect:nth-child(2) { animation-delay: .08s; } .art-ribbon rect:nth-child(3) { animation-delay: .16s; }
.art-ribbon rect:nth-child(4) { animation-delay: .24s; } .art-ribbon rect:nth-child(5) { animation-delay: .32s; }
@keyframes artRibbon { from { transform: scaleX(0); } }
.art-ring { transform-origin: center; animation: artRing 3s ease-out infinite; }
@keyframes artRing { 0% { transform: scale(1); opacity: .9; } 70%, 100% { transform: scale(3.2); opacity: 0; } }
.art-link { stroke-dasharray: 6 8; animation: artLink 2.4s linear infinite; }
@keyframes artLink { to { stroke-dashoffset: -28; } }
.art-bars rect { transform-origin: bottom; animation: artBar 1.1s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes artBar { from { transform: scaleY(0); } }
.art-trend { stroke-dasharray: 320; stroke-dashoffset: 320; animation: artTrend 1.4s ease-out 1.1s forwards; }
@keyframes artTrend { to { stroke-dashoffset: 0; } }
.art-trend-dot { transform-origin: center; animation: artDot 2s ease-in-out 2.4s infinite both; }
@keyframes artDot { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.6); } }
.art-pulse { stroke-dasharray: 240 1200; animation: artPulse 4s linear infinite; }
@keyframes artPulse { from { stroke-dashoffset: 240; } to { stroke-dashoffset: -1200; } }

.oa-art-chip {
    position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 10px; padding: 11px 16px;
    background: rgba(255, 255, 255, .96); color: var(--oa-navy); font-size: 14px; font-weight: 700;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .25); animation: artFloat 6s ease-in-out infinite;
}
.oa-art-chip i { color: var(--oa-orange); }
.oa-art-chip.chip-1 { right: 6%; top: 50%; }
.oa-art-chip.chip-2 { left: 6%; top: 64%; animation-delay: -2s; }
.oa-art-chip.chip-3 { left: 30%; top: 33%; animation-delay: -4s; }
@keyframes artFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
.oa-art-pause { position: absolute; z-index: 3; right: 16px; bottom: 16px; width: 42px; height: 42px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .16); color: #fff; cursor: pointer; transition: background .2s; }
.oa-art-pause:hover, .oa-art-pause:focus-visible { background: rgba(255, 255, 255, .3); }
.oa-hero-art.is-paused *, .oa-hero-art.is-paused *::before { animation-play-state: paused !important; }

/* ── Intro ────────────────────────────────────────────── */
.oa-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; align-items: center; }
.oa-intro blockquote { margin: 18px 0 22px; font-size: clamp(26px, 2.8vw, 38px); font-weight: 700; line-height: 1.2; color: var(--oa-ink); }
.oa-intro p { font-size: 17px; line-height: 1.8; color: var(--oa-body); margin-bottom: 26px; }
.oa-intro-media { position: relative; }
.oa-intro-media img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; clip-path: polygon(var(--oa-cut) 0, 100% 0, 100% 100%, 0 100%, 0 var(--oa-cut)); }
.oa-intro-media .oa-stripes { position: absolute; right: -30px; bottom: -34px; width: 62%; height: 64px; }

/* ── Programs ─────────────────────────────────────────── */
.oa-prog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.oa-prog { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--oa-line); border-top: 6px solid var(--p-from); transition: transform .3s, box-shadow .3s; }
.oa-prog:hover { transform: translateY(-6px); box-shadow: 0 22px 50px rgba(7, 40, 90, .12); }
.oa-prog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 28px 28px 0; }
.oa-prog-icon { width: 52px; height: 52px; display: grid; place-items: center; background: linear-gradient(135deg, var(--p-from), var(--p-to)); color: #fff; font-size: 20px; }
.oa-tag { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.oa-tag--open { background: #dcfce7; color: #15803d; }
.oa-tag--soon { background: #fff1e6; color: #c2410c; }
.oa-prog-body { display: flex; flex-direction: column; gap: 14px; flex: 1; padding: 22px 28px 28px; }
.oa-prog-body h3 { margin: 0; font-size: 23px; font-weight: 700; line-height: 1.25; color: var(--oa-ink); }
.oa-prog-body .oa-prog-tagline { font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--p-from); }
.oa-prog-body p { margin: 0; font-size: 15.5px; line-height: 1.7; color: var(--oa-body); }
.oa-prog .oa-btn { margin-top: auto; width: 100%; justify-content: space-between; }

/* ── Stats band ───────────────────────────────────────── */
.oa-stats { padding: 90px 0 0; }
.oa-stats-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: 50px; }
.oa-stats-top h2 { margin: 12px 0 0; font-size: clamp(28px, 3.2vw, 42px); font-weight: 700; }
.oa-stats-top .oa-link { color: #fff; }
.oa-stat-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid rgba(255, 255, 255, .15); }
.oa-stat { padding: 36px 28px 40px 0; }
.oa-stat + .oa-stat { padding-left: 28px; border-left: 1px solid rgba(255, 255, 255, .15); }
.oa-stat-num { font-size: clamp(38px, 4vw, 56px); font-weight: 700; line-height: 1; color: #fff; }
.oa-stat-num em { font-style: normal; color: var(--oa-orange-2); }
.oa-stat-label { margin-top: 10px; font-size: 15px; color: rgba(255, 255, 255, .75); }
.oa-stats .oa-stripes { width: 46%; margin-left: auto; height: 70px; }

/* ── Next steps ───────────────────────────────────────── */
.oa-next { display: grid; grid-template-columns: minmax(0, 1.1fr) auto; gap: 40px; align-items: center; padding: 54px 56px; background: #fff; border-left: 6px solid var(--oa-orange); }
.oa-next h2 { margin: 10px 0 10px; font-size: clamp(26px, 2.6vw, 36px); font-weight: 700; color: var(--oa-ink); }
.oa-next p { margin: 0; font-size: 17px; line-height: 1.7; color: var(--oa-body); max-width: 560px; }
.oa-next-actions { display: flex; flex-wrap: wrap; gap: 14px; }

/* ── Partners + Guidelines ────────────────────────────── */
.oa-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.oa-duo-card { display: flex; flex-direction: column; gap: 18px; padding: 44px; background: #fff; border: 1px solid var(--oa-line); }
.oa-duo-card h3 { margin: 6px 0 0; font-size: 28px; font-weight: 700; color: var(--oa-ink); }
.oa-duo-card p { margin: 0; font-size: 16px; line-height: 1.75; color: var(--oa-body); }
.oa-duo-card .oa-btn { margin-top: auto; align-self: flex-start; }
.oa-logo-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.oa-logo-row a { display: grid; place-items: center; height: 96px; padding: 12px 16px; border: 1px solid var(--oa-line); background: #fff; transition: border-color .2s; }
.oa-logo-row a:hover { border-color: var(--oa-navy-soft); }
.oa-logo-row img { max-width: 100%; max-height: 100%; object-fit: contain; }
.oa-logo-row span { font-weight: 700; color: var(--oa-ink); text-align: center; }
.oa-spec-list { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.oa-spec-list li { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; background: var(--oa-grey); font-size: 14px; font-weight: 600; color: var(--oa-ink); }
.oa-spec-list i { color: var(--oa-orange); }
.oa-spec-list a { display: inline-flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; }
.oa-spec-list li:has(a):hover { background: var(--oa-navy); color: #fff; }
.oa-mini-label { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--oa-body); margin-bottom: -6px; }

/* ── Let's connect ────────────────────────────────────── */
.oa-connect { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.oa-connect-card { position: relative; display: flex; flex-direction: column; gap: 14px; padding: 36px 32px; background: #fff; border: 1px solid var(--oa-line); text-decoration: none; transition: border-color .25s, box-shadow .25s, transform .25s; }
.oa-connect-card::after { content: ""; position: absolute; left: -1px; right: -1px; bottom: -1px; height: 5px; background: var(--oa-grad); transform: scaleX(0); transform-origin: left; transition: transform .35s; }
a.oa-connect-card:hover, button.oa-connect-card:hover { transform: translateY(-4px); box-shadow: 0 18px 44px rgba(7, 40, 90, .1); }
.oa-connect-card:hover::after { transform: scaleX(1); }
button.oa-connect-card { text-align: left; font: inherit; cursor: pointer; }
.oa-connect-icon { width: 56px; height: 56px; display: grid; place-items: center; background: var(--oa-navy); color: #fff; font-size: 22px; }
.oa-connect-card h3 { margin: 6px 0 0; font-size: 22px; font-weight: 700; color: var(--oa-ink); }
.oa-connect-card p { margin: 0; font-size: 15.5px; line-height: 1.7; color: var(--oa-body); }
.oa-connect-card .oa-link { margin-top: auto; align-self: flex-start; }
.oa-news-form { display: flex; margin-top: auto; }
.oa-news-form input { flex: 1; min-width: 0; padding: 12px 14px; border: 1px solid #c9d2e1; border-right: 0; border-radius: 0; font: inherit; font-size: 15px; background: #fff; color: var(--oa-ink); }
.oa-news-form input:focus { outline: none; border-color: var(--oa-navy-soft); }
.oa-news-form button { border: 0; padding: 0 18px; background: var(--oa-navy); color: #fff; font-weight: 700; cursor: pointer; }
.oa-news-form button:hover { background: var(--oa-orange); }

/* ── Community (blog) ─────────────────────────────────── */
.oa-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.oa-post { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--oa-line); text-decoration: none; transition: box-shadow .25s, transform .25s; }
.oa-post:hover { transform: translateY(-4px); box-shadow: 0 18px 44px rgba(7, 40, 90, .1); }
.oa-post-img { aspect-ratio: 16 / 10; overflow: hidden; background: var(--oa-grey); }
.oa-post-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.oa-post:hover .oa-post-img img { transform: scale(1.04); }
.oa-post-body { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 24px 26px 26px; }
.oa-post-cat { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--oa-orange); }
.oa-post-body h3 { margin: 0; font-size: 19px; font-weight: 700; line-height: 1.4; color: var(--oa-ink); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.oa-post-more { margin-top: auto; padding-top: 12px; font-size: 14px; font-weight: 700; color: var(--oa-navy-soft); }
.oa-post-more i { margin-left: 6px; font-size: 12px; transition: transform .25s; }
.oa-post:hover .oa-post-more i { transform: translateX(4px); }

/* ── FAQ ──────────────────────────────────────────────── */
.oa-faq { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 64px; align-items: start; }
.oa-faq-side { position: sticky; top: 160px; }
.oa-faq-side h2 { margin: 10px 0 16px; font-size: clamp(28px, 3.2vw, 42px); font-weight: 700; line-height: 1.15; color: var(--oa-ink); }
.oa-faq-side p { font-size: 17px; line-height: 1.7; color: var(--oa-body); margin-bottom: 26px; }
.oa-faq .accordion-item { border: 0; border-bottom: 1px solid var(--oa-line); background: transparent; }
.oa-faq .accordion-item:first-child { border-top: 1px solid var(--oa-line); }
.oa-faq .accordion-button { padding: 24px 4px; font-size: 18px; font-weight: 600; color: var(--oa-ink); background: transparent; box-shadow: none; }
.oa-faq .accordion-button:not(.collapsed) { color: var(--oa-navy-soft); }
.oa-faq .accordion-button:focus-visible { outline: 3px solid var(--oa-orange-2); }
.oa-faq .accordion-body { padding: 0 4px 26px; font-size: 16px; line-height: 1.75; color: var(--oa-body); }

/* ── Closing CTA ──────────────────────────────────────── */
.oa-closing { padding: 96px 0; background: #fff; }
.oa-closing-box { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; padding: 64px 72px 110px; clip-path: polygon(var(--oa-cut) 0, 100% 0, 100% 100%, 0 100%, 0 var(--oa-cut)); }
.oa-closing-box h2 { margin: 12px 0 10px; font-size: clamp(30px, 3.4vw, 46px); font-weight: 700; }
.oa-closing-box p { margin: 0; font-size: 17px; max-width: 520px; }
.oa-closing-box .oa-stripes { position: absolute; right: 0; bottom: 26px; width: 52%; height: 56px; }

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 1199px) {
    .oa-hero-panel { padding: 70px 44px 140px 60px; }
    .oa-prog-grid, .oa-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .oa-connect { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 991px) {
    .oa-section { padding: 72px 0; }
    .oa-hero { padding: 20px 0 50px; }
    .oa-hero-grid { grid-template-columns: 1fr; }
    .oa-hero-art { order: -1; height: 380px; min-height: 0; }
    .oa-hero-panel { min-height: 0; margin: -40px 0 0; padding: 56px 32px 120px; clip-path: polygon(var(--oa-cut) 0, 100% 0, 100% calc(100% - 70px), calc(100% - 70px) 100%, 0 100%, 0 var(--oa-cut)); }
    .oa-hero-stripes { left: auto; right: 70px; width: 55%; height: 70px; }
    .oa-intro, .oa-duo, .oa-faq { grid-template-columns: 1fr; gap: 44px; }
    .oa-faq-side { position: static; }
    .oa-stat-row { grid-template-columns: 1fr 1fr; }
    .oa-stat:nth-child(3) { padding-left: 0; border-left: 0; }
    .oa-stat:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .15); }
    .oa-next { grid-template-columns: 1fr; padding: 40px 32px; }
    .oa-closing-box { padding: 52px 36px 100px; }
}
@media (max-width: 767px) {
    :root { --oa-cut: 36px; }
    .oa-section { padding: 60px 0; }
    .oa-hero-art { height: 300px; }
    .oa-art-chip { font-size: 12px; padding: 8px 12px; }
    .oa-art-chip.chip-1 { top: 46%; } .oa-art-chip.chip-3 { top: 18%; }
    .oa-hero-panel { padding: 46px 22px 100px; }
    .oa-hero-actions .oa-btn { flex: 1 1 100%; }
    .oa-prog-grid, .oa-posts, .oa-connect { grid-template-columns: 1fr; }
    .oa-duo-card { padding: 30px 24px; }
    .oa-stat { padding: 26px 14px 28px 0; }
    .oa-stat + .oa-stat { padding-left: 14px; }
    .oa-stats .oa-stripes { width: 70%; }
    .oa-closing-box { padding: 44px 24px 96px; }
    .oa-intro-media .oa-stripes { right: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .oa-hero-art *, .oa-art-chip { animation: none !important; }
    .art-trend { stroke-dashoffset: 0; }
    .art-pulse { stroke-dasharray: none; }
}

/* ── Dark mode ────────────────────────────────────────── */
html.oa-dark .oa-section, html.oa-dark .oa-hero, html.oa-dark .oa-closing { background: var(--oa-d-bg); }
html.oa-dark .oa-section--grey { background: var(--oa-d-soft); }
html.oa-dark .oa-hero-panel { background: #0a2350; }
html.oa-dark .oa-prog, html.oa-dark .oa-next, html.oa-dark .oa-duo-card, html.oa-dark .oa-connect-card, html.oa-dark .oa-post, html.oa-dark .oa-logo-row a { background: var(--oa-d-card); border-color: var(--oa-d-line); }
html.oa-dark .oa-prog { border-top-color: var(--p-from); }
html.oa-dark .oa-next { border-left-color: var(--oa-orange); }
html.oa-dark .oa-logo-row a { background: #fff; }
html.oa-dark .oa-spec-list li { background: var(--oa-d-raise); }
html.oa-dark .oa-connect-icon { background: #1d3f80; }
html.oa-dark .oa-news-form input { background: var(--oa-d-soft); border-color: var(--oa-d-line); color: var(--oa-d-ink); }
html.oa-dark .oa-post-more { color: #9db4ff; }
html.oa-dark .oa-tag--open { background: rgba(34, 197, 94, .15); color: #4ade80; }
html.oa-dark .oa-tag--soon { background: rgba(242, 106, 33, .15); color: #ffad7a; }
html.oa-dark .oa-faq .accordion-button { color: var(--oa-d-ink); background: transparent !important; }
html.oa-dark .oa-faq .accordion-button:not(.collapsed) { color: #9db4ff; }
html.oa-dark .oa-faq .accordion-item { background: transparent !important; }
html.oa-dark .oa-hero-panel h1 .highlight { color: var(--oa-orange-2) !important; background: none !important; -webkit-text-fill-color: currentColor !important; }
html.oa-dark .oa-subnav a { color: var(--oa-d-ink); }
@media (max-width: 991px) { .oa-hero-stripes { display: none; } }