/* PassShow Inner Pages — v3.0.0 */
/* Covers: /exams, /aws, /pricing and all vendor pages */

/* ─── Inner pages: dark header (matches homepage) ───────── */
body:not(.home):not(.page-template-page-vendor) #masthead.affix-top {
    background: linear-gradient(135deg, #0f172a 0%, #1a365d 100%) !important;
    background-image: linear-gradient(135deg, #0f172a 0%, #1a365d 100%) !important;
}
body:not(.home):not(.page-template-page-vendor) #masthead.affix-top .main-menu > ul > li > a,
body:not(.home):not(.page-template-page-vendor) #masthead.affix-top nav > ul > li > a {
    color: #ffffff !important;
}

/* ─── Sticky state: white bg + dark text + dark logo ────── */
body:not(.home):not(.page-template-page-vendor) #masthead.affix {
    background-color: #ffffff !important;
}
body:not(.home):not(.page-template-page-vendor) #masthead.affix .main-menu > ul > li > a,
body:not(.home):not(.page-template-page-vendor) #masthead.affix nav > ul > li > a {
    color: #1e293b !important;
}
body:not(.home):not(.page-template-page-vendor) #masthead.affix img[src*="white-passhow-logo-main"] {
    content: url('https://passhow.com/wp-content/uploads/2026/02/passhow-logo-main.png') !important;
}

/* ─── Vendor pages: transparent header, white when sticky ── */
.page-template-page-vendor #masthead,
.page-template-page-vendor #masthead.affix-top {
    background-color: transparent !important;
    background-image: none !important;
}
.page-template-page-vendor #masthead.affix { background-color: #ffffff !important; }
.page-template-page-vendor #masthead.affix .main-menu > ul > li > a,
.page-template-page-vendor #masthead.affix nav > ul > li > a { color: #1e293b !important; }
.page-template-page-vendor #masthead.affix img[src*="white-passhow-logo-main"] {
    content: url('https://passhow.com/wp-content/uploads/2026/02/passhow-logo-main.png') !important;
}

/* ─── Base Reset ─────────────────────────────────────── */
#main-content.ph-page-exams,
#main-content.ph-page-vendor,
#main-content.ph-page-pricing {
    padding: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

/* ─── Container ──────────────────────────────────────── */
.ph-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ─── Breadcrumb ─────────────────────────────────────── */
.ph-breadcrumb {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #64748b;
    margin-bottom: 16px;
}
.ph-breadcrumb a {
    color: #64748b;
    text-decoration: none;
}
.ph-breadcrumb a:hover { color: #1e40af; text-decoration: underline; }
.ph-breadcrumb span { color: #94a3b8; }

/* ─── Buttons (shared with homepage) ─────────────────── */
.ph-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: all .2s;
    white-space: nowrap;
}
.ph-btn-primary  { background: #1e40af; color: #fff; }
.ph-btn-primary:hover  { background: #1d3a9e; color: #fff; transform: translateY(-1px); }
.ph-btn-outline  { background: transparent; color: #1e40af; border: 2px solid #1e40af; }
.ph-btn-outline:hover  { background: #1e40af; color: #fff; }
.ph-btn-cta      { background: linear-gradient(135deg,#f97316,#f59e0b); color: #fff; }
.ph-btn-cta:hover      { opacity: .9; color: #fff; transform: translateY(-1px); }
.ph-btn-lg  { padding: 14px 28px; font-size: 15px; }
.ph-btn-sm  { padding: 8px 16px; font-size: 13px; }

/* ─── Page Hero (Exams page) ─────────────────────────── */
.ph-page-hero {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0c2461 100%);
    color: #fff;
    padding: 140px 0 60px;
    position: relative;
    overflow: hidden;
}
.ph-page-hero::before {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(6,182,212,.12) 0%, transparent 70%);
    pointer-events: none;
}
.ph-page-hero .ph-breadcrumb,
.ph-page-hero .ph-breadcrumb a { color: #94a3b8 !important; }
.ph-page-hero .ph-breadcrumb a:hover { color: #fff !important; }
.ph-page-hero .ph-breadcrumb span { color: #64748b !important; }
.ph-page-hero h1 {
    font-family: 'Inter', sans-serif;
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 800;
    color: #fff;
    margin: 0 0 10px;
    line-height: 1.2;
}
.ph-page-hero p {
    font-size: 16px;
    color: #cbd5e1;
    margin: 0;
}

/* ─── Exams Layout ───────────────────────────────────── */
.ph-exams-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 32px;
    padding: 36px 0 60px;
    align-items: start;
}
@media (max-width: 768px) {
    .ph-exams-layout { grid-template-columns: 1fr; }
}

/* ─── Filter Sidebar ─────────────────────────────────── */
.ph-filter-sidebar {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    position: sticky;
    top: 80px;
}
.ph-filter-heading {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 0 0 10px;
    padding: 0 0 8px;
    border-bottom: 1px solid #f1f5f9;
}
.ph-filter-group { margin-bottom: 20px; }
.ph-filter-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #334155;
    padding: 5px 0;
    cursor: pointer;
}
.ph-filter-label input { accent-color: #1e40af; width: 15px; height: 15px; }
.ph-filter-count { color: #94a3b8; font-size: 12px; margin-left: auto; }
.ph-filter-actions { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.ph-filter-clear {
    text-align: center;
    font-size: 13px;
    color: #64748b;
    text-decoration: underline;
    cursor: pointer;
}
.ph-filter-clear:hover { color: #1e40af; }

/* ─── Exams Main + Toolbar ───────────────────────────── */
.ph-exams-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.ph-results-count { font-size: 14px; color: #64748b; font-style: italic; }

/* ─── Course Grid (shared: /exams and /vendor) ───────── */
.ph-course-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}
@media (max-width: 640px) {
    .ph-course-grid { grid-template-columns: 1fr; }
}

/* ─── Exam Card (inner pages — same design as homepage) ─ */
.ph-page-exams .exam-card,
.ph-page-vendor .exam-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: all .2s;
}
.ph-page-exams .exam-card:hover,
.ph-page-vendor .exam-card:hover {
    box-shadow: 0 8px 24px rgba(30,64,175,.1);
    transform: translateY(-3px);
    border-color: #1e40af;
}
.exam-vendor-badge {
    display: inline-block;
    background: #1e40af;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.exam-code-badge {
    display: inline-block;
    background: #f1f5f9;
    color: #475569;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 20px;
    margin-left: 6px;
}
.ph-page-exams .exam-card h3,
.ph-page-vendor .exam-card h3 {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    line-height: 1.4;
}
.exam-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.exam-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: #64748b;
}
.exam-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid #f1f5f9;
}
.exam-price {
    font-size: 13px;
    font-weight: 600;
    color: #1e40af;
}
.exam-price small { font-weight: 400; color: #94a3b8; font-size: 11px; display: block; }

/* ─── No Results ─────────────────────────────────────── */
.ph-no-results {
    text-align: center;
    padding: 60px 20px;
    color: #64748b;
}
.ph-no-results svg { color: #cbd5e1; margin-bottom: 16px; }
.ph-no-results h3 { font-size: 20px; font-weight: 700; color: #1e293b; margin: 0 0 8px; }
.ph-no-results p { font-size: 15px; }
.ph-no-results a { color: #1e40af; }

/* ─── Pagination ─────────────────────────────────────── */
.ph-pagination {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 36px;
    flex-wrap: wrap;
}
.ph-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    text-decoration: none;
    transition: all .2s;
}
.ph-pagination .page-numbers:hover,
.ph-pagination .page-numbers.current {
    background: #1e40af;
    color: #fff;
    border-color: #1e40af;
}
.ph-pagination .page-numbers.dots { border: none; background: none; cursor: default; }
.ph-pagination .prev,
.ph-pagination .next { width: auto; padding: 0 14px; gap: 4px; }

/* ─── Vendor page header — dark navy matches hero ───────── */
/* Header sits flush with dark hero, becomes white sticky on scroll */
.page-template-page-vendor #masthead,
.page-template-page-vendor #masthead.affix-top {
    background-color: #0f172a !important;
    background-image: none !important;
}
.page-template-page-vendor #masthead.affix {
    background-color: #ffffff !important;
}

/* ─── Vendor Hero — dark gradient, force over all Eduma rules ── */
.ph-vendor-hero,
.ph-page-vendor .ph-vendor-hero,
#main-content .ph-vendor-hero {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0c2461 100%) !important;
    background-color: #0f172a !important;
    padding: 140px 0 60px !important;
    border-bottom: 4px solid #1e40af !important;
    position: relative !important;
    overflow: hidden !important;
}
.ph-vendor-hero::before {
    content: '';
    position: absolute;
    top: -60px;
    right: -60px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(6,182,212,.12) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}
.ph-vendor-hero > * { position: relative; z-index: 1; }
.ph-vendor-hero .ph-breadcrumb,
.ph-vendor-hero .ph-breadcrumb a { color: #94a3b8 !important; }
.ph-vendor-hero .ph-breadcrumb a:hover { color: #fff !important; }
.ph-vendor-hero .ph-breadcrumb span { color: #64748b !important; }
.ph-vendor-hero-inner {
    display: flex !important;
    align-items: center !important;
    gap: 24px !important;
    margin-top: 8px !important;
}
@media (max-width: 600px) { .ph-vendor-hero-inner { flex-direction: column !important; align-items: flex-start !important; } }
.ph-vendor-badge-lg {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 72px !important;
    height: 72px !important;
    border-radius: 16px !important;
    background: #1e40af !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    padding: 0 12px !important;
    text-align: center !important;
    flex-shrink: 0 !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
}
.ph-vendor-hero h1 {
    font-family: 'Inter', sans-serif !important;
    font-size: clamp(22px, 3.5vw, 32px) !important;
    font-weight: 800 !important;
    color: #fff !important;
    margin: 0 0 8px !important;
    text-shadow: none !important;
}
.ph-vendor-hero p {
    font-size: 15px !important;
    color: #cbd5e1 !important;
    margin: 0 !important;
}
.ph-vendor-hero .ph-vendor-stat-pill {
    background: rgba(255,255,255,.1) !important;
    border-color: rgba(255,255,255,.2) !important;
    color: #e2e8f0 !important;
}

/* ─── Pricing Page ───────────────────────────────────── */
.ph-pricing-hero {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0c2461 100%);
    color: #fff;
    padding: 48px 0 44px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.ph-pricing-hero::before {
    content: '';
    position: absolute;
    top: -40px; right: -40px;
    width: 300px; height: 300px;
    background: radial-gradient(circle, rgba(6,182,212,.10) 0%, transparent 70%);
    pointer-events: none;
}
.ph-pricing-hero .ph-breadcrumb { justify-content: center; }
.ph-pricing-hero .ph-breadcrumb,
.ph-pricing-hero .ph-breadcrumb a { color: #94a3b8; }
.ph-pricing-hero h1 {
    font-family: 'Inter', sans-serif;
    font-size: clamp(28px, 5vw, 42px);
    font-weight: 800;
    margin: 0 0 12px;
}
.ph-pricing-hero p { font-size: 17px; color: #cbd5e1; margin: 0; }

.ph-pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    padding: 48px 0 20px;
    align-items: start;
}
@media (max-width: 900px) { .ph-pricing-grid { grid-template-columns: 1fr; max-width: 440px; margin: 0 auto; } }

.ph-pricing-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 32px 28px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.ph-pricing-featured {
    border-color: #1e40af;
    box-shadow: 0 16px 48px rgba(30,64,175,.15);
    transform: scale(1.03);
    z-index: 1;
}
@media (max-width: 900px) { .ph-pricing-featured { transform: none; } }

.ph-plan-badge {
    display: inline-block;
    background: #f1f5f9;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 20px;
    align-self: flex-start;
}
.ph-plan-badge-pro { background: #1e40af; color: #fff; }
.ph-plan-badge-annual { background: #009e60; color: #fff; }

.ph-plan-price {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 4px;
}
.ph-price-amount {
    font-family: 'Inter', sans-serif;
    font-size: 42px;
    font-weight: 800;
    color: #1e293b;
    line-height: 1;
}
.ph-price-period { font-size: 14px; color: #64748b; }
.ph-plan-name {
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 6px;
}
.ph-plan-tagline { font-size: 14px; color: #64748b; margin-bottom: 24px; }

.ph-plan-features {
    list-style: none;
    padding: 0;
    margin: 0 0 28px;
    display: flex;
    flex-direction: column;
    gap: 11px;
}
.ph-plan-features li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #334155;
}
.ph-feature-disabled { color: #94a3b8 !important; }

.ph-plan-cta { width: 100%; justify-content: center; }
.ph-plan-note { text-align: center; font-size: 12px; color: #94a3b8; margin-top: 12px; }

/* ─── Pricing Trust Strip ────────────────────────────── */
.ph-pricing-trust {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 32px;
    padding: 32px 0;
    border-top: 1px solid #e2e8f0;
    margin-top: 16px;
}
.ph-trust-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #475569;
    font-weight: 500;
}

/* ─── Pricing FAQ ────────────────────────────────────── */
.ph-pricing-faq {
    padding: 48px 0 60px;
}
.ph-pricing-faq h2 {
    font-family: 'Inter', sans-serif;
    font-size: 26px;
    font-weight: 800;
    color: #1e293b;
    text-align: center;
    margin: 0 0 32px;
}
.ph-pfaq-list {
    max-width: 680px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.ph-pfaq-item {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
}
.ph-pfaq-q {
    width: 100%;
    background: #fff;
    border: none;
    text-align: left;
    padding: 18px 20px;
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #1e293b;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.ph-pfaq-q::after {
    content: '+';
    font-size: 20px;
    color: #1e40af;
    flex-shrink: 0;
}
.ph-pfaq-q[aria-expanded="true"]::after { content: '−'; }
.ph-pfaq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    padding: 0 20px 18px;
    font-size: 14px;
    color: #475569;
    line-height: 1.7;
}
.ph-pfaq-item.open .ph-pfaq-a { max-height: 600px; }
.ph-pfaq-a a { color: #1e40af; }

/* ─── Google Fonts fallback (if Inter not loaded) ────── */
body.ph-page-exams,
body.ph-page-vendor,
body.ph-page-pricing {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ══════════════════════════════════════════════════════════
   VENDOR DETAIL SECTIONS — shared across all vendor pages
   ══════════════════════════════════════════════════════════ */

.ph-vendor-section { padding: 64px 20px !important; background: #fff !important; display: block !important; }
.ph-vendor-section.alt { background: #f8fafc !important; }
.ph-vendor-section > .ph-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.ph-vendor-section h2 { font-size: clamp(22px,3vw,32px) !important; font-weight: 800 !important; color: #0f172a !important; margin: 0 0 12px !important; }
.ph-vendor-section .ph-section-sub { font-size: 16px !important; color: #64748b !important; margin: 0 0 36px !important; max-width: 640px; display: block; }

/* ─── Stat pills ─────────────────────────────────────────── */
.ph-vendor-stats-row { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; margin-top: 28px !important; }
.ph-vendor-stat-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #eff6ff !important;
    border: 1px solid #bfdbfe !important;
    color: #1e40af !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 6px 14px !important;
    border-radius: 100px !important;
    text-decoration: none !important;
}

/* ─── Certification Tracks grid ──────────────────────────── */
.ph-tracks-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(220px,1fr)) !important;
    gap: 20px !important;
    margin-top: 8px !important;
    list-style: none !important;
    padding: 0 !important;
}
.ph-track-card {
    background: #fff !important;
    border: 1px solid #e2e8f0 !important;
    border-left: 4px solid #1ba0d7 !important;
    border-radius: 12px !important;
    padding: 24px 20px !important;
    display: block !important;
    transition: box-shadow .2s, transform .2s;
}
.ph-track-card:hover { box-shadow: 0 8px 28px rgba(30,64,175,.12); transform: translateY(-2px); }
.ph-track-card .ph-track-level {
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .8px !important;
    text-transform: uppercase !important;
    color: #1ba0d7 !important;
    margin: 0 0 8px !important;
    display: block !important;
}
.ph-track-card h3 { font-size: 16px !important; font-weight: 700 !important; color: #0f172a !important; margin: 0 0 8px !important; }
.ph-track-card p { font-size: 13px !important; color: #64748b !important; line-height: 1.6 !important; margin: 0 0 14px !important; }
.ph-track-card .ph-track-exams {
    display: inline-block !important;
    background: #eff6ff !important;
    color: #1e40af !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 3px 10px !important;
    border-radius: 100px !important;
}

/* ─── Why PassHow features grid ──────────────────────────── */
.ph-vendor-features {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(200px,1fr)) !important;
    gap: 24px !important;
    margin-top: 8px !important;
}
.ph-vendor-feature {
    text-align: center !important;
    padding: 28px 20px !important;
    background: #fff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    display: block !important;
}
.ph-vendor-feature .ph-vf-icon {
    font-size: 36px !important;
    line-height: 1 !important;
    margin: 0 0 12px !important;
    display: block !important;
}
.ph-vendor-feature h3 { font-size: 15px !important; font-weight: 700 !important; color: #0f172a !important; margin: 0 0 8px !important; }
.ph-vendor-feature p { font-size: 13px !important; color: #64748b !important; line-height: 1.6 !important; margin: 0 !important; }

/* ─── Vendor FAQ ─────────────────────────────────────────── */
.ph-vendor-faq-list { max-width: 760px; margin: 0 auto; }
.ph-vendor-faq-list .faq-item {
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    margin-bottom: 10px !important;
    overflow: hidden !important;
    background: #fff !important;
}
.ph-vendor-faq-list .faq-question {
    width: 100% !important;
    background: #fff !important;
    background-color: #fff !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-align: left !important;
    padding: 18px 20px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    cursor: pointer !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 12px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}
.ph-vendor-faq-list .faq-question:hover { background: #f8fafc !important; color: #1e40af !important; }
.ph-vendor-faq-list .faq-chevron { flex-shrink: 0; transition: transform .25s; color: #1e40af; }
.ph-vendor-faq-list .faq-question[aria-expanded="true"] .faq-chevron { transform: rotate(180deg); }
.ph-vendor-faq-list .faq-answer {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.3s ease !important;
    padding: 0 20px 18px !important;
    font-size: 14px !important;
    color: #475569 !important;
    line-height: 1.7 !important;
}
.ph-vendor-faq-list .faq-item.open .faq-answer { max-height: 600px !important; }

/* ─── Responsive ─────────────────────────────────────────── */
@media (max-width: 600px) {
    .ph-vendor-section { padding: 44px 16px !important; }
    .ph-tracks-grid { grid-template-columns: 1fr !important; }
    .ph-vendor-features { grid-template-columns: 1fr !important; }
}

/* ================================================
   LEARNPRESS QUIZ — CUSTOM EXAM UI
   ================================================ */

#learn-press-quiz-app { max-width:860px !important; margin:0 auto !important; font-family:inherit !important; }

/* Intro card (before starting) */
.quiz-intro { background:#fff !important; border:1px solid #e2e8f0 !important; border-radius:12px !important; padding:32px !important; box-shadow:0 2px 12px rgba(0,0,0,.06) !important; }
.quiz-intro-item { display:flex !important; justify-content:space-between !important; padding:12px 0 !important; border-bottom:1px solid #f1f5f9 !important; font-size:15px !important; }
.quiz-intro-item:last-child { border-bottom:none !important; }
.quiz-intro-item__title { font-weight:600 !important; color:#374151 !important; }
.quiz-intro-item__content { color:#1e40af !important; font-weight:500 !important; }

/* Quiz content wrapper */
.quiz-content { background:#fff !important; border-radius:12px !important; box-shadow:0 2px 16px rgba(0,0,0,.08) !important; overflow:hidden !important; }

/* Top bar: Question X of Y + Timer */
.questions-index { background:#1e293b !important; color:#fff !important; padding:14px 28px !important; font-size:14px !important; font-weight:500 !important; display:flex !important; justify-content:space-between !important; align-items:center !important; }
.lp-icon-stopwatch { background:#dc2626 !important; color:#fff !important; padding:4px 12px !important; border-radius:6px !important; font-size:15px !important; font-weight:700 !important; font-family:monospace !important; letter-spacing:1px !important; }

/* Question area */
.quiz-questions { padding:32px 36px !important; }
.question-index { display:inline-block !important; background:#1e40af !important; color:#fff !important; font-size:12px !important; font-weight:700 !important; padding:3px 10px !important; border-radius:4px !important; margin-bottom:12px !important; text-transform:uppercase !important; }
.question-title { font-size:17px !important; font-weight:600 !important; color:#1e293b !important; line-height:1.65 !important; margin-bottom:24px !important; }

/* Answer options */
.answer-options { list-style:none !important; padding:0 !important; margin:0 !important; display:flex !important; flex-direction:column !important; gap:10px !important; }
.answer-options li { border:2px solid #e2e8f0 !important; border-radius:8px !important; padding:14px 18px !important; cursor:pointer !important; transition:border-color .18s,background .18s !important; display:flex !important; align-items:center !important; gap:12px !important; background:#fff !important; }
.answer-options li:hover { border-color:#3b82f6 !important; background:#eff6ff !important; }
.answer-options li.checked { border-color:#1e40af !important; background:#eff6ff !important; }
.answer-options li.correct { border-color:#16a34a !important; background:#f0fdf4 !important; }
.answer-options li.incorrect { border-color:#dc2626 !important; background:#fef2f2 !important; }
.option-check { width:18px !important; height:18px !important; flex-shrink:0 !important; accent-color:#1e40af !important; }
.option-title { font-size:15px !important; color:#374151 !important; line-height:1.5 !important; }

/* Explanation shown after answering */
.question-explanation-content { margin-top:16px !important; padding:14px 18px !important; background:#f0f9ff !important; border-left:4px solid #0ea5e9 !important; border-radius:0 8px 8px 0 !important; font-size:14px !important; color:#0c4a6e !important; line-height:1.6 !important; }

/* Prev / Next navigation */
.nav-links { padding:20px 36px !important; border-top:1px solid #f1f5f9 !important; display:flex !important; justify-content:space-between !important; align-items:center !important; }
.nav-links .nav-prev { background:#f1f5f9 !important; color:#374151 !important; padding:10px 24px !important; border-radius:8px !important; font-weight:600 !important; text-decoration:none !important; }
.nav-links .nav-next { background:#1e40af !important; color:#fff !important; padding:10px 24px !important; border-radius:8px !important; font-weight:600 !important; text-decoration:none !important; }
.submit-quiz .lp-button { background:#16a34a !important; color:#fff !important; border:none !important; padding:11px 28px !important; border-radius:8px !important; font-size:15px !important; font-weight:600 !important; cursor:pointer !important; }

/* Question number grid */
.questions-pagination { padding:16px 36px !important; display:flex !important; flex-wrap:wrap !important; gap:8px !important; border-top:1px solid #f1f5f9 !important; background:#fafafa !important; }
.questions-pagination a,.questions-pagination span { width:34px !important; height:34px !important; border-radius:6px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; font-size:13px !important; font-weight:600 !important; border:2px solid #e2e8f0 !important; color:#374151 !important; text-decoration:none !important; }
.questions-pagination .current { background:#1e40af !important; border-color:#1e40af !important; color:#fff !important; }
.questions-pagination .answered { background:#16a34a !important; border-color:#16a34a !important; color:#fff !important; }

/* Results screen */
.quiz-attempts { background:#fff !important; border-radius:12px !important; box-shadow:0 2px 16px rgba(0,0,0,.08) !important; padding:48px 40px !important; text-align:center !important; }
.result-heading { font-size:28px !important; font-weight:800 !important; margin-bottom:8px !important; }
.result-grade { font-size:52px !important; font-weight:800 !important; color:#1e293b !important; line-height:1.1 !important; margin:16px 0 !important; }
.result-message { font-size:16px !important; color:#64748b !important; margin-bottom:32px !important; }
.result-statistic { display:flex !important; justify-content:center !important; gap:24px !important; flex-wrap:wrap !important; margin:24px 0 !important; }
.result-statistic-field { background:#f8fafc !important; border:1px solid #e2e8f0 !important; border-radius:10px !important; padding:16px 24px !important; min-width:120px !important; text-align:center !important; }
.quiz-attempts .lp-button { background:#1e40af !important; color:#fff !important; border:none !important; padding:12px 28px !important; border-radius:8px !important; font-size:15px !important; font-weight:600 !important; margin:8px 4px !important; cursor:pointer !important; }

@media(max-width:640px) {
    .quiz-questions,.nav-links,.questions-pagination { padding-left:18px !important; padding-right:18px !important; }
    .quiz-attempts { padding:32px 20px !important; }
    .result-grade { font-size:40px !important; }
    .result-statistic { gap:12px !important; }
}

/* ================================================
   VENDORS PAGE — /vendors
   ================================================ */

#main-content.ph-page-vendors { padding:0 !important; max-width:none !important; width:100% !important; }

/* Hero */
.ph-vendors-page-hero { background:linear-gradient(135deg,#0f172a 0%,#1e293b 50%,#0c2461 100%) !important; padding:140px 24px 64px !important; text-align:center !important; position:relative !important; overflow:hidden !important; }
.ph-vendors-page-hero::before { content:''; position:absolute; top:-100px; right:-100px; width:400px; height:400px; background:radial-gradient(circle,rgba(6,182,212,.15) 0%,transparent 70%); pointer-events:none; }
.ph-vendors-page-hero .hero-badge { display:inline-block !important; background:rgba(6,182,212,.15) !important; border:1px solid rgba(6,182,212,.3) !important; color:#06b6d4 !important; font-size:12px !important; font-weight:700 !important; letter-spacing:1px !important; text-transform:uppercase !important; padding:6px 16px !important; border-radius:100px !important; margin-bottom:16px !important; }
.ph-vendors-page-hero h1 { font-size:clamp(28px,4vw,48px) !important; font-weight:800 !important; color:#fff !important; margin:0 0 16px !important; line-height:1.2 !important; }
.ph-vendors-page-hero h1 .highlight { background:linear-gradient(135deg,#06b6d4,#f97316) !important; -webkit-background-clip:text !important; -webkit-text-fill-color:transparent !important; background-clip:text !important; }
.ph-vendors-page-hero p { color:#94a3b8 !important; font-size:17px !important; max-width:560px !important; margin:0 auto !important; }

/* Grid section */
.ph-vendors-grid-section { background:#f4f7fb !important; padding:64px 0 !important; }
.ph-vendors-grid-section .ph-container { max-width:1200px !important; margin:0 auto !important; padding:0 24px !important; }
.ph-vendors-grid-section .section-header { text-align:center !important; margin-bottom:48px !important; }
.ph-vendors-grid-section .eyebrow { display:inline-block !important; background:linear-gradient(135deg,rgba(30,64,175,.1),rgba(6,182,212,.1)) !important; border:1px solid rgba(6,182,212,.25) !important; color:#1e40af !important; font-size:12px !important; font-weight:700 !important; letter-spacing:1px !important; text-transform:uppercase !important; padding:5px 14px !important; border-radius:100px !important; margin-bottom:12px !important; }
.ph-vendors-grid-section h2 { font-size:clamp(24px,3.5vw,38px) !important; font-weight:800 !important; color:#0f172a !important; margin-bottom:12px !important; }
.ph-vendors-grid-section .section-header p { color:#64748b !important; font-size:16px !important; max-width:560px !important; margin:0 auto !important; }

/* Vendor cards */
.ph-page-vendors .vendors-grid { display:grid !important; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)) !important; gap:24px !important; }
.ph-page-vendors .vendor-card { background:#fff !important; border:1px solid #e2e8f0 !important; border-radius:12px !important; padding:28px 20px !important; text-align:center !important; text-decoration:none !important; display:block !important; transition:box-shadow .2s,transform .2s !important; }
.ph-page-vendors .vendor-card:hover { box-shadow:0 8px 28px rgba(30,64,175,.12) !important; transform:translateY(-2px) !important; border-color:#06b6d4 !important; }
.ph-page-vendors .vendor-card h3 { font-size:16px !important; font-weight:700 !important; color:#0f172a !important; margin:12px 0 4px !important; }
.ph-page-vendors .vendor-card span { font-size:13px !important; color:#64748b !important; }
.ph-page-vendors .v-count { display:inline-block !important; margin-top:8px !important; font-size:11px !important; font-weight:600 !important; color:#1e40af !important; background:#eff6ff !important; border-radius:100px !important; padding:2px 10px !important; }

@media(max-width:600px) {
    .ph-vendors-page-hero { padding:120px 16px 48px !important; }
    .ph-page-vendors .vendors-grid { grid-template-columns:repeat(2,1fr) !important; }
}

/* Header nav colors handled via wp_head inline style in functions.php (passhow_inner_page_nav_fix)
   for inner pages. Homepage header handled by passhow-home.css. */
