@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap");

@font-face {
    font-display: swap;
    font-family: "Sligoil Micro";
    font-style: normal;
    font-weight: 400;
    src: url("https://cdn.investigativedata.org/fonts/sligoil/web/Sligoil-Micro.woff2") format("woff2"),
         url("https://cdn.investigativedata.org/fonts/sligoil/web/Sligoil-Micro.woff") format("woff");
}

:root,
[data-md-color-scheme="slate"] {
    --orange: #ff5f33;
    --blue: #c3e5e5;
    --neutral: #fff8f1;
    --black: #1a1a1a;

    --font-family-sans: "Inter", "Liberation Sans", "Arial", sans-serif;
    --font-family-mono: "Sligoil Micro", monospace;

    --md-text-font: var(--font-family-sans);
    --md-code-font: var(--font-family-mono);
    --md-default-fg-color: var(--neutral);
    --md-accent-fg-color: var(--orange);
    --md-typeset-a-color: var(--orange);
}

.md-footer {
    border-top: none;
}

.md-footer-meta {
    background-color: #000;
}

.md-footer-meta,
.md-footer-meta *,
html .md-footer-meta.md-typeset,
html .md-footer-meta.md-typeset a:not(:focus,:hover),
.md-copyright,
.md-copyright__highlight {
    color: #444 !important;
}

html .md-footer-meta.md-typeset a:focus,
html .md-footer-meta.md-typeset a:hover {
    color: #888 !important;
}

.md-social__link svg {
    fill: #444;
}

.md-social__link:hover svg {
    fill: #888;
}

.md-content {
    padding-top: 1.5rem;
    padding-bottom: 2rem;
}

code, pre {
    font-family: var(--font-family-mono);
}

.md-header__title,
.md-typeset h1 {
    font-family: var(--font-family-mono);
    font-weight: 400;
}

.md-header--shadow {
    box-shadow: none;
    transition: none;
}

.md-nav__link {
    text-decoration: none;
}

/* Hero landing page */

.putfs-hero {
    padding: 6rem 0 5rem;
    min-height: 100vh;
    display: flex;
    align-items: center;
}

.putfs-hero ~ .md-main {
    display: none;
}

.putfs-hero__inner {
    max-width: 48rem;
}

.putfs-hero__slogan {
    font-family: var(--font-family-mono);
    font-size: 2.8rem;
    font-weight: 400;
    line-height: 1.1;
    margin: 0 0 0.5rem;
    color: var(--orange);
}

.putfs-hero__subhead {
    font-family: var(--font-family-mono);
    font-size: 1.2rem;
    font-weight: 400;
    margin: 0 0 1.5rem;
    opacity: 0.7;
}

.putfs-hero__description {
    font-size: 1.05rem;
    line-height: 1.7;
    margin: 0 0 2rem;
    max-width: 40rem;
    opacity: 0.85;
}

.putfs-hero__actions {
    display: flex;
    gap: 1.25rem;
}

.putfs-hero__actions .md-button svg {
    width: 1em;
    height: 1em;
    vertical-align: -0.1em;
    fill: currentColor;
    margin-right: 0.3em;
}

.putfs-hero__actions .md-button {
    text-decoration: none;
    font-size: 0.85rem;
    padding: 0.55rem 1.4rem;
    border-radius: 100px;
    border: 2px solid rgba(255, 255, 255, 0.25);
    color: rgba(255, 255, 255, 0.85);
    background: transparent;
    transition: all 0.2s ease;
}

.putfs-hero__actions .md-button:hover {
    border-color: rgba(255, 255, 255, 0.5);
    color: #fff;
}

.putfs-hero__actions .md-button--primary {
    background-color: var(--orange);
    border-color: var(--orange);
    color: #fff;
}

.putfs-hero__actions .md-button--primary:hover {
    background-color: #e8502a;
    border-color: #e8502a;
}

/* Mobile */
@media screen and (max-width: 768px) {
    .putfs-hero {
        padding: 3rem 1rem 2rem;
        min-height: auto;
    }

    .putfs-hero__inner {
        padding: 0;
    }

    .putfs-hero__slogan {
        font-size: 2rem;
    }

    .putfs-hero__subhead {
        font-size: 1rem;
        margin-bottom: 1rem;
    }

    .putfs-hero__description {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 1.5rem;
    }

    .putfs-hero__actions {
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .putfs-hero__actions .md-button {
        flex: 1 1 auto;
        text-align: center;
        font-size: 0.8rem;
        padding: 0.5rem 1rem;
    }
}