/* ==========================================================================
   Floo editorial article plugin layout 1.0.0
   Approved arrangement: 19 Aug 2026 reference
   ========================================================================== */

.floo-editorial-reading {
    --floo-editorial-paper: var(--floo-paper);
    --floo-editorial-ink: var(--floo-ink);
    --floo-editorial-accent: var(--floo-accent);
    --floo-editorial-stripe: var(--floo-coast);
    background: var(--floo-editorial-paper);
    color: var(--floo-editorial-ink);
}

.floo-editorial-reading .floo-reading-header {
    min-height: 88px;
    padding: 18px clamp(24px, 3vw, 44px) 0;
    align-items: flex-start;
}

.floo-editorial-reading .floo-logo {
    width: clamp(48px, 4.6vw, 66px);
    height: clamp(48px, 4.6vw, 66px);
}

.floo-reading-header__right {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    padding-top: 11px;
}

.floo-editorial-reading .floo-reading-nav {
    display: flex;
    align-items: center;
    gap: 27px;
    padding: 0;
    font-size: 0.9rem;
    letter-spacing: 0.01em;
}

.floo-editorial-reading .floo-reading-nav a {
    color: var(--floo-editorial-ink);
    text-decoration: none;
}

.floo-editorial-reading .floo-reading-nav a[aria-current="page"] {
    color: var(--floo-editorial-ink);
}

.floo-reading-menu {
    position: relative;
    display: none;
}

.floo-reading-menu summary {
    display: grid;
    gap: 5px;
    width: 28px;
    padding: 1px 0 6px;
    cursor: pointer;
    list-style: none;
}

.floo-reading-menu summary::-webkit-details-marker { display: none; }
.floo-reading-menu summary span {
    display: block;
    height: 1.5px;
    background: var(--floo-editorial-ink);
}

.floo-reading-menu > div {
    position: absolute;
    top: 34px;
    right: 0;
    z-index: 100;
    display: grid;
    min-width: 150px;
    padding: 15px 17px;
    border: 1px solid rgb(18 58 89 / 18%);
    background: var(--floo-editorial-paper);
    box-shadow: 0 14px 34px rgb(18 58 89 / 12%);
}

.floo-reading-menu > div a {
    padding: 6px 0;
    color: var(--floo-editorial-ink);
    text-decoration: none;
}

.floo-editorial-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(360px, 0.96fr) minmax(420px, 1.04fr);
    min-height: 485px;
    margin-top: -88px;
    padding: 105px clamp(40px, 8.6vw, 132px) 0;
    isolation: isolate;
}

.floo-editorial-hero__copy {
    position: relative;
    z-index: 4;
    align-self: center;
    padding: 14px 44px 44px 0;
}

.floo-editorial-kicker {
    margin: 0 0 13px;
    color: var(--floo-editorial-accent);
    font-size: clamp(0.9rem, 1.05vw, 1.03rem);
    letter-spacing: 0.055em;
}

.floo-editorial-reading .floo-editorial-hero h1 {
    max-width: 5.2em;
    margin: 0;
    color: var(--floo-editorial-ink);
    font-family: var(--floo-serif);
    font-size: clamp(4.35rem, 6.25vw, 6.55rem);
    font-weight: 400;
    letter-spacing: -0.035em;
    line-height: 0.93;
    text-wrap: balance;
}

.floo-editorial-subtitle {
    max-width: 31rem;
    margin: 22px 0 0;
    color: var(--floo-editorial-ink);
    font-family: var(--floo-serif);
    font-size: clamp(1.22rem, 1.55vw, 1.55rem);
    line-height: 1.32;
}

.floo-editorial-meta {
    display: flex;
    gap: 11px;
    margin: 24px 0 0;
    color: var(--floo-editorial-ink);
    font-size: 0.78rem;
    letter-spacing: 0.015em;
}

.floo-editorial-hero__media {
    position: relative;
    z-index: 2;
    align-self: stretch;
    margin: 0;
    min-height: 445px;
    overflow: hidden;
}

.floo-editorial-hero__media img,
.floo-editorial-hero__media figure,
.floo-editorial-hero__media .wp-block-image {
    width: 100%;
    height: 100%;
    margin: 0;
}

.floo-editorial-hero__media img {
    display: block;
    object-fit: cover;
    object-position: center;
}

.floo-editorial-hero__stripes {
    position: absolute;
    z-index: -1;
    right: 0;
    bottom: 0;
    left: 43%;
    height: 44%;
    background: repeating-linear-gradient(
        90deg,
        transparent 0 17px,
        var(--floo-editorial-stripe) 17px 32px,
        transparent 32px 49px
    );
    opacity: 0.92;
}

.floo-editorial-hero.no-image {
    grid-template-columns: 1fr;
    min-height: 420px;
}
.floo-editorial-hero.no-image .floo-editorial-hero__copy { max-width: 760px; }

.floo-editorial-body {
    display: grid;
    grid-template-columns: minmax(150px, 215px) minmax(440px, 560px) minmax(145px, 185px);
    column-gap: clamp(28px, 4.4vw, 62px);
    width: min(1110px, calc(100% - 64px));
    margin: 27px auto 40px;
    align-items: start;
}

.floo-editorial-postcard {
    grid-column: 1;
    margin-top: 58px;
    padding: 9px 9px 13px;
    transform: rotate(-3.5deg);
    background: var(--floo-paper);
    box-shadow: 0 11px 22px rgb(18 58 89 / 12%);
}

.floo-editorial-postcard img,
.floo-editorial-postcard figure,
.floo-editorial-postcard .wp-block-image {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
}

.floo-editorial-main {
    grid-column: 2;
    min-width: 0;
    color: var(--floo-editorial-ink);
    font-family: var(--floo-serif);
}

.floo-editorial-lead h2,
.floo-editorial-lead h3 {
    margin: 0 0 24px;
    color: var(--floo-editorial-ink);
    font-family: var(--floo-serif);
    font-size: clamp(1.7rem, 2.1vw, 2.16rem);
    font-weight: 400;
    letter-spacing: -0.018em;
    line-height: 1.08;
}

.floo-editorial-copy {
    color: var(--floo-editorial-ink);
    font-family: var(--floo-serif);
    font-size: clamp(1.02rem, 1.18vw, 1.17rem);
    line-height: 1.47;
}

.floo-editorial-copy > *:first-child { margin-top: 0; }
.floo-editorial-copy p { margin: 0 0 1.35em; }
.floo-editorial-copy h2,
.floo-editorial-copy h3 {
    margin: 1.8em 0 0.55em;
    color: var(--floo-editorial-ink);
    font-family: var(--floo-serif);
    font-weight: 400;
}
.floo-editorial-copy img { max-width: 100%; height: auto; }

.floo-editorial-quote {
    color: var(--floo-editorial-accent);
    font-family: var(--floo-serif);
    font-size: clamp(1.18rem, 1.45vw, 1.43rem);
    line-height: 1.38;
}

.floo-editorial-quote--desktop {
    grid-column: 3;
    margin-top: 98px;
    padding-left: 17px;
    border-left: 1.5px solid var(--floo-editorial-accent);
    transform: rotate(-1deg);
    transform-origin: left center;
}

.floo-editorial-quote--mobile { display: none; }

.floo-editorial-quote blockquote,
.floo-editorial-quote .wp-block-quote,
.floo-editorial-quote .wp-block-pullquote {
    width: auto;
    margin: 0;
    padding: 0;
    transform: none;
    border: 0;
    color: inherit;
    font-size: inherit;
    line-height: inherit;
    text-align: left;
}
.floo-editorial-quote p { margin: 0; }
.floo-editorial-quote cite { display: none; }

.floo-editorial-post-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: min(760px, calc(100% - 64px));
    margin: 10px auto 26px;
    font-size: 1.04rem;
}

.floo-editorial-post-nav > div:last-child { text-align: right; }
.floo-editorial-post-nav a {
    display: inline-block;
    padding-bottom: 3px;
    border-bottom: 1px solid var(--floo-editorial-ink);
    color: var(--floo-editorial-ink);
    text-decoration: none;
}

.floo-editorial-footer {
    width: min(620px, calc(100% - 64px));
    margin: 0 auto;
    padding-bottom: 13px;
    text-align: center;
}

.floo-editorial-footer__line {
    height: 1px;
    margin-bottom: 11px;
    background: rgb(18 58 89 / 34%);
}

.floo-editorial-footer p {
    display: flex;
    justify-content: center;
    gap: 13px;
    margin: 0;
    font-size: 0.72rem;
}
.floo-editorial-footer a { color: var(--floo-editorial-ink); text-decoration: none; }

/* The approved reference has no opening drop cap. */
.floo-editorial-reading .floo-article__content > p:first-child::first-letter,
.floo-editorial-reading .floo-editorial-copy > p:first-child::first-letter {
    float: none;
    margin: 0;
    color: inherit;
    font-size: inherit;
    line-height: inherit;
}

@media (max-width: 900px) {
    .floo-editorial-reading {
        width: 100%;
        box-shadow: none;
    }

    .floo-editorial-reading .floo-reading-header {
        min-height: 70px;
        padding: 13px 18px 0;
    }

    .floo-editorial-reading .floo-logo {
        width: 52px;
        height: 52px;
    }

    .floo-reading-header__right {
        gap: 15px;
        padding-top: 14px;
    }

    .floo-editorial-reading .floo-reading-nav {
        gap: 17px;
        font-size: 0.69rem;
    }

    .floo-reading-menu { display: block; }

    .floo-editorial-hero {
        display: block;
        min-height: 0;
        margin-top: -70px;
        padding: 86px 0 0;
    }

    .floo-editorial-hero__copy {
        padding: 3px 28px 18px;
    }

    .floo-editorial-kicker {
        margin-bottom: 8px;
        font-size: 0.78rem;
        letter-spacing: 0.06em;
    }

    .floo-editorial-reading .floo-editorial-hero h1 {
        max-width: 8.2em;
        font-size: clamp(3rem, 12.6vw, 4.6rem);
        line-height: 0.96;
    }

    .floo-editorial-subtitle {
        max-width: 22rem;
        margin-top: 12px;
        font-size: 1.08rem;
        line-height: 1.27;
    }

    .floo-editorial-meta {
        gap: 8px;
        margin-top: 12px;
        font-size: 0.66rem;
    }

    .floo-editorial-hero__media {
        width: calc(100% - 92px);
        min-height: 0;
        aspect-ratio: 1.43 / 1;
        margin: 0 92px 0 0;
        overflow: hidden;
    }

    .floo-editorial-hero__media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .floo-editorial-hero__stripes {
        right: 0;
        bottom: 0;
        left: auto;
        width: 92px;
        height: 45%;
        background: repeating-linear-gradient(
            90deg,
            transparent 0 10px,
            var(--floo-editorial-stripe) 10px 20px,
            transparent 20px 30px
        );
    }

    .floo-editorial-body {
        display: block;
        width: auto;
        margin: 20px 28px 28px;
    }

    .floo-editorial-postcard { display: none; }

    .floo-editorial-lead h2,
    .floo-editorial-lead h3 {
        margin-bottom: 14px;
        font-size: 1.52rem;
        line-height: 1.08;
    }

    .floo-editorial-copy {
        font-size: 0.98rem;
        line-height: 1.38;
    }

    .floo-editorial-copy p { margin-bottom: 1.18em; }

    .floo-editorial-quote--desktop { display: none; }
    .floo-editorial-quote--mobile {
        display: block;
        margin: 21px 7px 24px 20%;
        padding-left: 16px;
        border-left: 1.5px solid var(--floo-editorial-accent);
        transform: rotate(-1deg);
        transform-origin: left center;
        font-size: 1.1rem;
        line-height: 1.36;
    }

    .floo-editorial-post-nav {
        grid-template-columns: 1fr;
        gap: 12px;
        width: auto;
        margin: 20px 28px 26px;
        font-size: 0.94rem;
    }
    .floo-editorial-post-nav > div:last-child { text-align: left; }

    .floo-editorial-footer {
        width: auto;
        margin: 0 28px;
        padding-bottom: 11px;
    }

    .floo-editorial-footer p { font-size: 0.67rem; }
}

@media (max-width: 430px) {
    .floo-editorial-reading .floo-reading-nav { gap: 14px; }
    .floo-editorial-reading .floo-reading-nav a { white-space: nowrap; }
    .floo-editorial-reading .floo-editorial-hero h1 { font-size: clamp(2.8rem, 12.3vw, 3.7rem); }
    .floo-editorial-hero__copy { padding-right: 24px; padding-left: 24px; }
    .floo-editorial-body { margin-right: 24px; margin-left: 24px; }
    .floo-editorial-post-nav { margin-right: 24px; margin-left: 24px; }
    .floo-editorial-footer { margin-right: 24px; margin-left: 24px; }
}



/* Floo 2.0.5 compatibility: current small global footer remains in use. */
.floo-editorial-reading + .floo-footer{margin-top:0}

.floo-editorial-reading .floo-reading-header{
    position:relative;
    z-index:20;
    background:transparent;
}
.floo-editorial-reading .floo-reading-header .floo-text-button{
    color:var(--floo-editorial-ink);
    font-size:inherit;
}
.floo-editorial-reading .floo-reading-menu>div .floo-text-button{
    width:100%;
    padding:6px 0;
    text-align:left;
    border:0;
    background:none;
    color:var(--floo-editorial-ink);
    cursor:pointer;
}