:root {
    --brand: #F47C20;
    --brand-dark: #E0541C;
    --brand-rgb: 244, 124, 32;
    --paper: #fbf8f3;
    --ink: #1f1a17;
    --ink-soft: #6f655d;
    --rule: #e7ded2;
    --ok: #16a34a;
    --danger: #b91c1c;
    --warn: #f59e0b;
}

@font-face {
    font-family: "Playfair Display";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("fonts/playfair-display-latin-700-normal.woff2") format("woff2");
}
@font-face {
    font-family: "Playfair Display";
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/playfair-display-latin-400-italic.woff2") format("woff2");
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/poppins-latin-400-normal.woff2") format("woff2");
}
@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("fonts/poppins-latin-500-normal.woff2") format("woff2");
}
@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("fonts/poppins-latin-600-normal.woff2") format("woff2");
}
@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("fonts/poppins-latin-700-normal.woff2") format("woff2");
}

html, body {
    margin: 0;
    font-family: "Poppins", "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-tap-highlight-color: transparent;
}

a {
    color: var(--brand-dark);
}

.btn-primary {
    color: #fff;
    background-color: var(--brand);
    border-color: var(--brand-dark);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: var(--brand-dark);
    border-color: #C9481A;
}

h1:focus {
    outline: none;
}