/**
 Settings
 **/
:root {
    --color-dune: #2B2726;
    --color-alto: #DDDDDD;
    --color-bay-leaf: #7DAD93;
    --color-deep-sea-green: #0A516D;

    --font-base: "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;

    --size-step--2: clamp(0.78rem, calc(0.77rem + 0.03vw), 0.80rem);
    --size-step--1: clamp(0.94rem, calc(0.92rem + 0.11vw), 1.00rem);
    --size-step-0: clamp(1.13rem, calc(1.08rem + 0.22vw), 1.25rem);
    --size-step-1: clamp(1.35rem, calc(1.28rem + 0.37vw), 1.56rem);
    --size-step-2: clamp(1.62rem, calc(1.50rem + 0.58vw), 1.95rem);
    --size-step-3: clamp(1.94rem, calc(1.77rem + 0.87vw), 2.44rem);
    --size-step-4: clamp(2.33rem, calc(2.08rem + 1.25vw), 3.05rem);
    --size-step-5: clamp(2.80rem, calc(2.45rem + 1.77vw), 3.82rem);

    --space-xs: clamp(0.75rem, 0.71rem + 0.22vw, 0.875rem);
    --space-s: clamp(1rem, 0.96rem + 0.22vw, 1.125rem);
    --space-m: clamp(1.5rem, 1.43rem + 0.33vw, 1.6875rem);
    --space-l: clamp(2rem, 1.91rem + 0.43vw, 2.25rem);
    --space-xl: clamp(3rem, 2.87rem + 0.65vw, 3.375rem);
    --space-s-m: clamp(1rem, 0.76rem + 1.20vw, 1.6875rem);

    --gutter: var(--space-s-m);
}
/**
 End Settings
 **/

/**
 Reset
 **/

/* Box sizing */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default margin */
blockquote,
body,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
p {
    margin:0
}

/* Remove list styles on ul, ol elements with a role attribute */
ol[role=list],
ul[role=list] {
    list-style:none
}

/* Inherit fonts for inputs and buttons */
button,
input,
select,
textarea {
    font:inherit
}

/**
 End Reset
 **/


/**
 Global Styles
 **/
html {
    text-size-adjust: none;
    -webkit-text-size-adjust:none;
}

body {
    background: var(--color-dune);
    color: var(--color-alto);

	display: flex;
	flex-direction: column;
    min-height: 100vh;

    font-family: var(--font-base);
    font-size: var(--size-step-0);
    font-weight: 400;
    line-height: 1.5;
}

h1 {
    font-size: var(--size-step-3);
}

h2 {
    font-size: var(--size-step-2);
}

h3 {
    font-size: var(--size-step-1);
}

:is(h1, h2, h3) {
    font-weight: 700;
    line-height: 1.2;
}

a {
    color: currentColor;
    text-decoration-color: var(--color-bay-leaf);
    text-decoration-thickness: 2px;
    text-underline-offset: .2ex;
}

[role=list] {
    margin-bottom: 0;
    padding:0
}
/**
 End Global Styles
 **/

/**
 Composition
 **/

.wrapper {
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
    position: relative;
    width: clamp(16rem, 93vw, 75rem);
}

.flow > * + * {
    margin-top: var(--flow-space, 1rem);
}

.cluster {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gutter);
}

.repel {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

/**
 End Composition
 **/

/**
 Utilities
 **/


/**
 End Utilities
 **/

/**
 Blocks
 **/

.site-header {
    padding-block: var(--space-m);
}

.site-header nav ul {
    margin: 0;
}

.brand {
    margin: 0;
}

/**
 End Blocks
 **/

/**
 Exceptions
 **/

/**
 End Exceptions
 **/
