/*
Theme Name:        PriceNepal Child
Theme URI:         https://pricenepal.com
Description:       PriceNepal child theme for Kadence. Handles custom nav, footer, fonts, and full design system for pricenepal.com
Author:            PriceNepal
Author URI:        https://pricenepal.com
Template:          kadence
Version:           1.0.0
License:           GNU General Public License v2 or later
Text Domain:       pricenepal-child
*/

/* ============================================================
   PRICENEPAL DESIGN SYSTEM
   All CSS variables and global overrides live here.
   These apply to EVERY page on the site automatically.
   ============================================================ */

:root {
    --pn-red:       #C8102E;
    --pn-dark-red:  #9B0B22;
    --pn-deep:      #0f0f0f;
    --pn-gold:      #F5A623;
    --pn-green:     #10b981;
    --pn-gray:      #6b7280;
    --pn-off:       #f7f7f7;
    --pn-border:    #e8e8e8;
    --pn-shadow:    0 2px 20px rgba(0,0,0,0.07);
    --pn-font-head: 'Teko', sans-serif;
    --pn-font-body: 'DM Sans', sans-serif;
}

/* ── GLOBAL BODY ── */
body {
    font-family: var(--pn-font-body) !important;
    background: #f5f5f5 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ── HIDE KADENCE DEFAULT HEADER — Our custom nav replaces it ── */
/* This is the key fix — hides the Kadence header on ALL pages */
.site-header,
.site-header .site-branding,
.site-header .site-title,
.site-header .site-description,
header.site-header {
    display: none !important;
}

/* ── HIDE KADENCE DEFAULT FOOTER — Our custom footer replaces it ── */
.site-footer,
footer.site-footer {
    display: none !important;
}

/* ── HIDE POST/PAGE TITLES — Our article HTML has its own ── */
/* Only hides on single posts and pages that use our custom HTML */
.single-post .entry-header,
.single-post .entry-title,
.page .entry-header,
.page .entry-title {
    display: none !important;
}

/* ── REMOVE KADENCE CONTENT PADDING ── */
/* Without this, Kadence adds padding that pushes our content down */
.entry-content,
.wp-block-post-content {
    padding:   0 !important;
    margin:    0 !important;
    max-width: 100% !important;
}

.site-content,
.content-area,
#primary,
.site-main,
.wp-site-blocks {
    padding-top: 0 !important;
    margin-top:  0 !important;
}

/* ── PRICENEPAL SHARED NAV STYLES ── */
/* These apply to the .pn-nav element in every page's HTML */
.pn-nav {
    position:        sticky;
    top:             0;
    z-index:         9999;
    background:      var(--pn-deep);
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         0 36px;
    height:          62px;
    box-shadow:      0 2px 24px rgba(0,0,0,0.5);
    /* Sticky nav needs width: 100% to stretch full page */
    width:           100%;
    box-sizing:      border-box;
}

.pn-nav-logo {
    display:     flex;
    align-items: center;
    gap:         9px;
    text-decoration: none;
}

.pn-logo-icon {
    width:           34px;
    height:          34px;
    background:      var(--pn-red);
    border-radius:   8px;
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-size:       1rem;
}

.pn-logo-text {
    font-family:  var(--pn-font-head);
    font-size:    1.55rem;
    color:        white;
    letter-spacing: 1px;
}
.pn-logo-text span { color: var(--pn-gold); }

.pn-nav-links {
    display:     flex;
    align-items: center;
    gap:         4px;
    list-style:  none;
    margin:      0;
    padding:     0;
}

.pn-nav-links a {
    color:           rgba(255,255,255,0.7);
    text-decoration: none;
    font-size:       0.83rem;
    font-weight:     500;
    padding:         5px 10px;
    border-radius:   6px;
    transition:      all 0.2s;
}
.pn-nav-links a:hover {
    color:      white;
    background: rgba(255,255,255,0.09);
}

.pn-nav-search {
    display:     flex;
    align-items: center;
    background:  rgba(255,255,255,0.08);
    border:      1px solid rgba(255,255,255,0.12);
    border-radius: 8px;
    padding:     0 12px;
    gap:         7px;
    height:      36px;
    width:       210px;
    transition:  all 0.2s;
}
.pn-nav-search:focus-within {
    border-color: var(--pn-red);
    width:        260px;
}
.pn-nav-search input {
    background:  none;
    border:      none;
    outline:     none;
    color:       white;
    font-size:   0.83rem;
    width:       100%;
    font-family: var(--pn-font-body);
}
.pn-nav-search input::placeholder { color: rgba(255,255,255,0.3); }

.pn-hamburger {
    display:    none;
    background: none;
    border:     none;
    color:      white;
    font-size:  1.4rem;
    cursor:     pointer;
    padding:    4px 8px;
}

/* ── PRICENEPAL FOOTER STYLES ── */
.pn-footer {
    background: #080808;
    padding:    52px 36px 26px;
    margin-top: 40px;
    /* Full width */
    width:      100%;
    box-sizing: border-box;
}

.pn-footer-inner {
    max-width: 1200px;
    margin:    0 auto;
}

.pn-footer-grid {
    display:               grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap:                   40px;
    padding-bottom:        36px;
    border-bottom:         1px solid rgba(255,255,255,0.06);
}

.pn-footer-desc {
    color:      rgba(255,255,255,0.3);
    font-size:  0.8rem;
    line-height: 1.7;
    margin-top: 12px;
    max-width:  240px;
}

.pn-footer-col h4 {
    color:          rgba(255,255,255,0.4);
    font-size:      0.68rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight:    700;
    margin-bottom:  14px;
}

.pn-footer-col a {
    display:         block;
    color:           rgba(255,255,255,0.28);
    text-decoration: none;
    font-size:       0.8rem;
    padding:         4px 0;
    transition:      color 0.2s;
}
.pn-footer-col a:hover { color: white; }

.pn-footer-bottom {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding-top:     22px;
    color:           rgba(255,255,255,0.18);
    font-size:       0.72rem;
    flex-wrap:       wrap;
    gap:             8px;
}
.pn-footer-np { color: var(--pn-red); }

/* ── REVEAL ANIMATION — used across all pages ── */
.pn-reveal {
    opacity:    0;
    transform:  translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}
.pn-reveal.pn-visible {
    opacity:   1;
    transform: none;
}

/* ── RESPONSIVE ── */
@media (max-width: 860px) {
    .pn-nav { padding: 0 16px; }

    /* Mobile nav drops down as a fullscreen menu */
    .pn-nav-links {
        display:       none;
        position:      fixed;
        top:           62px;
        left:          0;
        right:         0;
        background:    var(--pn-deep);
        flex-direction: column;
        padding:       16px;
        gap:           4px;
        z-index:       9998;
        border-top:    1px solid rgba(255,255,255,0.08);
        box-shadow:    0 10px 30px rgba(0,0,0,0.5);
    }
    .pn-nav-links.open { display: flex; }
    .pn-hamburger { display: block; }
    .pn-nav-search { display: none; }

    .pn-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }
    .pn-footer { padding: 36px 16px 20px; }
}

@media (max-width: 480px) {
    .pn-footer-grid { grid-template-columns: 1fr; }
    .pn-footer-bottom { flex-direction: column; text-align: center; }
}
