/* Storefront refinements retain Gigantech's petroleum, yellow and blue tokens. */
.main-search { position: relative; overflow: visible; }
.main-search input { border-radius: 9px 0 0 9px; }
.main-search > button { border-radius: 0 9px 9px 0; min-height: 44px; }
.search-suggestions { position: absolute; z-index: 80; top: calc(100% + 8px); left: 0; right: 0; max-height: min(520px, 65vh); overflow-y: auto; background: white; color: var(--ink); border: 1px solid var(--line); border-radius: 12px; padding: 6px; box-shadow: 0 16px 38px #082f4426; }
.search-suggestions[hidden] { display: none; }
.search-option { display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 10px; border-radius: 7px; }
.search-option:hover, .search-option[aria-selected="true"] { background: #eaf2f7; }
.search-option img { width: 48px; height: 48px; object-fit: contain; flex-shrink: 0; background: white; border-radius: 6px; }
.search-option > span { min-width: 0; }
.search-option strong { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .875rem; font-weight: 600; line-height: 1.4; }
.search-option small { display: block; color: var(--muted); margin-top: 3px; font-size: .78rem; }
.header-nav a[aria-current="page"] { color: var(--yellow); }
.category-discovery { margin-top: 32px; }
.category-discovery-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.category-discovery-heading h2 { margin: 0; font-size: 1.35rem; }
.category-discovery .quick-categories { grid-template-columns: repeat(4, minmax(0, 1fr)); padding-top: 18px; gap: 12px; }
.category-discovery .quick-categories a { padding: 17px; min-height: 100px; gap: 14px; flex-direction: row; justify-content: flex-start; }
.category-discovery .quick-categories a > .category-illustration { width: 54px; height: 54px; background: #eaf2f7; border-radius: 15px 15px 7px 15px; }
.category-illustration .icon { width: 30px; height: 30px; stroke-width: 1.5; }
.category-discovery .quick-categories strong { display: block; font-size: .87rem; }
.category-discovery .quick-categories small { display: block; font-size: .75rem; color: var(--muted); margin-top: 3px; }
.category-chevron { margin-left: auto; width: 16px; color: #688391; }
.category-pills { display: flex; gap: 8px; overflow-x: auto; padding: 3px 2px 15px; margin-bottom: 24px; scroll-margin-top: 20px; scrollbar-width: thin; }
.category-pills a { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; min-height: 44px; padding: 10px 15px; border-radius: 30px; border: 1px solid var(--line); background: white; font-size: .8rem; }
.category-pills .icon { width: 18px; height: 18px; }
.category-pills a.active { background: var(--navy); color: white; border-color: var(--navy); }
.filter-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.filter-chips a { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 8px 12px; background: #e7eff4; border: 1px solid #d4e0e8; border-radius: 24px; font-size: .8rem; max-width: 100%; overflow-wrap: anywhere; }
.filter-chips a:hover { background: #dce8f0; }
.filter-chips .icon { width: 17px; height: 17px; }
.product-card { display: flex; flex-direction: column; }
.product-info { flex: 1; display: flex; flex-direction: column; }
.product-info h3 { font-size: .9rem; line-height: 1.5; height: 4.5em; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin-top: 7px; overflow-wrap: anywhere; }
.product-info .product-price { margin-top: auto; }
.product-info .product-brand { font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-height: 1.5em; }
.product-info .stock-note { font-size: .75rem; min-height: 1.5em; line-height: 1.45; }
.product-info .btn-card { min-height: 44px; font-size: .8rem; }
.product-image img { transition: transform .2s ease; }
.product-card:hover .product-image img { transform: scale(1.025); }
.catalog-back { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; }
.catalog-back .icon { width: 18px; }
.photo-open { border: 0; background: white; padding: 0; width: 100%; height: 100%; min-height: 0; position: relative; display: grid; place-items: center; cursor: zoom-in; }
.photo-open img { max-height: 100%; width: 100%; min-height: 0; }
.photo-expand { position: absolute; bottom: 8px; right: 8px; display: inline-flex; gap: 5px; align-items: center; background: #f2f6f8ed; border: 1px solid var(--line); padding: 7px 10px; border-radius: 20px; font-size: .75rem; color: var(--navy); }
.photo-expand .icon { width: 16px; height: 16px; }
.gallery-tip { text-align: center; margin: 12px 0 0; color: var(--muted); font-size: .75rem; }
.thumbnails { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; padding: 4px 2px; }
.thumbnails button { flex-shrink: 0; }
.product-code { display: block; margin-top: 4px; font-size: .75rem; color: var(--muted); }
.product-highlights { padding: 0 0 0 18px; font-size: .875rem; margin: 18px 0 22px; color: #365265; }
.product-highlights li { margin-bottom: 7px; }
.product-highlights strong { font-weight: 600; }
.price-currency { font-size: .8rem; }
.product-contact { display: inline-flex; align-items: center; min-height: 44px; gap: 8px; margin-top: 15px; }
.photo-dialog { border: 0; border-radius: 16px; padding: 18px; width: min(1080px, calc(100vw - 40px)); max-width: none; max-height: calc(100dvh - 40px); color: var(--ink); background: #fff; }
.photo-dialog::backdrop { background: #041925de; }
.photo-dialog-header, .photo-controls { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.photo-dialog-header { margin-bottom: 12px; font-size: .85rem; }
.photo-dialog-header .btn { padding: 10px; }
.photo-stage { height: min(65vh, 700px); overflow: auto; background: white; }
.photo-zoom { padding: 0; margin: 0; border: 0; background: white; width: 100%; height: 100%; display: block; cursor: zoom-in; }
.photo-zoom img { width: 100%; height: 100%; object-fit: contain; }
.photo-stage.zoomed .photo-zoom { width: 200%; height: 200%; cursor: zoom-out; }
.photo-controls { margin-top: 14px; font-size: .8rem; color: var(--muted); text-align: center; }
.photo-controls .btn { padding-inline: 14px; }
body.gallery-open { overflow: hidden; }
@media (max-width: 1100px) { .category-discovery .quick-categories { grid-template-columns: repeat(4, minmax(0, 1fr)); } .category-chevron { display: none; } .category-discovery .quick-categories a { gap: 9px; padding: 12px; } .category-discovery .quick-categories a > .category-illustration { width: 40px; height: 46px; } }
@media (max-width: 800px) { .category-discovery .quick-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); } .category-discovery .quick-categories a { min-height: 83px; padding: 13px; gap: 12px; } .category-discovery .quick-categories strong { font-size: .85rem; } .filters label, .filters legend { font-size: .875rem; } .filters input, .filters select, .main-search input { font-size: 16px; } .filters input, .filters select { min-height: 46px; } .category-pills { margin-bottom: 15px; } }
@media (max-width: 520px) { .category-discovery { margin-top: 24px; } .category-discovery-heading h2 { font-size: 1.2rem; } .category-discovery-heading .text-link { font-size: .75rem; } .category-discovery-heading .icon { display: none; } .category-discovery .quick-categories { gap: 8px; padding-top: 14px; } .category-discovery .quick-categories a { padding: 10px; gap: 9px; min-height: 84px; } .category-discovery .quick-categories strong { font-size: .78rem; } .category-discovery .quick-categories small { font-size: .72rem; } .category-illustration .icon { width: 25px; height: 25px; } .category-discovery .quick-categories a > .category-illustration { width: 36px; height: 42px; } .product-info h3 { font-size: .82rem; height: 4.5em; margin-bottom: 12px; } .product-info .btn-card { font-size: .73rem; } .product-info .stock-note { font-size: .7rem; min-height: 2.9em; } .product-info .product-brand { font-size: .67rem; } .product-image, .catalog-grid .product-image { height: 165px; padding: 14px; } .photo-dialog { width: 100vw; height: 100dvh; max-height: none; margin: 0; border-radius: 0; padding: 16px; } .photo-stage { height: calc(100dvh - 170px); } .photo-dialog-header .btn { min-width: 46px; } .purchase-panel { padding: 22px; } .search-suggestions { max-height: 60dvh; } .search-option strong { font-size: .82rem; } }
@media (prefers-reduced-motion: reduce) { .product-image img { transition: none; } .product-card:hover .product-image img { transform: none; } }
