.device-showcase { padding-bottom:36px; scroll-margin-top:90px; }
.device-showcase .section-head { max-width:900px; margin-bottom:36px; }
.device-showcase .section-head h2 { font-size:clamp(30px,4vw,48px); }
.device-showcase .section-head p { font-size:16px; }
.device-color-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.device-color-card { display:block; width:100%; min-width:0; padding:0; overflow:hidden; border:1px solid var(--line); border-radius:20px; background:var(--card); color:var(--ink); cursor:pointer; font-family:var(--body); text-align:left; transition:border-color .2s,box-shadow .2s; }
.device-color-card:hover { border-color:var(--orange); box-shadow:0 12px 30px rgba(23,17,13,.08); }
.device-color-card:focus-visible { outline:3px solid var(--orange); outline-offset:4px; }
.device-color-visual { display:block; aspect-ratio:1; overflow:hidden; background:#e1dfe1; }
.device-color-visual img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.device-color-label { display:flex; align-items:center; gap:10px; padding:18px 20px; font-size:15px; font-weight:700; }
.device-color-dot { width:13px; height:13px; flex-shrink:0; border:1px solid rgba(23,17,13,.05); border-radius:50%; }
.device-color-dot.color-silver { background:#bfc1c5; }
.device-color-dot.color-pink { background:#e5a7b7; }
.device-specs-title { font-size:25px; font-weight:700; margin-bottom:18px; }
.device-specs .specs { gap:12px; }
.device-specs .spec { border-radius:14px; padding:18px; }
.device-specs .spec .sv { font-size:23px; letter-spacing:-.6px; }
.device-specs .spec .sl { font-size:12px; font-weight:400; margin-top:6px; }
.device-specs-note { margin-top:14px; font-size:11px; color:var(--muted); }
.device-cat-feature { display:grid; grid-template-columns:1fr 1fr; margin-top:40px; border-radius:24px; overflow:hidden; background:#eae5dc; }
.device-cat-copy { align-self:center; padding:50px; }
.device-cat-copy h2 { font-size:clamp(30px,3.5vw,44px); line-height:1.12; letter-spacing:-1px; }
.device-cat-copy p { margin:24px 0 30px; color:var(--muted); font-size:16px; }
.device-cat-feature > img { display:block; width:100%; height:100%; aspect-ratio:1; object-fit:cover; object-position:center; }
@media(max-width:900px) { .device-specs .specs { grid-template-columns:repeat(2,minmax(0,1fr)); } .device-color-grid { gap:18px; } .device-cat-copy { padding:28px; } }
@media(max-width:600px) { .device-color-grid { grid-template-columns:1fr; gap:20px; } .device-color-visual { aspect-ratio:1; } .device-showcase .section-head p { font-size:14px; } .device-specs .spec { padding:14px; } .device-specs .spec .sv { font-size:18px; } .device-specs-title { font-size:22px; } .device-cat-feature { grid-template-columns:1fr; margin-top:30px; } .device-cat-copy { padding:32px 24px; } .device-cat-copy h2 { font-size:30px; } .device-cat-copy p { font-size:14px; margin:18px 0 24px; } }