/* =========================================================
   PEPPER POP V7 — PREMIUM BRAND EXPERIENCE
   Brand-first motion. Native scrolling. No decorative food fly-bys.
   ========================================================= */

:root{
  --pp7-red:#bd171d;
  --pp7-red-bright:#d92b2f;
  --pp7-red-deep:#7f0d12;
  --pp7-cream:#fff3df;
  --pp7-cream-2:#f8e5c7;
  --pp7-ink:#201713;
  --pp7-gold:#e8b86b;
  --pp7-line:rgba(131,72,37,.15);
  --pp7-shadow:0 24px 70px rgba(75,31,15,.13);
}

html{
  height:auto!important;
  overflow-y:auto!important;
  scroll-behavior:smooth;
}
body.pp-premium{
  min-height:100vh;
  height:auto!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  touch-action:pan-y pinch-zoom;
  overscroll-behavior-y:auto;
  -webkit-overflow-scrolling:touch;
  color:var(--pp7-ink);
  background:
    radial-gradient(circle at 16% 9%,rgba(201,34,36,.065),transparent 25rem),
    radial-gradient(circle at 88% 26%,rgba(232,184,107,.12),transparent 28rem),
    linear-gradient(180deg,#fff7e9 0%,#fff2de 52%,#fcebd3 100%);
}
body.pp-premium:not(.no-scroll){overflow-y:auto!important}

/* ---------- subtle brand atmosphere ---------- */
.pp7-atmosphere{
  position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
}
.pp7-atmosphere:before,
.pp7-atmosphere:after{
  content:"";position:absolute;border-radius:50%;filter:blur(80px);opacity:.13;
}
.pp7-atmosphere:before{width:420px;height:420px;left:-180px;top:12vh;background:#d7272b}
.pp7-atmosphere:after{width:520px;height:520px;right:-220px;top:46vh;background:#e9ba70}
.pp7-grain{
  position:absolute;inset:0;opacity:.035;
  background-image:radial-gradient(circle at center,#35170d .7px,transparent .8px);
  background-size:8px 8px;
}
body.pp-premium>.customer-topbar,
body.pp-premium>.page-shell{position:relative;z-index:2}

body.pp-premium>#cartBar{z-index:70}

body.pp-premium>.sheet-backdrop{
  position:fixed;
  inset:0;
  z-index:1000;
}

/* ---------- header ---------- */
.pp-premium .customer-topbar{
  height:82px;
  padding:0 clamp(16px,3vw,34px);
  background:rgba(255,247,234,.84);
  border-bottom:1px solid rgba(159,102,61,.14);
  box-shadow:0 10px 38px rgba(71,34,15,.055);
  backdrop-filter:blur(20px) saturate(1.15);
}
.pp-premium .brand-lockup{gap:14px}
.pp-premium .brand-logo.pp7-header-logo{
  width:100px;height:57px;border-radius:14px;
  object-fit:cover;object-position:center;
  background:var(--pp7-red);
  box-shadow:0 10px 28px rgba(146,20,24,.18);
}
.pp-premium .brand-name{font-size:17px;letter-spacing:.12em}
.pp-premium .brand-tagline{font-size:11px;letter-spacing:.02em}
.pp-premium .table-badge{
  position:relative;overflow:hidden;
  padding:10px 16px;
  background:linear-gradient(135deg,#cf2b2e,#9c1015);
  box-shadow:0 9px 24px rgba(164,20,24,.20);
  border:1px solid rgba(255,255,255,.14);
}
.pp-premium .table-badge:after{
  content:"";position:absolute;inset:-100% -45%;
  background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.42) 50%,transparent 58%);
  transform:translateX(-95%);
  animation:pp7BadgeShine 5.5s ease-in-out 1.2s infinite;
}

/* ---------- main ---------- */
.pp-premium .customer-shell{
  max-width:980px;
  padding-top:28px;
}

/* ---------- premium hero ---------- */
.pp-premium .hero-card.pp7-hero{
  min-height:360px;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(330px,.95fr);
  gap:0;
  overflow:hidden;
  border-radius:34px;
  color:#fff8ea;
  background:
    radial-gradient(circle at 74% 28%,rgba(255,219,169,.15),transparent 34%),
    linear-gradient(135deg,#c71f24 0%,#a80f17 58%,#78080f 100%);
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 34px 90px rgba(111,16,16,.27);
  isolation:isolate;
}
.pp-premium .hero-card.pp7-hero:after{display:none}
.pp7-hero-copy{
  position:relative;z-index:3;
  display:flex;flex-direction:column;justify-content:center;
  padding:46px 34px 44px 40px;
}
.pp7-hero-copy .eyebrow{
  width:max-content;
  color:#ffd8a5;
  margin-bottom:4px;
}
.pp7-hero-copy h1{
  margin:8px 0 12px;
  max-width:570px;
  font-size:clamp(38px,5vw,58px);
  line-height:.99;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.pp7-hero-copy>p{
  max-width:520px;
  margin:0 0 22px;
  color:rgba(255,247,233,.88);
  font-size:15px;
  line-height:1.55;
}
.pp-premium .hero-pills{gap:9px}
.pp-premium .hero-pills span{
  padding:8px 12px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.17);
  box-shadow:inset 0 1px rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
}
.pp7-hero-brand{
  position:relative;z-index:2;
  display:grid;place-items:center;
  padding:32px 30px 32px 8px;
  perspective:1000px;
}
.pp7-hero-brand:before{
  content:"";
  position:absolute;
  width:320px;height:320px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,220,171,.20),rgba(255,220,171,0) 69%);
  filter:blur(2px);
}
.pp7-brand-frame{
  position:relative;
  width:min(100%,390px);
  aspect-ratio:1.75/1;
  border-radius:26px;
  overflow:hidden;
  background:#bc171d;
  border:1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 70px rgba(62,0,0,.38),
    0 0 0 7px rgba(255,255,255,.035);
  transform-style:preserve-3d;
  will-change:transform;
}
.pp7-brand-frame:after{
  content:"";position:absolute;inset:-80% -30%;
  background:linear-gradient(105deg,transparent 40%,rgba(255,246,225,.28) 50%,transparent 60%);
  transform:translateX(-100%) rotate(4deg);
  animation:pp7BrandSweep 6.2s ease-in-out 1.5s infinite;
}
.pp7-brand-logo{
  width:100%;height:100%;object-fit:cover;display:block;
}
.pp7-brand-mark{
  position:absolute;right:18px;bottom:17px;
  padding:7px 10px;border-radius:999px;
  background:rgba(48,5,7,.48);
  border:1px solid rgba(255,255,255,.14);
  color:#fff5e5;font-size:9px;font-weight:900;letter-spacing:.15em;
  backdrop-filter:blur(9px);
}
.pp7-hero-line{
  position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,transparent,#f4c57d 28%,#fff0c8 50%,#f4c57d 72%,transparent);
  opacity:.58;
}

/* ---------- premium section reveal styling ---------- */
.pp-premium .active-order-card,
.pp-premium .offer-strip,
.pp-premium .search-row,
.pp-premium .category-tabs,
.pp-premium .section-heading,
.pp-premium .menu-grid{
  will-change:transform,opacity;
}

.pp-premium .offer-strip{
  gap:12px;
  margin:20px 0;
}
.pp-premium .offer-card{
  min-height:122px;
  padding:18px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.11);
  box-shadow:0 14px 34px rgba(55,27,14,.10);
  transition:transform .25s ease,box-shadow .25s ease;
}
.pp-premium .offer-card:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 46px rgba(55,27,14,.15);
}
.pp-premium .offer-card strong{font-size:18px}
.pp-premium .offer-card b{font-size:27px}

.pp-premium .search-row{margin:18px 0 12px}
.pp-premium .search-box{
  height:58px;
  border-radius:19px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(183,135,93,.30);
  box-shadow:0 10px 26px rgba(69,35,17,.055);
  backdrop-filter:blur(12px);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.pp-premium .search-box:focus-within{
  transform:translateY(-2px);
  border-color:rgba(190,25,30,.34);
  box-shadow:0 0 0 5px rgba(190,25,30,.055),0 16px 34px rgba(69,35,17,.08);
}

.pp-premium .category-tabs{
  position:sticky;
  top:90px;
  z-index:32;
  margin:0 -6px;
  padding:9px 6px;
  border-radius:18px;
  background:rgba(255,243,224,.80);
  backdrop-filter:blur(16px) saturate(1.15);
}
.pp-premium .category-chip{
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.84);
  border:1px solid rgba(179,128,83,.27);
  box-shadow:0 5px 15px rgba(66,34,17,.045);
  transition:transform .18s ease,background .2s ease,color .2s ease,box-shadow .2s ease;
}
.pp-premium .category-chip:hover{transform:translateY(-2px)}
.pp-premium .category-chip.active{
  background:linear-gradient(135deg,#2b1912,#4a261b);
  color:white;border-color:#2b1912;
  box-shadow:0 9px 22px rgba(43,25,18,.16);
}
.pp-premium .category-chip:active{transform:scale(.95)}

.pp-premium .section-heading{margin:25px 0 13px}
.pp-premium .section-heading h2{
  font-size:34px;
  letter-spacing:-.035em;
}
.pp-premium .section-heading .eyebrow{color:#bd1d22}

/* ---------- menu cards ---------- */
.pp-premium .menu-grid{
  gap:16px;
  perspective:900px;
}
.pp-premium .menu-card{
  position:relative;
  overflow:hidden;
  border-radius:25px;
  background:linear-gradient(180deg,rgba(255,255,255,.93),rgba(255,249,240,.98));
  border:1px solid rgba(201,160,119,.27);
  box-shadow:0 12px 32px rgba(64,34,17,.07);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
  transform-style:preserve-3d;
}
.pp-premium .menu-card:hover{
  transform:translateY(-5px);
  border-color:rgba(188,30,34,.20);
  box-shadow:0 22px 50px rgba(64,34,17,.13);
}
.pp-premium .food-visual{
  height:205px;
  background:linear-gradient(145deg,#f7e5cb,#edd5b5);
}
.pp-premium .food-visual img{
  transition:transform .5s cubic-bezier(.2,.75,.2,1),filter .35s ease;
}
.pp-premium .menu-card:hover .food-visual img{
  transform:scale(1.045);
}
.pp-premium .food-visual:after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 58%,rgba(33,17,10,.12));
}
.pp-premium .food-visual small{
  z-index:2;
  box-shadow:0 5px 13px rgba(166,26,24,.18);
}
.pp-premium .menu-card-body{padding:15px;min-height:184px}
.pp-premium .food-title-button h3{font-size:17px}
.pp-premium .food-card-description{line-height:1.55}
.pp-premium .product-price-block strong{font-size:22px}
.pp-premium .add-button{
  position:relative;overflow:hidden;
  border-radius:13px;
  background:linear-gradient(135deg,#d43134,#ad151b);
  box-shadow:0 9px 19px rgba(178,26,27,.17);
  transition:transform .15s ease,box-shadow .2s ease;
}
.pp-premium .add-button:active{transform:scale(.93)}
.pp-premium .qty-control{
  border-radius:14px;
  box-shadow:0 8px 18px rgba(28,18,13,.13);
}
.pp-premium .qty-control button{border-radius:9px}

/* ---------- one intentional interaction: food -> cart ---------- */
.pp7-food-flyer{
  position:fixed;
  z-index:100000;
  pointer-events:none;
  object-fit:cover;
  overflow:hidden;
  border-radius:18px;
  box-shadow:0 22px 50px rgba(31,16,9,.30);
  transform-origin:center;
  will-change:transform,opacity;
}
.pp7-food-flyer.fallback{
  display:grid;place-items:center;
  background:#f8e5c7;
  font-size:48px;
}

/* ---------- cart ---------- */
.pp-premium .cart-bar{
  position:fixed;
  z-index:70;
  min-height:60px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(120deg,#1b120e,#2e1b14 58%,#411d16);
  box-shadow:0 22px 58px rgba(29,15,9,.29);
  backdrop-filter:blur(16px);
}
.pp-premium .cart-bar:after{
  content:"";position:absolute;inset:-100% -25%;
  background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.12) 50%,transparent 58%);
  transform:translateX(-100%);
  animation:pp7CartShine 5.4s ease-in-out infinite;
  pointer-events:none;
}
.pp-premium .cart-bar>*{position:relative;z-index:1}
.pp-premium #cartCount{
  display:inline-grid;place-items:center;
  min-width:23px;height:23px;padding:0 5px;
  margin-right:3px;border-radius:999px;
  background:#d83234;color:white;
}
.pp-premium .cart-bar.pp7-cart-pop{
  animation:pp7CartPop .55s cubic-bezier(.16,.9,.25,1.35);
}

/* ---------- sheets ---------- */
.pp-premium .sheet-backdrop{
  backdrop-filter:blur(11px);
  -webkit-backdrop-filter:blur(11px);
}
.pp-premium .bottom-sheet{
  border-radius:29px;
  background:
    radial-gradient(circle at 50% 0,rgba(235,190,121,.16),transparent 15rem),
    linear-gradient(180deg,#fffdf9,#fff6e8);
  border:1px solid rgba(255,255,255,.74);
  box-shadow:0 34px 100px rgba(34,18,10,.34);
}
.pp-premium .sheet-handle{
  width:58px;height:5px;
  background:linear-gradient(90deg,#dfc29d,#be1a20,#dfc29d);
}
.pp-premium .food-detail-media{
  border-radius:21px;
  box-shadow:0 14px 36px rgba(72,39,20,.11);
}
.pp-premium .detail-thumb{
  transition:transform .18s ease,box-shadow .18s ease;
}
.pp-premium .detail-thumb.active{
  transform:translateY(-2px);
  box-shadow:0 6px 14px rgba(190,25,30,.15);
}
.pp-premium .bill-card{
  background:linear-gradient(135deg,#f5e7d4,#fff1dc);
  border:1px solid rgba(199,161,120,.36);
}
.pp-premium #placeOrder,
.pp-premium .food-detail-actions .primary-button{
  background:linear-gradient(135deg,#d73336,#ad151b);
  box-shadow:0 10px 24px rgba(178,26,27,.18);
}

/* ---------- order state ---------- */
.pp-premium .active-order-card{
  border-color:rgba(198,158,117,.30);
  box-shadow:0 14px 34px rgba(62,33,18,.065);
}
.pp-premium .customer-token-card{
  background:
    radial-gradient(circle at 50% -10%,rgba(235,190,121,.16),transparent 50%),
    linear-gradient(145deg,#1b120e,#3a2118);
  box-shadow:0 18px 46px rgba(34,20,13,.20);
}
.pp7-status-flash{
  position:absolute;inset:0;pointer-events:none;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);
  opacity:0;
}

/* ---------- keyframes ---------- */
@keyframes pp7BadgeShine{
  0%,72%{transform:translateX(-95%)}
  93%,100%{transform:translateX(95%)}
}
@keyframes pp7BrandSweep{
  0%,68%{transform:translateX(-100%) rotate(4deg)}
  90%,100%{transform:translateX(100%) rotate(4deg)}
}
@keyframes pp7CartShine{
  0%,72%{transform:translateX(-100%)}
  92%,100%{transform:translateX(100%)}
}
@keyframes pp7CartPop{
  0%{transform:translateX(-50%) scale(1)}
  40%{transform:translateX(-50%) scale(1.035) translateY(-4px)}
  75%{transform:translateX(-50%) scale(.997)}
  100%{transform:translateX(-50%) scale(1)}
}

/* ---------- responsive ---------- */
@media(max-width:850px){
  .pp-premium .hero-card.pp7-hero{
    grid-template-columns:1fr .82fr;
  }
  .pp7-hero-copy{padding-left:30px}
}
@media(max-width:700px){
  .pp-premium .customer-topbar{height:70px;padding:0 12px}
  .pp-premium .brand-logo.pp7-header-logo{width:72px;height:42px;border-radius:11px}
  .pp-premium .brand-name{font-size:13px}
  .pp-premium .brand-tagline{font-size:9px}
  .pp-premium .table-badge{font-size:10px;padding:9px 11px}

  .pp-premium .customer-shell{padding-top:12px}
  .pp-premium .hero-card.pp7-hero{
    min-height:0;
    grid-template-columns:1fr;
    border-radius:25px;
  }
  .pp7-hero-copy{
    padding:24px 20px 14px;
  }
  .pp7-hero-copy h1{
    font-size:35px;
    line-height:1.02;
  }
  .pp7-hero-copy>p{font-size:13px;margin-bottom:15px}
  .pp7-hero-brand{
    min-height:205px;
    padding:12px 20px 24px;
  }
  .pp7-brand-frame{
    width:min(91%,360px);
    border-radius:20px;
  }

  .pp-premium .offer-strip{display:flex;overflow:auto;padding-bottom:4px}
  .pp-premium .offer-card{min-width:235px}
  .pp-premium .category-tabs{top:74px}
  .pp-premium .section-heading h2{font-size:29px}
  .pp-premium .menu-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .pp-premium .menu-card{border-radius:20px}
  .pp-premium .food-visual{height:145px}
  .pp-premium .menu-card-body{padding:10px;min-height:188px}
  .pp-premium .food-title-button h3{font-size:14px}
  .pp-premium .food-card-description{font-size:10px}
  .pp-premium .product-price-block strong{font-size:18px}
  .pp-premium .add-button{font-size:10px;padding:9px 10px}
}
@media(prefers-reduced-motion:reduce){
  .pp-premium .table-badge:after,
  .pp7-brand-frame:after,
  .pp-premium .cart-bar:after{animation:none!important}
}