/**
 * C Sharp Recording Studio — brand tokens (olive + lime from logo)
 */
:root {
    --cs-bg: #f4f6ef;
    --cs-text: #1a2314;
    --cs-muted: #5a6354;
    --cs-line: #dce5d4;
    --cs-lime: #c8d456;
    --cs-lime-soft: #dde9a4;
    --cs-olive: #5a6b40;
    --cs-olive-dark: #3d4a2c;
    /* Aliases used across hero / components */
    --cs-cyan: var(--cs-lime);
    --cs-purple: var(--cs-olive);
    /* For rgba(..., alpha) in hero + UI */
    --cs-rgb-lime: 200, 212, 86;
    --cs-rgb-olive: 90, 107, 64;
    /* Voice / spectrum texture for primary buttons (EQ bars + soft wave line) */
    --cs-btn-sound-texture: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='48' viewBox='0 0 200 48'%3E%3Cg fill='%23fff' opacity='.1'%3E%3Crect x='2' y='30' width='3' height='14' rx='1.5'/%3E%3Crect x='18' y='22' width='3' height='22' rx='1.5'/%3E%3Crect x='34' y='26' width='3' height='18' rx='1.5'/%3E%3Crect x='50' y='14' width='3' height='30' rx='1.5'/%3E%3Crect x='66' y='24' width='3' height='20' rx='1.5'/%3E%3Crect x='82' y='18' width='3' height='26' rx='1.5'/%3E%3Crect x='98' y='28' width='3' height='16' rx='1.5'/%3E%3Crect x='114' y='20' width='3' height='24' rx='1.5'/%3E%3Crect x='130' y='26' width='3' height='18' rx='1.5'/%3E%3Crect x='146' y='12' width='3' height='32' rx='1.5'/%3E%3Crect x='162' y='24' width='3' height='20' rx='1.5'/%3E%3Crect x='178' y='28' width='3' height='16' rx='1.5'/%3E%3C/g%3E%3Cpath fill='none' stroke='%23fff' stroke-width='0.85' opacity='.09' d='M0 36c22-11 42 9 64 0s42-9 64 0 40 9 60 0'/%3E%3C/svg%3E");
}

/* Multi-layer (texture + gradient) on header button */
@keyframes csVoiceWaveDrift {
    0% { background-position: 0 50%, 0 0; }
    100% { background-position: -200px 50%, 0 0; }
}

/* Single texture layer on hero CTA fill */
@keyframes csVoiceWaveDriftTex {
    0% { background-position: 0 50%; }
    100% { background-position: -200px 50%; }
}

@keyframes csBtnSoundShimmer {
    0%, 100% { background-position: -80% 0; opacity: 0.18; }
    45% { background-position: 180% 0; opacity: 0.34; }
}