/**
 * P4PN v2.9 — global polish: header, blog, portfolio, about, services shell.
 */

/* Header stays fixed on all fluid/cover routes */
html:not(.p4p-preloader-active) body.p4pn-fluid .p4p-header,
html:not(.p4p-preloader-active) body.p4pn-cover-page .p4p-header,
html:not(.p4p-preloader-active) body.p4p-home .p4p-header,
html:not(.p4p-preloader-active) body.p4p-page--blog .p4p-header,
html:not(.p4p-preloader-active) body.p4p-page--portfolio .p4p-header,
html:not(.p4p-preloader-active) body.p4p-page--about .p4p-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 10000 !important;
    transform: none !important;
    translate: none !important;
}

/* Blog — minimal gap below header */
body.p4pn-fluid.p4p-page--blog:not(.p4p-page--blog-single) .p4p-services-main__inner,
body.p4pn-fluid.p4p-page--blog:not(.p4p-page--blog-single) .p4p-page-main__inner {
    padding-top: calc(var(--p4p-header, 72px) + 0.25rem) !important;
}

body.p4pn-fluid .p4pn-blog-hub {
    padding-top: 0 !important;
}

body.p4pn-fluid .p4pn-blog-hub__head {
    margin-top: 0 !important;
    margin-bottom: 0.45rem !important;
}

body.p4pn-fluid .p4pn-blog-hub__toolbar {
    margin-top: 0.25rem !important;
}

body.p4pn-fluid .p4pn-blog-hub__shortcuts {
    margin-top: 0.2rem !important;
    flex-wrap: wrap;
    justify-content: center;
}

body.p4pn-fluid .p4pn-blog-grid {
    gap: clamp(0.65rem, 1.5cqi, 1rem) !important;
    justify-items: stretch;
}

/* Blog card hover — full sweep */
body.p4pn-fluid .p4p-blog-adv-card::before,
body.p4pn-fluid .p4p-blog-card::before {
    background: linear-gradient(125deg, var(--card-accent, #e8a87c) 0%, rgba(167, 139, 250, 0.65) 55%, rgba(6, 182, 212, 0.35) 100%) !important;
}

@media (hover: hover) {
    body.p4pn-fluid .p4p-blog-adv-card:hover::before,
    body.p4pn-fluid .p4p-blog-card:hover::before {
        opacity: 0.28 !important;
    }
}

/* Portfolio — professional grid + faster paint */
body.p4pn-fluid.p4p-page--portfolio .p4p-portfolio-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)) !important;
    gap: clamp(0.75rem, 1.5cqi, 1.1rem) !important;
    align-items: stretch !important;
}

body.p4pn-fluid.p4p-page--portfolio .p4p-portfolio-card {
    contain: layout paint style;
    background: linear-gradient(160deg, rgba(12, 10, 20, 0.94), rgba(8, 8, 14, 0.9)) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
}

body.p4pn-fluid.p4p-page--portfolio .p4p-pf-hero__grid,
body.p4pn-fluid.p4p-page--portfolio .p4p-section__head--center,
body.p4pn-fluid.p4p-page--about .abt-hero-studio__grid,
body.p4pn-fluid.p4p-page--about .p4p-section__head--center {
    text-align: center !important;
    margin-inline: auto !important;
}

body.p4pn-fluid.p4p-page--about .bento-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important;
    gap: clamp(0.65rem, 1.4cqi, 1rem) !important;
}

body.p4pn-fluid.p4p-page--about .bento-card,
body.p4pn-fluid.p4p-page--about .why-card {
    text-align: left;
    background: rgba(10, 10, 18, 0.88) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.p4pn-fluid.p4p-page--about .abt-hero-studio__copy,
body.p4pn-fluid.p4p-page--about .abt-hero-studio__lead {
    margin-inline: auto;
    max-width: 42rem;
}

body.p4pn-fluid.p4p-page--portfolio .p4p-pf-hero__lead,
body.p4pn-fluid.p4p-page--portfolio .p4p-portfolio-main__inner > .p4p-section-intro {
    margin-inline: auto;
    max-width: 40rem;
}

/* Services — kill unstyled blocks, center hero */
body.p4pn-services .p4pn-cover-shell,
body.p4pn-services .p4pn-svc-section {
    font-family: var(--p4p-font-ui, system-ui, sans-serif) !important;
    color: #e2e8f0 !important;
}

body.p4pn-services .p4pn-svc-catalog,
body.p4pn-services .p4pn-svc-section__body,
body.p4pn-services .p4p-dental-packages {
    max-width: min(100%, 920px);
    margin-inline: auto;
    text-align: center;
}

body.p4pn-services .p4pn-svc-catalog__grid,
body.p4pn-services .p4p-dental-packages__grid {
    justify-content: center;
    justify-items: stretch;
}

body.p4pn-services .p4pn-tl__node {
    cursor: pointer !important;
    transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

@media (hover: hover) {
    body.p4pn-services .p4pn-tl__node:hover {
        background: rgba(167, 139, 250, 0.12) !important;
        transform: translateX(-2px);
    }
}

body.p4pn-services .p4p-page-mesh {
    opacity: 1 !important;
}

/* Inner pages — lighter mesh for perf */
body.p4pn-fluid.p4p-page--portfolio .p4p-page-mesh,
body.p4pn-fluid.p4p-page--about .p4p-page-mesh {
    opacity: 0.72 !important;
}

html.p4p-perf-tier-2 body.p4pn-fluid.p4p-page--portfolio .p4p-page-mesh,
html.p4p-perf-tier-2 body.p4pn-fluid.p4p-page--about .p4p-page-mesh {
    opacity: 0.55 !important;
}
