/* ══════════════════════════════════════════════
   TACOZZO — style.css  |  "Street Fire" Design
   ══════════════════════════════════════════════ */

/* ─── TOKENS ──────────────────────────────── */
:root {
  --black:       #080808;
  --yellow:      #FFB800;
  --yellow-glow: rgba(255,184,0,.15);
  --yellow-dim:  rgba(255,184,0,.08);
  --red:         #C0392B;
  --white:       #F5F5F0;
  --gray:        #1a1a1a;
  --gray-mid:    #2a2a2a;
  --dd-red:      #E31837;
  --ue-green:    #06C167;

  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-io:  cubic-bezier(.4,0,.2,1);
  --dur: .3s;
}

/* ─── RESET ───────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  font-family:'DM Sans',sans-serif;
  background:var(--black);
  color:var(--white);
  overflow-x:hidden;
  cursor:none;
}
img   { display:block; max-width:100%; }
a     { text-decoration:none; color:inherit; }
ul    { list-style:none; }
button{ font-family:inherit; }

/* ─── GRAIN OVERLAY ───────────────────────── */
/* SVG feTurbulence noise baked as data-URI */
.grain-overlay {
  position:fixed; inset:0;
  pointer-events:none; z-index:9998;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
  background-size:300px 300px;
  opacity:.45;
  mix-blend-mode:overlay;
  animation:grain-anim .12s steps(2) infinite;
}
@keyframes grain-anim {
  0%   { background-position: 0   0; }
  25%  { background-position:-50px -25px; }
  50%  { background-position: 25px  50px; }
  75%  { background-position:-25px  10px; }
  100% { background-position: 10px -30px; }
}

/* ─── CUSTOM CURSOR ───────────────────────── */
.cursor {
  position:fixed; width:10px; height:10px;
  background:var(--yellow); border-radius:50%;
  pointer-events:none; z-index:10000;
  transform:translate(-50%,-50%);
  transition:width .18s var(--ease-io), height .18s var(--ease-io);
  will-change:transform;
}
.cursor-follower {
  position:fixed; width:32px; height:32px;
  border:1.5px solid var(--yellow); border-radius:50%;
  pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%);
  transition:width .15s, height .15s, opacity .15s;
  opacity:.5;
  will-change:transform;
}
.cursor.hov         { width:20px; height:20px; }
.cursor-follower.hov{ width:52px; height:52px; opacity:.25; }

/* ─── CONTAINER ───────────────────────────── */
.container {
  max-width:1200px;
  margin:0 auto;
  padding:0 2rem;
}

/* ─── SECTION BASE ────────────────────────── */
.section {
  position:relative;
  padding:110px 0;
  overflow:hidden;
}

/* ─── DIAGONAL CLIP-PATH DIVIDERS ─────────── */
.clip-top {
  position:absolute; top:0; left:0; right:0; height:70px;
  background:var(--black);
  clip-path:polygon(0 0,100% 0,100% 0%,0 100%);
  z-index:2;
}
.clip-bot {
  position:absolute; bottom:0; left:0; right:0; height:70px;
  background:var(--black);
  clip-path:polygon(0 100%,100% 0,100% 100%,0 100%);
  z-index:2;
}

/* ─── SECTION TITLES ──────────────────────── */
.s-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.8rem,7vw,5rem);
  color:var(--yellow);
  text-align:center;
  letter-spacing:.06em;
  line-height:1;
  margin-bottom:1.2rem;
}
.s-title-left { text-align:left; }
.s-sub {
  text-align:center;
  color:rgba(245,245,240,.5);
  font-size:1.05rem;
  margin-bottom:3.5rem;
  letter-spacing:.04em;
}

/* ─── SCROLL FADE-UP ──────────────────────── */
.fade-up {
  opacity:0;
  transform:translateY(36px);
  transition:opacity .7s var(--ease-out), transform .7s var(--ease-out);
}
.fade-up.vis { opacity:1; transform:translateY(0); }


/* ══════════════════════════════════════════════
   NAVBAR
   ══════════════════════════════════════════════ */
.navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  padding:1.1rem 0;
  transition:background .4s, border-color .4s, padding .3s;
}
.navbar.scrolled {
  background:var(--black);
  border-bottom:1px solid var(--yellow);
  padding:.65rem 0;
}

.nav-inner {
  max-width:1200px; margin:0 auto; padding:0 2rem;
  display:flex; align-items:center; justify-content:space-between;
}

/* Logo */
.nav-logo img {
  height:50px;
  transition:transform var(--dur) var(--ease-io), filter var(--dur);
}
.nav-logo:hover img { transform:scale(1.06); filter:drop-shadow(0 0 8px var(--yellow)); }

/* Links */
.nav-links {
  display:flex; gap:2.2rem;
}
.nav-links a {
  font-family:'Bebas Neue',sans-serif;
  font-size:1.05rem; letter-spacing:.12em;
  color:var(--white);
  position:relative; padding-bottom:4px;
  transition:color var(--dur);
}
.nav-links a::after {
  content:''; position:absolute;
  bottom:0; left:0;
  width:0; height:2px;
  background:var(--yellow);
  transition:width .32s var(--ease-out);
}
.nav-links a:hover         { color:var(--yellow); }
.nav-links a:hover::after  { width:100%; }

/* Actions */
.nav-actions { display:flex; align-items:center; gap:1rem; }

.lang-pill {
  background:transparent;
  border:1.5px solid var(--yellow);
  border-radius:20px;
  padding:.28rem .9rem;
  cursor:pointer;
  font-family:'Bebas Neue',sans-serif;
  font-size:.88rem; letter-spacing:.12em;
  color:var(--white);
  display:flex; align-items:center; gap:.28rem;
  transition:background var(--dur), color var(--dur);
}
.lang-pill:hover              { background:var(--yellow); color:var(--black); }
.lp-sep                       { opacity:.4; }
.lp-fr.active, .lp-en.active  { color:var(--yellow); }
.lang-pill:hover .lp-fr,
.lang-pill:hover .lp-en       { color:var(--black); }

/* Hamburger */
.hamburger {
  display:none;
  flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:4px;
}
.hamburger span {
  display:block; width:24px; height:2px;
  background:var(--white);
  transition:transform .3s, opacity .3s;
}
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Mobile menu fullscreen */
.mob-menu {
  position:fixed; inset:0;
  background:var(--black);
  display:flex; align-items:center; justify-content:center;
  transform:translateX(100%);
  transition:transform .4s var(--ease-out);
  z-index:999;
}
.mob-menu.open  { transform:translateX(0); }

.mob-menu ul    { text-align:center; }
.mob-menu ul li { margin:1.4rem 0; }
.mob-menu ul li a {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.2rem,8vw,3.2rem); letter-spacing:.12em;
  color:var(--white);
  transition:color var(--dur);
  position:relative;
}
.mob-menu ul li a:hover { color:var(--yellow); }


/* ══════════════════════════════════════════════
   HERO
   ══════════════════════════════════════════════ */
.hero {
  position:relative; min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}

.hero-bg {
  position:absolute; inset:0;
  background:url('images/tasty.png') center/cover no-repeat;
  transform:scale(1.12);
  will-change:transform;
}

/* Dark vignette */
.hero-vignette {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 80% 80% at 50% 50%, transparent 30%, rgba(8,8,8,.6) 100%),
    linear-gradient(to bottom, rgba(8,8,8,.55) 0%, rgba(8,8,8,.78) 60%, rgba(8,8,8,.95) 100%);
}

.hero-content {
  position:relative; z-index:2;
  text-align:center; padding:2rem;
  display:flex; flex-direction:column; align-items:center;
  gap:1.4rem;
}

/* Halal badge */
.hero-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--red);
  color:#fff;
  font-family:'DM Sans',sans-serif;
  font-size:.72rem; font-weight:700; letter-spacing:.18em;
  text-transform:uppercase;
  padding:.3rem 1rem; border-radius:3px;
  animation:fadeD .7s var(--ease-out) .15s both;
}

.hero-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(80px,14vw,160px);
  color:var(--yellow);
  letter-spacing:.05em; line-height:.92;
  text-shadow:0 0 80px rgba(255,184,0,.28), 0 0 160px rgba(255,184,0,.12);
  animation:fadeU .8s var(--ease-out) .3s both;
}

.hero-sub {
  font-family:'DM Sans',sans-serif;
  font-size:clamp(.9rem,2.2vw,1.3rem);
  color:rgba(245,245,240,.72);
  letter-spacing:.22em; text-transform:uppercase; font-weight:300;
  animation:fadeU .8s var(--ease-out) .45s both;
}

.hero-typewriter {
  font-family:'Permanent Marker',cursive;
  font-size:clamp(1.1rem,2.8vw,1.9rem);
  color:var(--white);
  min-height:2.6rem;
  animation:fadeU .8s var(--ease-out) .55s both;
}
.tw-caret {
  color:var(--yellow);
  animation:blink .65s step-end infinite;
}
@keyframes blink { 50% { opacity:0; } }

/* CTA buttons */
.hero-ctas {
  display:flex; gap:1rem; flex-wrap:wrap; justify-content:center;
  animation:fadeU .8s var(--ease-out) .75s both;
}

.cta-btn {
  display:inline-flex; align-items:center; gap:.65rem;
  padding:.88rem 1.75rem; border-radius:6px;
  font-family:'DM Sans',sans-serif;
  font-size:.95rem; font-weight:600; letter-spacing:.04em;
  position:relative; overflow:hidden;
  transition:transform .25s var(--ease-out), box-shadow .25s;
}
.cta-btn::before {
  content:''; position:absolute; inset:0;
  background:rgba(255,255,255,.08); opacity:0;
  transition:opacity .25s;
}
.cta-btn:hover::before { opacity:1; }
.cta-btn:hover { transform:scale(1.05) translateY(-2px); }

.cta-logo { width:22px; height:22px; flex-shrink:0; }

.cta-doordash {
  background:var(--dd-red); color:#fff;
}
.cta-doordash:hover { box-shadow:0 8px 30px rgba(227,24,55,.5); }

.cta-ubereats {
  background:#fff; color:#000;
}
.cta-ubereats:hover { box-shadow:0 8px 30px var(--yellow-glow); }

/* Scroll cue */
.scroll-cue {
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  z-index:2;
}
.scroll-cue span {
  display:block; width:22px; height:22px;
  border-right:2px solid var(--yellow);
  border-bottom:2px solid var(--yellow);
  transform:rotate(45deg);
  animation:bounce 1.6s ease-in-out infinite;
}
@keyframes bounce {
  0%,100% { transform:rotate(45deg) translateY(0); }
  50%      { transform:rotate(45deg) translateY(9px); }
}

/* Entrance keyframes */
@keyframes fadeU { from{ opacity:0; transform:translateY(28px); } to{ opacity:1; transform:none; } }
@keyframes fadeD { from{ opacity:0; transform:translateY(-18px);} to{ opacity:1; transform:none; } }


/* ══════════════════════════════════════════════
   MENU SECTION
   ══════════════════════════════════════════════ */
.menu-section { background:var(--gray); padding:120px 0; }

/* Tab bar */
.tab-bar {
  display:flex; justify-content:center; flex-wrap:wrap;
  gap:0; margin:0 auto 3rem;
  border:1px solid var(--gray-mid); border-radius:8px;
  width:fit-content; overflow:hidden;
}
.tab-btn {
  background:transparent; border:none;
  color:rgba(245,245,240,.38);
  font-family:'Bebas Neue',sans-serif;
  font-size:1.15rem; letter-spacing:.12em;
  padding:.78rem 2.2rem; cursor:pointer;
  position:relative; transition:color var(--dur), background var(--dur);
}
.tab-btn::after {
  content:''; position:absolute;
  bottom:0; left:0; right:0; height:2.5px;
  background:var(--yellow);
  transform:scaleX(0); transition:transform .3s var(--ease-out);
}
.tab-btn.active        { color:var(--yellow); background:var(--yellow-dim); }
.tab-btn.active::after { transform:scaleX(1); }
.tab-btn:hover         { color:var(--yellow); }

/* Tab panels */
.tab-panel        { display:none; animation:tabIn .35s var(--ease-out); }
.tab-panel.active { display:block; }
@keyframes tabIn { from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }

/* Categories */
.menu-cat   { margin-bottom:2.8rem; }
.cat-label  {
  font-family:'Bebas Neue',sans-serif;
  font-size:1.5rem; letter-spacing:.2em;
  color:rgba(245,245,240,.4);
  padding-bottom:.5rem;
  border-bottom:1px solid var(--gray-mid);
  margin-bottom:1.4rem;
}

/* Cards grid */
.cards-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px,1fr));
  gap:1.1rem;
}

.m-card {
  background:var(--black);
  border:1px solid var(--gray-mid);
  border-radius:8px;
  padding:1.2rem;
  transition:transform .3s var(--ease-out), box-shadow .3s, border-color .3s;
  cursor:default;
}
.m-card:hover {
  transform:translateY(-5px);
  box-shadow:0 12px 40px var(--yellow-glow);
  border-color:rgba(255,184,0,.3);
}
.m-featured {
  background:linear-gradient(135deg,rgba(255,184,0,.07) 0%,var(--black) 100%);
  border-color:rgba(255,184,0,.18);
}

.m-card-head {
  display:flex; justify-content:space-between; align-items:flex-start;
  gap:.5rem; margin-bottom:.6rem;
}
.m-name {
  font-family:'Bebas Neue',sans-serif;
  font-size:1.2rem; letter-spacing:.05em;
  color:var(--yellow); line-height:1.15;
}
.m-price {
  font-family:'DM Sans',sans-serif;
  font-size:1.05rem; font-weight:700;
  color:var(--yellow); white-space:nowrap;
}
.m-sizes {
  display:flex; gap:.5rem; flex-wrap:wrap;
}
.m-sizes span {
  font-size:.78rem; color:rgba(245,245,240,.55);
}
.m-sizes b { color:var(--yellow); font-weight:700; }

.m-desc {
  font-size:.83rem;
  color:rgba(245,245,240,.5);
  line-height:1.55;
}

/* Extras box */
.extras-box {
  background:var(--gray-mid); border-radius:8px;
  padding:1.4rem 1.6rem; margin-bottom:2rem;
}
.extras-row {
  display:flex; flex-wrap:wrap; gap:.55rem; margin-top:.8rem;
}
.extras-row span {
  background:var(--black);
  border:1px solid rgba(255,184,0,.2);
  color:rgba(245,245,240,.65);
  font-size:.78rem;
  padding:.28rem .75rem; border-radius:4px;
}


/* ══════════════════════════════════════════════
   ORDER SECTION
   ══════════════════════════════════════════════ */
.order-section {
  background:var(--black);
  /* yellow grain tint */
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='1 0 0 0 1  0.72 0 0 0 0  0 0 0 0 0  0 0 0 0.06 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px 200px;
}

.order-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:2rem; margin-top:.5rem;
}

.order-card {
  background:var(--gray); border-radius:12px;
  padding:3rem 2.4rem;
  display:flex; flex-direction:column; align-items:center;
  gap:1.6rem; text-align:center;
  border:1px solid var(--gray-mid);
  transition:transform .4s var(--ease-out), box-shadow .4s, border-color .4s;
}
.order-card:hover { transform:translateY(-8px); }

.order-dd:hover {
  box-shadow:0 24px 60px rgba(227,24,55,.22);
  border-color:rgba(227,24,55,.3);
}
.order-ue:hover {
  box-shadow:0 24px 60px rgba(6,193,103,.2);
  border-color:rgba(6,193,103,.3);
}

.oc-logo svg { height:48px; width:auto; }

.oc-tag {
  font-size:.95rem; color:rgba(245,245,240,.5);
}

.oc-btn {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.78rem 2rem; border-radius:6px;
  font-family:'DM Sans',sans-serif;
  font-weight:700; font-size:.9rem; letter-spacing:.04em;
  transition:opacity .2s;
}
.oc-btn svg { transition:transform .25s var(--ease-out); }
.order-card:hover .oc-btn svg { transform:translateX(4px); }

.oc-btn-dd { background:var(--dd-red); color:#fff; }
.oc-btn-ue { background:var(--ue-green); color:#fff; }


/* ══════════════════════════════════════════════
   GALLERY
   ══════════════════════════════════════════════ */
.gallery-section { background:var(--gray); padding:120px 0; }

/* Asymmetric 4-col grid */
.gallery-grid {
  display:grid;
  grid-template-columns: 2fr 1.4fr 1fr 1fr;
  grid-template-rows: 290px 290px;
  gap:10px;
  margin-top:2rem;
}

/* Item 1 — burger (large left, 2 rows) */
.g-item:nth-child(1) { grid-column:1; grid-row:1 / span 2; }
/* Item 2 — tacos1 (tall middle, 2 rows) */
.g-item:nth-child(2) { grid-column:2; grid-row:1 / span 2; }
/* Item 3 — sandwich1 (top right 1) */
.g-item:nth-child(3) { grid-column:3; grid-row:1; }
/* Item 4 — sandwich2 (top right 2) */
.g-item:nth-child(4) { grid-column:4; grid-row:1; }
/* Item 5 — tacos2 (wide bottom right, spans 2 cols) */
.g-item:nth-child(5) { grid-column:3 / span 2; grid-row:2; }

.g-item {
  position:relative; overflow:hidden; border-radius:6px;
}
.g-item img {
  width:100%; height:100%;
  object-fit:cover;
  transition:transform .6s var(--ease-out);
}
.g-over {
  position:absolute; inset:0;
  background:linear-gradient(to top,rgba(8,8,8,.92) 0%,rgba(8,8,8,.3) 45%,transparent 100%);
  opacity:0; transition:opacity .4s;
  display:flex; align-items:flex-end;
  padding:1.4rem;
}
.g-label {
  font-family:'Bebas Neue',sans-serif;
  font-size:1.4rem; letter-spacing:.2em; color:var(--yellow);
  transform:translateY(10px); transition:transform .4s var(--ease-out);
}
.g-item:hover img            { transform:scale(1.07); }
.g-item:hover .g-over        { opacity:1; }
.g-item:hover .g-label       { transform:translateY(0); }


/* ══════════════════════════════════════════════
   REVIEWS
   ══════════════════════════════════════════════ */
.reviews-section { background:var(--black); }

.rating-block {
  display:flex; align-items:center; justify-content:center;
  gap:1.4rem; margin-bottom:3rem; flex-wrap:wrap;
}
.r-num {
  font-family:'Bebas Neue',sans-serif;
  font-size:5.5rem; color:var(--yellow); line-height:1;
}
.r-right { display:flex; flex-direction:column; gap:.3rem; }
.r-stars { font-size:2rem; color:var(--yellow); letter-spacing:.05em; }
.r-count { font-size:.9rem; color:rgba(245,245,240,.45); }

.reviews-row {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.4rem;
}

.rev-card {
  background:var(--gray);
  border-radius:8px; padding:1.5rem;
  border-left:3px solid var(--yellow);
  transition:transform var(--dur) var(--ease-out), box-shadow var(--dur);
}
.rev-card:hover {
  transform:translateY(-4px);
  box-shadow:0 10px 32px var(--yellow-glow);
}
.rev-top {
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:.8rem;
}
.rev-name  { font-weight:700; font-size:.94rem; }
.rev-stars { color:var(--yellow); font-size:.88rem; }
.rev-body  {
  font-size:.85rem; font-style:italic;
  color:rgba(245,245,240,.5); line-height:1.6;
}


/* ══════════════════════════════════════════════
   CONTACT
   ══════════════════════════════════════════════ */
.contact-section { background:var(--gray); padding:120px 0; }

.contact-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:4rem; align-items:start;
}

.contact-info .s-title { margin-bottom:2rem; }

.contact-list { display:flex; flex-direction:column; gap:1.1rem; }
.contact-list li {
  display:flex; align-items:flex-start; gap:.9rem;
  color:rgba(245,245,240,.78); font-size:.93rem;
}
.ci-icon { width:21px; height:21px; color:var(--yellow); flex-shrink:0; margin-top:1px; }
.ci-link { color:rgba(245,245,240,.78); transition:color var(--dur); }
.ci-link:hover { color:var(--yellow); }

/* Hours */
.hours-wrap { margin-top:2.2rem; }
.hours-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:1.2rem; letter-spacing:.18em;
  color:rgba(245,245,240,.4); margin-bottom:1rem;
}
.hours-tbl { width:100%; border-collapse:collapse; }
.hours-tbl tr { border-bottom:1px solid var(--gray-mid); }
.hours-tbl td { padding:.65rem 0; font-size:.88rem; }
.hours-tbl td:first-child { color:rgba(245,245,240,.55); padding-right:1rem; }
.hours-tbl td:last-child  { color:var(--yellow); font-weight:600; text-align:right; }

/* Map */
.contact-map iframe {
  width:100%; height:450px;
  border:2px solid var(--yellow); border-radius:8px;
  filter:grayscale(1) invert(.9) contrast(.85);
  transition:filter .4s;
}
.contact-map iframe:hover { filter:grayscale(.6) invert(.7) contrast(.85); }


/* ══════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════ */
.site-footer {
  background:var(--black);
  border-top:1px solid var(--yellow);
  padding:2rem 2rem .8rem;
}
.footer-main {
  max-width:1200px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding-bottom:1.4rem;
}
.footer-logo img { height:40px; opacity:.8; transition:opacity var(--dur); }
.footer-logo:hover img { opacity:1; }
.footer-copy { font-size:.8rem; color:rgba(245,245,240,.35); text-align:center; }
.footer-right { display:flex; align-items:center; gap:1rem; }
.footer-ig { color:rgba(245,245,240,.45); transition:color var(--dur); }
.footer-ig:hover { color:var(--yellow); }
.footer-halal {
  font-size:.68rem; font-weight:700; letter-spacing:.16em;
  color:var(--red); border:1px solid var(--red);
  padding:.2rem .5rem; border-radius:3px;
}

.footer-tag {
  max-width:1200px; margin:0 auto;
  padding-top:1rem;
  border-top:1px solid rgba(255,184,0,.08);
  text-align:center;
}
.footer-tagline {
  font-family:'Permanent Marker',cursive;
  font-size:.88rem; letter-spacing:.06em;
  color:rgba(255,184,0,.25);
}


/* ══════════════════════════════════════════════
   RESPONSIVE — 1024px
   ══════════════════════════════════════════════ */
@media (max-width:1024px) {
  .gallery-grid {
    grid-template-columns:1fr 1fr;
    grid-template-rows:repeat(4, 220px);
  }
  .g-item:nth-child(1) { grid-column:1 / span 2; grid-row:1; }
  .g-item:nth-child(2) { grid-column:1;           grid-row:2 / span 2; }
  .g-item:nth-child(3) { grid-column:2;           grid-row:2; }
  .g-item:nth-child(4) { grid-column:2;           grid-row:3; }
  .g-item:nth-child(5) { grid-column:1 / span 2; grid-row:4; }

  .reviews-row { grid-template-columns:1fr 1fr; }
}


/* ══════════════════════════════════════════════
   RESPONSIVE — 768px
   ══════════════════════════════════════════════ */
@media (max-width:768px) {
  /* Nav */
  .nav-links   { display:none; }
  .hamburger   { display:flex; }

  /* Hero */
  .hero-ctas   { flex-direction:column; align-items:center; }

  /* Menu */
  .cards-grid  { grid-template-columns:1fr; }
  .tab-btn     { padding:.65rem 1.4rem; font-size:1rem; }

  /* Order */
  .order-grid  { grid-template-columns:1fr; }

  /* Gallery */
  .gallery-grid {
    grid-template-columns:1fr 1fr;
    grid-template-rows:180px 180px 180px;
  }
  .g-item:nth-child(1) { grid-column:1 / span 2; grid-row:1; }
  .g-item:nth-child(2) { grid-column:1;           grid-row:2; }
  .g-item:nth-child(3) { grid-column:2;           grid-row:2; }
  .g-item:nth-child(4) { grid-column:1;           grid-row:3; }
  .g-item:nth-child(5) { grid-column:2;           grid-row:3; }

  /* Reviews */
  .reviews-row {
    grid-template-columns:1fr;
    overflow-x:auto;
    display:flex; flex-wrap:nowrap;
    padding-bottom:1rem; gap:1rem;
    -webkit-overflow-scrolling:touch;
  }
  .rev-card { min-width:280px; flex-shrink:0; }

  /* Contact */
  .contact-grid { grid-template-columns:1fr; gap:2.4rem; }
  .contact-info .s-title { text-align:center; }
  .contact-info .s-title.s-title-left { text-align:center; }
  .contact-map iframe { height:300px; }

  /* Footer */
  .footer-main { flex-direction:column; text-align:center; }

  /* Cursor off on touch */
  .cursor, .cursor-follower { display:none; }
  body { cursor:auto; }
}


/* ══════════════════════════════════════════════
   RESPONSIVE — 480px
   ══════════════════════════════════════════════ */
@media (max-width:480px) {
  .container   { padding:0 1.2rem; }
  .section     { padding:80px 0; }
  .hero-sub    { letter-spacing:.1em; }
  .cta-btn     { padding:.78rem 1.4rem; font-size:.88rem; }
  .r-num       { font-size:4rem; }
  .hours-tbl td{ font-size:.82rem; }
  .footer-main { padding-bottom:1rem; }
}
