/* Product pages use the existing AECO red, white, Inter, and rounded-card theme. */
.product-page { --product-red: #ee2f1c; --product-ink: #111827; --product-muted: #4b5563; }
.product-page * { box-sizing: border-box; }
.product-page h1, .product-page h2, .product-page h3 { overflow-wrap: break-word; }
.product-page main h2 { color: var(--product-ink); font-size: clamp(1.65rem, 3vw, 2.25rem); font-weight: 800; line-height: 1.2; margin: 0 0 1.25rem; }
.product-page main h3 { color: var(--product-ink); font-size: 1.125rem; font-weight: 750; line-height: 1.4; }
.product-container { width: min(100% - 2rem, 80rem); margin-inline: auto; }
.product-section { padding-block: clamp(2.5rem, 6vw, 5rem); scroll-margin-top: 6rem; }
.product-soft { background: #f9fafb; }
.product-hero { background: linear-gradient(100deg, rgba(69,10,10,.95), rgba(127,29,29,.83)), url('../../images/Hero-Banner-7.jpg') center 70% / cover; color: white; padding: 1.75rem 0 3.5rem; }
.product-breadcrumbs { display: flex; flex-wrap: wrap; gap: .55rem; font-size: .8rem; color: #fecaca; margin-bottom: 2.25rem; line-height: 1.6; }
.product-breadcrumbs a:hover { color: white; text-decoration: underline; }
.product-breadcrumbs [aria-current] { color: white; }
.product-eyebrow { font-size: .7rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; color: #c32618; margin-bottom: .8rem; }
.product-hero .product-eyebrow, .product-cta .product-eyebrow { color: #fca5a5; }
.product-hero h1 { font-size: clamp(2rem, 4.5vw, 3.5rem); line-height: 1.12; font-weight: 850; max-width: 58rem; }
.product-hero-summary { max-width: 46rem; color: #fee2e2; line-height: 1.8; margin-top: 1rem; }
.product-overview { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: clamp(2rem, 5vw, 4rem); }
.product-overview > *, .product-description-grid > * { min-width: 0; }
.product-figure { border: 1px solid #e5e7eb; border-radius: 1rem; overflow: hidden; background: #f9fafb; }
.product-figure > img { width: 100%; height: auto; aspect-ratio: 6 / 5; object-fit: contain; padding: 1.5rem; background: white; }
.product-figure figcaption { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .4rem; padding: 1rem 1.5rem; font-size: .75rem; font-weight: 650; color: #4b5563; border-top: 1px solid #e5e7eb; }
.product-figure figcaption span { font-weight: 400; }
.product-copy { color: var(--product-muted); font-size: 1rem; line-height: 1.85; margin: 0 0 1.25rem; }
.product-keyword-link { color: #c32618; font-weight: 650; text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px; }
.product-keyword-link:hover { color: #991b1b; text-decoration-thickness: 2px; }
.product-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin: 1.5rem 0; }
.product-stats > div { padding: 1rem; background: #f9fafb; border: 1px solid #f3f4f6; border-radius: .75rem; }
.product-stats dt { font-size: .7rem; text-transform: uppercase; letter-spacing: .07em; color: #6b7280; }
.product-stats dd { font-size: 1.1rem; font-weight: 800; color: var(--product-ink); margin-top: .3rem; overflow-wrap: anywhere; }
.product-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.product-button { display: inline-flex; align-items: center; justify-content: center; gap: .9rem; min-height: 48px; padding: .8rem 1.4rem; border-radius: .6rem; font-weight: 750; font-size: .875rem; text-align: center; transition: box-shadow .2s, background .2s; }
.product-button-primary { background: linear-gradient(100deg, #ee2f1c, #ff6347); color: white; border: 2px solid transparent; }
.product-button-primary:hover { background: #d42815; box-shadow: 0 6px 18px #ee2f1c30; }
.product-button-secondary { border: 2px solid #d1d5db; color: #374151; }
.product-button-secondary:hover { border-color: var(--product-red); color: var(--product-red); }
.product-help { color: #6b7280; font-size: .8rem; line-height: 1.7; margin-top: 1rem; }
.product-section-nav { border-block: 1px solid #e5e7eb; background: white; }
.product-section-nav > div { display: flex; flex-wrap: wrap; gap: .5rem 2rem; }
.product-section-nav a { padding-block: 1rem; min-height: 48px; font-size: .875rem; font-weight: 700; color: #4b5563; }
.product-section-nav a:hover { color: var(--product-red); }
.product-description-grid { display: grid; grid-template-columns: 1.7fr 1fr; gap: 4rem; align-items: start; }
.product-advice { background: white; padding: 2rem; border: 1px solid #e5e7eb; border-radius: 1rem; }
.product-advice-icon, .product-feature-number { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; background: #fef2f2; color: #c32618; border-radius: .75rem; margin-bottom: 1rem; font-weight: 800; }
.product-advice p, .product-features p { color: #4b5563; font-size: .9rem; line-height: 1.8; margin-top: .6rem; }
.product-advice a { display: inline-block; color: #c32618; font-size: .875rem; font-weight: 750; margin-top: 1.25rem; }
.product-spec-container { max-width: 60rem; }
.product-spec-table { border: 1px solid #e5e7eb; border-radius: 1rem; overflow: hidden; }
.product-spec-table table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: .9rem; }
.product-spec-table th, .product-spec-table td { padding: 1.1rem 1.5rem; text-align: left; border-bottom: 1px solid #e5e7eb; overflow-wrap: anywhere; }
.product-spec-table th { width: 42%; color: #374151; font-weight: 650; }
.product-spec-table td { color: #4b5563; }
.product-spec-table tr:nth-child(odd) { background: #f9fafb; }
.product-spec-table tr:last-child > * { border-bottom: 0; }
.product-features, .product-related { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; margin-top: 2rem; }
.product-features article { padding: 1.75rem; background: white; border: 1px solid #e5e7eb; border-radius: 1rem; }
.product-related-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.product-text-link { color: #c32618; font-size: .875rem; font-weight: 750; }
.product-card { display: flex; flex-direction: column; border: 1px solid #e5e7eb; border-radius: 1rem; overflow: hidden; transition: box-shadow .2s; }
.product-card:hover { box-shadow: 0 10px 25px #11182714; }
.product-card img { aspect-ratio: 3 / 2; width: 100%; height: auto; object-fit: contain; padding: 1rem; background: #f9fafb; }
.product-card > div { padding: 1.5rem; display: flex; flex-direction: column; align-items: start; flex: 1; }
.product-card h3 + p { font-size: .875rem; color: #4b5563; line-height: 1.7; margin: .75rem 0 1rem; }
.product-card .product-text-link { margin-top: auto; }
.product-cta { background: linear-gradient(100deg, rgba(69,10,10,.94), rgba(127,29,29,.88)), url('../../images/MF-240-hero.jpg') center / cover; text-align: center; padding: 4rem 0; color: #fee2e2; }
.product-page .product-cta h2 { color: white; max-width: 55rem; margin-inline: auto; }
.product-cta .product-actions { justify-content: center; margin-top: 1.75rem; }
.product-cta .product-button-secondary { color: white; border-color: #ffffff70; }
.product-page :is(a,button):focus-visible { outline: 3px solid #eab308; outline-offset: 4px; }
.product-page header .group:focus-within > .absolute { display: block; }
.product-page header nav a, .product-page #mobileMenu a { min-height: 40px; align-content: center; }
.product-page #mobileMenu { max-height: calc(100dvh - 64px); overflow-y: auto; }
.product-skip { position: fixed; top: -100px; left: 1rem; z-index: 99999; padding: .75rem 1rem; background: white; color: #b91c1c; border-radius: .5rem; }
.product-skip:focus { top: 1rem; }
.product-image-placeholder { aspect-ratio: 6 / 5; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; color: #1e40af; background: #eff6ff; text-align: center; padding: 1rem; }
.product-image-placeholder strong { font-size: clamp(2rem, 6vw, 4rem); }
@media (max-width: 900px) { .product-overview, .product-description-grid { grid-template-columns: 1fr; gap: 2rem; } .product-figure { max-width: 40rem; width: 100%; margin-inline: auto; } .product-features, .product-related { gap: 1rem; } }
@media (max-width: 640px) { .product-hero { padding-bottom: 2.25rem; } .product-breadcrumbs { margin-bottom: 1.5rem; } .product-features, .product-related { grid-template-columns: 1fr; } .product-actions { flex-direction: column; } .product-button { width: 100%; } .product-section-nav > div { gap: 0; } .product-section-nav a { flex: 1 0 50%; } .product-spec-table th, .product-spec-table td { padding: 1rem .8rem; } .product-advice { padding: 1.5rem; } .product-page footer { overflow-wrap: anywhere; } }
@media (prefers-reduced-motion: reduce) { .product-page, .product-page * { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }