:root { --bg:#0b0b0d; --accent:#ff453a; --soft:#2a1012; font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Arial,"PingFang SC",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:#f5f5f7; background:radial-gradient(circle at 72% 35%,var(--soft),transparent 42%),var(--bg); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.detail-nav { position:fixed; z-index:10; left:0; right:0; top:0; height:52px; padding:0 max(22px,calc((100vw - 1100px)/2)); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,.1); background:rgba(8,8,10,.62); backdrop-filter:blur(20px); }
.detail-nav b { font-size:14px; }
.detail-brand { display:flex; align-items:center; gap:8px; }
.detail-brand img { width:54px; height:22px; object-fit:contain; }
.detail-nav a { color:#aaaab0; font-size:12px; }
.detail { width:min(1120px,calc(100% - 40px)); min-height:100vh; margin:auto; padding:110px 0 70px; display:grid; grid-template-columns:minmax(320px,560px) 1fr; gap:9vw; align-items:center; }
.detail-cover { position:relative; }
.detail-cover::before { content:""; position:absolute; inset:12% -8% -10%; z-index:-1; background:var(--accent); opacity:.16; filter:blur(60px); border-radius:50%; }
.detail-cover img { display:block; width:100%; border-radius:5px; box-shadow:0 45px 90px rgba(0,0,0,.48); transform:perspective(900px) rotateY(5deg) rotateX(2deg); }
.detail-copy small { color:var(--accent); font-size:11px; font-weight:700; letter-spacing:.16em; }
.detail-copy h1 { margin:18px 0 22px; font-size:clamp(58px,7vw,104px); line-height:.82; letter-spacing:-.065em; text-transform:uppercase; }
.detail-copy p { max-width:440px; color:#aaaab0; font-size:17px; line-height:1.65; }
.tags { margin:30px 0 38px; display:flex; flex-wrap:wrap; gap:8px; }
.tags span { padding:7px 12px; border:1px solid rgba(255,255,255,.18); border-radius:980px; color:#d2d2d7; font-size:10px; }
.detail-actions { display:flex; gap:12px; align-items:center; }
.primary { padding:11px 18px; border-radius:980px; color:#111; background:var(--accent); font-size:13px; font-weight:600; }
.secondary { padding:10px 17px; border:1px solid rgba(255,255,255,.25); border-radius:980px; font-size:13px; }
@media(max-width:760px){ .detail { padding-top:90px; grid-template-columns:1fr; gap:50px; } .detail-cover { max-width:480px; margin:auto; } .detail-copy { text-align:center; } .detail-copy p { margin-left:auto; margin-right:auto; } .tags,.detail-actions { justify-content:center; } }