/* ============================================================
   JAI DURGA MARKETING — SHARED BRAND SYSTEM
   One palette and one header/footer treatment across every page.
   ============================================================ */

:root {
    --brand-primary: #70171b;
    --brand-primary-hover: #861f24;
    --brand-primary-dark: #3d0d11;
    --brand-primary-deep: #26080b;
    --brand-accent: #d7b35c;
    --brand-accent-light: #f1d994;
    --brand-accent-dark: #a67c25;
    --brand-ivory: #f8f5ee;
    --brand-surface: #ffffff;
    --brand-ink: #192335;
    --brand-muted: #687487;
    --brand-line: #e7e0d4;
    --brand-success: #19764a;
    --brand-shadow: 0 18px 45px rgba(45, 20, 13, .1);

    /* Map legacy page variables to the shared system. */
    --primary-color: var(--brand-primary);
    --primary: var(--brand-primary);
    --primary-dark: var(--brand-primary-dark);
    --primary-light: var(--brand-primary-hover);
    --secondary-color: var(--brand-accent);
    --secondary-dark: var(--brand-accent-dark);
    --accent-color: var(--brand-accent);
    --accent: var(--brand-accent);
    --bg-light: var(--brand-ivory);
    --bg-body: var(--brand-ivory);
    --text-dark: var(--brand-ink);
    --text-light: var(--brand-muted);
    --text-muted: var(--brand-muted);
    --border-color: var(--brand-line);

    --pd-primary: var(--brand-primary);
    --pd-primary-dark: var(--brand-primary-dark);
    --pd-gold: var(--brand-accent);
    --pd-ink: var(--brand-ink);
    --pd-muted: var(--brand-muted);
    --pd-bg: var(--brand-ivory);
    --pd-line: var(--brand-line);

    --contact-primary: var(--brand-primary);
    --contact-primary-dark: var(--brand-primary-dark);
    --contact-gold: var(--brand-accent);
    --contact-ink: var(--brand-ink);
    --contact-muted: var(--brand-muted);
    --contact-bg: var(--brand-ivory);
    --contact-line: var(--brand-line);

    --home-primary: var(--brand-primary);
    --home-primary-dark: var(--brand-primary-dark);
    --home-gold: var(--brand-accent);
    --home-ink: var(--brand-ink);
    --home-muted: var(--brand-muted);
    --home-bg: var(--brand-ivory);
    --home-line: var(--brand-line);
}

::selection { color: white; background: var(--brand-primary); }
html { scroll-behavior: smooth; }
body { color: var(--brand-ink); font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif; }
button, input, select, textarea { font: inherit; }
button, [role="button"] { cursor: pointer; }
img { max-width: 100%; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 3px solid rgba(215, 179, 92, .72);
    outline-offset: 3px;
}
input, textarea { user-select: text; }
.brand-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* ---------- Unified header ---------- */
.site-header,
.pd-header,
.contact-header {
    border-bottom: 1px solid rgba(215, 179, 92, .32) !important;
    background: linear-gradient(112deg, var(--brand-primary-dark) 0%, var(--brand-primary) 58%, #611318 100%) !important;
    box-shadow: 0 7px 26px rgba(38, 8, 11, .22) !important;
}

.header-top,
.pd-header-inner,
.contact-header-inner {
    min-height: 68px !important;
    height: 68px !important;
}

.logo img,
.pd-logo img,
.contact-brand img {
    width: 40px !important;
    height: 40px !important;
    padding: 3px !important;
    border: 2px solid var(--brand-accent) !important;
    background: white !important;
    box-shadow: 0 4px 14px rgba(24, 5, 7, .22);
}

.logo-text,
.pd-logo,
.contact-brand { color: white !important; }

.header-nav a,
.pd-nav a,
.contact-nav a {
    color: rgba(255, 255, 255, .76) !important;
    transition: color .2s ease, background .2s ease, border-color .2s ease !important;
}

.header-nav a:hover,
.header-nav a.active,
.pd-nav a:hover,
.pd-nav a.active,
.contact-nav a:hover,
.contact-nav a.active { color: var(--brand-accent-light) !important; }

.header-nav a::after { background: var(--brand-accent) !important; }

.pd-nav .pd-nav-cta,
.contact-nav .contact-nav-cta {
    border-color: rgba(215, 179, 92, .62) !important;
    background: rgba(215, 179, 92, .1) !important;
    color: white !important;
}

.pd-nav .pd-nav-cta:hover,
.contact-nav .contact-nav-cta:hover {
    border-color: var(--brand-accent) !important;
    background: var(--brand-accent) !important;
    color: var(--brand-primary-deep) !important;
}

.mobile-toggle,
.pd-menu-btn,
.contact-menu {
    border: 1px solid rgba(255, 255, 255, .16) !important;
    background: rgba(255, 255, 255, .08) !important;
    color: white !important;
}

/* ---------- Unified page bands and accents ---------- */
.page-header {
    background: linear-gradient(135deg, var(--brand-primary-dark), var(--brand-primary)) !important;
}

.page-header h1,
.page-header .header-content h1 { color: white !important; }
.page-header p,
.page-header .header-content p { color: rgba(255, 255, 255, .76) !important; }

.contact-hero,
.pd-procurement,
.contact-team-section,
.cta-banner,
.stats-section {
    background-color: var(--brand-primary-dark) !important;
    background-image: linear-gradient(135deg, var(--brand-primary-dark), var(--brand-primary)) !important;
}

.contact-eyebrow,
.pd-section-kicker,
.pd-eyebrow,
.home-section-intro > div > span { color: var(--brand-primary) !important; }

.contact-hero .contact-eyebrow,
.contact-team-section .contact-eyebrow,
.pd-procurement .pd-section-kicker,
.home-hero-eyebrow { color: var(--brand-accent-light) !important; }

/* ---------- Unified primary actions ---------- */
.cta-btn,
.btn-enquiry,
.btn-send-all,
.btn-continue,
.btn-cart,
.pd-btn-primary,
.contact-btn-primary,
.directions-link {
    border-color: var(--brand-primary) !important;
    background: var(--brand-primary) !important;
    color: white !important;
}

.cta-btn:hover,
.btn-enquiry:hover,
.btn-send-all:hover,
.btn-continue:hover,
.btn-cart:hover,
.pd-btn-primary:hover,
.contact-btn-primary:hover,
.directions-link:hover {
    border-color: var(--brand-primary-hover) !important;
    background: var(--brand-primary-hover) !important;
}

.contact-hero .contact-btn-primary,
.home-hero-actions .cta-btn,
.contact-final-cta,
.pd-help-banner {
    border-color: var(--brand-accent) !important;
    background: var(--brand-accent) !important;
    color: var(--brand-primary-deep) !important;
}

a { text-decoration-color: rgba(112, 23, 27, .35); }

/* ---------- Catalogue color alignment ---------- */
.product-detail-link,
.product-card h3:hover,
.product-cat-label { color: var(--brand-primary) !important; }
.product-actions .btn-cart { background: var(--brand-primary) !important; }
.product-actions .btn-cart:hover { background: var(--brand-primary-hover) !important; }
.product-actions .qty-stepper button { color: var(--brand-primary) !important; }
.badge-bestseller { background: var(--brand-primary) !important; }
.badge-new { background: var(--brand-success) !important; }
.badge-popular { background: var(--brand-accent-dark) !important; }

/* ---------- Unified footer ---------- */
.brand-footer {
    margin: 0;
    border-top: 4px solid var(--brand-accent);
    background: linear-gradient(118deg, var(--brand-primary-deep), var(--brand-primary-dark));
    color: rgba(255, 255, 255, .76);
}

.brand-footer-cta {
    padding: 27px max(24px, calc((100% - 1192px) / 2));
    background: var(--brand-accent);
    color: var(--brand-primary-deep);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.brand-footer-cta > div { display: grid; }
.brand-footer-cta > div span { font-size: .65rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; opacity: .7; }
.brand-footer-cta > div strong { margin-top: 2px; font: 700 clamp(1.15rem, 2vw, 1.55rem)/1.25 "Playfair Display", serif; }
.brand-footer-cta > a {
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid var(--brand-primary-dark);
    border-radius: 8px;
    background: var(--brand-primary-dark);
    color: white;
    text-decoration: none;
    white-space: nowrap;
    font-size: .72rem;
    font-weight: 800;
}
.brand-footer-cta > a span { display: inline-block; margin-left: 6px; transition: transform .2s ease; }
.brand-footer-cta > a:hover span { transform: translateX(4px); }

.brand-footer-main {
    max-width: 1240px;
    margin: auto;
    padding: 54px 24px 42px;
    display: grid;
    grid-template-columns: 1.45fr .68fr .68fr 1.1fr;
    gap: 52px;
}

.brand-footer-about { max-width: 370px; }
.brand-footer-logo { display: inline-flex; align-items: center; gap: 11px; color: white; text-decoration: none; }
.brand-footer-logo img {
    width: 46px;
    height: 46px;
    padding: 3px;
    border: 2px solid var(--brand-accent);
    border-radius: 50%;
    background: white;
    object-fit: contain;
}
.brand-footer-logo > span { display: grid; }
.brand-footer-logo strong { font-size: .92rem; line-height: 1.2; }
.brand-footer-logo small { margin-top: 2px; color: rgba(255,255,255,.45); font-size: .59rem; }
.brand-footer-about > p { margin: 18px 0; color: rgba(255,255,255,.55); font-size: .7rem; line-height: 1.75; }
.brand-footer-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.brand-footer-actions a {
    padding: 8px 11px;
    border: 1px solid rgba(215,179,92,.28);
    border-radius: 7px;
    color: var(--brand-accent-light);
    text-decoration: none;
    font-size: .61rem;
    font-weight: 750;
}
.brand-footer-actions a:hover { border-color: var(--brand-accent); background: rgba(215,179,92,.08); }

.brand-footer-column,
.brand-footer-contact { display: flex; flex-direction: column; align-items: flex-start; }
.brand-footer-column h2,
.brand-footer-contact h2 {
    margin: 0 0 15px;
    color: var(--brand-accent-light);
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}
.brand-footer-column a,
.brand-footer-contact a {
    padding: 4px 0;
    color: rgba(255,255,255,.61);
    text-decoration: none;
    font-size: .66rem;
    line-height: 1.55;
}
.brand-footer-column a:hover,
.brand-footer-contact a:hover { color: var(--brand-accent-light); }
.brand-footer-contact address { margin: 0 0 11px; color: rgba(255,255,255,.52); font-style: normal; font-size: .64rem; line-height: 1.7; }
.brand-footer-contact a:last-child { overflow-wrap: anywhere; }

.brand-footer-trust {
    max-width: 1192px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid rgba(215,179,92,.14);
    border-bottom: 1px solid rgba(215,179,92,.14);
}
.brand-footer-trust > span { padding: 17px 22px; border-right: 1px solid rgba(215,179,92,.14); display: grid; }
.brand-footer-trust > span:last-child { border-right: 0; }
.brand-footer-trust strong { color: white; font-size: .68rem; }
.brand-footer-trust small { color: rgba(255,255,255,.42); font-size: .55rem; }

.brand-footer-bottom {
    max-width: 1240px;
    margin: auto;
    padding: 18px 24px;
    display: flex;
    justify-content: space-between;
    gap: 25px;
    color: rgba(255,255,255,.38);
    font-size: .56rem;
}

.site-footer,
.pd-footer,
.contact-footer {
    border-top: 4px solid var(--brand-accent) !important;
    background: linear-gradient(118deg, var(--brand-primary-deep), var(--brand-primary-dark)) !important;
    color: rgba(255, 255, 255, .78) !important;
}

.footer-col h4 { color: var(--brand-accent-light) !important; }

.footer-col a,
.pd-footer-links a,
.contact-footer-links a {
    color: rgba(255, 255, 255, .66) !important;
}

.footer-col a:hover,
.pd-footer-links a:hover,
.contact-footer-links a:hover { color: var(--brand-accent-light) !important; }

.pd-footer-brand img,
.contact-footer-brand img {
    border: 2px solid var(--brand-accent) !important;
    background: white !important;
}

.footer-bottom,
.pd-footer-bottom,
.contact-footer-bottom {
    border-top-color: rgba(215, 179, 92, .16) !important;
    color: rgba(255, 255, 255, .43) !important;
}

/* Keep WhatsApp recognizable while removing unrelated accent colors. */
.whatsapp-float,
.contact-whatsapp-float,
.pd-btn-whatsapp { background: #19764a !important; }

@media (max-width: 960px) {
    .header-nav,
    .pd-nav,
    .contact-nav {
        background: var(--brand-primary-dark) !important;
        border-top: 1px solid rgba(215, 179, 92, .22);
    }

    .brand-footer-main { grid-template-columns: 1.2fr .8fr .8fr; gap: 38px; }
    .brand-footer-contact { grid-column: 1 / -1; display: grid; grid-template-columns: 150px repeat(3, auto); gap: 15px 25px; align-items: start; }
    .brand-footer-contact h2 { grid-column: 1 / -1; margin-bottom: 0; }
    .brand-footer-contact address { grid-row: span 3; }
}

@media (max-width: 680px) {
    .brand-footer-cta { padding: 24px 18px; flex-direction: column; align-items: stretch; }
    .brand-footer-cta > a { width: 100%; text-align: center; }
    .brand-footer-main { padding: 42px 18px 31px; grid-template-columns: 1fr 1fr; gap: 34px 24px; }
    .brand-footer-about { max-width: none; grid-column: 1 / -1; }
    .brand-footer-contact { grid-column: 1 / -1; display: flex; }
    .brand-footer-trust { grid-template-columns: 1fr 1fr; margin: 0 18px; }
    .brand-footer-trust > span:nth-child(2) { border-right: 0; }
    .brand-footer-trust > span:nth-child(-n+2) { border-bottom: 1px solid rgba(215,179,92,.14); }
    .brand-footer-bottom { padding: 17px 18px; flex-direction: column; gap: 5px; text-align: center; }
}