/* =========================================
   1. VARIABLES & RESET
   ========================================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --primary-blue: #003366;  /* Deep Industrial Blue */
    --accent-red: #cc0000;    /* Alert/Action Red */
    --gold: #ffcc00;          /* ISO Certification Gold */
    --dark-grey: #333333;
    --medium-grey: #666666;
    --light-grey: #f4f4f4;
    --white: #ffffff;
}

body {
    font-family: 'Roboto', sans-serif;
    line-height: 1.6;
    color: var(--dark-grey);
    background-color: var(--light-grey);
}

a { text-decoration: none; color: inherit; transition: 0.3s; }
ul { list-style: none; }
img { max-width: 100%; display: block; }

/* Utility Class: Centers content with a max-width */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* =========================================
   2. TOP BAR & HEADER
   ========================================= */
.top-bar {
    background-color: var(--primary-blue);
    color: var(--white);
    padding: 10px 0;
    font-size: 0.9rem;
}

.top-bar .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.top-bar a { color: var(--white); margin-right: 15px; }
.top-bar a:hover { color: var(--gold); }
.top-bar .divider { margin-right: 15px; opacity: 0.5; }
.certifications span { margin-left: 15px; font-weight: bold; color: var(--gold); }

/* Main Header */
header {
    background: var(--white);
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    padding: 15px 0;
    position: sticky;
    top: 0;
    z-index: 1000;
}

.header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo h1, .logo .brand-name {
    font-family: 'Oswald', sans-serif;
    font-size: 2.2rem;
    color: var(--primary-blue);
    margin-bottom: -5px;
    line-height: 1;
}

.logo p { font-size: 0.8rem; letter-spacing: 1px; color: var(--medium-grey); }
.logo .tm { font-size: 1rem; vertical-align: top; }

/* Navigation Links */
.nav-links { display: flex; align-items: center; }
.nav-links li { margin-left: 30px; }
.nav-links a { font-weight: 500; position: relative; }
.nav-links a:hover, .nav-links a.active { color: var(--primary-blue); }

/* "Contact" Button in Menu */
.btn-contact {
    background-color: var(--accent-red);
    color: white !important;
    padding: 10px 25px;
    border-radius: 4px;
}
.btn-contact:hover { background-color: #a30000; }

/* Hamburger Menu (Hidden on Desktop) */
.hamburger { display: none; cursor: pointer; }
.hamburger span {
    display: block;
    width: 25px; height: 3px; background-color: var(--primary-blue);
    margin: 5px; transition: all 0.3s ease;
}

/* =========================================
   3. HERO SECTIONS
   ========================================= */
/* Homepage Hero (Large) */
.hero {
    /* Replace URL with your factory image */
    background: url('https://www.plus-co.com/img/PLUSCO_Factory.jpg') no-repeat center center/cover;
    height: 600px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--white);
}

/* Sub-page Hero (Smaller - used on About & Products pages) */
.page-hero {
    background: url('https://images.unsplash.com/photo-1504917595217-d4dc5ebe6122?ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80') no-repeat center center/cover;
    height: 300px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--white);
}

.hero-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 51, 102, 0.75); /* Blue overlay */
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    padding: 20px;
}

.hero-content h1 {
    font-family: 'Oswald', sans-serif;
    font-size: 3.5rem;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.hero-content p { font-size: 1.2rem; margin-bottom: 30px; }

/* Global Buttons */
.btn {
    display: inline-block;
    padding: 12px 30px;
    border-radius: 4px;
    font-weight: bold;
    text-transform: uppercase;
    margin: 5px 10px;
}
.btn-primary { background-color: var(--accent-red); color: white; }
.btn-primary:hover { background-color: #a30000; }

/* UPDATED: Solid white button with permanent lift/shadow */
.btn-secondary {
    background: #ffffff;
    color: var(--primary-blue);
    border: none;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
}
.btn-secondary:hover {
    background: #f0f0f0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15);
    transform: translateY(-1px);
}

/* =========================================
   4. HOME PAGE SECTIONS
   ========================================= */
/* Trust Bar */
.trust-bar {
    background-color: #e0e0e0;
    padding: 15px 0;
    text-align: center;
    border-bottom: 1px solid #ccc;
}
.trust-item {
    display: inline-block;
    margin: 0 20px;
    font-weight: bold;
    color: #555;
    text-transform: uppercase;
    font-size: 0.9rem;
}

/* Features (3 Icons) */
.features { padding: 60px 0; background-color: var(--white); text-align: center; }
.features .container { display: flex; justify-content: space-around; flex-wrap: wrap; }
.feature-box { flex: 1; min-width: 280px; padding: 20px; margin: 10px; }
.feature-icon { font-size: 3rem; color: var(--primary-blue); margin-bottom: 20px; }
.feature-box h3 { font-family: 'Oswald', sans-serif; font-size: 1.5rem; margin-bottom: 10px; }

/* Video Section */
.video-section { padding: 80px 0; background-color: #002244; color: white; text-align: center; }
.section-title h2 { font-family: 'Oswald', sans-serif; font-size: 2.5rem; text-transform: uppercase; }
.section-title p { margin-top: 15px; opacity: 0.8; }
.white-text { color: white; }
.white-line { background-color: white !important; }

.video-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
    height: 0;
    max-width: 900px;
    margin: 40px auto 0;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}
.video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.external-embed { padding: 20px; background: #f3f6f9; color: #183348; border-radius: 8px; }
.external-embed p { margin-bottom: 16px; line-height: 1.6; }
.external-embed > a { display: inline-block; margin: 12px; text-decoration: underline; }
.external-embed button[hidden] { display: none; }
.external-embed-frame:empty { display: none; }
.external-embed iframe { display: block; width: 100%; border: 0; margin-top: 16px; }
.external-embed-video iframe { aspect-ratio: 16 / 9; }
.external-embed-map iframe { height: 300px; }
.privacy-page { max-width: 850px; padding-top: 48px; padding-bottom: 48px; }
.privacy-page h2 { margin-top: 28px; margin-bottom: 12px; }
.privacy-page p { margin-bottom: 16px; line-height: 1.7; }
.privacy-page a { text-decoration: underline; }
.company-intro-link { display: block; width: fit-content; margin-top: 16px; padding: 8px 0; color: var(--primary-blue); font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.company-intro-link:focus-visible { outline: 2px solid var(--primary-blue); outline-offset: 4px; }
.prod-info-col .product-copy-list { list-style: disc; padding-left: 1.4rem; margin: 12px 0 24px; }
.prod-info-col .product-copy-list li { margin-bottom: 10px; line-height: 1.65; }
/* Align 400's description bullets with the neighboring wireline products. */
.product-row#plusco-400 .prod-info-col > .product-copy-list { padding-left: 0; margin-left: 0; }

/* Product Grid (Used on Home & Product Pages) */
.products-section { padding: 80px 0; }
.section-title { text-align: center; margin-bottom: 50px; }
.underline { width: 80px; height: 4px; background-color: var(--accent-red); margin: 10px auto 0; }

.product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
}
.product-card {
    background: var(--white);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    transition: transform 0.3s ease;
}
.product-card:hover { transform: translateY(-10px); }
.card-image img { width: 100%; height: 220px; object-fit: cover; }
.card-content { padding: 25px; text-align: center; }
.card-content h3 { color: var(--primary-blue); margin-bottom: 10px; }
.card-content p { font-size: 0.9rem; color: var(--medium-grey); margin-bottom: 20px; }

.btn-card {
    display: inline-block; padding: 8px 20px;
    border: 1px solid var(--primary-blue); color: var(--primary-blue);
    border-radius: 4px; font-weight: bold; transition: all 0.3s;
}
.btn-card:hover { background-color: var(--primary-blue); color: white; }
.catalog-btn-container { text-align: center; margin-top: 50px; }

/* =========================================
   5. PRODUCT DETAIL PAGE LAYOUT FIX
   ========================================= */
.product-row {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 30px;
    margin-bottom: 50px;
    padding-bottom: 50px;
    border-bottom: 1px solid #eee;
    background: var(--white);
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.product-row:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

.prod-img-col {
    display: flex;
    flex-direction: column;
}

.prod-img-col img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    border: 1px solid #eee;
}

/* Keep the tall product photos proportional to neighboring product images. */
#plusco-801 .prod-img-col img,
#plusco-854 .prod-img-col img,
#plusco-2015 .prod-img-col img,
#plusco-412 .prod-img-col img,
#plusco-4005 .prod-img-col img,
#plusco-511-ag .prod-img-col img,
#plusco-585 .prod-img-col img,
#plusco-741 .prod-img-col img,
#plusco-752 .prod-img-col img,
#plusco-851 .prod-img-col img,
#plusco-813 .prod-img-col img,
#plusco-831 .prod-img-col img,
#plusco-811 .prod-img-col img,
#plusco-740 .prod-img-col img,
#plusco-515 .prod-img-col img,
#plusco-508 .prod-img-col img,
#plusco-506 .prod-img-col img,
#plusco-472x .prod-img-col img,
#plusco-471x .prod-img-col img,
#plusco-470 .prod-img-col img,
#plusco-440 .prod-img-col img,
#plusco-404 .prod-img-col img,
#plusco-326 .prod-img-col img,
#plusco-202 .prod-img-col img,
#plusco-116 .prod-img-col img,
#plusco-855p .prod-img-col img,
#plusco-863 .prod-img-col img,
#plusco-864 .prod-img-col img,
#plusco-867 .prod-img-col img,
#plusco-871 .prod-img-col img,
#plusco-872 .prod-img-col img,
#plusco-853 .prod-img-col img,
#plusco-853m .prod-img-col img,
#plusco-912 .prod-img-col img,
#plusco-920 .prod-img-col img,
#plusco-930 .prod-img-col img,
#plusco-950 .prod-img-col img {
    width: auto;
    max-width: 100%;
    max-height: 300px;
    object-fit: contain;
    align-self: center;
}

.prod-info-col {
    padding: 0 15px;
}

.product-row h3 {
    font-family: 'Oswald', sans-serif;
    color: var(--primary-blue);
    font-size: 1.5rem;
    margin-bottom: 15px;
    grid-column: 1 / -1;
}

.specs-table {
    width: 100%;
    border-collapse: collapse;
    margin: 15px 0;
    font-size: 0.9rem;
}

.specs-table tr {
    border-bottom: 1px solid #eee;
}

.specs-table tr:last-child {
    border-bottom: none;
}

.specs-table td {
    padding: 8px 0;
}

.specs-table td:first-child {
    font-weight: bold;
    width: 40%;
    color: var(--dark-grey);
}

/* =========================================
   6. ABOUT PAGE SECTIONS
   ========================================= */
/* Split Layout (Text + Image) */
.about-section { padding: 80px 0; background-color: var(--white); }
.split-layout { display: flex; align-items: center; gap: 50px; }
.text-col { flex: 1; }
.image-col { flex: 1; }
.image-col img { border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.15); }

.underline-left {
    width: 60px; height: 4px; background-color: var(--accent-red); margin: 10px 0 20px 0;
}
.text-col h2 { font-family: 'Oswald', sans-serif; font-size: 2rem; color: var(--primary-blue); }
.text-col h3 { margin-top: 20px; color: var(--dark-grey); }
.text-col p { margin-bottom: 15px; color: #555; }

/* Certifications Strip */
.cert-strip { background-color: var(--primary-blue); padding: 50px 0; color: white; text-align: center; }
.cert-strip .container { display: flex; justify-content: space-around; flex-wrap: wrap; }
.cert-box { margin: 20px; text-align: center; }
.cert-box i { font-size: 2.5rem; color: var(--gold); margin-bottom: 15px; }
.cert-box h3 { font-family: 'Oswald', sans-serif; letter-spacing: 1px; }

/* Timeline Section */
.history-section { padding: 80px 0; background-color: #f9f9f9; text-align: center; }
.timeline {
    display: flex; justify-content: space-between; flex-wrap: wrap;
    margin-top: 40px; position: relative;
}
/* Grey line connecting timeline items */
.timeline::before {
    content: ''; position: absolute; top: 20px; left: 0; right: 0;
    height: 4px; background-color: #ddd; z-index: 0;
    display: none; /* Hidden on mobile */
}
.timeline-item {
    background: white; padding: 20px; border-radius: 8px;
    width: 23%; box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    position: relative; z-index: 1; margin-bottom: 20px;
}
.timeline-item .year {
    display: block; font-size: 1.5rem; font-weight: bold;
    color: var(--accent-red); margin-bottom: 10px; font-family: 'Oswald', sans-serif;
}

/* =========================================
   7. PRODUCTS PAGE (SIDEBAR LAYOUT)
   ========================================= */
.catalog-section { padding: 60px 0; background-color: var(--light-grey); }
.catalog-layout { display: flex; gap: 40px; }

/* Sidebar Styles */
.catalog-sidebar {
    flex: 1; min-width: 250px; background: white;
    padding: 30px; border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    height: fit-content;
}

.catalog-sidebar h3 {
    font-family: 'Oswald', sans-serif; border-bottom: 2px solid var(--primary-blue);
    padding-bottom: 10px; margin-bottom: 20px; color: var(--primary-blue);
}

.category-list li { margin-bottom: 10px; border-bottom: 1px solid #eee; }
.category-list li:last-child { border-bottom: none; }
.category-list a { display: block; padding: 10px 5px; color: #555; font-weight: 500; }
.category-list a:hover { color: var(--accent-red); padding-left: 10px; }
.category-list a.active-cat { color: var(--accent-red); font-weight: bold; }

/* Sidebar Call to Action Box */
.sidebar-cta {
    margin-top: 40px; background-color: var(--primary-blue);
    color: white; padding: 20px; border-radius: 5px; text-align: center;
}
.sidebar-cta h4 { margin-bottom: 10px; font-family: 'Oswald', sans-serif; }
.sidebar-cta p { font-size: 0.9rem; margin-bottom: 15px; opacity: 0.9; }

.btn-small {
    display: inline-block; background-color: var(--accent-red);
    color: white; padding: 8px 15px; border-radius: 4px;
    font-size: 0.8rem; font-weight: bold;
}

/* Catalog Grid specific adjustments */
.catalog-grid {
    flex: 3;
    display: grid; grid-template-columns: 1fr;
    gap: 30px;
}
.cat-tag {
    font-size: 0.75rem; text-transform: uppercase; color: #999;
    letter-spacing: 1px; margin-bottom: 5px; font-weight: bold;
}

/* =========================================
   8. CONTACT PAGE STYLES
   ========================================= */
.contact-section {
    padding: 80px 0;
    background-color: var(--white);
}

.contact-wrapper {
    display: flex;
    gap: 50px;
}

/* Info Box (Left) */
.contact-info-box {
    flex: 1;
}

.info-item {
    display: flex;
    margin-bottom: 30px;
}

.info-item i {
    width: 50px;
    height: 50px;
    background-color: #f0f0f0;
    color: var(--primary-blue);
    border-radius: 50%;
    text-align: center;
    line-height: 50px;
    font-size: 1.2rem;
    margin-right: 20px;
    flex-shrink: 0;
}

.info-item h4 {
    font-family: 'Oswald', sans-serif;
    margin-bottom: 5px;
    color: var(--dark-grey);
}

.map-container {
    margin-top: 30px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Form Box (Right) */
.contact-form-box {
    flex: 1;
    background-color: #f9f9f9;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.contact-form-box h2 {
    font-family: 'Oswald', sans-serif;
    margin-bottom: 20px;
    color: var(--primary-blue);
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #555;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-family: 'Roboto', sans-serif;
    font-size: 1rem;
    background-color: white;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    border-color: var(--primary-blue);
    outline: none;
    box-shadow: 0 0 5px rgba(0, 51, 102, 0.2);
}

/* =========================================
   9. RESOURCES / DOWNLOADS PAGE
   ========================================= */
.downloads-section {
    padding: 80px 0;
    background-color: var(--white);
}

.download-group {
    margin-bottom: 60px;
}

.download-group h2 {
    font-family: 'Oswald', sans-serif;
    color: var(--primary-blue);
    margin-bottom: 10px;
}

/* The Grid for Documents */
.doc-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

/* Individual Document Card */
.doc-item {
    display: flex;
    align-items: center;
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #eee;
    transition: all 0.3s ease;
}

.doc-item:hover {
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    transform: translateY(-2px);
    border-color: var(--primary-blue);
}

.doc-icon {
    font-size: 2rem;
    color: var(--accent-red); /* PDF Red */
    margin-right: 20px;
}

.doc-info {
    flex: 1; /* Pushes button to the right */
}

.doc-info h4 {
    font-size: 1rem;
    color: var(--dark-grey);
    margin-bottom: 5px;
}

.doc-info p {
    font-size: 0.85rem;
    color: #777;
    margin: 0;
}

/* Download Button */
.btn-download {
    background-color: white;
    color: var(--primary-blue);
    border: 1px solid var(--primary-blue);
    padding: 8px 15px;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: bold;
    transition: all 0.3s;
}

.btn-download:hover {
    background-color: var(--primary-blue);
    color: white;
}

/* =========================================
   10. FOOTER (FIXED SPACING)
   ========================================= */
footer { background-color: #111; color: #ccc; padding: 60px 0 20px; }
.site-footer { background: #09283f; color: #e3ebf1; padding: 44px 0 20px; }
.site-footer-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 40px; }
.site-footer-grid > * { min-width: 0; }
.site-footer h2 { color: #fff; font-size: 1.15rem; margin: 0 0 14px; }
.site-footer p { line-height: 1.65; margin: 0; }
.site-footer-logo { display: inline-flex; align-items: center; gap: 12px; background: #fff; padding: 12px 16px; border-radius: 6px; }
.site-footer-logo img { display: block; max-height: 55px; width: auto; }
.site-footer-logo span { color: var(--primary-blue); font-family: 'Oswald', sans-serif; font-size: 2.2rem; font-weight: 700; line-height: 1; }
.site-footer a.site-footer-logo:hover { text-decoration: none; }
.site-footer-company { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.site-footer a.site-footer-cta { background-color: #fff; color: #09283f; }
.site-footer a.site-footer-cta:hover { background-color: #e3ebf1; color: #09283f; text-decoration: none; }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer a { color: #fff; overflow-wrap: anywhere; }
.site-footer-nav a, .site-footer-contact address > a { display: block; padding: 8px 0; line-height: 1.5; }
.site-footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.site-footer a:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.site-footer address { font-style: normal; }
.site-footer .site-footer-hours { margin-top: 12px; }
.site-footer-base { margin-top: 28px; padding-top: 16px; border-top: 1px solid #446075; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.site-footer-base p { font-size: .8rem; }
.site-footer-social { display: flex; gap: 24px; flex-wrap: wrap; }
.site-footer-social a { display: inline-flex; align-items: center; min-height: 44px; font-size: .9rem; }
@media (max-width: 768px) {
    .site-footer-grid { grid-template-columns: 1fr; gap: 28px; }
    .site-footer-nav a, .site-footer-contact address > a { min-height: 44px; }
    .site-footer-base { flex-direction: column; align-items: flex-start; gap: 8px; }
}
.footer-content {
    display: flex; justify-content: space-between; flex-wrap: wrap;
    padding-bottom: 40px; border-bottom: 1px solid #333;
}
.footer-col { flex: 1; min-width: 250px; margin: 10px; }
.footer-col h3 { color: white; margin-bottom: 20px; font-family: 'Oswald', sans-serif; }
.footer-col ul li { margin-bottom: 10px; }
.footer-col ul li a:hover { color: var(--accent-red); }
/* Removed max-width: 85% and text-align: justify to fix weird gap */
.footer-col p { margin-bottom: 10px; line-height: 1.6; }
.footer-col i { width: 25px; color: var(--accent-red); }
.footer-bottom { text-align: center; padding-top: 20px; font-size: 0.8rem; }

/* =========================================
   12. PRODUCT NAVIGATION BAR - DROPDOWN MENU
   ========================================= */
.product-nav-bar {
    position: relative;
    top: 80px;
    z-index: 999;
    margin-bottom: 40px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    border: 1px solid #e0e0e0;
}

.product-nav-container {
    position: relative;
}

.product-nav-header {
    width: 100%;
    border: 0;
    text-align: left;
    font: inherit;
    padding: 15px 20px;
    background: linear-gradient(135deg, var(--primary-blue) 0%, #004c99 100%);
    color: white;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.product-nav-header i:first-child {
    font-size: 1.2rem;
}

.product-nav-header > span:not(.product-nav-toggle) {
    font-weight: 600;
    font-family: 'Oswald', sans-serif;
    letter-spacing: 0.5px;
    flex: 1;
}

.product-nav-toggle {
    flex: 0 0 30px;
    background: rgba(255,255,255,0.2);
    border: none;
    color: white;
    width: 30px;
    height: 30px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-nav-toggle:hover {
    background: rgba(255,255,255,0.3);
    transform: scale(1.05);
}

.product-nav-toggle i {
    transition: transform 0.3s ease;
}

.product-nav-toggle.active i {
    transform: rotate(180deg);
}

/* Dropdown Menu */
.product-nav-list {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    background: white;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.1);
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out;
    z-index: 1000;
    display: flex;
flex-direction: column;
}

.product-nav-list.show {
    max-height: 400px;
    overflow-y: auto;
    transition: max-height 0.4s ease-in;
}

/* Custom scrollbar for dropdown */
.product-nav-list::-webkit-scrollbar {
    width: 8px;
}

.product-nav-list::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.product-nav-list::-webkit-scrollbar-thumb {
    background: var(--primary-blue);
    border-radius: 4px;
}

.product-nav-list::-webkit-scrollbar-thumb:hover {
    background: var(--accent-red);
}

.product-nav-list li {
    border-bottom: 1px solid #f0f0f0;
}

.product-nav-list li:last-child {
    border-bottom: none;
}

.product-nav-list a {
    display: block;
    padding: 12px 20px;
    color: var(--dark-grey);
    text-decoration: none;
    transition: all 0.3s ease;
    font-weight: 500;
    position: relative;
    padding-left: 45px;
}

.product-nav-list a::before {
    content: '\f0c1';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    left: 20px;
    color: var(--primary-blue);
    opacity: 0.6;
    font-size: 0.9rem;
}

.product-nav-list a:hover {
    background-color: #f8f9fa;
    color: var(--accent-red);
    padding-left: 55px;
}

.product-nav-list a:hover::before {
    color: var(--accent-red);
    opacity: 1;
}

/* Active state for current product */
.product-nav-list a.active-nav {
    background-color: #e8f0fe;
    color: var(--accent-red);
    border-left: 3px solid var(--accent-red);
}

.product-nav-list a.active-nav::before {
    color: var(--accent-red);
    opacity: 1;
}

/* Back to Top Button */
.back-to-top {
    border: 0;
    padding: 0;
    position: fixed;
    bottom: 30px;
    right: 30px;
    background: var(--accent-red);
    color: white;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    z-index: 1000;
}

.back-to-top.show {
    opacity: 1;
    visibility: visible;
}

.back-to-top:hover {
    background: #a30000;
    transform: translateY(-3px);
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
}

/* =========================================
   11. MEDIA QUERIES (MOBILE RESPONSIVENESS)
   ========================================= */
@media (min-width: 769px) {
    /* Show timeline line only on desktop */
    .timeline::before { display: block; }
}

@media (max-width: 768px) {
    /* --- Mobile Navigation --- */
    .header-content { justify-content: space-between; padding: 0 20px; }
    
    .nav-links {
        position: fixed; right: 0; top: 70px; height: 90vh;
        background-color: var(--white);
        display: flex; flex-direction: column; align-items: center;
        width: 65%;
        transform: translateX(100%); /* Hidden by default */
        transition: transform 0.4s ease-in;
        box-shadow: -2px 0 5px rgba(0,0,0,0.1);
        z-index: 999;
        padding-top: 40px;
    }
    
    .nav-links li { margin: 20px 0; opacity: 0; }
    
    /* Active State (JS adds this) */
    .nav-active { transform: translateX(0%); }
    .nav-active li { opacity: 1; transition: opacity 0.5s ease 0.3s; }
    
    /* Hamburger Animation */
    .hamburger { display: block; }
    .toggle .line1 { transform: rotate(-45deg) translate(-5px, 6px); }
    .toggle .line2 { opacity: 0; }
    .toggle .line3 { transform: rotate(45deg) translate(-5px, -6px); }

    /* --- General Layout Adjustments --- */
    .top-bar .container { justify-content: center; text-align: center; }
    .contact-info, .certifications { margin: 5px 0; }
    .hero-content h1 { font-size: 2.2rem; }
    
    /* Footer Stack */
    .footer-content { flex-direction: column; }
    .footer-col { margin-bottom: 30px; }

    /* About Page Stack */
    .split-layout { flex-direction: column; }
    .timeline-item { width: 100%; margin-bottom: 20px; }

    /* Product Page Sidebar Stack */
    .catalog-layout { flex-direction: column; }
    .catalog-sidebar { margin-bottom: 30px; width: 100%; }

    /* Contact Page Stack */
    .contact-wrapper { flex-direction: column; }
    .contact-form-box { padding: 20px; }

    /* Downloads Page Stack */
    .doc-list { grid-template-columns: 1fr; }
    .doc-item { flex-direction: column; text-align: center; }
    .doc-icon { margin-right: 0; margin-bottom: 15px; }
    .doc-info { margin-bottom: 15px; }

    /* Product Detail Row Stack */
    .product-row {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 20px;
    }
    
    .prod-info-col {
        padding: 0;
    }
    
    .product-row h3 {
        font-size: 1.3rem;
    }
    
    /* Product Navigation Mobile Adjustments */
    .product-nav-bar {
        top: 70px;
    }
    
    .product-nav-header {
        padding: 12px 15px;
    }
    
    .product-nav-list.show {
        max-height: 300px;
    }
    
    .product-nav-list a {
        padding: 10px 15px;
        padding-left: 40px;
        font-size: 0.9rem;
    }
    
    .product-nav-list a::before {
        left: 15px;
        font-size: 0.8rem;
    }
    
    html {
        scroll-padding-top: 120px;
    }
}
/* =========================================
   13. PRODUCT CATEGORIES DROPDOWN - EXACT SAME SIZE AS JUMP TO PRODUCTS
   ========================================= */
.category-dropdown-container {
    margin-bottom: 20px;
    width: 100%;
}

.category-dropdown {
    position: relative;
    width: 100%;
}

.category-dropdown-btn {
    width: 100%;
    background: linear-gradient(135deg, var(--primary-blue) 0%, #004c99 100%);
    color: white;
    padding: 15px 20px;  /* Same padding as product-nav-header */
    font-size: 1rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    border: none;
    border-radius: 8px;  /* Same border-radius as product-nav-header */
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.category-dropdown-btn i:first-child {
    font-size: 1.2rem;
}

.category-dropdown-btn i:last-child {
    transition: transform 0.3s ease;
}

.category-dropdown.active .category-dropdown-btn i:last-child {
    transform: rotate(180deg);
}

.category-dropdown-btn:hover {
    background: linear-gradient(135deg, #002244 0%, #003d77 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.category-dropdown-content {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    background-color: white;
    box-shadow: 0 12px 28px rgba(0,0,0,0.15);
    border-radius: 8px;
    z-index: 1000;
    overflow: hidden;
    border: 1px solid #e0e0e0;
}

.category-dropdown.active .category-dropdown-content {
    display: block;
    animation: fadeInUp 0.2s ease;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.category-dropdown-content a {
    color: var(--dark-grey);
    padding: 12px 20px;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 500;
    transition: all 0.2s;
    border-left: 3px solid transparent;
    font-size: 0.95rem;
}

.category-dropdown-content a i {
    width: 24px;
    color: var(--primary-blue);
    font-size: 1rem;
    text-align: center;
}

.category-dropdown-content a:hover {
    background-color: #f5f7fa;
    border-left-color: var(--accent-red);
    padding-left: 24px;
    color: var(--accent-red);
}

.category-dropdown-content a:hover i {
    color: var(--accent-red);
}

.category-dropdown-content hr {
    margin: 8px 0;
    border-color: #eee;
}

/* Responsive styles for category dropdown */
@media (max-width: 768px) {
    .category-dropdown-btn {
        padding: 12px 16px;  /* Match mobile padding of product-nav-header */
        font-size: 0.9rem;
    }
    
    .category-dropdown-content a {
        padding: 10px 16px;
        font-size: 0.9rem;
    }
    
}
/* =========================================
   14. PRODUCT CONTENT BULLET LIST FIX
   ========================================= */
/*
   The global reset near the top removes bullets from every ul.
   These rules turn bullets back on only inside product detail content
   so the header menu, dropdown menus, and footer links stay clean.
*/
.product-row .prod-info-col ul,
.product-row .prod-img-col ul {
    list-style-type: disc;
    list-style-position: outside;
    padding-left: 25px;
    margin: 10px 0 15px 20px;
}

.product-row .prod-info-col li,
.product-row .prod-img-col li {
    margin-bottom: 8px;
    line-height: 1.6;
}

/* Keeps nested product lists properly indented */
.product-row .prod-info-col ul ul,
.product-row .prod-img-col ul ul {
    list-style-type: circle;
    margin-top: 6px;
}
/* Warranty disclaimer */
section.warranty-disclaimer {
    background: #a6192e !important;
    border-top: 4px solid #730f1f !important;
    padding: 24px 0 !important;
}

section.warranty-disclaimer p,
section.warranty-disclaimer strong {
    color: #ffffff !important;
}
.product-nav-header:focus-visible,
.back-to-top:focus-visible {
    outline: 3px solid var(--gold);
    outline-offset: 3px;
}

/* Site-wide product search */
.product-search { position: relative; margin-top: 12px; }
.product-search-form { display: flex; align-items: center; gap: 16px; }
.product-search-form label { color: var(--primary-blue); font-weight: 700; white-space: nowrap; }
.product-search-field { display: flex; flex: 1; min-width: 0; }
.product-search-field input { width: 100%; min-width: 0; padding: 10px 14px; font: inherit; border: 1px solid #b8c5d1; border-radius: 5px 0 0 5px; background: white; }
.product-search-field button { padding: 10px 20px; border: 0; border-radius: 0 5px 5px 0; background: var(--primary-blue); color: white; font: inherit; font-weight: 700; cursor: pointer; }
.product-search-results { position: absolute; top: 100%; left: 20px; right: 20px; max-height: min(420px, 55vh); overflow-y: auto; background: white; border: 1px solid #b8c5d1; border-radius: 0 0 6px 6px; box-shadow: 0 8px 24px #00336626; z-index: 1100; }
.product-search-results[hidden] { display: none; }
.product-search-results a { display: block; padding: 12px 16px; border-bottom: 1px solid #edf0f3; }
.product-search-results a:hover, .product-search-results a:focus { background: #edf4fb; }
.product-search-results strong { display: block; color: var(--primary-blue); font-size: .95rem; }
.product-search-results span { display: block; color: #555; font-size: .85rem; }
.product-search-empty { padding: 16px; }
.product-search input:focus-visible, .product-search button:focus-visible, .product-search-results a:focus-visible { outline: 2px solid var(--primary-blue); outline-offset: 2px; }
.search-status { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 600px) {
    .product-search-form { display: block; }
    .product-search-form label { display: block; margin-bottom: 4px; font-size: .9rem; }
    .product-search-field input { font-size: 16px; }
    .product-search-field button { padding: 10px 12px; }
}

/* Accessible mobile navigation, positioned beneath the full header and search. */
.hamburger { background: transparent; border: 0; padding: 8px; flex-shrink: 0; }
.hamburger:focus-visible { outline: 3px solid var(--primary-blue); outline-offset: 2px; }
@media (max-width: 768px) {
    .nav-links {
        position: absolute;
        top: 100%;
        height: auto;
        max-height: 65vh;
        overflow-y: auto;
        padding: 16px 0;
        visibility: hidden;
        transform: none;
        transition: none;
    }
    .nav-links.nav-active { visibility: visible; }
}

/* Consistent catalog presentation and quality documentation. */
:root { --border-soft: #dce4ed; }
.btn { font-family: inherit; font-size: .875rem; line-height: 1.45; letter-spacing: .025em; border-radius: 6px; min-height: 44px; }
.btn-secondary { border: 1px solid var(--border-soft); }
.btn:focus-visible { outline: 3px solid var(--primary-blue); outline-offset: 3px; }
.btn:disabled { opacity: .6; cursor: not-allowed; }
.catalog-section { padding-bottom: 64px; }
.product-row { border: 1px solid var(--border-soft); border-radius: 12px; box-shadow: 0 4px 18px rgba(0, 35, 70, .04); }
.product-row > h3 { line-height: 1.35; padding-bottom: 16px; border-bottom: 2px solid #e9eef4; }
.prod-info-col { min-width: 0; }
.prod-info-col h4 { font-family: 'Oswald', sans-serif; font-size: 1.1rem; color: var(--primary-blue); margin-top: 24px; margin-bottom: 10px; }
.prod-info-col p, .prod-info-col li { line-height: 1.75; }
.prod-info-col .btn { margin: 6px 8px 6px 0; }
.specs-table { border: 1px solid var(--border-soft); font-variant-numeric: tabular-nums; line-height: 1.5; }
.specs-table td, .specs-table th { padding: 11px 14px; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.specs-table tr:nth-child(odd) { background: #f3f6fa; }
.specs-table tr:nth-child(even) { background: white; }
.specs-table th { background: var(--primary-blue); color: white; font-weight: 600; }
.specs-table tr { border-bottom: 1px solid #e4eaf0; }
.specs-table td:first-child { width: 45%; font-weight: 500; }
.page-hero h1, .section-header h2 { line-height: 1.2; }
.section-header p { margin-top: 12px; }
.contact-form-box > p { margin: 12px 0 24px; color: #555; }
.contact-form-box input, .contact-form-box select, .contact-form-box textarea { font: inherit; border-radius: 6px; }
#contactInquiry { scroll-margin-top: 16px; }
#contactStatus { margin-top: 16px; font-size: .95rem; }
.product-search-results mark { background: #fff0ad; color: inherit; padding: 0 1px; border-radius: 2px; }
.quality-strip { background: #eef3f8; border-top: 1px solid var(--border-soft); padding: 32px 0; }
.quality-strip-content { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.quality-kicker { font-size: .75rem; font-weight: 700; letter-spacing: .12em; color: #52667c; }
.quality-strip h2 { font-family: 'Oswald', sans-serif; color: var(--primary-blue); font-size: 1.7rem; margin: 4px 0; }
.quality-strip p { color: #52667c; font-size: .95rem; }
.quality-strip .btn { margin: 0; background: white; color: var(--primary-blue); white-space: nowrap; }
@media (max-width: 600px) {
    .specs-table td, .specs-table th { padding: 9px 10px; }
    .prod-info-col .btn { display: block; width: 100%; text-align: center; margin: 10px 0; }
    .quality-strip-content { align-items: flex-start; flex-direction: column; gap: 16px; }
    .product-row { border-radius: 8px; }
}

.catalog-shortcuts { display:flex; gap:10px 20px; flex-wrap:wrap; padding-top:12px; font-size:.83rem; font-weight:600; }
.catalog-shortcuts a { color:var(--primary-blue); text-decoration:underline; text-underline-offset:4px; }
.catalog-workspace, .product-detail-page { padding-top:40px; padding-bottom:48px; }
.catalog-workspace h1, .catalog-workspace h2, .catalog-card h3 { color:var(--primary-blue); font-family:'Oswald',sans-serif; }
.catalog-workspace > p, [data-catalog] > p { margin:12px 0 24px; max-width:850px; }
.catalog-filters { display:flex; flex-wrap:wrap; gap:16px; margin:24px 0; }
.catalog-filters label { display:flex; flex-direction:column; gap:6px; flex:1 1 180px; font-weight:600; font-size:.9rem; }
.catalog-filters input, .catalog-filters select { min-width:0; width:100%; padding:10px; border:1px solid #bccbd8; border-radius:6px; font:inherit; background:white; }
.catalog-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr)); gap:20px; }
.catalog-card { background:white; border:1px solid var(--border-soft); border-radius:10px; padding:22px; display:flex; flex-direction:column; }
.catalog-card small { color:#53677d; }
.catalog-card h3 { margin:10px 0 16px; line-height:1.4; font-size:1.2rem; }
.catalog-card dl { margin-bottom:18px; font-size:.9rem; }
.catalog-card dt { font-weight:600; margin-top:8px; }
.catalog-card dd { margin:0; color:#526276; }
.catalog-card-actions { margin-top:auto; display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.catalog-card-actions > a { color:var(--primary-blue); font-weight:700; text-decoration:underline; }
.catalog-card-actions .btn { margin:0; padding:10px; font-size:.75rem; }
.compare-choice { display:flex; align-items:center; gap:8px; }
.compare-choice input { width:18px; height:18px; }
.comparison-toolbar { display:flex; gap:16px; align-items:center; flex-wrap:wrap; margin-bottom:20px; }
.comparison-toolbar a { color:var(--primary-blue); font-weight:700; text-decoration:underline; }
.comparison-picker { padding: 22px; margin: 20px 0 28px; border: 1px solid #dce3e9; background: #f7f9fb; border-radius: 8px; }
.comparison-picker .catalog-filters { margin: 18px 0; }
.comparison-picker button:disabled { opacity: .55; cursor: not-allowed; }
.comparison-selection-status { margin-top: 12px; line-height: 1.5; }
.comparison-toolbar:has(a) { position: sticky; bottom: 12px; z-index: 20; background: white; padding: 16px; border: 1px solid #dce3e9; border-radius: 6px; }
.comparison-scroll { overflow-x:auto; }
.comparison-table { min-width:650px; }
.comparison-table tbody th { background:#edf2f7; color:var(--primary-blue); }
.document-row, .basket-item { background:white; padding:20px; border:1px solid var(--border-soft); border-radius:8px; margin:14px 0; }
.document-row { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.document-row > a, .basket-item > a { font-weight:600; color:var(--primary-blue); }
.document-row > div { display:flex; flex-wrap:wrap; gap:12px; flex-shrink:0; }
.document-row > div a { padding:8px 12px; background:#edf3f9; color:var(--primary-blue); border-radius:5px; }
.product-breadcrumb { margin-bottom:20px; color:#53677d; font-size:.9rem; }
.product-breadcrumb a { text-decoration:underline; }
.product-detail-menus { display: grid; gap: 16px; margin-bottom: 24px; }
.product-detail-menus .category-dropdown-container { margin: 0; }
.product-detail-menus .product-nav-bar { top: auto; margin: 0; }
.product-pagination { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin: 0 0 24px; }
.product-step { display: flex; flex-direction: column; justify-content: center; gap: 3px; min-height: 54px; padding: 8px 12px; border: 1px solid var(--primary-blue); border-radius: 6px; background: var(--primary-blue); color: var(--white); }
.product-pagination > .product-step { width: fit-content; max-width: 100%; min-width: 0; box-sizing: border-box; justify-self: start; }
.product-pagination > .product-step-next { justify-self: end; text-align: right; }
.product-step-direction { font-size: .95rem; font-weight: 700; }
.product-step-title { font-size: .8rem; line-height: 1.4; overflow-wrap: anywhere; }
.product-step:hover { border-color: var(--primary-blue); background: var(--primary-blue); color: var(--gold); }
.product-step:focus-visible { outline: 3px solid var(--primary-blue); outline-offset: 3px; }
@media (max-width: 480px) {
    .product-pagination { gap: 8px; }
    .product-step { padding: 8px 10px; }
}
.product-tools { display:flex; gap:16px; align-items:center; flex-wrap:wrap; margin-bottom:20px; }
.btn.quote-added { background: #17613b; border-color: #17613b; color: #fff; }
.quote-confirmation { display: block; padding: 12px 16px; border: 1px solid #9bc8ac; border-radius: 6px; background: #edf8f0; color: #174c30; font-weight: 600; }
.quote-confirmation a { color: #003366; text-decoration: underline; white-space: nowrap; }
.product-tools .quote-confirmation { flex-basis: 100%; }
.product-tools-bottom { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border-soft); }
.product-detail-page > p { padding:20px 0; }
.product-detail-page > p a { text-decoration:underline; color:var(--primary-blue); }
.home-shortcuts, .application-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.home-shortcuts { padding-top:28px; padding-bottom:28px; }
.home-shortcuts a, .application-grid a { background:white; border:1px solid var(--border-soft); padding:24px; border-radius:8px; }
.home-shortcuts strong, .home-shortcuts span { display:block; }
.home-shortcuts strong { font-size:1.2rem; color:var(--primary-blue); margin-bottom:8px; }
.home-shortcuts span, .application-grid span { font-size:.9rem; color:#53677d; }
.application-grid { margin:28px 0; grid-template-columns:repeat(2,1fr); }
.application-grid h2 { font-size:1.4rem; margin-bottom:10px; }
.distributor-card[hidden] { display:none; }
@media(max-width:768px) { .catalog-shortcuts { flex-wrap:nowrap; overflow-x:auto; white-space:nowrap; padding-bottom:8px; } .home-shortcuts, .application-grid { grid-template-columns:1fr; } .document-row { align-items:flex-start; flex-direction:column; } .catalog-workspace { padding-top:24px; } }

.product-title-link { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.product-title-link:hover { color: var(--accent-red); }
.product-title-link:focus-visible { outline: 2px solid var(--primary-blue); outline-offset: 4px; }

/* Keep the header compact; secondary tools remain available on demand. */
.product-tools-menu { position: relative; flex-shrink: 0; }
.product-tools-menu summary { cursor: pointer; padding: 10px 12px; color: var(--primary-blue); font-size: .85rem; font-weight: 600; white-space: nowrap; }
.product-tools-options { position: absolute; right: 0; top: 100%; width: 230px; background: white; border: 1px solid var(--border-soft); border-radius: 6px; box-shadow: 0 8px 24px #00336626; z-index: 1200; }
.product-tools-options a { display: block; padding: 12px 16px; color: var(--primary-blue); }
.product-tools-options a:hover, .product-tools-options a:focus { background: #edf4fb; }
.product-tools-menu summary:focus-visible { outline: 2px solid var(--primary-blue); outline-offset: 2px; }
.ordering-help { margin: 20px 0 24px; padding: 20px; border-left: 3px solid var(--primary-blue); background: #f3f6fa; border-radius: 4px; }
.ordering-help h3 { color: var(--primary-blue); margin-bottom: 10px; }
.ordering-help ol { padding-left: 20px; margin: 12px 0; }
.ordering-help a { color: var(--primary-blue); text-decoration: underline; }
@media(max-width:600px) { .product-search-form { display: grid; grid-template-columns: 1fr auto; gap: 6px; } .product-search-form > label { grid-column: 1; } .product-search-field { grid-column: 1 / -1; grid-row: 2; } .product-tools-menu { grid-column: 2; grid-row: 1; } .product-tools-menu summary { padding: 0 4px; } }

/* Product names remain the primary heading without changing their visual design. */
.product-row > .product-heading { grid-column: 1 / -1; font-family: "Oswald", sans-serif; color: var(--primary-blue); font-size: 1.5rem; line-height: 1.35; margin-bottom: 15px; padding-bottom: 16px; border-bottom: 2px solid #e9eef4; }
[data-catalog-fallback] ul { padding-left: 24px; margin: 12px 0 24px; }
@media (max-width: 768px) { .product-row > .product-heading { font-size: 1.3rem; } }

.customer-questions { padding-top: 40px; padding-bottom: 48px; }
.customer-questions h2 { color: var(--primary-blue); font-family: 'Oswald', sans-serif; margin-bottom: 20px; }
.customer-questions details { border-bottom: 1px solid #dce4ec; padding: 16px 0; }
.customer-questions summary { cursor: pointer; color: var(--primary-blue); font-weight: 700; line-height: 1.5; }
.customer-questions p { margin-top: 12px; line-height: 1.7; max-width: 900px; }
.customer-questions a { text-decoration: underline; color: var(--primary-blue); }
.customer-questions summary:focus-visible { outline: 3px solid var(--primary-blue); outline-offset: 4px; }
/* Preserved legacy company pages */
.category-pagination { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px; padding-top: 24px; padding-bottom: 32px; }
.category-previous { margin-right: auto; }
.category-next { display: inline-flex; align-items: center; justify-content: center; gap: 14px; max-width: 100%; padding: 12px 18px; border-radius: 6px; background: var(--primary-blue); color: white; font-weight: 600; line-height: 1.5; text-decoration: none; }
.category-next:hover { color: var(--gold); }
.category-next:focus-visible { outline: 3px solid var(--accent-red); outline-offset: 4px; }
.category-next span { flex-shrink: 0; }
.survey-invitation { margin-top: 24px; padding: 20px 22px; background: #f3f6f9; border-left: 3px solid var(--primary-blue); border-radius: 4px; }
.survey-invitation strong { display: block; color: var(--primary-blue); line-height: 1.5; }
.survey-invitation p { margin: 6px 0 10px; color: #536273; }
.survey-invitation a { display: inline-block; padding: 6px 0; color: var(--primary-blue); font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.survey-invitation a:hover { color: var(--accent-red); }
.survey-invitation a:focus-visible { outline: 2px solid var(--primary-blue); outline-offset: 3px; }
.survey-page { max-width: 980px; padding-top: 48px; padding-bottom: 64px; }
.survey-intro { max-width: 680px; margin-bottom: 32px; }
.survey-eyebrow { color: var(--accent-red); letter-spacing: .1em; font-size: .75rem; font-weight: 700; }
.survey-page h1 { color: var(--primary-blue); margin: 10px 0 16px; font-size: clamp(2rem, 4vw, 2.7rem); }
.survey-page h2 { color: var(--primary-blue); font-size: 1.3rem; margin-bottom: 12px; }
.survey-page p { line-height: 1.65; color: #536273; }
.survey-form { background: #fff; border: 1px solid #dce3e9; border-radius: 10px; padding: 32px; }
.survey-form section + section, .survey-submit { border-top: 1px solid #e5e9ed; padding-top: 28px; margin-top: 28px; }
.survey-ratings fieldset { border: 0; padding: 0; margin: 26px 0 0; min-width: 0; }
.survey-ratings legend { font-weight: 600; color: var(--primary-blue); margin-bottom: 12px; }
.survey-options { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.survey-options label { display: flex; align-items: center; gap: 8px; padding: 12px 10px; border: 1px solid #dce3e9; border-radius: 5px; font-size: .82rem; line-height: 1.4; cursor: pointer; color: #33475a; }
.survey-options label:has(input:checked) { border-color: var(--primary-blue); background: #edf3f9; color: var(--primary-blue); }
.survey-options input { accent-color: var(--primary-blue); flex-shrink: 0; width: 16px; height: 16px; }
.survey-options label:focus-within { outline: 2px solid var(--primary-blue); outline-offset: 2px; }
.survey-label, .survey-contact-grid label { display: block; font-weight: 600; color: var(--primary-blue); line-height: 1.5; }
.survey-label span, .survey-optional { color: #637183; font-weight: 400; font-size: .85rem; }
.survey-optional { margin-left: 8px; }
.survey-form textarea, .survey-contact-grid input { display: block; width: 100%; box-sizing: border-box; border: 1px solid #becbd7; border-radius: 5px; padding: 12px; margin-top: 8px; font: inherit; color: #24384a; background: white; }
.survey-form textarea { resize: vertical; min-height: 110px; }
.survey-form textarea:focus-visible, .survey-contact-grid input:focus-visible { outline: 2px solid var(--primary-blue); outline-offset: 2px; }
.survey-contact-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.survey-submit > p { font-size: .88rem; margin: 12px 0; }
.survey-submit .btn { margin: 8px 0; }
.survey-submit a { color: var(--primary-blue); text-decoration: underline; }
.survey-submit button:disabled { opacity: .6; cursor: not-allowed; }
@media (max-width: 720px) { .survey-options { grid-template-columns: repeat(2, minmax(0, 1fr)); } .survey-contact-grid { grid-template-columns: 1fr; } .survey-form { padding: 20px; } .survey-page { padding-top: 28px; } }
.sitemap-page { padding-top: 48px; padding-bottom: 64px; color: var(--primary-blue); }
.sitemap-intro { padding-bottom: 28px; margin-bottom: 36px; border-bottom: 1px solid #e3e8ed; }
.sitemap-eyebrow { color: var(--accent-red); font-weight: 700; letter-spacing: .12em; font-size: .75rem; }
.sitemap-page h1 { margin: 8px 0 12px; font-size: clamp(2rem, 4vw, 2.75rem); }
.sitemap-page h2 { margin: 0 0 12px; font-size: 1.3rem; }
.sitemap-page p { line-height: 1.6; }
.sitemap-intro > p:last-child, .sitemap-products-intro p { color: #586877; margin: 0; }
.sitemap-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 56px; align-items: start; }
.sitemap-site-nav { border-right: 1px solid #e3e8ed; padding-right: 24px; }
.sitemap-page-links { list-style: none; padding: 0; margin: 12px 0 0; }
.sitemap-page-links a { display: block; padding: 11px 0; color: var(--primary-blue); text-decoration: none; line-height: 1.45; }
.sitemap-products-intro { margin-bottom: 24px; }
.sitemap-category { border-bottom: 1px solid #e3e8ed; scroll-margin-top: 140px; }
.sitemap-category:first-child { border-top: 1px solid #e3e8ed; }
.sitemap-category summary { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto 12px; align-items: center; gap: 16px; padding: 21px 12px; cursor: pointer; list-style: none; }
.sitemap-category summary::-webkit-details-marker { display: none; }
.sitemap-category summary:hover { background: #f6f8fa; }
.sitemap-series { font-size: .8rem; font-weight: 600; color: #586877; }
.sitemap-category-name { font-weight: 600; line-height: 1.4; }
.sitemap-count { color: #586877; font-size: .8rem; font-variant-numeric: tabular-nums; }
.sitemap-chevron { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); }
.sitemap-category[open] .sitemap-chevron { transform: rotate(225deg); }
.sitemap-category[open] summary { background: #f6f8fa; }
.sitemap-category-body { padding: 8px 24px 20px; }
.sitemap-category ul { list-style: none; padding: 0; margin: 6px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; }
.sitemap-category li { border-top: 1px solid #edf0f4; }
.sitemap-category li a { display: block; padding: 14px 0; line-height: 1.5; color: var(--primary-blue); overflow-wrap: anywhere; text-decoration: none; }
.sitemap-category li strong { display: block; font-size: .9rem; font-weight: 600; }
.sitemap-category li a > span { display: block; margin-top: 3px; color: #586877; font-size: .85rem; }
.sitemap-category-link { display: inline-block; padding: 12px 0; color: var(--primary-blue); font-size: .85rem; text-underline-offset: 4px; }
.sitemap-help { margin-top: 24px; color: #586877; font-size: .9rem; }
.sitemap-help a { color: var(--primary-blue); text-underline-offset: 4px; }
.sitemap-page a:hover { color: var(--accent-red); text-decoration: underline; text-underline-offset: 4px; }
.sitemap-page a:focus-visible, .sitemap-category summary:focus-visible { outline: 2px solid var(--accent-red); outline-offset: 3px; }
.sitemap-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 800px) {
    .sitemap-layout { grid-template-columns: 1fr; gap: 32px; }
    .sitemap-site-nav { border-right: 0; border-bottom: 1px solid #e3e8ed; padding: 0 0 24px; }
    .sitemap-page-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
}
@media (max-width: 480px) {
    .sitemap-page { padding-top: 28px; }
    .sitemap-intro { margin-bottom: 28px; }
    .sitemap-category summary { grid-template-columns: 42px minmax(0, 1fr) auto 10px; gap: 10px; padding: 18px 4px; }
    .sitemap-category-body { padding: 8px 12px 18px; }
    .sitemap-category ul { grid-template-columns: 1fr; }
}
.legacy-content { padding-top: 48px; padding-bottom: 56px; }
.legacy-content h1, .legacy-content h2 { color: #172b4d; margin-bottom: 18px; }
.legacy-content h2 { margin-top: 32px; }
.legacy-content p, .legacy-content li { line-height: 1.7; }
.legacy-content ul { padding-left: 24px; }
.legacy-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 24px; margin-top: 28px; }
.legacy-gallery figure { margin: 0; }
.legacy-gallery img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: #f3f5f7; border-radius: 8px; }
.legacy-gallery figcaption { padding: 12px 0; }
.legacy-directory { columns: 2 320px; column-gap: 40px; }
.legacy-directory li { break-inside: avoid; margin-bottom: 8px; }
.legacy-related { padding-top: 24px; padding-bottom: 32px; }

/* Visible directory shortcut on the product overview. */
.catalog-directory-link { margin-bottom: 20px; }
.catalog-directory-link a { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 14px; border: 1px solid #d4dfe8; border-radius: 6px; color: var(--primary-blue); background: #f5f8fb; font-weight: 500; text-decoration: none; }
.catalog-directory-link a:hover { background: #e9f0f6; text-decoration: underline; }
.catalog-directory-link a:focus-visible { outline: 3px solid var(--primary-blue); outline-offset: 3px; }