
/* Typography (heading) */

  
  :root {
      /**
       * ---------------------------------------------------------------------
       * SPACING VARIABLES
       *
       * We are using a spacing inspired from frameworks like Tailwind CSS.
       * ---------------------------------------------------------------------
       */
      --spacing-0-5: 0.125rem; /* 2px */
      --spacing-1: 0.25rem; /* 4px */
      --spacing-1-5: 0.375rem; /* 6px */
      --spacing-2: 0.5rem; /* 8px */
      --spacing-2-5: 0.625rem; /* 10px */
      --spacing-3: 0.75rem; /* 12px */
      --spacing-3-5: 0.875rem; /* 14px */
      --spacing-4: 1rem; /* 16px */
      --spacing-4-5: 1.125rem; /* 18px */
      --spacing-5: 1.25rem; /* 20px */
      --spacing-5-5: 1.375rem; /* 22px */
      --spacing-6: 1.5rem; /* 24px */
      --spacing-6-5: 1.625rem; /* 26px */
      --spacing-7: 1.75rem; /* 28px */
      --spacing-7-5: 1.875rem; /* 30px */
      --spacing-8: 2rem; /* 32px */
      --spacing-8-5: 2.125rem; /* 34px */
      --spacing-9: 2.25rem; /* 36px */
      --spacing-9-5: 2.375rem; /* 38px */
      --spacing-10: 2.5rem; /* 40px */
      --spacing-11: 2.75rem; /* 44px */
      --spacing-12: 3rem; /* 48px */
      --spacing-14: 3.5rem; /* 56px */
      --spacing-16: 4rem; /* 64px */
      --spacing-18: 4.5rem; /* 72px */
      --spacing-20: 5rem; /* 80px */
      --spacing-24: 6rem; /* 96px */
      --spacing-28: 7rem; /* 112px */
      --spacing-32: 8rem; /* 128px */
      --spacing-36: 9rem; /* 144px */
      --spacing-40: 10rem; /* 160px */
      --spacing-44: 11rem; /* 176px */
      --spacing-48: 12rem; /* 192px */
      --spacing-52: 13rem; /* 208px */
      --spacing-56: 14rem; /* 224px */
      --spacing-60: 15rem; /* 240px */
      --spacing-64: 16rem; /* 256px */
      --spacing-72: 18rem; /* 288px */
      --spacing-80: 20rem; /* 320px */
      --spacing-96: 24rem; /* 384px */
  
      /* Container */
      --container-max-width: 1440px;
      --container-narrow-max-width: 1190px;
      --container-gutter: var(--spacing-5);
      --section-outer-spacing-block: var(--spacing-12);
      --section-inner-max-spacing-block: var(--spacing-10);
      --section-inner-spacing-inline: var(--container-gutter);
      --section-stack-spacing-block: var(--spacing-8);
  
      /* Grid gutter */
      --grid-gutter: var(--spacing-5);
  
      /* Product list settings */
      --product-list-row-gap: var(--spacing-8);
      --product-list-column-gap: var(--grid-gutter);
  
      /* Form settings */
      --input-gap: var(--spacing-2);
      --input-height: 2.625rem;
      --input-padding-inline: var(--spacing-4);
  
      /* Other sizes */
      --sticky-area-height: calc(var(--sticky-announcement-bar-enabled, 0) * var(--announcement-bar-height, 0px) + var(--sticky-header-enabled, 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: "Klint Pro", Barlow, sans-serif;
      --heading-font-weight: 900; /*700;*/
      --heading-font-style: normal;
      --heading-text-transform: uppercase;
      --heading-letter-spacing: -0.02em;
      --text-font-family: "Klint Pro", Barlow, sans-serif;
      --text-font-weight: 400;
      --text-font-style: normal;
      --text-letter-spacing: 0.0em;
  
      /* Font sizes */
      --text-h0: 2.75rem;
      --text-h1: 2rem;
      --text-h2: 1.75rem;
      --text-h3: 1.375rem;
      --text-h4: 1.125rem;
      --text-h5: 1.125rem;
      --text-h6: 1rem;
      --text-xs: 0.8125rem;
      --text-sm: 0.875rem;
      --text-base: 1.0rem;
      --text-lg: 1.25rem;
  
      /**
       * ---------------------------------------------------------------------
       * COLORS
       * ---------------------------------------------------------------------
       */
  
      /* Color settings */--accent: 0 55 165;
      --text-primary: 5 5 4;
      --background-primary: 255 255 255;
      --dialog-background: 255 255 255;
      --border-color: var(--text-color, var(--text-primary)) / 0.12;
  
      /* Button colors */
      --button-background-primary: 0 55 165;
      --button-text-primary: 255 255 255;
      --button-background-secondary: 255 255 255;
      --button-text-secondary: 26 26 26;
  
      /* Status colors */
      --success-background: 224 244 232;
      --success-text: 0 163 65;
      --warning-background: 255 246 233;
      --warning-text: 255 183 74;
      --error-background: 254 231 231;
      --error-text: 248 58 58;
  
      /* Product colors */
      --on-sale-text: 158 40 43;
      --on-sale-badge-background: 158 40 43;
      --on-sale-badge-text: 255 255 255;
      --sold-out-badge-background: 0 0 0;
      --sold-out-badge-text: 255 255 255;
      --primary-badge-background: 128 60 238;
      --primary-badge-text: 255 255 255;
      --star-color: 255 183 74;
      --product-card-background: 255 255 255;
      --product-card-text: 26 26 26;
  
      /* Header colors */
      --header-background: 255 255 255;
      --header-text: 0 0 0;
  
      /* Footer colors */
      --footer-background: 0 38 115;
      --footer-text: 255 255 255;
  
      /* Rounded variables (used for border radius) */
      --rounded-xs: 0.25rem;
      --rounded-sm: 0.375rem;
      --rounded: 0.75rem;
      --rounded-lg: 1.5rem;
      --rounded-full: 9999px;
  
      --rounded-button: 3.75rem;
      --rounded-input: 0.5rem;
  
      /* Box shadow */
      --shadow-sm: 0 2px 8px rgb(var(--text-primary) / 0.1);
      --shadow: 0 5px 15px rgb(var(--text-primary) / 0.1);
      --shadow-md: 0 5px 30px rgb(var(--text-primary) / 0.1);
      --shadow-block: 0px 18px 50px rgb(var(--text-primary) / 0.1);
  
      /**
       * ---------------------------------------------------------------------
       * OTHER
       * ---------------------------------------------------------------------
       */
  
      --stagger-products-reveal-opacity: 0;
      --cursor-close-svg-url: url(//feldschloesschen.ch/cdn/shop/t/27/assets/cursor-close.svg?v=147174565022153725511758190544);
      --cursor-zoom-in-svg-url: url(//feldschloesschen.ch/cdn/shop/t/27/assets/cursor-zoom-in.svg?v=154953035094101115921758190544);
      --cursor-zoom-out-svg-url: url(//feldschloesschen.ch/cdn/shop/t/27/assets/cursor-zoom-out.svg?v=16155520337305705181758190545);
      --checkmark-svg-url: url(//feldschloesschen.ch/cdn/shop/t/27/assets/checkmark.svg?v=77552481021870063511758190544);
      --castle-icon-svg-url: url(//feldschloesschen.ch/cdn/shop/t/27/assets/castle-icon.svg?v=179006892153686716761758190546);
    }
  
    [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-h0: 4rem;
        --text-h1: 3rem;
        --text-h2: 2.5rem;
        --text-h3: 2rem;
        --text-h4: 1.625rem;
        --text-h5: 1.25rem;
        --text-h6: 1.125rem;
  
        --text-xs: 0.75rem;
        --text-sm: 0.875rem;
        --text-base: 1.0rem;
        --text-lg: 1.25rem;
  
        /* Spacing */
        --container-gutter: 2rem;
        --section-outer-spacing-block: var(--spacing-16);
        --section-inner-max-spacing-block: var(--spacing-12);
        --section-inner-spacing-inline: var(--spacing-12);
        --section-stack-spacing-block: var(--spacing-12);
  
        /* Grid gutter */
        --grid-gutter: var(--spacing-6);
  
        /* Product list settings */
        --product-list-row-gap: var(--spacing-12);
  
        /* Form settings */
        --input-gap: 1rem;
        --input-height: 3.125rem;
        --input-padding-inline: var(--spacing-5);
      }
    }
  
    @media screen and (min-width: 1000px) {
      :root {
        /* Spacing settings */
        --container-gutter: var(--spacing-12);
        --section-outer-spacing-block: var(--spacing-18);
        --section-inner-max-spacing-block: var(--spacing-16);
        --section-inner-spacing-inline: var(--spacing-16);
        --section-stack-spacing-block: var(--spacing-12);
      }
    }
  
    @media screen and (min-width: 1150px) {
      :root {
        /* Spacing settings */
        --container-gutter: var(--spacing-12);
        --section-outer-spacing-block: var(--spacing-20);
        --section-inner-max-spacing-block: var(--spacing-16);
        --section-inner-spacing-inline: var(--spacing-16);
        --section-stack-spacing-block: var(--spacing-12);
      }
    }
  
    @media screen and (min-width: 1400px) {
      :root {
        /* Typography (font size) */
        --text-h0: 6rem;
        --text-h1: 4rem;
        --text-h2: 3.5rem;
        --text-h3: 2.25rem;
        --text-h4: 2rem;
        --text-h5: 1.5rem;
        --text-h6: 1.25rem;
  
        --section-outer-spacing-block: var(--spacing-24);
        --section-inner-max-spacing-block: var(--spacing-18);
        --section-inner-spacing-inline: var(--spacing-18);
      }
    }
  
    @media screen and (min-width: 1600px) {
      :root {
        --section-outer-spacing-block: var(--spacing-24);
        --section-inner-max-spacing-block: var(--spacing-20);
        --section-inner-spacing-inline: var(--spacing-20);
      }
    }
  
    /**
     * ---------------------------------------------------------------------
     * LIQUID DEPENDANT CSS
     *
     * Our main CSS is Liquid free, but some very specific features depend on
     * theme settings, so we have them here
     * ---------------------------------------------------------------------
     */@media screen and (pointer: fine) {
          .button:not([disabled]):hover, .btn:not([disabled]):hover, .shopify-payment-button__button--unbranded:not([disabled]):hover {
            --button-background-opacity: 0.85;
          }
  
          .button--subdued:not([disabled]):hover {
            --button-background: var(--text-color) / .05 !important;
          }
        }
      :root,
      .color-default {
        --color-background: 255,255,255;
        --gradient-background: #ffffff;
  
        --color-foreground: 0,0,0;
        --color-shadow: ,,;
        --color-button: 0,55,165;
        --color-button-text: 255,255,255;
        --color-secondary-button: 255,255,255;
        --color-secondary-button-text: 0,0,0;
        --color-link: 0,0,0;
        --color-badge-foreground: 0,0,0;
        --color-badge-background: 255,255,255;
        --color-badge-border: 0,0,0;
      
        --color-text-secondary: 0,0,0;
  
        /* impact compatibility (vars) */
        --button-background-primary: 0 55 165;
        --button-text-primary: 255 255 255;
      }
    
      
      .color-brand-blue {
        --color-background: 0,55,165;
        --gradient-background: #0037a5;
  
        --color-foreground: 255,255,255;
        --color-shadow: ,,;
        --color-button: 255,255,255;
        --color-button-text: 0,0,0;
        --color-secondary-button: 0,55,165;
        --color-secondary-button-text: 0,0,0;
        --color-link: 0,0,0;
        --color-badge-foreground: 255,255,255;
        --color-badge-background: 0,55,165;
        --color-badge-border: 255,255,255;
      
        --color-text-secondary: 234,219,170;
  
        /* impact compatibility (vars) */
        --button-background-primary: 255 255 255;
        --button-text-primary: 0 0 0;
      }
    
      
      .color-brand-red {
        --color-background: 158,40,43;
        --gradient-background: #9e282b;
  
        --color-foreground: 255,255,255;
        --color-shadow: ,,;
        --color-button: 255,255,255;
        --color-button-text: 0,0,0;
        --color-secondary-button: 158,40,43;
        --color-secondary-button-text: 0,0,0;
        --color-link: 0,0,0;
        --color-badge-foreground: 255,255,255;
        --color-badge-background: 158,40,43;
        --color-badge-border: 255,255,255;
      
        --color-text-secondary: 255,255,255;
  
        /* impact compatibility (vars) */
        --button-background-primary: 255 255 255;
        --button-text-primary: 0 0 0;
      }
    
      
      .color-scheme-c8e5120f-dac2-4007-8a4e-0976c624d0b2 {
        --color-background: 234,219,170;
        --gradient-background: #eadbaa;
  
        --color-foreground: 0,0,0;
        --color-shadow: ,,;
        --color-button: 255,255,255;
        --color-button-text: 0,0,0;
        --color-secondary-button: 234,219,170;
        --color-secondary-button-text: 0,0,0;
        --color-link: 0,0,0;
        --color-badge-foreground: 0,0,0;
        --color-badge-background: 234,219,170;
        --color-badge-border: 0,0,0;
      
        --color-text-secondary: 0,0,0;
  
        /* impact compatibility (vars) */
        --button-background-primary: 255 255 255;
        --button-text-primary: 0 0 0;
      }
    
      
      .color-scheme-ffc6a3bb-ec20-4947-a5a6-34c1c2416706 {
        --color-background: 98,184,233;
        --gradient-background: #62b8e9;
  
        --color-foreground: 0,38,115;
        --color-shadow: ,,;
        --color-button: 0,38,115;
        --color-button-text: 255,255,255;
        --color-secondary-button: 98,184,233;
        --color-secondary-button-text: 0,0,0;
        --color-link: 0,0,0;
        --color-badge-foreground: 0,38,115;
        --color-badge-background: 98,184,233;
        --color-badge-border: 0,38,115;
      
        --color-text-secondary: 0,0,0;
  
        /* impact compatibility (vars) */
        --button-background-primary: 0 38 115;
        --button-text-primary: 255 255 255;
      }
    
      
      .color-scheme-7462fe09-af24-420e-8cd2-faf121e0edd2 {
        --color-background: 0,38,115;
        --gradient-background: #002673;
  
        --color-foreground: 255,255,255;
        --color-shadow: ,,;
        --color-button: 255,255,255;
        --color-button-text: 255,255,255;
        --color-secondary-button: 0,38,115;
        --color-secondary-button-text: 0,0,0;
        --color-link: 0,0,0;
        --color-badge-foreground: 255,255,255;
        --color-badge-background: 0,38,115;
        --color-badge-border: 255,255,255;
      
        --color-text-secondary: 0,0,0;
  
        /* impact compatibility (vars) */
        --button-background-primary: 255 255 255;
        --button-text-primary: 255 255 255;
      }  