/* Public homepage and account screens. Scoped to avoid changing dashboards. */
.home-refresh, .auth-page { --eco-ink: #16213c; --eco-muted: #627087; --eco-line: #e3e8f1; --eco-accent: #5145cd; }
.eco-wrap { width: min(1248px, calc(100% - 64px)); margin-inline: auto; }
.eco-eyebrow { display: flex; align-items: center; gap: 10px; color: #5145cd; font-size: 11px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.eco-eyebrow::before { content: ''; width: 22px; height: 2px; background: currentColor; flex-shrink: 0; }
.eco-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 50px; padding: 13px 22px; border: 1px solid #5145cd; border-radius: 10px; background: #5145cd; color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; transition: background .2s, transform .2s, box-shadow .2s; }
.eco-button:hover { background: #4035af; color: #fff; transform: translateY(-2px); box-shadow: 0 8px 20px #5145cd20; }
.eco-button svg { width: 18px; height: 18px; }
.eco-button-secondary { background: #fff; border-color: #dce2ee; color: #26324a; }
.eco-button-secondary:hover { background: #f1f0ff; color: #5145cd; border-color: #c8c3ef; }
.home-refresh { background: #fff; margin-top: -80px; }
.eco-launch { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 12px 24px; background: #f2f1fc; border-block: 1px solid #e8e5f8; text-align: center; font-size: 12px; }
.eco-launch strong { color: #4439af; }
.eco-launch span { color: #5d617a; }
.eco-launch .eco-launch-label { border-radius: 5px; padding: 3px 7px; background: #e1ddf8; color: #493cb4; font-size: 9px; font-weight: 800; letter-spacing: .08em; white-space: nowrap; }
.eco-hero { padding: 72px 0 62px; background: linear-gradient(110deg, #fff 48%, #f4f5fc); border-bottom: 1px solid var(--eco-line); }
.eco-hero-grid { display: grid; grid-template-columns: 1.03fr 1fr; align-items: center; gap: 64px; }
.eco-hero h1 { margin: 23px 0; max-width: 640px; font-size: clamp(40px, 4.5vw, 64px); line-height: 1.09; font-weight: 800; letter-spacing: -.055em; color: var(--eco-ink); }
.eco-hero h1 span { color: var(--eco-accent); }
.eco-hero-copy { max-width: 510px; font-size: 17px; line-height: 1.8; color: var(--eco-muted); }
.eco-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 30px 0 28px; }
.eco-hero-note { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 20px; color: #637083; font-size: 11px; }
.eco-hero-note span { display: flex; align-items: center; gap: 6px; color: inherit; }
.eco-hero-note svg { width: 15px; height: 15px; color: #258577; }
.eco-video-trigger { display: inline-flex; align-items: center; gap: 7px; color: #5145cd; font-size: 11px; font-weight: 650; }
.eco-film { width: min(850px, calc(100% - 32px)); border: 1px solid #e3e8f1; border-radius: 15px; padding: 0; background: #fff; }
.eco-film::backdrop { background: #10182acf; }
.eco-film-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; }
.eco-film-header h2 { font-size: 16px; }
.eco-film-header button { font-size: 24px; width: 32px; height: 32px; color: #1e2c46; }
.eco-film iframe { display: block; width: 100%; aspect-ratio: 16 / 9; background: #10182a; }
.eco-showcase { position: relative; padding: 24px; border-radius: 24px; background: #17233e; box-shadow: 0 22px 50px -24px #26355c70; }
.eco-showcase-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 24px; }
.eco-showcase-top span { color: #c6d2e7; font-size: 10px; letter-spacing: .12em; font-weight: 700; text-transform: uppercase; }
.eco-showcase-top .eco-status { display: inline-flex; align-items: center; gap: 6px; color: #a4e5d2; letter-spacing: 0; text-transform: none; }
.eco-status::before { content: ''; height: 6px; width: 6px; border-radius: 50%; background: #57c7ac; }
.eco-showcase-image { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: contain; border-radius: 12px; background: #dfe6ed; }
.eco-showcase-bottom { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 20px; }
.eco-showcase-bottom h2 { color: #fff; font-size: 17px; font-weight: 700; margin: 0 0 5px; letter-spacing: -.02em; }
.eco-showcase-bottom p { margin: 0; color: #a4b6d3; font-size: 11px; }
.eco-showcase-bottom a { display: grid; place-items: center; height: 38px; width: 38px; border-radius: 50%; border: 1px solid #ffffff36; color: #fff; flex-shrink: 0; }
.eco-showcase-bottom a:hover { background: #ffffff15; }
.eco-hero-services { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 58px; padding-top: 25px; border-top: 1px solid var(--eco-line); }
.eco-company { padding: 32px; border: 1px solid #263651; border-radius: 24px; background: #17233e; box-shadow: 0 22px 50px -24px #26355c70; }
.eco-company-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.eco-company-top > span { color: #c7c4ff; font-size: 10px; font-weight: 750; letter-spacing: .13em; }
.eco-company-top .eco-company-location { color: #a7d9cd; font-size: 10px; font-weight: 500; letter-spacing: 0; }
.eco-company > h2 { margin: 27px 0 12px; color: #fff; font-size: clamp(26px, 2.8vw, 37px); line-height: 1.2; font-weight: 700; letter-spacing: -.04em; }
.eco-company > h2 span { color: #b5b0ff; }
.eco-company .eco-company-intro { margin: 0; color: #b5c2d9; font-size: 13px; line-height: 1.7; }
.eco-company-services { display: grid; gap: 12px; margin-top: 26px; }
.eco-company-service { display: flex; align-items: center; gap: 14px; padding: 17px; border: 1px solid #ffffff18; border-radius: 13px; background: #ffffff05; }
.eco-company-icon { display: grid; place-items: center; flex: 0 0 39px; width: 39px; height: 39px; border: 1px solid #ffffff13; border-radius: 10px; background: #ffffff09; color: #c5bfff; }
.eco-company-icon svg { width: 22px; height: 22px; }
.eco-company-service h3 { margin: 0 0 5px; color: #edf1fc; font-size: 13px; line-height: 1.4; font-weight: 650; }
.eco-company-service p { margin: 0; color: #a6b6ce; font-size: 11px; line-height: 1.65; }
.eco-company-process { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin-top: 25px; padding-top: 22px; border-top: 1px solid #ffffff16; }
.eco-company-process span { color: #b7c3da; font-size: 10px; }
.eco-company-process b { color: #6d7c96; font-size: 13px; font-weight: 400; }
.eco-hero-services a { display: flex; align-items: center; gap: 14px; color: #23324c; font-size: 13px; font-weight: 700; }
.eco-hero-services small { display: block; margin-top: 3px; font-size: 11px; font-weight: 400; color: #6c7890; }
.eco-service-number { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: #eeedf9; color: #675cd1; font-size: 11px; flex-shrink: 0; }
.home-refresh > .home-section { padding-block: 70px; }
.home-refresh .home-section h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.2; font-weight: 750; letter-spacing: -.035em; }
.home-refresh .home-section h3 { letter-spacing: -.02em; }
.home-refresh .home-section p { line-height: 1.75; }
.home-refresh .home-metrics { padding-block: 30px; background: #f9fafc; }
.home-refresh .home-platforms { padding-block: 48px; }
.home-refresh .home-platforms h2 { font-size: 24px; }
.home-refresh .home-platforms .mb-12 { margin-bottom: 26px; }
.home-refresh .home-accreditations { padding-block: 28px; background: #f9fafc; }
.home-refresh .home-accreditations h2 { font-size: 12px; letter-spacing: .12em; }
.eco-work { padding: 72px 0; border-block: 1px solid var(--eco-line); background: #f7f8fc; }
.eco-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 30px; }
.eco-section-heading h2 { margin: 12px 0 0; color: var(--eco-ink); font-size: clamp(28px, 3vw, 40px); font-weight: 750; line-height: 1.2; letter-spacing: -.035em; }
.eco-text-link { display: inline-flex; gap: 10px; align-items: center; color: #5145cd; font-size: 13px; font-weight: 700; white-space: nowrap; }
.eco-work-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
.eco-work-card { display: block; border: 1px solid var(--eco-line); border-radius: 16px; background: #fff; overflow: hidden; transition: transform .2s, box-shadow .2s; }
.eco-work-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px #1f2b4a0d; }
.eco-work-card figure { padding: 18px; background: #eceff5; height: 220px; display: flex; align-items: center; justify-content: center; }
.eco-work-card img { width: 100%; height: 100%; object-fit: contain; border-radius: 8px; }
.eco-work-info { padding: 22px; }
.eco-work-info > span { color: #787d90; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.eco-work-info h3 { margin: 10px 0 7px; color: var(--eco-ink); font-size: 19px; }
.eco-work-info p { margin: 0; color: #657087; font-size: 13px; line-height: 1.7; }
.home-refresh #services { background: #f8f9fc; border-block: 1px solid var(--eco-line); }
.home-refresh #services .group { box-shadow: none; border-color: #e0e5ef; border-radius: 16px; }
.home-refresh #services .group:hover { box-shadow: 0 12px 30px #17233e0b; }
.home-refresh .reveal-on-scroll, .home-refresh .reveal-group .reveal-item { opacity: 1; transform: none; }
/* Account shell shared by sign-in, recovery, registration and verification. */
.auth-page { min-height: 100vh; background: #f4f6fa; color: var(--eco-ink); }
.auth-page *, .auth-page *::before, .auth-page *::after { box-sizing: border-box; }
.auth-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; max-width: 1320px; margin: auto; padding: 23px 40px; }
.auth-header img { width: 142px; height: auto; }
.auth-header > a:last-child { color: #677187; font-size: 12px; display: flex; gap: 8px; align-items: center; }
.auth-header svg { width: 15px; height: 15px; }
.auth-main { padding: 12px 32px 36px; }
.auth-shell { display: grid; grid-template-columns: 1fr 1.06fr; max-width: 1100px; margin: auto; border: 1px solid #e0e5ed; border-radius: 22px; background: #fff; box-shadow: 0 16px 55px -30px #27365345; overflow: hidden; }
.auth-story { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 36px; min-width: 0; padding: 46px; background: #17233e; overflow: hidden; }
.auth-story::after { content: ''; position: absolute; width: 350px; height: 350px; border: 1px solid #ffffff09; border-radius: 50%; bottom: -180px; right: -180px; box-shadow: 0 0 0 45px #ffffff03, 0 0 0 90px #ffffff03; pointer-events: none; }
.auth-story .eco-eyebrow { color: #a6a3f2; }
.auth-story h2 { color: #fff; margin: 26px 0 18px; font-size: clamp(30px, 3.4vw, 43px); font-weight: 650; line-height: 1.17; letter-spacing: -.04em; }
.auth-story h2 span { color: #b5b0ff; }
.auth-story p { color: #b7c4d9; font-size: 14px; line-height: 1.8; }
.auth-workspace { border: 1px solid #ffffff1a; border-radius: 14px; padding: 21px; background: #ffffff07; }
.auth-workspace-title { display: flex; align-items: center; justify-content: space-between; padding-bottom: 17px; border-bottom: 1px solid #ffffff14; }
.auth-workspace-title strong { color: #edf1fc; font-size: 12px; font-weight: 600; }
.auth-workspace-title span { color: #9cb0cf; font-size: 10px; }
.auth-workspace-row { display: flex; align-items: center; gap: 12px; margin-top: 18px; }
.auth-workspace-row > span { display: grid; place-items: center; background: #ffffff0b; border: 1px solid #ffffff10; border-radius: 9px; width: 34px; height: 34px; color: #c3bfff; flex-shrink: 0; }
.auth-workspace-row svg { width: 17px; height: 17px; }
.auth-workspace-row strong { display: block; color: #e4eaf5; font-size: 11px; font-weight: 600; }
.auth-workspace-row small { display: block; color: #92a5c2; font-size: 10px; margin-top: 4px; }
.auth-story-foot { display: flex; gap: 10px; align-items: center; color: #a6b6d1; font-size: 11px; position: relative; }
.auth-story-foot svg { width: 19px; height: 19px; color: #9bd6c9; flex-shrink: 0; }
.auth-form-panel { padding: 40px 48px 32px; min-width: 0; }
.auth-form-heading { margin-bottom: 26px; }
.auth-form-heading .auth-kicker { color: #8b91a1; font-size: 10px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.auth-form-heading h1 { margin: 11px 0 9px; color: #18243e; font-size: 29px; line-height: 1.2; letter-spacing: -.035em; font-weight: 750; }
.auth-form-heading > p { color: #737c8e; font-size: 13px; line-height: 1.7; }
.auth-form-area { min-width: 0; }
.auth-form-area :is(.form-input, .custom-input, input[type=email], input[type=password]) { border: 1px solid #dce2ec; background: #fbfcfe; color: #1e2c46; min-height: 48px; border-radius: 9px; box-shadow: 0 1px 2px #15244103; font-size: 14px; transition: border .15s, box-shadow .15s; }
.auth-form-area :is(.form-input, .custom-input):focus { background: #fff; border-color: #776bdb; outline: 0; box-shadow: 0 0 0 3px #5145cd12; }
.auth-form-area input[autocomplete=one-time-code], .auth-form-area input[id*=otp-input] { text-align: center; font-size: 23px; letter-spacing: .35em; }
.auth-form-area label { color: #46536c; font-size: 12px; font-weight: 650; }
.auth-form-area button[type=submit], .auth-form-area .custom-button { min-height: 48px; border-radius: 9px; background: #5145cd; color: #fff; box-shadow: 0 4px 10px #5145cd14; font-size: 13px; }
.auth-form-area button[type=submit]:hover, .auth-form-area .custom-button:hover { background: #4035af; }
.auth-form-area button:disabled { opacity: .55; cursor: not-allowed; }
.auth-form-area .custom-button span, .auth-form-area button[type=submit] span { color: inherit; }
.auth-form-area .captcha { flex-wrap: wrap; }
.auth-form-area .captcha img { max-width: 100%; border-radius: 7px; }
.auth-alternative { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 45px; padding: 11px 14px; border: 1px solid #dce2ec; border-radius: 9px; background: #fff; color: #35435c; font-weight: 600; font-size: 12px; margin-bottom: 12px; }
.auth-alternative:hover { border-color: #b9b0e8; color: #5145cd; background: #faf9ff; }
.auth-alternative svg { width: 18px; height: 18px; flex-shrink: 0; }
.auth-divider { display: flex; align-items: center; gap: 12px; margin: 23px 0; }
.auth-divider::before, .auth-divider::after { content: ''; height: 1px; background: #e9ecf2; flex: 1; }
.auth-divider span { color: #8a92a1; font-size: 11px; white-space: nowrap; }
.auth-create-account { padding-top: 22px; margin-top: 24px; border-top: 1px solid #e9ecf2; text-align: center; font-size: 12px; color: #758095; }
.auth-create-account a { color: #5145cd; font-weight: 700; }
.auth-legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 22px; margin-top: 26px; }
.auth-legal a { color: #778196; font-size: 11px; }
.auth-legal a:hover { color: #5145cd; }
.auth-footer { padding: 0 24px 24px; text-align: center; color: #8690a3; font-size: 10px; }
.auth-page input:-webkit-autofill { -webkit-box-shadow: 0 0 0 50px #fbfcfe inset !important; -webkit-text-fill-color: #1e2c46 !important; }
.auth-page :focus-visible, .home-refresh :focus-visible { outline: 3px solid #9690e2; outline-offset: 3px; }
.auth-field, .auth-btn { transition: border-color .2s, background .2s; }
@media (max-width: 1050px) {
    .eco-hero-grid { gap: 32px; }
    .eco-showcase { padding: 18px; }
    .auth-story { padding: 34px; }
    .auth-form-panel { padding: 34px; }
}
@media (max-width: 767px) {
    .eco-wrap { width: calc(100% - 40px); }
    .eco-launch { padding: 11px 20px; gap: 8px; font-size: 11px; }
    .eco-launch span { text-align: left; }
    .eco-hero { padding: 42px 0 32px; }
    .eco-hero-grid { grid-template-columns: 1fr; gap: 34px; }
    .eco-hero h1 { font-size: clamp(38px, 8vw, 58px); max-width: 580px; }
    .eco-hero-copy { font-size: 15px; }
    .eco-hero-actions { margin-block: 24px; }
    .eco-hero-services { gap: 16px; margin-top: 30px; }
    .eco-hero-services a { flex-direction: column; align-items: start; font-size: 11px; gap: 9px; }
    .eco-hero-services small { font-size: 10px; line-height: 1.5; }
    .eco-showcase { max-width: 540px; width: 100%; margin-inline: auto; }
    .eco-company { padding: 25px; }
    .eco-company-service { padding: 14px; gap: 11px; }
    .eco-showcase-top { margin-bottom: 15px; }
    .eco-work { padding-block: 45px; }
    .eco-section-heading { align-items: start; flex-direction: column; gap: 16px; }
    .eco-work-grid { grid-template-columns: 1fr; }
    .eco-work-card figure { height: 240px; }
    .home-refresh > .home-section { padding-block: 48px; }
    .home-refresh .home-metrics { padding-block: 20px; }
    .auth-header { padding: 20px 24px; }
    .auth-header img { width: 123px; }
    .auth-main { padding: 4px 20px 24px; }
    .auth-shell { display: block; max-width: 520px; border-radius: 16px; }
    .auth-story { display: none; }
    .auth-form-panel { padding: 30px; }
    .auth-form-heading h1 { font-size: 28px; }
}
@media (max-width: 380px) {
    .eco-wrap { width: calc(100% - 32px); }
    .eco-hero h1 { font-size: 37px; }
    .eco-button { width: 100%; }
    .auth-header { padding-inline: 18px; }
    .auth-main { padding-inline: 12px; }
    .auth-form-panel { padding: 25px 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .home-refresh *, .home-refresh *::before, .home-refresh *::after, .auth-page *, .auth-page *::before, .auth-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
