/*
==============================================================================
Epoxy.com Technical Documentation Framework

File:
    /styles/resource-centers.css

Purpose:
    Shared presentation framework for Epoxy.com Product Resource Centers,
    Technical Documentation, Installation Instructions, Guide Specifications,
    Product Pages, Technical Bulletins, and future documentation hubs.

Design Philosophy:
    This stylesheet separates presentation from technical content.
    Future visual modernization should normally occur here rather than
    within individual product pages.

Used By:
    • Product Resource Centers
    • Product Pages
    • Technical Resources & Education Center
    • Installation Instructions
    • Guide Specifications
    • Technical Bulletins
    • Future documentation portals

Version:
    1.0

Initial Release:
    July 2026

Maintained By:
    Epoxy Systems, Inc.
    https://www.epoxy.com

Revision History
----------------
Version 1.0
    Initial shared framework created for the modernization of
    Product #633 and future Epoxy.com technical documentation.

==============================================================================
*/


/* ==========================================================
   Main Page Container
   ========================================================== */

.product-resource-center {
    margin: 0 auto;
    max-width: 1200px;
}


/* ==========================================================
   Intro Section
   ========================================================== */

.product-resource-center .resource-intro {
    margin-bottom: 2rem;
}


/* ==========================================================
   Card Layout
   ========================================================== */

.product-resource-center .resource-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 1.5rem;
    margin: 2rem 0;
}

.product-resource-center .resource-card {
    background: #ffffff;
    border: 1px solid #b9c8d8;
    border-radius: 10px;
    padding: 1.4rem;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
    transition: box-shadow .20s ease;
}

.product-resource-center .resource-card:hover {
    box-shadow: 0 5px 14px rgba(0,0,0,.12);
}

.product-resource-center .resource-card-wide {
    grid-column: 1 / -1;
}


/* ==========================================================
   Typography
   ========================================================== */

.product-resource-center h1 {
    margin-top: 0;
}

.product-resource-center h2 {
    margin-top: 0;
    margin-bottom: .8rem;
    padding-bottom: .35rem;
    border-bottom: 1px solid #d7e1eb;
}

.product-resource-center h3 {
    margin-top: 1.2rem;
    margin-bottom: .3rem;
}

.product-resource-center h3:first-child {
    margin-top: 0;
}

.product-resource-center p {
    margin-top: .35rem;
    margin-bottom: 1rem;
}

.product-resource-center ul {
    margin-top: .5rem;
    margin-bottom: 0;
    padding-left: 1.4rem;
}

.product-resource-center li {
    margin-bottom: .45rem;
}

.product-resource-center a {
    font-weight: 600;
    text-decoration: none;
}

.product-resource-center a:hover {
    text-decoration: underline;
}

.product-resource-center hr {
    margin: 2.5rem 0;
}


/* ==========================================================
   General Notes
   ========================================================== */

.product-resource-center .resource-note {
    background: #f5f8fb;
    border-left: 4px solid #1c5d99;
    padding: 1rem 1.2rem;
    margin: 1.5rem 0;
}


/* ==========================================================
   Technical Notes & Warnings
   ========================================================== */

.product-resource-center .technical-note,
.product-resource-center .technical-warning {

    background: #f8fafc;
    border-left: 4px solid #8b0000;
    padding: 1rem 1.2rem;
    margin: 1.5rem 0;

}


/* ==========================================================
   Technical Tables
   ========================================================== */

.product-resource-center .technical-data-table {

    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;

}

.product-resource-center .technical-data-table caption {

    text-align: left;
    font-weight: 600;
    margin-bottom: .6rem;

}

.product-resource-center .technical-data-table th,
.product-resource-center .technical-data-table td {

    padding: .45rem .6rem;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid #d7e1eb;

}

.product-resource-center .technical-data-table .property-name {

    font-weight: 700;
    white-space: nowrap;

}


/* ==========================================================
   Revision Footer
   ========================================================== */

.product-resource-center .page-revision {

    margin-top: 3rem;
    padding-top: 1rem;
    border-top: 1px solid #d7e1eb;

    font-size: .95rem;
    color: #555;

}


/* ==========================================================
   Resource Footer
   ========================================================== */

.product-resource-center .resource-footer {

    margin-top: 2.5rem;
    text-align: center;

}


/* ==========================================================
   Responsive Layout
   ========================================================== */

@media (max-width: 900px) {

    .product-resource-center .resource-grid {

        grid-template-columns: 1fr;

    }

    .product-resource-center .resource-card-wide {

        grid-column: auto;

    }

}
/* ==========================================================
   Article Index Pages
   ========================================================== */

.product-resource-center .resource-section {
    padding-top: 2.5rem;
}

.product-resource-center .section-heading {
    margin-bottom: 1.25rem;
}

.product-resource-center .section-heading h2 {
    margin-bottom: .35rem;
}

.product-resource-center .section-heading p {
    margin-bottom: 0;
}

.product-resource-center .article-grid {
    list-style: none;
    padding-left: 0;
}

.product-resource-center .article-date {
    margin: 0 0 .4rem;
    color: #7a1f1f;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.product-resource-center .article-card h3 {
    margin-top: 0;
}

.product-resource-center .jump-links {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    margin: 1.5rem 0 0;
    padding-left: 0;
    list-style: none;
}

.product-resource-center .jump-links a {
    display: inline-block;
    padding: .5rem .75rem;
    border: 1px solid #b9c8d8;
    border-radius: 4px;
    background: #ffffff;
    text-decoration: none;
}

.product-resource-center .jump-links a:hover,
.product-resource-center .jump-links a:focus {
    text-decoration: underline;
}