@import url('../bluetooth-earphones/true-wireless-earbuds.css?v=3');

/* Kezon silicone scraper and brush page */
.tws-hero { background: #f4f5ef; }
html.js #main-content > .tws-hero { opacity: 1; transform: none; }
.product-gallery { background: var(--color-primary); }
.product-gallery__main figcaption { background: linear-gradient(0deg, rgba(51,51,51,.78), transparent); }
.product-gallery__thumbs button:hover, .product-gallery__thumbs button:focus-visible { border-color: #aeb295; }
.product-gallery__thumbs button > span { background: linear-gradient(0deg, rgba(51,51,51,.82), transparent); }
.tws-hero .button--outline { border-color: var(--color-primary); color: var(--color-primary); }
.tws-hero .button--outline:hover { color: #fff; background: var(--color-primary); }
.card-anchor, .clickable-grid > a { display: block; color: inherit; text-decoration: none; }
.earbud-card.card-anchor > div { gap: 0; }
.earbud-card.card-anchor span { display: block; margin-top: auto; color: var(--color-primary); font-size: .86rem; font-weight: 800; }
.clickable-grid > a { padding: 25px; border-radius: var(--radius-medium); background: var(--color-soft); transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.clickable-grid > a:hover { background: #eceee2; box-shadow: var(--shadow); transform: translateY(-4px); }
.clickable-grid > a h3 { margin-bottom: 10px; }
.clickable-grid > a p { margin: 0; color: var(--color-muted); font-size: .93rem; }
.risk-reduction { background: #333; }
.risk-reduction .split-layout p:not(.eyebrow), .six-grid--light a p { color: #f0f1e9; }
.six-grid--light > a { background: rgba(255,255,255,.10); }
.six-grid--light > a:hover { background: rgba(255,255,255,.17); box-shadow: none; }
.six-grid--light > a h3 { color: #fff; }
.comparison-section { background: #5e6346; }
.comparison-section .image-heading > div > p:last-child { color: #f0f1e9; }
.comparison-section .six-grid--light > a { min-height: 160px; }
.process-timeline { grid-template-columns: repeat(6, 1fr); }
.process-timeline h3 { margin: 0 0 8px; font-size: 1rem; }
#customization-process .image-heading { grid-template-columns: minmax(420px, .9fr) minmax(0, 1.1fr); gap: 46px; align-items: center; }
#customization-process .image-heading > div { min-width: 0; }
#customization-process .image-heading h2 { font-size: clamp(2.25rem, 3vw, 3.25rem); overflow-wrap: anywhere; }
.quality-section .mini-grid { grid-template-columns: repeat(2, 1fr); }
.use-case-grid > a { position: relative; padding-left: 75px; }
.use-case-grid > a::before { position: absolute; top: 23px; left: 21px; display: grid; width: 36px; height: 36px; place-items: center; border-radius: 50%; color: var(--color-primary); background: #e5e7d9; content: '•'; font-size: 1.25rem; font-weight: 900; }
.chooser .choose-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 22px 0; counter-reset: choose; }
.chooser .choose-list > a { position: relative; min-height: 0; padding: 14px 12px 14px 51px; box-shadow: none; counter-increment: choose; }
.chooser .choose-list > a::before { position: absolute; top: 14px; left: 16px; color: var(--color-primary); content: counter(choose, decimal-leading-zero); font-size: .8rem; font-weight: 900; }
.chooser .choose-list h3 { margin: 0 0 4px; font-size: .9rem; }
.chooser .choose-list span { color: var(--color-muted); font-size: .8rem; line-height: 1.38; }
.final-inquiry__overlay { background: rgba(51,51,51,.76); }
.final-inquiry__copy > p:not(.eyebrow) { color: #f0f1e9; }
.final-inquiry__form .form-status { min-height: 20px; margin: 0; color: var(--color-primary); font-size: .85rem; font-weight: 700; }
.final-inquiry__contact { display: grid; gap: 5px; margin: 22px 0 0; padding: 0; color: #f0f1e9; list-style: none; font-size: .86rem; }
.final-inquiry__contact a { color: #fff; font-weight: 800; }
.hero-points, .check-list, .contact-list { display: grid; gap: 8px; margin: 22px 0; padding: 0; list-style: none; }
.hero-points li, .check-list li { position: relative; padding-left: 22px; color: var(--color-muted); font-size: .92rem; }
.hero-points li::before, .check-list li::before { position: absolute; top: 0; left: 0; color: var(--color-primary); content: '✓'; font-weight: 900; }
.check-list--light { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 30px 0 0; }
.check-list--light li { color: #f0f1e9; }
.check-list--light li::before { color: #d9ddbd; }
.contact-list li { color: var(--color-muted); font-size: .92rem; }
.contact-list a { color: var(--color-primary); font-weight: 800; }
.table-wrap { overflow-x: auto; margin-top: 32px; border: 1px solid var(--color-line); border-radius: var(--radius-medium); background: #fff; }
.table-wrap table { width: 100%; min-width: 620px; border-collapse: collapse; }
.table-wrap th, .table-wrap td { padding: 15px 18px; border-bottom: 1px solid var(--color-line); text-align: left; vertical-align: top; font-size: .92rem; line-height: 1.45; }
.table-wrap th { color: #fff; background: var(--color-primary); font-weight: 800; }
.table-wrap td:first-child { width: 31%; color: var(--color-text); font-weight: 800; }
.table-wrap tbody tr:last-child td { border-bottom: 0; }
.table-wrap--dark { border-color: rgba(255,255,255,.22); background: transparent; }
.table-wrap--dark th { background: rgba(255,255,255,.15); }
.table-wrap--dark td { border-color: rgba(255,255,255,.18); color: #f0f1e9; }
.table-wrap--dark td:first-child { color: #fff; }
.chooser .choose-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 22px 0; padding: 0; list-style: none; counter-reset: choose; }
.chooser .choose-list > li { position: relative; min-height: 0; padding: 14px 12px 14px 51px; border-radius: var(--radius-medium); background: var(--color-soft); box-shadow: none; counter-increment: choose; }
.chooser .choose-list > li::before { position: absolute; top: 14px; left: 16px; color: var(--color-primary); content: counter(choose, decimal-leading-zero); font-size: .8rem; font-weight: 900; }
.chooser .choose-list h3 { margin: 0 0 4px; font-size: .9rem; }
.chooser .choose-list span { color: var(--color-muted); font-size: .8rem; line-height: 1.38; }

@media (max-width: 1020px) { .process-timeline { grid-template-columns: repeat(3, 1fr); } #customization-process .image-heading { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } }
@media (max-width: 760px) { .process-timeline, .quality-section .mini-grid, .chooser .choose-list, .check-list--light { grid-template-columns: 1fr; } }