/* Resources register (front-end)
 * -------------------------------
 * Editorial register look. Curated, quiet, heraldically dressed.
 * All content comes from the [nscoesn_resources] renderer in inc/resources.php.
 * Colour uses only existing design tokens (Or, Argent, Sable, Vert, border).
 */

.nscoesn-resources{max-width:100%;margin:0 auto;--sec-accent:var(--color-or)}

/* Domain-tinted accent (matches security-domains page: Vert = technological, Gules = non-technological).
   Only the vertical accent bar and the section-head underline pick up the tint; text stays as-is. */
.nscoesn-resources .resource-section--itsec,
.nscoesn-resources .resource-section--comsec,
.nscoesn-resources .resource-section--emsec{--sec-accent:var(--color-vert)}
.nscoesn-resources .resource-section--persec,
.nscoesn-resources .resource-section--opsec,
.nscoesn-resources .resource-section--physec{--sec-accent:var(--color-gules)}
/* Foundations and Allied keep the Or default. */

/* Lede paragraph */
.nscoesn-resources .resource-lede{
    font-family:var(--font-display);
    font-size:19px;
    line-height:1.55;
    color:var(--color-argent);
    margin:0 0 34px;
    max-width:820px;
}

/* Guidance-vs-mandate note.
   Uses Argent for the left border (not Or), so it reads as editorial framing
   rather than a resource entry. Argent is an existing token, not a new colour. */
.nscoesn-resources .resource-note{
    position:relative;
    border:1px solid var(--color-border);
    border-left:3px solid var(--color-argent);
    border-radius:10px;
    background:var(--color-surface-glass);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    padding:22px 26px 20px;
    margin:0 0 56px;
}
.nscoesn-resources .resource-note__label{
    font-family:var(--font-mono);
    font-size:10.5px;
    letter-spacing:.24em;
    text-transform:uppercase;
    color:rgba(240,237,232,.55);
    margin:0 0 8px;
}
.nscoesn-resources .resource-note__body{
    margin:0;
    color:rgba(240,237,232,.82);
    font-size:15px;
    line-height:1.62;
}

/* Domain sections */
.nscoesn-resources .resource-section{margin:0 0 56px}
.nscoesn-resources .resource-section:last-child{margin-bottom:0}

.nscoesn-resources .resource-section__head{
    margin:0 0 24px;
    padding:0 0 10px;
    border-bottom:1px solid var(--sec-accent);
}
.nscoesn-resources .resource-section__title{
    font-family:var(--font-mono);
    font-size:13px;
    font-weight:500;
    letter-spacing:.28em;
    text-transform:uppercase;
    color:var(--color-or);
    margin:0 0 8px;
}
.nscoesn-resources .resource-section__desc{
    margin:0;
    color:rgba(240,237,232,.72);
    font-size:14.5px;
    line-height:1.6;
    max-width:820px;
}

/* Entries stack, single column. Reads as a register, not a marketing grid. */
.nscoesn-resources .resource-section__entries{
    display:flex;
    flex-direction:column;
    gap:0;
}

.nscoesn-resources .resource-entry{
    position:relative;
    padding:22px 4px 22px 22px;
    border-top:1px solid var(--color-border);
    transition:background-color .25s;
}
.nscoesn-resources .resource-entry:last-child{border-bottom:1px solid var(--color-border)}
.nscoesn-resources .resource-entry::before{
    content:"";
    position:absolute;
    left:0; top:22px; bottom:22px;
    width:2px;
    background:var(--sec-accent);
    opacity:.6;
    transition:opacity .25s;
}
.nscoesn-resources .resource-entry:hover{background:rgba(240,237,232,.025)}
.nscoesn-resources .resource-entry:hover::before{opacity:1}

.nscoesn-resources .resource-entry__eyebrow{
    font-family:var(--font-mono);
    font-size:10.5px;
    letter-spacing:.22em;
    text-transform:uppercase;
    color:var(--color-or);
    margin:0 0 8px;
}

.nscoesn-resources .resource-entry__title{
    font-family:var(--font-display);
    font-size:20px;
    font-weight:600;
    line-height:1.3;
    color:var(--color-argent);
    margin:0 0 10px;
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:12px;
}
.nscoesn-resources .resource-entry__id{
    font-family:var(--font-mono);
    font-size:12px;
    font-weight:500;
    letter-spacing:.14em;
    color:rgba(240,237,232,.6);
    text-transform:none;
    white-space:nowrap;
}

.nscoesn-resources .resource-entry__why{
    margin:0 0 12px;
    color:rgba(240,237,232,.82);
    font-size:15px;
    line-height:1.6;
    max-width:780px;
}

.nscoesn-resources .resource-entry__link{margin:0}
.nscoesn-resources .resource-entry__link .gglink{
    font-family:var(--font-mono);
    font-size:11.5px;
    letter-spacing:.14em;
    text-transform:uppercase;
    margin-top:0;
}

/* Mobile */
@media (max-width:640px){
    .nscoesn-resources .resource-lede{font-size:17px}
    .nscoesn-resources .resource-note{padding:18px 20px 16px;margin-bottom:44px}
    .nscoesn-resources .resource-section{margin-bottom:44px}
    .nscoesn-resources .resource-entry{padding:20px 2px 20px 18px}
    .nscoesn-resources .resource-entry__title{font-size:18px;gap:8px}
    .nscoesn-resources .resource-entry__id{font-size:11px}
    .nscoesn-resources .resource-entry__why{font-size:14.5px}
}

@media (prefers-reduced-motion:reduce){
    .nscoesn-resources .resource-entry,
    .nscoesn-resources .resource-entry::before{transition:none}
}
