.audio-section { padding-top: 70px; padding-bottom: 70px; }.audio-section-inner { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; border: 1px solid #f1e9ec; border-radius: 26px; background: linear-gradient(125deg,#fff 45%,#fff6f7); padding: 50px; }.audio-section h2 { font-size: clamp(28px,3vw,39px); line-height: 1.4; letter-spacing: -.055em; margin: 12px 0 20px; }.audio-section-copy>p:not(.eyebrow) { color: #738095; font-size: 15px; line-height: 1.9; }.audio-benefits { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 0 0; list-style: none; }.audio-benefits li { font-size: 12px; color: #57677e; border: 1px solid #edeff3; border-radius: 30px; padding: 7px 12px; background: white; }.audio-section-copy .audio-availability { font-size: 11px; margin-top: 16px; color: #909aac; }
.audio-example { margin: 0; position: relative; min-width: 0; }.audio-example figcaption { text-align: center; color: #8d97a8; font-size: 11px; margin-top: 16px; }.audio-motion { position: absolute; opacity: 0; width: 1px; height: 1px; }.audio-motion-label { display: grid; place-items: center; position: absolute; right: 14px; top: 13px; width: 26px; height: 26px; border: 1px solid #edf0f4; border-radius: 50%; background: white; color: #8d97a8; cursor: pointer; z-index: 1; }.audio-motion-label svg { width: 11px; height: 11px; }.audio-motion:focus-visible+.audio-motion-label { outline: 2px solid #ff6979; outline-offset: 3px; }.audio-canvas { border: 1px solid #e9edf2; border-radius: 18px; background: #fff; padding: 25px; box-shadow: 0 15px 40px #13243b06; min-height: 310px; box-sizing: border-box; }.audio-canvas-header { display: flex; gap: 7px; align-items: center; font-size: 11px; letter-spacing: .06em; color: #9aa5b5; }.audio-canvas-header i { width: 5px; height: 5px; background: #ff6c7d; border-radius: 50%; }.audio-file-chip { display: flex; gap: 12px; align-items: center; margin-top: 26px; padding: 15px; border-radius: 12px; border: 1px solid #f0e6e8; background: #fff8f9; animation: audio-file-arrive 18s infinite; }.audio-file-chip svg { color: #ff6779; width: 27px; height: 30px; flex-shrink: 0; }.audio-file-chip strong { font-size: 13px; color: #304057; }.audio-file-chip small { display: block; margin-top: 3px; color: #98a1af; font-size: 11px; }.audio-wave { display: flex; gap: 4px; height: 27px; align-items: center; margin-left: auto; }.audio-wave b { width: 3px; height: 20px; border-radius: 2px; background: #ff8795; animation: audio-wave 900ms ease-in-out infinite alternate; }.audio-wave b:nth-child(2n){animation-delay:-250ms;height:12px}.audio-wave b:nth-child(3n){animation-delay:-500ms;height:25px}.audio-progress { height: 3px; margin: 16px 0 19px; border-radius: 3px; overflow: hidden; background: #f2f3f6; }.audio-progress span { display: block; height: 100%; width: 100%; background: #ff6b7b; transform-origin: left; animation: audio-transcribe 18s linear infinite; }.audio-timeline { display: grid; gap: 14px; }.audio-timeline p { margin: 0; display: grid; grid-template-columns: 44px 1fr; gap: 12px; font-size: 12px; color: #65748a; line-height: 1.75; animation: audio-lines 18s infinite; }.audio-timeline p:nth-child(2) { animation-delay:150ms; }.audio-timeline p:nth-child(3) { animation-delay:300ms; }.audio-timeline time { font-size: 10px; font-variant-numeric: tabular-nums; color: #ed7b8b; padding-top: 2px; }.audio-timeline p:first-child { color: #33465e; }.audio-motion:not(:checked)~.audio-canvas * { animation-play-state: paused; }
@keyframes audio-file-arrive {0%,4%{opacity:0;transform:translateY(-10px)}10%,94%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes audio-transcribe {0%,12%{transform:scaleX(0)}45%,94%{transform:scaleX(1)}100%{transform:scaleX(0)}}
@keyframes audio-lines {0%,36%{opacity:.12;transform:translateY(4px)}50%,94%{opacity:1;transform:translateY(0)}100%{opacity:.12;transform:translateY(0)}}
@keyframes audio-wave {from{transform:scaleY(.3)}to{transform:scaleY(1)}}
@media(max-width:850px){.audio-section-inner{gap:28px;padding:28px;grid-template-columns:1fr}.audio-section{padding-top:35px;padding-bottom:35px}.audio-section-copy>p:not(.eyebrow){font-size:14px}.audio-canvas{padding:22px}.audio-section h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){.audio-canvas *{animation:none!important;opacity:1!important;transform:none!important}.audio-motion-label{display:none}}

.audio-hero-link { display:inline-block; font-size:12px; color:#a06f7a; margin-top:14px; }