/* ============================================================
   Sundeep Kaur Sitara Ã¢â‚¬â€ shared site styles
   Base, typography, header/nav, mobile menu, footer, a11y.
   Page-specific styles live in css/<page>.css
   ============================================================ */

:root {
            --bg-deep-black: #111111;
            --burnt-orange: #C65A11;
            --saffron: #D97706;
            --warm-cream: #F7F1E8;
            --soft-gold: #D4AF37;
            --font-serif: 'Cormorant Garamond', serif;
            --font-sans: 'Cormorant Garamond', serif;
            --ease-smooth: cubic-bezier(0.25, 1, 0.5, 1);
        }

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
            background: var(--bg-deep-black);
            color: var(--warm-cream);
            font-family: var(--font-sans);
            overflow-x: hidden;
            letter-spacing: 0.02em;
            line-height: 1.6;
            font-style: italic;
        }

::-webkit-scrollbar { width: 6px; }

::-webkit-scrollbar-track { background: var(--bg-deep-black); }

::-webkit-scrollbar-thumb { background: var(--burnt-orange); border-radius: 3px; }

h1, h2, h3 { font-family: var(--font-serif); font-weight: 300; }

p {color: rgba(247,241,232,0.82);line-height: 1.85;font-size: 1.4rem;}

.logo {
            text-decoration: none; font-family: 'Federo', sans-serif;
            text-transform: uppercase; font-size: 1.05rem; letter-spacing: 0.16em;
            color: var(--warm-cream);
        }

nav { display: flex; align-items: center; flex-wrap: nowrap; white-space: nowrap; }

.logo { white-space: nowrap; }

nav a {
            font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.18em;
            color: rgba(247,241,232,0.68); text-decoration: none; margin-left: 2.2rem;
            transition: color 0.4s; font-family: var(--font-sans);
        }

nav a:hover { color: var(--warm-cream); }

nav a.active { color: var(--burnt-orange); font-weight: 700; }

.hero-bg { position: absolute; inset: 0; z-index: 1; }

@keyframes riseUp {
            from { opacity: 0; transform: translateY(32px); }
            to { opacity: 1; transform: translateY(0); }
        }

.footer-inner { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 6rem; padding-bottom: 5rem; }

.footer-mark { width: 52px; height: auto; display: block; margin-bottom: 1.6rem; }

.footer-brand { font-family: 'Federo', sans-serif; font-size: 1rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--warm-cream); text-decoration: none; display: block; margin-bottom: 0.8rem; }

.footer-strapline {font-size: 0.9em;text-transform: uppercase;letter-spacing: 0.22em;color: rgba(247,241,232,0.55);font-family: var(--font-sans);}

.footer-col h3 { font-family: 'Federo', sans-serif; font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.38em; color: var(--burnt-orange); margin-bottom: 2rem; }

.footer-col a, .footer-col p { font-size: 0.88rem; color: rgba(247,241,232,0.62); text-decoration: none; display: block; margin-bottom: 0.7rem; font-family: var(--font-sans); transition: color 0.3s; }

.footer-col a:hover { color: var(--warm-cream); }

.footer-base { border-top: 1px solid rgba(247,241,232,0.06); padding: 2rem 0; display: flex; justify-content: space-between; }

.footer-base p { font-size: 0.7rem; color: rgba(247,241,232,0.55); font-family: var(--font-sans); }

/* Ã¢â€â‚¬Ã¢â€â‚¬ Mobile Menu Ã¢â€â‚¬Ã¢â€â‚¬ */
        html { overflow-x: hidden; }

.menu-btn span { display: block; width: 22px; height: 1px; background: var(--warm-cream); transition: all 0.4s ease; transform-origin: center; }

.menu-btn.open span:nth-child(1) { transform: rotate(45deg) translate(0, 7px); }

.menu-btn.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }

.menu-btn.open span:nth-child(3) { transform: rotate(-45deg) translate(0, -7px); }

.mobile-nav { position: fixed; inset: 0; background: rgba(198,90,17,0.94); z-index: 1005; flex-direction: column; align-items: center; justify-content: center; gap: 1.3rem; padding-top: 5rem; opacity: 0; transition: opacity 0.35s ease; pointer-events: none; }

.mobile-nav.open { opacity: 1; pointer-events: auto; }

.mobile-nav-header { display: none; }

.mobile-nav-header .mnav-logo { font-family: 'Federo', sans-serif; font-style: normal; font-weight: 400; font-size: 1.05rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--warm-cream); text-decoration: none; white-space: nowrap; padding: 0; }

.mobile-close { background: none; border: none; cursor: pointer; padding: 0.4rem; display: flex; flex-direction: column; gap: 6px; }

.mobile-close span { display: block; width: 22px; height: 1px; background: var(--warm-cream); transform-origin: center; transition: all 0.4s ease; }

.mobile-nav.open .mobile-close span:nth-child(1) { transform: rotate(45deg) translate(0, 7px); }

.mobile-nav.open .mobile-close span:nth-child(2) { opacity: 0; transform: scaleX(0); }

.mobile-nav.open .mobile-close span:nth-child(3) { transform: rotate(-45deg) translate(0, -7px); }

.mobile-nav a { font-family: var(--font-serif); font-size: clamp(1.4rem, 5.5vw, 1.8rem); font-weight: 300; font-style: italic; color: var(--warm-cream); text-decoration: none; letter-spacing: 0.04em; transition: color 0.3s; padding: 0.2rem 0.5rem; }

.mobile-nav a.active { color: #ffffff; font-weight: 700; }

.mobile-nav .nav-divider { width: 32px; height: 1px; background: rgba(247,241,232,0.45); }

@media (min-width: 1241px) { .menu-btn { display: none; } .mobile-nav { display: none; } }

/* Ã¢â€â‚¬Ã¢â€â‚¬ Production polish: a11y, motion, responsive Ã¢â€â‚¬Ã¢â€â‚¬ */
        blockquote, .pull-quote, .opening-quote, .mission-text, .blessing-text, .statement-quote { text-wrap: balance; }

.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.skip-link { position: absolute; top: -100%; left: 1rem; z-index: 2000; background: var(--bg-deep-black); color: var(--warm-cream); padding: 0.8rem 1.4rem; font-family: var(--font-sans); font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none; border: 1px solid var(--burnt-orange); }

.skip-link:focus { top: 1rem; }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--soft-gold); outline-offset: 3px; }

.menu-btn, .mobile-close { padding: 0.8rem; margin: -0.4rem; }

header.nav-hidden { transform: translateY(-100%); }

body:has(.mobile-nav.open) header { transform: translateY(0); background-color: transparent; }

header.scrolled { background-color: rgba(17,17,17,0.96); padding: 1.2rem 4rem; }

@media (max-width: 768px) { header.scrolled { padding: 1rem 2rem; } }

@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

@media (prefers-reduced-motion: reduce) {
            *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
            .hero-eyebrow, .hero-title, .hero-subline, .hero-roles, .hero-cta, .scroll-indicator, .hero-mark, .cta-container { animation: none !important; opacity: 1 !important; }
        }

@media (min-width: 769px) and (max-width: 1100px) {
            .offerings-grid { grid-template-columns: 1fr 1fr; }
            .offerings-grid .offer-card:last-child { grid-column: span 2; }
            .collections-grid .collection-card:last-child { grid-column: span 2; }
        }

@media (max-width: 768px) {
            .gallery-item:last-child { flex-basis: 100%; }
            .page-hero { padding-bottom: 4.5rem; }
            .footer-base { flex-direction: column; gap: 0.5rem; }
            .impact-item { padding: 3.5rem 2rem; }
        }

cite{
        color: var(--burnt-orange);
        font-weight: 300;
        font-style: normal;
        font-size: 1.6em;
        margin-bottom: .85em;
        display: block;
}
