/* 03 what is build theory: floating fellow card (New version only) */
.what-intro.has-card{display:grid;grid-template-columns:minmax(0,1fr) 300px;column-gap:72px;align-items:start}
.what-intro.has-card>*:not(.fcard-wrap){grid-column:1}
.fcard-wrap{grid-column:2;grid-row:1/span 4;align-self:center;position:relative;justify-self:center;width:280px;margin-right:12px}
.fcard-wrap::before{content:"";position:absolute;inset:-14% -22%;z-index:0;background:var(--c02-sun);border-radius:50%;filter:blur(56px);opacity:.55}
.fcard-wrap::after{content:"";position:absolute;left:12%;right:12%;bottom:-36px;height:28px;z-index:0;background:radial-gradient(50% 50% at 50% 50%,rgba(255,119,89,.35),rgba(255,119,89,0));filter:blur(6px);animation:fcShadow 6s var(--ez) infinite}
.fcard{position:relative;z-index:1;display:block;border-radius:22px;overflow:hidden;transform:rotate(4deg);box-shadow:0 0 0 1px rgba(255,150,119,.35),0 2px 0 rgba(255,247,230,.5) inset,0 30px 60px -18px rgba(255,119,89,.55),0 60px 90px -40px rgba(11,11,12,.45);animation:fcFloat 6s var(--ez) infinite}
.fcard img{display:block;width:100%;height:auto}
.fcard::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(125deg,rgba(255,247,230,.18),rgba(255,247,230,0) 38%);pointer-events:none}
@keyframes fcFloat{0%,100%{transform:rotate(4deg) translateY(0)}50%{transform:rotate(3deg) translateY(-12px)}}
@keyframes fcShadow{0%,100%{opacity:1;transform:scaleX(1)}50%{opacity:.6;transform:scaleX(.88)}}
@media (max-width:1100px){.what-intro.has-card{grid-template-columns:minmax(0,1fr) 240px;column-gap:48px}.fcard-wrap{width:230px}}
@media (max-width:860px){.what-intro.has-card{grid-template-columns:1fr}.fcard-wrap{grid-column:1;grid-row:auto;order:99;width:220px;margin:56px auto 24px}}
@media (prefers-reduced-motion:reduce){.fcard,.fcard-wrap::after{animation:none}}
