/* ── Networker — Public Pages Stylesheet ──────────────────────────────── */

/* ── Variables ────────────────────────────────────────────────────────── */
:root {
    --pub-primary:     #0d6efd;
    --pub-dark:        #1a1f2e;
    --pub-hero-bg:     linear-gradient(135deg, #1a1f2e 0%, #0d6efd 60%, #0dcaf0 100%);
    --pub-card-radius: 16px;
    --pub-shadow:      0 4px 24px rgba(0,0,0,.08);
    --pub-shadow-md:   0 8px 40px rgba(0,0,0,.14);
}

body.public-body {
    background: #f0f2f5;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    color: #1a1a2e;
}

/* ── NAVBAR ───────────────────────────────────────────────────────────── */
.public-navbar {
    background: rgba(26, 31, 46, 0.97);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(255,255,255,.07);
    padding: .6rem 0;
    transition: background .3s, box-shadow .3s;
}
.public-navbar.scrolled {
    background: rgba(26, 31, 46, .99);
    box-shadow: 0 2px 24px rgba(0,0,0,.2);
}

.pub-brand {
    color: #fff !important;
    text-decoration: none;
    font-size: 1.2rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.pub-brand i { color: #60a5fa; font-size: 1.5rem; }
.pub-brand em { font-style: normal; color: #60a5fa; }

.pub-link {
    color: rgba(255,255,255,.72) !important;
    font-size: .875rem;
    font-weight: 500;
    padding: .45rem .8rem !important;
    border-radius: 8px;
    transition: background .15s, color .15s;
    text-decoration: none;
}
.pub-link:hover, .pub-link.active {
    background: rgba(255,255,255,.1);
    color: #fff !important;
}

.pub-dropdown {
    background: #1a1f2e;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 12px !important;
    padding: .5rem !important;
    box-shadow: 0 16px 48px rgba(0,0,0,.3) !important;
    min-width: 210px;
}
.pub-dropdown .dropdown-item {
    color: rgba(255,255,255,.75);
    border-radius: 8px;
    font-size: .86rem;
    padding: .5rem .85rem;
    transition: background .12s, color .12s;
}
.pub-dropdown .dropdown-item:hover {
    background: rgba(255,255,255,.1);
    color: #fff;
}

.pub-cta-btn {
    background: linear-gradient(135deg,#60a5fa,#0d6efd) !important;
    border: none !important;
    color: white !important;
    transition: transform .15s, box-shadow .15s;
}
.pub-cta-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(13,110,253,.4) !important; }

/* ── HERO ─────────────────────────────────────────────────────────────── */
.pub-hero {
    background: var(--pub-hero-bg);
    position: relative;
    overflow: hidden;
    padding: 80px 0 0;
}
.pub-hero-particles { position: absolute; inset: 0; pointer-events: none; }

.min-vh-85 { min-height: 85vh; }

.pub-hero-badge {
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255,255,255,.2);
    color: rgba(255,255,255,.9);
    padding: .4rem 1rem;
    border-radius: 50px;
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .04em;
}
.badge-dot {
    width: 7px; height: 7px;
    background: #4ade80;
    border-radius: 50%;
    display: inline-block;
    animation: pulse-dot 2s infinite;
}
@keyframes pulse-dot {
    0%, 100% { transform: scale(1); opacity: 1; }
    50%       { transform: scale(1.4); opacity: .7; }
}

.pub-hero-title {
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    letter-spacing: -.02em;
}
.pub-hero-typed {
    color: #60a5fa;
    display: block;
    min-height: 1.3em;
}
.pub-hero-sub {
    font-size: 1.1rem;
    color: rgba(255,255,255,.75);
    max-width: 560px;
    line-height: 1.7;
}
.pub-hero-btn-primary {
    background: #fff;
    color: #0d6efd;
    font-weight: 700;
    border: none;
    padding: .85rem 2rem;
    border-radius: 12px;
    transition: transform .15s, box-shadow .15s;
}
.pub-hero-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 32px rgba(255,255,255,.25); }
.pub-hero-btn-secondary {
    border-color: rgba(255,255,255,.4);
    color: rgba(255,255,255,.9);
    padding: .85rem 2rem;
    border-radius: 12px;
    transition: background .15s, border-color .15s;
}
.pub-hero-btn-secondary:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.7); color: #fff; }

.pub-hero-stats { gap: 2rem; }
.pub-stat-num { font-size: 1.8rem; font-weight: 800; color: #fff; line-height: 1; }
.pub-stat-label { font-size: .8rem; color: rgba(255,255,255,.6); margin-top: .2rem; }
.pub-stat-divider { width: 1px; background: rgba(255,255,255,.2); align-self: stretch; }

/* Hero visual */
.pub-hero-visual { position: relative; padding: 2rem; }
.pub-hero-card {
    background: rgba(255,255,255,.95);
    backdrop-filter: blur(10px);
    border-radius: 14px;
    padding: .85rem 1rem;
    display: flex;
    align-items: center;
    gap: .75rem;
    box-shadow: var(--pub-shadow-md);
    animation: float 4s ease-in-out infinite;
    margin-bottom: .85rem;
}
.pub-hero-card-1 { animation-delay: 0s; }
.pub-hero-card-2 { animation-delay: .8s; }
.pub-hero-card-3 { animation-delay: 1.6s; }
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50%       { transform: translateY(-6px); }
}

.pub-orbit-icon {
    position: absolute;
    width: 40px; height: 40px;
    border-radius: 50%;
    background: rgba(255,255,255,.15);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1rem;
    animation: orbit 6s linear infinite;
}
.pub-orbit-1 { top: 10%; right: 5%; animation-delay: 0s; color: #fbbf24; }
.pub-orbit-2 { top: 50%; right: 0%;  animation-delay: 2s; color: #60a5fa; }
.pub-orbit-3 { bottom: 15%; right: 8%; animation-delay: 4s; color: #f87171; }
@keyframes orbit {
    0%, 100% { transform: translateY(0) scale(1); }
    50%       { transform: translateY(-12px) scale(1.1); }
}

/* Hero wave */
.pub-hero-wave { line-height: 0; margin-top: 2rem; }
.pub-hero-wave svg { display: block; width: 100%; height: 60px; }

/* ── STATS BAR ────────────────────────────────────────────────────────── */
.pub-stats-bar {
    background: white;
    border-bottom: 1px solid rgba(0,0,0,.06);
    padding: 2rem 0;
}
.pub-stat-item {
    padding: 1rem;
    border-right: 1px solid rgba(0,0,0,.06);
}
.pub-stat-item:last-child { border-right: none; }
.pub-stat-icon {
    width: 44px; height: 44px;
    background: rgba(13,110,253,.1);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--pub-primary);
    font-size: 1.1rem;
    margin: 0 auto .5rem;
}
.pub-stat-big { font-size: 1.8rem; font-weight: 800; color: #1a1a2e; line-height: 1; }
.pub-stat-text { font-size: .8rem; color: #6b7280; margin-top: .3rem; }

/* ── SECTIONS ─────────────────────────────────────────────────────────── */
.py-6 { padding-top: 5rem !important; padding-bottom: 5rem !important; }
.mb-6 { margin-bottom: 5rem !important; }

.pub-section-badge {
    display: inline-block;
    background: rgba(13,110,253,.1);
    color: var(--pub-primary);
    padding: .3rem .85rem;
    border-radius: 50px;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.pub-section-title { font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 800; letter-spacing: -.02em; color: #1a1a2e; }
.pub-section-sub { color: #6b7280; font-size: 1.05rem; max-width: 560px; margin: .75rem auto 0; }

/* ── FEATURE CARDS ────────────────────────────────────────────────────── */
.pub-feature-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.75rem;
    border: 1px solid rgba(0,0,0,.06);
    transition: transform .2s, box-shadow .2s;
    height: 100%;
}
.pub-feature-card:hover { transform: translateY(-4px); box-shadow: var(--pub-shadow-md); }

.pub-feature-icon {
    width: 52px; height: 52px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: white;
}
.pub-feature-icon-blue   { background: linear-gradient(135deg,#3b82f6,#1d4ed8); }
.pub-feature-icon-green  { background: linear-gradient(135deg,#22c55e,#15803d); }
.pub-feature-icon-purple { background: linear-gradient(135deg,#a855f7,#7c3aed); }
.pub-feature-icon-orange { background: linear-gradient(135deg,#f59e0b,#d97706); }
.pub-feature-icon-red    { background: linear-gradient(135deg,#ef4444,#b91c1c); }
.pub-feature-icon-teal   { background: linear-gradient(135deg,#14b8a6,#0d9488); }

/* ── JOB CARDS ────────────────────────────────────────────────────────── */
.pub-job-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.25rem;
    border: 1px solid rgba(0,0,0,.06);
    transition: transform .2s, box-shadow .2s;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.pub-job-card:hover { transform: translateY(-3px); box-shadow: var(--pub-shadow-md); }
.pub-job-logo { width: 44px; height: 44px; flex-shrink: 0; }
.pub-job-logo-placeholder {
    width: 44px; height: 44px;
    background: linear-gradient(135deg,#e0e7ff,#c7d2fe);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6366f1;
    font-size: 1.2rem;
}
.pub-apply-btn { font-size: .8rem; }

/* Badge types */
.pub-badge-type { background: rgba(13,110,253,.1); color: #1d4ed8; font-size: .7rem; }
.pub-badge-remote { background: rgba(34,197,94,.1); color: #15803d; font-size: .7rem; }
.pub-badge-exp { background: rgba(245,158,11,.1); color: #b45309; font-size: .7rem; }
.pub-badge-public { background: rgba(34,197,94,.1); color: #15803d; font-size: .7rem; }
.pub-badge-cat { background: rgba(168,85,247,.1); color: #7c3aed; font-size: .7rem; }

/* ── BUSINESS CARDS ───────────────────────────────────────────────────── */
.pub-biz-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.5rem;
    border: 1px solid rgba(0,0,0,.06);
    position: relative;
    overflow: hidden;
    transition: transform .2s, box-shadow .2s;
    text-align: center;
    cursor: pointer;
}
.pub-biz-card:hover { transform: translateY(-4px); box-shadow: var(--pub-shadow-md); }
.pub-biz-logo-placeholder {
    width: 56px; height: 56px;
    background: linear-gradient(135deg,#dbeafe,#bfdbfe);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #3b82f6;
    margin: 0 auto;
}
.pub-biz-overlay {
    position: absolute;
    inset: 0;
    background: rgba(13,110,253,.92);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    font-size: .9rem;
    opacity: 0;
    transition: opacity .2s;
    text-decoration: none;
    border-radius: var(--pub-card-radius);
}
.pub-biz-card:hover .pub-biz-overlay { opacity: 1; }

/* Business detail card (listing pages) */
.pub-biz-detail-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.25rem;
    border: 1px solid rgba(0,0,0,.06);
    transition: transform .2s, box-shadow .2s;
}
.pub-biz-detail-card:hover { transform: translateY(-3px); box-shadow: var(--pub-shadow-md); }
.pub-biz-logo-sm { width: 52px; height: 52px; }
.pub-biz-placeholder-sm {
    width: 52px; height: 52px;
    background: linear-gradient(135deg,#dbeafe,#bfdbfe);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: #3b82f6;
}

/* ── HOW IT WORKS ─────────────────────────────────────────────────────── */
.pub-how-section { background: linear-gradient(135deg,#f8f9fb 0%, #e8f0ff 100%); }
.pub-step-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 2rem;
    text-align: center;
    border: 1px solid rgba(0,0,0,.06);
    position: relative;
    transition: transform .2s, box-shadow .2s;
}
.pub-step-card:hover { transform: translateY(-4px); box-shadow: var(--pub-shadow-md); }
.pub-step-num {
    position: absolute;
    top: -14px; left: 50%;
    transform: translateX(-50%);
    background: var(--pub-primary);
    color: white;
    font-size: .75rem;
    font-weight: 800;
    padding: .2rem .6rem;
    border-radius: 20px;
    letter-spacing: .1em;
}
.pub-step-icon {
    width: 64px; height: 64px;
    background: linear-gradient(135deg,#dbeafe,#bfdbfe);
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    color: var(--pub-primary);
    margin: 0 auto;
}

/* ── TESTIMONIALS ─────────────────────────────────────────────────────── */
.pub-testimonial-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.75rem;
    border: 1px solid rgba(0,0,0,.06);
    height: 100%;
    transition: transform .2s, box-shadow .2s;
}
.pub-testimonial-card:hover { transform: translateY(-3px); box-shadow: var(--pub-shadow-md); }
.pub-testimonial-featured {
    background: linear-gradient(135deg,#0d6efd,#0dcaf0) !important;
    color: white;
    border-color: transparent !important;
}
.pub-testimonial-featured p { color: rgba(255,255,255,.9) !important; }
.pub-stars { color: #fbbf24; font-size: 1rem; letter-spacing: 2px; }
.pub-t-avatar {
    width: 42px; height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: .85rem;
    flex-shrink: 0;
}

/* ── CTA SECTION ──────────────────────────────────────────────────────── */
.pub-cta-section {
    background: linear-gradient(135deg, #1a1f2e 0%, #0d6efd 60%, #0dcaf0 100%);
    padding: 6rem 0;
}
.text-white-75 { color: rgba(255,255,255,.75); }

/* ── FOOTER ───────────────────────────────────────────────────────────── */
.pub-footer { background: #0f1318; color: rgba(255,255,255,.7); }
.pub-footer-brand {
    font-size: 1.4rem;
    font-weight: 800;
    color: white;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.pub-footer-brand i { color: #60a5fa; }
.pub-footer-brand em { font-style: normal; color: #60a5fa; }

.pub-footer-links { list-style: none; padding: 0; }
.pub-footer-links li { margin-bottom: .5rem; }
.pub-footer-links a { color: rgba(255,255,255,.5); text-decoration: none; font-size: .875rem; transition: color .15s; }
.pub-footer-links a:hover { color: white; }

.pub-social-link {
    width: 36px; height: 36px;
    background: rgba(255,255,255,.1);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,.65);
    font-size: 1rem;
    transition: background .15s, color .15s;
    text-decoration: none;
}
.pub-social-link:hover { background: var(--pub-primary); color: white; }

/* ── GUEST MODAL ──────────────────────────────────────────────────────── */
.pub-modal-icon {
    width: 80px; height: 80px;
    background: linear-gradient(135deg, #0d6efd, #0dcaf0);
    border-radius: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    font-size: 2rem;
    color: white;
}

/* ── PAGE HERO (inner pages) ──────────────────────────────────────────── */
.pub-page-hero {
    background: var(--pub-hero-bg);
    padding: 5rem 0 4rem;
    position: relative;
    overflow: hidden;
}
.pub-page-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.pub-page-hero-sm { padding: 3.5rem 0 3rem; }
.pub-page-hero-title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    color: white;
    letter-spacing: -.02em;
}
.pub-page-hero-sub { color: rgba(255,255,255,.7); font-size: 1.05rem; max-width: 600px; margin: 0 auto; }
.pub-breadcrumb { --bs-breadcrumb-divider-color: rgba(255,255,255,.4); --bs-breadcrumb-item-active-color: rgba(255,255,255,.8); }
.pub-breadcrumb .breadcrumb-item a { color: rgba(255,255,255,.6); text-decoration: none; }
.pub-breadcrumb .breadcrumb-item a:hover { color: white; }
.pub-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,.3); }

/* ── FILTER BAR ───────────────────────────────────────────────────────── */
.pub-filter-bar {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.25rem;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: var(--pub-shadow);
}
.pub-input {
    border-radius: 10px !important;
    border-color: rgba(0,0,0,.12) !important;
    font-size: .875rem !important;
}
.pub-input:focus {
    border-color: var(--pub-primary) !important;
    box-shadow: 0 0 0 .2rem rgba(13,110,253,.12) !important;
}

/* ── POST CARDS (public) ──────────────────────────────────────────────── */
.pub-post-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.5rem;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: var(--pub-shadow);
    transition: box-shadow .2s;
}
.pub-post-card:hover { box-shadow: var(--pub-shadow-md); }
.pub-post-content { line-height: 1.65; color: #374151; }
.pub-post-actions { margin-top: .5rem; }
.pub-action-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    background: none;
    border: none;
    color: #6b7280;
    font-size: .875rem;
    padding: .4rem .7rem;
    border-radius: 8px;
    cursor: pointer;
    transition: background .14s, color .14s;
    font-weight: 500;
}
.pub-action-btn:hover { background: #f0f2f5; color: var(--pub-primary); }

/* ── PROFESSIONALS ────────────────────────────────────────────────────── */
.pub-pro-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.5rem;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: var(--pub-shadow);
    transition: transform .2s, box-shadow .2s;
}
.pub-pro-card:hover { transform: translateY(-3px); box-shadow: var(--pub-shadow-md); }
.pub-pro-avatar-wrap { position: relative; display: inline-block; }
.pub-pro-avatar {
    width: 72px; height: 72px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid rgba(13,110,253,.15);
}

/* ── SIDEBAR (public) ─────────────────────────────────────────────────── */
.pub-sidebar-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.5rem;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: var(--pub-shadow);
    text-align: center;
}
.pub-sidebar-cta-icon {
    width: 56px; height: 56px;
    background: linear-gradient(135deg,#dbeafe,#bfdbfe);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    color: var(--pub-primary);
    margin: 0 auto;
}
.pub-sidebar-info-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.25rem;
    border: 1px solid rgba(0,0,0,.06);
}
.pub-locked-list { list-style: none; padding: 0; }
.pub-locked-list li { padding: .35rem 0; font-size: .875rem; color: #374151; }

/* ── EMPTY STATE ──────────────────────────────────────────────────────── */
.pub-empty-state {
    text-align: center;
    padding: 4rem 2rem;
    background: white;
    border-radius: var(--pub-card-radius);
    border: 1px solid rgba(0,0,0,.06);
}
.pub-empty-icon { font-size: 3rem; color: #d1d5db; }

/* ── INLINE CTA ───────────────────────────────────────────────────────── */
.pub-inline-cta {
    background: linear-gradient(135deg, #eff6ff, #dbeafe);
    border: 1px solid #bfdbfe;
    border-radius: var(--pub-card-radius);
    padding: 1.25rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}
.pub-inline-cta-icon { font-size: 1.5rem; color: var(--pub-primary); flex-shrink: 0; }

/* ── ABOUT PAGE ───────────────────────────────────────────────────────── */
.pub-check-icon {
    width: 32px; height: 32px;
    background: linear-gradient(135deg,#22c55e,#15803d);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
    font-size: .9rem;
}
.pub-about-visual { position: relative; }
.pub-about-blob {
    position: absolute;
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(13,110,253,.15), transparent);
    border-radius: 50%;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    animation: blob 4s ease-in-out infinite;
}
@keyframes blob {
    0%, 100% { transform: translate(-50%,-50%) scale(1); }
    50%       { transform: translate(-50%,-50%) scale(1.2); }
}
.pub-about-stat-card {
    background: white;
    border-radius: 14px;
    padding: 1.5rem;
    text-align: center;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: var(--pub-shadow);
    transition: transform .2s;
}
.pub-about-stat-card:hover { transform: translateY(-3px); }

/* About link cards */
.pub-about-link-card {
    display: block;
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 2.5rem 2rem;
    border: 1px solid rgba(0,0,0,.07);
    text-decoration: none;
    color: #1a1a2e;
    transition: transform .2s, box-shadow .2s;
    height: 100%;
}
.pub-about-link-card:hover { transform: translateY(-4px); box-shadow: var(--pub-shadow-md); color: #1a1a2e; }
.pub-alc-icon {
    width: 72px; height: 72px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    color: white;
}
.pub-alc-icon-blue   { background: linear-gradient(135deg,#3b82f6,#1d4ed8); }
.pub-alc-icon-purple { background: linear-gradient(135deg,#a855f7,#7c3aed); }
.pub-learn-link { color: var(--pub-primary); font-weight: 600; font-size: .9rem; }

/* Value cards */
.pub-value-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.75rem;
    border: 1px solid rgba(0,0,0,.06);
    height: 100%;
    transition: transform .2s, box-shadow .2s;
}
.pub-value-card:hover { transform: translateY(-3px); box-shadow: var(--pub-shadow-md); }

/* ── WHO WE ARE ───────────────────────────────────────────────────────── */
.pub-timeline { position: relative; padding-left: 2rem; }
.pub-timeline::before {
    content: '';
    position: absolute;
    left: 10px; top: 0; bottom: 0;
    width: 2px;
    background: linear-gradient(to bottom, #3b82f6, #a855f7, #22c55e, #f59e0b);
}
.pub-timeline-item { position: relative; padding-bottom: 2rem; }
.pub-timeline-dot {
    position: absolute;
    left: -2rem;
    top: 4px;
    width: 20px; height: 20px;
    border-radius: 50%;
    border: 3px solid white;
    box-shadow: 0 0 0 2px currentColor;
}
.pub-dot-blue   { background: #3b82f6; color: #3b82f6; }
.pub-dot-purple { background: #a855f7; color: #a855f7; }
.pub-dot-green  { background: #22c55e; color: #22c55e; }
.pub-dot-orange { background: #f59e0b; color: #f59e0b; }
.pub-timeline-content { padding-left: 1rem; }

/* Team cards */
.pub-team-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.5rem;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: var(--pub-shadow);
    transition: transform .2s, box-shadow .2s;
}
.pub-team-card:hover { transform: translateY(-3px); box-shadow: var(--pub-shadow-md); }
.pub-team-avatar {
    width: 60px; height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 1rem;
}

/* Team leader card */
.pub-team-leader-card {
    background: white;
    border-radius: var(--pub-card-radius);
    border: 1px solid rgba(0,0,0,.07);
    box-shadow: var(--pub-shadow);
    overflow: hidden;
    height: 100%;
    transition: transform .2s, box-shadow .2s;
}
.pub-team-leader-card:hover { transform: translateY(-4px); box-shadow: var(--pub-shadow-md); }
.pub-team-leader-avatar {
    width: 100%;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    font-weight: 800;
    color: white;
}
.pub-team-leader-info { padding: 1.5rem; }

/* Join team card */
.pub-join-team-card {
    background: linear-gradient(135deg,#eff6ff,#dbeafe);
    border: 1px solid #bfdbfe;
    border-radius: var(--pub-card-radius);
    padding: 2rem 2.5rem;
}

/* ── WHAT WE DO ───────────────────────────────────────────────────────── */
.pub-feature-detail-icon {
    width: 64px; height: 64px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.7rem;
    color: white;
}
.pub-fdi-blue   { background: linear-gradient(135deg,#3b82f6,#1d4ed8); }
.pub-fdi-green  { background: linear-gradient(135deg,#22c55e,#15803d); }
.pub-fdi-purple { background: linear-gradient(135deg,#a855f7,#7c3aed); }
.pub-fdi-orange { background: linear-gradient(135deg,#f59e0b,#d97706); }

.pub-feature-list { list-style: none; padding: 0; }
.pub-feature-list li { padding: .4rem 0; font-size: .9rem; color: #374151; }

.pub-feature-preview {
    background: #f8faff;
    border: 1px solid rgba(0,0,0,.07);
    border-radius: var(--pub-card-radius);
    padding: 1.5rem;
}
.pub-fp-blue   { background: linear-gradient(135deg,#eff6ff,#dbeafe); }
.pub-fp-green  { background: linear-gradient(135deg,#f0fdf4,#dcfce7); }
.pub-fp-purple { background: linear-gradient(135deg,#faf5ff,#f3e8ff); }
.pub-fp-orange { background: linear-gradient(135deg,#fffbeb,#fef3c7); }

.pub-fp-card {
    background: white;
    border-radius: 12px;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.pub-fp-avatar {
    width: 38px; height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: .75rem;
    flex-shrink: 0;
}
.pub-fp-logo {
    width: 44px; height: 44px;
    background: #eff6ff;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.pub-fp-biz-logo {
    width: 56px; height: 56px;
    background: linear-gradient(135deg,#dbeafe,#bfdbfe);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── CONTACT PAGE ─────────────────────────────────────────────────────── */
.pub-contact-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 2rem;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: var(--pub-shadow);
}
.pub-contact-info-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.5rem;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: var(--pub-shadow);
}
.pub-contact-social-card {
    background: white;
    border-radius: var(--pub-card-radius);
    padding: 1.25rem;
    border: 1px solid rgba(0,0,0,.06);
}
.pub-contact-cta {
    background: linear-gradient(135deg,#eff6ff,#dbeafe);
    border: 1px solid #bfdbfe;
    border-radius: var(--pub-card-radius);
    padding: 1.25rem;
}
.pub-cta-icon {
    width: 44px; height: 44px;
    background: var(--pub-primary);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    color: white;
    flex-shrink: 0;
}
.pub-contact-icon {
    width: 40px; height: 40px;
    background: rgba(13,110,253,.1);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    color: var(--pub-primary);
    flex-shrink: 0;
}
.pub-social-row {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .6rem .5rem;
    border-radius: 8px;
    text-decoration: none;
    color: #374151;
    transition: background .12s;
    font-size: .9rem;
}
.pub-social-row:hover { background: #f0f2f5; color: #1a1a2e; }

/* ── ACCORDION (FAQ) ──────────────────────────────────────────────────── */
.pub-accordion-item {
    border: 1px solid rgba(0,0,0,.08) !important;
    border-radius: 12px !important;
    margin-bottom: .6rem;
    overflow: hidden;
}
.pub-accordion-btn {
    font-weight: 600;
    font-size: .95rem;
    color: #1a1a2e !important;
    background: white !important;
    padding: 1rem 1.25rem;
    box-shadow: none !important;
}
.pub-accordion-btn:not(.collapsed) {
    color: var(--pub-primary) !important;
    background: rgba(13,110,253,.04) !important;
}
.pub-accordion-body { color: #6b7280; font-size: .9rem; line-height: 1.7; background: white; }
