/* Features page hero showcase only (features.html #fx-hero). Palette: navy, ivory, gold. */
#fx-hero.fx-show{max-width:1180px;margin:0 auto;padding:64px 6% 56px;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center;position:relative;z-index:1;text-align:left}
#fx-hero.fx-show::after{content:"";position:absolute;left:6%;right:6%;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(177,138,74,.55),transparent)}
#fx-hero .fx-eyebrow{font-family:var(--sans,Inter,system-ui,sans-serif);font-size:.72rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#8F6E36;margin:0 0 18px;line-height:1.7}
#fx-hero .fx-eyebrow::before{content:"";display:inline-block;vertical-align:middle;width:28px;height:1px;margin:0 12px 2px 0;background:#B18A4A}
#fx-hero .fx-title{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:clamp(2.3rem,4.4vw,3.6rem);line-height:1.04;letter-spacing:-.01em;color:#20243A;margin:0 0 18px}
#fx-hero .fx-title em{font-style:italic;color:#B18A4A}
#fx-hero .fx-sub{font-size:1.06rem;line-height:1.65;color:#4A4E63;margin:0 0 28px;max-width:34em}
#fx-hero .fx-points{list-style:none;margin:0;padding:0;border-top:1px solid rgba(177,138,74,.35)}
#fx-hero .fx-points li{padding:14px 0 14px 26px;border-bottom:1px solid rgba(177,138,74,.22);position:relative}
#fx-hero .fx-points li::before{content:"";position:absolute;left:2px;top:21px;width:7px;height:7px;border:1px solid #B18A4A;transform:rotate(45deg)}
#fx-hero .fx-points strong{display:block;font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:1.22rem;color:#20243A;line-height:1.25}
#fx-hero .fx-points span{display:block;font-size:.93rem;line-height:1.55;color:#5A5E72;margin-top:2px}
#fx-hero .fx-devices{position:relative;padding:0 6% 48px 0}
#fx-hero .fx-devices::before{content:"";position:absolute;inset:8% -4% 2% 8%;background:radial-gradient(closest-side,rgba(227,200,145,.38),transparent);z-index:-1}
#fx-hero figure{margin:0}
#fx-hero .fx-laptop{position:relative}
#fx-hero .fx-screen{background:#151A33;padding:12px 12px 14px;border-radius:14px 14px 4px 4px;box-shadow:0 30px 60px -20px rgba(21,26,51,.45),0 0 0 1px rgba(227,200,145,.35) inset}
#fx-hero .fx-screen img{display:block;width:100%;height:auto;border-radius:3px}
#fx-hero .fx-base{height:14px;margin:0 -7%;background:linear-gradient(#E9E4DA,#C9C2B4);border-radius:0 0 14px 14px;box-shadow:0 14px 24px -12px rgba(21,26,51,.35);position:relative}
#fx-hero .fx-base::before{content:"";position:absolute;left:50%;top:0;width:16%;height:5px;transform:translateX(-50%);background:#B9B1A2;border-radius:0 0 6px 6px}
#fx-hero .fx-phone{position:absolute;right:0;bottom:0;width:24%;min-width:118px;background:#151A33;padding:7px;border-radius:26px;box-shadow:0 26px 50px -16px rgba(21,26,51,.55),0 0 0 1px rgba(227,200,145,.45) inset}
#fx-hero .fx-phone img{display:block;width:100%;height:auto;border-radius:20px}
@media(prefers-reduced-motion:no-preference){
#fx-hero .fx-copy>*{animation:fxUp .9s cubic-bezier(.2,.7,.2,1) both}
#fx-hero .fx-copy>:nth-child(2){animation-delay:.08s}#fx-hero .fx-copy>:nth-child(3){animation-delay:.16s}#fx-hero .fx-copy>:nth-child(4){animation-delay:.24s}
#fx-hero .fx-laptop{animation:fxUp 1s .1s cubic-bezier(.2,.7,.2,1) both}
#fx-hero .fx-phone{animation:fxUp 1s .3s cubic-bezier(.2,.7,.2,1) both}
}
@keyframes fxUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:900px){#fx-hero.fx-show{grid-template-columns:1fr;gap:40px}#fx-hero .fx-devices{max-width:640px;width:100%;margin:0 auto}}
@media(max-width:700px){#fx-hero.fx-show{padding:32px 6% 40px}#fx-hero .fx-eyebrow{letter-spacing:.18em}#fx-hero.fx-show{gap:0}#fx-hero .fx-copy{display:contents}#fx-hero .fx-eyebrow{order:1}#fx-hero .fx-title{order:2;margin-bottom:26px}#fx-hero .fx-devices{order:3;margin-bottom:30px}#fx-hero .fx-sub{order:4}#fx-hero .fx-points{order:5}#fx-hero .fx-devices{padding:0 4% 36px 0}#fx-hero .fx-phone{width:30%;min-width:0;border-radius:18px;padding:5px}#fx-hero .fx-phone img{border-radius:14px}#fx-hero .fx-screen{padding:7px 7px 8px;border-radius:10px 10px 3px 3px}#fx-hero .fx-base{height:9px}}

/* Features page, intro row: classical sheet-music collage in the empty band above the copy (decorative, out of flow so the copy, button and newts keep their places) */
.hero-media .fx-music{position:absolute;left:0;bottom:calc(100% + 26px);width:min(100%,640px);height:clamp(150px,14vw,174px);pointer-events:none}
.hero-media .fx-sheet-wrap{position:absolute;left:0;bottom:0;width:72%;transform:rotate(-1.6deg);filter:drop-shadow(0 16px 22px rgba(21,26,51,.13)) drop-shadow(0 2px 3px rgba(21,26,51,.07))}
.hero-media .fx-sheet{position:relative;background:linear-gradient(160deg,#FFFCF5 0%,#FAF4E6 60%,#F4ECD9 100%);padding:12px 18px 10px;clip-path:polygon(0.00% 0.29%,4.17% 0.14%,8.33% 0.59%,12.50% 0.07%,16.67% 0.48%,20.83% 0.33%,25.00% 0.05%,29.17% 0.46%,33.33% 0.03%,37.50% 0.39%,41.67% 0.06%,45.83% 0.08%,50.00% 0.38%,54.17% 0.74%,58.33% 0.11%,62.50% 0.20%,66.67% 0.56%,70.83% 0.85%,75.00% 0.52%,79.17% 0.36%,83.33% 0.88%,87.50% 0.04%,91.67% 0.77%,95.83% 0.26%,100.00% 0.13%,99.92% 4.17%,99.78% 8.33%,99.43% 12.50%,99.87% 16.67%,99.59% 20.83%,99.55% 25.00%,99.74% 29.17%,99.62% 33.33%,99.96% 37.50%,99.96% 41.67%,99.86% 45.83%,99.52% 50.00%,99.70% 54.17%,99.78% 58.33%,99.59% 62.50%,99.68% 66.67%,99.79% 70.83%,99.44% 75.00%,99.51% 79.17%,99.83% 83.33%,99.60% 87.50%,99.63% 91.67%,99.39% 95.83%,99.49% 100.00%,95.83% 99.74%,91.67% 99.12%,87.50% 99.89%,83.33% 99.62%,79.17% 99.32%,75.00% 99.86%,70.83% 99.56%,66.67% 99.96%,62.50% 99.40%,58.33% 99.31%,54.17% 99.48%,50.00% 99.21%,45.83% 99.72%,41.67% 99.37%,37.50% 99.47%,33.33% 99.48%,29.17% 99.59%,25.00% 99.24%,20.83% 99.15%,16.67% 99.57%,12.50% 99.40%,8.33% 99.95%,4.17% 99.37%,0.00% 99.42%,0.70% 95.83%,0.58% 91.67%,0.20% 87.50%,0.27% 83.33%,0.47% 79.17%,0.02% 75.00%,0.32% 70.83%,0.12% 66.67%,0.08% 62.50%,0.04% 58.33%,0.54% 54.17%,0.09% 50.00%,0.17% 45.83%,0.27% 41.67%,0.61% 37.50%,0.06% 33.33%,0.31% 29.17%,0.38% 25.00%,0.62% 20.83%,0.57% 16.67%,0.60% 12.50%,0.19% 8.33%,0.29% 4.17%)}
.hero-media .fx-sheet::before{content:"";position:absolute;inset:6px;border:1px solid rgba(177,138,74,.5);pointer-events:none}
.hero-media .fx-sheet::after{content:"";position:absolute;inset:9px;border:1px solid rgba(177,138,74,.2);pointer-events:none}
.hero-media .fx-sheet img{display:block;width:100%;height:auto;opacity:.72}
.hero-media .fx-journal{position:absolute;right:0;top:0;width:32%;height:88%;box-sizing:border-box;padding:16px 14px 12px 56px;transform:rotate(3.2deg);background:#FCF8EF repeating-linear-gradient(transparent 0 21px,rgba(32,36,58,.085) 21px 22px);background-position:0 36px;border:1px solid rgba(177,138,74,.35);border-radius:2px;box-shadow:0 12px 22px -10px rgba(21,26,51,.18);font-family:"Cormorant Garamond",Georgia,serif;color:#3A3F57;text-align:left;overflow:hidden}
.hero-media .fx-journal::before{content:"";position:absolute;left:46px;top:0;bottom:0;width:1px;background:rgba(177,138,74,.45)}
.hero-media .fx-j-date{margin:0 0 5px;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:#8F6E36;font-family:var(--sans,Inter,system-ui,sans-serif);font-weight:600}
.hero-media .fx-j-line{margin:0;font-style:italic;font-size:.98rem;line-height:22px}
@media(prefers-reduced-motion:no-preference){
.hero-media .fx-sheet-wrap{animation:fxSheet 1.4s .2s cubic-bezier(.2,.7,.2,1) both}
.hero-media .fx-journal{animation:fxCard 1.4s .45s cubic-bezier(.2,.7,.2,1) both}
}
@keyframes fxSheet{from{opacity:0;transform:translateY(14px) rotate(-2.6deg)}to{opacity:1;transform:rotate(-1.6deg)}}
@keyframes fxCard{from{opacity:0;transform:translateY(14px) rotate(5deg)}to{opacity:1;transform:rotate(3.2deg)}}
@media(max-width:1000px) and (min-width:701px){.hero-media .fx-journal{display:none}.hero-media .fx-sheet-wrap{width:100%}}
@media(max-width:700px){.hero-media .fx-music{position:relative;left:auto;bottom:auto;width:min(94%,360px);height:118px;margin:150px auto 22px}.hero-media .fx-journal{display:none!important}.hero-media .fx-sheet-wrap{width:100%}.hero-media .fx-sheet{padding:8px 10px 6px}.hero-media .fx-sheet::before{inset:4px}.hero-media .fx-sheet::after{inset:6px}.hero-media .fx-journal{width:42%;height:66%;padding:10px 8px 8px 34px;background-image:repeating-linear-gradient(transparent 0 16px,rgba(32,36,58,.085) 16px 17px);background-position:0 26px}.hero-media .fx-journal::before{left:26px}.hero-media .fx-j-date{font-size:.5rem;margin-bottom:3px}.hero-media .fx-j-line{font-size:.76rem;line-height:17px}}