/* Layout: crystalline night. Faceted ice-blue glass over deep navy, one ember-orange accent. */
:root{
  --ink:#050c18; --deep:#0a1830; --panel:rgba(143,230,255,0.06); --line:rgba(143,230,255,0.22);
  --ice:#8fe6ff; --frost:#eaf8ff; --steel:#a3b8cf; --ember:#ff7a45; --ember-deep:#e8561f; --wa:#25d366;
  --disp:'Unbounded','Trebuchet MS',sans-serif; --body:'Manrope','Segoe UI',system-ui,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--body);background:var(--ink);color:var(--frost);line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased;}
a{color:inherit;}
.facets{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(115deg,transparent 0 38%,rgba(143,230,255,0.07) 38% 39%,transparent 39% 100%),
    linear-gradient(65deg,transparent 0 62%,rgba(143,230,255,0.06) 62% 63%,transparent 63% 100%),
    linear-gradient(160deg,rgba(143,230,255,0.10) 0 22%,transparent 22% 100%),
    linear-gradient(20deg,transparent 0 70%,rgba(255,122,69,0.07) 70% 100%),
    radial-gradient(900px 600px at 85% -10%,rgba(143,230,255,0.18),transparent 60%),
    linear-gradient(180deg,var(--deep),var(--ink) 70%);}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px;}
.display{font-family:var(--disp);font-weight:700;letter-spacing:-0.02em;line-height:1.08;text-wrap:balance;}

header{position:sticky;top:0;z-index:50;background:rgba(5,12,24,0.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line);}
.nav{max-width:1160px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;}
.brand svg{width:38px;height:38px;flex:none;}
.wordmark{font-family:var(--disp);font-weight:800;font-size:1.25rem;color:var(--frost);}
.wordmark span{color:var(--ice);}
.nav-cta{background:var(--ember);color:#240a02;font-weight:800;font-size:0.88rem;text-decoration:none;padding:10px 20px;border-radius:100px;transition:transform .2s,background .2s;}
.nav-cta:hover{background:var(--ember-deep);transform:translateY(-1px);}
a:focus-visible,button:focus-visible{outline:2px solid var(--ice);outline-offset:3px;}

.hero{padding:48px 0 40px;}
.hero-grid{max-width:1160px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:1.05fr 0.95fr;gap:40px;align-items:center;}
.hero-copy,.gem-wrap{min-width:0;}
.pill{display:inline-block;border:1px solid var(--line);background:var(--panel);color:var(--ice);font-weight:700;font-size:0.78rem;padding:6px 14px;border-radius:100px;letter-spacing:0.04em;text-transform:uppercase;margin-bottom:18px;}
.hero h1{font-size:clamp(2.1rem,5.4vw,3.7rem);margin-bottom:16px;}
.hero h1 em{font-style:normal;color:var(--ember);}
.hero-sub{color:var(--steel);font-size:1.04rem;max-width:520px;margin-bottom:26px;}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:30px;}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:100px;font-weight:800;font-size:0.95rem;text-decoration:none;transition:transform .2s,box-shadow .2s;}
.btn:hover{transform:translateY(-2px);}
.btn-wa{background:var(--wa);color:#04210f;box-shadow:0 10px 28px rgba(37,211,102,0.28);}
.btn-ice{border:1.5px solid var(--ice);color:var(--ice);}
.btn-ice:hover{background:rgba(143,230,255,0.1);}
.wa-icon{width:20px;height:20px;}
.hero-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:520px;}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 14px;backdrop-filter:blur(10px);}
.stat .num{font-family:var(--disp);font-weight:700;font-size:1.02rem;color:var(--ice);}
.stat .lbl{font-size:0.74rem;color:var(--steel);}

.gem-wrap{position:relative;}
.gem{aspect-ratio:1/1;width:100%;max-width:520px;margin:0 auto;padding:3px;background:linear-gradient(135deg,var(--ice),rgba(143,230,255,0.15) 40%,var(--ember));clip-path:polygon(50% 0,100% 28%,86% 100%,14% 100%,0 28%);filter:drop-shadow(0 20px 50px rgba(143,230,255,0.18));}
.gem-inner{width:100%;height:100%;background:var(--deep);clip-path:polygon(50% 0,100% 28%,86% 100%,14% 100%,0 28%);}
.gem-img{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,rgba(143,230,255,0.18),rgba(255,122,69,0.12));}
.gem-img img{width:100%;height:100%;object-fit:cover;}
.gem-tag{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);width:min(88%,340px);background:rgba(10,24,48,0.9);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:16px;padding:12px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;}
.gem-tag b{color:var(--ember);font-size:0.72rem;letter-spacing:0.08em;text-transform:uppercase;flex-basis:100%;}
.gem-tag span{font-weight:700;font-size:0.92rem;flex:1;min-width:0;}
.ph{color:var(--steel);font-size:0.78rem;text-align:center;padding:10px;width:100%;height:100%;align-items:center;justify-content:center;}

.section{padding:56px 0;}
.section-head{margin-bottom:26px;}
.kicker{display:inline-block;color:var(--ember);font-weight:800;font-size:0.78rem;letter-spacing:0.12em;text-transform:uppercase;margin-bottom:8px;}
.section-head h2{font-size:clamp(1.6rem,3.8vw,2.5rem);}

.carousel-outer{overflow:hidden;padding:6px 0 18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);}
.carousel-track{display:flex;gap:16px;width:max-content;animation:scroll 70s linear infinite;}
.carousel-outer:hover .carousel-track{animation-play-state:paused;}
@keyframes scroll{to{transform:translateX(-50%);}}
.food {
  flex: 0 0 250px;
  background: linear-gradient(
    160deg,
    rgba(143,230,255,0.10),
    rgba(143,230,255,0.03)
  );
  border: none;
  border-radius: 20px;
  overflow: hidden;
  backdrop-filter: blur(10px);
  transition: transform .25s;
}

.food:hover {
  transform: translateY(-4px);
}

.food-img {
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  outline: none;
  box-shadow: none;
}

.food-img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: none;
  outline: none;
  box-shadow: none;
}
.food-body{padding:14px 16px 16px;}
.food-body h3{font-size:0.95rem;font-weight:800;margin-bottom:10px;min-height:2.5em;}
.food-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.tag{font-family:var(--disp);font-weight:700;color:var(--ice);font-size:0.9rem;white-space:nowrap;}
.order-mini{background:var(--ember);color:#240a02;font-weight:800;font-size:0.78rem;text-decoration:none;padding:8px 14px;border-radius:100px;white-space:nowrap;transition:background .2s;}
.order-mini:hover{background:var(--ember-deep);}

.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;}
.tab{background:var(--panel);border:1px solid var(--line);color:var(--steel);font-family:var(--body);font-weight:700;font-size:0.86rem;padding:9px 18px;border-radius:100px;cursor:pointer;transition:all .2s;}
.tab:hover{color:var(--frost);border-color:var(--ice);}
.tab.active{background:var(--ice);color:#04202c;border-color:var(--ice);}
.menu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:14px;}
.menu-row{display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px 18px;backdrop-filter:blur(10px);}
.menu-text{min-width:0;flex:1;}
.menu-thumb{flex:none;width:92px;height:92px;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(150deg,rgba(143,230,255,0.14),rgba(255,122,69,0.10));display:flex;align-items:center;justify-content:center;}
.menu-thumb img{width:100%;height:100%;object-fit:cover;}
.menu-thumb .ph{font-size:0.62rem;padding:4px;}
.menu-row h4{font-size:0.98rem;font-weight:800;}
.menu-row p{font-size:0.82rem;color:var(--steel);margin-top:3px;}
.menu-row .right{display:flex;align-items:center;gap:12px;flex:none;}

.strip{margin:0 20px;padding:36px 20px;border-radius:24px;background:linear-gradient(120deg,#0f3558,#0a1830 60%,#3b1d12);border:1px solid var(--line);}
.strip-inner{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:22px;text-align:center;}
.strip-item .num{font-family:var(--disp);font-weight:800;font-size:1.8rem;color:var(--ice);}
.strip-item .lbl{color:var(--steel);font-size:0.86rem;}

.map-wrap{display:grid;grid-template-columns:0.9fr 1.1fr;gap:0;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:var(--panel);backdrop-filter:blur(10px);}
.map-info{padding:28px;min-width:0;}
.map-info h3{font-size:1.5rem;margin-bottom:18px;}
.info-row{display:flex;gap:12px;margin-bottom:14px;}
.info-row .ic{flex:none;}
.info-row strong{display:block;font-size:0.8rem;color:var(--ice);text-transform:uppercase;letter-spacing:0.06em;}
.info-row span{color:var(--steel);font-size:0.92rem;overflow-wrap:anywhere;}
.dir-btn{margin-top:10px;display:inline-flex;color:var(--ember);font-weight:800;text-decoration:none;}
.map-frame{min-height:320px;}
.map-frame iframe{width:100%;height:100%;min-height:320px;border:0;filter:grayscale(0.3) contrast(1.05);}

.final{padding:56px 20px 70px;}
.final-card{max-width:760px;margin:0 auto;text-align:center;padding:44px 24px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(160deg,rgba(143,230,255,0.12),rgba(255,122,69,0.08));backdrop-filter:blur(12px);}
.final-card h2{font-size:clamp(1.5rem,4vw,2.3rem);margin-bottom:12px;}
.final-card p{color:var(--steel);margin:0 auto 24px;max-width:480px;}
footer{text-align:center;color:var(--steel);font-size:0.8rem;padding:24px 20px 90px;border-top:1px solid var(--line);}
.float-wa{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));width:58px;height:58px;border-radius:50%;background:var(--wa);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(37,211,102,0.4);z-index:60;}
.float-wa svg{width:30px;height:30px;}

@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr;gap:34px;}
  .gem{max-width:380px;}
  .map-wrap{grid-template-columns:1fr;}
}
@media (max-width:520px){
  .menu-row{flex-wrap:wrap;}
  .menu-thumb{width:76px;height:76px;}
  .menu-text{flex:1 1 calc(100% - 100px);}
  .menu-row .right{width:100%;justify-content:space-between;}
  .hero-stats{gap:8px;}
  .stat{padding:10px;}
  .stat .num{font-size:0.88rem;}
}
@media (prefers-reduced-motion:reduce){.carousel-track{animation:none;}html{scroll-behavior:auto;}}

#food-track .food,
#food-track .food-img,
#food-track .food-img img {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

#food-track .food:hover {
  border-color: transparent !important;
}

/* Website QR Code Section */
.qr-section {
  padding-top: 30px;
  padding-bottom: 56px;
}

.qr-card {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 280px;
  align-items: center;
  gap: 40px;
  padding: 42px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 26px;
  background:
    radial-gradient(
      circle at 90% 20%,
      rgba(143, 230, 255, 0.13),
      transparent 35%
    ),
    linear-gradient(
      125deg,
      rgba(143, 230, 255, 0.08),
      rgba(255, 122, 69, 0.07)
    );
  backdrop-filter: blur(12px);
}

.qr-copy {
  min-width: 0;
}

.qr-copy h2 {
  max-width: 540px;
  margin: 0 0 18px;
  font-size: clamp(1.7rem, 4vw, 2.8rem);
}

.qr-copy p {
  max-width: 490px;
  margin-bottom: 24px;
  color: var(--steel);
  font-size: 1rem;
}

.qr-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 20px;
  border: 1px solid var(--ice);
  border-radius: 100px;
  color: var(--ice);
  font-weight: 800;
  text-decoration: none;
  transition:
    background 0.2s,
    color 0.2s,
    transform 0.2s;
}

.qr-link:hover {
  background: var(--ice);
  color: var(--deep);
  transform: translateY(-2px);
}

.qr-visual {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

.qr-image-frame {
  width: 100%;
  max-width: 280px;
  padding: 14px;
  border: 1px solid rgba(143, 230, 255, 0.35);
  border-radius: 22px;
  background: #ffffff;
  box-shadow: 0 16px 45px rgba(0, 0, 0, 0.25);
}

.qr-image-frame img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
}

.qr-caption {
  color: var(--ice);
  font-family: var(--disp);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-align: center;
}

@media (max-width: 860px) {
  .qr-card {
    grid-template-columns: 1fr;
    gap: 30px;
    padding: 32px 24px;
    text-align: center;
  }

  .qr-copy h2,
  .qr-copy p {
    margin-left: auto;
    margin-right: auto;
  }

  .qr-visual {
    grid-row: 1;
  }

  .qr-image-frame {
    max-width: 240px;
  }
}

@media (max-width: 520px) {
  .qr-section {
    padding-top: 20px;
    padding-bottom: 40px;
  }

  .qr-card {
    padding: 26px 18px;
    border-radius: 20px;
  }

  .qr-image-frame {
    max-width: 210px;
    padding: 10px;
    border-radius: 16px;
  }

  .qr-copy h2 {
    font-size: 1.65rem;
  }
}