/* Gourmet d'Angkor — phokfusion model (true black, Poppins). Tokens extracted
   from phokfusion.com Webflow CSS: #000/#fff/#d8832b, 8.33vw gutters,
   1.9em sheet radius, 5em tube radius, 3em pill buttons, sticky stacked sections. */

:root {
  --black: #000;
  --white: #fff;
  --accent: #d8832b;
  --grey: #b3b3b3;
  --light-grey: #ccc;
  --line: rgba(255, 255, 255, .14);
  --gutter: 8.33vw;
  --r-sheet: 1.9em;
  --r-tube: 5em;
  --r-pill: 3em;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--black);
  color: var(--white);
  font: 400 clamp(15px, 0.5vw + 12px, 19.3px) / 1.55 "Poppins", sans-serif;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; }
h1, h2, h3, p, dl, dd, dt, figure { margin: 0; }
a { color: inherit; }

/* ---------- nav ---------- */
.nav-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 900;
  display: flex;
  align-items: center;
  gap: 2em;
  padding: 1.3em var(--gutter);
  background: linear-gradient(#000 30%, transparent);
}
.brand {
  font-weight: 600;
  font-size: 1.05em;
  text-decoration: none;
  letter-spacing: .01em;
  margin-right: auto;
  white-space: nowrap;
}
.nav-links { display: flex; gap: 1.9em; flex-shrink: 0; align-items: center; }
.nav-links a {
  font-size: .88em;
  font-weight: 500;
  text-decoration: none;
  opacity: .85;
  transition: opacity .3s, color .3s;
  white-space: nowrap;
}
@media (max-width: 1150px) {
  .nav-container { gap: 1.1em; padding-left: 4vw; padding-right: 4vw; }
  .nav-links { gap: 1.15em; }
  .brand { font-size: .92em; }
  .nav-cta { font-size: .8em; }
}
.nav-links a:hover { opacity: 1; color: var(--accent); }
.nav-fb { display: inline-flex; align-items: center; padding: .6em .2em; }

/* ---------- buttons ---------- */
.btn {
  display: inline-block;
  font-family: inherit;
  font-weight: 600;
  font-size: .95em;
  letter-spacing: .01em;
  text-decoration: none;
  color: var(--white);
  background: var(--black);
  border: .09em solid var(--white);
  border-radius: var(--r-pill);
  padding: .42em 1.15em;
  transition: color .4s, background-color .4s, border-color .4s;
}
.btn:hover { background: var(--white); color: var(--black); }
.btn.solid { background: var(--white); color: var(--black); }
.btn.solid:hover { background: var(--accent); border-color: var(--accent); color: var(--black); }

/* ---------- hero ---------- */
.hero { height: 100vh; height: 100svh; position: relative; }
.hero-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
}
.hero-strip {
  position: absolute;
  top: -25%;
  left: -40vw;
  width: 180vw;
  display: flex;
  gap: 1.22em;
  transform: rotate(-30deg);
}
.hero-col {
  flex: 1;
  width: 16vw;
  height: 150vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  opacity: .65;
}
.hero-col.up .tubes { animation: tubes-up 30s linear infinite; }
.hero-col.down .tubes { animation: tubes-down 30s linear infinite; }
.tubes { flex: none; display: flex; flex-direction: column; }
.tube {
  width: 100%;
  height: 66.6vh;
  margin-bottom: 1em;
  border-radius: var(--r-tube);
  overflow: hidden;
  background: #111;
}
.tube img { width: 100%; height: 100%; object-fit: cover; display: block; }
@keyframes tubes-up { from { transform: translateY(0); } to { transform: translateY(-100%); } }
@keyframes tubes-down { from { transform: translateY(-100%); } to { transform: translateY(0); } }

.hero-content {
  position: fixed;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 var(--gutter);
}
.hero-kicker {
  color: var(--accent);
  font-size: .8em;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  margin-bottom: 1.6em;
}
.hero-brand {
  font-weight: 600;
  font-size: clamp(1.7rem, 8.5vw, 7.5rem);
  line-height: 1.02;
  letter-spacing: -0.015em;
  white-space: nowrap;
}
.hero-sub { color: var(--light-grey); font-size: clamp(1em, 1.6vw, 1.35em); margin: 1.1em 0 1.9em; }
.hero-actions { display: flex; gap: 1em; flex-wrap: wrap; justify-content: center; }
.hero-actions .btn { font-size: 1.05em; white-space: nowrap; }
@media (max-width: 620px) {
  .hero-actions { gap: .45em; }
  .hero-actions .btn { font-size: .74em; padding: .55em 1em; }
}
@media (max-width: 420px) {
  .hero-actions { gap: .4em; }
  .hero-actions .btn { font-size: .7em; padding: .5em .8em; }
}
@media (max-width: 365px) {
  .hero-actions { gap: .35em; }
  .hero-actions .btn { font-size: .6em; padding: .45em .7em; }
}
.hero-info { color: var(--grey); font-size: .82em; margin-top: 2.6em; }

/* ---------- stacked sheets ---------- */
.sheet {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--black);
  border-radius: var(--r-sheet) var(--r-sheet) 0 0;
}
.sheet.full {
  min-height: 100vh;
  display: flex;
  align-items: center;
}
.wrap { width: 100%; max-width: 78em; margin-inline: auto; padding: 13vh var(--gutter) 5vh; }
section { scroll-margin-top: 4em; }

.kicker {
  color: var(--accent);
  font-size: .78em;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  margin-bottom: 1.3em;
}
.display {
  font-weight: 600;
  font-size: clamp(2.5rem, 7.2vw, 7.4rem);
  line-height: 1.06;
  letter-spacing: -0.01em;
  margin-bottom: .55em;
}

/* about */
.prose { max-width: 62ch; }
.prose p { color: var(--light-grey); font-size: 1.12em; margin-bottom: 1.25em; }
.prose .lead { color: var(--white); font-size: 1.42em; line-height: 1.4; }
.byow { color: var(--accent); font-weight: 500; }
.cta-line { color: var(--grey); }
.tel-link { color: var(--white); text-decoration: none; border-bottom: .09em solid var(--accent); padding-bottom: .05em; }
.tel-link:hover { color: var(--accent); }
.wide-photo { margin-top: 3em; }
.wide-photo img { display: block; width: 100%; border-radius: var(--r-sheet); }
.wide-photo figcaption { color: var(--grey); font-size: .8em; margin-top: .9em; }

/* menus */
.menu-rows { list-style: none; margin: 2em 0 0; padding: 0; }
.menu-rows li { border-top: .09em solid var(--line); }
.menu-rows li:last-child { border-bottom: .09em solid var(--line); }
.menu-rows a {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1.5em;
  padding: 1.55em 0;
  text-decoration: none;
}
.mr-name { font-weight: 600; font-size: clamp(1.15em, 2.4vw, 1.8em); transition: color .3s; white-space: nowrap; }
.mr-meta { color: var(--grey); font-size: .88em; text-align: right; white-space: nowrap; }
@media (max-width: 620px) {
  .menu-rows a { flex-direction: column; align-items: flex-start; gap: .35em; }
  .mr-meta { text-align: left; }
}
.menu-rows a:hover .mr-name { color: var(--accent); }

/* dishes */
.dish-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(16em, 100%), 1fr));
  gap: 1.4em 1.2em;
  margin-top: 2.5em;
}
.dish {
  border: 0;
  padding: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.dish img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 1.25em;
  transition: transform .4s ease;
}
.dish:hover img { transform: scale(1.025); }
.dish figcaption { font-weight: 500; font-size: .92em; padding: .75em .15em 0; }

/* reviews */
.reviews { padding: 4vh 0; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; }
.reviews-band { overflow: hidden; }
.reviews .wrap { padding-bottom: 12vh; padding-top: 0; }
.marquee { overflow: hidden; border-block: .09em solid var(--line); margin: 12vh 0 5vh; }
.marquee-track {
  display: inline-flex;
  white-space: nowrap;
  animation: marquee 42s linear infinite;
  will-change: transform;
}
.marquee-track span { font-weight: 600; font-size: clamp(3rem, 7vw, 6.5rem); line-height: 1.25; }
.reviews-row {
  display: flex;
  gap: 1.5em;
  width: max-content;
  margin-top: 2.2em;
  animation: marquee 55s linear infinite;
  will-change: transform;
}
.reviews-row.to-right { animation-direction: reverse; }
.reviews-row:first-child { margin-top: 0; }
.reviews-row:hover { animation-play-state: paused; }
.review {
  flex: none;
  width: min(36em, 84vw);
  border: .09em solid var(--line);
  border-radius: 2em;
  padding: 2.8em 2.6em;
}
.review blockquote { color: var(--grey); font-size: 1.18em; line-height: 1.5; margin-bottom: 1.3em; }
.review .rev-name { color: var(--white); font-weight: 500; font-size: .92em; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.black-space { height: 1em; background: var(--black); }

/* contact */
.info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2em, 5vw, 5em); }
.hours-list div {
  display: flex;
  justify-content: space-between;
  gap: 1em;
  padding: 1.05em 0;
  border-bottom: .09em solid var(--line);
}
.hours-list dt { font-weight: 500; }
.hours-list dd { color: var(--grey); margin: 0; }
.addr { font-style: normal; color: var(--light-grey); font-size: 1.15em; line-height: 1.55; }
.big-tel {
  display: inline-block;
  font-weight: 600;
  font-size: clamp(1.5em, 3.2vw, 2.4em);
  text-decoration: none;
  margin: .45em 0 .3em;
  transition: color .3s;
}
.big-tel:hover { color: var(--accent); }
.fb { color: var(--grey); font-size: .92em; text-decoration: none; }
.fb:hover { color: var(--white); }
.contact-actions { display: flex; gap: 1em; flex-wrap: wrap; margin-top: 2.2em; }

/* footer */
.foot .foot-inner { text-align: center; }
.foot-word { font-weight: 600; font-size: clamp(1.7rem, 9vw, 8.5rem); line-height: 1.05; letter-spacing: -0.01em; white-space: nowrap; }
.foot-line { color: var(--grey); margin: 1.4em 0 2.8em; }
.foot-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 2.2em; margin-bottom: 3.5em; }
.foot-links a { font-size: .88em; font-weight: 500; text-decoration: none; opacity: .85; padding: 1em 0; }
@media (max-width: 480px) {
  .foot-links { gap: .95em; }
  .foot-links a { font-size: .76em; padding: .8em 0; }
}
@media (max-width: 340px) {
  .foot-links { gap: .6em; }
  .foot-links a { font-size: .68em; }
}
.foot-links a:hover { opacity: 1; color: var(--accent); }
.foot-credit { color: #889; font-size: .78em; }
.foot-credit a { color: #aaa; text-decoration: none; }
.foot-credit a:hover { color: var(--white); }

/* back to top */
.to-top {
  position: fixed;
  right: var(--gutter);
  bottom: 1.6em;
  z-index: 999;
  width: 3.1em;
  height: 3.1em;
  display: flex;
  align-items: center;
  justify-content: center;
  border: .09em solid var(--white);
  border-radius: 50%;
  background: var(--black);
  color: var(--white);
  font-weight: 600;
  text-decoration: none;
  transition: color .4s, background-color .4s;
}
.to-top:hover { background: var(--white); color: var(--black); }

/* mobile order bar */
.order-bar { display: none; }

/* lightbox */
#lightbox {
  border: 0;
  border-radius: var(--r-sheet);
  background: var(--black);
  color: var(--white);
  padding: 1em;
  max-width: min(92vw, 68em);
}
#lightbox::backdrop { background: rgba(0, 0, 0, .88); }
#lightbox img { display: block; width: 100%; max-height: 74vh; object-fit: contain; }
#lightbox figcaption { text-align: center; font-weight: 500; padding: 1em .5em .25em; }
.lb-close {
  position: absolute;
  top: .8em; right: .8em;
  border: .09em solid var(--white);
  border-radius: var(--r-pill);
  background: var(--black);
  color: var(--white);
  font: 600 .78em "Poppins", sans-serif;
  padding: .5em 1.1em;
  cursor: pointer;
}
.lb-nav { display: flex; justify-content: space-between; padding: .6em .35em .35em; }
.lb-nav button {
  border: .09em solid var(--line);
  border-radius: var(--r-pill);
  background: var(--black);
  color: var(--white);
  font: 500 .8em "Poppins", sans-serif;
  padding: .6em 1.2em;
  cursor: pointer;
}
.lb-nav button:hover { border-color: var(--white); }

/* responsive */
@media (max-width: 900px) {
  .info-grid { grid-template-columns: 1fr; }
  .nav-links { display: none; }
  .nav-container { padding: 1.1em 5vw; background: var(--black); border-bottom: .09em solid var(--line); }
  .tube { height: 42vh; border-radius: 2.6em; }
  .hero-col { opacity: .5; }
  .hero-info { display: none; }
  .wrap { padding: 11vh 5vw 9vh; }
  .to-top { display: none; }
  .order-bar {
    display: block;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 901;
    background: var(--black);
    border-top: .09em solid var(--white);
  }
  .order-bar a {
    display: block;
    text-align: center;
    padding: 1.05em;
    font-weight: 600;
    text-decoration: none;
  }
  body { padding-bottom: 3.4em; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .marquee-track, .reviews-row, .hero-col.up .tubes, .hero-col.down .tubes { animation: none; }
}