*{margin:0;padding:0;box-sizing:border-box}
:root{--noir:#0a0a0a;--noir2:#141414;--or:#c9a961;--or-clair:#e0c285;--creme:#f5f1e8;--gris:#8a8a8a;--blanc:#fff}
html{scroll-behavior:smooth}
body{font-family:'Inter',-apple-system,sans-serif;background:var(--noir);color:var(--creme);line-height:1.6;overflow-x:hidden}
h1,h2,h3,h4{font-family:'Cormorant Garamond',serif;font-weight:500;line-height:1.2}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{max-width:1280px;margin:0 auto;padding:0 5%}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:24px 5%;display:flex;justify-content:space-between;align-items:center;transition:all .4s ease;background:transparent}
.nav.scrolled{background:rgba(10,10,10,.92);backdrop-filter:blur(20px);padding:16px 5%;border-bottom:1px solid rgba(201,169,97,.15)}
.logo{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:600;letter-spacing:2px;color:var(--or)}
.logo span{font-style:italic;font-weight:400}
.nav-links{display:flex;gap:40px;list-style:none}
.nav-links a{font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--creme);transition:color .3s;position:relative}
.nav-links a::after{content:'';position:absolute;bottom:-6px;left:0;width:0;height:1px;background:var(--or);transition:width .3s}
.nav-links a:hover,.nav-links a.active{color:var(--or)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;z-index:200;background:none;border:none;padding:8px}
.burger span{width:26px;height:2px;background:var(--creme);transition:all .35s ease;display:block}
.burger.active span:nth-child(1){transform:translateY(7px) rotate(45deg);background:var(--or)}
.burger.active span:nth-child(2){opacity:0}
.burger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);background:var(--or)}

/* HERO */
.hero{height:100vh;min-height:600px;position:relative;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:url('https://images.unsplash.com/photo-1513104890138-7c749659a591?w=1920&q=80') center/cover;animation:slowzoom 20s ease-in-out infinite alternate;z-index:1}
@keyframes slowzoom{from{transform:scale(1)}to{transform:scale(1.1)}}
.hero::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,.55) 0%,rgba(10,10,10,.35) 50%,rgba(10,10,10,.85) 100%);z-index:2}
.hero-content{position:relative;z-index:3;padding:0 5%;max-width:900px;animation:fadeUp 1.4s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
.hero-tag{color:var(--or);letter-spacing:6px;font-size:13px;text-transform:uppercase;margin-bottom:24px}
.hero h1{font-size:clamp(48px,8vw,108px);color:var(--blanc);margin-bottom:24px}
.hero h1 em{color:var(--or);font-style:italic}
.hero p{font-size:18px;color:var(--creme);max-width:600px;margin:0 auto 40px;opacity:.9}
.hero-cta{display:inline-block;padding:18px 44px;border:1px solid var(--or);color:var(--or);letter-spacing:3px;font-size:12px;text-transform:uppercase;transition:all .3s}
.hero-cta:hover{background:var(--or);color:var(--noir)}
.scroll-down{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);z-index:3;color:var(--or);font-size:11px;letter-spacing:3px;text-transform:uppercase;animation:bounce 2s ease infinite}
.scroll-down::after{content:'';display:block;width:1px;height:40px;background:var(--or);margin:14px auto 0}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(10px)}}

/* SECTIONS */
section{padding:120px 0}
.section-tag{color:var(--or);letter-spacing:6px;font-size:12px;text-transform:uppercase;margin-bottom:16px;text-align:center;display:block}
.section-title{font-size:clamp(36px,5vw,64px);color:var(--blanc);margin-bottom:60px;text-align:center}
.section-title em{color:var(--or);font-style:italic}

/* HISTOIRE */
.histoire{background:var(--noir2)}
.histoire-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.histoire-img{position:relative}
.histoire-img img{width:100%;height:540px;object-fit:cover}
.histoire-img::before{content:'';position:absolute;top:30px;left:30px;right:-30px;bottom:-30px;border:1px solid var(--or);z-index:-1}
.histoire-text .section-tag{text-align:left}
.histoire-text h2{font-size:48px;color:var(--blanc);margin-bottom:24px}
.histoire-text h2 em{color:var(--or);font-style:italic}
.histoire-text p{color:var(--gris);margin-bottom:20px;font-size:16px;line-height:1.8}
.badge{display:inline-flex;align-items:center;gap:12px;padding:12px 24px;border:1px solid var(--or);color:var(--or);font-size:11px;letter-spacing:3px;text-transform:uppercase;margin-top:24px}

/* PIZZAS */
.pizzas-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:40px}
.pizza-card{background:var(--noir2);transition:transform .4s ease;cursor:pointer}
.pizza-card:hover{transform:translateY(-8px)}
.pizza-img{height:280px;overflow:hidden}
.pizza-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.pizza-card:hover .pizza-img img{transform:scale(1.08)}
.pizza-info{padding:30px}
.pizza-info h3{font-size:26px;color:var(--blanc);margin-bottom:8px}
.pizza-info h3 em{color:var(--or);font-style:italic}
.pizza-desc{color:var(--gris);font-size:14px;min-height:60px;margin-bottom:16px}
.pizza-price{display:flex;align-items:center;gap:16px;color:var(--or);font-family:'Cormorant Garamond',serif;font-size:24px}
.pizza-price::before{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--or))}

/* VALEURS */
.valeurs{background:var(--noir2)}
.valeurs-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;margin-top:40px}
.valeur{text-align:center;padding:40px 20px}
.valeur-icon{width:64px;height:64px;margin:0 auto 24px;color:var(--or)}
.valeur h3{font-size:22px;color:var(--blanc);margin-bottom:12px}
.valeur p{color:var(--gris);font-size:14px}

/* CITATION */
.citation{position:relative;padding:160px 0;background:url('https://images.unsplash.com/photo-1604382354936-07c5d9983bd3?w=1920&q=80') center/cover fixed;text-align:center}
.citation::before{content:'';position:absolute;inset:0;background:rgba(10,10,10,.75)}
.citation-content{position:relative;max-width:800px;margin:0 auto;padding:0 5%}
.citation blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(28px,4vw,42px);color:var(--blanc);line-height:1.4;margin-bottom:32px}
.citation blockquote::before{content:'"';font-size:80px;color:var(--or);display:block;line-height:1}
.citation cite{color:var(--or);letter-spacing:4px;font-size:13px;text-transform:uppercase;font-style:normal}

/* CONTACT CTA */
.contact-cta{text-align:center}
.contact-cta h2{font-size:48px;color:var(--blanc);margin-bottom:24px}
.contact-cta h2 em{color:var(--or);font-style:italic}
.contact-cta p{color:var(--gris);margin-bottom:40px;max-width:520px;margin-left:auto;margin-right:auto}
.btn{display:inline-block;padding:18px 44px;border:1px solid var(--or);color:var(--or);letter-spacing:3px;font-size:12px;text-transform:uppercase;transition:all .3s}
.btn:hover{background:var(--or);color:var(--noir)}
.btn-filled{background:var(--or);color:var(--noir)}
.btn-filled:hover{background:transparent;color:var(--or)}

/* PAGE HEADER */
.page-header{height:60vh;min-height:420px;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden}
.page-header::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,.6),rgba(10,10,10,.85));z-index:2}
.page-header-bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:1}
.page-header-content{position:relative;z-index:3;padding:0 5%}
.page-header h1{font-size:clamp(48px,7vw,84px);color:var(--blanc)}
.page-header h1 em{color:var(--or);font-style:italic}
.page-header .section-tag{margin-bottom:20px}

/* MENU PAGE */
.menu-section{padding:100px 0}
.menu-cat{margin-bottom:80px}
.menu-cat-title{text-align:center;margin-bottom:60px}
.menu-cat-title h2{font-size:48px;color:var(--blanc)}
.menu-cat-title h2 em{color:var(--or);font-style:italic}
.menu-cat-title::after{content:'';display:block;width:60px;height:1px;background:var(--or);margin:20px auto 0}
.menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:50px}
.menu-item{display:flex;gap:24px;align-items:center}
.menu-item-img{width:120px;height:120px;flex-shrink:0;overflow:hidden;border-radius:50%}
.menu-item-img img{width:100%;height:100%;object-fit:cover}
.menu-item-info{flex:1}
.menu-item-info h3{font-size:24px;color:var(--blanc);margin-bottom:6px}
.menu-item-info h3 em{color:var(--or);font-style:italic}
.menu-item-info p{color:var(--gris);font-size:14px;margin-bottom:8px}
.menu-item-price{display:flex;align-items:center;gap:12px;color:var(--or);font-family:'Cormorant Garamond',serif;font-size:22px}
.menu-item-price::before{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(201,169,97,.4))}

/* APROPOS */
.apropos-intro{padding:120px 0;background:var(--noir2)}
.apropos-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.apropos-text h2{font-size:42px;color:var(--blanc);margin-bottom:24px}
.apropos-text h2 em{color:var(--or);font-style:italic}
.apropos-text p{color:var(--gris);margin-bottom:18px;line-height:1.8}
.apropos-text .section-tag{text-align:left}
.apropos-img{position:relative;height:540px}
.apropos-img img{width:100%;height:100%;object-fit:cover}
.apropos-img::before{content:'';position:absolute;top:30px;right:30px;left:-30px;bottom:-30px;border:1px solid var(--or);z-index:-1}

/* CONTACT */
.contact-section{padding:140px 0}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}
.contact-info-block{margin-bottom:40px}
.contact-info-block h4{color:var(--or);letter-spacing:3px;font-size:12px;text-transform:uppercase;margin-bottom:12px;font-family:'Inter',sans-serif;font-weight:500}
.contact-info-block p{color:var(--creme);font-size:18px;line-height:1.6}
.contact-map{height:520px;overflow:hidden}
.contact-map iframe{width:100%;height:100%;border:0;filter:grayscale(.7) contrast(1.1)}

/* FOOTER */
footer{padding:60px 0 30px;background:var(--noir2);border-top:1px solid rgba(201,169,97,.15);text-align:center}
footer .logo{display:inline-block;margin-bottom:20px}
footer p{color:var(--gris);font-size:13px;margin-bottom:8px}

/* REVEAL */
.reveal{opacity:0;transform:translateY(30px);transition:all 1s cubic-bezier(.22,.61,.36,1)}
.reveal.visible{opacity:1;transform:translateY(0)}
@keyframes revealFallback{to{opacity:1;transform:translateY(0)}}
.reveal{animation:revealFallback 1s ease .3s forwards}

/* MENU MOBILE PREMIUM SIDE PANEL */
.mobile-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);z-index:140;opacity:0;pointer-events:none;transition:opacity .5s ease}
.mobile-overlay.open{opacity:1;pointer-events:auto}
.mobile-menu{position:fixed;top:0;right:0;bottom:0;width:min(340px,88vw);background:var(--noir2);z-index:150;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .55s cubic-bezier(.77,0,.175,1);border-left:1px solid rgba(201,169,97,.18);box-shadow:-20px 0 60px rgba(0,0,0,.6)}
.mobile-menu::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--or),transparent)}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;padding:28px 28px 24px;border-bottom:1px solid rgba(201,169,97,.12)}
.mobile-menu-logo{font-family:'Cormorant Garamond',serif;font-size:20px;color:var(--or);letter-spacing:2px;font-style:italic}
.mobile-menu-close{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(201,169,97,.25);cursor:pointer;background:none;color:var(--or);font-size:20px;transition:all .3s}
.mobile-menu-close:hover{background:var(--or);color:var(--noir)}
.mobile-menu-nav{flex:1;overflow-y:auto;padding:20px 0}
.mobile-menu ul{list-style:none}
.mobile-menu li{opacity:0;transform:translateX(30px);transition:all .5s cubic-bezier(.22,.61,.36,1);border-bottom:1px solid rgba(201,169,97,.07)}
.mobile-menu.open li{opacity:1;transform:translateX(0)}
.mobile-menu.open li:nth-child(1){transition-delay:.12s}
.mobile-menu.open li:nth-child(2){transition-delay:.2s}
.mobile-menu.open li:nth-child(3){transition-delay:.28s}
.mobile-menu.open li:nth-child(4){transition-delay:.36s}
.mobile-menu.open li:nth-child(5){transition-delay:.44s}
.mobile-menu a{display:flex;align-items:center;gap:18px;padding:20px 28px;color:var(--creme);font-family:'Cormorant Garamond',serif;font-size:24px;letter-spacing:2px;transition:all .3s;position:relative;overflow:hidden}
.mobile-menu a::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--or);transform:scaleY(0);transition:transform .3s cubic-bezier(.22,.61,.36,1)}
.mobile-menu a:hover,.mobile-menu a.active{color:var(--or);padding-left:36px}
.mobile-menu a:hover::before,.mobile-menu a.active::before{transform:scaleY(1)}
.mobile-menu-num{font-family:'Inter',sans-serif;font-size:11px;color:rgba(201,169,97,.4);letter-spacing:1px;min-width:20px}
.mobile-menu a:hover .mobile-menu-num,.mobile-menu a.active .mobile-menu-num{color:var(--or)}
.mobile-menu-footer{padding:28px;border-top:1px solid rgba(201,169,97,.12)}
.mobile-menu-footer-adresse{color:var(--gris);font-size:12px;letter-spacing:1.5px;text-transform:uppercase;line-height:1.8;margin-bottom:16px}
.mobile-menu-footer-tag{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--or);font-size:16px;opacity:.7}

/* RESPONSIVE */
@media(max-width:1024px){
  .pizzas-grid{grid-template-columns:repeat(2,1fr)}
  .valeurs-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .nav-links{display:none}
  .burger{display:flex}
  section{padding:80px 0}
  .histoire-grid,.apropos-grid,.contact-grid{grid-template-columns:1fr;gap:50px}
  .histoire-img,.apropos-img{height:380px}
  .pizzas-grid{grid-template-columns:1fr}
  .menu-grid{grid-template-columns:1fr;gap:30px}
  .menu-item{flex-direction:row}
  .menu-item-img{width:90px;height:90px}
  .citation{padding:100px 0;background-attachment:scroll}
  .hero h1{font-size:48px}
  .section-title{font-size:36px}
  body{overflow-x:hidden}
}