body { padding-top:0; }
.site-header { position:sticky; }
.detail-nav { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; min-height:76px; }
.detail-brand { display:flex; align-items:center; gap:.65rem; color:var(--black); font-family:var(--font-display); font-weight:800; text-decoration:none; }
.detail-brand img { width:42px; height:42px; object-fit:contain; }
.detail-links { display:flex; align-items:center; gap:1.25rem; flex-wrap:wrap; }
.detail-links a { color:var(--ink); text-decoration:none; font-size:.9rem; font-weight:600; }
.detail-links a:hover, .detail-links a:focus-visible { color:var(--orange-deep); text-decoration:underline; }
.detail-hero { background:var(--surface); padding:clamp(3rem,7vw,6rem) 0; }
.detail-crumb { display:flex; gap:.5rem; flex-wrap:wrap; color:var(--muted); font-size:.85rem; margin-bottom:1.5rem; }
.detail-crumb a { color:var(--orange-deep); }
.detail-hero-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); gap:clamp(2rem,5vw,5rem); align-items:center; }
.detail-hero h1 { font-family:var(--font-display); font-size:clamp(2rem,4vw,3.7rem); line-height:1.12; letter-spacing:-.035em; max-width:16ch; margin:.5rem 0 1rem; }
.detail-hero p { color:var(--muted); line-height:1.75; max-width:64ch; }
.detail-hero img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius-lg); }
.detail-actions { display:flex; gap:.75rem; flex-wrap:wrap; margin-top:1.75rem; }
.detail-layout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(250px,.5fr); gap:clamp(2rem,6vw,6rem); }
.detail-content h2 { font-family:var(--font-display); font-size:clamp(1.5rem,2.5vw,2rem); line-height:1.2; margin:2.5rem 0 1rem; }
.detail-content h2:first-child { margin-top:0; }
.detail-content p, .detail-content li { color:var(--muted); line-height:1.75; }
.detail-content p + p { margin-top:.85rem; }
.detail-content ul, .detail-content ol { padding-left:1.25rem; display:grid; gap:.55rem; }
.detail-aside { align-self:start; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem; }
.detail-aside h2 { font-family:var(--font-display); font-size:1.2rem; margin-bottom:.75rem; }
.detail-aside p { color:var(--muted); line-height:1.65; margin-bottom:1.25rem; }
.detail-aside a { display:block; margin:.75rem 0; color:var(--orange-deep); font-weight:700; }
.detail-faq { background:var(--surface); }
.detail-faq h2, .detail-related h2 { font-family:var(--font-display); font-size:clamp(1.5rem,2.5vw,2rem); margin-bottom:1.5rem; }
.detail-faq-list { display:grid; gap:1rem; }
.detail-faq-list article { background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:1.25rem 1.5rem; }
.detail-faq-list h3 { font-size:1rem; margin-bottom:.5rem; }
.detail-faq-list p { color:var(--muted); line-height:1.7; }
.detail-related-links { display:flex; flex-wrap:wrap; gap:.75rem; }
.detail-related-links a { border:1px solid var(--line); border-radius:var(--radius); padding:.85rem 1rem; color:var(--ink); text-decoration:none; font-weight:700; }
.detail-related-links a:hover, .detail-related-links a:focus-visible { border-color:var(--orange-deep); color:var(--orange-deep); }
.detail-footer { background:var(--black); color:var(--white); padding:2rem 0; }
.detail-footer .container { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.detail-footer a { color:var(--white); }
@media (max-width:800px) { .detail-hero-grid, .detail-layout { grid-template-columns:1fr; } .detail-hero h1 { max-width:none; } }
@media (max-width:480px) { .detail-links { gap:.75rem; } .detail-links a { font-size:.82rem; } .detail-hero img { aspect-ratio:3/2; } }
