.device-group-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:9px; margin:32px 0 42px; }
.device-group-link { padding:13px 18px; border:1px solid var(--line); border-radius:12px; font-weight:650; background:#f4f7fc; touch-action:manipulation; }
.device-group-link:hover { background:#eaf1ff; border-color:#94b1ed; }
.device-model-section { margin-bottom:38px; scroll-margin-top:90px; }
.device-model-section h2 { font-size:27px; margin-bottom:18px; letter-spacing:-.025em; }
.device-model-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.device-model-link { min-width:0; position:relative; padding:22px 38px 22px 22px; border:1px solid var(--line); border-radius:14px; display:grid; gap:9px; touch-action:manipulation; }
.device-model-link:hover { background:#f7faff; border-color:#9bb4ee; }
.device-model-link strong { font-size:19px; line-height:1.3; text-wrap:balance; }
.device-model-link > span:not(.device-link-arrow) { font-size:13px; color:var(--muted); overflow-wrap:anywhere; }
.device-link-arrow { position:absolute; right:17px; top:22px; color:var(--blue); }
.device-group-link:focus-visible,.device-model-link:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
.device-model-intro { padding:42px 0 32px; }
.device-model-intro h1 { max-width:1000px; scroll-margin-top:90px; }
.device-model-codes { margin-top:16px; color:var(--muted); }
.device-service-note { margin-top:12px; }
@media(max-width:760px) { .device-model-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; } .device-model-link { padding:17px 26px 17px 14px; } .device-model-link strong { font-size:16px; } .device-link-arrow { right:10px; top:17px; } .device-group-link { font-size:14px; padding:12px; } .device-model-intro { padding:28px 0; } .device-model-intro h1 { font-size:clamp(31px,7.4vw,47px); } }
@media(max-width:400px) { .device-model-list { grid-template-columns:1fr; } }
.device-model-link--image { align-content:start; padding:14px 18px 22px; text-align:center; }
.device-product-image { display:block; width:100%; height:210px; object-fit:contain; transform:scale(var(--device-scale,1)); }
.device-model-link--image .device-link-arrow { top:auto; bottom:24px; }
.device-model-intro--image { display:grid; grid-template-columns:minmax(0,1fr) 320px; align-items:center; gap:24px; }
.device-model-intro--image > .device-product-image { height:290px; }
.device-intro-copy { min-width:0; }
@media(max-width:760px) { .device-model-intro--image { grid-template-columns:minmax(0,1fr) 125px; gap:10px; } .device-model-intro--image > .device-product-image { height:170px; } .device-model-link--image .device-product-image { height:180px; } }
.device-search { max-width:650px; margin:28px auto 0; }
.device-search label { display:block; margin-bottom:9px; font-weight:650; font-size:15px; }
.device-search-field { display:flex; align-items:center; gap:12px; padding:0 16px; border:1px solid var(--line); border-radius:12px; background:#f7faff; color:var(--muted); }
.device-search-field:focus-within { outline:2px solid var(--blue); outline-offset:2px; }
.device-search-field svg { flex:none; width:20px; height:20px; }
.device-search input { width:100%; min-width:0; min-height:50px; border:0; background:transparent; color:var(--ink); font:inherit; font-size:16px; outline:none; }
.device-search input::placeholder { color:var(--muted); }
.device-search-status { margin-top:9px; color:var(--muted); font-size:14px; }
.device-search-status:empty { display:none; }
.device-model-section[hidden],.device-model-link[hidden] { display:none; }
.device-group-link[aria-current="true"] { background:var(--blue); color:white; border-color:var(--blue); }
@media(max-width:760px) {
 .device-search { margin-top:22px; }
 .device-search ~ .device-group-nav { margin:20px 0 26px; gap:7px; }
 .device-model-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
 .device-model-link { padding:14px 12px; }
 .device-model-link--image { padding:10px 10px 14px; gap:6px; }
 .device-model-link--image .device-product-image { height:120px; }
 .device-model-link strong { font-size:15px; line-height:1.25; }
 .device-model-link > span:not(.device-link-arrow) { font-size:11px; }
 .device-model-link .device-link-arrow { display:none; }
 .device-model-section h2 { font-size:23px; margin-bottom:13px; }
}
.device-group-nav[hidden] { display:none; }
@media(max-width:760px) {
 .iphone-main:has(.device-search) .iphone-intro { padding-top:24px; }
 .iphone-main:has(.device-search) .iphone-intro h1 { font-size:35px; }
 .iphone-main:has(.device-search) .iphone-intro p { margin-top:12px; font-size:14px; }
}
