/** Shopify CDN: Minification failed

Line 47:3 Unexpected "<"
Line 241:13 Expected identifier but found whitespace
Line 241:14 Unexpected "#1A0810"

**/
/* ===== GENERAL SANS SEMIBOLD FONT ===== */
@font-face {
  font-family: 'GeneralSans';
  src: url('https://cdn.shopify.com/s/files/1/0949/2411/2169/files/GeneralSans-Semibold.ttf?v=1780663647') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'GeneralSans';
  src: url('https://cdn.shopify.com/s/files/1/0949/2411/2169/files/GeneralSans-Bold.ttf?v=1780663647') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ============================================================
   GOORIN-STYLE FOOTER — Debutify 8.15
   File: assets/hatstore-footer.css
   
   Upload to Assets, then add to dbtfy-footer.liquid top:

/* ===== GENERAL SANS REGULAR FONT ===== */
@font-face {
  font-family: 'GeneralSansRegular';
  src: url('https://cdn.shopify.com/s/files/1/0949/2411/2169/files/GeneralSans-Regular.ttf?v=1780663647') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ===== APPLY TO ALL FOOTER TEXT — bold ===== */
.dbtfy-footer,
.dbtfy-footer *,
.dbtfy-footer-block,
.dbtfy-footer-block * {
  font-family: 'GeneralSansRegular', sans-serif !important;
  font-weight: 700 !important;
}
   <link rel="stylesheet" href="{{ 'hatstore-footer.css' | asset_url }}">
   ============================================================ */

/* ----------------------------------------------------------
   0. FOOTER HILL SCENE — CauliPuffs style
   ---------------------------------------------------------- */

/* Force footer section above hero sections */
#shopify-section-footer {
  position: relative;
  z-index: 2;
}

.hatstore-footer-scene {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #ffffff;
  height: 200px;
  line-height: 0;
  display: block;
  clear: both;
  z-index: 0;
}
.hfs-hills {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 200px;
}
@media screen and (max-width: 989px) {
  .hatstore-footer-scene { height: 160px; }
  .hfs-hills { height: 160px; }
}
@media screen and (max-width: 749px) {
  .hatstore-footer-scene { height: 130px; }
  .hfs-hills { height: 130px; }
}
/* Fix PageFly stacking context conflict on homepage */
div#__pf {
  overflow-x: clip !important;
}
body.template-index #shopify-section-footer,
body.index #shopify-section-footer {
  position: relative !important;
  z-index: 9999 !important;
}

/* Force footer section above PageFly homepage sections */
#shopify-section-footer {
  position: relative;
  z-index: 10;
  isolation: isolate;
}

/* Remove ALL borders between scene and footer */
#shopify-section-footer .dbtfy-footer,
#shopify-section-footer .dbtfy-footer.gradient,
.dbtfy-footer,
.footer-rounded,
.hatstore-footer-scene + *,
.hatstore-footer-scene + div,
.hatstore-footer-scene + .dbtfy-footer,
#shopify-section-footer > div:first-child {
  border-top: none !important;
  box-shadow: none !important;
  outline: none !important;
}
/* Also kill section-level padding-top that creates gap */
#shopify-section-footer .section-padding-top {
  padding-top: 0 !important;
}
/* cache-bust: footer-v6 */

/* ----------------------------------------------------------
   1. FOOTER BACKGROUND — dark navy (matching reference)
   ---------------------------------------------------------- */
.dbtfy-footer,
.dbtfy-footer.gradient,
body .dbtfy-footer,
#shopify-section-footer .dbtfy-footer,
[id*="footer"] .dbtfy-footer,
.footer-section .dbtfy-footer,
section.dbtfy-footer {
  background-color: #ffffff !important;
  background: #ffffff !important;
  background-attachment: unset !important;
  --gradient-background: #ffffff !important;
  --color-background: 214, 238, 120 !important;
}

/* ----------------------------------------------------------
   2. HIDE LOCALIZATION (language + country selectors)
   ---------------------------------------------------------- */
.dbtfy-footer-block__localization-form,
.dbtfy-footer localization-form,
.dbtfy-footer .localization-form,
#FooterCountryForm,
#FooterLanguageForm {
  display: none !important;
}

/* Make payment/copyright row full width when localization is hidden */
.dbtfy-footer-block__payment-business-registration {
  grid-column: span 12 !important;
  justify-self: center !important;
  text-align: center !important;
}

/* ----------------------------------------------------------
   3. HIDE NEWSLETTER BLOCK
      Newsletter block renders as .dbtfy-block__newsletter
      inside a footer block column
   ---------------------------------------------------------- */
.dbtfy-block__newsletter,
.dbtfy-footer .newsletter-form,
.dbtfy-footer .dbtfy-block__newsletter {
  display: none !important;
}

/* ----------------------------------------------------------
   4. SOCIAL ICONS — larger, white, prominent
      Replaces newsletter in right column
   ---------------------------------------------------------- */

/* Footer social section */
.dbtfy-footer-block__social-media {
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 0 !important;
}

/* Social heading */
.dbtfy-footer-block__social-media .dbtfy-block__subheading {
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: none !important;
  margin-bottom: 14px !important;
  display: block !important;
}

/* Social icons list */
.dbtfy-footer-block__social-media .list-social,
.dbtfy-block___social-media .list-social {
  justify-content: flex-start !important;
  gap: 4px !important;
}

/* CauliPuffs-style social icons — applied to existing list-social */
.dbtfy-footer .list-social {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  padding: 0 !important;
  margin: 0 !important;
}
.dbtfy-footer .list-social__item { list-style: none !important; }
.dbtfy-footer .list-social__link {
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  background-color: #98c7a7 !important;
  border: 3px solid #333b48 !important;
  box-shadow: 0 4px 0 #333b48 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  clip-path: none !important;
  color: #ffffff !important;
  text-decoration: none !important;
}
.dbtfy-footer .list-social__link:hover {
  transform: translateY(-2px) !important;
  background-color: #7a0e2d !important;
}
.dbtfy-footer .list-social__link .icon,
.dbtfy-footer .list-social__link svg {
  width: 22px !important;
  height: 22px !important;
  fill: #ffffff !important;
  color: #ffffff !important;
}
.dbtfy-footer .list-social__link svg path,
.dbtfy-footer .list-social__link svg rect,
.dbtfy-footer .list-social__link svg circle,
.dbtfy-footer .list-social__link svg polygon {
  fill: #ffffff !important;
  stroke: none !important;
}
  background: #1A0810 !important;
  border-radius: 16px !important;
  padding: 18px 20px !important;
  margin-bottom: 12px !important;
  display: block !important;
}
.hg-footer-card__label {
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  margin: 0 0 14px !important;
  display: block !important;
}
.hg-footer-social-icons { display: block !important; }
.hg-footer-social-icons .list-social,
.hg-footer-card .list-social {
  display: flex !important;
  gap: 12px !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.hg-footer-social-icons .list-social__item,
.hg-footer-card .list-social__item { list-style: none !important; }
.hg-footer-social-icons .list-social__link,
.hg-footer-card .list-social__link {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  border-radius: 50% !important;
  background: #98c7a7 !important;
  border: 3px solid #333b48 !important;
  box-shadow: 0 4px 0 #333b48 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  clip-path: none !important;
  padding: 0 !important;
  transition: transform 0.15s ease !important;
  color: #ffffff !important;
}
.hg-footer-social-icons .list-social__link:hover,
.hg-footer-card .list-social__link:hover { transform: translateY(-2px) !important; }
.hg-footer-social-icons .list-social__link svg,
.hg-footer-social-icons .list-social__link .icon,
.hg-footer-card .list-social__link svg,
.hg-footer-card .list-social__link .icon {
  width: 22px !important;
  height: 22px !important;
  fill: #ffffff !important;
  color: #ffffff !important;
  stroke: #ffffff !important;
}
.hg-footer-social-icons .list-social__link svg path,
.hg-footer-social-icons .list-social__link svg rect,
.hg-footer-social-icons .list-social__link svg circle,
.hg-footer-card .list-social__link svg path,
.hg-footer-card .list-social__link svg rect,
.hg-footer-card .list-social__link svg circle {
  fill: #ffffff !important;
  stroke: none !important;
}
.hg-footer-email {
  color: #98c7a7 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  display: block !important;
}
.hg-footer-email:hover { color: #ffffff !important; text-decoration: underline !important; }
/* Hide old social icons outside card */
.dbtfy-footer-block__social-media > .list-social { display: none !important; }

/* ----------------------------------------------------------
   5. FOOTER COLUMN HEADINGS — uppercase, white
   ---------------------------------------------------------- */
.dbtfy-footer .dbtfy-block__heading,
.dbtfy-footer .footer-block__heading,
.dbtfy-footer .footer-block__heading h4,
.dbtfy-footer .dbtfy-footer-heading,
.dbtfy-footer .dbtfy-footer-heading .dbtfy-block__subheading,
.dbtfy-footer .dbtfy-block__subheading,
.dbtfy-footer .title.inline-richtext,
.dbtfy-footer .title.inline-richtext span,
.dbtfy-footer h2.title,
.dbtfy-footer h3.title,
.dbtfy-footer h4.title,
.dbtfy-footer h2.title span,
.dbtfy-footer h3.title span,
.dbtfy-footer h4.title span,
.dbtfy-footer summary,
.dbtfy-footer details > summary {
  color: #ffffff !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  font-family: 'GeneralSans', var(--font-heading-family), sans-serif !important;
  letter-spacing: 0.05em !important;
  text-transform: none !important;
  margin-bottom: 4px !important;
}

/* ----------------------------------------------------------
   6. FOOTER LINKS — muted white, uppercase
   ---------------------------------------------------------- */
.dbtfy-footer a,
.dbtfy-footer .list-menu__item--link {
  color: rgba(255,255,255,0.75) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  letter-spacing: 0.03em !important;
  text-transform: none !important;
  text-decoration: none !important;
  padding: 5px 0 !important;
  display: block !important;
}

.dbtfy-footer a:hover {
  color: #ffffff !important;
  text-decoration: none !important;
}

/* ----------------------------------------------------------
   7. COPYRIGHT BAR — subtle, muted text
   ---------------------------------------------------------- */
.dbtfy-footer-copyright__content,
.dbtfy-footer-copyright__content a {
  color: rgba(255,255,255,0.6) !important;
  font-size: 11px !important;
  letter-spacing: 0.06em !important;
  text-transform: none !important;
}

/* ----------------------------------------------------------
   8. FOOTER BORDER / DIVIDERS
   ---------------------------------------------------------- */
.dbtfy-footer-block__copyright-social-wrapper {
  border-top: 1px solid #2A0812 !important;
  padding-top: 20px !important;
  margin-top: 20px !important;
}

/* ----------------------------------------------------------
   9. MOBILE: accordion carets — white
   ---------------------------------------------------------- */
.dbtfy-footer summary .icon-caret path {
  fill: #ffffff !important;
}

.dbtfy-footer summary {
  color: #ffffff !important;
}

/* ----------------------------------------------------------
   REMOVE POWERED BY DEBUTIFY (CSS fallback)
   ---------------------------------------------------------- */
.footer__branding {
  display: none !important;
}

/* Remove gap between footer heading and menu links */
.dbtfy-footer .dbtfy-footer-block > div,
.dbtfy-footer .dbtfy-footer-block .title.inline-richtext {
  margin-bottom: 4px !important;
  padding-bottom: 0 !important;
}
.dbtfy-footer .dbtfy-footer-block .list-menu {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
.dbtfy-footer .block-padding,
.dbtfy-footer [class*="block-"][class*="-padding"] {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ----------------------------------------------------------
   FOOTER LOGO
   ---------------------------------------------------------- */
.hatstore-footer-logo {
  margin-bottom: 32px;
}

.hatstore-footer-logo__img {
  height: auto;
  display: block;
  /* Invert if logo is dark on dark background */
  filter: brightness(0) invert(1);
}

.hatstore-footer-logo__text {
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: none !important;
  text-decoration: none !important;
  display: block;
  margin-bottom: 32px;
}

/* ----------------------------------------------------------
   MOBILE FOOTER — centered text + accordion
   ---------------------------------------------------------- */
@media screen and (max-width: 749px) {

  /* Center all footer text on mobile */
  .dbtfy-footer .dbtfy-footer-copyright,
  .dbtfy-footer-copyright__content,
  .dbtfy-footer-block__copyright,
  .dbtfy-footer-block__copyright-social-wrapper,
  .dbtfy-footer-block__policies,
  .dbtfy-footer-copyright__content a {
    text-align: center !important;
    justify-content: center !important;
  }

  .dbtfy-footer-block__policies {
    justify-content: center !important;
  }

  /* Center social icons on mobile */
  .dbtfy-footer-block__social-media {
    justify-content: center !important;
    align-items: center !important;
  }

  .dbtfy-footer-block__social-media .list-social {
    justify-content: center !important;
  }

  /* Footer logo centered on mobile */
  .hatstore-footer-logo {
    text-align: center;
  }

  .hatstore-footer-logo__img {
    margin: 0 auto;
  }

  /* Mobile footer — always show links expanded, no accordion */

  /* Force all details elements open */
  .dbtfy-footer details {
    open: true;
  }

  /* Hide the caret/arrow — no collapse behaviour */
  .dbtfy-footer .dbtfy-footer-block summary .icon-caret,
  .dbtfy-footer summary .icon-caret {
    display: none !important;
  }

  /* Always show the hidden content inside details */
  .dbtfy-footer details > *:not(summary) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
  }

  /* Summary heading row — no pointer, no border */
  .dbtfy-footer .dbtfy-footer-block summary,
  .dbtfy-footer summary.dbtfy-block__heading {
    pointer-events: none !important;
    cursor: default !important;
    padding-bottom: 8px !important;
    border-bottom: none !important;
    list-style: none !important;
  }

  /* Column headings */
  .dbtfy-footer .dbtfy-block__heading {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin-bottom: 12px !important;
  }

  /* Links */
  .dbtfy-footer .list-menu__item--link,
  .dbtfy-footer a:not(.list-social__link):not(.hatstore-footer-logo__text) {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: rgba(255,255,255,0.55) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    padding: 5px 0 !important;
    display: block !important;
  }

  .dbtfy-footer a:not(.list-social__link):hover {
    color: #ffffff !important;
  }

  /* Two-column grid for footer blocks on mobile */
  .dbtfy-footer .d-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 32px 16px !important;
  }
}

/* ----------------------------------------------------------
   BIG FULL-WIDTH BRAND NAME AT FOOTER BOTTOM
   Matches Goorin Bros style — giant clipped text
   ---------------------------------------------------------- */
.hatstore-footer-bigname {
  width: 100%;
  overflow: hidden;
  /* Clip so only top ~60% of letters show, text bleeds off bottom */
  max-height: 0.6em;
  line-height: 1;
  margin-top: 32px;
  user-select: none;
  pointer-events: none;
  /* Break out of page-width padding to go full bleed */
  margin-left: calc(-1 * var(--page-width-margin, 0px));
  margin-right: calc(-1 * var(--page-width-margin, 0px));
}

.hatstore-footer-bigname__text {
  display: block;
  /* Scale to exactly fill viewport width */
  font-size: clamp(100px, 20vw, 300px);
  font-weight: 900;
  letter-spacing: -0.03em;
  text-transform: none;
  /* Beige/cream tone like Goorin — not white */
  color: #1A0810;
  white-space: nowrap;
  line-height: 1;
  padding: 0;
  font-family: var(--font-heading-family, sans-serif);
  /* Start from left edge */
  text-align: left;
}

/* Image variant */
.hatstore-footer-bigname--image {
  max-height: none;
  display: flex;
  align-items: flex-end;
}

.hatstore-footer-bigname__img {
  width: 100%;
  height: auto;
  display: block;
  opacity: 0.3;
  object-fit: cover;
  object-position: top;
}

/* Footer overflow visible so bigname can bleed */
.dbtfy-footer {
  overflow: hidden !important;
}

.dbtfy-footer > div {
  overflow: hidden !important;
}

/* Page-width inside footer needs no overflow clip */
.dbtfy-footer .page-width {
  overflow: visible !important;
}

@media screen and (max-width: 749px) {
  .hatstore-footer-bigname__text {
    font-size: clamp(72px, 23vw, 160px);
  }
}
/* ===== SOCIAL + EMAIL CARDS — CauliPuffs style ===== */
.hg-footer-card {
  background: #1A0810 !important;
  border-radius: 16px !important;
  padding: 18px 20px !important;
  margin-bottom: 12px !important;
}
.hg-footer-card__label {
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  margin: 0 0 14px !important;
  display: block !important;
  font-family: 'GeneralSans', sans-serif !important;
}
.hg-footer-social-icons {
  display: flex !important;
  gap: 12px !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}
.hg-footer-social-icon {
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  background: #98c7a7 !important;
  border: 3px solid #333b48 !important;
  box-shadow: 0 4px 0 #333b48 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  transition: transform 0.15s ease !important;
  flex-shrink: 0 !important;
}
.hg-footer-social-icon:hover {
  transform: translateY(-2px) !important;
}
.hg-footer-social-icon svg {
  width: 22px !important;
  height: 22px !important;
}
.hg-footer-email {
  color: #98c7a7 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  display: block !important;
  font-family: 'GeneralSans', sans-serif !important;
  letter-spacing: 0.02em !important;
}
.hg-footer-email:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}
/* Hide old social icons from this block */
.dbtfy-footer-block__social-media .list-social { display: none !important; }
/* ===== FOOTER BOTTOM BAR ===== */
.hg-footer-bottom {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 4px 0;
}
.hg-footer-copy {
  font-size: 13px;
  color: rgba(232,232,230,0.35) !important;
  font-family: 'GeneralSans', sans-serif;
}
.hg-footer-links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 16px;
  line-height: 1.6;
}
.hg-footer-links a {
  font-size: 12px;
  color: rgba(232,232,230,0.4) !important;
  text-decoration: none !important;
  font-family: 'GeneralSans', sans-serif;
  font-weight: 500;
}
.hg-footer-links a:hover {
  color: #ffffff !important;
}