
.detail-hero {background: radial-gradient(ellipse at 75% 35%,#1a2945, #0a0d16 64%,#08090c);color:white;padding:150px 0 95px;}
.back-link {color:#a9c8ff;text-decoration:none;font-size:13px;font-weight:600;display:inline-block;margin:0 0 60px;}
.back-link:hover {color:white;}
.detail-eyebrow {font-size:11px;letter-spacing:.17em;font-weight:700;color:#8ab2fa;}
.detail-eyebrow span {color:#8c95a6;}
.detail-hero h1 {font-size:clamp(46px,7.6vw,96px);letter-spacing:-.075em;line-height:1.02;margin:18px 0 20px;font-weight:800;}
.detail-hero p {color:#bdc5d2;max-width:760px;font-size:clamp(15px,1.4vw,19px);line-height:1.75;margin:0;}
.detail-tags {display:flex;gap:10px;flex-wrap:wrap;margin-top:32px;}
.detail-tags span {border:1px solid #32405a;background:#162035;padding:9px 13px;border-radius:50px;font-size:10px;letter-spacing:.075em;font-weight:700;color:#cad8ed;}
.detail-feature {margin-top:-48px;position:relative;z-index:2;}
.detail-feature img {width:100%;max-height:590px;display:block;object-fit:cover;object-position:center center;border-radius:22px;box-shadow:0 22px 80px rgba(4,9,28,.22);}
.detail-content {max-width:1000px;padding-top:55px;padding-bottom:100px;}
.detail-block {border-bottom:1px solid #e2e5ec;padding:48px 0;}
.detail-block:last-child {border-bottom:0;}
.detail-block h2 {font-size:clamp(27px,3vw,40px);line-height:1.2;letter-spacing:-.055em;margin:0 0 18px;}
.detail-block h3 {font-size:18px;margin:36px 0 14px;}
.detail-block p {font-size:15px;line-height:1.9;color:#596172;max-width:850px;}
.detail-parts {margin:0;padding-left:23px;display:grid;gap:9px;color:#454d59;font-size:14px;line-height:1.7;}
.wiring-link {display:block;margin:25px 0 26px;border-radius:19px;overflow:hidden;border:1px solid #e2e5ea;background:white;box-shadow:0 9px 35px rgba(14,24,42,.06);}
.wiring-link img {width:100%;height:auto;display:block;}
.pin-table-wrap {overflow-x:auto;}
.pin-table {border-collapse:collapse;min-width:360px;width:min(100%,640px);font-size:14px;border:1px solid #e7e9ee;}
.pin-table caption {text-align:left;font-weight:700;margin-bottom:13px;font-size:15px;}
.pin-table th, .pin-table td {border-bottom:1px solid #e7e9ee;padding:13px 16px;text-align:left;}
.pin-table thead th {background:#eef2fa;color:#28344e;}
.pin-table tbody tr:nth-child(even) {background:#f7f9fc;}
.detail-block .wiring-note {color:#806333;border-left:3px solid #efbc65;background:#fff8ed;padding:16px 19px;border-radius:0 12px 12px 0;font-size:13px;margin-top:22px;}
.detail-row {display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:18px;flex-wrap:wrap;}
.detail-row h2 {margin:0;}
.download-code {background:#0e1728;color:#fff;border-radius:999px;padding:12px 17px;font-size:12px;font-weight:700;text-decoration:none;}
.download-code:hover {background:#1e3a62;}
.code-block {background:#111823;color:#e2eafa;border-radius:20px;overflow:hidden;box-shadow:0 12px 38px rgba(12,17,29,.11);}
.code-toolbar {border-bottom:1px solid #273246;background:#192233;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:12px 20px;color:#acb9cf;font:12px 'Consolas',monospace;}
.copy-code {border:1px solid #43536e;background:transparent;color:#eef5ff;padding:8px 12px;border-radius:9px;font-size:12px;font-weight:600;}
.copy-code:hover {background:#30425e;}
.code-block pre {padding:25px 28px;margin:0;max-height:520px;overflow:auto;tab-size:2;}
.code-block code {font:13px/1.75 'Cascadia Code','Consolas',monospace;white-space:pre;}
.detail-next {padding-bottom:85px;}
.detail-next .button {margin-top:16px;}
@media(max-width:720px){
  .detail-hero{padding:115px 0 82px;}
  .back-link{margin-bottom:44px;}
  .detail-feature{margin-top:-40px;}
  .detail-feature img{border-radius:15px;}
  .detail-content{padding-top:24px;padding-bottom:35px;}
  .detail-block{padding:37px 0;}
  .detail-block h2{font-size:29px;}
  .detail-block p{font-size:14px;}
  .code-block pre{padding:18px 16px;}
  .code-block code{font-size:11px;}
}
