/* Purity Kitchen — Nourishing Foods */
/* Warm · Elegant · Appetizing */

:root {
    --dark: #1A1611;
    --dark-warm: #2A2218;
    --dark-section: #1E1915;
    --gold: #C5A55A;
    --gold-light: #D4B96A;
    --gold-muted: rgba(197,165,90,0.12);
    --cream: #FAF7F2;
    --warm-white: #F5F0E8;
    --warm-gray: #E8E2D8;
    --terracotta: #C4704A;
    --sage: #7A8B6F;
    --text-dark: #1A1611;
    --text-body: #5A5248;
    --text-light: #8A8078;
    --text-muted: #B0A898;
    --white: #FFFFFF;
    --border: rgba(0,0,0,0.06);
    --border-gold: rgba(197,165,90,0.2);
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.04);
    --shadow-md: 0 8px 30px rgba(0,0,0,0.06);
    --shadow-lg: 0 20px 60px rgba(0,0,0,0.10);
    --transition: all 0.35s cubic-bezier(0.4,0,0.2,1);
    --radius: 6px;
    --radius-lg: 12px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}

body{
    font-family:'Inter',sans-serif;
    color:var(--text-body);
    background:var(--cream);
    line-height:1.75;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    overflow-x:hidden;
}

h1,h2,h3,h4,h5,h6{
    font-family:'Playfair Display',serif;
    color:var(--text-dark);
    line-height:1.2;
    font-weight:600;
}

h1{font-size:clamp(2.2rem,5vw,3.6rem);letter-spacing:-0.02em}
h2{font-size:clamp(1.8rem,3.5vw,2.6rem);letter-spacing:-0.01em}
h3{font-size:clamp(1.1rem,2vw,1.4rem)}

a{color:var(--gold);text-decoration:none;transition:var(--transition)}
a:hover{color:var(--gold-light)}

img{max-width:100%;height:auto;display:block}

.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* Skip Link */
.skip-link{
    position:absolute;top:-100%;left:16px;
    background:var(--gold);color:var(--dark);
    padding:12px 24px;border-radius:0 0 var(--radius) var(--radius);
    z-index:99999;font-weight:600;
}
.skip-link:focus{top:0}

/* Focus Styles */
*:focus-visible{
    outline:3px solid var(--gold);
    outline-offset:2px;
    border-radius:2px;
}

/* ===== HEADER ===== */
.top-bar{
    background:var(--dark);
    color:rgba(255,255,255,0.5);
    text-align:center;
    padding:10px 20px;
    font-size:0.78rem;
    letter-spacing:0.8px;
}
.top-bar a{color:var(--gold);font-weight:500;transition:var(--transition)}
.top-bar a:hover{color:var(--gold-light)}

header{
    background:var(--dark-warm);
    position:sticky;top:0;z-index:1000;
    border-bottom:1px solid rgba(197,165,90,0.1);
}

.header-inner{
    max-width:1200px;margin:0 auto;
    display:flex;align-items:center;justify-content:space-between;
    padding:0 24px;height:80px;
}

.logo a{display:flex;align-items:center;gap:12px;text-decoration:none}
.logo img{height:55px;width:auto;max-width:none}
.logo-text{
    font-family:'Playfair Display',serif;
    font-size:1.3rem;font-weight:600;
    color:var(--gold);line-height:1.15;
}
.logo-text span{display:block;font-family:'Inter',sans-serif;font-size:0.6rem;color:rgba(255,255,255,0.4);font-weight:400;letter-spacing:3px;text-transform:uppercase;margin-top:2px}

nav ul{display:flex;list-style:none;align-items:center;gap:2px}
nav ul li a{
    display:block;padding:10px 18px;
    font-size:0.85rem;font-weight:400;
    color:rgba(255,255,255,0.65);border-radius:var(--radius);
    transition:var(--transition);letter-spacing:0.5px;
}
nav ul li a:hover{color:var(--gold)}
nav ul li a[aria-current="page"]{color:var(--gold)}
.nav-cta{
    background:var(--gold)!important;
    color:var(--dark)!important;
    font-weight:600!important;
    border-radius:var(--radius)!important;
    padding:10px 24px!important;
}
.nav-cta:hover{background:var(--gold-light)!important;color:var(--dark)!important}

.menu-toggle{
    display:none;background:none;border:none;
    cursor:pointer;padding:8px;flex-direction:column;gap:5px;
}
.menu-toggle span{
    display:block;width:24px;height:2px;
    background:var(--gold);transition:var(--transition);
    border-radius:2px;
}

/* ===== BUTTONS ===== */
.btn{
    display:inline-flex;align-items:center;gap:8px;
    padding:14px 34px;border-radius:var(--radius);
    font-size:0.88rem;font-weight:600;letter-spacing:0.5px;
    transition:var(--transition);cursor:pointer;border:none;
    text-decoration:none;
}
.btn-primary{
    background:var(--gold);color:var(--dark);
}
.btn-primary:hover{
    background:var(--gold-light);color:var(--dark);
    transform:translateY(-2px);box-shadow:0 8px 25px rgba(197,165,90,0.3);
}
.btn-outline{
    background:transparent;color:var(--text-dark);
    border:1.5px solid var(--text-dark);
}
.btn-outline:hover{
    background:var(--text-dark);color:var(--white);
    transform:translateY(-2px);
}
.btn-outline-white{
    background:transparent;color:var(--white);
    border:1.5px solid rgba(255,255,255,0.3);
}
.btn-outline-white:hover{
    background:rgba(255,255,255,0.1);color:var(--white);
    border-color:var(--gold);
    transform:translateY(-2px);
}
.btn-outline-gold{
    background:transparent;color:var(--gold);
    border:1.5px solid var(--gold);
}
.btn-outline-gold:hover{
    background:var(--gold);color:var(--dark);
    transform:translateY(-2px);
}

/* ===== SECTION STYLES ===== */
.section-eyebrow{
    display:inline-block;
    font-family:'Inter',sans-serif;
    font-size:0.7rem;font-weight:600;
    text-transform:uppercase;letter-spacing:4px;
    color:var(--gold);
    margin-bottom:16px;
}

.section-title{margin-bottom:16px}
.section-subtitle{
    font-family:'Inter',sans-serif;
    font-size:1rem;color:var(--text-light);
    font-weight:300;line-height:1.9;max-width:560px;
}
.text-center{text-align:center}
.text-center .section-subtitle{margin:0 auto}

/* ===== MENU GRID ===== */
.menu-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}
.menu-card{
    background:var(--white);
    border-radius:var(--radius-lg);
    overflow:hidden;
    border:1px solid var(--border);
    transition:var(--transition);
}
.menu-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-lg);
}
.menu-card-img{
    height:220px;overflow:hidden;
    background:var(--warm-gray);
}
.menu-card-img img{
    width:100%;height:100%;object-fit:cover;
    transition:transform 0.6s ease;
}
.menu-card:hover .menu-card-img img{transform:scale(1.05)}
.menu-card-body{padding:16px 18px}
.menu-card-body h4{
    font-family:'Inter',sans-serif;font-size:0.9rem;
    font-weight:600;margin-bottom:2px;color:var(--text-dark);
}
.menu-card-body p{font-size:0.8rem;color:var(--text-light)}

/* ===== CONTACT FORM ===== */
.contact-form{max-width:600px}
.form-group{margin-bottom:20px}
.form-group label{
    display:block;font-size:0.85rem;font-weight:500;
    color:var(--text-dark);margin-bottom:6px;
}
.form-group input,.form-group textarea,.form-group select{
    width:100%;padding:14px 18px;
    border:1px solid var(--warm-gray);
    border-radius:var(--radius);
    font-family:'Inter',sans-serif;font-size:0.9rem;
    color:var(--text-dark);background:var(--white);
    transition:var(--transition);
}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{
    outline:none;border-color:var(--gold);
    box-shadow:0 0 0 3px rgba(197,165,90,0.15);
}
.form-group textarea{resize:vertical;min-height:140px}

/* ===== FOOTER ===== */
footer{
    background:var(--dark);
    color:rgba(255,255,255,0.6);
    padding:60px 0 20px;
}
.footer-content{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:40px;margin-bottom:40px;
}
.footer-section h3{
    color:var(--gold);font-size:1rem;
    margin-bottom:16px;font-family:'Inter',sans-serif;
    font-weight:600;
}
.footer-section p,.footer-section a{
    color:rgba(255,255,255,0.5);font-size:0.85rem;line-height:1.9;
}
.footer-section a:hover{color:var(--gold)}
.footer-links{list-style:none}
.footer-links li{margin-bottom:8px}
.footer-links li a{color:rgba(255,255,255,0.5);font-size:0.85rem}
.footer-links li a:hover{color:var(--gold)}

.footer-bottom{
    text-align:center;padding-top:24px;
    border-top:1px solid rgba(255,255,255,0.06);
}
.footer-bottom p{
    font-size:0.8rem;color:rgba(255,255,255,0.3);
    margin-bottom:6px;
}
.footer-partner{margin-top:8px;font-size:0.8rem}
.footer-partner a{color:var(--gold)}
.footer-partner a:hover{color:var(--gold-light)}

/* ===== CTA SECTION ===== */
.cta-section{
    background:var(--dark-warm);
    padding:80px 0;text-align:center;
    position:relative;overflow:hidden;
}
.cta-section::before{
    content:'';position:absolute;
    top:-40%;right:-15%;width:500px;height:500px;
    background:radial-gradient(circle,rgba(197,165,90,0.08) 0%,transparent 70%);
    border-radius:50%;
}
.cta-section h2{color:var(--white);margin-bottom:16px;position:relative;z-index:1}
.cta-section p{
    color:rgba(255,255,255,0.5);font-size:1rem;
    max-width:480px;margin:0 auto 32px;font-weight:300;
    position:relative;z-index:1;
}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px){
    .menu-grid{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:768px){
    .header-inner{height:64px}
    .menu-toggle{display:flex}
    nav{
        position:fixed;top:0;right:-100%;
        width:80%;max-width:360px;height:100vh;
        background:var(--dark-warm);box-shadow:-8px 0 30px rgba(0,0,0,0.4);
        transition:right 0.35s ease;z-index:9998;
        padding:80px 24px 40px;overflow-y:auto;
    }
    nav.active{right:0}
    nav ul{flex-direction:column;gap:0;align-items:stretch}
    nav ul li a{padding:14px 16px;font-size:1rem;border-radius:0;border-bottom:1px solid rgba(255,255,255,0.06)}
    .nav-cta{text-align:center;margin-top:16px;border-radius:var(--radius)!important}
    .logo img{height:45px}
    .menu-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:480px){
    .container{padding:0 16px}
    .btn{padding:12px 24px;font-size:0.85rem}
    .menu-grid{grid-template-columns:1fr}
}