/** Shopify CDN: Minification failed

Line 25:0 All "@import" rules must come first

**/
/* ==========================================================
   Wrap City Chips - reskin (from Figma "Flavor Home")
   Everything is scoped under .wc-* so it can't leak into the
   rest of the theme. Safe to add to a DUPLICATE theme.
   Brand fonts are self-hosted theme assets (client approved, Gavin 2026-11-09 - same approach as
   wrapcitysandwiches.com). Veneer is split by unicode-range: caps/digits/punctuation (what the uppercase
   headings use) + lowercase/accents, so most pages only download the first file. Rebuild: scratchpad build_webfonts.py.
   ========================================================== */

@font-face { font-family: 'veneer'; src: url('//wrapcitychips.com/cdn/shop/t/9/assets/wc-veneer-caps.woff2?v=178930097350260234811794236765') format('woff2'); font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0020-0060, U+007B-007E, U+00A0-00BF, U+00C0-00DE, U+00D7, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+2039-203A, U+20AC, U+2122; }
@font-face { font-family: 'veneer'; src: url('//wrapcitychips.com/cdn/shop/t/9/assets/wc-veneer-lower.woff2?v=86441371745288237831794236765') format('woff2'); font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0061-007A, U+00DF-00FF, U+0131, U+0152-0153; }
@font-face { font-family: 'roc-grotesk'; src: url('//wrapcitychips.com/cdn/shop/t/9/assets/wc-roc-grotesk-regular.woff2?v=2247630081018758741794236765') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'roc-grotesk'; src: url('//wrapcitychips.com/cdn/shop/t/9/assets/wc-roc-grotesk-medium.woff2?v=7648311216327126291794236765') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'roc-grotesk'; src: url('//wrapcitychips.com/cdn/shop/t/9/assets/wc-roc-grotesk-bold.woff2?v=121821640194141383541794236765') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'coffee-service'; src: url('//wrapcitychips.com/cdn/shop/t/9/assets/wc-coffee-service.woff2?v=86445390535623769511794236765') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }

/* free stand-in for Veneer while it loads */
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');

:root {
  --wc-charcoal: #1a1a18;
  --wc-gold: #f5a300;
  --wc-white: #ffffff;
  --wc-font-display: 'veneer', 'Anton', Impact, 'Arial Narrow Bold', sans-serif;
  --wc-font-body: 'roc-grotesk', 'Helvetica Neue', Arial, sans-serif;
  --wc-font-script: 'coffee-service', 'Brush Script MT', cursive;
  --wc-pad-x: 80px;
}

/* ---------- shared ---------- */
/* :where() = zero specificity, so section colours (.wc-banner, .wc-signup...) win even though
   every section re-links this file and a later copy would otherwise re-apply these defaults */
:where(.wc-section) {
  background: var(--wc-charcoal);
  color: var(--wc-white);
  font-family: var(--wc-font-body);
  font-weight: 700;
  line-height: 1.4;
}
.wc-section *, .wc-section *::before, .wc-section *::after { box-sizing: border-box; }
.wc-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- sign-up pop-up (sections/wc-popup) ---------- */
.wc-popup { width: 640px; max-width: calc(100vw - 32px); padding: 0; border: 0; overflow: hidden; background: var(--wc-green, #287908); color: var(--wc-white); }
.wc-popup[open] { display: grid; grid-template-columns: 320px 1fr; }
.wc-popup::backdrop { background: rgba(26,26,24,.6); }
.wc-popup__media img { display: block; width: 100%; height: 100%; min-height: 400px; object-fit: cover; }
.wc-popup__body { display: flex; flex-direction: column; justify-content: center; padding: 40px 32px; text-align: center; }
.wc-popup__title { margin: 0; font-family: var(--wc-font-display); font-weight: 400; font-size: 44px; line-height: 1; text-transform: uppercase; }
.wc-popup__sub { margin: 16px 0 26px; font-size: 16px; font-weight: 500; line-height: 1.4; }
.wc-popup__form { display: flex; flex-direction: column; gap: 14px; }
.wc-popup__field { width: 100%; height: 47px; padding: 0 20px; border: 2px solid var(--wc-charcoal); border-radius: 100px; background: #fff; color: var(--wc-charcoal); font: 400 16px var(--wc-font-body); text-transform: uppercase; text-align: center; }
.wc-popup__field::placeholder { color: var(--wc-charcoal); opacity: .5; }
.wc-popup__btn { height: 47px; border: 2px solid var(--wc-white); border-radius: 100px; background: transparent; color: var(--wc-white); font: 700 16px var(--wc-font-body); text-transform: uppercase; cursor: pointer; }
.wc-popup__btn:hover { background: var(--wc-white); color: var(--wc-green, #287908); }
.wc-popup__msg { margin: 0; font-size: 16px; }
.wc-popup__close { position: absolute; top: 8px; right: 12px; width: 32px; height: 32px; padding: 0; border: 0; background: none; color: var(--wc-white); font-size: 30px; line-height: 1; cursor: pointer; }
@media (max-width: 600px) {
  .wc-popup[open] { grid-template-columns: 1fr; }
  .wc-popup__media img { min-height: 0; height: 200px; object-position: center 30%; }
  .wc-popup__body { padding: 28px 24px 32px; }
  .wc-popup__title { font-size: 40px; }
  .wc-popup__close { color: var(--wc-white); text-shadow: 0 1px 4px rgba(0,0,0,.6); }
}

/* coded dark wash over background videos (snippets/wc-bg-video) */
/* footer anchored to the bottom on short pages (search, empty cart, 404 — BugHerd): main fills the leftover
   height and its last section stretches with it. Long pages are unchanged (checked on every template). */
body { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
main#MainContent { flex: 1 0 auto; display: flex; flex-direction: column; }
main#MainContent > .shopify-section:last-of-type { flex: 1 0 auto; display: flex; flex-direction: column; }
main#MainContent > .shopify-section:last-of-type > :is(section, div, data-island, header, article):last-child { flex: 1 0 auto; }
.wc-wash { position: absolute; inset: 0; background: rgba(26,26,24, var(--wc-wash, .4)); pointer-events: none; }.wc-section a { color: inherit; text-decoration: none; }
.wc-section a:focus-visible,
.wc-section button:focus-visible,
.wc-section input:focus-visible { outline: 3px solid var(--wc-gold); outline-offset: 3px; }

.wc-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 15px 30px; border-radius: 100px;
  background: var(--wc-gold); color: var(--wc-charcoal) !important;
  font-family: var(--wc-font-body); font-weight: 700; font-size: 18px; line-height: 1.4;
  text-transform: uppercase; white-space: nowrap; border: 0; cursor: pointer;
  transition: transform .15s ease, filter .15s ease;
}
.wc-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* After a form posts, Shopify reloads the page at #<form id>, so the browser scrolls the form to the very top
   and its heading/intro end up off-screen. Stop short so the whole band (heading + text + form) stays visible. */
#wc-inquiry-form, #wc-signup-form, #wc-request-form { scroll-margin-top: 300px; }
#wc-newsletter-form { scroll-margin-top: 160px; }
@media (max-width: 960px) {
  #wc-inquiry-form, #wc-signup-form, #wc-request-form { scroll-margin-top: 260px; }
  #wc-newsletter-form { scroll-margin-top: 120px; }
}

/* show one of two wordings per breakpoint (mobile copy differs in some Figma frames) */
.wc-section .wc-m-only { display: none; }
@media (max-width: 960px) {
  .wc-section .wc-m-only { display: inline; }
  .wc-section .wc-d-only { display: none; }
}

/* ---------- header ---------- */
.wc-header { padding: 51px var(--wc-pad-x) 0; }
/* home page: transparent header sitting on the hero photo */
.wc-header--overlay { position: absolute; top: 0; left: 0; right: 0; z-index: 20; background: transparent; }
/* sticky nav (BugHerd, desktop + mobile): the header is fixed to the top; once the page scrolls it turns solid
   charcoal and tightens up. Overlay pages keep it see-through over the hero until then; other pages keep a spacer
   (--wc-header-h, measured in wc-header.liquid) so content starts below it. z-index clears the store-locator map. */
.wc-header { position: fixed; top: 0; left: 0; right: 0; z-index: 1200; background: var(--wc-charcoal); transition: background-color .25s ease, padding .25s ease, box-shadow .25s ease; }
.wc-header--overlay { position: fixed; z-index: 1200; background: transparent; }
.wc-header.is-stuck { padding-top: 16px; padding-bottom: 16px; background: var(--wc-charcoal); box-shadow: 0 2px 16px rgba(0,0,0,.35); }
.wc-header.is-stuck .wc-header__logo img { width: 150px; }
.wc-header__logo img { transition: width .25s ease; }
.shopify-section-group-header-group:has(> .wc-header:not(.wc-header--overlay)) { height: var(--wc-header-h, 116px); }
html { scroll-padding-top: 110px; }
.wc-header--overlay.is-open { background: var(--wc-charcoal); padding-bottom: 16px; }
.wc-header__inner { display: flex; align-items: center; gap: 43px; max-width: 1280px; margin: 0 auto; }
.wc-header__logo { flex: 0 0 auto; display: block; }
.wc-header__logo img { display: block; width: 197px; height: auto; }
.wc-header__logo-text { font-family: var(--wc-font-display); font-size: 32px; text-transform: uppercase; font-weight: 400; }
.wc-header__nav { flex: 0 1 auto; }
.wc-nav { display: flex; gap: 36px; list-style: none; margin: 0; padding: 0; font-size: 16px; text-transform: uppercase; }
.wc-nav a:hover, .wc-nav a[aria-current="page"] { color: var(--wc-gold); }
/* Figma: icon group ends at x=1172 of 1440, i.e. 188px (14.69% of the 1280 container) short of the right edge */
.wc-header__actions { display: flex; align-items: center; gap: 20px; flex: 0 0 auto; margin-left: auto; margin-right: 14.69%; }
/* inner pages (About design): icons + gold Shop Now pill, flush right */
.wc-header--has-btn .wc-header__actions { margin-right: 0; }
.wc-header__actions .wc-btn { margin-left: 12px; }
.wc-icon-link { position: relative; display: inline-flex; color: var(--wc-white); }
.wc-icon-link svg { display: block; fill: currentColor; }
.wc-icon-link:hover { color: var(--wc-gold); }
.wc-cart-count {
  position: absolute; top: -8px; right: -10px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 100px; background: var(--wc-gold); color: var(--wc-charcoal);
  font-size: 11px; line-height: 18px; text-align: center;
}
.wc-header__toggle { display: none; background: none; border: 0; padding: 0; color: var(--wc-white); cursor: pointer; }
.wc-header__toggle svg { display: block; width: 30px; height: 20px; }

/* ---------- flavor grid ---------- */
.wc-flavors { padding: 0 var(--wc-pad-x) 120px; }
.wc-flavors__head { text-align: center; max-width: 1100px; margin: 0 auto; padding: 64px 0 48px; }
.wc-flavors__title {
  margin: 0 0 40px; font-family: var(--wc-font-display); font-weight: 400;
  font-size: clamp(56px, 9.45vw, 136px); line-height: 1; text-transform: uppercase;
}
.wc-flavors__sub { margin: 0; font-size: 24px; line-height: 1.4; }
.wc-flavors__wrap { position: relative; }
.wc-flavors__grid {
  display: grid; grid-template-columns: repeat(3, 304px); justify-content: center;
  column-gap: 64px; row-gap: 112px; margin: 24px auto 0; padding: 0; list-style: none;
}
/* mobile carousel arrows: gold discs, arrow knocked out (Figma "controls") */
.wc-flavors__arrow { display: none; position: absolute; top: 159px; z-index: 2; width: 36px; height: 36px; padding: 0; border: 0; background: none; color: var(--wc-gold); cursor: pointer; }
.wc-flavors__arrow svg { display: block; width: 100%; height: 100%; fill: currentColor; }
.wc-flavors__arrow--prev svg { transform: rotate(180deg); }
.wc-flavors__arrow--prev { left: 0; }
.wc-flavors__arrow--next { right: 0; }
.wc-flavors__arrow:hover { filter: brightness(1.1); }

/* gold variant = "You're gonna want more" under a product (Figma Flavor Subpage) */
.wc-flavors--gold { padding-top: 100px; padding-bottom: 113px; background: var(--wc-gold); color: var(--wc-charcoal); }
.wc-flavors--gold .wc-flavors__head { max-width: none; padding: 0; }
.wc-flavors--gold .wc-flavors__title { margin: 0; font-size: clamp(44px, 6.4vw, 92px); }
.wc-flavors--gold .wc-btn { background: var(--wc-charcoal); color: #fff !important; }
.wc-flavors--gold .wc-flavors__arrow { color: var(--wc-charcoal); }
.wc-flavors--cols-4 .wc-flavors__grid { grid-template-columns: repeat(4, 304px); column-gap: 20px; margin-top: 28px; }
.wc-flavor { display: flex; flex-direction: column; align-items: center; text-align: center; width: 304px; }
.wc-flavor__media { display: flex; align-items: flex-end; justify-content: center; width: 100%; height: 381px; margin-bottom: 8px; }
.wc-flavor__media { position: relative; }
/* Figma "NEW badge": 103x76 sticker with an inset outline, top-left of the bag */
.wc-flavor__badge { position: absolute; z-index: 1; top: 19px; left: 41px; display: flex; align-items: center; justify-content: center; width: 103px; height: 76px; padding: 6px 8px; background: var(--wc-red, #e8202e); transform: rotate(-4deg); }
.wc-flavor__badge span { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border: 2px solid #fff; color: #fff; font-family: var(--wc-font-display); font-size: 40px; line-height: 1; text-transform: uppercase; }
.wc-flavor__media img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.wc-flavor__name { margin: 0 0 24px; font-size: 24px; line-height: 1.4; font-weight: 700; }

/* ---------- footer ---------- */
.wc-footer { padding: 58px var(--wc-pad-x) 24px; }
.wc-footer__inner { display: grid; grid-template-columns: 1fr auto auto 420px; column-gap: 64px; max-width: 1280px; margin: 0 auto; align-items: start; }
.wc-footer__logo img { display: block; width: 197px; height: auto; }
.wc-footer__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; font-size: 16px; text-transform: uppercase; }
.wc-footer__links a:hover { color: var(--wc-gold); }
.wc-footer__social { display: flex; gap: 12px; margin-top: 24px; }
.wc-footer__social a { display: inline-flex; }
.wc-footer__social svg { width: 24px; height: 24px; fill: currentColor; }
.wc-footer__social a:hover { color: var(--wc-gold); }
.wc-newsletter__title { margin: 0 0 32px; font-family: var(--wc-font-display); font-weight: 400; font-size: 30px; line-height: 1.1; text-transform: uppercase; text-align: center; white-space: nowrap; }
.wc-newsletter__field, .wc-newsletter__submit { display: block; width: 100%; height: 47px; border-radius: 100px; font-family: var(--wc-font-body); font-size: 14px; text-transform: uppercase; text-align: center; }
.wc-newsletter__field { border: 0; background: var(--wc-white); color: var(--wc-charcoal); font-weight: 400; margin-bottom: 8px; }
.wc-newsletter__field::placeholder { color: var(--wc-charcoal); opacity: .5; }
.wc-newsletter__submit { border: 2px solid var(--wc-white); background: transparent; color: var(--wc-white); font-weight: 700; cursor: pointer; }
.wc-newsletter__submit:hover { background: var(--wc-white); color: var(--wc-charcoal); }
.wc-newsletter__msg { margin: 10px 0 0; font-size: 14px; text-align: center; }
/* success message stands in for the field + button */
.wc-newsletter__msg--done { margin: 0; padding: 12px 0; font: 700 20px/1.2 var(--wc-font-body); }
.wc-footer__legal { max-width: 1280px; margin: 64px auto 0; font-size: 14px; font-weight: 400; }
.wc-footer__legal a { text-decoration: none; }
.wc-footer__legal a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- responsive ---------- */
@media (max-width: 1180px) {
  .wc-flavors__grid, .wc-flavors--cols-4 .wc-flavors__grid { grid-template-columns: repeat(2, 304px); row-gap: 80px; }
  .wc-footer__inner { grid-template-columns: 1fr 1fr; row-gap: 48px; }
}
@media (max-width: 960px) {
  :root { --wc-pad-x: 24px; }
  /* Figma mobile header: logo 142px, search + cart + menu (no account), 16px apart */
  .wc-header { padding-top: 51px; }
  .wc-header__toggle { display: inline-flex; order: 3; }
  .wc-header__inner { flex-wrap: wrap; gap: 16px; }
  .wc-header__logo { margin-right: auto; }
  .wc-header__logo img { width: 142px; }
  .wc-header.is-stuck { padding-top: 12px; padding-bottom: 12px; }
  .wc-header.is-stuck .wc-header__logo img { width: 120px; }
  .wc-icon-link--account { display: none; }
  .wc-icon-link .wc-icon--search { width: 20px; height: 20px; }
  .wc-icon-link .wc-icon--cart { width: 24px; height: 20px; }
  .wc-header__actions { order: 2; gap: 16px; margin-right: 0; }
  .wc-header__actions .wc-btn { display: none; }
  .wc-header__nav { order: 4; flex: 1 0 100%; display: none; padding: 16px 0 8px; }
  .wc-header.is-open .wc-header__nav { display: block; }
  .wc-nav { flex-direction: column; gap: 18px; font-size: 18px; }
  .wc-flavors__sub { font-size: 20px; }
  .wc-flavors__title { margin-bottom: 24px; }
}
@media (min-width: 961px) { .wc-nav__cta { display: none; } }
@media (max-width: 720px) {
  /* Figma "Flavor Home Mobile": one flavor in view, swipe or tap the gold arrows */
  .wc-flavors { padding-bottom: 74px; }
  .wc-flavors__head { padding: 56px 0 0; }
  .wc-flavors__title { margin-bottom: 22px; font-size: 60px; }
  .wc-flavors__sub { max-width: 280px; margin: 0 auto; font-size: 16px; font-weight: 500; }
  /* justify-content must reset: the desktop grid's "center" pushes overflowing cards off the left edge (unscrollable half-cards) */
  .wc-flavors__grid { display: flex; justify-content: flex-start; gap: 0; margin-top: 5px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .wc-flavors__grid::-webkit-scrollbar { display: none; }
  .wc-flavors__grid > .wc-flavor { flex: 0 0 100%; width: auto; scroll-snap-align: center; }
  .wc-flavor__media { height: 358px; margin-bottom: 12px; }
  .wc-flavors__arrow { display: block; }
  .wc-flavors--gold { padding-top: 60px; padding-bottom: 60px; }
  .wc-flavors--gold .wc-flavors__title { font-size: 48px; }
  .wc-flavors--gold .wc-flavors__grid { margin-top: 30px; }
  /* the 4-column desktop gap must not leak into the 1-up carousel (cards would land off-centre) */
  .wc-flavors--cols-4 .wc-flavors__grid { column-gap: 0; }
  /* Figma mobile footer: centred logo, 2 link columns (2nd at x=203), newsletter + legal centred below */
  .wc-footer { padding: 56px 24px 51px; }
  .wc-footer__inner { grid-template-columns: 179px 1fr; row-gap: 0; column-gap: 0; }
  .wc-footer__inner > div:first-child { grid-column: 1 / -1; justify-self: center; margin-bottom: 40px; }
  .wc-footer__links { white-space: nowrap; }
  /* FINAL design: one centred link column */
  .wc-footer__links--empty { display: none; }
  .wc-footer__links--empty + div { grid-column: 1 / -1; justify-self: center; text-align: center; }
  .wc-footer__links--empty + div .wc-footer__social { justify-content: center; }
  .wc-footer__social { margin-top: 33px; }
  .wc-footer__social svg { width: 26px; height: 26px; }
  .wc-newsletter__title { font-size: clamp(18px, 6.4vw, 30px); }
  .wc-newsletter { grid-column: 1 / -1; justify-self: center; width: 100%; max-width: 312px; margin-top: 57px; }
  .wc-footer__legal { max-width: 312px; margin: 40px auto 0; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .wc-btn { transition: none; }
  .wc-btn:hover { transform: none; }
}

/* ---------- headline line breaks (snippets/wc-lines): | always, / desktop only, ~ mobile only ---------- */
.wc-br-m { display: none; }
@media (min-width: 961px) { .wc-lines { white-space: nowrap; } }
@media (max-width: 960px) { .wc-br-m { display: inline; } .wc-br-d { display: none; } }