
.bitwig-hero { padding:76px 0 52px; }
.bitwig-hero h1 { font-size:clamp(64px,9.5vw,142px); line-height:.96; max-width:1100px; }
.bitwig-hero .lead { max-width:590px; font-size:18px; line-height:1.7; color:var(--muted); margin:30px 0 24px; }
.actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 24px; }
.button { display:inline-flex; min-height:48px; justify-content:center; align-items:center; gap:12px; padding:13px 20px; border:1px solid var(--cyan); border-radius:7px; color:var(--bg); background:var(--cyan); font-size:14px; font-weight:650; }
.button:hover { background:#91f7ff; }
.subnav { display:flex; flex-wrap:wrap; gap:12px 28px; padding:16px 0; border-block:1px solid var(--line); }
.subnav a { display:inline-flex; align-items:center; min-height:44px; font-size:14px; color:var(--muted); }
section[id] { scroll-margin-top:24px; }
.section { padding:64px 0; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:28px; }
.section-heading h2 { margin-bottom:0; }
.section-heading p { max-width:470px; color:var(--muted); line-height:1.7; margin:0; font-size:15px; }
.grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.card { min-width:0; display:flex; flex-direction:column; padding:26px; border:1px solid var(--line); border-radius:12px; background:#10111d; }
.card .kind { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:11px; letter-spacing:1px; text-transform:uppercase; }
.free { color:var(--cyan); }
.card h3 { margin:32px 0 12px; font-size:clamp(22px,2.3vw,32px); letter-spacing:-1px; overflow-wrap:anywhere; }
.card p { color:var(--muted); line-height:1.7; font-size:14px; margin:0 0 20px; }
.card .download { border-top:1px solid var(--line); margin-top:auto; padding-top:15px; display:flex; justify-content:space-between; gap:12px; align-items:center; }
.file-size { color:var(--muted); font-size:12px; white-space:nowrap; }
.curve { margin-top:18px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 28px; border:1px solid var(--line); border-radius:12px; }
.curve h3 { margin:8px 0; font-size:24px; font-weight:550; }
.curve p { margin:0; color:var(--muted); font-size:14px; line-height:1.7; }
.tools { border-top:1px solid var(--line); }
.tool-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.tool { background:linear-gradient(145deg,#131725,#10111d); }
.tool h3 { margin-top:24px; }
.tool ul { color:var(--muted); padding-left:20px; font-size:14px; line-height:1.8; margin:0 0 24px; }
.note { margin:24px 0 0; border-left:2px solid var(--pink); padding:8px 0 8px 18px; color:var(--muted); font-size:14px; line-height:1.75; max-width:900px; }
.note strong { color:var(--text); }
.setup { border-top:1px solid var(--line); }
.steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; padding:0; list-style:none; counter-reset:step; }
.steps li { counter-increment:step; min-width:0; }
.steps li::before { content:'0' counter(step); display:block; color:var(--cyan); font-size:12px; letter-spacing:2px; margin-bottom:20px; }
.steps h3 { font-size:20px; font-weight:550; }
.steps p { color:var(--muted); font-size:14px; line-height:1.75; }
code { font-size:.9em; color:var(--text); overflow-wrap:anywhere; }
.disclaimer { color:var(--muted); font-size:12px; line-height:1.7; max-width:900px; }
@media(max-width:900px) { .grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .section-heading { align-items:start; flex-direction:column; } }
@media(max-width:600px) { .bitwig-hero { padding-top:44px; } .bitwig-hero h1 { font-size:clamp(58px,14vw,84px); } .bitwig-hero .lead { font-size:16px; } .section { padding:44px 0; } .grid,.tool-grid,.steps { grid-template-columns:1fr; } .card { padding:22px; } .curve { flex-direction:column; align-items:start; padding:22px; } .actions .button { width:100%; } }

/* Keep the device interfaces readable and fully visible at every width. */
.device-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.device-card { padding:26px; background:linear-gradient(160deg,#151725,#0d0e18); }
.device-card h3 { margin:20px 0; }
.device-shot { position:relative; display:flex; flex-direction:column; justify-content:center; min-width:0; margin:0 0 22px; padding:14px; background:#08090d; border:1px solid #303145; border-radius:9px; overflow:hidden; }
.device-shot img { display:block; width:100%; height:auto; object-fit:contain; border-radius:5px; }
.device-card p { font-size:13px; }
.compact-device { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; align-items:center; column-gap:32px; }
.compact-device h3 { margin:16px 0 10px; }
.compact-device .kind,.compact-device h3,.compact-device p { grid-column:1; }
.compact-device .download { grid-column:2; grid-row:1/4; margin:0; border-top:0; padding:0; }
.device-preview { border-top:1px solid var(--line); }
.kickshaper-shot { max-width:900px; padding:24px; margin-bottom:0; }
@media(max-width:720px) { .device-grid { grid-template-columns:1fr; } .device-card { padding:20px; } .device-shot { padding:8px; } .compact-device { display:flex; align-items:stretch; } .compact-device .download { margin-top:12px; border-top:1px solid var(--line); padding-top:15px; } }
