:root {
    --black: #0a0a0a;
    --charcoal: #1a1714;
    --ember: #c0392b;
    --fire: #e67e22;
    --gold: #f1c40f;
    --cream: #f5efe6;
    --warm-white: #fdf8f2;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background-color: var(--black); color: var(--cream); font-family: 'Libre Baskerville', Georgia, serif; overflow-x: hidden; }

/* pagination */
.container-pagination {
    display: flex;
    justify-content: center;
    padding: 2rem 0;
}

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

.pagination li a,
.pagination li span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    border: 0.5px solid rgba(0,0,0,0.15);
    font-size: 14px;
    color: #666;
    text-decoration: none;
    background: #fff;
    transition: background 0.15s, color 0.15s;
}

.pagination li a:hover {
    background: #f5f5f5;
    color: #111;
}

.pagination li.active span {
    background: #f5f5f5;
    color: #111;
    font-weight: 500;
    border-color: rgba(0,0,0,0.4);
}

.pagination li.disabled span {
    opacity: 0.4;
    cursor: not-allowed;
}


/* ── NAV ── */
nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 100;
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 2.5rem;
    background: rgba(10,10,10,0.94); backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(192,57,43,0.2);
}
.nav-logo { font-family:'Playfair Display',serif; font-size:1.3rem; font-weight:700; color:var(--warm-white); }
.nav-logo span { color:var(--ember); }
.nav-links { display:flex; gap:2rem; list-style:none; }
.nav-links a { font-family:'Oswald',sans-serif; font-size:0.8rem; letter-spacing:0.2em; text-transform:uppercase; color:#c9b8a8; text-decoration:none; transition:color 0.25s; }
.nav-links a:hover { color:var(--fire); }
.cart-btn {
    background:var(--ember); border:none; cursor:pointer;
    padding:0.6rem 1.2rem;
    font-family:'Oswald',sans-serif; font-size:0.82rem; letter-spacing:0.15em; text-transform:uppercase;
    color:var(--warm-white); transition:background 0.25s;
    display:flex; align-items:center; gap:0.5rem;
}
.cart-btn:hover { background:#a93226; }
.cart-count { background:var(--gold); color:var(--black); border-radius:50%; width:20px; height:20px; display:flex; align-items:center; justify-content:center; font-size:0.72rem; font-weight:bold; min-width:20px; }
@media(max-width:700px){ .nav-links{display:none;} nav{padding:1rem 1.2rem;} }

/* ── HERO ── */
.hero {
    min-height:100vh; display:flex; flex-direction:column;
    align-items:center; justify-content:center;
    position:relative;
    background:radial-gradient(ellipse at center bottom, #3d1a0a 0%, #1a0d06 40%, var(--black) 75%);
    text-align:center; padding:2rem; overflow:hidden; padding-top:80px;
}
.hero::before { content:''; position:absolute; inset:0; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"); opacity:0.35; pointer-events:none; }
.glow-ring { position:absolute; width:340px; height:340px; border-radius:50%; background:radial-gradient(circle, rgba(192,57,43,0.18) 0%, transparent 70%); animation:pulse 3s ease-in-out infinite; }
@keyframes pulse { 0%,100%{transform:scale(1);opacity:0.7;} 50%{transform:scale(1.12);opacity:1;} }
.logo-wrap { position:relative; z-index:2; animation:fadeUp 0.9s ease both; }
.logo-wrap img { width:190px; filter:drop-shadow(0 0 28px rgba(230,126,34,0.45)); }
@keyframes fadeUp { from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);} }
.hero-title { position:relative; z-index:2; font-family:'Playfair Display',Georgia,serif; font-size:clamp(3.2rem,9vw,7rem); font-weight:700; letter-spacing:0.04em; line-height:1; margin-top:1.4rem; color:var(--warm-white); animation:fadeUp 0.9s 0.15s ease both; }
.hero-title span { color:var(--ember); }
.hero-sub { position:relative; z-index:2; font-family:'Oswald',sans-serif; font-weight:300; font-size:clamp(0.85rem,2.5vw,1.15rem); letter-spacing:0.35em; text-transform:uppercase; color:var(--fire); margin-top:0.9rem; animation:fadeUp 0.9s 0.3s ease both; }
.divider { width:60px; height:2px; background:linear-gradient(90deg,transparent,var(--ember),transparent); margin:2rem auto; position:relative; z-index:2; animation:fadeUp 0.9s 0.45s ease both; }
.hero-btns { position:relative; z-index:2; display:flex; gap:1rem; flex-wrap:wrap; justify-content:center; animation:fadeUp 0.9s 0.6s ease both; }
.cta-btn { display:inline-block; padding:1rem 2.6rem; border:1.5px solid var(--ember); font-family:'Oswald',sans-serif; font-size:0.95rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--cream); text-decoration:none; background:transparent; cursor:pointer; transition:background 0.3s,color 0.3s; }
.cta-btn:hover { background:var(--ember); color:var(--warm-white); }
.cta-btn.solid { background:var(--ember); color:var(--warm-white); }
.cta-btn.solid:hover { background:#a93226; }

/* ── STRIP ── */
.strip { background:var(--ember); padding:1rem 2rem; text-align:center; font-family:'Oswald',sans-serif; font-size:0.82rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--warm-white); }

/* ── OVER ONS ── */
.over { max-width:780px; margin:0 auto; padding:7rem 2rem; text-align:center; }
.section-label { font-family:'Oswald',sans-serif; font-size:0.78rem; letter-spacing:0.4em; text-transform:uppercase; color:var(--ember); margin-bottom:1.4rem; }
.section-title { font-family:'Playfair Display',Georgia,serif; font-size:clamp(2rem,5vw,3.2rem); font-weight:700; color:var(--warm-white); line-height:1.15; margin-bottom:1.6rem; }
.section-body { font-size:1.05rem; line-height:1.9; color:#c9b8a8; }

/* ── MENU ── */
.menu { background:var(--charcoal); padding:6rem 2rem; }
.menu-inner { max-width:1200px; margin:0 auto; }
.menu-header { text-align:center; margin-bottom:4rem; }
.pizza-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
@media(max-width:960px){ .pizza-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:580px){ .pizza-grid{grid-template-columns:1fr;} }

.pizza-card { background:var(--black); position:relative; overflow:hidden; transition:transform 0.35s ease; display:flex; flex-direction:column; }
.pizza-card::after { content:''; position:absolute; bottom:0; left:0; right:0; height:2px; background:linear-gradient(90deg,var(--ember),var(--fire)); transform:scaleX(0); transform-origin:left; transition:transform 0.4s ease; }
.pizza-card:hover { transform:translateY(-4px); }
.pizza-card:hover::after { transform:scaleX(1); }
.pizza-img-wrap { overflow:hidden; }
.pizza-img { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; filter:brightness(0.88); transition:filter 0.4s,transform 0.4s; }
.pizza-card:hover .pizza-img { filter:brightness(1); transform:scale(1.04); }
.pizza-body { padding:1.8rem 1.6rem 1.6rem; flex:1; display:flex; flex-direction:column; }
.pizza-num { font-family:'Playfair Display',serif; font-style:italic; font-size:2.5rem; color:rgba(192,57,43,0.15); line-height:1; margin-bottom:0.4rem; }
.pizza-name { font-family:'Playfair Display',Georgia,serif; font-size:1.35rem; font-weight:700; color:var(--warm-white); margin-bottom:0.5rem; }
.pizza-desc { font-size:0.84rem; line-height:1.75; color:#9a8878; margin-bottom:1.2rem; flex:1; }
.pizza-footer { display:flex; align-items:center; justify-content:space-between; gap:0.8rem; flex-wrap:wrap; }
.pizza-price { font-family:'Oswald',sans-serif; font-size:1.2rem; color:var(--fire); letter-spacing:0.05em; }
.add-btn { background:var(--ember); border:none; cursor:pointer; padding:0.55rem 1.1rem; font-family:'Oswald',sans-serif; font-size:0.78rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--warm-white); transition:background 0.25s; }
.add-btn:hover { background:#a93226; }

/* ── FEATURES ── */
.features { padding:7rem 2rem; max-width:1000px; margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); gap:3rem 2rem; text-align:center; }
@media(max-width:750px){ .features{grid-template-columns:repeat(2,1fr);} }
@media(max-width:420px){ .features{grid-template-columns:1fr;} }
.feat-icon { font-size:2.4rem; margin-bottom:1rem; display:block; }
.feat-title { font-family:'Playfair Display',serif; font-size:1.15rem; font-weight:700; color:var(--warm-white); margin-bottom:0.6rem; }
.feat-text { font-size:0.88rem; line-height:1.8; color:#9a8878; }

/* ── CONTACT ── */
.contact { background:var(--charcoal); padding:6rem 2rem; text-align:center; }
.contact-inner { max-width:600px; margin:0 auto; }
.contact-details { margin-top:2.5rem; display:flex; flex-direction:column; gap:1rem; }
.contact-row { display:flex; align-items:center; justify-content:center; gap:0.8rem; font-size:0.95rem; color:#c9b8a8; }
.contact-row .icon { color:var(--ember); font-size:1.1rem; }

footer { background:var(--black); padding:2rem; text-align:center; font-family:'Oswald',sans-serif; font-size:0.75rem; letter-spacing:0.2em; text-transform:uppercase; color:#4a3f38; }
footer span { color:var(--ember); }

/* ── CART DRAWER ── */
.cart-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:200; opacity:0; pointer-events:none; transition:opacity 0.35s; }
.cart-overlay.open { opacity:1; pointer-events:all; }
.cart-drawer { position:fixed; top:0; right:0; bottom:0; width:min(440px,100vw); background:var(--charcoal); z-index:201; transform:translateX(100%); transition:transform 0.4s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; border-left:1px solid rgba(192,57,43,0.25); }
.cart-drawer.open { transform:translateX(0); }
.cart-head { display:flex; align-items:center; justify-content:space-between; padding:1.5rem 1.8rem; border-bottom:1px solid rgba(255,255,255,0.07); }
.cart-head-title { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; color:var(--warm-white); }
.close-btn { background:none; border:none; color:#c9b8a8; cursor:pointer; font-size:1.5rem; line-height:1; transition:color 0.2s; }
.close-btn:hover { color:var(--ember); }
.cart-items { flex:1; overflow-y:auto; padding:1.2rem 1.8rem; }
.cart-empty { text-align:center; color:#6a5c52; padding:3rem 0; font-family:'Playfair Display',serif; font-style:italic; font-size:1.1rem; }
.cart-item { display:flex; gap:1rem; align-items:flex-start; padding:1rem 0; border-bottom:1px solid rgba(255,255,255,0.06); }
.ci-img { width:70px; height:56px; object-fit:cover; border-radius:2px; flex-shrink:0; }
.ci-info { flex:1; }
.ci-name { font-family:'Playfair Display',serif; font-size:1rem; font-weight:700; color:var(--warm-white); margin-bottom:0.2rem; }
.ci-price { font-family:'Oswald',sans-serif; font-size:0.9rem; color:var(--fire); }
.ci-qty { display:flex; align-items:center; gap:0.5rem; margin-top:0.5rem; }
.qty-btn { width:26px; height:26px; background:rgba(192,57,43,0.2); border:1px solid rgba(192,57,43,0.4); color:var(--cream); cursor:pointer; font-size:0.9rem; display:flex; align-items:center; justify-content:center; transition:background 0.2s; }
.qty-btn:hover { background:var(--ember); }
.qty-num { font-family:'Oswald',sans-serif; font-size:0.95rem; color:var(--warm-white); min-width:22px; text-align:center; }
.ci-remove { background:none; border:none; color:#6a5c52; cursor:pointer; font-size:0.75rem; margin-top:0.3rem; font-family:'Oswald',sans-serif; letter-spacing:0.1em; text-transform:uppercase; transition:color 0.2s; }
.ci-remove:hover { color:var(--ember); }
.cart-foot { padding:1.5rem 1.8rem; border-top:1px solid rgba(255,255,255,0.07); }
.cart-total { display:flex; justify-content:space-between; align-items:center; margin-bottom:1.4rem; }
.ct-label { font-family:'Oswald',sans-serif; letter-spacing:0.2em; text-transform:uppercase; font-size:0.85rem; color:#9a8878; }
.ct-amount { font-family:'Playfair Display',serif; font-size:1.6rem; font-weight:700; color:var(--warm-white); }
.order-btn { width:100%; padding:1.1rem; background:var(--ember); border:none; cursor:pointer; font-family:'Oswald',sans-serif; font-size:1rem; letter-spacing:0.25em; text-transform:uppercase; color:var(--warm-white); transition:background 0.25s; }
.order-btn:hover { background:#a93226; }

/* ── ORDER MODAL ── */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.85); z-index:300; display:none; align-items:center; justify-content:center; padding:1rem; }
.modal-overlay.open { display:flex; }
.modal { background:var(--charcoal); width:min(560px,100%); max-height:90vh; overflow-y:auto; border:1px solid rgba(192,57,43,0.3); animation:modalIn 0.3s ease both; }
@keyframes modalIn { from{opacity:0;transform:scale(0.94) translateY(20px);} to{opacity:1;transform:scale(1) translateY(0);} }
.modal-head { display:flex; align-items:center; justify-content:space-between; padding:1.5rem 2rem; border-bottom:1px solid rgba(255,255,255,0.07); }
.modal-title { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; color:var(--warm-white); }
.modal-body { padding:2rem; }
.field-group { margin-bottom:1.4rem; }
.field-group label { display:block; font-family:'Oswald',sans-serif; font-size:0.76rem; letter-spacing:0.25em; text-transform:uppercase; color:var(--fire); margin-bottom:0.5rem; }
.field-group input, .field-group select, .field-group textarea { width:100%; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.12); color:var(--cream); padding:0.75rem 1rem; font-family:'Libre Baskerville',serif; font-size:0.92rem; outline:none; transition:border-color 0.25s; }
.field-group input:focus, .field-group select:focus, .field-group textarea:focus { border-color:var(--ember); }
.field-group select option { background:var(--charcoal); }
.field-group textarea { resize:vertical; min-height:80px; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media(max-width:480px){ .field-row{grid-template-columns:1fr;} }
.order-summary { background:rgba(0,0,0,0.25); padding:1.2rem; margin-bottom:1.4rem; }
.os-title { font-family:'Oswald',sans-serif; font-size:0.78rem; letter-spacing:0.3em; text-transform:uppercase; color:#9a8878; margin-bottom:0.8rem; }
.os-item { display:flex; justify-content:space-between; font-size:0.88rem; color:#c9b8a8; padding:0.3rem 0; border-bottom:1px solid rgba(255,255,255,0.05); }
.os-total { display:flex; justify-content:space-between; margin-top:0.8rem; }
.os-total span:first-child { font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:0.1em; font-size:0.85rem; color:#9a8878; }
.os-total span:last-child { font-family:'Playfair Display',serif; font-size:1.1rem; font-weight:700; color:var(--fire); }
.confirm-btn { width:100%; padding:1.1rem; background:var(--ember); border:none; cursor:pointer; font-family:'Oswald',sans-serif; font-size:1rem; letter-spacing:0.25em; text-transform:uppercase; color:var(--warm-white); transition:background 0.25s; margin-top:0.5rem; }
.confirm-btn:hover { background:#a93226; }
.success-screen { display:none; flex-direction:column; align-items:center; justify-content:center; padding:3rem 2rem; text-align:center; }
.success-screen.show { display:flex; }
.success-icon { font-size:4rem; margin-bottom:1.2rem; }
.success-title { font-family:'Playfair Display',serif; font-size:2rem; font-weight:700; color:var(--warm-white); margin-bottom:0.8rem; }
.success-msg { color:#c9b8a8; line-height:1.8; font-size:0.95rem; }
::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(192,57,43,0.4); border-radius:3px; }