/* Illustrated format cards, isolated from the other homepage sections. */
.home-page .feature-section{padding:64px 0 44px;background:linear-gradient(180deg,#f7faff,#f2f7fd);border-block:1px solid #e8eff8}
.home-page .feature-section .section-heading{max-width:690px;margin:0 auto 34px}
.home-page .feature-section h2{line-height:1.2;text-wrap:balance}
.home-page .feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.home-page .feature-card{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid #dfe8f3;border-radius:18px;overflow:hidden;box-shadow:0 5px 18px #244b7b04}
.feature-visual{height:190px;position:relative;display:flex;align-items:center;justify-content:center;margin:8px 8px 0;border-radius:12px;background:radial-gradient(ellipse at 50% 85%,#e0efff,#f2f7ff 75%);overflow:hidden}
.feature-card-music .feature-visual{background:radial-gradient(ellipse at 50% 85%,#e9e5ff,#f6f4ff 75%)}
.feature-card-device .feature-visual{background:radial-gradient(ellipse at 50% 85%,#dff2ee,#f0f9f6 75%)}
.home-page .feature-card-copy{padding:25px 24px 28px;position:relative;flex:1}
.home-page .feature-card .feature-icon{display:inline-flex;position:absolute;top:-21px;right:20px;width:42px;height:42px;border:4px solid white;border-radius:12px;margin:0;background:#edf5ff}
.home-page .feature-card-music .feature-icon{color:#8260d5;background:#f2edff}
.home-page .feature-card-device .feature-icon{color:#249580;background:#eaf7f2}
.home-page .feature-card .feature-icon .icon{width:20px;height:20px}
.home-page .feature-card h3{font-size:20px;line-height:1.35;margin:0 0 12px;letter-spacing:-.025em}
.home-page .feature-card p{font-size:15px;line-height:1.8;color:#718099;margin:0}
.home-page .feature-section .format-availability{margin-top:25px;font-size:13px;color:#7b88a2}
.feature-video-window{position:relative;width:202px;height:119px;border:4px solid #fff;border-radius:10px;overflow:hidden;box-shadow:0 10px 20px #254e801a;transform:translate(-7px,-9px) rotate(-4deg)}
.feature-video-window img{width:100%;height:100%;object-fit:cover}
.feature-play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:35px;height:35px;color:#fff;background:#14324b99;border:1px solid #ffffff60;border-radius:50%}
.feature-play svg{width:22px;height:22px}
.feature-resolution{position:absolute;right:7px;bottom:7px;color:white;background:#153149ad;border-radius:4px;padding:1px 5px;font-size:10px;font-weight:600}
.feature-file{position:absolute;bottom:20px;left:50%;transform:translateX(-18%) rotate(3deg);display:flex;align-items:center;gap:10px;padding:10px 13px;background:#fff;border:1px solid #e0e9f4;border-radius:9px;box-shadow:0 5px 12px #264e7910;color:#0874ff;font-size:12px}
.feature-file>.icon{width:19px;height:19px}.feature-file>span{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#e8f8ef;color:#15a965;margin-left:10px}.feature-file>span .icon{width:13px;height:13px}
.feature-audio-window{width:228px;padding:15px 17px;background:#ffffffed;border:1px solid #e5dff5;border-radius:12px;box-shadow:0 9px 20px #53427a0c;transform:rotate(-3deg);position:relative}
.feature-audio-icon{position:absolute;top:-13px;right:14px;display:grid;place-items:center;width:32px;height:32px;border-radius:9px;color:#8864d5;background:#eee7ff;border:3px solid #fff}.feature-audio-icon .icon{width:18px;height:18px}
.feature-waveform{height:59px;display:flex;align-items:center;justify-content:center;gap:5px}.feature-waveform i{display:block;flex:1;max-width:6px;height:var(--bar-height);border-radius:4px;background:#aa8ee9}.feature-waveform i:nth-child(3n){background:#cbb8f3}
.feature-audio-track{height:4px;border-radius:4px;background:#eee8fa;margin-top:9px}.feature-audio-track span{display:block;width:65%;height:100%;border-radius:4px;background:#9b7ade}
.feature-audio-labels{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px;font-size:10px;color:#9484ac}.feature-audio-labels strong{font-size:11px;color:#6b5294;font-weight:600}
.feature-browser-window{width:220px;border:1px solid #d4e8e1;border-radius:10px;background:white;box-shadow:0 9px 20px #2c675710;transform:translate(-8px,-4px) rotate(-3deg);overflow:hidden}
.feature-browser-top{display:flex;align-items:center;gap:13px;padding:10px;background:#f8fcfa;border-bottom:1px solid #e8f2ed}.feature-browser-top>span{display:flex;gap:3px}.feature-browser-top i{display:block;width:4px;height:4px;border-radius:50%;background:#b3cec3}.feature-browser-top>div{background:#eaf3ef;color:#739688;font-size:9px;line-height:1.8;text-align:center;flex:1;border-radius:4px}
.feature-browser-content{display:flex;gap:12px;align-items:center;padding:25px 16px;color:#2ba27f}.feature-browser-content>.icon{width:28px;height:28px}.feature-browser-lines{flex:1}.feature-browser-lines i{display:block;height:5px;background:#dceee6;border-radius:3px}.feature-browser-lines i+i{width:65%;margin-top:8px;background:#ecf5f0}.feature-browser-check{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#e6f7ef}.feature-browser-check .icon{width:14px;height:14px}
.feature-phone{position:absolute;bottom:22px;left:calc(50% + 62px);width:48px;height:82px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:7px 6px;border:3px solid white;border-radius:10px;background:#e3f3ec;box-shadow:0 4px 12px #31685420;transform:rotate(7deg)}.feature-phone>span{width:13px;height:3px;border-radius:3px;background:#a9cfc0}.feature-phone>.icon{background:#31ad81;color:#fff;border-radius:50%;padding:4px;width:24px;height:24px}.feature-phone>i{width:12px;height:2px;background:#b2d8c9;border-radius:2px}
@media(max-width:960px){.home-page .feature-grid{gap:16px}.home-page .feature-card-copy{padding:25px 18px 23px}.home-page .feature-card h3{font-size:18px}.feature-visual{height:170px}.feature-video-window{width:170px;height:105px}.feature-audio-window{width:185px;padding:14px 12px}.feature-waveform{gap:4px}.feature-audio-labels{font-size:8px}.feature-audio-labels strong{font-size:10px}.feature-browser-window{width:175px}.feature-browser-content{padding:25px 12px;gap:8px}.feature-phone{left:calc(50% + 43px);bottom:17px}}
@media(max-width:760px){.home-page .feature-section{padding:44px 0 32px}.home-page .feature-grid{grid-template-columns:1fr;gap:16px}.home-page .feature-card{display:grid;grid-template-columns:210px minmax(0,1fr);align-items:stretch}.feature-visual{height:auto;min-height:180px;margin:7px;border-radius:11px}.home-page .feature-card-copy{align-self:center;padding:25px 24px 25px 16px}.home-page .feature-card .feature-icon{position:static;margin-bottom:12px;border:0;width:34px;height:34px;border-radius:9px}.home-page .feature-card h3{font-size:20px;margin-bottom:8px}.home-page .feature-section .section-heading{margin-bottom:27px}.home-page .feature-card p{font-size:15px}}
@media(max-width:520px){.home-page .feature-card{display:flex}.feature-visual{height:175px;min-height:0;margin:7px 7px 0}.home-page .feature-card-copy{align-self:stretch;padding:23px 22px}.home-page .feature-card .feature-icon{position:absolute;top:-19px;right:18px;margin:0;width:40px;height:40px;border:4px solid white;border-radius:11px}.home-page .feature-card h3{font-size:20px}.feature-video-window{width:200px;height:119px}.feature-audio-window{width:218px;padding:14px 17px}.feature-audio-labels{font-size:10px}.feature-audio-labels strong{font-size:11px}.feature-browser-window{width:210px}.feature-phone{left:calc(50% + 60px);bottom:17px}.home-page .feature-section .format-availability{font-size:12px;margin-top:22px}}