:root {
  --dlw-wrapper--gutter: 20px;
  --dlw-wrapper--width: 80rem;
  --dlw-wrapper--width-small: 50rem;
  --dlw-wrapper--simulate-width: calc(var(--dlw-wrapper--width) - (var(--dlw-wrapper--gutter) * 2));
  --dlw-wrapper--offset: calc((100% - var(--dlw-wrapper--simulate-width)) / 2);
  --offset-top: var(--dlw-header--height--primary);

  --dlw-transition--duration: 0.2s;

  /* Warm brown theme */
  --dlw-color--primary: #6c3d1c;
  --dlw-color--primary-light--20: #eae5da;
  --dlw-color--primary-dark--20: #381b05;
  --dlw-color--primary-dark--40: #2a1404;

  --dlw-color--secondary: #867c66;
  --dlw-color--secondary-light--20: #9a9280;
  --dlw-color--secondary-light--80: #eae5da;
  --dlw-color--secondary-dark--20: #6e6554;
  --dlw-color--secondary-dark--80: #381b05;

  --dlw-color--text: #000;
  --dlw-color--white: #fff;

  --dlw-color-bg: #eae5da;
  --dlw-color-bg-dark--5: #e0dbd0;
  --dlw-color-bg-dark--15: #d5cfc4;

  --dlw-color-bg--primary: var(--dlw-color--primary-dark--20);
  --dlw-color-bg--secondary: var(--dlw-color-bg);

  --dlw-color--border: #d5cfc4;
  --dlw-color--border-1: #c4bdb0;

  --dlw-color--grey-1: #f5f5f5;
  --dlw-color--grey-5: #8c8c8c;
  --dlw-color--disabled: #636363;

  --dlw-button--color: #fff;
  --dlw-heading--color: var(--dlw-color--primary);
  --dlw-link--color: var(--dlw-color--primary);
  --dlw-link--color--visited: var(--dlw-color--text);
  --dlw-link--color--active: var(--dlw-color--primary);

  --dlw-spacing: 20px;
  --dlw-spacing--tiny: 5px;
  --dlw-spacing--small: 10px;
  --dlw-spacing--large: 40px;
  --dlw-spacing--huge: 60px;
  --dlw-spacing--component: clamp(40px, 4cqi, 80px);
  --dlw-spacing-cqi: clamp(20px, 3cqi, 50px);
  --dlw-spacing-cqi--small: clamp(20px, 2cqi, 40px);

  --dlw-border-radius: 8px;
  --dlw-border-radius--small: 10px;
  --dlw-border-radius--large: 20px;

  --dlw-line-height: 1.5625;
  --dlw-font-family: 'DINPro Reg', 'Barlow', 'Montserrat', sans-serif;
  --dlw-font-family--primary: 'DINPro Light', 'Barlow', 'Montserrat', sans-serif;
  --dlw-font-family--secondary: 'DINPro Light', 'Barlow', 'Montserrat', sans-serif;
  --dlw-font-weight--heading: 300;
  --dlw-font-weight--body: 400;
  --dlw-font-weight--bold: 600;

  --dlw-letter-spacing--heading: 1px;
  --dlw-letter-spacing--nav: 3px;

  --dlw-font-size: 1rem;                                          /* 16px */
  --dlw-font-size--h1: clamp(2rem, 4vw + 1rem, 2.8125rem);        /* up to 45px */
  --dlw-font-size--h2: clamp(1.6rem, 2.4vw + 0.9rem, 2.1875rem);  /* up to 35px */
  --dlw-font-size--h3: clamp(1.35rem, 1.4vw + 0.9rem, 1.5rem);    /* up to 24px */
  --dlw-font-size--h4: clamp(1.15rem, 1.5vw + 1rem, 1.35rem);
  --dlw-font-size--h5: 1.25rem;
  --dlw-font-size--small: 0.875rem;

  /* Unified typography scale */
  --dlw-type--section: clamp(1.6rem, 2.4vw + 0.9rem, 2.1875rem);  /* 35px section headings */
  --dlw-type--usp-lead: clamp(0.95rem, 0.55vw + 0.6rem, 1.05rem);
  --dlw-type--section-weight: 300;
  --dlw-type--section-line: 1.2857;   /* 45 / 35 */
  --dlw-type--section-color: var(--dlw-color--primary);
  --dlw-type--section-gap: 1.5rem;

  --dlw-type--title: 1.5rem;          /* 24px card titles */
  --dlw-type--title-weight: 400;
  --dlw-type--title-line: 1.25;       /* 30 / 24 */
  --dlw-type--title-color: #000;

  --dlw-type--body: 1rem;             /* 16px */
  --dlw-type--body-weight: 400;
  --dlw-type--body-line: 1.5625;      /* 25 / 16 */
  --dlw-type--body-color: #000;

  --dlw-type--caption: 0.8125rem;
  --dlw-type--caption-line: 1.45;

  --dlw-a11y--outline-width: 2px;
  --dlw-a11y--outline-offset: 2px;
  --dlw-scroll-behavior: smooth;

  /* Header — site grid system */
  --dlw-mq--header: 60rem;
  --dlw-header--height: 60px;
  --dlw-header--background: #fff;
  --dlw-header--wrapped: max(0px, calc((100dvw - var(--dlw-wrapper--width)) / 2));
  --dlw-header--gta: ". bar cta .";
  --dlw-header--gtc: var(--dlw-header--wrapped) 1fr auto var(--dlw-header--wrapped);
  --dlw-header--gtr: var(--dlw-header--height--primary);
  --dlw-header--height--primary: 60px;
  --dlw-header--height--secondary: 32px;
  --dlw-header__logo--width: 120px;
  --dlw-header__secondary--background: var(--dlw-color--text);
  --dlw-header__bar--background: rgba(255, 255, 255, 0.55);
  --dlw-header__bar--border: rgba(255, 255, 255, 0.65);
  --dlw-header__bar--radius: 16px;
  --dlw-header__bar--width: min(calc(var(--dlw-wrapper--width) * 1.25), calc(100dvw - (var(--dlw-wrapper--gutter) * 2)));

  /* Footer */
  --dlw-footer-body--bg: transparent;
  --dlw-footer-body--color: var(--dlw-color--text);
  --dlw-footer-end--bg: #381b05;
  --dlw-footer-end--color: #fff;

  /* Theme blocks */
  --theme--bg: var(--dlw-color--primary-dark--20);
  --theme--color: #fff;
  --has-theme: 1;

  --dlw-page-intro--spacing: clamp(var(--dlw-spacing--large), 4cqi, var(--dlw-spacing--huge));
  --dlw-page-intro--background: var(--dlw-color-bg);
  --dlw-usp-item--color-bg: var(--dlw-color-bg);
}

@media (min-width: 70rem) and (max-width: 80rem) {
  :root { --dlw-wrapper--width: 65rem; }
}

@media (min-width: 40rem) and (max-width: 70rem) {
  :root {
    --dlw-wrapper--width: 100vw;
    --dlw-wrapper--gutter: 40px;
  }
}

@media (min-width: 60rem) {
  :root {
    --dlw-header--height--primary: 60px;
    --dlw-header--height--secondary: 0;
    --dlw-header--height: var(--dlw-header--height--primary);
    --dlw-header--gta: ". bar .";
    --dlw-header--gtc: var(--dlw-header--wrapped) 1fr var(--dlw-header--wrapped);
    --dlw-header--gtr: var(--dlw-header--height--primary);
    --dlw-header__logo--width: 150px;
  }
}

@media (max-width: 40rem) {
  :root {
    --dlw-wrapper--gutter: 25px;
    --dlw-wrapper--width: 100vw;
    --dlw-header__logo--width: 100px;
  }
}


[data-dlw-theme="primary"] {
  --theme--bg: var(--dlw-color--primary-dark--20);
  --theme--color: #fff;
  --dlw-heading--color: #fff;
}

[data-dlw-theme="secondary"] {
  --theme--bg: var(--dlw-color-bg);
  --theme--color: var(--dlw-color--text);
  --dlw-heading--color: var(--dlw-color--primary);
}
