@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..700;1,9..144,300..700&display=swap');

/* =====================================================================
   FEC — Publications landing page (S3 / AP5) — scoped partial.
   Editorial "publications register": each document is a clearly-bounded
   cool-white entry, anchored by a large index number, a cyan doc-type
   label, a dominant Avenir title and a crafted circular download button.
   Loaded ONLY on page 3639. Scoped to body.fec-pub + the .fec-pub-
   prefix so it can never bleed onto the LOCKED header/footer/contact
   form. We do NOT load fec-custom.css / add body.fec-page.
   ===================================================================== */

:root {
    --fec-navy-900:   #283582;
    --fec-navy-ink:   #1c2660;
    --fec-cyan:       #3ca3dd;
    --fec-cyan-light: #5fb8e8;
    --fec-cyan-glow:  rgba(60,163,221,0.40);
    --fec-white:      #ffffff;
    --fec-cool-white: #eef2f8;
    --fec-cool-line:  #d7deeb;        /* visible hairline / panel edge */
    --fec-gray-300:   #c2c9d6;
    --fec-gray-400:   #9aa3b8;
    --fec-gray-700:   #4a5568;
    --fec-ink:        #2a2e3f;
    --fec-radius-md:  12px;
    --fec-radius-pill: 999px;
    --fec-ease: cubic-bezier(.4, 0, .2, 1);
    --fec-ease-out: cubic-bezier(.22, 1, .36, 1);
    --fec-dur:  220ms;
}

/* ---- vertical rhythm of the swapped main column ------------------- */
body.fec-pub .news-page { counter-reset: fecdoc; }
body.fec-pub .news-page .et_pb_row_inner.fec-pub-intro { padding-bottom: 6px; }
body.fec-pub .news-page .et_pb_row_inner.fec-pub-sec   { padding: clamp(30px, 4vw, 56px) 0 8px; scroll-margin-top: 110px; }

/* ---- intro block -------------------------------------------------- */
body.fec-pub .fec-pub-eyebrow {
    font: 600 14px/1 'Rubik', 'Helvetica Neue', sans-serif;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--fec-cyan-light);
    margin: 0 0 16px;
}
body.fec-pub .fec-pub-intro-text h2.fec-pub-h2 {
    font-family: 'Avenir-Black', 'Avenir Next', 'Helvetica Neue', Arial, sans-serif;
    font-weight: 400;
    color: var(--fec-navy-900);
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.1;
    letter-spacing: -0.005em;
    text-transform: none;
    margin: 0 0 20px;
}
body.fec-pub .fec-pub-intro-text h2.fec-pub-h2 em {
    font-family: 'Fraunces', Georgia, serif;
    font-style: italic;
    font-weight: 400;
    color: var(--fec-cyan);
}
body.fec-pub .fec-pub-lead {
    font: 400 17px/1.62 'Rubik', 'Helvetica Neue', sans-serif;
    color: var(--fec-gray-700);
    max-width: 64ch;
    margin: 0;
}

/* ---- topic index (editorial contents bar, NOT pills) -------------- */
body.fec-pub nav.fec-pub-nav {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(18px, 3vw, 38px);
    margin: 34px 0 2px;
    padding-top: 22px;
    border-top: 1px solid var(--fec-cool-line);
}
body.fec-pub .fec-pub-chip {
    font: 600 14px/1 'Rubik', 'Helvetica Neue', sans-serif;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--fec-navy-900);
    text-decoration: none;
    padding-bottom: 5px;
    border-bottom: 2px solid transparent;
    transition: color var(--fec-dur) var(--fec-ease),
                border-color var(--fec-dur) var(--fec-ease);
}
body.fec-pub .fec-pub-chip:hover {
    color: var(--fec-cyan);
    border-bottom-color: var(--fec-cyan);
}

/* ---- section header (eyebrow over title, no number) --------------- */
body.fec-pub .fec-pub-sec-head .et_pb_text_inner {
    display: flex;
    flex-direction: column;
    margin: 0 0 18px;
}
body.fec-pub .fec-pub-sec-sub {              /* eyebrow, lifted ABOVE the title */
    order: -1;
    font: 600 14px/1 'Rubik', 'Helvetica Neue', sans-serif;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--fec-cyan-light);
    margin: 0 0 10px;
}
body.fec-pub h3.fec-pub-sec-title {
    font-family: 'Avenir-Black', 'Avenir Next', 'Helvetica Neue', Arial, sans-serif;
    font-weight: 400;
    color: var(--fec-navy-900);
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.12;
    margin: 0;
}
body.fec-pub h3.fec-pub-sec-title .fec-pub-kicker { display: none; }   /* index lives on each entry now */

/* ---- the register: stacked, clearly-bounded entries -------------- */
body.fec-pub .fec-pub-grid {
    display: flex;
    flex-direction: column;
    gap: 14px;
    width: 100%;
}
body.fec-pub .fec-pub-grid > .et_pb_module { margin: 0 !important; float: none; }
body.fec-pub .fec-pub-grid > .fec-pub-sec-head { order: -1; }
body.fec-pub .fec-pub-card .et_pb_text_inner,
body.fec-pub .fec-pub-card .et_pb_text_inner > p { margin: 0; height: 100%; }

/* one entry — the whole panel is the link */
body.fec-pub .fec-pub-card-link {
    counter-increment: fecdoc;
    display: grid;
    grid-template-columns: clamp(2.6rem, 4vw, 3.4rem) minmax(0, 1fr) auto;
    grid-template-rows: auto auto auto;
    align-items: center;
    column-gap: clamp(16px, 2.4vw, 28px);
    height: 100%;
    padding: clamp(22px, 2.4vw, 28px) clamp(22px, 2.6vw, 32px);
    background: var(--fec-cool-white);
    border: 1px solid transparent;
    border-radius: var(--fec-radius-md);
    text-decoration: none;
    transition: background var(--fec-dur) var(--fec-ease),
                border-color var(--fec-dur) var(--fec-ease),
                box-shadow var(--fec-dur) var(--fec-ease),
                transform var(--fec-dur) var(--fec-ease-out);
}
body.fec-pub .fec-pub-card-link:hover {
    background: var(--fec-white);
    border-color: var(--fec-cool-line);
    box-shadow: 0 16px 34px -22px rgba(40,53,130,0.55);
    transform: translateY(-2px);
}

/* large index anchor (01..08) — left rail */
body.fec-pub .fec-pub-card-link::before {
    content: counter(fecdoc, decimal-leading-zero);
    grid-column: 1;
    grid-row: 1 / 4;
    align-self: center;
    font: 400 clamp(26px, 3.2vw, 34px)/1 'Avenir-Black', 'Avenir Next', Arial, sans-serif;
    color: var(--fec-gray-300);
    font-feature-settings: "tnum" 1;
    transition: color var(--fec-dur) var(--fec-ease);
}
body.fec-pub .fec-pub-card-link:hover::before { color: var(--fec-cyan); }

/* doc-type label — cyan kicker, clearly distinct from the gray meta */
body.fec-pub .fec-pub-tag {
    grid-column: 2;
    grid-row: 1;
    font: 600 12px/1 'Rubik', 'Helvetica Neue', sans-serif;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fec-cyan);
    margin: 0 0 9px;
}
/* title — the dominant element */
body.fec-pub .fec-pub-card-title {
    grid-column: 2;
    grid-row: 2;
    font-family: 'Avenir-Black', 'Avenir Next', 'Helvetica Neue', Arial, sans-serif;
    font-weight: 400;
    color: var(--fec-navy-900);
    font-size: clamp(18px, 1.8vw, 22px);
    line-height: 1.3;
    transition: color var(--fec-dur) var(--fec-ease);
}
body.fec-pub .fec-pub-card-link:hover .fec-pub-card-title { color: var(--fec-cyan); }
/* meta */
body.fec-pub .fec-pub-card-meta {
    grid-column: 2;
    grid-row: 3;
    font: 400 14px/1.5 'Rubik', 'Helvetica Neue', sans-serif;
    color: var(--fec-gray-700);
    margin-top: 8px;
}
/* download button — SVG arrow, absolutely centred (the "Download PDF" text
   node is kept for screen readers but must not become a 2nd grid/flex item,
   so the icon is positioned absolute, dead-centre, independent of it). */
body.fec-pub .fec-pub-card-dl {
    grid-column: 3;
    grid-row: 1 / 4;
    align-self: center;
    position: relative;
    width: 50px;
    height: 50px;
    border-radius: var(--fec-radius-pill);
    border: 1.5px solid var(--fec-cool-line);
    background: var(--fec-white);
    font-size: 0;                       /* hides the "Download PDF" words (kept for SR) */
    line-height: 0;
    transition: background var(--fec-dur) var(--fec-ease),
                border-color var(--fec-dur) var(--fec-ease);
}
body.fec-pub .fec-pub-card-dl::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    transform: translate(-50%, -50%);
    background-color: var(--fec-navy-900);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v10'/%3E%3Cpath d='M7 10l5 4 5-4'/%3E%3Cpath d='M5 20h14'/%3E%3C/svg%3E") center / 20px 20px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v10'/%3E%3Cpath d='M7 10l5 4 5-4'/%3E%3Cpath d='M5 20h14'/%3E%3C/svg%3E") center / 20px 20px no-repeat;
    transition: background-color var(--fec-dur) var(--fec-ease),
                transform var(--fec-dur) var(--fec-ease-out);
}
body.fec-pub .fec-pub-card-link:hover .fec-pub-card-dl {
    background: var(--fec-navy-900);
    border-color: var(--fec-navy-900);
}
body.fec-pub .fec-pub-card-link:hover .fec-pub-card-dl::after {
    background-color: var(--fec-white);
    transform: translate(-50%, -50%) translateY(3px);
}

/* ---- a little life: staggered rise on load ----------------------- */
@media (prefers-reduced-motion: no-preference) {
    body.fec-pub .fec-pub-card { opacity: 0; animation: fec-pub-rise .6s var(--fec-ease-out) forwards; }
    body.fec-pub .fec-pub-card:nth-child(2)  { animation-delay: .05s; }
    body.fec-pub .fec-pub-card:nth-child(3)  { animation-delay: .10s; }
    body.fec-pub .fec-pub-card:nth-child(4)  { animation-delay: .15s; }
    body.fec-pub .fec-pub-card:nth-child(5)  { animation-delay: .20s; }
    @keyframes fec-pub-rise {
        from { opacity: 0; transform: translateY(14px); }
        to   { opacity: 1; transform: translateY(0); }
    }
}

/* ---- responsive --------------------------------------------------- */
@media (max-width: 640px) {
    body.fec-pub .fec-pub-card-link {
        grid-template-columns: 1fr auto;
        column-gap: 16px;
        padding: 20px;
    }
    body.fec-pub .fec-pub-card-link::before {     /* index inline above the label on mobile */
        grid-column: 1; grid-row: 1; align-self: start;
        font-size: 22px; margin-bottom: 6px;
    }
    body.fec-pub .fec-pub-tag   { grid-column: 1; grid-row: 2; }
    body.fec-pub .fec-pub-card-title { grid-column: 1; grid-row: 3; }
    body.fec-pub .fec-pub-card-meta  { grid-column: 1; grid-row: 4; }
    body.fec-pub .fec-pub-card-dl { grid-column: 2; grid-row: 1 / 5; width: 44px; height: 44px; }
}

/* =========================================================================
   FEC-2026-06-15 PUB REFINE — Stefanie feedback (approved 16.06)
   (a) Two-paragraph intro — add spacing between the stacked lead paragraphs.
   (b) Remove the large per-card index numbers — they distract from the
       content; collapse the number rail and let the content reflow.
   ========================================================================= */
body.fec-pub .fec-pub-lead + .fec-pub-lead { margin-top: 1.1em; }

body.fec-pub .fec-pub-card-link { grid-template-columns: minmax(0, 1fr) auto; }
body.fec-pub .fec-pub-card-link::before { content: none; }
body.fec-pub .fec-pub-tag,
body.fec-pub .fec-pub-card-title,
body.fec-pub .fec-pub-card-meta { grid-column: 1; }
body.fec-pub .fec-pub-card-dl { grid-column: 2; }
@media (max-width: 640px) {
  body.fec-pub .fec-pub-card-link { grid-template-columns: 1fr auto; }
  body.fec-pub .fec-pub-tag        { grid-column: 1; grid-row: 1; }
  body.fec-pub .fec-pub-card-title { grid-column: 1; grid-row: 2; }
  body.fec-pub .fec-pub-card-meta  { grid-column: 1; grid-row: 3; }
  body.fec-pub .fec-pub-card-dl    { grid-column: 2; grid-row: 1 / 4; }
}