/** Shopify CDN: Minification failed

Line 330:0 Unexpected "}"

**/

  .header {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  /* Reduce logo size on mobile — the mark is too large at its default width */
  .header__heading-logo,
  .header__heading-logo-wrapper {
    max-width: 60px !important;
    width: 60px !important;
  }

  /* Remove any gap below the logo text */
  .header__heading {
    margin: 0 !important;
    line-height: 1 !important;
  }

  /* Make header icons smaller and tighter */
  .header__icon {
    padding: 6px !important;
  }

  .header__icon svg {
    width: 18px !important;
    height: 18px !important;
  }

  /* Remove header border/shadow on mobile */
  .header-wrapper {
    border-bottom: none !important;
    box-shadow: none !important;
  }


/* =============================================================================
   2. MOBILE NAV DRAWER
   -----------------------------------------------------------------------------
   Toteme: clean white drawer, menu items are small regular text, no large
   heading scale, minimal padding.
   ============================================================================= */

  /* Drawer background — pure white */
  .menu-drawer {
    background-color: #ffffff !important;
  }

  /* Top padding inside drawer */
  .menu-drawer__navigation {
    padding: 2rem 0 !important;
  }

  /* Each menu item row */
  .menu-drawer__menu-item,
  .menu-drawer summary.menu-drawer__menu-item {
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: 0.05em !important;
    text-transform: lowercase !important;
    padding: 1rem 2rem !important;
    color: #000000 !important;
  }

  /* Sub-menu items */
  .menu-drawer__submenu .menu-drawer__menu-item {
    font-size: 12px !important;
    padding: 0.8rem 2rem 0.8rem 3rem !important;
    color: #000000 !important;
  }

  /* Close button */
  .menu-drawer__close-button {
    color: #000000 !important;
    padding: 1rem 2rem !important;
  }


/* =============================================================================
   3. MULTICOLUMN — full-width images, edge-to-edge
   -----------------------------------------------------------------------------
   On mobile, Toteme's 2-col sections stack to single column, each image
   filling the full screen width with caption below.

   Dawn's default mobile multicolumn has 1.5rem side padding which creates
   a floating centred look. We remove it so images go edge-to-edge.
   ============================================================================= */

  /* Remove side padding from the multicolumn container */
  .multicolumn .page-width {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
  }

  /* Remove list padding — images should hit screen edges */
  .multicolumn-list,
  .multicolumn-list:not(.slider) {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
  }

  /* Each column item fills full width */
  .multicolumn-list__item {
    width: 100% !important;
    padding: 0 !important;
  }

  /* Image wrapper fills column */
  .multicolumn-card__image-wrapper,
  .background-none .slider .multicolumn-card__image-wrapper {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }

  /* Caption below image — add left edge padding so text doesn't hit screen */
  .multicolumn-card__info,
  .background-none .slider .multicolumn-card__info,
  .background-none .slider .multicolumn-card__image-wrapper + .multicolumn-card__info {
    padding: 10px 16px 20px 16px !important;
    text-align: left !important;
  }

  /* Gap between stacked multicolumn items */
  .multicolumn-list {
    --grid-mobile-vertical-spacing: 2px !important;
    row-gap: 2px !important;
  }

  /* Slider variant (3-col becomes swipeable) — keep horizontal padding for
     the peek effect that shows the next card */
  .multicolumn.background-none .slider.slider--mobile {
    padding-left: 16px !important;
    padding-right: 0 !important;
  }


/* =============================================================================
   4. IMAGE BANNER — full-width, text overlay bottom-left
   ============================================================================= */

  /* Remove page-width constraint on mobile banner */
  .banner__content.page-width {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Text overlay stays small on mobile */
  .banner__heading {
    font-size: 12px !important;
    margin-bottom: 4px !important;
  }

  .banner__text {
    font-size: 11px !important;
  }

  .banner .button {
    font-size: 11px !important;
  }


/* =============================================================================
   5. RICH TEXT SECTION
   -----------------------------------------------------------------------------
   Your 1964 site shows "DESIGNED TO INSPIRE A LIFE WELL WORN" in large bold
   centred text. On Toteme this section doesn't exist but the treatment needs
   to be toned down significantly — same small weight as everything else.
   ============================================================================= */

  .rich-text__heading {
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase !important;
    line-height: 1.6 !important;
  }

  .rich-text__text,
  .rich-text__text p {
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.7 !important;
    color: #000000 !important;
  }

  /* The hashtag / bold callout line */
  .rich-text__text strong,
  .rich-text__text b {
    font-weight: 400 !important;
    font-size: 11px !important;
    letter-spacing: 0.1em !important;
  }

  /* Rich text section padding */
  .rich-text {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }

  /* Rich text CTA link */
  .rich-text__buttons .button {
    font-size: 11px !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
  }


/* =============================================================================
   6. SECTION SPACING
   -----------------------------------------------------------------------------
   Tighten the vertical gaps between homepage sections on mobile.
   Toteme's mobile scrolls with very tight rhythm — no large gaps.
   ============================================================================= */

  .shopify-section {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Multicolumn sections — reduce top/bottom padding */
  .multicolumn {
    padding-top: 24px !important;
    padding-bottom: 0 !important;
  }


/* =============================================================================
   7. FOOTER — accordion style on mobile
   -----------------------------------------------------------------------------
   Toteme mobile footer: logo top-left, then collapsed accordion sections
   (About, Legal, Contact, Follow us), mailing list CTA at bottom.

   Dawn's footer already renders as accordions on mobile via the details/summary
   elements. We style them to be minimal and Toteme-like.
   ============================================================================= */

  .footer {
    border-top: 1px solid #e8e8e8 !important;
    background-color: #ffffff !important;
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }

  /* Each footer block stacks with good spacing */
  .footer-block.grid__item {
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid #e8e8e8 !important;
  }

  /* Footer column heading */
  .footer-block__heading,
  .footer-block__heading.inline-richtext {
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #000000 !important;
    padding: 14px 0 !important;
    margin: 0 !important;
  }

  /* Footer links */
  .footer-block__details-content .list-menu__item--link,
  .footer-block a {
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #000000 !important;
    padding: 6px 0 !important;
    line-height: 1.8 !important;
    text-decoration: none !important;
  }

  /* Copyright bar */
  .footer__copyright,
  .copyright__content {
    font-size: 10px !important;
    color: #767676 !important;
    text-align: center !important;
    padding-top: 16px !important;
  }

  /* Hide Follow on Shop badge */
  .footer__follow-on-shop {
    display: none !important;
  }

  /* Mailing list / newsletter block */
  .footer-block--newsletter {
    border-bottom: none !important;
  }

  .footer-block--newsletter .newsletter-form__field-wrapper {
    max-width: 100% !important;
  }


/* =============================================================================
   8. GLOBAL TYPOGRAPHY — mobile pass
   ============================================================================= */

  /* Body text — keep consistent 12–13px across all elements */
  body,
  p, li, span, div {
    font-size: 12px !important;
    line-height: 1.6 !important;
  }

  /* All links */
  a {
    font-size: 12px !important;
  }

  /* Suppress any large heading sizes inherited from desktop */
  h1, h2, h3, h4, h5, h6,
  .h1, .h2, .h3, .h4 {
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: 0.02em !important;
  }

} /* end @media screen and (max-width: 749px) */