/* ============================================================
   FREESTYLE: one gutter for the whole site
   The homepage runs to the window edge, so a subpage sitting in a 1280px box
   reads as a different site. Overriding .container here rather than editing
   the class strings on fourteen pages keeps the markup as it was.
   ============================================================ */
.container {
    max-width: none;
    padding-left: clamp(1.5rem, 5vw, 5rem);
    padding-right: clamp(1.5rem, 5vw, 5rem);
}

/* ------------------------------------------------------------
   Text comes into focus as it arrives. The class is added by the script, so
   without JavaScript nothing is ever blurred and the page reads normally.
   ------------------------------------------------------------ */
.fs-focus {
    filter: blur(9px);
    opacity: 0;
    transform: translateY(14px);
    transition: filter 820ms var(--ease-out), opacity 820ms var(--ease-out),
                transform 820ms var(--ease-out);
}

.fs-focus.is-focus {
    filter: blur(0);
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .fs-focus {
        filter: none;
        opacity: 1;
        transform: none;
        transition: none;
    }
}