/* ==========================================================================
   Ammu South Indian Restaurant — static replica
   The original is a fixed 1280px design stage; every element is absolutely
   positioned on it and the whole stage is scaled to the viewport width.
   ========================================================================== */

/* ---------- fonts (same files the original serves) ---------- */
@font-face{font-family:AmmuBody;font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/325651f1111659cbaa0ee104bce3f541.woff2) format("woff2")}
@font-face{font-family:AmmuBody;font-style:normal;font-weight:500;font-display:swap;
  src:url(../fonts/b79740772ac87fd53b27808583c444a0.woff2) format("woff2")}
@font-face{font-family:AmmuBody;font-style:normal;font-weight:600;font-display:swap;
  src:url(../fonts/b79740772ac87fd53b27808583c444a0.woff2) format("woff2")}
@font-face{font-family:AmmuBody;font-style:normal;font-weight:700;font-display:swap;
  src:url(../fonts/57532649ffd83cbc0c6c560d8880b5a9.woff2) format("woff2")}

@font-face{font-family:AmmuDisplay;font-style:normal;font-weight:400 900;font-display:swap;
  src:url(../fonts/c73ea9bf1b3958162d206eddf0d609a1.woff) format("woff")}

@font-face{font-family:AmmuScript;font-style:normal;font-weight:400 900;font-display:swap;
  src:url(../fonts/d8fc7ef9771b343e555ebcb74e21f332.woff) format("woff")}

@font-face{font-family:AmmuAccent;font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/d954110daa4dffdab74344d788b06b1b.woff2) format("woff2")}
@font-face{font-family:AmmuAccent;font-style:normal;font-weight:700;font-display:swap;
  src:url(../fonts/d11a480601943401442f285f82517c30.woff2) format("woff2")}

@font-face{font-family:AmmuFooter;font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/e0267351c63e1e2c76ee947553e966a6.woff2) format("woff2")}
@font-face{font-family:AmmuFooter;font-style:normal;font-weight:700;font-display:swap;
  src:url(../fonts/a8409fd6c00d1370e1ad44d9d597b6f2.woff2) format("woff2")}

/* used by the stores page */
@font-face{font-family:AmmuStore;font-style:normal;font-weight:100 700;font-display:swap;
  src:url(../fonts/527cd5a6be21d4e008281f52ae03e6de.woff2) format("woff2")}
@font-face{font-family:AmmuStore;font-style:normal;font-weight:800;font-display:swap;
  src:url(../fonts/5da2f7e7b5289e2ae1f44d0ac2886371.woff2) format("woff2")}
@font-face{font-family:AmmuStore;font-style:normal;font-weight:900;font-display:swap;
  src:url(../fonts/5c07b773952ecd9eb4715de302811a45.woff2) format("woff2")}

:root{
  --stage-w:1280;          /* design width in px */
  --scale:1;               /* set by site.js */
  --navy:#2e4184;
  --cream:#f4e1c2;
  --bone:#f6f6e9;
  --paper:#f9f7dc;
  --cocoa:#1f1713;
  --rust:#c43c1e;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:#000;
  font-family:AmmuBody,"Helvetica Neue",Arial,sans-serif;
  overflow-x:hidden;
}
img{display:block;border:0}
a{text-decoration:none;color:inherit}

/* ---------- top navigation ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;height:48px;z-index:100;
  background:#000;
}
.nav ul{list-style:none;display:flex;align-items:center;height:100%;
  justify-content:flex-end;gap:32px;padding:0 16px 0 0}
.nav a{
  font-family:AmmuDisplay,"Helvetica Neue",Arial,sans-serif;
  font-size:15px;font-weight:700;color:#fff;line-height:18.5px;
  display:block;padding:2px 0;white-space:nowrap;
}
.nav a:hover{opacity:.75}

/* hamburger — shown on narrow screens, matching the original */
.nav-toggle{
  display:none;position:absolute;right:14px;top:50%;transform:translateY(-50%);
  width:30px;height:22px;background:none;border:0;cursor:pointer;
}
.nav-toggle span{display:block;height:2px;background:#fff;margin:5px 0;border-radius:2px;
  transition:transform .25s,opacity .25s}
.nav.open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.open .nav-toggle span:nth-child(2){opacity:0}
.nav.open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:1000px){
  .nav-toggle{display:block}
  .nav ul{
    position:absolute;top:48px;left:0;right:0;background:#000;
    flex-direction:column;align-items:stretch;height:auto;gap:0;padding:0;
    max-height:0;overflow:hidden;transition:max-height .3s ease;
  }
  .nav.open ul{max-height:70vh}
  .nav li{border-top:1px solid rgba(255,255,255,.12)}
  .nav a{padding:14px 18px;font-size:16px}
}

/* ---------- scaled design stage ---------- */
.stage-wrap{position:relative;overflow:hidden;margin-top:48px}
.stage{
  position:relative;width:1280px;transform-origin:top left;
  transform:scale(var(--scale));
}

/* absolutely-positioned primitives used across every section */
.sec{position:absolute;left:0;width:1280px;overflow:hidden}
.el{position:absolute}
.frame{position:absolute;overflow:hidden}
.frame img{position:absolute;max-width:none}
.box{position:absolute}

/* text blocks keep the original's exact metrics */
.t{position:absolute;white-space:pre-wrap}
/* single-line runs keep the original's exact box: never rewrap, and the
   line box equals the measured height so the glyphs sit where they did */
.t.n{white-space:nowrap}
/* blocks whose line breaks are authored: never re-wrap them */
.t.p{white-space:pre}
.t.c{text-align:center}
.t.j{text-align:justify;text-justify:inter-word}
.t.l{text-align:left}

/* buttons */
.btn{position:absolute;display:flex;align-items:center;justify-content:center;
  font-family:AmmuDisplay,"Helvetica Neue",Arial,sans-serif;
  font-size:17.491px;font-weight:600;line-height:24.36px;text-transform:uppercase;
  transition:filter .2s}
.btn:hover{filter:brightness(1.12)}
.btn-navy{background:var(--navy);color:#fff}
.btn-paper{background:var(--paper);color:var(--navy)}

.link-plain:hover{text-decoration:underline}

/* single-screen pages (stores / order-online / reservation) carry no nav bar */
.stage-wrap.solo{margin-top:0}

/* outlined boxes and pill outlines used on those pages */
.outline{position:absolute;background:none}

/* store cards */
.card{position:absolute;display:block}
.card .plate{position:absolute;border:2px solid #d60000;border-radius:15px}
.card .bar{position:absolute;background:#d60000}
.card:hover .bar{filter:brightness(1.15)}

/* scroll-reveal, mirroring the original's fade-up entrance */
.rv{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
}
