@font-face {
    font-family: "PT Serif";
    font-weight: 400;
    font-style: normal;
    font-display: fallback;
    src: url("//tamo.design/cdn/fonts/pt_serif/ptserif_n4.fd0456bc6921cb59cbc84902bc88673986e44f6c.woff2?h1=dGFtby5kZXNpZ24&h2=dGFtby1mdXJuaXR1cmUuYWNjb3VudC5teXNob3BpZnkuY29t&hmac=d16a6d37c57145162232789ac46d3f8753bf54f977fdebadba9bd44255b83e1e") format("woff2"),
         url("//tamo.design/cdn/fonts/pt_serif/ptserif_n4.17e4b35390e29165ba0345f0fb7b617f96ab09d0.woff?h1=dGFtby5kZXNpZ24&h2=dGFtby1mdXJuaXR1cmUuYWNjb3VudC5teXNob3BpZnkuY29t&hmac=761f23969d035db701004a8fc7d487a0579dd38aa79b151e24e40e7e25aeef1b") format("woff");
  }
  
  @font-face {
    font-family: "PT Serif";
    font-weight: 400;
    font-style: italic;
    font-display: fallback;
    src: url("//tamo.design/cdn/fonts/pt_serif/ptserif_i4.3bb7f32772fab64b8f51575235b11d643662a081.woff2?h1=dGFtby5kZXNpZ24&h2=dGFtby1mdXJuaXR1cmUuYWNjb3VudC5teXNob3BpZnkuY29t&hmac=c4e267e5874d759bcf35c8cff4c83727862f9a32ab21f03405d399143bb07f63") format("woff2"),
         url("//tamo.design/cdn/fonts/pt_serif/ptserif_i4.6b54f8ca20055710cc6ed0c56ca4cf8d3bfa8042.woff?h1=dGFtby5kZXNpZ24&h2=dGFtby1mdXJuaXR1cmUuYWNjb3VudC5teXNob3BpZnkuY29t&hmac=d4dc1837a0f673852e96bf8c1f65142f1f64cfd932932ae9362d1ee93294fa68") format("woff");
  }
  
  /* Typography (body) */
    @font-face {
    font-family: "Work Sans";
    font-weight: 400;
    font-style: normal;
    font-display: fallback;
    src: url("//tamo.design/cdn/fonts/work_sans/worksans_n4.29e3afeb38a0ba35e784cf169a40e8beaf814daa.woff2?h1=dGFtby5kZXNpZ24&h2=dGFtby1mdXJuaXR1cmUuYWNjb3VudC5teXNob3BpZnkuY29t&hmac=ec3b20e7c87f8a81569d62b2007a1181e569ad70c69b479287a42d2284fd24a4") format("woff2"),
         url("//tamo.design/cdn/fonts/work_sans/worksans_n4.e7c533c4afbed28070f6ac45dbcfe6f37840c0a8.woff?h1=dGFtby5kZXNpZ24&h2=dGFtby1mdXJuaXR1cmUuYWNjb3VudC5teXNob3BpZnkuY29t&hmac=77371b9e43956c1859264863ef3224ecfc393172a715b658edead73e36f7edfa") format("woff");
  }
  
  @font-face {
    font-family: "Work Sans";
    font-weight: 700;
    font-style: normal;
    font-display: fallback;
    src: url("//tamo.design/cdn/fonts/work_sans/worksans_n7.35eac55373d3da50c529c81066eb2f2f0fbedb82.woff2?h1=dGFtby5kZXNpZ24&h2=dGFtby1mdXJuaXR1cmUuYWNjb3VudC5teXNob3BpZnkuY29t&hmac=1e99347d9d0b3b0ca4c99311e3a420f6e3f93af823b753e4d43485c8a5dbb003") format("woff2"),
         url("//tamo.design/cdn/fonts/work_sans/worksans_n7.1b010d40a44f517d5363112c4aff386332758bc9.woff?h1=dGFtby5kZXNpZ24&h2=dGFtby1mdXJuaXR1cmUuYWNjb3VudC5teXNob3BpZnkuY29t&hmac=b946741234c0da4c31ab98ac61b1702688b12a1662704c115c3f25e97f8847d5") format("woff");
  }
  
  :root {
      /* Container */
      --container-max-width: 100%;
      --container-xxs-max-width: 27.5rem; /* 440px */
      --container-xs-max-width: 42.5rem; /* 680px */
      --container-sm-max-width: 61.25rem; /* 980px */
      --container-md-max-width: 71.875rem; /* 1150px */
      --container-lg-max-width: 78.75rem; /* 1260px */
      --container-xl-max-width: 85rem; /* 1360px */
      --container-gutter: 1.25rem;
  
      --section-with-border-vertical-spacing: 4rem;
      --section-with-border-vertical-spacing-tight:2.5rem;
      --section-without-border-vertical-spacing:6rem;
      --section-without-border-vertical-spacing-tight:3.75rem;
  
      --section-stack-gap:4rem;
      --section-stack-gap-tight: 2.25rem;
  
      /* Form settings */
      --form-gap: 1.25rem; /* Gap between fieldset and submit button */
      --fieldset-gap: 1rem; /* Gap between each form input within a fieldset */
      --form-control-gap: 0.625rem; /* Gap between input and label (ignored for floating label) */
      --checkbox-control-gap: 0.75rem; /* Horizontal gap between checkbox and its associated label */
      --input-padding-block: 0.65rem; /* Vertical padding for input, textarea and native select */
      --input-padding-inline: 0.8rem; /* Horizontal padding for input, textarea and native select */
      --checkbox-size: 0.875rem; /* Size (width and height) for checkbox */
  
      /* Other sizes */
      --sticky-area-height: calc(var(--announcement-bar-is-sticky, 0) * var(--announcement-bar-height, 0px) + var(--header-is-sticky, 0) * var(--header-height, 0px));
  
      /* RTL support */
      --transform-logical-flip: 1;
      --transform-origin-start: left;
      --transform-origin-end: right;
  
      /**
       * ---------------------------------------------------------------------
       * TYPOGRAPHY
       * ---------------------------------------------------------------------
       */
  
      /* Font properties */
      --heading-font-family: "PT Serif", serif;
      --heading-font-weight: 400;
      --heading-font-style: normal;
      --heading-text-transform: normal;
      --heading-letter-spacing: 0.03em;
      --text-font-family: "Work Sans", sans-serif;
      --text-font-weight: 400;
      --text-font-style: normal;
      --text-letter-spacing: 0.0em;
      --button-text-transform: uppercase;
      --button-letter-spacing: 0.2em;
  
      /* Font sizes */--text-heading-size-factor: 1;
      --text-h1: max(0.6875rem, clamp(1.375rem, 1.146341463414634rem + 0.975609756097561vw, 2rem) * var(--text-heading-size-factor));
      --text-h2: max(0.6875rem, clamp(1.25rem, 1.0670731707317074rem + 0.7804878048780488vw, 1.75rem) * var(--text-heading-size-factor));
      --text-h3: max(0.6875rem, clamp(1.125rem, 1.0335365853658536rem + 0.3902439024390244vw, 1.375rem) * var(--text-heading-size-factor));
      --text-h4: max(0.6875rem, clamp(1rem, 0.9542682926829268rem + 0.1951219512195122vw, 1.125rem) * var(--text-heading-size-factor));
      --text-h5: calc(0.875rem * var(--text-heading-size-factor));
      --text-h6: calc(0.75rem * var(--text-heading-size-factor));
  
      --text-xs: 0.6875rem;
      --text-sm: 0.75rem;
      --text-base: 0.8125rem;
      --text-lg: 0.9375rem;
      --text-xl: 1.0625rem;
  
      /**
       * ---------------------------------------------------------------------
       * COLORS
       * ---------------------------------------------------------------------
       */
  
      /* Color settings */--accent: 28 28 28;
      --text-primary: 28 28 28;
      --background-primary: 225 225 225;
      --background-secondary: 255 255 255;
      --border-color: 195 195 195;
      --page-overlay: 0 0 0 / 0.4;
  
      /* Button colors */
      --button-background-primary: 28 28 28;
      --button-text-primary: 255 255 255;
  
      /* Status colors */
      --success-background: 212 227 203;
      --success-text: 48 122 7;
      --warning-background: 253 241 224;
      --warning-text: 237 138 0;
      --error-background: 243 204 204;
      --error-text: 203 43 43;
  
      /* Product colors */
      --on-sale-text: 227 44 43;
      --on-sale-badge-background: 227 44 43;
      --on-sale-badge-text: 255 255 255;
      --sold-out-badge-background: 239 239 239;
      --sold-out-badge-text: 0 0 0 / 0.65;
      --custom-badge-background: 28 28 28;
      --custom-badge-text: 255 255 255;
      --star-color: 28 28 28;
  
      /* Header colors */--header-background: 255 255 255;
      --header-text: 28 28 28;
      --header-border-color: 221 221 221;
  
      /* Footer colors */--footer-background: 28 28 28;
      --footer-text: 255 255 255;
      --footer-border-color: 62 62 62;
  
      /* Modal colors */--modal-background: 255 255 255;
      --modal-text: 28 28 28;
      --modal-border-color: 221 221 221;
  
      /* Drawer colors (reuse the same as modal) */
      --drawer-background: 255 255 255;
      --drawer-text: 28 28 28;
      --drawer-border-color: 221 221 221;
  
      /* Popover background (uses the primary background) */
      --popover-background: 255 255 255;
      --popover-text: 28 28 28;
      --popover-border-color: 195 195 195;
  
      /* Rounded variables (used for border radius) */
      --rounded-full: 9999px;
      --button-border-radius: 0.0rem;
      --input-border-radius: 0.0rem;
  
      /* Box shadow */
      --shadow-sm: 0 2px 8px rgb(0 0 0 / 0.05);
      --shadow: 0 5px 15px rgb(0 0 0 / 0.05);
      --shadow-md: 0 5px 30px rgb(0 0 0 / 0.05);
      --shadow-block: px px px rgb(var(--text-primary) / 0.0);
  
      /**
       * ---------------------------------------------------------------------
       * OTHER
       * ---------------------------------------------------------------------
       */
  
      --checkmark-svg-url: url(//tamo.design/cdn/shop/t/15/assets/checkmark.svg?v=77552481021870063511681411234);
      --cursor-zoom-in-svg-url: url(//tamo.design/cdn/shop/t/15/assets/cursor-zoom-in.svg?v=112480252220988712521681411234);
    }
  
    [dir="rtl"]:root {
      /* RTL support */
      --transform-logical-flip: -1;
      --transform-origin-start: right;
      --transform-origin-end: left;
    }
  
    @media screen and (min-width: 700px) {
      :root {
        /* Typography (font size) */
        --text-xs: 0.6875rem;
        --text-sm: 0.75rem;
        --text-base: 0.8125rem;
        --text-lg: 0.9375rem;
        --text-xl: 1.1875rem;
  
        /* Spacing settings */
        --container-gutter: 2rem;
      }
    }
  
    @media screen and (min-width: 1000px) {
      :root {
        /* Spacing settings */
        --container-gutter: 3rem;
  
        --section-with-border-vertical-spacing: 7rem;
        --section-with-border-vertical-spacing-tight: 4rem;
        --section-without-border-vertical-spacing: 10.5rem;
        --section-without-border-vertical-spacing-tight: 6rem;
  
        --section-stack-gap:4rem;
        --section-stack-gap-tight:4rem;
      }
    }