/**
 * ═══════════════════════════════════════════════
 * WooCommerce Page Styles — Archive & Single Product
 * "Engineering Curator" — Tonal Layering
 * ═══════════════════════════════════════════════
 */

/* ───── Category Hero ───── */
.fm-cat-hero {
    position: relative;
    padding: calc(72px + var(--fm-space-12)) 0 var(--fm-space-12);
    overflow: hidden;
}
.fm-cat-hero__bg {
    position: absolute; inset: 0;
    background: linear-gradient(135deg, #001245 0%, var(--fm-primary) 60%, #0d1f4d 100%);
    z-index: 0;
}
.fm-cat-hero__inner { position: relative; z-index: 1; }
.fm-cat-hero__content { max-width: 640px; margin-bottom: var(--fm-space-8); }
.fm-cat-hero__content h1 { color: #fff; margin-bottom: var(--fm-space-4); }
.fm-cat-hero__industry-nav { margin-top: var(--fm-space-6); }
.fm-cat-hero__industry-chips { display: flex; gap: var(--fm-space-3); margin-top: var(--fm-space-3); flex-wrap: wrap; }

/* Breadcrumb */
.fm-breadcrumb { margin-bottom: var(--fm-space-8); }
.fm-breadcrumb__list {
    list-style: none;
    display: flex;
    align-items: center;
    gap: var(--fm-space-2);
    font-size: .75rem;
}
.fm-breadcrumb__item a { color: var(--fm-text-on-dark-muted); text-decoration: none; }
.fm-breadcrumb__item a:hover { color: #fff; }
.fm-breadcrumb__item:last-child a { color: var(--fm-text-on-dark); font-weight: 600; }
.fm-breadcrumb__list svg { color: var(--fm-text-on-dark-muted); }
.fm-breadcrumb--dark .fm-breadcrumb__item a { color: var(--fm-on-surface-variant); }
.fm-breadcrumb--dark .fm-breadcrumb__item a:hover { color: var(--fm-primary); }
.fm-breadcrumb--dark .fm-breadcrumb__list svg { color: var(--fm-outline); }

/* ───── Archive Layout ───── */
.fm-archive__layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: var(--fm-space-10);
    align-items: start;
}
.fm-archive__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--fm-space-8);
}
/* Override WooCommerce default toolbar styles */
.fm-archive__toolbar .woocommerce-result-count,
.fm-archive__toolbar .woocommerce-ordering { margin: 0; }
.fm-archive__toolbar .woocommerce-ordering select {
    background: var(--fm-surface-container-lowest);
    border: 1px solid var(--fm-outline-variant);
    border-radius: var(--fm-radius-md);
    padding: .5rem .75rem;
    font-family: var(--fm-font-body);
    font-size: .8125rem;
}

/* ───── Sidebar Filter ───── */
.fm-filter-panel {
    position: sticky;
    top: 88px;
    padding: var(--fm-space-8);
    background: var(--fm-surface-container-lowest);
    border-radius: var(--fm-radius-lg);
    box-shadow: var(--fm-shadow-sm);
}
.fm-filter-panel__title { margin-bottom: var(--fm-space-6); }
.fm-filter-group { margin-bottom: var(--fm-space-8); }
.fm-filter-group h5 {
    margin-bottom: var(--fm-space-4);
    color: var(--fm-on-surface-variant);
}
.fm-filter-list { list-style: none; }
.fm-filter-list li { margin-bottom: 0; }
.fm-filter-list li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--fm-space-3) var(--fm-space-4);
    font-size: .875rem;
    color: var(--fm-on-surface-variant);
    text-decoration: none;
    border-radius: var(--fm-radius-md);
    transition: background .2s, color .2s;
}
.fm-filter-list li a:hover { background: var(--fm-surface-container-low); color: var(--fm-primary); }
.fm-filter-list__active a {
    background: var(--fm-surface-container-high) !important;
    color: var(--fm-primary) !important;
    font-weight: 600;
}
.fm-filter-list__count {
    font-size: .6875rem;
    color: var(--fm-outline);
    background: var(--fm-surface-container-low);
    padding: .125rem .375rem;
    border-radius: var(--fm-radius-sm);
}
.fm-filter-cta {
    padding: var(--fm-space-6);
    background: var(--fm-surface-container-low);
    border-radius: var(--fm-radius-md);
}
.fm-filter-cta > * + * { margin-top: var(--fm-space-3); }

/* ───── Product Cards (Archive Grid) ───── */
.fm-product-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--fm-space-6);
}
.fm-pcard {
    background: var(--fm-surface-container-lowest);
    border-radius: var(--fm-radius-lg);
    overflow: hidden;
    box-shadow: var(--fm-shadow-sm);
    transition: transform .3s ease, box-shadow .3s ease;
}
.fm-pcard:hover { transform: translateY(-4px); box-shadow: var(--fm-shadow-lg); }
.fm-pcard__link { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: var(--fm-on-surface); }
.fm-pcard__image {
    position: relative;
    overflow: hidden;
    background: var(--fm-surface-container-low);
}
.fm-pcard__img { width: 100%; aspect-ratio: 3/2; object-fit: cover; transition: transform .6s ease; }
.fm-pcard:hover .fm-pcard__img { transform: scale(1.03); }
.fm-pcard__category {
    position: absolute;
    top: var(--fm-space-3);
    left: var(--fm-space-3);
    font-size: .625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    padding: .1875rem .5rem;
    background: rgba(249,249,255,.85);
    backdrop-filter: blur(8px);
    border-radius: var(--fm-radius-sm);
    color: var(--fm-primary);
}
.fm-pcard__body { padding: var(--fm-space-6); flex: 1; display: flex; flex-direction: column; }
.fm-pcard__title { margin-bottom: var(--fm-space-3); }
.fm-pcard__specs { display: flex; flex-wrap: wrap; gap: var(--fm-space-2); margin-bottom: var(--fm-space-3); }
.fm-spec-tag {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .1875rem .5rem;
    font-size: .6875rem;
    font-weight: 600;
    background: var(--fm-surface-container-low);
    border-radius: var(--fm-radius-sm);
    color: var(--fm-on-surface-variant);
}
.fm-spec-tag__icon { font-size: .75rem; }
.fm-pcard__excerpt { flex: 1; margin-bottom: var(--fm-space-4); }
.fm-pcard__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: var(--fm-space-4);
}
.fm-pcard__price {
    font-family: var(--fm-font-display);
    font-weight: 700;
    font-size: .9375rem;
    color: var(--fm-primary);
}
.fm-pcard__price--quote { font-size: .8125rem; color: var(--fm-on-surface-variant); }
.fm-pcard__cta {
    font-family: var(--fm-font-display);
    font-weight: 600;
    font-size: .8125rem;
    color: var(--fm-primary);
}
/* Compact variant (related products) */
.fm-pcard--compact .fm-pcard__body { padding: var(--fm-space-4); }

/* ───── Single Product Hero ───── */
.fm-pdp-hero {
    padding: calc(72px + var(--fm-space-8)) 0 var(--fm-space-12);
    background: var(--fm-surface-container-lowest);
}
.fm-pdp-hero__grid {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: var(--fm-space-12);
    align-items: start;
}
.fm-pdp-hero__gallery {
    background: var(--fm-surface-container-low);
    border-radius: var(--fm-radius-xl);
    overflow: hidden;
}
/* Override WooCommerce gallery styles */
.fm-pdp-hero__gallery .woocommerce-product-gallery { margin-bottom: 0; }
.fm-pdp-hero__gallery .woocommerce-product-gallery__image img { border-radius: var(--fm-radius-lg); }
.fm-pdp-hero__gallery .flex-control-thumbs { padding: var(--fm-space-4); gap: var(--fm-space-2); display: flex; }
.fm-pdp-hero__gallery .flex-control-thumbs li { width: 72px; flex-shrink: 0; }
.fm-pdp-hero__gallery .flex-control-thumbs li img { border-radius: var(--fm-radius-sm); }

.fm-pdp-hero__category { margin-bottom: var(--fm-space-3); }
.fm-pdp-hero__title { margin-bottom: var(--fm-space-4); }
.fm-pdp-hero__excerpt { margin-bottom: var(--fm-space-6); }

/* Stats Grid */
.fm-pdp-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--fm-space-3);
    margin-bottom: var(--fm-space-6);
}
.fm-pdp-stat {
    padding: var(--fm-space-4);
    text-align: center;
    background: var(--fm-surface-container-low);
    border-radius: var(--fm-radius-md);
}
.fm-pdp-stat__label {
    display: block;
    font-size: .625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--fm-on-surface-variant);
    margin-bottom: var(--fm-space-1);
}
.fm-pdp-stat__value {
    display: block;
    font-family: var(--fm-font-display);
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--fm-primary);
}

/* Price Anchor */
.fm-pdp-price-anchor {
    padding: var(--fm-space-6);
    background: var(--fm-surface-container-low);
    border-radius: var(--fm-radius-lg);
    margin-bottom: var(--fm-space-6);
}
.fm-pdp-price-anchor__row { margin-bottom: var(--fm-space-2); }
.fm-pdp-price-anchor__meta {
    display: flex;
    align-items: center;
    gap: var(--fm-space-6);
    flex-wrap: wrap;
}
.fm-pdp-price-anchor__scarcity {
    display: inline-flex;
    align-items: center;
    gap: var(--fm-space-2);
    font-size: .8125rem;
    color: var(--fm-cta);
    font-weight: 600;
}

/* CTA */
.fm-pdp-cta { display: flex; flex-direction: column; gap: var(--fm-space-3); margin-bottom: var(--fm-space-4); }
.fm-pdp-meta { font-size: .75rem; }

/* ───── Narrative Section ───── */
.fm-pdp-narrative__grid {
    display: grid;
    grid-template-columns: 2fr 3fr;
    gap: var(--fm-space-16);
}
.fm-pdp-benefits { list-style: none; margin-top: var(--fm-space-8); }
.fm-pdp-benefit {
    display: flex;
    gap: var(--fm-space-4);
    margin-bottom: var(--fm-space-6);
    align-items: flex-start;
}
.fm-pdp-benefit__icon { flex-shrink: 0; margin-top: 2px; }
.fm-pdp-benefit strong { display: block; margin-bottom: var(--fm-space-1); }
.fm-pdp-benefit span { display: block; font-size: .875rem; }

/* ───── Specs Table (No borders — tonal zebra) ───── */
.fm-specs-layout {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: var(--fm-space-12);
}
.fm-specs-table-wrap {
    background: var(--fm-surface-container-lowest);
    border-radius: var(--fm-radius-lg);
    overflow: hidden;
    box-shadow: var(--fm-shadow-sm);
}
.fm-specs-table { width: 100%; border-collapse: collapse; }
.fm-specs-table th,
.fm-specs-table td {
    padding: var(--fm-space-4) var(--fm-space-6);
    font-size: .875rem;
    text-align: left;
}
.fm-specs-table th {
    width: 38%;
    font-weight: 600;
    color: var(--fm-on-surface-variant);
}
/* Zebra striping with tonal shift — NO borders */
.fm-specs-table tr:nth-child(even) {
    background: var(--fm-surface-container-low);
}

/* ───── Industry Tabs ───── */
.fm-tab-nav {
    display: flex;
    gap: var(--fm-space-2);
    margin-bottom: var(--fm-space-8);
}
.fm-tab-nav__btn {
    padding: var(--fm-space-3) var(--fm-space-6);
    font-family: var(--fm-font-display);
    font-weight: 600;
    font-size: .875rem;
    background: var(--fm-surface-container-low);
    border: none;
    border-radius: var(--fm-radius-md);
    color: var(--fm-on-surface-variant);
    cursor: pointer;
    transition: all .2s;
}
.fm-tab-nav__btn:hover { background: var(--fm-surface-container-high); }
.fm-tab-nav__btn--active {
    background: var(--fm-primary);
    color: var(--fm-on-primary);
}
.fm-tab-panel { display: none; }
.fm-tab-panel--active { display: block; }
.fm-tab-panel__grid {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: var(--fm-space-10);
    align-items: center;
}
.fm-tab-panel__features {
    list-style: none;
    margin-top: var(--fm-space-4);
}
.fm-tab-panel__features li {
    position: relative;
    padding: var(--fm-space-2) 0 var(--fm-space-2) var(--fm-space-6);
    font-size: .875rem;
    color: var(--fm-on-surface-variant);
}
.fm-tab-panel__features li::before {
    content: '';
    position: absolute;
    left: 0;
    top: .75rem;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--fm-primary);
}
.fm-tab-panel__image { overflow: hidden; border-radius: var(--fm-radius-lg); }
.fm-tab-panel__image img { width: 100%; }

/* ───── Trust Evidence ───── */
.fm-pdp-trust__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--fm-space-10);
    text-align: center;
}
.fm-pdp-trust__logos {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--fm-space-6);
    margin-top: var(--fm-space-4);
    opacity: .6;
}
.fm-pdp-trust__highlights {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--fm-space-2);
    margin-top: var(--fm-space-4);
}

/* ───── Related Products ───── */
.fm-pdp-related__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--fm-space-6);
    margin-top: var(--fm-space-8);
}

/* ───── Second CTA ───── */
.fm-pdp-second-cta__inner {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}
.fm-pdp-second-cta__inner > * + * { margin-top: var(--fm-space-4); }

/* ───── Mobile Sticky CTA ───── */
.fm-mobile-cta {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 900;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(var(--fm-glass-blur));
    -webkit-backdrop-filter: blur(var(--fm-glass-blur));
    box-shadow: 0 -4px 20px rgba(18,28,42,.06);
    padding: var(--fm-space-3) var(--fm-space-6);
}
.fm-mobile-cta__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--fm-container);
    margin: 0 auto;
}

/* ───── Quote Modal ───── */
.fm-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 2000;
    align-items: center;
    justify-content: center;
}
.fm-modal.fm-modal--open { display: flex; }
.fm-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(26,27,32,.4);
    backdrop-filter: blur(4px);
}
.fm-modal__container {
    position: relative;
    width: 90%;
    max-width: 520px;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--fm-surface-container-lowest);
    border-radius: var(--fm-radius-xl);
    box-shadow: var(--fm-shadow-xl);
    padding: var(--fm-space-10);
}
.fm-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--fm-space-6);
}
.fm-modal__close {
    width: 36px; height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--fm-surface-container-low);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    color: var(--fm-on-surface-variant);
    transition: background .2s;
}
.fm-modal__close:hover { background: var(--fm-surface-container-high); }

/* Form */
.fm-quote-form select,
.fm-quote-form input[type="text"],
.fm-quote-form input[type="email"],
.fm-quote-form input[type="tel"],
.fm-quote-form textarea {
    width: 100%;
    padding: var(--fm-space-3) var(--fm-space-4);
    background: var(--fm-surface-container-lowest);
    border: 1px solid rgba(196,198,208,.2);
    border-radius: var(--fm-radius-md);
    font-family: var(--fm-font-body);
    font-size: .875rem;
    color: var(--fm-on-surface);
    transition: border-color .2s, box-shadow .2s;
}
.fm-quote-form select:focus,
.fm-quote-form input:focus,
.fm-quote-form textarea:focus {
    outline: none;
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 4px var(--fm-primary-fixed);
}
.fm-form-field { margin-bottom: var(--fm-space-4); }
.fm-form-field label { display: block; margin-bottom: var(--fm-space-2); color: var(--fm-on-surface-variant); }
.fm-form-progress {
    height: 4px;
    background: var(--fm-surface-container-high);
    border-radius: var(--fm-radius-full);
    margin-bottom: var(--fm-space-8);
    overflow: hidden;
}
.fm-form-progress__bar {
    height: 100%;
    background: linear-gradient(90deg, var(--fm-primary), var(--fm-primary-container));
    border-radius: var(--fm-radius-full);
    transition: width .4s ease;
}

/* ───── Responsive ───── */
@media (max-width: 1024px) {
    .fm-hero__grid { grid-template-columns: 1fr; }
    .fm-hero__visual { margin-top: var(--fm-space-8); }
    .fm-industries__grid { grid-template-columns: repeat(2, 1fr); }
    .fm-products-home__grid { grid-template-columns: 1fr 1fr; }
    .fm-cat-card--featured { grid-row: span 1; }
    .fm-why__layout { grid-template-columns: 1fr; gap: var(--fm-space-10); }
    .fm-tech__grid { grid-template-columns: 1fr 1fr; }
    .fm-faq__layout { grid-template-columns: 1fr; gap: var(--fm-space-8); }
    .fm-bottom-cta__inner { flex-direction: column; text-align: center; }
    .fm-footer__grid { grid-template-columns: 1fr 1fr; }
    .fm-archive__layout { grid-template-columns: 220px 1fr; }
    .fm-pdp-hero__grid { grid-template-columns: 1fr; }
    .fm-pdp-narrative__grid { grid-template-columns: 1fr; gap: var(--fm-space-8); }
    .fm-specs-layout { grid-template-columns: 1fr; gap: var(--fm-space-6); }
    .fm-tab-panel__grid { grid-template-columns: 1fr; }
    .fm-pdp-trust__grid { grid-template-columns: 1fr; gap: var(--fm-space-6); }
}

@media (max-width: 768px) {
    .fm-hero { padding: calc(72px + var(--fm-space-8)) 0 var(--fm-space-12); }
    .fm-hero__proof { flex-wrap: wrap; gap: var(--fm-space-4); }
    .fm-hero__float-card { position: static; margin-top: var(--fm-space-4); display: inline-flex; }
    .fm-industries__grid { grid-template-columns: 1fr; }
    .fm-products-home__grid { grid-template-columns: 1fr; }
    .fm-tech__grid { grid-template-columns: 1fr; }
    .fm-product-grid { grid-template-columns: 1fr 1fr; }
    .fm-archive__layout { grid-template-columns: 1fr; }
    .fm-archive__sidebar { display: none; }
    .fm-pdp-stats { grid-template-columns: repeat(3, 1fr); }
    .fm-pdp-related__grid { grid-template-columns: 1fr 1fr; }
    .fm-footer__grid { grid-template-columns: 1fr; gap: var(--fm-space-6); }
    .fm-footer__bottom { flex-direction: column; gap: var(--fm-space-4); text-align: center; }

    /* Mobile menu */
    .fm-header__toggle { display: flex; }
    .fm-header__nav {
        display: none;
        position: absolute;
        top: 72px;
        left: 0;
        right: 0;
        background: rgba(249,249,255,.96);
        backdrop-filter: blur(16px);
        padding: var(--fm-space-6);
        box-shadow: var(--fm-shadow-lg);
    }
    .fm-header__nav.fm-header__nav--open { display: block; }
    .fm-nav {
        flex-direction: column;
        gap: 0;
    }
    .fm-nav > li > a { display: block; padding: var(--fm-space-4) 0; font-size: 1rem; }
    .fm-nav__sub { position: static; box-shadow: none; padding-left: var(--fm-space-6); }

    /* Mobile Sticky CTA */
    .fm-mobile-cta { display: block; }
    /* Add bottom padding to body so CTA doesn't cover content */
    body.single-product { padding-bottom: 68px; }

    .fm-btn--lg { padding: .875rem 1.5rem; font-size: .875rem; }
}

@media (max-width: 480px) {
    .fm-product-grid { grid-template-columns: 1fr; }
    .fm-pdp-stats { grid-template-columns: 1fr 1fr 1fr; gap: var(--fm-space-2); }
    .fm-pdp-stat { padding: var(--fm-space-3); }
    .fm-pdp-stat__value { font-size: 1rem; }
    .fm-pdp-related__grid { grid-template-columns: 1fr; }
    .fm-tab-nav { flex-wrap: wrap; }
}