/* ═══════════════════════════════════════════
   YURI RESTAURANT — SHARED STYLESHEET
   ═══════════════════════════════════════════ */
:root {
  --crimson: #C0392B;
  --crimson-dark: #922B21;
  --crimson-light: #E74C3C;
  --gold: #D4A850;
  --gold-light: #F0C878;
  --cream: #FBF6EE;
  --dark: #1A0A00;
  --charcoal: #2C1810;
  --warm-gray: #8B7355;
  --off-white: #F5EDE0;
  --whatsapp: #25D366;
  --whatsapp-dark: #128C7E;
  --border: rgba(139,115,85,0.14);
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'DM Sans', sans-serif;
  background: var(--cream);
  color: var(--dark);
  overflow-x: hidden;
}

/* ── NOISE ── */
body::before {
  content:'';
  position:fixed;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
  pointer-events:none;z-index:9999;opacity:.35;
}

/* ── NAV ── */
nav {
  position:fixed;top:0;left:0;right:0;z-index:1000;
  display:flex;align-items:center;justify-content:space-between;
  padding:1.1rem 3rem;
  background:rgba(26,10,0,.93);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(212,168,80,.18);
  transition: padding .3s;
}
nav.scrolled { padding:.8rem 3rem; }
.nav-logo {
  font-family:'Playfair Display',serif;
  font-size:1.6rem;font-weight:900;
  color:var(--gold);letter-spacing:.05em;text-decoration:none;
}
.nav-logo span { color:var(--crimson-light);font-style:italic; }
.nav-links { display:flex;gap:2rem;list-style:none; }
.nav-links a {
  font-size:.8rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(245,237,224,.7);text-decoration:none;transition:color .25s;
  position:relative;padding-bottom:4px;
}
.nav-links a::after {
  content:'';position:absolute;bottom:0;left:0;width:0;height:1px;
  background:var(--gold);transition:width .3s;
}
.nav-links a:hover,
.nav-links a.active { color:var(--gold); }
.nav-links a:hover::after,
.nav-links a.active::after { width:100%; }
.nav-cta { display:flex;gap:.7rem; }
.btn-wa-nav {
  display:flex;align-items:center;gap:.45rem;
  background:var(--whatsapp);color:#fff;
  font-size:.76rem;font-weight:700;padding:.5rem 1.1rem;
  border-radius:50px;text-decoration:none;letter-spacing:.06em;
  transition:background .3s,transform .2s;
}
.btn-wa-nav:hover { background:var(--whatsapp-dark);transform:scale(1.04); }
.btn-call-nav {
  display:flex;align-items:center;gap:.45rem;
  background:rgba(192,57,43,.15);color:var(--crimson-light);
  border:1px solid rgba(192,57,43,.3);
  font-size:.76rem;font-weight:700;padding:.5rem 1.1rem;
  border-radius:50px;text-decoration:none;letter-spacing:.06em;
  transition:all .3s;
}
.btn-call-nav:hover { background:var(--crimson);color:#fff; }
.hamburger {
  display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:4px;
}
.hamburger span { display:block;width:24px;height:2px;background:var(--gold);transition:all .3s; }

/* ── PAGE HERO (inner pages) ── */
.page-hero {
  min-height:52vh;
  background:var(--dark);
  display:flex;align-items:flex-end;
  padding:0 3rem 4rem;
  position:relative;overflow:hidden;
  margin-top:70px;
}
.page-hero-bg {
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 70% at 60% 40%,rgba(192,57,43,.2) 0%,transparent 70%),
    linear-gradient(180deg,#1A0A00 0%,#2C1810 60%,rgba(26,10,0,.95) 100%);
}
.page-hero-img {
  position:absolute;inset:0;
  background-size:cover;background-position:center;
  opacity:.22;
}
.page-hero-content { position:relative;max-width:1100px;margin:0 auto;width:100%; }
.breadcrumb {
  display:flex;align-items:center;gap:.5rem;
  font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(245,237,224,.4);margin-bottom:1rem;
}
.breadcrumb a { color:var(--gold);text-decoration:none; }
.breadcrumb span { color:rgba(245,237,224,.25); }
.page-hero-label {
  font-size:.7rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--crimson-light);margin-bottom:.7rem;
  display:flex;align-items:center;gap:.7rem;
}
.page-hero-label::before { content:'';display:inline-block;width:28px;height:1px;background:var(--crimson-light); }
.page-hero-title {
  font-family:'Playfair Display',serif;
  font-size:clamp(2.6rem,6vw,5rem);
  font-weight:900;line-height:.95;
  color:var(--off-white);
}
.page-hero-title em { font-style:italic;color:var(--gold);display:block; }

/* ── SECTION COMMONS ── */
.section-wrap { max-width:1100px;margin:0 auto;padding:7rem 2rem; }
.section-label {
  font-size:.7rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--crimson);margin-bottom:.75rem;
  display:flex;align-items:center;gap:.75rem;
}
.section-label::before { content:'';display:inline-block;width:28px;height:1px;background:var(--crimson); }
.section-label.gold { color:var(--gold); }
.section-label.gold::before { background:var(--gold); }
.section-title {
  font-family:'Playfair Display',serif;
  font-size:clamp(2rem,4.5vw,3.4rem);
  font-weight:900;line-height:1.05;
  color:var(--dark);margin-bottom:1rem;
}
.section-title.light { color:var(--off-white); }
.section-title em { font-style:italic;color:var(--crimson); }
.section-title.light em { color:var(--gold); }
.section-desc {
  font-family:'Cormorant Garamond',serif;
  font-size:1.15rem;line-height:1.8;
  color:var(--warm-gray);max-width:600px;
}
.divider-gold {
  width:60px;height:2px;
  background:linear-gradient(90deg,var(--gold),transparent);
  margin:1.5rem 0;
}

/* ── BUTTONS ── */
.btn-primary {
  display:inline-flex;align-items:center;gap:.6rem;
  background:var(--crimson);color:#fff;
  font-size:.83rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:1rem 2rem;text-decoration:none;border-radius:4px;
  transition:background .3s,transform .2s,box-shadow .3s;
  box-shadow:0 4px 20px rgba(192,57,43,.4);
}
.btn-primary:hover { background:var(--crimson-dark);transform:translateY(-2px);box-shadow:0 8px 28px rgba(192,57,43,.5); }
.btn-secondary {
  display:inline-flex;align-items:center;gap:.6rem;
  background:transparent;color:var(--dark);
  font-size:.83rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:1rem 2rem;text-decoration:none;border-radius:4px;
  border:1.5px solid rgba(44,24,16,.25);
  transition:all .3s;
}
.btn-secondary:hover { background:var(--dark);color:var(--off-white);border-color:var(--dark); }
.btn-wa {
  display:inline-flex;align-items:center;gap:.6rem;
  background:var(--whatsapp);color:#fff;
  font-size:.83rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:1rem 2rem;text-decoration:none;border-radius:4px;
  transition:background .3s,transform .2s;
}
.btn-wa:hover { background:var(--whatsapp-dark);transform:translateY(-2px); }

/* ── MARQUEE ── */
.marquee-strip {
  background:var(--crimson);padding:.75rem 0;overflow:hidden;white-space:nowrap;
}
.marquee-track { display:inline-flex;animation:marquee 24s linear infinite; }
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.marquee-item {
  font-family:'Cormorant Garamond',serif;
  font-size:.92rem;font-style:italic;
  color:rgba(255,255,255,.85);letter-spacing:.1em;padding:0 2rem;
}
.marquee-dot { color:rgba(255,255,255,.35);padding:0 .25rem; }

/* ── IMAGE GRID (gallery style) ── */
.img-grid { display:grid;gap:1rem; }
.img-grid-3 { grid-template-columns:repeat(3,1fr); }
.img-grid-4 { grid-template-columns:repeat(4,1fr); }
.img-grid-2 { grid-template-columns:repeat(2,1fr); }

.img-card {
  border-radius:10px;overflow:hidden;position:relative;
  aspect-ratio:4/3;background:var(--charcoal);
  cursor:pointer;
}
.img-card.tall { aspect-ratio:3/4; }
.img-card.wide { aspect-ratio:16/7; }
.img-card img {
  width:100%;height:100%;object-fit:cover;
  transition:transform .5s,filter .4s;
  filter:brightness(.88);
}
.img-card:hover img { transform:scale(1.07);filter:brightness(1); }
.img-card-label {
  position:absolute;bottom:0;left:0;right:0;
  padding:.8rem 1rem;
  background:linear-gradient(0deg,rgba(26,10,0,.85) 0%,transparent 100%);
  color:rgba(245,237,224,.9);
  font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;
}

/* ── CARDS ── */
.card {
  background:#fff;border-radius:12px;overflow:hidden;
  border:1px solid var(--border);
  transition:transform .3s,box-shadow .3s;
}
.card:hover { transform:translateY(-4px);box-shadow:0 16px 40px rgba(44,24,16,.1); }

/* ── FLOATING WHATSAPP ── */
.fab-whatsapp {
  position:fixed;bottom:2rem;right:2rem;z-index:998;
  width:60px;height:60px;
  background:var(--whatsapp);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  text-decoration:none;
  box-shadow:0 6px 24px rgba(37,211,102,.45);
  animation:fabPulse 2.8s ease-in-out infinite;
}
@keyframes fabPulse {
  0%,100%{box-shadow:0 6px 24px rgba(37,211,102,.45)}
  50%{box-shadow:0 6px 32px rgba(37,211,102,.7),0 0 0 10px rgba(37,211,102,.1)}
}
.fab-whatsapp:hover { background:var(--whatsapp-dark);transform:scale(1.1); }
.fab-whatsapp svg { width:28px;height:28px;fill:#fff; }
.fab-tooltip {
  position:absolute;right:70px;
  background:var(--dark);color:#fff;
  font-size:.72rem;font-weight:500;
  padding:.4rem .9rem;border-radius:6px;white-space:nowrap;
  opacity:0;pointer-events:none;transition:opacity .3s;
}
.fab-whatsapp:hover .fab-tooltip { opacity:1; }

/* ── FOOTER ── */
footer {
  background:#0D0500;
  border-top:1px solid rgba(212,168,80,.08);
}
.footer-top {
  max-width:1100px;margin:0 auto;
  display:grid;grid-template-columns:1.8fr 1fr 1fr 1.2fr;gap:3rem;
  padding:5rem 2rem 4rem;
}
.footer-brand .footer-logo {
  font-family:'Playfair Display',serif;
  font-size:1.8rem;font-weight:900;color:var(--gold);
  text-decoration:none;display:block;margin-bottom:.5rem;
}
.footer-brand .footer-logo span { color:var(--crimson-light);font-style:italic; }
.footer-tagline {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;font-size:1rem;
  color:rgba(245,237,224,.4);margin-bottom:1.5rem;
}
.footer-social { display:flex;gap:.7rem; }
.footer-social a {
  width:36px;height:36px;border-radius:8px;
  background:rgba(212,168,80,.08);border:1px solid rgba(212,168,80,.15);
  display:flex;align-items:center;justify-content:center;
  color:rgba(245,237,224,.5);font-size:.9rem;text-decoration:none;
  transition:all .3s;
}
.footer-social a:hover { background:var(--gold);color:var(--dark);border-color:var(--gold); }
.footer-col h4 {
  font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);margin-bottom:1.2rem;
}
.footer-col ul { list-style:none;display:flex;flex-direction:column;gap:.65rem; }
.footer-col ul a {
  font-size:.84rem;color:rgba(245,237,224,.5);text-decoration:none;
  transition:color .25s;
}
.footer-col ul a:hover { color:var(--gold); }
.footer-contact-item {
  display:flex;gap:.7rem;align-items:flex-start;
  font-size:.83rem;color:rgba(245,237,224,.5);
  margin-bottom:.8rem;
}
.footer-contact-item strong { color:rgba(245,237,224,.75); }
.footer-contact-item a { color:rgba(245,237,224,.5);text-decoration:none;transition:color .25s; }
.footer-contact-item a:hover { color:var(--gold); }
.footer-bottom {
  border-top:1px solid rgba(255,255,255,.04);
  padding:1.5rem 2rem;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:1rem;
  max-width:1100px;margin:0 auto;
}
.footer-copy { font-size:.7rem;color:rgba(245,237,224,.2);letter-spacing:.04em; }
.footer-legal { display:flex;gap:1.5rem; }
.footer-legal a { font-size:.7rem;color:rgba(245,237,224,.2);text-decoration:none;transition:color .25s; }
.footer-legal a:hover { color:var(--gold); }

/* ── ANIMATIONS ── */
.reveal {
  opacity:0;transform:translateY(24px);
  transition:opacity .6s ease,transform .6s ease;
}
.reveal.visible { opacity:1;transform:translateY(0); }

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  nav{padding:1rem 1.5rem;}
  .footer-top{grid-template-columns:1fr 1fr;gap:2rem;}
}
@media(max-width:768px){
  .nav-links{display:none;flex-direction:column;
    position:fixed;top:0;left:0;right:0;bottom:0;
    background:rgba(26,10,0,.98);padding:6rem 2rem 2rem;
    gap:2rem;z-index:999;
  }
  .nav-links.open{display:flex;}
  .nav-links a{font-size:1.2rem;}
  .hamburger{display:flex;z-index:1001;}
  .btn-call-nav{display:none;}
  .page-hero{padding:0 1.5rem 3rem;min-height:42vh;}
  .section-wrap{padding:4rem 1.5rem;}
  .footer-top{grid-template-columns:1fr;}
  .img-grid-3{grid-template-columns:repeat(2,1fr);}
  .img-grid-4{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:480px){
  .img-grid-3{grid-template-columns:1fr;}
  .img-grid-2{grid-template-columns:1fr;}
}
