/** Shopify CDN: Minification failed

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

**/
/* ============================================================
   CRAVY FRIES — Global design tokens + button system
   Extracted from the Claude design. Loaded site-wide so fonts,
   colors, and buttons stay identical on every page & section.
   ============================================================ */

/* ---- Custom brand fonts (self-hosted webfonts) ---- */
@font-face {
  font-family: 'Cravyy';
  src: url('cravyy.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cartoonist';
  src: url('cartoonist.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ---- Design tokens ---- */
:root {
  /* Brand colors */
  --cravy-red:        #E90000;
  --cravy-tag-red:    #DD2D35;
  --cravy-orange:     #FE4100;
  --cravy-yellow:     #FB9D00;
  --cravy-green:      #1B5536;
  --cravy-maroon:     #411215;
  --cravy-black:      #000000;
  --cravy-ink:        #221F20;
  --cravy-white:      #F7F5F7;
  --cravy-page:       #FFFFFF;
  --cravy-line:       #A6A6A6;
  --cravy-line-dark:  #515151;

  /* Semantic */
  --brand-primary:    var(--cravy-red);
  --text-body:        #000000;
  --text-on-color:    #FFFFFF;
  --text-muted:       rgba(255,255,255,.5);

  /* Font stacks (custom first, free Google-font fallback second) */
  --font-statement:  'Cravyy','Anton',sans-serif;                 /* huge hero statements */
  --font-display:    'Cartoonist','Luckiest Guy',cursive;         /* display headings     */
  --font-compressed: 'Six Caps',sans-serif;                       /* condensed labels     */
  --font-body:       'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-alt:        'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  /* Type scale — heading sizes multiply by --cravy-hscale, driven by
     Theme settings → Typography → Heading size (1 = 100%, up to 5 = 500%). */
  --cravy-hscale: 1;
  --size-statement:  calc(clamp(48px, 11vw, 190px) * var(--cravy-hscale));
  --size-section:    calc(clamp(40px, 8vw, 120px) * var(--cravy-hscale));
  --size-cover:      calc(clamp(40px, 7vw, 100px) * var(--cravy-hscale));
  --size-heading:    calc(clamp(28px, 4vw, 40px) * var(--cravy-hscale));
  --size-subhead:    calc(clamp(22px, 3vw, 32px) * var(--cravy-hscale));
  --size-body:       clamp(16px, 1.4vw, 24px);
  --size-label:      20px;
  --size-caption:    16px;

  /* Line heights */
  --lh-display:  .9;
  --lh-subhead:  1.0;
  --lh-body:     1.2;

  /* Button geometry (one source of truth) */
  --btn-radius:      999px;
  --btn-pad-y:       14px;
  --btn-pad-x:       30px;
  --btn-shadow:      0 4px 0 rgba(0,0,0,.25);
  --btn-font:        var(--font-body);
  --btn-weight:      700;
  --btn-tracking:    .04em;
}

/* Load the Google-hosted fallback/support fonts (free) */
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Luckiest+Guy&family=Montserrat:wght@400;500;600;700;800&family=Poppins:wght@400;500;600;700&family=Six+Caps&display=swap');

/* ---- Global typography defaults ---- */
body,
.cravy,
.cravy * {
  font-family: var(--font-body);
}

/* ---- Cravyy rules: ALWAYS uppercase + tight tracking ----
   Design "tracking -100" = -100/1000 em = -0.1em.
   Applied to every section title that uses the Cravyy (statement) font.
   When the "Cravyy for all headings" toggle is on, theme.liquid adds the
   same two properties to all headings too. */
:root { --cravyy-tracking: -0.10em; }
.cravy-hero__title,
.cravy-st__title,
.cravy-pr__title,
.cravy-tm__title,
.cravy-pc__title,
.cravy-wh__title,
.cravy-so__title {
  text-transform: uppercase !important;
  letter-spacing: var(--cravyy-tracking) !important;
}


/* ============================================================
   ONE BUTTON SYSTEM — applies to Dawn's buttons AND our sections
   so every button across the whole site is identical.
   ============================================================ */
.button,
.shopify-payment-button__button--unbranded,
.cravy-btn {
  --shadow-horizontal-offset: 0;   /* neutralize Dawn's own button shadow vars */
  --shadow-vertical-offset: 4px;
  --shadow-blur-radius: 0;
  --shadow-opacity: .25;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5em;

  font-family: var(--btn-font);
  font-weight: var(--btn-weight);
  font-size: 16px;
  line-height: 1;
  letter-spacing: var(--btn-tracking);
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;

  padding: var(--btn-pad-y) var(--btn-pad-x);
  border-radius: var(--btn-radius);
  border: 0;
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}
.button::after,
.cravy-btn::after { display: none; }   /* remove Dawn's pseudo-border overlay */

.button:hover,
.cravy-btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.04);
}
.button:active,
.cravy-btn:active {
  transform: translateY(2px);
  box-shadow: 0 1px 0 rgba(0,0,0,.25);
}

/* Variants ---------------------------------------------------- */
/* Primary = black pill (Dawn primary + our default) */
.button--primary,
.cravy-btn,
.cravy-btn--primary {
  background: var(--cravy-black);
  color: var(--cravy-white);
  box-shadow: var(--btn-shadow);
}
/* Secondary = cream pill */
.button--secondary,
.cravy-btn--secondary {
  background: rgba(247,245,247,.94);
  color: var(--cravy-black);
  box-shadow: var(--btn-shadow);
}
/* Accent = brand red pill */
.cravy-btn--red {
  background: var(--cravy-red);
  color: #fff;
  box-shadow: var(--btn-shadow);
}
/* Utility = yellow, soft corners, no shadow (contact style) */
.cravy-btn--yellow {
  background: var(--cravy-yellow);
  color: var(--cravy-black);
  border-radius: 8px;
  box-shadow: none;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 600;
}

/* ============================================================
   COMMERCE PAGES — brand touches for the built-in Dawn
   product / collection (listing) / cart pages.
   ============================================================ */
/* Big page titles use the brand display font */
.product__title,
.product__title > *,
.collection-hero__title,
.main-page-title,
.cart__warnings .cart__empty-text,
#main-cart-items .title,
.cart__contents .title--primary,
.title-wrapper--no-top-margin > .title {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: .01em;
  line-height: 1.02;
}

/* Product price a touch bolder/brandier */
.price__regular .price-item,
.price .price-item--regular {
  font-weight: 800;
}

/* Product cards: rounded, subtle brand shadow */
.card--standard .card__inner,
.card--card,
.card__media,
.collection-list__item .card {
  border-radius: 18px;
  overflow: hidden;
}
.card-wrapper:hover .card__media img {
  transform: scale(1.03);
}

/* Collection listing header (red brand band) reads on the scheme we set;
   keep the grid content clean/white below it. */
.collection-hero { padding-block: 3rem; }

/* Cart: brand the checkout + update buttons (inherit pill already);
   make the cart title stand out. */
.cart__ctas .cart__checkout-button {
  border-radius: var(--btn-radius);
}

/* Keep long product titles legible if they wrap */
.product__title { word-break: normal; overflow-wrap: anywhere; }