:root {
    --blue: #0878D1;
    --green: #168B38;
    --gold: #F4B51B;
    --navy: #071522;
    --white: #FFFFFF;
    --bg: #f3f2ef;
    --text: #1d2226;
    --muted: #666;
    --radius: 8px;
    --shadow: 0 0 0 1px rgba(0,0,0,.08);
    --transition: 120ms ease;
    --divider: #e0e0e0;
    --hover: #f5f5f5;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: "Segoe UI", "Source Sans 3", system-ui, sans-serif;
    color: var(--text);
    background: var(--bg);
    line-height: 1.5;
}
a { color: var(--blue); text-decoration: none; }
img { max-width: 100%; display: block; }
.container { width: min(1200px, 92%); margin: 0 auto; }

.announcement-bar {
    background: var(--navy);
    color: var(--white);
    text-align: center;
    padding: .55rem 1rem;
    font-size: .9rem;
}
.announcement-bar__link { color: var(--gold); font-weight: 600; }
.announcement-bar__link:hover { color: var(--white); }

.site-header {
    position: sticky;
    top: 0;
    z-index: 200;
    background: rgba(255,255,255,.97);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(7,21,34,.06);
}
.header-inner {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: .75rem 0;
    position: relative;
}
.brand {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    background: transparent;
}
.brand-logo {
    height: 46px;
    width: auto;
    max-width: 150px;
    background: transparent;
    object-fit: contain;
    display: block;
}
.main-nav {
    display: flex;
    align-items: center;
    gap: .15rem;
    flex: 1;
}
.nav-link,
.nav-dropdown-toggle {
    color: var(--navy);
    font-weight: 600;
    font-size: .9rem;
    background: none;
    border: 0;
    cursor: pointer;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .55rem .75rem;
    border-radius: 10px;
    transition: var(--transition);
}
.nav-link:hover,
.nav-dropdown-toggle:hover,
.nav-link.is-active,
.nav-dropdown.is-open > .nav-dropdown-toggle {
    color: var(--blue);
    background: rgba(8,120,209,.06);
}
.nav-dropdown { position: relative; }
.nav-dropdown-menu {
    position: absolute;
    top: calc(100% + .35rem);
    left: 0;
    min-width: 210px;
    background: var(--white);
    border: 1px solid rgba(7,21,34,.08);
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(7,21,34,.12);
    padding: .45rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: var(--transition);
    z-index: 300;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.is-open .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.nav-dropdown-menu a {
    display: block;
    padding: .65rem .85rem;
    border-radius: 10px;
    color: var(--navy);
    font-weight: 600;
    font-size: .88rem;
}
.nav-dropdown-menu a:hover,
.nav-dropdown-menu a.is-active {
    background: rgba(8,120,209,.08);
    color: var(--blue);
}
.header-actions {
    display: flex;
    align-items: center;
    gap: .65rem;
    flex-shrink: 0;
}
.btn-sm { padding: .55rem .95rem; font-size: .85rem; }
.search-form input {
    border: 1px solid #dbe4ec;
    border-radius: 999px;
    padding: .45rem .9rem;
    min-width: 130px;
    font-size: .88rem;
}
.lang-switch a { color: var(--muted); font-weight: 700; font-size: .82rem; }
.lang-switch a.active { color: var(--green); }
.mobile-menu-toggle {
    display: none;
    background: none;
    border: 0;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.mobile-menu-icon,
.mobile-menu-icon::before,
.mobile-menu-icon::after {
    display: block;
    width: 20px;
    height: 2px;
    background: var(--navy);
    border-radius: 2px;
    position: relative;
    transition: var(--transition);
}
.mobile-menu-icon::before,
.mobile-menu-icon::after {
    content: '';
    position: absolute;
    left: 0;
}
.mobile-menu-icon::before { top: -6px; }
.mobile-menu-icon::after { top: 6px; }
.mobile-menu-toggle.is-open .mobile-menu-icon { background: transparent; }
.mobile-menu-toggle.is-open .mobile-menu-icon::before { top: 0; transform: rotate(45deg); }
.mobile-menu-toggle.is-open .mobile-menu-icon::after { top: 0; transform: rotate(-45deg); }

.banner-zone { padding: 0; }
.banner-zone--header { display: none; }
.banner-zone--footer {
    background: var(--bg);
    border-top: 1px solid var(--divider);
    padding: 2.5rem 0;
}
.banner-zone--page { padding: 0 0 1.5rem; }
.banner-zone--grid { padding: 0; }
.banner-zone--grid .banner-zone-inner:empty { display: none; }
.mkt-promo-section:has(.banner-zone-inner:empty) { display: none; }
.banner-zone-head { margin-bottom: 1.25rem; }
.banner-zone-head h2 {
    margin: 0;
    font-size: 1.35rem;
    color: var(--navy);
}
.banner-zone-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: stretch;
}
.banner-zone--grid .banner-zone-inner,
.banner-zone--footer .banner-zone-inner {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.banner-ad {
    flex: 1;
    min-width: 280px;
    display: flex;
    flex-direction: column;
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: var(--transition);
}
.banner-ad:hover { box-shadow: 0 12px 32px rgba(7,21,34,.1); }
.banner-ad--sponsored { border-color: rgba(244,181,27,.4); }
.banner-ad__media { display: block; line-height: 0; }
.banner-ad__media img {
    width: 100%;
    height: 160px;
    object-fit: cover;
}
.banner-ad__body { padding: 1rem 1.15rem 1.15rem; flex: 1; display: flex; flex-direction: column; }
.banner-ad__label {
    display: inline-block;
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #8a6500;
    margin-bottom: .35rem;
}
.banner-ad__title { margin: 0 0 .4rem; font-size: 1.02rem; color: var(--navy); }
.banner-ad__text { margin: 0 0 .75rem; color: var(--muted); font-size: .9rem; flex: 1; }
.portal-promo-card h3 { margin: .25rem 0 .5rem; font-size: .95rem; }
.mkt-join-form input,
.mkt-join-form select {
    width: 100%;
    border: 1px solid var(--divider);
    border-radius: 8px;
    padding: .65rem .85rem;
    font: inherit;
}
.mkt-join-form input:focus,
.mkt-join-form select:focus {
    outline: none;
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(8,120,209,.12);
}
.mkt-page-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 2rem;
    align-items: start;
}
.mkt-page-main { min-width: 0; }
.mkt-page-aside { position: sticky; top: 5.5rem; }
.banner-zone--sidebar .banner-zone-inner {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.banner-zone--sidebar .banner-ad { min-width: 0; }
.banner-zone--sidebar .banner-ad__media img { height: 140px; }
@media (max-width: 1024px) {
    .mkt-page-layout { grid-template-columns: 1fr; }
    .mkt-page-aside { position: static; }
}
.mkt-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 1.5rem;
    align-items: start;
}
.mkt-detail-main { padding: 1.5rem; }
.mkt-detail-aside { position: sticky; top: 5.5rem; }
@media (max-width: 900px) {
    .mkt-detail-layout { grid-template-columns: 1fr; }
    .mkt-detail-aside { position: static; }
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    padding: .7rem 1.2rem;
    border-radius: 999px;
    font-weight: 700;
    border: 2px solid transparent;
    transition: var(--transition);
    cursor: pointer;
}
.btn-primary { background: var(--blue); color: var(--white); }
.btn-primary:hover { background: #0669b8; transform: translateY(-1px); }
.btn-outline { border-color: var(--blue); color: var(--blue); background: transparent; }
.btn-green { background: var(--green); color: var(--white); }
.btn-gold { background: var(--gold); color: var(--navy); }

.hero {
    position: relative;
    min-height: 78vh;
    display: grid;
    align-items: center;
    overflow: hidden;
    color: var(--white);
}
.hero-slide {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 2rem;
    align-items: center;
    padding: 4rem 0;
}
.hero-copy h1 {
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1.1;
    margin: 0 0 1rem;
}
.hero-copy p { font-size: 1.08rem; opacity: .92; max-width: 620px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.5rem; }
.hero-media {
    border-radius: calc(var(--radius) + 6px);
    overflow: hidden;
    box-shadow: var(--shadow);
    min-height: 360px;
}
.hero-media img { width: 100%; height: 100%; object-fit: cover; }
.hero-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--navy) 0%, #0d2840 45%, #0a3558 100%);
    z-index: -2;
}
.hero-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 20% 20%, rgba(8,120,209,.25), transparent 40%);
    z-index: -1;
}

.section { padding: 4rem 0; }
.section-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 1rem;
    margin-bottom: 2rem;
}
.section-head h2 {
    margin: 0;
    font-size: clamp(1.6rem, 3vw, 2.2rem);
    color: var(--navy);
}
.section-head p { margin: .35rem 0 0; color: var(--muted); max-width: 560px; }

.card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.25rem;
}
.card {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
    transition: var(--transition);
    border: 1px solid rgba(7,21,34,.04);
}
.card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(7,21,34,.12); }
.card-image { aspect-ratio: 16/10; overflow: hidden; }
.card-image img { width: 100%; height: 100%; object-fit: cover; transition: var(--transition); }
.card:hover .card-image img { transform: scale(1.04); }
.card-body { padding: 1.2rem; }
.card-body h3 { margin: 0 0 .5rem; color: var(--navy); font-size: 1.08rem; }
.card-meta { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .75rem; }
.badge {
    display: inline-block;
    padding: .2rem .65rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
}
.badge-verified { background: rgba(22,139,56,.12); color: var(--green); }
.badge-featured { background: rgba(244,181,27,.18); color: #8a6500; }
.badge-category { background: rgba(8,120,209,.1); color: var(--blue); }

.quick-discovery {
    margin-top: -2rem;
    position: relative;
    z-index: 2;
}
.quick-panel {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 1.5rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}
.quick-panel a {
    padding: 1rem;
    border-radius: 12px;
    background: var(--bg);
    color: var(--navy);
    font-weight: 700;
    text-align: center;
}
.quick-panel a:hover { background: rgba(8,120,209,.08); color: var(--blue); }

.why-section {
    background: var(--navy);
    color: var(--white);
}
.why-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.25rem;
}
.why-item {
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: var(--radius);
    padding: 1.25rem;
}
.why-item h3 { margin-top: 0; color: var(--gold); }

.cta-section {
    background: linear-gradient(135deg, var(--blue), var(--green));
    color: var(--white);
    text-align: center;
}
.cta-section h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); margin-bottom: .75rem; }

.site-footer {
    background: var(--navy);
    color: rgba(255,255,255,.85);
    padding: 3rem 0 1rem;
}
.footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 2rem;
}
.footer-grid h4 { color: var(--white); margin-top: 0; }
.footer-grid a, .footer-grid p { display: block; color: rgba(255,255,255,.75); margin-bottom: .45rem; }
.footer-logo {
    height: 52px;
    width: auto;
    max-width: 160px;
    margin-bottom: .75rem;
    background: transparent;
    object-fit: contain;
}
.footer-bottom {
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255,255,255,.08);
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.newsletter-form { display: flex; gap: .5rem; flex-wrap: wrap; }
.newsletter-form input {
    flex: 1;
    min-width: 180px;
    border: 0;
    border-radius: 999px;
    padding: .65rem 1rem;
}

.alert { padding: .85rem 0; font-weight: 600; }
.alert-success { color: var(--green); }
.alert-error { color: #c0392b; }

.page-hero {
    background: linear-gradient(135deg, var(--navy), #103454);
    color: var(--white);
    padding: 3rem 0;
}
.page-hero h1 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.6rem); }

.auth-wrap {
    min-height: 70vh;
    display: grid;
    place-items: center;
    padding: 2rem 0;
}
.auth-card {
    width: min(480px, 100%);
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 2rem;
}
.form-group { margin-bottom: 1rem; }
.form-group label { display: block; font-weight: 600; margin-bottom: .35rem; }
.form-group input, .form-group select, .form-group textarea {
    width: 100%;
    border: 1px solid #dbe4ec;
    border-radius: 10px;
    padding: .7rem .85rem;
    font: inherit;
}
.form-error { color: #c0392b; font-size: .85rem; }

.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}
.stat-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 1.25rem;
    box-shadow: var(--shadow);
}
.stat-card strong { font-size: 2rem; color: var(--blue); display: block; }

.filters {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-bottom: 1.5rem;
}
.filters input, .filters select {
    border: 1px solid #dbe4ec;
    border-radius: 10px;
    padding: .6rem .8rem;
}

.empty-state {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--muted);
}

/* Authenticated user area */
.user-shell {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 1.5rem;
    width: min(1200px, 92%);
    margin: 2rem auto 3rem;
    align-items: start;
}
.user-sidebar {
    background: var(--white);
    border-radius: calc(var(--radius) + 4px);
    box-shadow: var(--shadow);
    border: 1px solid rgba(7,21,34,.06);
    padding: 1.25rem;
    position: sticky;
    top: 88px;
}
.user-sidebar-head {
    display: flex;
    gap: .85rem;
    align-items: center;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #eef2f6;
}
.user-sidebar-head strong { display: block; color: var(--navy); }
.user-sidebar-head span { font-size: .82rem; color: var(--muted); word-break: break-all; }
.user-avatar, .user-menu-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(8,120,209,.15);
}
.user-nav { display: grid; gap: .25rem; }
.user-nav a {
    display: block;
    padding: .65rem .85rem;
    border-radius: 10px;
    color: var(--navy);
    font-weight: 600;
    font-size: .92rem;
}
.user-nav a:hover, .user-nav a.is-active {
    background: rgba(8,120,209,.08);
    color: var(--blue);
}
.user-nav-admin { color: var(--green) !important; }
.user-logout { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #eef2f6; }
.user-logout button {
    width: 100%;
    border: 1px solid #dbe4ec;
    background: transparent;
    border-radius: 10px;
    padding: .65rem;
    font-weight: 600;
    cursor: pointer;
    color: var(--muted);
}
.user-main { min-width: 0; }

.page-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.page-head h1 { margin: 0; font-size: clamp(1.6rem, 3vw, 2rem); color: var(--navy); }
.page-subtitle { margin: .35rem 0 0; color: var(--muted); }
.page-actions { flex-shrink: 0; }

.panel-card {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    border: 1px solid rgba(7,21,34,.05);
    padding: 1.25rem;
    margin-bottom: 1rem;
}
.panel-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}
.panel-head h2 { margin: 0; font-size: 1.05rem; color: var(--navy); }
.dashboard-panels {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
}
.stat-label {
    display: block;
    font-size: .82rem;
    color: var(--muted);
    font-weight: 600;
    margin-bottom: .35rem;
}
.stat-card-blue strong { color: var(--blue); }
.stat-card-green strong { color: var(--green); }
.stat-card-gold strong { color: #8a6500; }
.progress-bar {
    height: 6px;
    background: #eef2f6;
    border-radius: 999px;
    margin-top: .65rem;
    overflow: hidden;
}
.progress-bar span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--blue), var(--green));
    border-radius: 999px;
}
.list-stack { display: grid; gap: .5rem; }
.list-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding: .75rem .85rem;
    border-radius: 10px;
    background: var(--bg);
    color: var(--navy);
    font-weight: 600;
}
.list-item:hover { background: rgba(8,120,209,.08); color: var(--blue); }
.list-item small { color: var(--muted); font-weight: 600; }
.list-item-static { cursor: default; }
.status-pill {
    display: inline-block;
    padding: .25rem .65rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    background: rgba(8,120,209,.1);
    color: var(--blue);
}
.status-submitted { background: rgba(8,120,209,.12); color: var(--blue); }
.status-approved, .status-accepted { background: rgba(22,139,56,.12); color: var(--green); }
.status-rejected { background: rgba(192,57,43,.12); color: #c0392b; }
.cta-inline {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 1.5rem;
    padding: 1.25rem 1.5rem;
    border-radius: var(--radius);
    background: linear-gradient(135deg, rgba(8,120,209,.08), rgba(22,139,56,.08));
    border: 1px solid rgba(8,120,209,.12);
}
.cta-inline p { margin: .35rem 0 0; color: var(--muted); }
.empty-panel {
    text-align: center;
    padding: 2.5rem 1.5rem;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}
.form-panel .form-section { margin-bottom: 1.5rem; }
.form-panel .form-section h3 {
    margin: 0 0 1rem;
    font-size: 1rem;
    color: var(--navy);
}
.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}
.form-group-full { grid-column: 1 / -1; }
.application-card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: .75rem;
}
.application-card-head h3 { margin: 0; }
.muted { color: var(--muted); font-size: .9rem; }

.user-menu { position: relative; }
.user-menu-toggle {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    border: 1px solid #dbe4ec;
    background: var(--white);
    border-radius: 999px;
    padding: .35rem .75rem .35rem .35rem;
    cursor: pointer;
    font: inherit;
    font-weight: 600;
    color: var(--navy);
}
.user-menu-toggle span { max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-menu-dropdown {
    position: absolute;
    right: 0;
    top: calc(100% + .5rem);
    min-width: 200px;
    background: var(--white);
    border: 1px solid rgba(7,21,34,.08);
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(7,21,34,.12);
    padding: .45rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: var(--transition);
    z-index: 400;
}
.user-menu.is-open .user-menu-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.user-menu-dropdown a,
.user-menu-dropdown button {
    display: block;
    width: 100%;
    text-align: left;
    padding: .65rem .85rem;
    border-radius: 10px;
    border: 0;
    background: transparent;
    color: var(--navy);
    font-weight: 600;
    cursor: pointer;
    font: inherit;
}
.user-menu-dropdown a:hover,
.user-menu-dropdown button:hover { background: rgba(8,120,209,.08); color: var(--blue); }

.auth-logo {
    display: block;
    height: auto;
    width: min(220px, 100%);
    margin: 0 auto 1rem;
    background: transparent;
    object-fit: contain;
}
.auth-card {
    border: 1px solid rgba(7,21,34,.06);
}
.site-footer .footer-logo {
    height: auto;
    max-width: 180px;
    filter: brightness(1.15);
}

@media (max-width: 960px) {
    .user-shell { grid-template-columns: 1fr; }
    .user-sidebar { position: static; }
    .form-grid { grid-template-columns: 1fr; }
    .user-menu-toggle span { display: none; }
    .page-head { flex-direction: column; }
}

@media (max-width: 1100px) {
    .header-actions .search-form { display: none; }
}

@media (max-width: 960px) {
    .header-actions .btn-outline { display: none; }
    .mobile-menu-toggle { display: inline-flex; margin-left: auto; }

    .main-nav {
        display: none;
        position: absolute;
        top: calc(100% + .5rem);
        left: 4%;
        right: 4%;
        flex-direction: column;
        align-items: stretch;
        background: var(--white);
        padding: .75rem;
        border-radius: 16px;
        box-shadow: 0 20px 50px rgba(7,21,34,.15);
        border: 1px solid rgba(7,21,34,.08);
        max-height: calc(100vh - 90px);
        overflow-y: auto;
        z-index: 250;
    }
    .main-nav.is-open { display: flex; }

    .nav-dropdown { width: 100%; }
    .nav-dropdown-toggle {
        width: 100%;
        justify-content: space-between;
    }
    .nav-dropdown-menu {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border: 0;
        padding: 0 0 .35rem .75rem;
        display: none;
    }
    .nav-dropdown.is-open .nav-dropdown-menu { display: block; }

    .hero-slide { grid-template-columns: 1fr; padding: 2.5rem 0; }
    .hero-media { min-height: 240px; }

    .banner-ad { flex-direction: column; align-items: flex-start; }
    .banner-ad__media { max-width: 100%; width: 100%; }
    .banner-ad__media img { height: 140px; }
}

@media (prefers-reduced-motion: reduce) {
    * { animation: none !important; transition: none !important; }
}

/* ===== Facebook-style UI ===== */
.fb-body { background: var(--bg); }

.fb-header {
    position: sticky;
    top: 0;
    z-index: 500;
    background: var(--white);
    box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
.fb-header-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 16px;
    height: 56px;
}
.fb-header-left {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
}
.fb-logo {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.fb-logo img { width: 40px; height: 40px; }
.fb-logo-text {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--navy);
    letter-spacing: -.02em;
}
.fb-logo-text span { color: var(--blue); }
.fb-search {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--bg);
    border-radius: 20px;
    padding: 0 12px;
    height: 40px;
    flex: 1;
    max-width: 240px;
}
.fb-search svg { color: var(--muted); flex-shrink: 0; width: 16px; height: 16px; }
.fb-search input {
    border: 0;
    background: transparent;
    width: 100%;
    font: inherit;
    font-size: .92rem;
    outline: none;
}
.fb-topnav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex: 2;
}
.fb-topnav-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 112px;
    height: 48px;
    padding: 0 12px;
    border-radius: 8px;
    color: var(--muted);
    font-weight: 600;
    font-size: .85rem;
    border: 0;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
    position: relative;
}
.fb-topnav-item svg { width: 24px; height: 24px; }
.fb-topnav-item span { display: none; }
.fb-topnav-item:hover { background: var(--fb-hover); }
.fb-topnav-item.is-active {
    color: var(--blue);
}
.fb-topnav-item.is-active::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 12px;
    right: 12px;
    height: 3px;
    background: var(--blue);
    border-radius: 2px 2px 0 0;
}
.fb-topnav-more .nav-dropdown-menu { left: auto; right: 0; }
.fb-header-right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    justify-content: flex-end;
}
.fb-lang {
    display: flex;
    gap: 4px;
    background: var(--bg);
    border-radius: 20px;
    padding: 4px 8px;
}
.fb-lang a {
    font-size: .78rem;
    font-weight: 700;
    color: var(--muted);
    padding: 4px 8px;
    border-radius: 12px;
}
.fb-lang a.active { background: var(--white); color: var(--blue); box-shadow: var(--shadow); }
.fb-header-avatar img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}
.fb-icon-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--bg);
    border: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--navy);
}
.fb-icon-btn svg { width: 20px; height: 20px; }
.fb-mobile-toggle { display: none; }

.fb-layout {
    display: grid;
    grid-template-columns: 360px minmax(0, 680px) 300px;
    gap: 24px;
    max-width: 1280px;
    margin: 0 auto;
    padding: 16px;
    align-items: start;
}
.fb-sidebar {
    position: sticky;
    top: 72px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.fb-sidebar-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 8px;
    border-radius: 8px;
    color: var(--navy);
    font-weight: 600;
    font-size: .93rem;
}
.fb-sidebar-item:hover, .fb-sidebar-item.is-active { background: var(--fb-hover); }
.fb-sidebar-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
}
.fb-sidebar-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
}
.fb-sidebar-icon svg { width: 18px; height: 18px; }
.fb-icon-blue { background: var(--blue); }
.fb-icon-green { background: var(--green); }
.fb-icon-gold { background: var(--gold); color: var(--navy); }
.fb-icon-red { background: #e74c3c; }
.fb-icon-purple { background: #8b5cf6; }
.fb-icon-navy { background: #1c2b33; }
.fb-feed { min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.fb-rail {
    position: sticky;
    top: 72px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.fb-card {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 16px;
}
.fb-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}
.fb-card-header h2 { margin: 0; font-size: 1.1rem; color: var(--navy); }
.fb-card-header a { font-size: .88rem; font-weight: 600; }
.fb-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}
.fb-mini-card {
    background: var(--bg);
    border-radius: var(--radius);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.fb-mini-card img, .fb-mini-card-img {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
}
.fb-mini-card-body, .fb-mini-card > div { padding: 12px; }
.fb-mini-card h3 { margin: 0 0 4px; font-size: .95rem; }
.fb-mini-card p { margin: 0 0 8px; font-size: .85rem; color: var(--muted); }
.fb-hero-card { padding: 0; overflow: hidden; }
.fb-hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: center;
}
.fb-hero-content { padding: 24px; }
.fb-hero-content h1 {
    margin: 0 0 8px;
    font-size: clamp(1.4rem, 3vw, 1.8rem);
    line-height: 1.2;
    color: var(--navy);
}
.fb-hero-content p { margin: 0; color: var(--muted); font-size: .95rem; }
.fb-hero-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.fb-hero-image img {
    width: 100%;
    height: 100%;
    min-height: 200px;
    object-fit: cover;
    display: block;
}
.fb-quick-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.fb-quick-chip {
    background: var(--white);
    border-radius: 20px;
    padding: 8px 16px;
    font-weight: 600;
    font-size: .88rem;
    color: var(--navy);
    box-shadow: var(--shadow);
}
.fb-quick-chip:hover { background: var(--fb-hover); }
.fb-why-card .fb-why-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-top: 12px;
}
.fb-why-grid strong { display: block; color: var(--blue); }
.fb-why-grid p { margin: 4px 0 0; font-size: .85rem; color: var(--muted); }
.fb-cta-card { text-align: center; }
.fb-quote {
    margin: 0;
    padding: 12px 0;
    border-bottom: 1px solid var(--fb-divider);
    font-size: .95rem;
}
.fb-quote footer { margin-top: 8px; font-size: .85rem; color: var(--muted); }
.fb-rail-card h3 { margin: 0 0 8px; font-size: 1rem; }
.fb-rail-card p { margin: 0; font-size: .88rem; color: var(--muted); }

.btn {
    border-radius: 6px;
    font-weight: 600;
    padding: 8px 16px;
    font-size: .9rem;
}
.btn-primary { background: var(--blue); color: var(--white); border: 0; }
.btn-primary:hover { background: #166fe5; filter: none; transform: none; }
.btn-secondary, .btn-outline {
    background: var(--fb-hover);
    color: var(--navy);
    border: 0;
}
.btn-secondary:hover, .btn-outline:hover { background: var(--fb-divider); }
.btn-ghost { background: transparent; color: var(--blue); border: 0; }
.btn-sm { padding: 6px 12px; font-size: .82rem; }

.card, .panel-card, .stat-card, .auth-card {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    border: 0;
}
.card:hover { transform: none; box-shadow: 0 2px 4px rgba(0,0,0,.12); }
.page-head h1 { font-size: 1.5rem; margin: 0; }
.page-subtitle { color: var(--muted); margin: 4px 0 0; }
.stat-card { padding: 16px; }
.stat-card strong { font-size: 1.75rem; }

.fb-footer {
    background: var(--white);
    border-top: 1px solid var(--fb-divider);
    padding: 16px;
    margin-top: 24px;
}
.fb-footer-inner { max-width: 1280px; margin: 0 auto; text-align: center; }
.fb-footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 20px;
    margin-bottom: 8px;
}
.fb-footer-links a { color: var(--muted); font-size: .82rem; font-weight: 600; }
.fb-footer-copy { color: var(--muted); font-size: .78rem; margin: 0; }

.fb-alert {
    max-width: 680px;
    margin: 12px auto;
    padding: 12px 16px;
    border-radius: var(--radius);
    font-weight: 600;
    text-align: center;
}
.fb-alert-success { background: #e7f3ff; color: var(--blue); }
.fb-alert-error { background: #fde8e8; color: #c0392b; }

.auth-wrap { min-height: calc(100vh - 120px); padding: 24px 16px; }
.auth-card {
    max-width: 400px;
    margin: 0 auto;
    padding: 24px;
    box-shadow: var(--shadow);
}
.auth-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
}
.auth-mark { width: 48px; height: 48px; }
.auth-brand-text {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--navy);
}
.auth-brand-text span { color: var(--blue); }

.site-header, .site-footer { display: none; }
.page-hero {
    background: var(--white);
    color: var(--navy);
    padding: 16px;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    margin-bottom: 16px;
}
.page-hero h1 { font-size: 1.5rem; }
.section { padding: 0; }

@media (max-width: 1100px) {
    .fb-layout { grid-template-columns: 280px minmax(0, 1fr); }
    .fb-rail { display: none; }
    .fb-topnav-item { min-width: 72px; }
}

@media (max-width: 768px) {
    .fb-layout { grid-template-columns: 1fr; padding: 12px; }
    .fb-sidebar { display: none; }
    .fb-header-row { padding: 0 12px; }
    .fb-search { max-width: 160px; }
    .fb-topnav {
        display: none;
        position: absolute;
        top: 56px;
        left: 0;
        right: 0;
        background: var(--white);
        flex-direction: column;
        padding: 8px;
        box-shadow: 0 4px 12px rgba(0,0,0,.15);
        z-index: 400;
    }
    .fb-topnav.is-open { display: flex; }
    .fb-topnav-item {
        width: 100%;
        min-width: 0;
        justify-content: flex-start;
        height: auto;
        padding: 12px;
    }
    .fb-topnav-item span { display: inline; }
    .fb-topnav-item.is-active::after { display: none; }
    .fb-mobile-toggle { display: inline-flex; }
    .fb-hero { grid-template-columns: 1fr; }
    .fb-why-grid { grid-template-columns: 1fr; }
    .fb-header-right .btn { display: none; }
}

/* ===== MARKETING SITE (before login) ===== */
.mkt-body { background: var(--white); }
.mkt-container { width: min(1180px, 92%); margin: 0 auto; }

.mkt-header {
    position: sticky;
    top: 0;
    z-index: 300;
    background: #fff;
    border-bottom: 1px solid #e6e6e6;
    box-shadow: none;
}
.mkt-header-inner {
    display: flex;
    align-items: center;
    gap: 1rem;
    max-width: 1128px;
    margin: 0 auto;
    padding: 0 24px;
    height: 56px;
}
.mkt-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--navy);
    flex-shrink: 0;
}
.mkt-brand .mkt-accent, .mkt-brand span span { color: var(--green); }
.mkt-nav {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 1;
}
.mkt-nav-link, .mkt-dropdown-btn {
    padding: 16px 10px 14px;
    border-radius: 0;
    font-weight: 600;
    font-size: .9rem;
    color: #191919;
    background: none;
    border: 0;
    cursor: pointer;
    font-family: inherit;
    border-bottom: 2px solid transparent;
}
.mkt-nav-link:hover, .mkt-dropdown-btn:hover {
    background: none;
    color: #191919;
}
.mkt-nav-link.is-active, .mkt-dropdown.is-open > .mkt-dropdown-btn {
    background: none;
    color: #191919;
    box-shadow: none;
    border-bottom-color: #0a66c2;
}
.mkt-dropdown { position: relative; }
.mkt-dropdown-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 200px;
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 6px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: var(--transition);
    z-index: 400;
}
.mkt-dropdown:hover .mkt-dropdown-menu, .mkt-dropdown.is-open .mkt-dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.mkt-dropdown-menu a {
    display: block;
    padding: 10px 12px;
    border-radius: 8px;
    color: var(--navy);
    font-weight: 600;
    font-size: .88rem;
}
.mkt-dropdown-menu a:hover { background: var(--hover); color: var(--blue); }
.mkt-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.mkt-header-actions .btn { white-space: nowrap; flex-shrink: 0; }
.mkt-search input {
    border: 1px solid #d0d0d0;
    border-radius: 4px;
    padding: 6px 12px;
    min-width: 140px;
    font-size: .88rem;
    background: #f3f2ef;
    color: #191919;
}
.mkt-search input::placeholder { color: #666; }
.mkt-search input:focus {
    outline: none;
    border-color: #0a66c2;
    background: #fff;
    box-shadow: none;
}
.mkt-lang {
    display: flex;
    gap: 2px;
    background: transparent;
    border-radius: 0;
    padding: 0;
}
.mkt-lang a {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: .78rem;
    font-weight: 600;
    color: #666;
}
.mkt-lang a.active { background: #eef3f8; color: #0a66c2; box-shadow: none; }
.mkt-header .btn-ghost { color: #191919; border-color: #d0d0d0; }
.mkt-header .btn-ghost:hover { background: #f3f2ef; color: #191919; }
.mkt-mobile-toggle { display: none; }

.mkt-hero {
    position: relative;
    padding: 4rem 0 3rem;
    color: var(--white);
    overflow: hidden;
}
.mkt-hero-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--navy) 0%, #0a3558 50%, var(--blue) 100%);
    z-index: 0;
}
.mkt-hero-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 80% 20%, rgba(244,181,27,.15), transparent 45%);
}
.mkt-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 2.5rem;
    align-items: center;
}
.mkt-hero-badge {
    display: inline-block;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.2);
    padding: 6px 14px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}
.mkt-hero-content h1 {
    font-size: clamp(2rem, 4.5vw, 3.2rem);
    line-height: 1.1;
    margin: 0 0 1rem;
}
.mkt-hero-content p {
    font-size: 1.05rem;
    opacity: .9;
    max-width: 540px;
    margin: 0;
}
.mkt-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.5rem; }
.mkt-hero-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255,255,255,.15);
}
.mkt-hero-stats strong { display: block; font-size: 1rem; }
.mkt-hero-stats span { font-size: .82rem; opacity: .8; }
.mkt-hero-visual img {
    border-radius: calc(var(--radius) + 4px);
    box-shadow: 0 24px 60px rgba(0,0,0,.25);
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
}
.mkt-section { padding: 4rem 0; }
.mkt-section-tight { padding-top: 1.5rem; }
.mkt-section-alt { background: var(--bg); }
.mkt-section-head {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: .5rem;
    margin-bottom: 2rem;
}
.mkt-section-head h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2rem); color: var(--navy); }
.mkt-section-head p { margin: .5rem 0 0; color: var(--muted); max-width: 640px; }
.mkt-center-title { text-align: center; margin: 0 0 2rem; font-size: 1.5rem; color: var(--navy); }
.mkt-pill-row { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.mkt-pill {
    background: var(--white);
    border: 1px solid var(--divider);
    padding: 10px 20px;
    border-radius: 999px;
    font-weight: 700;
    color: var(--navy);
    box-shadow: var(--shadow);
}
.mkt-pill:hover { border-color: var(--blue); color: var(--blue); }
.mkt-features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.25rem;
}
.mkt-feature-card {
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    padding: 1.5rem;
    box-shadow: var(--shadow);
    transition: var(--transition);
}
.mkt-feature-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(7,21,34,.1); }
.mkt-feature-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    margin-bottom: 1rem;
    color: var(--white);
}
.mkt-fi-blue { background: var(--blue); }
.mkt-fi-green { background: var(--green); }
.mkt-fi-gold { background: var(--gold); color: var(--navy); }
.mkt-fi-teal { background: #0d9488; }
.mkt-feature-card h3 { margin: 0 0 .5rem; color: var(--navy); }
.mkt-feature-card p { margin: 0; color: var(--muted); font-size: .92rem; }
.mkt-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.25rem;
}
.mkt-card {
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: var(--transition);
}
.mkt-card:hover { box-shadow: 0 12px 36px rgba(7,21,34,.1); }
.mkt-card-img { width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.mkt-card-body { padding: 1.25rem; }
.mkt-card-body h3 { margin: 0 0 .5rem; font-size: 1.05rem; color: var(--navy); }
.mkt-card-body p { margin: 0 0 .75rem; color: var(--muted); font-size: .9rem; }
.mkt-link { font-weight: 700; font-size: .88rem; }
.mkt-testimonials { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }
.mkt-testimonial {
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    padding: 1.25rem;
    margin: 0;
}
.mkt-testimonial footer { margin-top: .75rem; color: var(--muted); font-size: .85rem; }
.mkt-cta-band {
    background: linear-gradient(135deg, var(--blue), var(--green));
    color: var(--white);
    padding: 3.5rem 0;
}
.mkt-cta-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    flex-wrap: wrap;
}
.mkt-cta-inner h2 { margin: 0 0 .5rem; font-size: clamp(1.5rem, 3vw, 2rem); }
.mkt-cta-inner p { margin: 0; opacity: .9; max-width: 520px; }
.mkt-page-hero {
    background: linear-gradient(135deg, var(--navy), #103454);
    color: var(--white);
    padding: 3rem 0;
}
.mkt-page-hero h1 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.4rem); }
.mkt-page-hero p { margin: .5rem 0 0; opacity: .85; }
.mkt-prose { padding: 1.5rem; line-height: 1.8; }
.mkt-filter-card { padding: 1rem; margin-bottom: 1.5rem; }
.mkt-empty {
    text-align: center;
    padding: 3rem;
    color: var(--muted);
    background: var(--bg);
    border-radius: var(--radius);
}
.mkt-footer {
    background: var(--navy);
    color: rgba(255,255,255,.85);
    padding: 3rem 0 1rem;
    margin-top: 2rem;
}
.mkt-footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 2rem;
}
.mkt-footer h4 { color: var(--white); margin: 0 0 1rem; }
.mkt-footer a, .mkt-footer p { display: block; color: rgba(255,255,255,.75); margin-bottom: .4rem; font-size: .9rem; }
.mkt-footer-logo { max-width: 180px; height: auto; margin-bottom: 1rem; background: transparent; }
.mkt-footer-desc { font-size: .85rem; line-height: 1.5; }
.mkt-newsletter { display: flex; flex-direction: column; gap: 8px; }
.mkt-newsletter input {
    border: 0;
    border-radius: 8px;
    padding: 10px 14px;
}
.mkt-footer-bottom {
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255,255,255,.1);
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: .85rem;
}
.mkt-alert {
    max-width: 1180px;
    margin: 12px auto;
    padding: 12px 16px;
    border-radius: var(--radius);
    font-weight: 600;
    text-align: center;
    width: 92%;
}
.mkt-alert-success { background: #e8f4fd; color: var(--blue); }
.mkt-alert-error { background: #fdecea; color: #c0392b; }
.mkt-auth-wrap {
    min-height: calc(100vh - 200px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 4%;
    background: linear-gradient(180deg, var(--bg) 0%, var(--white) 100%);
}
.mkt-auth-card {
    width: min(420px, 100%);
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: calc(var(--radius) + 4px);
    padding: 2rem;
    box-shadow: var(--shadow);
}
.mkt-auth-card-wide { width: min(560px, 100%); }
.mkt-auth-card h1 { text-align: center; margin: 0 0 .35rem; font-size: 1.5rem; }
.mkt-auth-sub { text-align: center; color: var(--muted); margin: 0 0 1.5rem; font-size: .92rem; }
.mkt-auth-footer { text-align: center; margin-top: 1.25rem; font-size: .9rem; }
.btn-lg { padding: 12px 24px; font-size: 1rem; }
.btn-block { width: 100%; }
.btn-outline-light {
    border: 2px solid rgba(255,255,255,.6);
    color: var(--white);
    background: transparent;
}
.btn-outline-light:hover { background: rgba(255,255,255,.1); }
.btn-gold { background: var(--gold); color: var(--navy); border: 0; }
.btn-gold:hover { background: #e5a60f; }
.btn-ghost { background: transparent; color: var(--blue); border: 0; font-weight: 700; }

/* ===== USER PORTAL (after login) — original design ===== */
.portal-body { background: var(--bg); }
.portal-header {
    position: sticky;
    top: 0;
    z-index: 300;
    background: var(--white);
    border-bottom: 1px solid var(--divider);
    box-shadow: 0 1px 3px rgba(7,21,34,.06);
}
.portal-header-inner {
    display: flex;
    align-items: center;
    gap: 1rem;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 16px;
    height: 56px;
}
.portal-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 800;
    color: var(--navy);
    flex-shrink: 0;
}
.portal-brand span { color: var(--green); }
.portal-search {
    flex: 1;
    max-width: 280px;
}
.portal-search input {
    width: 100%;
    border: 1px solid var(--divider);
    border-radius: 999px;
    padding: 8px 16px;
    background: var(--bg);
    font-size: .88rem;
}
.portal-toplinks {
    display: flex;
    gap: 4px;
}
.portal-toplinks a {
    padding: 8px 14px;
    border-radius: 8px;
    font-weight: 600;
    font-size: .88rem;
    color: var(--muted);
}
.portal-toplinks a:hover, .portal-toplinks a.active {
    background: var(--hover);
    color: var(--blue);
}
.portal-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}
.portal-avatar-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--divider);
    background: var(--white);
    border-radius: 999px;
    padding: 4px 12px 4px 4px;
    cursor: pointer;
    font-weight: 600;
    font-size: .85rem;
    color: var(--navy);
}
.portal-avatar-btn img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}
.portal-shell {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr) 280px;
    gap: 20px;
    max-width: 1280px;
    margin: 0 auto;
    padding: 20px 16px;
    align-items: start;
}
.portal-rail {
    position: sticky;
    top: 76px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.portal-rail h3 { margin: 0 0 8px; font-size: 1rem; color: var(--navy); }
.portal-rail-link {
    display: block;
    padding: 8px 0;
    font-weight: 600;
    font-size: .9rem;
    color: var(--navy);
    border-bottom: 1px solid var(--divider);
}
.portal-rail-link:last-child { border-bottom: 0; }
.portal-rail-link:hover { color: var(--blue); }
.portal-sidebar {
    position: sticky;
    top: 76px;
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    padding: 12px;
    box-shadow: var(--shadow);
}
.portal-sidebar-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    color: var(--navy);
    font-weight: 600;
    font-size: .9rem;
}
.portal-sidebar-item:hover, .portal-sidebar-item.is-active { background: var(--hover); color: var(--blue); }
.portal-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
}
.portal-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .85rem;
    color: var(--white);
    flex-shrink: 0;
}
.portal-icon-blue { background: var(--blue); }
.portal-icon-green { background: var(--green); }
.portal-icon-gold { background: var(--gold); color: var(--navy); }
.portal-icon-teal { background: #0d9488; }
.portal-icon-purple { background: #7c3aed; }
.portal-icon-navy { background: var(--navy); }
.portal-sidebar-admin { color: var(--green); }
.portal-logout {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--divider);
}
.portal-logout button {
    width: 100%;
    border: 1px solid var(--divider);
    background: transparent;
    border-radius: 8px;
    padding: 10px;
    font-weight: 600;
    cursor: pointer;
    color: var(--muted);
}
.portal-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.portal-card, .app-card, .fb-card {
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    padding: 1.25rem;
    box-shadow: var(--shadow);
}
.portal-page-head h1 { margin: 0; font-size: 1.4rem; color: var(--navy); }
.portal-alert {
    max-width: 1280px;
    margin: 12px auto;
    padding: 12px;
    border-radius: var(--radius);
    font-weight: 600;
    text-align: center;
    width: calc(100% - 32px);
}
.portal-alert-success { background: #e8f4fd; color: var(--blue); }
.portal-alert-error { background: #fdecea; color: #c0392b; }

/* Homepage pro + auth split */
.mkt-hero-pro {
    position: relative;
    padding: 3.5rem 0 4rem;
    color: var(--white);
    overflow: hidden;
}
.mkt-hero-pro-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #071522 0%, #0c2d4a 45%, #0878D1 100%);
    z-index: 0;
}
.mkt-hero-pro-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 85% 15%, rgba(244,181,27,.18), transparent 40%);
}
.mkt-hero-pro-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 2.5rem;
    align-items: start;
}
.mkt-hero-logo {
    max-width: 220px;
    height: auto;
    margin-bottom: 1.25rem;
}
.mkt-hero-pro-copy h1 {
    font-size: clamp(2rem, 4.5vw, 3rem);
    line-height: 1.12;
    margin: 0 0 1rem;
}
.mkt-lead { font-size: 1.05rem; opacity: .92; max-width: 560px; margin: 0 0 1.25rem; }
.mkt-hero-list {
    margin: 0 0 1.5rem;
    padding: 0;
    list-style: none;
}
.mkt-hero-list li {
    padding: .35rem 0;
    font-size: .95rem;
    opacity: .9;
}
.mkt-hero-list li::before { content: '✓ '; color: var(--gold); font-weight: 800; }
.mkt-join-card {
    background: var(--white);
    border-radius: calc(var(--radius) + 4px);
    padding: 1.75rem;
    box-shadow: 0 24px 60px rgba(0,0,0,.2);
    color: var(--navy);
}
.mkt-join-card h2 { margin: 0 0 .35rem; font-size: 1.5rem; }
.mkt-join-sub { color: var(--muted); margin: 0 0 1.25rem; font-size: .92rem; }
.mkt-join-form .form-group { margin-bottom: .85rem; }
.mkt-join-footer { text-align: center; margin: 1rem 0 0; font-size: .9rem; }
.mkt-join-note { text-align: center; font-size: .75rem; color: var(--muted); margin: .5rem 0 0; }
.mkt-join-card-welcome p { color: var(--muted); margin-bottom: 1rem; }
.mkt-metrics {
    background: var(--white);
    border-bottom: 1px solid var(--divider);
    padding: 1.25rem 0;
}
.mkt-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    text-align: center;
}
.mkt-metrics-grid strong { display: block; font-size: 1rem; color: var(--blue); }
.mkt-metrics-grid span { font-size: .82rem; color: var(--muted); }
.mkt-section-label {
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--blue);
    margin-bottom: .35rem;
}
.mkt-platform-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.mkt-platform-tile {
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    padding: 1.25rem;
    box-shadow: var(--shadow);
    transition: var(--transition);
    color: var(--navy);
}
.mkt-platform-tile:hover {
    transform: translateY(-3px);
    border-color: var(--blue);
    box-shadow: 0 12px 32px rgba(8,120,209,.12);
}
.mkt-tile-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    color: var(--white);
    margin-bottom: .75rem;
}
.mkt-fi-purple { background: #7c3aed; }
.mkt-fi-navy { background: var(--navy); }
.mkt-platform-tile h3 { margin: 0 0 .35rem; font-size: 1rem; }
.mkt-platform-tile p { margin: 0; font-size: .88rem; color: var(--muted); }
.mkt-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}
.mkt-step {
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    padding: 1.5rem;
    box-shadow: var(--shadow);
}
.mkt-step span {
    display: inline-block;
    font-size: .75rem;
    font-weight: 800;
    color: var(--blue);
    background: rgba(8,120,209,.1);
    padding: 4px 10px;
    border-radius: 999px;
    margin-bottom: .75rem;
}
.mkt-step h3 { margin: 0 0 .5rem; font-size: 1.05rem; }
.mkt-step p { margin: 0; color: var(--muted); font-size: .9rem; }
.mkt-split-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}
.mkt-split-title { margin: 0 0 1rem; font-size: 1.25rem; }
.mkt-list-card {
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    overflow: hidden;
    margin-bottom: .75rem;
}
.mkt-list-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 12px 16px;
    border-bottom: 1px solid var(--divider);
    color: var(--navy);
    font-size: .9rem;
}
.mkt-list-row:last-child { border-bottom: 0; }
.mkt-list-row span { color: var(--muted); font-size: .82rem; flex-shrink: 0; }
.auth-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: calc(100vh - 68px);
}
.auth-split-brand {
    background: linear-gradient(160deg, #071522, #0878D1);
    color: var(--white);
    padding: 3rem 4%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.auth-split-logo { max-width: 200px; margin-bottom: 1.5rem; }
.auth-split-brand h1 { font-size: clamp(1.8rem, 3vw, 2.4rem); margin: 0 0 1rem; }
.auth-split-brand p { opacity: .9; max-width: 420px; margin: 0 0 1.5rem; }
.auth-split-brand ul { margin: 0; padding: 0; list-style: none; }
.auth-split-brand li { padding: .4rem 0; font-size: .95rem; opacity: .9; }
.auth-split-brand li::before { content: '→ '; color: var(--gold); }
.auth-split-form {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 4%;
    background: var(--bg);
}

@media (max-width: 1100px) {
    .portal-shell { grid-template-columns: 240px 1fr; }
    .portal-rail { display: none; }
    .mkt-platform-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 960px) {
    .mkt-nav { display: none; position: absolute; top: 68px; left: 4%; right: 4%; flex-direction: column; background: var(--white); padding: 12px; border-radius: var(--radius); box-shadow: var(--shadow); z-index: 400; }
    .mkt-nav.is-open { display: flex; }
    .mkt-mobile-toggle { display: inline-flex; margin-left: auto; }
    .mkt-header-actions .mkt-search { display: none; }
    .mkt-hero-grid { grid-template-columns: 1fr; }
    .mkt-hero-visual { order: -1; }
    .portal-shell { grid-template-columns: 1fr; }
    .portal-sidebar { position: static; }
    .portal-toplinks { display: none; }
    .portal-search { max-width: 140px; }
    .portal-avatar-btn span { display: none; }
    .mkt-hero-pro-grid { grid-template-columns: 1fr; }
    .mkt-metrics-grid { grid-template-columns: repeat(2, 1fr); }
    .mkt-platform-grid { grid-template-columns: 1fr; }
    .mkt-steps { grid-template-columns: 1fr; }
    .mkt-split-columns { grid-template-columns: 1fr; }
    .auth-split { grid-template-columns: 1fr; }
    .auth-split-brand { padding: 2rem 4%; }
}

/* ===== HOMEPAGE PRO REDESIGN ===== */
.mkt-brand-logo,
.mkt-footer-logo,
.auth-welcome__logo {
    background: transparent !important;
}
.mkt-brand-logo { height: 56px; width: auto; object-fit: contain; }
.mkt-brand-logo--light { display: none; }

.mkt-body-home .mkt-header {
    position: sticky;
    top: 0;
    background: #fff;
    border-bottom: 1px solid #e6e6e6;
    box-shadow: none;
}
.mkt-body-home .mkt-header.is-scrolled {
    position: sticky;
    background: #fff;
    border-bottom-color: #e6e6e6;
    box-shadow: none;
}
.mkt-body-home .mkt-brand-logo--dark { display: block; }
.mkt-body-home .mkt-brand-logo--light { display: none; }
.mkt-body-home .mkt-header.is-scrolled .mkt-brand-logo--dark { display: block; }
.mkt-body-home .mkt-header.is-scrolled .mkt-brand-logo--light { display: none; }
.mkt-body-home .mkt-nav-link,
.mkt-body-home .mkt-dropdown-btn { color: #191919; }
.mkt-body-home .mkt-header.is-scrolled .mkt-nav-link,
.mkt-body-home .mkt-header.is-scrolled .mkt-dropdown-btn { color: #191919; }
.mkt-body-home .mkt-nav-link:hover,
.mkt-body-home .mkt-nav-link.is-active,
.mkt-body-home .mkt-dropdown-btn:hover { background: none; color: #191919; }
.mkt-body-home .mkt-header.is-scrolled .mkt-nav-link:hover,
.mkt-body-home .mkt-header.is-scrolled .mkt-nav-link.is-active,
.mkt-body-home .mkt-header.is-scrolled .mkt-dropdown-btn:hover { background: none; color: #191919; }
.mkt-body-home .mkt-search input {
    background: #f3f2ef;
    border-color: #d0d0d0;
    color: #191919;
}
.mkt-body-home .mkt-search input::placeholder { color: #666; }
.mkt-body-home .mkt-header.is-scrolled .mkt-search input {
    background: #f3f2ef;
    border-color: #d0d0d0;
    color: #191919;
}
.mkt-body-home .mkt-lang { background: transparent; }
.mkt-body-home .mkt-lang a { color: #666; }
.mkt-body-home .mkt-header.is-scrolled .mkt-lang a.active,
.mkt-body-home .mkt-lang a.active { background: #eef3f8; color: #0a66c2; }
.mkt-body-home .mkt-header .btn-ghost,
.mkt-body-home .mkt-header.is-scrolled .btn-ghost { color: #191919; border-color: #d0d0d0; }
.mkt-body-home .mkt-search input::placeholder { color: rgba(255,255,255,.65); }
.mkt-body-home .mkt-header.is-scrolled .mkt-search input {
    background: var(--bg);
    border-color: var(--divider);
    color: var(--text);
}
.mkt-body-home .mkt-header.is-scrolled .mkt-search input::placeholder { color: var(--muted); }
.mkt-body-home .mkt-lang { background: rgba(255,255,255,.12); }
.mkt-body-home .mkt-lang a { color: rgba(255,255,255,.8); }
.mkt-body-home .mkt-lang a.active { background: rgba(255,255,255,.2); color: #fff; }
.mkt-body-home .mkt-header.is-scrolled .mkt-lang { background: var(--bg); }
.mkt-body-home .mkt-header.is-scrolled .mkt-lang a { color: var(--muted); }
.mkt-body-home .mkt-header.is-scrolled .mkt-lang a.active { background: var(--white); color: var(--blue); }
.mkt-body-home .btn-ghost { color: #fff; border-color: rgba(255,255,255,.35); }
.mkt-body-home .mkt-header.is-scrolled .btn-ghost { color: var(--navy); border-color: var(--divider); }
.mkt-body-home .mobile-menu-icon,
.mkt-body-home .mobile-menu-icon::before,
.mkt-body-home .mobile-menu-icon::after { background: #fff; }
.mkt-body-home .mkt-header.is-scrolled .mobile-menu-icon,
.mkt-body-home .mkt-header.is-scrolled .mobile-menu-icon::before,
.mkt-body-home .mkt-header.is-scrolled .mobile-menu-icon::after { background: var(--navy); }

.home-hero {
    position: relative;
    min-height: 100dvh;
    height: 100dvh;
    max-height: 100dvh;
    display: flex;
    align-items: center;
    color: #fff;
    overflow: hidden;
    padding: 5.5rem 0 1.25rem;
    width: 100%;
    margin: 0;
    box-sizing: border-box;
}
.home-hero__slides {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.home-hero__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1.1s ease;
}
.home-hero__slide.is-active { opacity: 1; z-index: 1; }
.home-hero__picture,
.home-hero__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.home-hero__slide.is-active .home-hero__img {
    animation: heroKenBurns 14s ease forwards;
}
@keyframes heroKenBurns {
    from { transform: scale(1.06); }
    to { transform: scale(1); }
}
.home-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(105deg, rgba(7,21,34,.88) 0%, rgba(7,21,34,.72) 42%, rgba(8,120,209,.35) 100%);
}
.home-hero__grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 2.5rem;
    align-items: start;
}
.home-hero__eyebrow {
    display: inline-block;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: .85rem;
}
.home-hero__text {
    display: none;
}
.home-hero__text.is-active {
    display: block;
    animation: heroTextIn .55s ease;
}
@keyframes heroTextIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
.home-hero__text h1 {
    font-size: clamp(2rem, 4.8vw, 3.35rem);
    line-height: 1.1;
    margin: 0 0 1rem;
    max-width: 640px;
}
.home-hero__lead {
    font-size: 1.05rem;
    opacity: .92;
    max-width: 560px;
    margin: 0 0 1.35rem;
    line-height: 1.65;
}
.home-hero__cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-bottom: 1.75rem; }
.home-hero__search { margin-bottom: 1.5rem; }
.home-hero__search-inner {
    display: flex;
    align-items: center;
    gap: .75rem;
    background: rgba(255,255,255,.97);
    border-radius: 999px;
    padding: .45rem .45rem .45rem 1.15rem;
    box-shadow: 0 16px 48px rgba(0,0,0,.18);
    color: var(--muted);
}
.home-hero__search-inner input {
    flex: 1;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: .95rem;
    color: var(--navy);
    min-width: 0;
    outline: none;
}
.home-hero__search-inner .btn { border-radius: 999px; padding: .7rem 1.35rem; }
.home-hero__tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-top: .75rem;
    font-size: .82rem;
    opacity: .85;
}
.home-hero__tags a {
    color: #fff;
    background: rgba(255,255,255,.12);
    padding: .25rem .65rem;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.18);
    transition: var(--transition);
}
.home-hero__tags a:hover { background: rgba(255,255,255,.22); color: #fff; }
.home-hero__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
}
.home-hero__stat {
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.15);
    backdrop-filter: blur(8px);
    border-radius: 14px;
    padding: .85rem 1.1rem;
    min-width: 120px;
}
.home-hero__stat strong { display: block; font-size: 1.15rem; color: var(--gold); }
.home-hero__stat span { font-size: .78rem; opacity: .85; }
.home-hero__aside { position: relative; }
.home-join-card {
    background: rgba(255,255,255,.98);
    border-radius: calc(var(--radius) + 6px);
    padding: 1.65rem;
    box-shadow: 0 28px 70px rgba(0,0,0,.22);
    color: var(--navy);
    animation: floatCard 6s ease-in-out infinite;
}
@keyframes floatCard {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}
.home-join-card__head h2 { margin: 0 0 .35rem; font-size: 1.45rem; }
.home-join-card__head p { margin: 0 0 1rem; color: var(--muted); font-size: .9rem; }
.home-join-card--welcome h2 { margin: 0 0 .5rem; font-size: 1.35rem; }
.home-join-card--welcome p { color: var(--muted); margin-bottom: 1rem; }
.home-join-card__secondary { margin-top: .5rem; }
.home-hero__nav {
    position: relative;
    bottom: auto;
    left: auto;
    transform: none;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .75rem;
    margin: 1rem auto 0;
}
.home-hero__arrow {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.35);
    background: rgba(255,255,255,.1);
    color: #fff;
    cursor: pointer;
    font-size: 1.4rem;
    line-height: 1;
    transition: var(--transition);
}
.home-hero__arrow:hover { background: rgba(255,255,255,.22); }
.home-hero__dots { display: flex; gap: .45rem; }
.home-hero__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 0;
    background: rgba(255,255,255,.35);
    cursor: pointer;
    padding: 0;
    transition: var(--transition);
}
.home-hero__dot.is-active { background: var(--gold); transform: scale(1.15); }

.mkt-metrics--pro {
    background: var(--white);
    border-bottom: 1px solid var(--divider);
    padding: 1.75rem 0;
    margin-top: -1px;
}
.mkt-metric-card {
    display: flex;
    align-items: center;
    gap: .85rem;
    text-align: left;
    padding: .5rem;
}
.mkt-metric-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}
.mkt-metric-icon--blue { background: rgba(8,120,209,.12); }
.mkt-metric-icon--green { background: rgba(22,139,56,.12); }
.mkt-metric-icon--gold { background: rgba(244,181,27,.18); }
.mkt-metric-icon--teal { background: rgba(8,120,209,.08); }
.mkt-metric-card strong { display: block; font-size: .95rem; color: var(--navy); }
.mkt-metric-card span { font-size: .8rem; color: var(--muted); }

.home-partners {
    background: var(--bg);
    border-bottom: 1px solid var(--divider);
    padding: 1.25rem 0;
    overflow: hidden;
}
.home-partners__label {
    text-align: center;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted);
    margin: 0 0 .75rem;
}
.home-partners__track { overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.home-partners__marquee {
    display: flex;
    gap: 2.5rem;
    width: max-content;
    animation: partnerMarquee 28s linear infinite;
}
@keyframes partnerMarquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
.home-partners__item {
    font-weight: 700;
    color: var(--navy);
    opacity: .55;
    white-space: nowrap;
    font-size: .95rem;
}

.banner-carousel { position: relative; }
.banner-carousel__track { position: relative; min-height: 220px; }
.banner-carousel__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transform: translateX(24px);
    transition: opacity .55s ease, transform .55s ease;
    pointer-events: none;
}
.banner-carousel__slide.is-active {
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
    position: relative;
}
.banner-carousel__card {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 0;
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: calc(var(--radius) + 4px);
    overflow: hidden;
    box-shadow: var(--shadow);
}
.banner-carousel__media img { width: 100%; height: 220px; object-fit: cover; }
.banner-carousel__body { padding: 1.5rem 1.75rem; display: flex; flex-direction: column; justify-content: center; }
.banner-carousel__body h3 { margin: .25rem 0 .5rem; color: var(--navy); }
.banner-carousel__body p { margin: 0 0 1rem; color: var(--muted); }
.banner-carousel__dots { display: flex; justify-content: center; gap: .5rem; margin-top: 1rem; }
.banner-carousel__dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    border: 0;
    background: var(--divider);
    cursor: pointer;
    padding: 0;
    transition: var(--transition);
}
.banner-carousel__dot.is-active { background: var(--blue); transform: scale(1.2); }

.auth-welcome {
    position: relative;
    min-height: calc(100vh - 68px);
    display: flex;
    align-items: center;
    overflow: hidden;
    padding: 2rem 0;
}
.auth-welcome__bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #071522 0%, #0c3d6b 50%, #0878D1 100%);
    z-index: 0;
}
.auth-welcome__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: .45;
    animation: orbFloat 10s ease-in-out infinite;
}
.auth-welcome__orb--1 { width: 320px; height: 320px; background: #0878D1; top: -80px; left: -60px; }
.auth-welcome__orb--2 { width: 280px; height: 280px; background: #168B38; bottom: -60px; right: 10%; animation-delay: -3s; }
.auth-welcome__orb--3 { width: 200px; height: 200px; background: #F4B51B; top: 40%; right: -40px; animation-delay: -6s; }
@keyframes orbFloat {
    0%, 100% { transform: translate(0, 0); }
    50% { transform: translate(12px, -18px); }
}
.auth-welcome__grid {
    position: relative;
    z-index: 1;
    width: min(1100px, 92%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: center;
}
.auth-welcome__logo { max-width: 200px; height: auto; margin-bottom: 1.25rem; background: transparent; }
.auth-welcome__brand { color: #fff; }
.auth-welcome__brand h1 { font-size: clamp(1.8rem, 3vw, 2.5rem); margin: 0 0 1rem; }
.auth-welcome__brand p { opacity: .9; max-width: 420px; margin: 0 0 1.5rem; line-height: 1.65; }
.auth-welcome__list { margin: 0; padding: 0; list-style: none; }
.auth-welcome__list li {
    padding: .45rem 0;
    font-size: .95rem;
    opacity: .9;
    padding-left: 1.25rem;
    position: relative;
}
.auth-welcome__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: .85rem;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--gold);
}
.auth-welcome__form-wrap { display: flex; justify-content: center; }

[data-reveal].is-visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

@media (max-width: 960px) {
    .home-hero { min-height: 100dvh; height: auto; max-height: none; padding: 5.5rem 1rem 2rem; }
    .home-hero--full { min-height: 100dvh; height: auto; max-height: none; padding: 5.5rem 1rem 2rem; }
    .home-hero__grid { grid-template-columns: 1fr; }
    .home-join-card { animation: none; }
    .home-join-card__form { display: none; }
    .home-join-card__mobile-cta { display: block; }
    .home-join-card__mobile-cta p { color: var(--muted); font-size: .9rem; margin: 0 0 1rem; }
    .home-join-card__mobile-cta .btn-outline { margin-top: .5rem; }
    .home-hero__search-inner { flex-wrap: wrap; border-radius: 16px; padding: .65rem; }
    .home-hero__search-inner input { width: 100%; padding: .35rem .25rem; }
    .home-hero__search-inner .btn { width: 100%; margin-top: .25rem; }
    .home-hero__stats { gap: .65rem; }
    .home-hero__stat { min-width: calc(50% - .35rem); flex: 1; }
    .home-hero__cta .btn { width: 100%; justify-content: center; }
    .home-hero__nav { bottom: 1rem; }
    .banner-carousel__card { grid-template-columns: 1fr; }
    .auth-welcome__grid { grid-template-columns: 1fr; gap: 2rem; }
    .auth-welcome__brand { text-align: center; }
    .auth-welcome__brand p { margin-left: auto; margin-right: auto; }
    .auth-welcome__list { max-width: 420px; margin: 0 auto; text-align: left; }
    .auth-welcome__logo { margin-left: auto; margin-right: auto; }
    .mkt-body-home .mkt-nav.is-open {
        background: var(--white);
        border: 1px solid var(--divider);
    }
    .mkt-body-home .mkt-nav.is-open .mkt-nav-link,
    .mkt-body-home .mkt-nav.is-open .mkt-dropdown-btn { color: var(--navy); }
}

.home-join-card__mobile-cta { display: none; }

@media (min-width: 961px) {
    .home-join-card__form { display: block; }
}

@media (max-width: 640px) {
    .mkt-container { width: min(1180px, 94%); }
    .mkt-header-inner { padding: 0.55rem 3%; height: auto; min-height: 60px; }
    .mkt-brand-logo { height: 46px; }
    .mkt-metrics-grid { grid-template-columns: 1fr 1fr; gap: .75rem; }
    .mkt-metric-card { flex-direction: column; text-align: center; }
    .mkt-section-head { flex-direction: column; align-items: center !important; gap: 1rem; }
    .mkt-footer-grid { grid-template-columns: 1fr; gap: 1.5rem; }
    .mkt-footer-bottom { flex-direction: column; gap: .75rem; text-align: center; }
    .mkt-cta-inner { flex-direction: column; text-align: center; }
    .auth-welcome { min-height: auto; padding: 1.5rem 0 2rem; }
    .mkt-auth-card { width: 100%; padding: 1.25rem; }
    .form-grid { grid-template-columns: 1fr !important; }
}

.mkt-body { overflow-x: hidden; }
html { -webkit-text-size-adjust: 100%; }
img, video, svg { max-width: 100%; height: auto; }
input, select, textarea, button { max-width: 100%; }

/* Homepage hero — edge-to-edge, single background, rotating text */
.mkt-body-home main {
    margin: 0;
    padding: 0;
}

.home-hero--full {
    width: 100%;
    max-width: 100%;
    margin: 0;
    min-height: 100dvh;
    height: 100dvh;
    max-height: 100dvh;
    padding: 5.5rem clamp(1.25rem, 4vw, 3rem) 1.25rem;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.home-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
}

.home-hero__bg .home-hero__picture {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
}

.home-hero__bg .home-hero__img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover;
    object-position: center center;
    display: block;
    animation: heroKenBurns 18s ease-in-out infinite alternate;
}

.home-hero--full .home-hero__overlay {
    background: linear-gradient(
        105deg,
        rgba(7, 21, 34, 0.92) 0%,
        rgba(7, 21, 34, 0.78) 38%,
        rgba(7, 21, 34, 0.55) 62%,
        rgba(8, 120, 209, 0.28) 100%
    );
}

.home-hero--full .home-hero__content {
    position: relative;
    z-index: 2;
    width: min(1180px, 100%);
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
}

.home-hero__text-slides {
    position: relative;
    min-height: 0;
    margin-bottom: 0.35rem;
}

.home-hero__text {
    display: none !important;
    position: static;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
}

.home-hero__text.is-active {
    display: block !important;
    position: relative;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
    animation: heroTextIn .45s ease;
}

.home-hero__text h1 {
    max-width: none;
    text-wrap: balance;
    font-size: clamp(2.25rem, 5.5vw, 3.85rem);
}

.home-hero__lead {
    max-width: 680px;
    text-align: left;
    font-size: clamp(1rem, 1.8vw, 1.15rem);
}

.home-hero__search {
    width: 100%;
    max-width: 720px;
}

.home-hero__fallback {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #071522 0%, #0878D1 100%);
}

/* Social feed */
.social-post { margin-bottom: 1rem; padding: 1.15rem 1.25rem; }
.social-post__head { display: flex; align-items: center; gap: .75rem; margin-bottom: .75rem; }
.social-post__head strong { display: block; font-size: .95rem; }
.social-post__time { font-size: .78rem; color: var(--muted); }
.social-post__msg { margin-left: auto; }
.social-post__body { margin: 0 0 .85rem; line-height: 1.6; white-space: pre-wrap; }
.social-post__topic { margin-bottom: .5rem; }
.social-post__actions { display: flex; gap: .75rem; border-top: 1px solid var(--divider); padding-top: .75rem; }
.social-action {
    background: none; border: 0; cursor: pointer; font: inherit;
    color: var(--muted); font-size: .88rem; font-weight: 600; padding: .25rem .5rem;
    border-radius: 8px; text-decoration: none; display: inline-flex; align-items: center; gap: .25rem;
}
.social-action:hover, .social-action.is-active { color: var(--blue); background: rgba(8,120,209,.08); }
.social-like-form { display: inline; margin: 0; }
.social-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.social-avatar-sm { width: 32px; height: 32px; }
.social-compose { margin-bottom: 1rem; padding: 1rem 1.15rem; }
.social-compose__head { display: flex; gap: .75rem; align-items: flex-start; }
.social-compose__head textarea, .social-compose__fields textarea { width: 100%; min-height: 80px; }
.social-compose__fields { flex: 1; display: flex; flex-direction: column; gap: .5rem; }
.social-compose__fields input { width: 100%; border: 1px solid var(--divider); border-radius: 8px; padding: .55rem .75rem; }
.social-compose__actions { margin-top: .75rem; text-align: right; }
.social-comments { margin-top: .85rem; padding-top: .85rem; border-top: 1px solid var(--divider); }
.social-comment { display: flex; gap: .65rem; margin-bottom: .65rem; }
.social-comment p { margin: .15rem 0 0; font-size: .9rem; }
.social-inbox-item { display: flex; align-items: center; gap: .85rem; margin-bottom: .65rem; color: inherit; text-decoration: none; }
.social-inbox-item:hover { border-color: var(--blue); }
.social-inbox-item__body { flex: 1; min-width: 0; }
.social-inbox-item__body p { margin: .15rem 0 0; color: var(--muted); font-size: .85rem; }
.social-chat { padding: 0; overflow: hidden; }
.social-chat__thread { max-height: 420px; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .65rem; }
.social-chat__bubble {
    max-width: 78%; padding: .65rem .85rem; border-radius: 14px;
    background: var(--bg); align-self: flex-start;
}
.social-chat__bubble.is-mine { align-self: flex-end; background: rgba(8,120,209,.12); }
.social-chat__bubble p { margin: .25rem 0 0; }
.social-chat__bubble span { font-size: .72rem; color: var(--muted); }
.social-chat__composer { display: flex; gap: .5rem; padding: .75rem; border-top: 1px solid var(--divider); }
.social-chat__composer input { flex: 1; border: 1px solid var(--divider); border-radius: 999px; padding: .55rem 1rem; }

/* Admin CMS helpers */
.admin-help { color: var(--muted); margin: 0 0 1rem; font-size: .92rem; }
.admin-form-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 1100px) { .admin-form-grid { grid-template-columns: 1fr 1fr; } }
.admin-form-grid .card:last-child { grid-column: 1 / -1; }
.btn-link { background: none; border: 0; color: var(--blue); cursor: pointer; font: inherit; padding: 0; }
.btn-link.danger { color: #c0392b; }

/* Social dashboard */
.social-dash-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .75rem;
    margin-bottom: 1rem;
}
.social-dash-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1rem .75rem;
    text-decoration: none;
    color: inherit;
    transition: var(--transition);
}
.social-dash-stat:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.social-dash-stat__icon { font-size: 1.35rem; margin-bottom: .35rem; }
.social-dash-stat strong { font-size: 1.25rem; color: var(--navy); display: block; }
.social-dash-stat span { font-size: .78rem; color: var(--muted); }

.portal-bottom-nav {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 400;
    background: rgba(255,255,255,.98);
    border-top: 1px solid var(--divider);
    box-shadow: 0 -4px 20px rgba(7,21,34,.08);
    padding: .35rem .25rem calc(.35rem + env(safe-area-inset-bottom));
    justify-content: space-around;
}
.portal-bottom-nav a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .15rem;
    padding: .35rem .5rem;
    color: var(--muted);
    font-size: .68rem;
    font-weight: 600;
    text-decoration: none;
    min-width: 56px;
}
.portal-bottom-nav a span { font-size: 1.15rem; line-height: 1; }
.portal-bottom-nav a.is-active { color: var(--blue); }

.home-hero--full .home-hero__text h1 {
    max-width: none;
    font-size: clamp(1.7rem, 3.8vw, 2.7rem);
}

@media (max-width: 960px) {
    .social-dash-stats { grid-template-columns: repeat(2, 1fr); }
    .portal-bottom-nav { display: flex; }
    .portal-body { padding-bottom: 72px; }
    .portal-toplinks a { font-size: 1.1rem; padding: .35rem .5rem; min-width: 36px; text-align: center; }
}

/* Friends & communities */
.friend-grid, .group-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
}
.friend-card, .group-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    text-align: left;
    gap: .35rem;
    padding: 0 0 1rem;
    overflow: hidden;
}
.friend-card__cover {
    height: 72px;
    background: linear-gradient(120deg, #0a66c2 0%, #004182 55%, #071522 100%);
}
.friend-card__photo { display: block; margin: -40px 16px 0; }
.friend-card__photo img,
.friend-card .social-avatar {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #fff;
    box-shadow: 0 0 0 1px rgba(0,0,0,.08);
}
.friend-card__name {
    font-weight: 750;
    color: inherit;
    text-decoration: none;
    padding: 0 16px;
    font-size: 1.05rem;
}
.friend-card .muted,
.friend-card__reason {
    padding: 0 16px;
    display: block;
}
.friend-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    justify-content: flex-start;
    padding: 0 16px;
}
.friend-card .btn,
.friend-card .friend-action,
.friend-card form {
    margin-left: 16px;
    margin-right: 16px;
}
.friend-card .friend-action {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: .35rem;
}
.group-card {
    align-items: center;
    text-align: center;
    padding: 1.15rem;
}
.friend-card__chips span {
    font-size: .72rem;
    padding: .15rem .45rem;
    border-radius: 999px;
    background: rgba(15, 76, 129, .08);
    color: var(--navy);
}
.xiga-skill-chips--hero {
    margin: .45rem 0 .2rem;
}
.friend-card__actions, .social-post__actions-head {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    justify-content: flex-start;
    padding: 0 16px;
}
.social-tabs {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}
.social-tab {
    padding: .55rem 1rem;
    border-radius: 999px;
    background: var(--white);
    border: 1px solid var(--divider);
    font-weight: 600;
    font-size: .88rem;
    color: var(--navy);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}
.social-tab.is-active { background: var(--blue); color: #fff; border-color: var(--blue); }
.social-badge {
    background: #e74c3c;
    color: #fff;
    font-size: .7rem;
    padding: .1rem .4rem;
    border-radius: 999px;
    min-width: 18px;
    text-align: center;
}
.social-count { color: var(--muted); font-size: .85rem; margin-left: auto; }
.social-section-title { font-size: 1.05rem; color: var(--navy); margin: 0 0 .75rem; }
.group-card__icon { font-size: 2rem; }
.inline-form { display: inline; margin: 0; }
.friend-action { display: inline-flex; gap: .25rem; flex-wrap: wrap; }

.social-home-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 1rem;
    align-items: start;
}
.social-home-rail { position: sticky; top: 88px; }
.social-home-profile {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: .35rem;
    margin-bottom: .75rem;
    padding: 1rem;
}
@media (max-width: 1100px) {
    .social-home-layout { grid-template-columns: 1fr; }
    .social-home-rail { position: static; display: none; }
}

/* ===== APP SHELL (logged-in — separate from marketing site) ===== */
.app-body {
    background: #e8edf2;
    min-height: 100vh;
}
.app-shell {
    display: flex;
    min-height: 100vh;
}
.app-sidebar {
    width: 252px;
    flex-shrink: 0;
    background: linear-gradient(180deg, #071522 0%, #0c2d4a 100%);
    color: rgba(255, 255, 255, .92);
    display: flex;
    flex-direction: column;
    padding: 1.15rem .85rem;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 500;
    overflow-y: auto;
    border-right: 1px solid rgba(255, 255, 255, .06);
}
.app-sidebar-brand {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .35rem .5rem .85rem;
    margin-bottom: .5rem;
    font-weight: 800;
    font-size: 1.05rem;
    color: #fff;
    text-decoration: none;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.app-sidebar-brand span span { color: var(--green); }
.app-nav { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.app-nav-label {
    margin: .85rem .5rem .35rem;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .45);
}
.app-nav-label:first-child { margin-top: 0; }
.app-nav-item {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .6rem .75rem;
    border-radius: 10px;
    color: rgba(255, 255, 255, .88);
    font-weight: 600;
    font-size: .9rem;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.app-nav-item:hover,
.app-nav-item.is-active {
    background: rgba(8, 120, 209, .22);
    color: #fff;
}
.app-nav-icon {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .95rem;
    flex-shrink: 0;
}
.app-nav-admin { margin-top: .5rem; color: var(--green); }
.app-sidebar-logout {
    margin-top: .75rem;
    padding-top: .75rem;
    border-top: 1px solid rgba(255, 255, 255, .1);
}
.app-sidebar-logout button {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, .15);
    background: transparent;
    border-radius: 10px;
    padding: .6rem;
    font-weight: 600;
    cursor: pointer;
    color: rgba(255, 255, 255, .75);
}
.app-sidebar-logout button:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.app-main-column {
    flex: 1;
    min-width: 0;
    margin-left: 252px;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
.app-topbar {
    position: sticky;
    top: 0;
    z-index: 400;
    background: rgba(255, 255, 255, .97);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--divider);
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: 0 1.25rem;
    height: 58px;
}
.app-menu-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 8px;
    border: 1px solid var(--divider);
    border-radius: 10px;
    background: var(--white);
    cursor: pointer;
    flex-shrink: 0;
}
.app-menu-toggle span {
    display: block;
    height: 2px;
    background: var(--navy);
    border-radius: 2px;
    transition: transform .2s ease, opacity .2s ease;
}
.app-search {
    flex: 1;
    max-width: 420px;
    display: flex;
    align-items: center;
    gap: .5rem;
    background: var(--bg);
    border: 1px solid var(--divider);
    border-radius: 999px;
    padding: .45rem .85rem;
    color: var(--muted);
}
.app-search input {
    flex: 1;
    border: 0;
    background: transparent;
    font-size: .9rem;
    min-width: 0;
}
.app-search input:focus { outline: none; }
.app-topbar-actions {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin-left: auto;
}
.app-lang {
    display: flex;
    gap: 2px;
    background: var(--bg);
    border-radius: 999px;
    padding: 2px;
    border: 1px solid var(--divider);
}
.app-lang a {
    padding: .25rem .55rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    color: var(--muted);
}
.app-lang a.is-active { background: var(--white); color: var(--blue); box-shadow: 0 1px 3px rgba(7, 21, 34, .08); }
.app-user-btn {
    display: flex;
    align-items: center;
    gap: .5rem;
    border: 1px solid var(--divider);
    background: var(--white);
    border-radius: 999px;
    padding: .25rem .75rem .25rem .25rem;
    cursor: pointer;
    font-weight: 600;
    font-size: .85rem;
    color: var(--navy);
}
.app-user-btn img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}
.app-user-name { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-flash {
    margin: .75rem 1.25rem 0;
    padding: .65rem 1rem;
    border-radius: var(--radius);
    font-weight: 600;
    font-size: .9rem;
}
.app-flash--success { background: #e8f4fd; color: var(--blue); border: 1px solid rgba(8, 120, 209, .2); }
.app-flash--error { background: #fdecea; color: #c0392b; border: 1px solid rgba(192, 57, 43, .15); }
.app-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
    padding: 1.25rem;
    align-items: start;
    flex: 1;
}
.app-content:has(.app-rail) {
    grid-template-columns: minmax(0, 1fr) 300px;
}
.app-main { min-width: 0; }
.app-rail {
    position: sticky;
    top: 74px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.app-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}
.app-page-head h1 { margin: 0; font-size: 1.45rem; color: var(--navy); }
.app-page-head p { margin: .35rem 0 0; color: var(--muted); font-size: .92rem; }
.app-page-actions { flex-shrink: 0; }
.app-feed-header { margin-bottom: 1rem; }
.app-feed-welcome {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.app-feed-welcome h1 { margin: 0; font-size: 1.35rem; color: var(--navy); }
.app-feed-welcome p { margin: .25rem 0 0; color: var(--muted); font-size: .9rem; }
.app-stat-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .75rem;
    margin-bottom: 1rem;
}
.app-stat {
    background: var(--white);
    border: 1px solid var(--divider);
    border-radius: var(--radius);
    padding: .85rem;
    text-align: center;
    text-decoration: none;
    transition: transform .15s ease, box-shadow .15s ease;
}
.app-stat:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.app-stat strong { display: block; font-size: 1.2rem; color: var(--navy); }
.app-stat span { font-size: .75rem; color: var(--muted); }
.app-feed { display: flex; flex-direction: column; gap: 0; }
.app-rail-card h3 { margin: 0 0 .65rem; font-size: .95rem; color: var(--navy); }
.app-rail-link {
    display: block;
    padding: .45rem 0;
    font-weight: 600;
    font-size: .88rem;
    color: var(--navy);
    border-bottom: 1px solid var(--divider);
    text-decoration: none;
}
.app-rail-link:last-child { border-bottom: 0; }
.app-rail-link:hover { color: var(--blue); }
.app-rail-link--more { color: var(--blue); font-size: .82rem; }
.app-filter-card { padding: 1rem; margin-bottom: 1rem; }
.app-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 1.25rem;
    align-items: start;
}
.app-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
}
.app-sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(7, 21, 34, .45);
    z-index: 450;
}
.app-mobile-nav {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 500;
    background: rgba(255, 255, 255, .98);
    border-top: 1px solid var(--divider);
    box-shadow: 0 -4px 20px rgba(7, 21, 34, .08);
    padding: .35rem .25rem calc(.35rem + env(safe-area-inset-bottom));
    justify-content: space-around;
}
.app-mobile-nav a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .15rem;
    padding: .35rem .5rem;
    color: var(--muted);
    font-size: .68rem;
    font-weight: 600;
    text-decoration: none;
    min-width: 52px;
}
.app-mobile-nav a span { font-size: 1.1rem; line-height: 1; }
.app-mobile-nav a.is-active { color: var(--blue); }

@media (max-width: 1100px) {
    .app-content:has(.app-rail) { grid-template-columns: 1fr; }
    .app-rail { position: static; }
    .app-stat-row { grid-template-columns: repeat(2, 1fr); }
    .app-detail-layout { grid-template-columns: 1fr; }
}

@media (max-width: 960px) {
    .app-menu-toggle { display: flex; }
    .app-sidebar {
        transform: translateX(-105%);
        transition: transform .25s ease;
    }
    .app-body.app-sidebar-open .app-sidebar { transform: translateX(0); }
    .app-body.app-sidebar-open .app-sidebar-backdrop { display: block; }
    .app-main-column { margin-left: 0; }
    .app-mobile-nav { display: flex; }
    .app-body { padding-bottom: 72px; }
    .app-user-name { display: none; }
    .app-search { max-width: none; }
}

/* ===== FACEBOOK-STYLE APP (overrides) ===== */
.app-body { background: #f0f2f5; }

.fb-topbar {
    position: sticky; top: 0; z-index: 500;
    display: flex; align-items: center; justify-content: space-between;
    gap: .5rem; padding: 0 16px; height: 56px;
    background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
.fb-topbar-left { display: flex; align-items: center; gap: .5rem; flex: 1; min-width: 0; }
.fb-logo { display: flex; align-items: center; gap: .4rem; font-weight: 800; font-size: 1.1rem; color: var(--navy); text-decoration: none; flex-shrink: 0; }
.fb-logo span span { color: var(--green); }
.fb-search { display: flex; align-items: center; gap: .5rem; background: #f0f2f5; border-radius: 999px; padding: .45rem .85rem; flex: 1; max-width: 240px; color: var(--muted); }
.fb-search input { border: 0; background: transparent; font-size: .9rem; width: 100%; min-width: 0; }
.fb-search input:focus { outline: none; }
.fb-topnav { display: flex; align-items: center; justify-content: center; gap: 4px; flex: 1; }
.fb-topnav-item { display: flex; align-items: center; justify-content: center; width: 112px; height: 48px; border-radius: 8px; color: var(--muted); text-decoration: none; position: relative; }
.fb-topnav-item svg { width: 24px; height: 24px; }
.fb-topnav-label { display: none; }
.fb-topnav-item:hover { background: #f0f2f5; }
.fb-topnav-item.is-active { color: var(--blue); }
.fb-topnav-item.is-active::after { content: ''; position: absolute; bottom: -4px; left: 8px; right: 8px; height: 3px; background: var(--blue); border-radius: 3px 3px 0 0; }
.fb-topbar-right { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.fb-lang { display: flex; gap: 2px; background: #f0f2f5; border-radius: 999px; padding: 2px; }
.fb-lang a { padding: .25rem .5rem; border-radius: 999px; font-size: .7rem; font-weight: 700; color: var(--muted); }
.fb-lang a.is-active { background: #fff; color: var(--blue); }
.fb-profile-btn { width: 40px; height: 40px; border-radius: 50%; border: 0; padding: 0; cursor: pointer; background: #e4e6eb; }
.fb-profile-btn img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.fb-menu-btn { display: none; flex-direction: column; justify-content: center; gap: 5px; width: 40px; height: 40px; padding: 8px; border: 0; border-radius: 50%; background: #e4e6eb; cursor: pointer; flex-shrink: 0; }
.fb-menu-btn span { display: block; height: 2px; background: var(--navy); border-radius: 2px; }

.fb-layout { display: grid; grid-template-columns: 360px minmax(0,680px) 360px; gap: 24px; max-width: 1312px; margin: 0 auto; padding: 16px 16px 24px; align-items: start; justify-content: center; }
.fb-left-rail { position: sticky; top: 72px; }
.fb-center, .fb-main { min-width: 0; }
.fb-right-rail { position: sticky; top: 72px; display: flex; flex-direction: column; gap: 12px; }

.fb-shortcuts { display: flex; flex-direction: column; gap: 2px; }
.fb-shortcut { display: flex; align-items: center; gap: .75rem; padding: .55rem .65rem; border-radius: 8px; color: var(--navy); font-weight: 600; font-size: .92rem; text-decoration: none; }
.fb-shortcut:hover, .fb-shortcut.is-active { background: #e4e6eb; }
.fb-shortcut-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.fb-shortcut-icon { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; }
.fb-shortcut-icon--friends { background: #e7f3ff; }
.fb-shortcut-icon--groups { background: #e8f5e9; }
.fb-shortcut-icon--jobs { background: #fff3e0; }
.fb-shortcut-icon--events { background: #f3e5f5; }
.fb-shortcut-icon--services { background: #e0f7fa; }
.fb-shortcut-icon--apps { background: #fce4ec; }
.fb-shortcut-icon--ideas { background: #fff8e1; }
.fb-shortcut-icon--admin { background: #e8eaf6; }

.fb-card, .app-card, .portal-card { background: #fff; border: 0; border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.1); margin-bottom: 12px; padding: 12px 16px; }
.fb-stories { display: flex; gap: 10px; overflow-x: auto; padding: 12px 16px; scrollbar-width: none; }
.fb-stories::-webkit-scrollbar { display: none; }
.fb-story { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 72px; text-decoration: none; color: var(--navy); }
.fb-story-ring { width: 64px; height: 64px; border-radius: 50%; padding: 3px; background: linear-gradient(135deg, var(--blue), var(--green)); display: flex; align-items: center; justify-content: center; }
.fb-story-ring img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 3px solid #fff; }
.fb-story-ring--blue { background: #e7f3ff; }
.fb-story-ring--green { background: #e8f5e9; }
.fb-story-ring--gold { background: #fff8e1; }
.fb-story-icon { font-size: 1.5rem; }
.fb-story-label { font-size: .72rem; font-weight: 600; text-align: center; max-width: 72px; line-height: 1.2; }

.fb-compose-top { display: flex; align-items: center; gap: .75rem; }
.fb-compose-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.fb-compose-trigger { flex: 1; border: 0; background: #f0f2f5; border-radius: 999px; padding: .65rem 1rem; font-size: .92rem; color: var(--muted); text-align: left; cursor: pointer; }
.fb-compose-trigger:hover { background: #e4e6eb; }
.fb-compose-fields { margin-top: .75rem; display: flex; flex-direction: column; gap: .5rem; }
.fb-compose-fields input, .fb-compose-fields textarea { width: 100%; border: 1px solid #e4e6eb; border-radius: 8px; padding: .6rem .75rem; }
.fb-compose-fields textarea { min-height: 100px; resize: vertical; }
.fb-compose-submit { text-align: right; }
.fb-compose-divider { height: 1px; background: #e4e6eb; margin: 8px 0; }
.fb-compose-actions { display: flex; gap: 4px; flex-wrap: wrap; }
.fb-compose-action { flex: 1; display: flex; align-items: center; justify-content: center; gap: .4rem; padding: .5rem; border: 0; border-radius: 8px; background: transparent; font-weight: 600; font-size: .82rem; color: var(--muted); cursor: pointer; text-decoration: none; }
.fb-compose-action:hover { background: #f0f2f5; }

.fb-post { padding: 0; overflow: hidden; }
.fb-post-head { display: flex; align-items: center; gap: .75rem; padding: 12px 16px 8px; }
.fb-post-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.fb-post-meta { flex: 1; }
.fb-post-meta strong { display: block; font-size: .95rem; }
.fb-post-meta span { font-size: .78rem; color: var(--muted); }
.fb-post-head-actions { display: flex; align-items: center; gap: .35rem; }
.fb-post-msg-btn { width: 32px; height: 32px; border-radius: 50%; background: #e4e6eb; display: flex; align-items: center; justify-content: center; text-decoration: none; }
.fb-post-badge { display: inline-block; margin: 0 16px 8px; padding: .2rem .55rem; background: #f0f2f5; border-radius: 999px; font-size: .78rem; font-weight: 600; color: var(--blue); text-decoration: none; }
.fb-post-title { margin: 0 16px 8px; font-size: 1rem; }
.fb-post-body { padding: 0 16px 12px; line-height: 1.55; white-space: pre-wrap; }
.fb-post-stats { display: flex; justify-content: space-between; padding: 8px 16px; font-size: .82rem; color: var(--muted); border-bottom: 1px solid #e4e6eb; }
.fb-post-actions { display: flex; padding: 4px 8px; }
.fb-post-action, .fb-post-action-form button { flex: 1; display: flex; align-items: center; justify-content: center; gap: .4rem; padding: .55rem; border: 0; border-radius: 6px; background: transparent; font-weight: 600; font-size: .85rem; color: var(--muted); cursor: pointer; text-decoration: none; }
.fb-post-action:hover, .fb-post-action-form button:hover { background: #f0f2f5; }
.fb-post-action.is-active, .fb-post-action-form button.is-active { color: var(--blue); }
.fb-post-action-form { flex: 1; margin: 0; }
.fb-post-comments { padding: 8px 16px 12px; border-top: 1px solid #e4e6eb; background: #f7f8fa; }
.fb-comment { display: flex; gap: .5rem; margin-bottom: .5rem; }
.fb-comment-avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }
.fb-comment-bubble { background: #e4e6eb; border-radius: 18px; padding: .45rem .75rem; }
.fb-comment-bubble strong { font-size: .82rem; display: block; }
.fb-comment-bubble p { margin: .15rem 0 0; font-size: .88rem; }

.fb-rail-card h3 { margin: 0 0 10px; font-size: .95rem; }
.fb-rail-link { display: flex; align-items: center; gap: .5rem; padding: .45rem 0; font-weight: 600; font-size: .88rem; color: var(--navy); text-decoration: none; border-bottom: 1px solid #f0f2f5; }
.fb-rail-link:last-child { border-bottom: 0; }
.fb-rail-link:hover { color: var(--blue); }
.fb-rail-link--more { color: var(--blue); font-size: .82rem; }
.fb-rail-link-icon { width: 24px; text-align: center; }
.fb-profile-widget-head { display: flex; align-items: center; gap: .75rem; text-decoration: none; color: inherit; margin-bottom: .75rem; }
.fb-profile-widget-head img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.fb-profile-widget-head strong { display: block; }
.fb-profile-widget-head span { font-size: .82rem; color: var(--muted); }
.fb-profile-stats { display: flex; gap: .5rem; flex-wrap: wrap; }
.fb-profile-stats a { flex: 1; min-width: 80px; text-align: center; padding: .5rem; background: #f0f2f5; border-radius: 8px; font-size: .78rem; color: var(--muted); text-decoration: none; }
.fb-profile-stats strong { display: block; font-size: 1.1rem; color: var(--navy); }

.fb-empty { text-align: center; padding: 2rem 1rem; }
.fb-flash { max-width: 680px; margin: 12px auto 0; padding: .65rem 1rem; border-radius: 8px; font-weight: 600; font-size: .88rem; text-align: center; }
.fb-flash--success { background: #e7f3ff; color: var(--blue); }
.fb-flash--error { background: #fdecea; color: #c0392b; }
.app-body.app-sidebar-open .app-sidebar-backdrop { display: block; }

.app-mobile-nav { background: #fff; border-top: 1px solid #e4e6eb; }
.app-mobile-nav a svg { width: 24px; height: 24px; }

@media (max-width: 1100px) {
    .fb-layout { grid-template-columns: 280px minmax(0,680px); }
    .fb-right-rail { display: none; }
    .fb-topnav-item { width: 72px; }
}
@media (max-width: 960px) {
    .fb-menu-btn { display: flex; }
    .fb-topnav { display: none; }
    .fb-search { max-width: none; }
    .fb-layout { grid-template-columns: 1fr; padding: 12px 12px 80px; }
    .fb-left-rail { position: fixed; top: 0; left: 0; bottom: 0; width: 280px; z-index: 480; background: #fff; padding: 16px 12px; transform: translateX(-105%); transition: transform .25s ease; box-shadow: 4px 0 24px rgba(0,0,0,.15); overflow-y: auto; }
    .app-body.app-sidebar-open .fb-left-rail { transform: translateX(0); }
    .app-mobile-nav { display: flex; }
}
@media (max-width: 480px) {
    .fb-logo span { display: none; }
    .fb-search { display: none; }
}

/* ===== XIGAPATH PLATFORM (logged-in — 2 columns, professional) ===== */
.app-body {
    background: #f3f2ef;
    min-height: 100vh;
    font-family: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
}

.xiga-header {
    position: fixed; top: 0; left: 0; right: 0; z-index: 500;
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
}
.xiga-header-inner {
    display: flex; align-items: center; justify-content: space-between;
    gap: .75rem; max-width: 1280px; margin: 0 auto;
    padding: 0 16px; height: 52px;
}
.xiga-header-start, .xiga-header-end { display: flex; align-items: center; gap: .65rem; }
.xiga-header-start { flex: 1; min-width: 0; }
.xiga-header-end { flex-shrink: 0; }
.xiga-brand {
    display: flex; align-items: center; gap: .45rem;
    font-weight: 700; font-size: 1.05rem; color: #1b1f23; text-decoration: none; flex-shrink: 0;
}
.xiga-brand span span { color: var(--blue); }
.xiga-search {
    display: flex; align-items: center; gap: .5rem; flex: 1; max-width: 280px;
    background: #eef3f8; border: 1px solid #d0d7de; border-radius: 4px;
    padding: .35rem .7rem; color: #666;
}
.xiga-search input { border: 0; background: transparent; color: #1b1f23; font-size: .88rem; width: 100%; min-width: 0; }
.xiga-search input::placeholder { color: #888; }
.xiga-search input:focus { outline: none; }

.xiga-topnav { display: flex; align-items: center; justify-content: center; gap: 2px; flex: 1; }
.xiga-topnav-link {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 14px 12px 12px;
    color: #444; text-decoration: none; font-size: .84rem; font-weight: 600;
    border-bottom: 2px solid transparent;
}
.xiga-topnav-link:hover { color: var(--blue); }
.xiga-topnav-link.is-active { color: var(--blue); border-bottom-color: var(--blue); }

.xiga-topnav-icon, .xiga-nav-icon, .xiga-mnav-icon, .xiga-quick-action-icon { display: none; }

/* Professional line icons */
.xiga-ico {
    width: 18px; height: 18px; display: inline-block; flex-shrink: 0;
    background: currentColor;
    -webkit-mask-size: contain; mask-size: contain;
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    -webkit-mask-position: center; mask-position: center;
    opacity: .9;
}
.xiga-ico-lg { width: 28px; height: 28px; margin-bottom: .5rem; color: var(--blue); }
.xiga-ico--home { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M3 10.5 12 3l9 7.5V21a1 1 0 0 1-1 1h-5v-7H9v7H4a1 1 0 0 1-1-1v-10.5Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M3 10.5 12 3l9 7.5V21a1 1 0 0 1-1 1h-5v-7H9v7H4a1 1 0 0 1-1-1v-10.5Z'/%3E%3C/svg%3E"); }
.xiga-ico--jobs { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='7' width='18' height='13' rx='2'/%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='7' width='18' height='13' rx='2'/%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E"); }
.xiga-ico--map { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M9 3 3 5v16l6-2 6 2 6-2V3l-6 2-6-2Z'/%3E%3Cpath d='M9 3v16M15 5v16'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M9 3 3 5v16l6-2 6 2 6-2V3l-6 2-6-2Z'/%3E%3Cpath d='M9 3v16M15 5v16'/%3E%3C/svg%3E"); }
.xiga-ico--pin { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 21s7-5.2 7-11a7 7 0 1 0-14 0c0 5.8 7 11 7 11Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 21s7-5.2 7-11a7 7 0 1 0-14 0c0 5.8 7 11 7 11Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); }
.xiga-ico--biz { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M3 21h18M5 21V8l7-4 7 4v13M9 21v-6h6v6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M3 21h18M5 21V8l7-4 7 4v13M9 21v-6h6v6'/%3E%3C/svg%3E"); }
.xiga-ico--msg { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4 5h16a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H8l-4 3V6a1 1 0 0 1 1-1Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4 5h16a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H8l-4 3V6a1 1 0 0 1 1-1Z'/%3E%3C/svg%3E"); }
.xiga-ico--people { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Ccircle cx='17' cy='9' r='2.5'/%3E%3Cpath d='M2 19c0-3 3-5 7-5s7 2 7 5M14 14c2.5.2 5 1.5 5 5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Ccircle cx='17' cy='9' r='2.5'/%3E%3Cpath d='M2 19c0-3 3-5 7-5s7 2 7 5M14 14c2.5.2 5 1.5 5 5'/%3E%3C/svg%3E"); }
.xiga-ico--talent { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20c1.5-3.5 4-5 7-5s5.5 1.5 7 5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20c1.5-3.5 4-5 7-5s5.5 1.5 7 5'/%3E%3C/svg%3E"); }
.xiga-ico--service { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M14.7 6.3a4 4 0 0 1 0 5.7L12 14.7 9.3 12a4 4 0 1 1 5.4-5.7Z'/%3E%3Cpath d='m12 14.7-7 7M16 8l2-2'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M14.7 6.3a4 4 0 0 1 0 5.7L12 14.7 9.3 12a4 4 0 1 1 5.4-5.7Z'/%3E%3Cpath d='m12 14.7-7 7M16 8l2-2'/%3E%3C/svg%3E"); }
.xiga-ico--team { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='8' cy='8' r='2.5'/%3E%3Ccircle cx='16' cy='8' r='2.5'/%3E%3Ccircle cx='12' cy='15' r='2.5'/%3E%3Cpath d='M4 19c.5-2 2-3.5 4-3.5M20 19c-.5-2-2-3.5-4-3.5M9 12.5c1-.6 2-.6 3 0'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='8' cy='8' r='2.5'/%3E%3Ccircle cx='16' cy='8' r='2.5'/%3E%3Ccircle cx='12' cy='15' r='2.5'/%3E%3Cpath d='M4 19c.5-2 2-3.5 4-3.5M20 19c-.5-2-2-3.5-4-3.5M9 12.5c1-.6 2-.6 3 0'/%3E%3C/svg%3E"); }
.xiga-ico--brief { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M8 3h8v3H8zM6 6h12v15H6z'/%3E%3Cpath d='M9 11h6M9 15h4'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M8 3h8v3H8zM6 6h12v15H6z'/%3E%3Cpath d='M9 11h6M9 15h4'/%3E%3C/svg%3E"); }
.xiga-ico--learn { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4 5.5 12 3l8 2.5v8.2c0 3.4-3.2 6.2-8 7.8-4.8-1.6-8-4.4-8-7.8V5.5Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4 5.5 12 3l8 2.5v8.2c0 3.4-3.2 6.2-8 7.8-4.8-1.6-8-4.4-8-7.8V5.5Z'/%3E%3C/svg%3E"); }
.xiga-ico--apps { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01'/%3E%3C/svg%3E"); }
.xiga-ico--groups { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E"); }
.xiga-ico--profile { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20c1.5-3.5 4-5 7-5s5.5 1.5 7 5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20c1.5-3.5 4-5 7-5s5.5 1.5 7 5'/%3E%3C/svg%3E"); }
.xiga-ico--shield { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 3 5 6v6c0 4.5 3.2 7.5 7 9 3.8-1.5 7-4.5 7-9V6l-7-3Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 3 5 6v6c0 4.5 3.2 7.5 7 9 3.8-1.5 7-4.5 7-9V6l-7-3Z'/%3E%3C/svg%3E"); }
.xiga-ico--admin { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M4.9 4.9l2.1 2.1M17 17l2.1 2.1M2 12h3M19 12h3M4.9 19.1 7 17M17 7l2.1-2.1'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M4.9 4.9l2.1 2.1M17 17l2.1 2.1M2 12h3M19 12h3M4.9 19.1 7 17M17 7l2.1-2.1'/%3E%3C/svg%3E"); }
.xiga-ico--gmaps { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 21s6-4.8 6-10a6 6 0 1 0-12 0c0 5.2 6 10 6 10Z'/%3E%3Ccircle cx='12' cy='11' r='2'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 21s6-4.8 6-10a6 6 0 1 0-12 0c0 5.2 6 10 6 10Z'/%3E%3Ccircle cx='12' cy='11' r='2'/%3E%3C/svg%3E"); }
.xiga-ico--all { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12h8M12 8v8'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12h8M12 8v8'/%3E%3C/svg%3E"); }

.xiga-map-modes { display: flex; flex-wrap: wrap; gap: .45rem; }
.xiga-mode-chip {
    display: inline-flex; align-items: center; gap: 6px;
    border: 1px solid #d0d7de; background: #fff; color: #1b1f23;
    border-radius: 999px; padding: .4rem .75rem; font-size: .8rem; font-weight: 600; text-decoration: none;
}
.xiga-mode-chip:hover { border-color: var(--blue); color: var(--blue); }
.xiga-mode-chip.is-on { background: #071522; border-color: #071522; color: #fff; }
.xiga-mode-chip--cta { border-color: var(--green); color: #0f7a3d; }
.xiga-map-place-top { display: flex; align-items: flex-start; gap: .55rem; }
.xiga-place-ico {
    width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
    background: #eef6fc; border: 2px solid #0878D1;
}
.xiga-place-ico--biz, .xiga-place-ico--business { background: #eef8f1; border-color: #168B38; }
.xiga-place-ico--cooperative { background: #fff8e8; border-color: #F4B51B; }
.xiga-place-ico--entrepreneur { background: #eef3f8; border-color: #0c3d66; }
.xiga-place-ico--organization { background: #f4f4f4; border-color: #5f7387; }
.xiga-place-ico--talent { background: #eef6fc; border-color: #0878D1; }
.xiga-biz-map-form .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.xiga-biz-map-form .form-group-full { grid-column: 1 / -1; }
.xiga-home-links a { display: inline-flex; align-items: center; gap: 6px; }
.app-mobile-nav a { gap: 4px; }
.app-mobile-nav .xiga-ico { width: 20px; height: 20px; }
.xiga-action-icon, .xiga-compose-action-icon {
    width: 16px; height: 16px; display: inline-block; flex-shrink: 0;
    border: 1.5px solid currentColor; border-radius: 3px;
}
.xiga-action-icon--like { border-radius: 50%; }
.xiga-action-icon--comment { border-radius: 2px 2px 2px 0; }
.xiga-action-icon--share { transform: rotate(-45deg); width: 10px; height: 10px; border-left: 0; border-bottom: 0; }

.xiga-notif-btn {
    position: relative;
    width: 36px; height: 36px; border-radius: 4px;
    display: flex; align-items: center; justify-content: center;
    background: transparent; color: #444; text-decoration: none;
}
.xiga-notif-btn:hover { background: #f4f4f4; color: var(--blue); }
.xiga-notif-count {
    position: absolute; top: 2px; right: 2px;
    min-width: 16px; height: 16px; border-radius: 999px;
    background: #c0372a; color: #fff; font-size: .65rem; font-weight: 700;
    display: flex; align-items: center; justify-content: center; padding: 0 4px;
}
.xiga-service-form .form-grid { margin-bottom: .85rem; }
.xiga-lang a { padding: .2rem .45rem; border-radius: 4px; font-size: .75rem; font-weight: 600; color: #555; }
.xiga-lang a.is-active { background: #eef3f8; color: var(--navy); }
.xiga-avatar-btn { width: 36px; height: 36px; border: 1px solid #d0d7de; border-radius: 50%; padding: 0; cursor: pointer; background: #fff; }
.xiga-avatar-btn img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.xiga-menu-btn {
    display: none; flex-direction: column; justify-content: center; gap: 4px;
    width: 36px; height: 36px; padding: 8px; border: 1px solid #d0d7de;
    border-radius: 4px; background: #fff; cursor: pointer;
}
.xiga-menu-btn span { display: block; height: 2px; background: #333; border-radius: 1px; }

.xiga-home-links {
    display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px;
}
.xiga-home-links a {
    background: #fff; border: 1px solid #d0d7de; border-radius: 4px;
    padding: .4rem .75rem; color: #1b1f23; font-size: .88rem; font-weight: 600; text-decoration: none;
}
.xiga-home-links a:hover { border-color: var(--blue); color: var(--blue); }
.xiga-msme-steps { margin: 0; padding-left: 1.2rem; }
.xiga-msme-steps li { margin: .45rem 0; }
.xiga-verify-banner { margin-bottom: 14px; }

.app-body { padding-top: 52px; }
.xiga-layout {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 16px 24px 48px 24px;
    box-sizing: border-box;
}
.xiga-layout--wide { padding-left: 24px; }
.xiga-main { min-width: 0; max-width: 1120px; margin: 0 auto; }
.xiga-sidebar { display: none !important; }
.xiga-sidebar {
    position: fixed;
    top: 52px;
    left: 0;
    width: 260px;
    height: calc(100vh - 52px);
    overflow-y: auto;
    background: #fff;
    border: 0;
    border-right: 1px solid #e0e0e0;
    border-radius: 0;
    padding: 14px 12px 24px;
    z-index: 80;
}
.xiga-sidebar-profile { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--divider); }
.xiga-sidebar-user { display: flex; align-items: center; gap: .65rem; text-decoration: none; color: inherit; margin-bottom: 10px; }
.xiga-sidebar-user img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.xiga-sidebar-user strong { display: block; color: var(--navy); font-size: .92rem; }
.xiga-sidebar-user span { font-size: .78rem; color: var(--muted); }
.xiga-sidebar-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.xiga-sidebar-stats a {
    text-align: center; padding: 6px 4px; border-radius: 8px; background: var(--bg);
    text-decoration: none; color: var(--muted); font-size: .68rem;
}
.xiga-sidebar-stats a:hover { background: var(--hover); color: var(--blue); }
.xiga-sidebar-stats strong { display: block; font-size: 1rem; color: var(--navy); }
.xiga-nav-label {
    margin: 10px 8px 4px; font-size: .68rem; font-weight: 700; letter-spacing: .05em;
    text-transform: uppercase; color: var(--muted);
}
.xiga-nav-label:first-child { margin-top: 0; }
.xiga-nav-link {
    display: flex; align-items: center; gap: .65rem; padding: 8px 10px; border-radius: 8px;
    color: var(--navy); font-weight: 600; font-size: .88rem; text-decoration: none;
}
.xiga-nav-link:hover { background: var(--hover); color: var(--blue); }
.xiga-nav-link.is-active { background: rgba(8,120,209,.1); color: var(--blue); border-left: 3px solid var(--blue); padding-left: 7px; }
.xiga-nav-link--admin { color: var(--green); }
.xiga-sidebar-cta { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--divider); }

.xiga-card, .xiga-card.app-card, .xiga-card.portal-card {
    background: #fff; border: 1px solid #e0e0e0;
    border-radius: 8px; box-shadow: none;
    margin-bottom: 14px; padding: 14px 16px;
}
.xiga-quick-actions {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 14px;
}
.xiga-quick-action {
    display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 8px;
    background: var(--white); border: 1px solid var(--divider); border-radius: var(--radius);
    text-decoration: none; color: var(--navy); font-size: .72rem; font-weight: 700; text-align: center;
    transition: transform .15s ease, box-shadow .15s ease;
}
.xiga-quick-action:hover { transform: translateY(-2px); box-shadow: var(--shadow); color: var(--blue); }

.xiga-compose-top { display: flex; align-items: center; gap: .75rem; }
.xiga-compose-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.xiga-compose-trigger {
    flex: 1; border: 1px solid var(--divider); background: var(--bg); border-radius: 999px;
    padding: .65rem 1rem; font-size: .9rem; color: var(--muted); text-align: left; cursor: pointer;
}
.xiga-compose-trigger:hover { border-color: var(--blue); background: #fff; }
.xiga-compose-fields { margin-top: .75rem; display: flex; flex-direction: column; gap: .5rem; }
.xiga-compose-fields input, .xiga-compose-fields textarea {
    width: 100%; border: 1px solid var(--divider); border-radius: 8px; padding: .6rem .75rem;
}
.xiga-compose-fields textarea { min-height: 100px; resize: vertical; }
.xiga-compose-fields input:focus, .xiga-compose-fields textarea:focus {
    outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(8,120,209,.12);
}
.xiga-compose-submit { text-align: right; }
.xiga-compose-divider { height: 1px; background: var(--divider); margin: 10px 0; }
.xiga-compose-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.xiga-compose-action {
    flex: 1; display: flex; align-items: center; justify-content: center; gap: .4rem;
    padding: .5rem; border: 0; border-radius: 8px; background: transparent;
    font-weight: 600; font-size: .82rem; color: var(--muted); cursor: pointer; text-decoration: none;
}
.xiga-compose-action:hover { background: var(--hover); color: var(--blue); }

.xiga-post { padding: 0; overflow: hidden; }
.xiga-post-head { display: flex; align-items: center; gap: .75rem; padding: 14px 16px 8px; }
.xiga-post-avatar { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; }
.xiga-post-meta { flex: 1; }
.xiga-post-meta strong { display: block; font-size: .95rem; color: var(--navy); }
.xiga-post-meta span { font-size: .78rem; color: var(--muted); }
.xiga-post-head-actions { display: flex; align-items: center; gap: .35rem; }
.xiga-post-msg-btn {
    width: 32px; height: 32px; border-radius: 50%; background: var(--bg);
    display: flex; align-items: center; justify-content: center; text-decoration: none;
}
.xiga-post-tag {
    display: inline-block; margin: 0 16px 8px; padding: .2rem .6rem;
    background: rgba(8,120,209,.08); border-radius: 999px; font-size: .78rem;
    font-weight: 600; color: var(--blue); text-decoration: none;
}
.xiga-post-title { margin: 0 16px 8px; font-size: 1rem; color: var(--navy); }
.xiga-post-body { padding: 0 16px 12px; line-height: 1.6; white-space: pre-wrap; }
.xiga-post-counts {
    display: flex; justify-content: space-between; padding: 8px 16px;
    font-size: .82rem; color: var(--muted); border-top: 1px solid var(--divider);
}
.xiga-post-likes-count { color: var(--green); font-weight: 600; }
.xiga-post-actions { display: flex; border-top: 1px solid var(--divider); padding: 4px 8px; }
.xiga-post-action, .xiga-post-action-form button {
    flex: 1; display: flex; align-items: center; justify-content: center; gap: .4rem;
    padding: .6rem; border: 0; border-radius: 8px; background: transparent;
    font-weight: 600; font-size: .85rem; color: var(--muted); cursor: pointer; text-decoration: none;
}
.xiga-post-action:hover, .xiga-post-action-form button:hover { background: var(--hover); color: var(--blue); }
.xiga-post-action.is-liked, .xiga-post-action-form button.is-liked { color: var(--green); }
.xiga-post-action-form { flex: 1; margin: 0; }
.xiga-post-comments { padding: 10px 16px 14px; background: var(--bg); border-top: 1px solid var(--divider); }
.xiga-comment { display: flex; gap: .5rem; margin-bottom: .5rem; }
.xiga-comment-avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }
.xiga-comment-bubble { background: var(--white); border: 1px solid var(--divider); border-radius: 12px; padding: .45rem .75rem; }
.xiga-comment-bubble strong { font-size: .82rem; display: block; }
.xiga-comment-bubble p { margin: .15rem 0 0; font-size: .88rem; }

.xiga-empty { text-align: center; padding: 2rem 1rem; }
.xiga-empty p { color: var(--muted); margin-bottom: 1rem; }
.xiga-flash { max-width: 720px; margin: 12px auto 0; padding: .65rem 1rem; border-radius: var(--radius); font-weight: 600; text-align: center; }
.xiga-flash--success { background: rgba(22,139,56,.12); color: var(--green); border: 1px solid rgba(22,139,56,.25); }
.xiga-flash--error { background: #fdecea; color: #c0392b; }
.xiga-detail-list { display: grid; grid-template-columns: 140px 1fr; gap: .35rem .75rem; font-size: .9rem; margin-bottom: 1rem; }
.xiga-detail-list dt { color: var(--muted); font-weight: 600; }
.xiga-detail-list dd { margin: 0; }
.xiga-pagination { margin-top: 12px; }
.xiga-pagination:empty { display: none; }
.pagination,
ul.pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    list-style: none !important;
    margin: 0;
    padding: 0;
}
.pagination > li,
.page-item {
    list-style: none !important;
    display: inline-flex;
    margin: 0;
    padding: 0;
}
.page-link {
    display: inline-flex;
    min-width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    border: 1px solid var(--divider);
    border-radius: 8px;
    background: #fff;
    color: var(--navy);
    font-weight: 650;
    line-height: 1;
    text-decoration: none;
}
.page-item.active .page-link,
.pagination > li.active > span {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}
.page-item.disabled .page-link,
.pagination > li.disabled > span {
    opacity: .4;
    pointer-events: none;
}
.page-link:hover {
    background: var(--hover);
}

.app-sidebar-backdrop { display: none; position: fixed; inset: 0; background: rgba(7,21,34,.45); z-index: 450; }
.app-body.app-sidebar-open .app-sidebar-backdrop { display: block; }

.app-mobile-nav {
    display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 500;
    background: var(--white); border-top: 1px solid var(--divider);
    box-shadow: 0 -4px 16px rgba(7,21,34,.08);
    padding: 4px 6px calc(4px + env(safe-area-inset-bottom)); justify-content: space-around;
}
.app-mobile-nav a {
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    padding: 6px 8px; color: var(--muted); font-size: .64rem; font-weight: 700;
    text-decoration: none; min-width: 52px;
}
.app-mobile-nav a.is-active { color: var(--blue); }

@media (max-width: 960px) {
    .xiga-menu-btn { display: flex; }
    .xiga-topnav {
        display: none;
        position: absolute;
        top: 52px;
        left: 0;
        right: 0;
        background: #fff;
        flex-direction: column;
        align-items: stretch;
        padding: .75rem 1rem 1rem;
        border-bottom: 1px solid var(--divider);
        z-index: 200;
    }
    .app-body.app-nav-open .xiga-topnav { display: flex; }
    .app-body.app-nav-open .app-sidebar-backdrop { display: block; }
    .xiga-search { max-width: none; }
    .xiga-layout { padding: 12px 12px 88px; }
    .xiga-main { max-width: none; }
    .xiga-sidebar { display: none !important; }
    .app-mobile-nav { display: flex; }
    .xiga-quick-actions { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .xiga-brand span { display: none; }
    .xiga-search { display: none; }
}

/* Shared responsive page shell */
.xiga-main, .mkt-container, .app-page-head, .xiga-layout {
    box-sizing: border-box;
}
.xiga-layout {
    width: 100%;
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
}
@media (max-width: 960px) {
    .xiga-layout {
        padding-left: max(12px, env(safe-area-inset-left));
    }
}
.mkt-container {
    width: min(1180px, calc(100% - 32px));
    margin-left: auto;
    margin-right: auto;
}

.xiga-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 14px;
}
.xiga-thumb-card .xiga-thumb {
    position: relative;
    height: 150px;
    border-radius: 10px;
    overflow: hidden;
    background: var(--bg);
    margin-bottom: .75rem;
}
.xiga-thumb img { width: 100%; height: 100%; object-fit: cover; }
.xiga-thumb-fallback {
    width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
    font-size: 2rem; background: linear-gradient(135deg, #e8f1fb, #eef8f1);
}
.xiga-thumb-badge {
    position: absolute; left: 8px; bottom: 8px;
    background: rgba(7,21,34,.85); color: #fff; font-size: .7rem; font-weight: 700;
    padding: .2rem .5rem; border-radius: 999px;
}
.xiga-meta-row { display: flex; flex-wrap: wrap; gap: .35rem; margin: .5rem 0 .75rem; }
.xiga-filter-row {
    display: grid; grid-template-columns: 1.4fr 1fr 1fr auto; gap: .5rem; margin-bottom: 14px;
}
.xiga-filter-row input { width: 100%; border: 1px solid var(--divider); border-radius: 8px; padding: .55rem .75rem; }
.xiga-skill-chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.xiga-skill-chips span {
    background: rgba(8,120,209,.08); color: var(--blue); border-radius: 999px;
    padding: .2rem .6rem; font-size: .78rem; font-weight: 600;
}
.xiga-talent-card .xiga-talent-head {
    display: flex; gap: .75rem; align-items: center; text-decoration: none; color: inherit; margin-bottom: .5rem;
}
.xiga-talent-card .xiga-talent-head img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.xiga-talent-card .xiga-talent-head strong { display: block; }
.xiga-talent-card .xiga-talent-head span { font-size: .82rem; color: var(--muted); }
.xiga-talent-actions { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .75rem; }
.xiga-external-links { display: flex; flex-wrap: wrap; gap: .5rem; }
.xiga-profile-hero { padding: 0; overflow: hidden; }
.xiga-profile-banner {
    height: 120px;
    background: linear-gradient(135deg, #071522 0%, #0c3d66 50%, #0878D1 100%);
}
.xiga-profile-main { display: flex; gap: 1rem; padding: 0 1rem 1.25rem; align-items: flex-end; margin-top: -40px; }
.xiga-profile-photo {
    width: 96px; height: 96px; border-radius: 50%; object-fit: cover;
    border: 4px solid #fff; background: #fff; flex-shrink: 0;
}
.xiga-profile-info h1 { margin: 0; font-size: 1.35rem; }
.xiga-profile-info p { margin: .2rem 0; }
.xiga-profile-actions { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .65rem; align-items: center; }
.xiga-report-menu { position: relative; }
.xiga-report-menu summary { cursor: pointer; list-style: none; }
.xiga-report-menu form {
    position: absolute; right: 0; top: 110%; z-index: 20; width: 240px;
    background: #fff; border: 1px solid var(--divider); border-radius: 10px;
    box-shadow: var(--shadow); padding: .75rem; display: flex; flex-direction: column; gap: .4rem;
}
.xiga-report-menu select, .xiga-report-menu textarea {
    width: 100%; border: 1px solid var(--divider); border-radius: 8px; padding: .45rem;
}
.xiga-post-report { flex: 0 0 auto; }
.xiga-post-image { padding: 0 16px 12px; }
.xiga-post-image img { width: 100%; border-radius: 10px; max-height: 420px; object-fit: cover; }
.xiga-home-service { margin-bottom: 14px; }
.xiga-quick-service-form {
    display: grid; gap: .55rem;
}
.xiga-quick-service-form input,
.xiga-quick-service-form textarea {
    width: 100%; border: 1px solid var(--divider); border-radius: 8px; padding: .6rem .75rem;
}
.xiga-quick-service-form input:focus,
.xiga-quick-service-form textarea:focus {
    outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(8,120,209,.12);
}
.xiga-progress-bar {
    width: min(220px, 100%); height: 10px; background: var(--bg); border-radius: 999px; overflow: hidden;
}
.xiga-progress-bar span { display: block; height: 100%; background: var(--green); }
.xiga-module-list { padding-left: 1.2rem; line-height: 1.7; }
.xiga-detail-hero { display: grid; grid-template-columns: 280px 1fr; gap: 1.25rem; align-items: start; }
.xiga-detail-img { width: 100%; border-radius: 12px; object-fit: cover; max-height: 220px; }
.xiga-note-unread { border-left: 3px solid var(--blue); }
.form-section { margin-bottom: 1.25rem; }
.form-section h3 { margin: 0 0 .75rem; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem; }
.form-group-full { grid-column: 1 / -1; }
.muted { color: var(--muted); }

/* AI match + maps + path */
.xiga-interest-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: .75rem 0 1rem; }
.xiga-chip {
    display: inline-flex; align-items: center; gap: .35rem;
    border: 1px solid var(--divider); border-radius: 999px; padding: .4rem .85rem;
    background: #fff; cursor: pointer; font-size: .86rem; font-weight: 600;
}
.xiga-chip input { margin: 0; }
.xiga-chip.is-on, .xiga-chip:has(input:checked) {
    border-color: var(--blue); background: rgba(8,120,209,.08); color: var(--blue);
}
.xiga-hunter-head { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; align-items: flex-start; }
.xiga-hunter-stats { display: flex; gap: .75rem; flex-wrap: wrap; }
.xiga-hunter-stats > div {
    min-width: 72px; text-align: center; background: #f4f8fc; border-radius: 10px; padding: .45rem .65rem;
}
.xiga-hunter-stats strong { display: block; font-size: 1.05rem; color: var(--blue); }
.xiga-hunter-stats span { font-size: .72rem; color: var(--muted); }
.xiga-platform-meta { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .45rem; font-size: .75rem; color: var(--muted); }
.xiga-map-modes { display: flex; flex-wrap: wrap; gap: .45rem; }
.xiga-google-js-map { display: none; }
.xiga-map-page { display: flex; flex-direction: column; gap: .75rem; }
.xiga-map-brand h1 { margin: 0 0 .25rem; font-size: 1.45rem; }
.xiga-map-brand p { margin: 0; color: var(--muted); max-width: 46rem; }
.xiga-map-nav {
    display: flex; flex-wrap: wrap; gap: .4rem; padding: .45rem;
    background: #071522; border-radius: 12px;
}
.xiga-map-nav-link {
    color: #fff; text-decoration: none; font-weight: 700; font-size: .86rem;
    padding: .45rem .8rem; border-radius: 999px;
}
.xiga-map-nav-link:hover, .xiga-map-nav-link.is-on { background: #0878D1; }
.xiga-map-work, .xiga-map-regions { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin: .35rem 0; }
.xiga-map-work-label { font-size: .78rem; font-weight: 700; color: var(--muted); margin-right: .2rem; }
.xiga-map-more { margin-top: .35rem; border: 1px solid var(--divider); border-radius: 10px; padding: .35rem .75rem; background: #fff; }
.xiga-map-more > summary { cursor: pointer; font-weight: 700; padding: .35rem 0; }
.xiga-map-more-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; padding: .45rem 0 .65rem; }
.xiga-gmap-searchbar {
    display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
    position: static; max-width: none;
}
.xiga-gmap-searchbar--hero { margin: 0; box-shadow: none; }
.xiga-gmap-searchbar--hero input[type="search"] {
    flex: 1; min-width: 180px; min-height: 46px; font-size: 1rem; box-shadow: none;
}
.xiga-live-map {
    width: 100%; min-height: 560px; height: min(82vh, 860px);
    border-radius: 14px; border: 1px solid var(--divider); background: #e8eef5;
    overflow: hidden;
}
.xiga-map-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) 300px; gap: 14px; }
.xiga-map-filters { display: flex; flex-direction: column; gap: .45rem; }
.xiga-map-filters input, .xiga-map-filters select {
    width: 100%; border: 1px solid var(--divider); border-radius: 8px; padding: .55rem .7rem;
}
.xiga-gmap-searchbar input[type="search"] {
    flex: 1; border: 1px solid #d0d7de; border-radius: 8px;
    padding: .55rem .75rem; font: inherit; background: #fff;
    box-shadow: 0 8px 24px rgba(7,21,34,.12);
}
.xiga-live-map iframe, .xiga-pin-map iframe {
    width: 100%; height: 100%; min-height: 520px; border: 0; display: block;
}
.xiga-map-regions { display: flex; flex-wrap: wrap; gap: .35rem; margin: .65rem 0 .35rem; }
.xiga-map-regions .xiga-mode-chip { cursor: pointer; }
.xiga-pin-map {
    width: 100%; min-height: 360px; height: 42vh; margin-top: .5rem;
    border-radius: 12px; border: 1px solid var(--divider); background: #e8eef5;
    overflow: hidden;
}
.btn.is-on, #xiga-map-traffic.is-on { background: #071522; color: #fff; border-color: #071522; }
.xiga-map-count {
    display: inline-block; min-width: 1.4rem; margin-left: .25rem;
    font-size: .78rem; font-weight: 700; color: var(--blue);
}
.xiga-map-filter-actions { display: flex; flex-wrap: wrap; gap: .4rem; grid-column: 1 / -1; }
.xiga-map-mobile-tabs { display: none; gap: .4rem; margin: 0 0 10px; }
.xiga-map-tab {
    flex: 1; border: 1px solid var(--divider); background: #fff; border-radius: 999px;
    padding: .5rem .75rem; font-weight: 700; cursor: pointer; color: var(--navy);
}
.xiga-map-tab.is-on { background: #071522; color: #fff; border-color: #071522; }
.xiga-map-place.is-on { border-color: var(--blue); box-shadow: 0 0 0 2px rgba(8,120,209,.18); }
.xiga-map-popup p { margin: .25rem 0 0; font-size: .85rem; }
.xiga-map-popup-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.xiga-map-popup-actions a { font-weight: 700; }
.xiga-map-list { max-height: min(70vh, 640px); overflow: auto; padding-right: 2px; }
.xiga-builder-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .55rem; margin-top: 1rem; }
.xiga-builder-item {
    display: flex; gap: .55rem; align-items: flex-start; border: 1px solid var(--divider);
    border-radius: 10px; padding: .65rem .7rem; background: #fff;
}
.xiga-builder-item.is-done { border-color: rgba(18,164,84,.35); background: rgba(18,164,84,.06); }
.xiga-builder-check { font-weight: 800; color: var(--blue); }
.xiga-builder-item.is-done .xiga-builder-check { color: #0f7a3d; }
.xiga-builder-item p { margin: .15rem 0 0; font-size: .8rem; }
.xiga-flash-inline { border-left: 4px solid var(--green); background: #f0faf4; }
.xiga-platform-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .75rem;
}
.xiga-platform-card {
    display: block; text-decoration: none; color: inherit;
    border: 1px solid var(--divider); border-radius: 12px; padding: .9rem 1rem;
    background: linear-gradient(180deg, #f8fbff 0%, #fff 100%);
    transition: border-color .15s ease, transform .15s ease;
}
.xiga-platform-card:hover { border-color: var(--blue); transform: translateY(-1px); }
.xiga-platform-top { display: flex; justify-content: space-between; gap: .5rem; margin-bottom: .35rem; }
.xiga-platform-card h4 { margin: 0 0 .35rem; font-size: .98rem; }
.xiga-platform-card p { margin: 0; color: var(--muted); font-size: .86rem; }
.xiga-platform-cta { display: inline-block; margin-top: .55rem; color: var(--blue); font-weight: 700; font-size: .82rem; }
.xiga-map-embed-wrap, .xiga-map-embed { display: none; }

.xiga-workflow {
    display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px;
}
.xiga-workflow a {
    background: #fff; border: 1px solid var(--divider, #dce6ef);
    border-radius: 8px; padding: .45rem .7rem; text-decoration: none;
    color: #071522; font-size: .82rem; font-weight: 600;
}
.xiga-workflow a:hover { border-color: #0878D1; color: #0878D1; }
.xiga-exp-row {
    display: grid; grid-template-columns: 1fr 1fr 120px; gap: 8px; margin-bottom: 10px;
}
.xiga-exp-row--full { grid-template-columns: 1fr 1fr; }
.xiga-exp-row--full textarea { grid-column: 1 / -1; }
.xiga-hire-form input, .xiga-hire-form textarea {
    width: 100%; margin: .35rem 0; padding: .5rem .65rem;
    border: 1px solid #dce6ef; border-radius: 8px;
}
.xiga-safety-note { background: #f7fafc; }
.xiga-timeline { list-style: none; padding: 0; margin: 0; }
.xiga-timeline li { padding: .65rem 0; border-bottom: 1px solid #eef3f8; }
.xiga-hunter-filters { display: flex; flex-direction: column; gap: .35rem; margin-top: .85rem; }
.xiga-hunter-filters input[type="search"] {
    width: 100%; max-width: 420px; border: 1px solid #dce6ef; border-radius: 8px; padding: .55rem .75rem;
}
.xiga-job-kind {
    font-size: .7rem; font-weight: 700; color: #0f7a3d; background: #eef8f1;
    border-radius: 4px; padding: .12rem .4rem;
}
.xiga-job-kind--live { color: #0878D1; background: #eef6fc; }
.xiga-job-host {
    font-size: .72rem; color: #5b6b7c; font-family: ui-monospace, Consolas, monospace;
}
.xiga-source-bar button {
    border: 1px solid #dce6ef; background: #fff; border-radius: 999px;
    padding: .35rem .75rem; font-size: .8rem; font-weight: 600; cursor: pointer; color: #071522;
}
.xiga-source-bar button.is-on { background: #071522; color: #fff; border-color: #071522; }
.xiga-job-list { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.xiga-job-row {
    display: flex; justify-content: space-between; gap: 12px; align-items: flex-start;
    border: 1px solid #e6eef5; border-radius: 10px; padding: 12px 14px; background: #fff;
}
.xiga-job-row-main { min-width: 0; flex: 1; }
.xiga-job-row-main h4 { margin: .2rem 0 .15rem; font-size: 1rem; }
.xiga-job-row-main p { margin: 0; font-size: .88rem; }
.xiga-job-row-top { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.xiga-job-platform {
    font-size: .72rem; font-weight: 700; letter-spacing: .02em; text-transform: uppercase;
    color: #0878D1; background: #eef6fc; border-radius: 4px; padding: .15rem .4rem;
}
.xiga-job-meta { font-size: .86rem !important; color: #243040; margin: .15rem 0 .25rem !important; }
.xiga-hunter-subhead { margin: 1.25rem 0 .35rem; font-size: 1.05rem; }
.xiga-board-row { display: flex; flex-wrap: wrap; gap: 8px; }
.xiga-board-link {
    display: flex; flex-direction: column; gap: 2px; min-width: 140px;
    border: 1px solid #dce6ef; border-radius: 10px; padding: .65rem .8rem;
    text-decoration: none; color: inherit; background: #fff;
}
.xiga-board-link:hover { border-color: #0878D1; }
.xiga-board-link strong { font-size: .86rem; }
.xiga-board-link span { font-size: .75rem; color: #5b6b7c; }
@media (max-width: 720px) {
    .xiga-job-row { flex-direction: column; }
}
.xiga-leaflet-map { display: none; }
.xiga-map-hint { margin: .5rem 0 0; font-size: .82rem; }
.xiga-map-list h3 { margin-top: 0; }
.xiga-map-place {
    border: 1px solid var(--divider); border-radius: 10px; padding: .75rem; margin-bottom: .6rem; cursor: pointer;
}
.xiga-map-place-top { display: flex; justify-content: space-between; gap: .4rem; }
.xiga-map-place-actions { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .5rem; }
.xiga-path-progress-wrap { margin-bottom: .75rem; }
.xiga-path-progress-bar {
    height: 10px; border-radius: 999px; background: #e8eef5; overflow: hidden; margin-bottom: .4rem;
}
.xiga-path-progress-bar span { display: block; height: 100%; background: linear-gradient(90deg, #0878D1, #12a454); }
.xiga-path-steps { display: grid; gap: .75rem; }
.xiga-path-step { display: flex; gap: .85rem; align-items: flex-start; }
.xiga-path-step-num {
    width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
    background: #e8eef5; color: var(--blue); font-weight: 800; flex-shrink: 0;
}
.xiga-path-step.is-done .xiga-path-step-num { background: rgba(18,164,84,.15); color: #0f7a3d; }
.xiga-path-step-body h3 { margin: 0 0 .25rem; font-size: 1rem; }
.xiga-path-tip, .xiga-path-earn { margin: .5rem 0 0; font-weight: 600; }
.xiga-verify-banner { border-left: 4px solid #e6a800; background: #fff9e8; }
.xiga-profile-list { margin: 0; padding-left: 1.1rem; line-height: 1.7; }
.btn-link { background: none; border: 0; color: var(--blue); cursor: pointer; padding: 0; font: inherit; text-decoration: underline; }
.xiga-live-thumb { width: 100%; height: 110px; object-fit: cover; border-radius: 10px; margin-bottom: .55rem; }
.xiga-hire-form { display: flex; flex-direction: column; gap: .4rem; margin-top: .65rem; }
.xiga-hire-form input, .xiga-hire-form textarea { width: 100%; border: 1px solid var(--divider); border-radius: 8px; padding: .5rem .65rem; }

@media (max-width: 960px) {
    .xiga-filter-row { grid-template-columns: 1fr; }
    .xiga-detail-hero { grid-template-columns: 1fr; }
    .form-grid { grid-template-columns: 1fr; }
    .xiga-profile-main { flex-direction: column; align-items: flex-start; }
    .xiga-map-layout { grid-template-columns: 1fr; }
    .xiga-map-more-grid { grid-template-columns: 1fr; }
    .xiga-map-mobile-tabs { display: flex; }
    .xiga-map-layout.is-show-map .xiga-map-list { display: none; }
    .xiga-map-layout.is-show-list .xiga-map-panel { display: none; }
    .xiga-live-map { height: 62vh; min-height: 320px; }
    .xiga-gmap-searchbar { right: 10px; }
    .xiga-map-list { max-height: none; }
}
@media (max-width: 640px) {
    .xiga-card-grid { grid-template-columns: 1fr; }
    .xiga-quick-actions { grid-template-columns: 1fr 1fr; }
}

.xiga-nav-group { margin: .35rem 0; }
.xiga-nav-group > summary {
    list-style: none; cursor: pointer;
    font-size: .68rem; font-weight: 700; letter-spacing: .05em;
    text-transform: uppercase; color: var(--muted);
    padding: 8px 10px; border-radius: 8px;
}
.xiga-nav-group > summary::-webkit-details-marker { display: none; }
.xiga-nav-group > summary:hover { background: var(--hover); color: var(--blue); }
.xiga-nav-group--nested > summary {
    text-transform: none; letter-spacing: 0; font-size: .82rem; font-weight: 600; color: var(--navy);
}
.xiga-nav-sub { padding-left: .45rem; }
.xiga-nav-link { transition: background .15s ease, color .15s ease; }

.xiga-topnav-item { position: relative; }
.xiga-topnav-drop {
    display: none; position: absolute; top: 100%; left: 0; min-width: 220px;
    background: #fff; border: 1px solid #e0e0e0; border-radius: 8px;
    box-shadow: 0 8px 24px rgba(7,21,34,.08); padding: .4rem; z-index: 40;
}
.xiga-topnav-item:hover .xiga-topnav-drop, .xiga-topnav-item:focus-within .xiga-topnav-drop { display: block; }
.xiga-topnav-drop a, .xiga-topnav-fly > span {
    display: block; padding: .45rem .65rem; border-radius: 6px; color: var(--navy); font-size: .86rem; font-weight: 600;
}
.xiga-topnav-drop a:hover { background: var(--hover); color: var(--blue); }
.xiga-topnav-fly { margin-top: .2rem; border-top: 1px solid var(--divider); padding-top: .25rem; }
.xiga-topnav-fly > span { color: var(--muted); font-size: .72rem; text-transform: uppercase; }
.xiga-topnav-item.is-active > .xiga-topnav-link { color: var(--blue); border-bottom-color: var(--blue); }

.xiga-post-image { margin: .75rem -16px 0; overflow: hidden; background: #111; }
.xiga-post-image img { width: 100%; max-height: 520px; object-fit: cover; display: block; }
.xiga-compose-photo {
    display: inline-flex; align-items: center; gap: .4rem;
    border: 1px solid var(--divider); border-radius: 999px; padding: .35rem .8rem;
    font-size: .82rem; font-weight: 600; cursor: pointer; color: var(--navy);
}
.xiga-compose-photo:hover { border-color: var(--blue); color: var(--blue); }
.xiga-compose-photo input { display: none; }
.xiga-post-preview { max-height: 180px; width: 100%; object-fit: cover; border-radius: 8px; margin-top: .5rem; }

.xiga-crop { display: flex; gap: 1rem; align-items: flex-start; flex-wrap: wrap; }
.xiga-crop-current { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; border: 2px solid var(--divider); }
.xiga-crop-stage canvas { width: 320px; max-width: 100%; height: auto; border-radius: 12px; background: #111; }

.xiga-accordion details { border: 1px solid var(--divider); border-radius: 8px; margin-bottom: .5rem; background: #fff; }
.xiga-accordion summary { cursor: pointer; padding: .75rem 1rem; font-weight: 700; color: var(--navy); }
.xiga-accordion summary:hover { color: var(--blue); }
.xiga-accordion details[open] summary { border-bottom: 1px solid var(--divider); }
.xiga-accordion details p { margin: 0; padding: .75rem 1rem 1rem; color: var(--muted); }

.xiga-help-fab {
    position: fixed; right: 18px; bottom: 78px; z-index: 600;
    width: 52px; height: 52px; border-radius: 50%; border: 0;
    background: var(--navy); color: #fff; font-weight: 800; cursor: pointer;
    box-shadow: 0 8px 20px rgba(7,21,34,.2);
    display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1;
}
.xiga-help-fab span { font-size: .55rem; font-weight: 700; margin-top: 2px; }
.xiga-help-fab:hover { background: var(--blue); }
.xiga-help-panel {
    position: fixed; right: 18px; bottom: 140px; z-index: 600;
    width: min(360px, calc(100vw - 24px)); max-height: min(70vh, 520px); overflow: auto;
    background: #fff; border: 1px solid var(--divider); border-radius: 12px;
    box-shadow: 0 16px 40px rgba(7,21,34,.16); padding: 12px;
}
.xiga-help-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: .4rem; }
.xiga-help-close { border: 0; background: transparent; font-size: 1.4rem; cursor: pointer; }
.xiga-help-actions { display: flex; gap: .4rem; margin-top: .75rem; }
.xiga-contract {
    white-space: pre-wrap; font-family: inherit; font-size: .86rem;
    background: #f7fafc; border: 1px solid var(--divider); border-radius: 8px; padding: 1rem;
}
.xiga-check-label { display: flex; gap: .5rem; align-items: flex-start; margin: .75rem 0; font-size: .9rem; }
.banner-ad__media video { width: 100%; max-height: 360px; object-fit: cover; display: block; }

@media (min-width: 961px) {
    .xiga-help-fab { bottom: 24px; }
    .xiga-help-panel { bottom: 88px; }
}

.xiga-nav-group > summary {
    display: flex; align-items: center; justify-content: space-between; gap: .4rem;
}
.xiga-nav-group > summary::after {
    content: ""; width: 0; height: 0; flex-shrink: 0;
    border-left: 5px solid transparent; border-right: 5px solid transparent;
    border-top: 6px solid currentColor; opacity: .55;
    transition: transform .15s ease;
}
.xiga-nav-group[open] > summary::after { transform: rotate(180deg); }
.xiga-caret {
    display: inline-block; width: 0; height: 0; margin-left: 4px;
    border-left: 4px solid transparent; border-right: 4px solid transparent;
    border-top: 5px solid currentColor; opacity: .6;
}
.xiga-post-avatar, .xiga-sidebar-user img, .xiga-crop-current, .xiga-profile-hero-photo {
    background: #e8eef5; object-fit: cover;
}
.xiga-profile-shell { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 16px; align-items: start; }
.xiga-profile-subnav { background: #fff; border: 1px solid var(--divider); border-radius: 8px; padding: 8px; }
.xiga-profile-subnav-link {
    display: flex; align-items: center; gap: .5rem; padding: .5rem .65rem; border-radius: 6px;
    color: var(--navy); font-weight: 600; font-size: .86rem;
}
.xiga-profile-subnav-link:hover { background: var(--hover); }
.xiga-profile-subnav-link.is-active { background: rgba(8,120,209,.1); color: var(--blue); }
.xiga-profile-dot { width: 8px; height: 8px; border-radius: 50%; background: #c0372a; flex-shrink: 0; }
.xiga-profile-subnav-link.is-warn .xiga-profile-dot { background: #e6a800; }
.xiga-profile-subnav-link.is-done .xiga-profile-dot { background: #168B38; }
.xiga-profile-hero { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.xiga-profile-hero-photo { width: 72px; height: 72px; border-radius: 50%; }
.xiga-profile-pct { min-width: 140px; }
.xiga-profile-pct span { font-weight: 800; color: var(--navy); }
.is-done-text { color: #0f7a3d; }
.is-miss-text { color: #a33; }
.xiga-call-stage { position: relative; background: #071522; border-radius: 12px; min-height: 360px; overflow: hidden; }
.xiga-call-stage video { width: 100%; max-height: 70vh; object-fit: cover; background: #000; }
#xiga-local-video { position: absolute; width: 140px; height: 100px; right: 12px; bottom: 12px; border-radius: 8px; object-fit: cover; border: 2px solid #fff; }
.xiga-call-audio { color: #fff; text-align: center; padding: 4rem 1rem; }
.xiga-call-audio img { width: 96px; height: 96px; border-radius: 50%; margin: 0 auto 1rem; object-fit: cover; }
.xiga-call-bar { display: flex; justify-content: center; padding: 1rem; }
.xiga-call-end { background: #c0372a; border-color: #c0372a; }
.xiga-call-status-line { position: absolute; left: 12px; top: 12px; color: #fff; margin: 0; }
.xiga-incoming {
    position: fixed; left: 16px; bottom: 88px; z-index: 700;
    display: flex; align-items: center; gap: .75rem; background: #fff;
    border: 1px solid var(--divider); border-radius: 12px; padding: .75rem 1rem;
    box-shadow: 0 12px 32px rgba(7,21,34,.16); max-width: 360px;
}
.xiga-incoming[hidden] { display: none !important; }
.xiga-incoming img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.xiga-meet-room { background: #071522; border-radius: 12px; overflow: hidden; color: #fff; }
.xiga-meet-toolbar { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding: 1rem; align-items: center; background: #0b2233; }
.xiga-meet-toolbar .muted { color: rgba(255,255,255,.7); margin: .2rem 0 0; }
.xiga-meet-toolbar-actions { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; }
.xiga-meet-toolbar-actions input { min-width: 180px; max-width: 280px; border-radius: 8px; border: 0; padding: .45rem .6rem; font-size: .82rem; }
.xiga-meet-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px; padding: 8px; min-height: 420px; }
.xiga-meet-tile { position: relative; background: #0a1a28; border-radius: 10px; overflow: hidden; min-height: 200px; }
.xiga-meet-tile video { width: 100%; height: 100%; min-height: 200px; object-fit: cover; background: #000; }
.xiga-meet-tile span { position: absolute; left: 8px; bottom: 8px; background: rgba(0,0,0,.55); padding: .2rem .5rem; border-radius: 6px; font-size: .78rem; }
.xiga-profile-hero { padding: 0; overflow: hidden; }
.xiga-profile-banner { height: 180px; background: linear-gradient(135deg, #071522 0%, #0c3d66 55%, #0878D1 100%); }
.xiga-profile-main { display: flex; gap: 1rem; padding: 0 1.25rem 1.25rem; align-items: flex-end; margin-top: -72px; }
.xiga-profile-photo, .xiga-profile-hero-photo, .social-avatar, .xiga-post-avatar, .xiga-sidebar-user img, .xiga-crop-current, .friend-card img, .xiga-incoming img {
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    background: #e4e6eb;
}
.xiga-profile-photo, .xiga-profile-hero-photo {
    width: 168px; height: 168px; border: 4px solid #fff; flex-shrink: 0; box-shadow: 0 2px 8px rgba(0,0,0,.12);
}
.xiga-crop-current { width: 168px; height: 168px; border-radius: 50%; object-fit: cover; }
.xiga-crop-stage { width: 320px; max-width: 100%; border-radius: 50%; overflow: hidden; }
.xiga-crop-stage canvas { width: 100%; height: auto; display: block; border-radius: 50%; }
@media (max-width: 960px) {
    .xiga-profile-shell { grid-template-columns: 1fr; }
    .xiga-incoming { bottom: 72px; left: 8px; right: 8px; max-width: none; }
    .xiga-profile-photo, .xiga-profile-hero-photo, .xiga-crop-current { width: 128px; height: 128px; }
    .xiga-profile-main { margin-top: -56px; }
    .xiga-meet-grid { grid-template-columns: 1fr; }
}

.gm-body { margin: 0; min-height: 100vh; background: #202124; color: #e8eaed; font-family: "Source Sans 3", "Segoe UI", sans-serif; }
.gm-flash { position: fixed; top: 16px; left: 50%; transform: translateX(-50%); z-index: 50; background: #137333; color: #fff; padding: .6rem 1rem; border-radius: 8px; }
.gm-flash-error { background: #c5221f; }
.gm-lobby { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.gm-lobby-brand { display: flex; align-items: center; gap: .6rem; margin-bottom: 1.5rem; font-weight: 700; font-size: 1.2rem; }
.gm-lobby-brand img { height: 36px; }
.gm-lobby-grid { display: grid; grid-template-columns: 1.3fr .9fr; gap: 1.5rem; align-items: start; }
.gm-preview-card, .gm-join-card { background: #3c4043; border-radius: 16px; overflow: hidden; }
.gm-preview-stage { position: relative; background: #000; min-height: 320px; }
.gm-preview-stage video { width: 100%; height: 360px; object-fit: cover; display: block; background: #111; }
.gm-preview-placeholder { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem; padding: 1.5rem; text-align: center; background: rgba(32,33,36,.55); }
.gm-preview-controls { display: flex; justify-content: center; gap: .6rem; padding: .85rem; }
.gm-join-card { padding: 1.75rem 1.5rem; }
.gm-kicker { text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; color: #9aa0a6; margin: 0 0 .4rem; }
.gm-join-card h1 { margin: 0 0 .4rem; font-size: 1.7rem; color: #fff; }
.gm-meta, .gm-help, .gm-tiny { color: #bdc1c6; font-size: .92rem; }
.gm-join-form { display: flex; flex-direction: column; gap: .5rem; margin-top: 1rem; }
.gm-join-form label { font-weight: 600; font-size: .88rem; }
.gm-join-form input { border: 0; border-radius: 8px; padding: .7rem .8rem; font: inherit; }
.gm-error { color: #f28b82; font-size: .85rem; }
.gm-btn { border: 0; border-radius: 24px; padding: .7rem 1.4rem; font: inherit; font-weight: 700; cursor: pointer; }
.gm-btn-join { background: #1a73e8; color: #fff; width: 100%; margin-top: .4rem; }
.gm-btn-join:hover { background: #174ea6; }
.gm-btn-light { background: #fff; color: #202124; }
.gm-btn-sm { padding: .4rem .8rem; font-size: .82rem; border-radius: 8px; }
.gm-tiny { margin-top: 1rem; }
.gm-tiny a { color: #8ab4f8; }
.gm-ctrl { width: 48px; height: 48px; border-radius: 50%; border: 0; background: #3c4043; color: #fff; cursor: pointer; font-size: 1.1rem; }
.gm-ctrl.is-off, .gm-ctrl[aria-pressed="false"] { background: #ea4335; }
.gm-ctrl-end { background: #ea4335; color: #fff; min-width: 88px; border-radius: 24px; width: auto; padding: 0 1rem; font-size: .85rem; font-weight: 700; }
.gm-room { min-height: 100vh; display: flex; flex-direction: column; }
.gm-topbar { display: flex; justify-content: space-between; gap: 1rem; padding: .85rem 1.25rem; align-items: center; background: #202124; }
.gm-topbar-left { display: flex; gap: .7rem; align-items: center; }
.gm-topbar-left strong { display: block; }
.gm-topbar-left span, .gm-status { color: #9aa0a6; font-size: .82rem; }
.gm-code { background: #3c4043; padding: .25rem .55rem; border-radius: 6px; font-family: ui-monospace, monospace; letter-spacing: .06em; }
.gm-stage { flex: 1; display: grid; grid-template-columns: 1fr 280px; gap: 8px; padding: 0 8px 8px; min-height: 0; }
.gm-stage .xiga-meet-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px; min-height: 360px; }
.gm-side { background: #fff; color: #202124; border-radius: 12px; padding: 1rem; overflow: auto; }
.gm-side h3 { margin: 0 0 .75rem; }
.gm-invite-label { font-size: .85rem; color: #5f6368; }
.gm-invite-row { display: flex; gap: .35rem; margin: .5rem 0 1rem; }
.gm-invite-row input { flex: 1; border: 1px solid #dadce0; border-radius: 8px; padding: .45rem; font-size: .78rem; }
.gm-people { list-style: none; margin: 0; padding: 0; }
.gm-people li { padding: .4rem 0; border-bottom: 1px solid #eee; font-weight: 600; }
.gm-bar { display: flex; justify-content: center; align-items: center; gap: .7rem; padding: 1rem; background: #202124; }
.gm-perm-banner { position: fixed; bottom: 88px; left: 50%; transform: translateX(-50%); background: #3c4043; padding: .8rem 1rem; border-radius: 12px; display: flex; gap: .75rem; align-items: center; max-width: 90%; }
.gm-perm-note { text-align: center; color: #fdd663; padding: 0 1rem 1rem; }
.gm-ended { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .8rem; text-align: center; padding: 2rem; }
@media (max-width: 900px) {
    .gm-lobby-grid, .gm-stage { grid-template-columns: 1fr; }
    .gm-side { order: 2; max-height: 220px; }
}

.xiga-home-hero { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-end; margin-bottom: 1.25rem; flex-wrap: wrap; }
.xiga-home-kicker { text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; color: #5f7387; margin: 0 0 .25rem; font-weight: 700; }
.xiga-home-hero h1 { margin: 0; font-size: 1.7rem; }
.xiga-home-hero-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.xiga-home-kpis { display: grid; grid-template-columns: repeat(6, 1fr); gap: .75rem; margin-bottom: 1rem; }
.xiga-kpi { background: #fff; border: 1px solid var(--divider, #e6ebf0); border-radius: 12px; padding: .85rem 1rem; text-decoration: none; color: inherit; display: flex; flex-direction: column; gap: .15rem; }
.xiga-kpi strong { font-size: 1.35rem; color: #071522; }
.xiga-kpi span { color: #5f7387; font-size: .82rem; }
.xiga-kpi em { font-style: normal; color: #c5221f; font-size: .75rem; }
.xiga-home-actions { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: 1.25rem; }
.xiga-home-action { background: #fff; border: 1px solid var(--divider, #e6ebf0); border-radius: 12px; padding: 1rem; text-decoration: none; color: inherit; }
.xiga-home-action strong { display: block; margin-bottom: .2rem; }
.xiga-home-action span { color: #5f7387; font-size: .85rem; }
.xiga-home-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) 300px; gap: 1rem; align-items: start; }
.xiga-rail-item { display: block; padding: .4rem 0; border-bottom: 1px solid #f0f2f5; color: inherit; text-decoration: none; }
.xiga-hire-steps { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.xiga-hire-steps span { background: #e8f1fb; color: #0c3d66; border-radius: 999px; padding: .35rem .75rem; font-size: .8rem; font-weight: 600; }
.xiga-invite-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .4rem; margin: .6rem 0 1rem; }
.xiga-team-board { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: 1rem; }
.xiga-task { display: flex; flex-direction: column; gap: .25rem; padding: .6rem 0; border-bottom: 1px solid #eee; }
.xiga-pro-note { background: #f4f8fc; }
@media (max-width: 1100px) {
    .xiga-home-kpis, .xiga-home-actions { grid-template-columns: repeat(2, 1fr); }
    .xiga-home-layout, .xiga-team-board { grid-template-columns: 1fr; }
}

.mkt-auth-card-wide { width: min(640px, 100%); }
.xiga-reg-steps {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: .4rem;
    list-style: none; margin: 0 0 1.25rem; padding: 0;
}
.xiga-reg-steps li {
    position: relative; text-align: center; font-size: .72rem; font-weight: 700;
    color: #8a9aab; padding-top: 1.4rem;
}
.xiga-reg-steps li::before {
    content: attr(data-step-label); position: absolute; top: 0; left: 50%;
    transform: translateX(-50%); width: 22px; height: 22px; border-radius: 50%;
    background: #e8eef5; color: #5f7387; font-size: .72rem; line-height: 22px;
}
.xiga-reg-steps li.is-active { color: #0878D1; }
.xiga-reg-steps li.is-active::before { background: #0878D1; color: #fff; }
.xiga-reg-steps li.is-done,
.xiga-reg-steps li.is-done { color: #168B38; }
.xiga-reg-steps li.is-done::before,
.xiga-reg-steps li.is-done::before { background: #168B38; color: #fff; content: "✓"; }
.xiga-reg-panel h3 { margin: 0 0 .85rem; font-size: 1.05rem; }
.xiga-reg-nav { display: flex; gap: .6rem; margin-top: 1rem; }
.xiga-reg-nav .btn { flex: 1; }
.xiga-crop-pick {
    display: inline-flex; align-items: center; gap: .4rem;
    border: 1px dashed #c5d0dc; border-radius: 10px; padding: .55rem .8rem;
    font-weight: 600; cursor: pointer; color: #0c3d66;
}
.xiga-crop-pick input { display: none; }
.xiga-crop-stage canvas { cursor: grab; touch-action: none; border-radius: 50%; }
.xiga-crop-stage canvas:active { cursor: grabbing; }
.xiga-crop-hint { margin: .45rem 0 .2rem; font-size: .82rem; }

.xiga-post { overflow: hidden; }
.xiga-post-image { padding: 0; margin: .25rem 0 0; background: #0b0b0b; }
.xiga-post-image img { width: 100%; max-height: 620px; object-fit: contain; display: block; border-radius: 0; }
.xiga-post-avatar, .xiga-compose-avatar, .xiga-comment-avatar {
    border-radius: 50%; object-fit: cover; object-position: center; background: #e4e6eb;
}
.xiga-post-quick-comment {
    display: flex; align-items: center; gap: .5rem; padding: 10px 16px 14px;
    border-top: 1px solid var(--divider, #e6ebf0); background: #f7f9fb;
}
.xiga-post-quick-comment input {
    flex: 1; border: 1px solid #e6ebf0; border-radius: 20px; padding: .5rem .9rem;
    background: #fff;
}
.xiga-compose { overflow: hidden; }
button.xiga-topnav-link, button.xiga-nav-link {
    border: 0; background: transparent; font: inherit; cursor: pointer; color: inherit;
    display: inline-flex; align-items: center; gap: .4rem; text-align: left;
}
.xiga-hunter-tabs {
    display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1rem;
}
.xiga-hunter-tabs a {
    border-radius: 999px; padding: .4rem .85rem; font-weight: 700; font-size: .86rem;
    background: #fff; border: 1px solid var(--divider, #e6ebf0); color: inherit; text-decoration: none;
}
.xiga-hunter-tabs a.is-on { background: #0c3d66; color: #fff; border-color: #0c3d66; }
.xiga-hunter-hero h2 { margin: 0 0 .4rem; }
.xiga-future-strip { margin: 0 0 1rem; }
.xiga-future-kicker { text-transform: uppercase; letter-spacing: .06em; font-size: .72rem; font-weight: 700; color: #5f7387; margin: 0 0 .5rem; }
.xiga-future-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .6rem; }
.xiga-future-card {
    background: #fff; border: 1px solid var(--divider, #e6ebf0); border-radius: 12px;
    padding: .85rem; text-decoration: none; color: inherit; display: flex; flex-direction: column; gap: .25rem;
}
.xiga-future-card:hover { border-color: #0878D1; }
.xiga-future-card span { color: #5f7387; font-size: .85rem; }
.xiga-help-panel { z-index: 800; }
@media (max-width: 900px) {
    .xiga-future-grid { grid-template-columns: 1fr 1fr; }
    .app-mobile-nav { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .app-mobile-nav a { flex: 0 0 auto; min-width: 56px; padding: .35rem .4rem; }
    .app-mobile-nav a small { max-width: 4.8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media (max-width: 640px) {
    .xiga-reg-steps li { font-size: 0; }
    .xiga-reg-steps li.is-active { font-size: .7rem; }
    .xiga-future-grid { grid-template-columns: 1fr; }
}

/* Homepage — live human platform */
.home-pulse {
    background: linear-gradient(180deg, #071522 0%, #0c3d66 100%);
    color: #fff;
    padding: 1.75rem 0 1.9rem;
    margin-top: -1px;
}
.home-pulse__kicker {
    margin: 0 0 1rem;
    font-size: .78rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-weight: 700;
    color: rgba(255,255,255,.65);
}
.home-pulse__grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: .75rem;
}
.home-pulse__item {
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 14px;
    padding: 1rem 1rem .9rem;
}
.home-pulse__item strong {
    display: block;
    font-size: clamp(1.35rem, 2.4vw, 1.85rem);
    font-weight: 800;
    letter-spacing: -.03em;
}
.home-pulse__item span { font-size: .78rem; color: rgba(255,255,255,.72); }
.home-pulse__item--focus {
    background: #c9a227;
    color: #071522;
    border-color: transparent;
}
.home-pulse__item--focus span { color: #3d3310; }

.home-people__grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: .85rem;
}
.home-people__card {
    background: #fff;
    border: 1px solid #e6ebf0;
    border-radius: 16px;
    padding: 1.1rem 1rem;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: .25rem;
    min-height: 100%;
}
.home-people__card:hover { border-color: #0878D1; box-shadow: 0 10px 24px rgba(7,21,34,.08); }
.home-people__avatar {
    width: 44px; height: 44px; border-radius: 50%;
    background: linear-gradient(135deg, #0878D1, #168B38);
    color: #fff; display: grid; place-items: center;
    font-weight: 800; margin-bottom: .4rem;
}
.home-people__card strong { color: #071522; font-size: .95rem; }
.home-people__card span, .home-people__card small { color: #5f7387; font-size: .8rem; }

.home-community__layout {
    display: grid;
    grid-template-columns: 1.5fr .9fr;
    gap: 2rem;
    align-items: start;
}
.home-community__lead { color: #5f7387; margin: 0 0 1rem; }
.home-feed { display: flex; flex-direction: column; gap: .7rem; margin-bottom: 1rem; }
.home-feed__item {
    background: #fff;
    border: 1px solid #e6ebf0;
    border-radius: 14px;
    padding: 1rem 1.1rem;
    text-decoration: none;
    color: inherit;
}
.home-feed__item:hover { border-color: #0878D1; }
.home-feed__item p { margin: .35rem 0 .4rem; color: #334155; }
.home-feed__item small { color: #5f7387; }
.home-groups { display: flex; flex-direction: column; gap: .6rem; }
.home-groups__item {
    display: flex; justify-content: space-between; gap: .75rem; align-items: baseline;
    background: #fff; border: 1px solid #e6ebf0; border-radius: 12px;
    padding: .85rem 1rem; text-decoration: none; color: inherit;
}
.home-groups__item:hover { border-color: #168B38; }
.home-groups__item span { color: #5f7387; font-size: .82rem; white-space: nowrap; }

.home-map-band {
    background: linear-gradient(120deg, #0c3d66 0%, #168B38 100%);
    color: #fff;
    padding: 2.2rem 0;
}
.home-map-band__inner {
    display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; flex-wrap: wrap;
}
.home-map-band h2 { margin: 0 0 .4rem; font-size: clamp(1.4rem, 2.5vw, 1.9rem); }
.home-map-band p { margin: 0; max-width: 36rem; color: rgba(255,255,255,.88); }

/* Admin analytics */
.analytics-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: .75rem;
    margin-bottom: 1.25rem;
}
.analytics-kpi {
    background: #fff; border: 1px solid #e6ebf0; border-radius: 14px;
    padding: .9rem 1rem;
}
.analytics-kpi strong { display: block; font-size: 1.45rem; color: #071522; }
.analytics-kpi span { display: block; font-weight: 700; font-size: .86rem; }
.analytics-kpi small { color: #5f7387; }
.analytics-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem;
}
.analytics-grid--3 { grid-template-columns: repeat(3, 1fr); }
.analytics-bars { display: flex; flex-direction: column; gap: .45rem; }
.analytics-bar-row { display: grid; grid-template-columns: 5.5rem 1fr 2.2rem; gap: .5rem; align-items: center; font-size: .82rem; }
.analytics-bar { height: 8px; background: #eef2f6; border-radius: 99px; overflow: hidden; }
.analytics-bar i { display: block; height: 100%; background: #0878D1; border-radius: 99px; }
.analytics-bar--gold i { background: #c9a227; }
.analytics-bar--green i { background: #168B38; }
.analytics-list { list-style: none; margin: 0; padding: 0; }
.analytics-list li { display: flex; justify-content: space-between; gap: .75rem; padding: .45rem 0; border-bottom: 1px solid #eef2f6; }
.analytics-list li b { color: #071522; }

@media (max-width: 1100px) {
    .home-pulse__grid, .home-people__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 800px) {
    .home-pulse__grid, .home-people__grid { grid-template-columns: repeat(2, 1fr); }
    .home-community__layout, .analytics-grid, .analytics-grid--3 { grid-template-columns: 1fr; }
}

/* Job board — compact LinkedIn-style rows */
.xiga-board { display: flex; flex-direction: column; gap: 1rem; }
.xiga-board-filters {
    display: grid;
    grid-template-columns: minmax(160px, 1.6fr) repeat(3, minmax(110px, .8fr)) auto;
    gap: .55rem;
    align-items: center;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: .7rem .8rem;
}
.xiga-board-filters input,
.xiga-board-filters select {
    width: 100%;
    border: 1px solid #d0d7de;
    border-radius: 6px;
    padding: .5rem .7rem;
    font-size: .88rem;
    background: #fff;
    color: #1b1f23;
}
.xiga-board-filters input:focus,
.xiga-board-filters select:focus {
    outline: none;
    border-color: #0878D1;
    box-shadow: 0 0 0 3px rgba(8,120,209,.12);
}
.xiga-job-board { display: flex; flex-direction: column; gap: .7rem; }
.xiga-job-card {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) auto;
    gap: .9rem;
    align-items: center;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: .85rem 1rem;
    box-shadow: 0 1px 0 rgba(7,21,34,.03);
}
.xiga-job-card:hover { border-color: #c9d4de; box-shadow: 0 6px 18px rgba(7,21,34,.06); }
.xiga-job-card__media {
    width: 72px; height: 72px; border-radius: 10px; overflow: hidden;
    background: #f4f7fb; border: 1px solid #e8edf2; flex-shrink: 0;
    display: block;
}
.xiga-job-card__media img,
.xiga-job-thumb {
    width: 72px; height: 72px; object-fit: cover; display: block;
    border-radius: 10px; background: #f4f7fb;
}
.xiga-job-thumb--lg { width: 88px; height: 88px; border-radius: 12px; }
.xiga-job-card__body { min-width: 0; }
.xiga-job-card__type {
    margin: 0 0 .15rem;
    font-size: .72rem; font-weight: 700; letter-spacing: .04em;
    text-transform: uppercase; color: #0878D1;
}
.xiga-job-card__body h3 { margin: 0; font-size: 1.02rem; line-height: 1.3; }
.xiga-job-card__body h3 a { color: #071522; text-decoration: none; }
.xiga-job-card__body h3 a:hover { color: #0878D1; }
.xiga-job-card__org { margin: .18rem 0 0; font-size: .88rem; color: #334155; font-weight: 600; }
.xiga-job-card__meta { margin: .2rem 0 0; font-size: .82rem; color: #64748b; }
.xiga-job-card__match { margin: .25rem 0 0; font-size: .78rem; font-weight: 700; color: #168B38; }
.xiga-job-card__actions { display: flex; flex-direction: column; gap: .4rem; align-items: stretch; min-width: 148px; }
.xiga-job-card__actions .btn { text-align: center; justify-content: center; }

.xiga-job-detail { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 1rem; align-items: start; }
.xiga-job-detail__head { display: flex; gap: .9rem; align-items: flex-start; margin-bottom: 1rem; }
.xiga-job-detail__head h2 { margin: .15rem 0 .25rem; font-size: 1.35rem; }
.xiga-job-detail__copy { line-height: 1.65; color: #243041; }
.xiga-job-detail__copy h3 { margin: 1.1rem 0 .4rem; font-size: 1rem; }
.xiga-job-detail__aside p { margin: 0 0 1rem; }
.xiga-job-detail__aside .btn { margin-bottom: .5rem; }

.xiga-rail-job {
    display: flex; align-items: center; gap: .65rem;
    padding: .55rem 0; border-bottom: 1px solid #f0f2f5;
    text-decoration: none; color: #071522; font-weight: 600; font-size: .88rem;
}
.xiga-rail-job img {
    width: 40px; height: 40px; border-radius: 8px; object-fit: cover;
    border: 1px solid #e8edf2; background: #f4f7fb; flex-shrink: 0;
}
.xiga-rail-job:hover { color: #0878D1; }

.xiga-caret {
    width: 0; height: 0; margin-left: 4px;
    border-left: 4px solid transparent; border-right: 4px solid transparent;
    border-top: 5px solid currentColor; opacity: .55;
}
.xiga-topnav-item .xiga-topnav-link { border-bottom: 2px solid transparent; }

@media (max-width: 900px) {
    .xiga-board-filters { grid-template-columns: 1fr 1fr; }
    .xiga-board-filters .btn { grid-column: 1 / -1; }
    .xiga-job-card { grid-template-columns: 56px minmax(0, 1fr); }
    .xiga-job-card__media, .xiga-job-card__media img { width: 56px; height: 56px; }
    .xiga-job-card__actions { grid-column: 1 / -1; flex-direction: row; min-width: 0; }
    .xiga-job-detail { grid-template-columns: 1fr; }
}

/* Centered professional shell */
.app-page-head { text-align: center; }
.app-page-head > div { margin: 0 auto; }
.xiga-home-hero, .xiga-home-kicker { text-align: center; }
.xiga-home-hero { justify-content: center; flex-direction: column; align-items: center; }
.xiga-home-hero-actions { justify-content: center; }
.mkt-section-label { text-align: center; }
.mkt-platform-tile { text-align: center; }
.mkt-step { text-align: center; }
.mkt-metric-card { text-align: center; }
.home-map-band__inner { justify-content: center; text-align: center; }
.mkt-cta-inner { text-align: center; justify-content: center; }

.xiga-auth {
    min-height: calc(100vh - 56px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 2.5rem 1rem 4rem;
    background: #f3f2ef;
}
.xiga-auth__card {
    width: 100%;
    max-width: 400px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 1.5rem 1.6rem 1.4rem;
    box-shadow: 0 4px 18px rgba(0,0,0,.06);
    text-align: left;
}
.xiga-auth__card h1 { margin: 0 0 .35rem; font-size: 1.45rem; text-align: center; }
.xiga-auth__lead { margin: 0 0 1.1rem; color: #666; text-align: center; font-size: .92rem; }
.xiga-auth__row { display: flex; justify-content: space-between; align-items: center; gap: .75rem; font-size: .85rem; }
.xiga-auth__footer { margin: 1rem 0 0; text-align: center; font-size: .9rem; }
.xiga-auth .xiga-auth__card.xiga-auth__card--wide { max-width: 480px; }
.xiga-reg-steps {
    display: flex; gap: .25rem; list-style: none; padding: 0; margin: 0 0 1rem;
    justify-content: space-between;
}
.xiga-reg-steps li {
    flex: 1; text-align: center; font-size: .68rem; font-weight: 700; color: #8a9aab;
    padding-top: 1.35rem; position: relative;
}
.xiga-reg-steps li::before {
    content: attr(data-step-label); position: absolute; top: 0; left: 50%;
    transform: translateX(-50%); width: 20px; height: 20px; border-radius: 50%;
    background: #e8eef5; color: #5f7387; line-height: 20px;
}
.xiga-reg-steps li.is-active { color: #0a66c2; }
.xiga-reg-steps li.is-active::before { background: #0a66c2; color: #fff; }
.xiga-reg-steps li.is-done { color: #168B38; }
.xiga-reg-steps li.is-done::before { background: #168B38; color: #fff; }
.xiga-reg-nav { display: flex; gap: .5rem; justify-content: flex-end; margin-top: 1rem; }
.xiga-trust-checks { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .6rem; }
.xiga-trust-checks a {
    font-size: .8rem; text-decoration: none; color: #5f7387;
    border: 1px solid #e0e0e0; border-radius: 999px; padding: .25rem .7rem;
}
.xiga-trust-checks a.is-done { color: #168B38; border-color: #cde7d4; }
.xiga-about { max-width: 760px; margin: 0 auto; text-align: center; }
.xiga-about__hero h1 { margin: .2rem 0 .6rem; }
.xiga-about__grid { display: grid; gap: 1rem; margin: 1.5rem 0; text-align: center; }
.xiga-about__grid article { background: #fff; border: 1px solid #e0e0e0; border-radius: 10px; padding: 1.1rem; }
.xiga-about__cta { display: flex; gap: .5rem; justify-content: center; }
.xiga-lesson { margin: 1rem 0; padding: 1rem 0; border-top: 1px solid #eee; }
.xiga-quiz-q { margin: .75rem 0; }
.xiga-quiz-q label { display: block; margin: .2rem 0; }
.admin-module { border: 1px solid #e6ebf0; border-radius: 10px; padding: 1rem; margin-bottom: .75rem; background: #fafbfc; }



