/* Overrides layered on the compiled Webflow stylesheet (webflow.css). Keep this small. */
:root { color-scheme: light; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Webflow interaction states that webflow.js used to apply inline */
.hamburger-menu-bar { transition: transform .4s ease; }
.hamburger-menu-wrapper.w--open .hamburger-menu-bar.top { transform: translate3d(0, 5px, 0) rotate(135deg); }
.hamburger-menu-wrapper.w--open .hamburger-menu-bar.bottom { transform: translate3d(0, -4px, 0) rotate(45deg); }
.w-dropdown-toggle .dropdown-arrow { transition: transform .3s; }
.w-dropdown-toggle.w--open .dropdown-arrow { transform: rotate(180deg); }
.w-nav-overlay [data-nav-menu-open] .w-dropdown-list:not(.w--open) { display: none; }
.w-nav-overlay [data-nav-menu-open] .w-dropdown-toggle.w--open { color: var(--accent--primary-1, #ffdd2c); }
.w-dropdown-toggle { cursor: pointer; }
.fade-in { animation: hts-fade-up .6s ease both; }
@keyframes hts-fade-up { from { opacity: 0; transform: translate3d(0, 40px, 0); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .fade-in { animation: none; } .hamburger-menu-bar { transition: none; } }
.cart-open, .cart-open body { overflow: hidden; }

/* Additions not on the Webflow site */
.tax-note { color: var(--neutral--600, #6f7176); font-size: 14px; line-height: 1.4; margin: 12px 0 0; }
.cart-shipping-note { color: var(--neutral--600, #6f7176); font-size: 14px; line-height: 1.4; margin: 0 0 16px; }
.w-form-done, .w-form-fail { display: none; }
.order-summary { text-align: left; max-width: 520px; margin: 0 auto 32px; }
.order-summary h2 { font-size: 20px; margin: 0 0 4px; }
.order-summary .muted { color: var(--neutral--600, #6f7176); margin: 0 0 16px; }
.order-summary .row { display: flex; justify-content: space-between; gap: 16px; padding: 6px 0; }
.order-summary .sep, .order-summary .total { border-top: 1px solid var(--neutral--400, #e2e6eb); margin-top: 8px; padding-top: 12px; }
.order-summary .total { font-weight: 700; font-size: 17px; }
.lightbox { position: fixed; inset: 0; z-index: 2000; background: rgba(0, 0, 0, .9); display: flex; align-items: center; justify-content: center; padding: 48px 16px; }
.lightbox img { max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; border-radius: 8px; }
.lightbox-close { position: absolute; top: 12px; right: 16px; background: none; border: 0; color: #fff; font-size: 40px; line-height: 1; cursor: pointer; }

/* Homepage "Shop all tools" section (kept from the rebuild; not on the Webflow site) */
.section.shop-all { padding-top: 0; padding-bottom: 72px; }
.shop-all-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 32px; }
.shop-all-head .text-link-wrapper { color: var(--secondary--color-1); }
@media screen and (min-width: 992px) { .grid-4-columns.shop-grid.home-shop-grid { grid-template-columns: repeat(4, 1fr); grid-row-gap: 24px; grid-column-gap: 24px; } }
@media screen and (max-width: 767px) { .section.shop-all { padding-bottom: 48px; } .shop-all-head { margin-bottom: 24px; } }

/* SEO: visible listing heading + intro, product FAQ */
.listing-intro { margin-bottom: 40px; }
.listing-intro p { color: var(--neutral--600); max-width: 640px; }
.section.product-faq { padding-top: 0; padding-bottom: 80px; }
.faq-list .faq-item { padding: 20px 0; border-bottom: 1px solid var(--neutral--400); }
.faq-list .faq-item:first-child { padding-top: 0; }
.faq-list .faq-item:last-child { border-bottom: 0; padding-bottom: 0; }
.faq-list p { color: var(--neutral--600); line-height: 1.6; }
@media screen and (max-width: 767px) { .listing-intro { margin-bottom: 28px; } .listing-intro p { font-size: 16px; line-height: 1.6; } .section.product-faq { padding-bottom: 48px; } }

/* Forms: honeypot stays off-screen; Turnstile only takes space when it shows a challenge */
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.turnstile-slot:not(:empty) { margin-top: 12px; }
.footer-newsletter-form .turnstile-slot:not(:empty) { margin: 0 0 12px; }