.ember-why{padding:clamp(64px,9vw,120px) clamp(20px,5vw,80px)}
.ember-why::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 40% at 50% 0%,color-mix(in srgb,var(--e-accent) 16%,transparent),transparent 70%)}
.why-head{text-align:center;max-width:760px;margin:0 auto clamp(48px,7vw,88px)}
.ember-why .why-title{font-size:clamp(28px,4.2vw,56px)}
.ember-why .why-title em{font-style:italic;color:var(--e-accent)}
.why-sub{margin-top:18px;color:var(--e-muted);font-size:clamp(15px,1.3vw,18px)}
.why-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(32px,4.5vw,64px)}
.why-cell{position:relative;--rot:-3deg;--dy:0px;--c:var(--e-accent)}
.why-cell:nth-child(3n+2){--rot:3deg;--dy:32px}
.why-cell:nth-child(3n){--rot:-2deg}
.why-cell:nth-child(6n+2),.why-cell:nth-child(6n+5){--c:color-mix(in srgb,var(--e-accent) 72%,#FF9A3C)}
.why-cell:nth-child(6n+3),.why-cell:nth-child(6n+4){--c:color-mix(in srgb,var(--e-accent) 78%,#8A1204)}
.why-cell:not(:nth-child(3n))::after{content:'';position:absolute;left:100%;top:50%;width:clamp(32px,4.5vw,64px);border-top:2px dashed color-mix(in srgb,var(--e-accent) 45%,transparent)}
.why-card{position:relative;z-index:1;padding:18px;border-radius:28px;background:var(--e-surface);box-shadow:0 30px 60px rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,255,255,.07);transform:translateY(var(--dy)) rotate(var(--rot));transition:transform .6s cubic-bezier(.2,.8,.2,1) var(--d,0ms),opacity .6s var(--d,0ms),box-shadow .4s}
.ember-why.is-ready .why-card{opacity:0;transform:translateY(calc(var(--dy) + 48px)) rotate(var(--rot))}
.ember-why.is-ready .why-card.is-in{opacity:1;transform:translateY(var(--dy)) rotate(var(--rot))}
.ember-why .why-card:hover,.ember-why.is-ready .why-card.is-in:hover{transform:translateY(calc(var(--dy) - 10px)) rotate(0deg);box-shadow:0 36px 70px rgba(0,0,0,.6),0 0 44px color-mix(in srgb,var(--c) 30%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--c) 55%,transparent)}
.why-pin{position:relative;width:64px;height:50px;margin:4px auto 14px}
.why-pin i{position:absolute;border-radius:50%;background:radial-gradient(circle at 32% 28%,color-mix(in srgb,var(--c) 55%,#fff),var(--c) 55%,color-mix(in srgb,var(--c) 60%,#000));box-shadow:0 8px 18px color-mix(in srgb,var(--c) 40%,transparent)}
.why-pin i:first-child{width:44px;height:44px;left:2px;top:0;opacity:.85}
.why-pin i:last-child{width:36px;height:36px;left:20px;top:9px}
.why-panel{border-radius:22px;padding:22px 22px 26px;background:linear-gradient(165deg,color-mix(in srgb,var(--c) 28%,var(--e-surface)),color-mix(in srgb,var(--c) 7%,var(--e-surface)))}
.why-ico{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;margin-bottom:34px;background:color-mix(in srgb,var(--c) 38%,transparent);color:#fff;font-size:20px;line-height:1}
.why-ico i{line-height:1}
.why-ico svg{width:1em;height:1em;fill:currentColor}
.ember-why .why-name{font-size:clamp(16px,1.5vw,20px);margin-bottom:10px;letter-spacing:-.01em}
.why-text{color:color-mix(in srgb,var(--e-ink) 68%,transparent);font-size:14.5px;line-height:1.65}
@media(max-width:1000px){.why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.why-cell::after{display:none}.why-cell:nth-child(3n+2),.why-cell:nth-child(3n){--dy:0px}.why-cell:nth-child(even){--rot:3deg;--dy:24px}.why-cell:nth-child(odd){--rot:-3deg}}
@media(max-width:640px){.why-grid{grid-template-columns:1fr}.why-cell:nth-child(n){--dy:0px;--rot:-1.5deg}.why-cell:nth-child(even){--rot:1.5deg}}
@media(prefers-reduced-motion:reduce){.why-card{transition:none}}