/* ── Pgasus site.css ─────────────────────────────────────────────────── */

:root {
    --pg-dark:    #12151a;
    --pg-darker:  #0d0f13;
    --pg-brand:   #c8102e;
    --pg-brand-h: #a50d26;
    --pg-navbar-h: 64px;
}

/* ── Typography ──────────────────────────────────────────────────────── */
body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: #212529;
}

.letter-spacing-1 { letter-spacing: .08em; }
.letter-spacing-2 { letter-spacing: .18em; }

/* ── Navbar ──────────────────────────────────────────────────────────── */
.pg-navbar {
    background-color: rgba(18, 21, 26, .96);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(255,255,255,.06);
    min-height: var(--pg-navbar-h);
    transition: background .3s;
}

.pg-navbar .nav-link {
    color: rgba(255,255,255,.8);
    font-size: .88rem;
    font-weight: 500;
    padding: .45rem .7rem;
    transition: color .2s;
}
.pg-navbar .nav-link:hover,
.pg-navbar .nav-link.active { color: #fff; }
.pg-navbar .nav-link.active { color: var(--pg-brand) !important; }

/* ── Hero ────────────────────────────────────────────────────────────── */
.pg-hero {
    position: relative;
    height: 100vh;
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.pg-hero-sm {
    height: 52vh;
    min-height: 320px;
}

.pg-hero-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.pg-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,.55) 0%, rgba(0,0,0,.4) 100%);
    z-index: 1;
}

.pg-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 1rem;
}

.pg-hero-logo {
    height: 80px;
    max-width: 320px;
    filter: drop-shadow(0 2px 12px rgba(0,0,0,.5));
}

@media (min-width: 768px) {
    .pg-hero-logo { height: 110px; }
}

/* ── Page header (non-hero pages) ────────────────────────────────────── */
.pg-page-header {
    padding: calc(var(--pg-navbar-h) + 2rem) 0 2rem;
    background-color: var(--pg-dark);
    color: #fff;
    margin-bottom: 0;
}

.pg-page-header h1 { color: #fff; }
.pg-page-header .text-muted { color: rgba(255,255,255,.55) !important; }

/* ── Service cards ────────────────────────────────────────────────────── */
.pg-service-card {
    border: 1px solid rgba(255,255,255,.08);
    border-radius: .75rem;
    transition: border-color .2s, transform .2s;
}

.pg-service-card:hover {
    border-color: var(--pg-brand);
    transform: translateY(-2px);
}

/* ── Info cards (homepage grid) ─────────────────────────────────────── */
.pg-info-card {
    transition: transform .2s, box-shadow .2s;
    border: 1px solid #e9ecef;
}

.pg-info-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0,0,0,.1);
    border-color: var(--pg-brand);
}

/* ── Footer ──────────────────────────────────────────────────────────── */
.pg-footer {
    background-color: var(--pg-darker);
    padding: 3rem 0 2rem;
    margin-top: 3rem;
}

.pg-footer-link {
    color: rgba(255,255,255,.55);
    text-decoration: none;
    transition: color .2s;
}

.pg-footer-link:hover { color: #fff; }

/* ── Utility ─────────────────────────────────────────────────────────── */
.btn-danger,
.btn-danger:focus {
    background-color: var(--pg-brand);
    border-color: var(--pg-brand);
}
.btn-danger:hover,
.btn-danger:active {
    background-color: var(--pg-brand-h);
    border-color: var(--pg-brand-h);
}

.text-danger { color: var(--pg-brand) !important; }
.badge.bg-danger { background-color: var(--pg-brand) !important; }
.border-danger { border-color: var(--pg-brand) !important; }

.opacity-90 { opacity: .9; }

/* Makes the Pgasus SVG logo appear white on dark backgrounds */
.pg-logo-invert {
    filter: brightness(0) invert(1);
}

/* ── Sections need top padding because navbar is fixed ───────────────── */
section + section,
section:first-of-type {
    /* Only non-hero first sections need it; hero is 100vh so it's fine */
}

/* For pages with pg-page-header, sections that follow need no extra padding */
.pg-page-header + section { margin-top: 0; }

/* ── Accordion tweaks ────────────────────────────────────────────────── */
.accordion-button:not(.collapsed) {
    background-color: #f8f9fa;
    color: var(--pg-dark);
    box-shadow: none;
}

.accordion-button:focus { box-shadow: 0 0 0 .2rem rgba(200,16,46,.2); }

/* ── Koopje cards ────────────────────────────────────────────────────── */
.pg-koopje-card {
    transition: transform .2s, box-shadow .2s;
}
.pg-koopje-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0,0,0,.13) !important;
}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 576px) {
    .pg-hero-logo { height: 64px; }
    .pg-hero-sm { height: 42vh; }
}
