/* A vertical model guide on phones, a side-by-side comparison on larger screens. */
.oxsea-finder{--finder-paper:#f2f3ef;--finder-ink:#161e20;--finder-muted:#56615e;--finder-line:#d6dcd7}
.finder-intro{display:grid;grid-template-columns:.75fr 1.25fr;align-items:center;min-height:clamp(400px,30vw,650px);padding:32px var(--gutter);overflow:hidden;isolation:isolate}
.finder-intro>div{position:relative;z-index:1}
.finder-intro h1{font-size:clamp(54px,6vw,88px);line-height:1.04}
.finder-intro p{font-size:17px;color:var(--muted);max-width:34ch;margin-top:24px}
.finder-range-visual{position:relative;display:block;min-width:0;margin-left:-5vw;margin-right:calc(-1 * var(--gutter))}
.finder-range-visual img{width:100%;height:auto}
/* Blend the studio floor and lighting into the hero without cropping the equipment. */
.finder-range-visual::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--bg),transparent 18%,transparent 92%,var(--bg)),linear-gradient(180deg,var(--bg),transparent 16%,transparent 84%,var(--bg))}
.finder-nav,.finder-cards{display:none}
.finder-desktop{padding:42px var(--gutter) 0}
.finder-table{min-width:0;table-layout:fixed}
.finder-table th,.finder-table td{padding:22px clamp(14px,2vw,32px);font-size:14px;overflow-wrap:anywhere;border-color:var(--finder-line)}
.finder-table thead th{width:28%;padding-top:0}
.finder-table thead th:first-child{width:16%;padding-left:0;padding-top:28px;font-size:18px}
.finder-table thead img{height:clamp(150px,18vw,280px);object-fit:contain}
.finder-table h2{font-size:34px}
.finder-table thead p{font-size:14px;line-height:1.6;color:var(--finder-muted);min-height:45px;max-width:24ch;margin-bottom:12px}
.finder-table .text-link{min-height:44px}
.finder-table tbody th{font-size:13px;color:var(--finder-muted);padding-left:0}
.finder-table td strong{font-size:28px}
.finder-table .button{font-size:12px;min-height:48px;padding:12px 16px;text-align:center}
.finder-tax{display:block;color:var(--finder-muted);font-size:12px}
.finder-guidance{padding:28px var(--gutter) 72px}
.finder-notice{font-size:13px;color:var(--finder-muted);max-width:85ch;margin-bottom:24px}
.finder-details{border-top:1px solid var(--finder-line)}
.finder-details summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:54px;cursor:pointer;font-size:14px;font-weight:600;list-style:none}
.finder-details summary::-webkit-details-marker{display:none}
.finder-details summary::marker{content:''}
.finder-details summary .icon{width:18px;height:18px}
.finder-details[open] summary .icon{transform:rotate(45deg)}
.finder-safety{border-bottom:1px solid var(--finder-line)}
.finder-safety p{font-size:14px;color:var(--finder-muted);margin:0 0 12px}
.finder-safety .text-link{font-size:14px;min-height:44px;margin-bottom:24px}
.finder-advice{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:40px;margin-top:40px;background:#e6eae3}
.finder-advice h2{font-size:36px}
.finder-advice p{font-size:15px;color:var(--finder-muted);margin-top:12px;max-width:40ch}
.finder-advice .button{flex-shrink:0}
.oxsea-finder :is(a,summary):focus-visible,.finder-card:focus-visible{outline:3px solid #676b00;outline-offset:4px}
.finder-nav a:focus-visible{outline-color:var(--accent);outline-offset:-4px}

@media(max-width:900px){
    .finder-intro{display:block;min-height:0;padding:28px 24px 16px;max-width:634px;margin-inline:auto}
    .finder-intro h1{font-size:clamp(38px,8vw,56px);letter-spacing:-.055em}
    .finder-intro p{font-size:14px;line-height:1.6;max-width:35ch;margin-top:14px}
    .finder-range-visual{display:none}
    .finder-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:sticky;top:0;z-index:20;gap:8px;padding:12px max(16px,calc((100% - 602px)/2));background:var(--bg);border-bottom:1px solid var(--line)}
    .finder-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:54px;padding:5px 8px;border:1px solid #ffffff40;border-radius:4px;font-size:14px;font-weight:700;line-height:1.5}
    .finder-nav a span{font-size:11px;font-weight:400;color:#bac1bf}
    .finder-nav a:active{background:var(--accent);color:var(--bg)}
    .finder-nav a:active span{color:var(--bg)}
    .finder-cards{display:grid;gap:20px;padding:20px 16px 32px;max-width:634px;margin-inline:auto}
    .finder-card{min-width:0;padding:24px;background:var(--finder-paper);color:var(--finder-ink);border-radius:6px;scroll-margin-top:0}
    .finder-card-heading{margin-bottom:18px}
    .finder-card-heading h2{font-size:32px;letter-spacing:-.05em}
    .finder-card-heading p{font-size:14px;line-height:1.6;color:var(--finder-muted);margin-top:8px;max-width:none}
    .finder-card-heading img{width:100%;height:auto;aspect-ratio:600/464;max-height:280px;margin-top:16px;object-fit:contain;mix-blend-mode:multiply}
    .finder-highlights{display:grid;grid-template-columns:.85fr 1.15fr;margin:0 0 20px;padding:18px 0;border-block:1px solid var(--finder-line)}
    .finder-highlights>div+div{padding-left:18px;border-left:1px solid var(--finder-line)}
    .finder-highlights dt{font-size:11px;font-weight:500;color:var(--finder-muted)}
    .finder-highlights dd{margin:6px 0 0;font-size:30px;line-height:1.3;letter-spacing:-.045em;font-weight:600}
    .finder-highlights dd span{display:block;font-size:11px;font-weight:400;letter-spacing:0;margin-bottom:2px}
    .finder-highlights>div:first-child dd{margin-top:22px}
    .finder-highlights dd small{font-size:17px;letter-spacing:0}
    .finder-specs{margin:0}
    .finder-specs>div{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:18px;padding-bottom:16px;font-size:13px;line-height:1.65}
    .finder-specs dt{color:var(--finder-muted)}
    .finder-specs dd{margin:0;font-weight:600;overflow-wrap:anywhere}
    .finder-details .finder-specs{padding-top:6px}
    .finder-purchase{border-top:1px solid var(--finder-line);padding-top:20px}
    .finder-purchase p{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;margin-bottom:14px}
    .finder-purchase p>span{font-size:13px;color:var(--finder-muted)}
    .finder-purchase strong{font-size:25px;font-weight:600;letter-spacing:-.04em}
    .finder-purchase small{font-size:10px;font-weight:400;letter-spacing:0;white-space:nowrap}
    .finder-purchase .button{width:100%;justify-content:space-between;min-height:52px;padding:14px 18px;font-size:14px}
    .finder-packs{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:14px;padding:16px;background:#e6eae3;border-radius:3px}
    .finder-packs>span{display:grid;gap:3px;font-size:14px}
    .finder-packs strong{font-size:13px;font-weight:600}
    .finder-packs small{font-size:11px;color:var(--finder-muted)}
    .finder-packs .icon{width:20px;height:20px}
    .finder-card-note{font-size:11px;line-height:1.6;color:var(--finder-muted);margin-top:16px}
    .finder-desktop{display:none}
    .finder-guidance{padding:28px 24px 40px}
    .finder-guidance>*{max-width:586px;margin-inline:auto}
    .finder-notice{font-size:12px}
    .finder-advice{display:block;padding:24px;margin-top:28px}
    .finder-advice h2{font-size:32px}
    .finder-advice .button{width:100%;justify-content:space-between;margin-top:24px}
}

@media(max-width:360px){
    .finder-intro{padding-inline:20px}
    .finder-cards{padding-inline:12px}
    .finder-card{padding:20px}
    .finder-card-heading h2{font-size:29px}
    .finder-highlights>div+div{padding-left:14px}
    .finder-specs>div{gap:14px}
    .finder-guidance{padding-inline:20px}
}

@media(hover:hover){
    .finder-nav a:hover{border-color:var(--accent)}
    .finder-packs:hover{background:#dce2d7}
}

@media print{
    .finder-nav,.finder-cards{display:none}
    .finder-desktop{display:block}
}
