@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@500;600;700&display=swap";
.transformation-page{min-height:100vh}.transform-section{width:min(1180px,100% - 36px);margin:0 auto;padding:120px 0 10vh;position:relative}.section-heading{text-align:center;width:min(820px,100%);margin:0 auto 90px}.section-label,.transform-eyebrow{color:#f6f8ffc7;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff12;border:1px solid #ffffff1f;align-items:center;gap:9px;display:inline-flex}.section-label{letter-spacing:.12em;text-transform:uppercase;border-radius:999px;padding:8px 13px;font-size:12px;font-weight:900}.section-label span{background:var(--mint);width:7px;height:7px;box-shadow:0 0 18px var(--mint);border-radius:999px}.section-heading h1{letter-spacing:-.07em;margin:20px 0 0;font-family:Space Grotesk,sans-serif;font-size:clamp(44px,7vw,92px);line-height:.92}.section-heading p{max-width:700px;color:var(--muted);margin:22px auto 0;font-size:16px;line-height:1.8}.transform-stack{padding-bottom:45vh;display:block;position:relative}.transform-card{-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);transform-origin:top;will-change:transform, opacity;background:linear-gradient(135deg,#ffffff1d,#ffffff0b),#05070dbd;border:1px solid #ffffff1f;border-radius:38px;grid-template-columns:minmax(280px,.95fr) minmax(0,1.05fr);align-items:stretch;gap:28px;min-height:min(680px,100vh - 150px);margin-bottom:clamp(110px,28vh,230px);padding:18px;display:grid;position:sticky;top:clamp(82px,11vh,118px);overflow:hidden;box-shadow:0 34px 100px #00000075,inset 0 1px #ffffff1f}.transform-card:last-child{margin-bottom:0}.transform-card-glow{pointer-events:none;opacity:.9;background:radial-gradient(circle at 20% 20%,#75ffc421,#0000 26rem),radial-gradient(circle at 82% 28%,#72e7ff21,#0000 28rem);position:absolute;inset:-40%}.transform-card:after{content:"";pointer-events:none;border-radius:inherit;transition:transform .9s var(--ease-out);background:linear-gradient(120deg,#0000 0%,#ffffff17 42%,#0000 58%);position:absolute;inset:0;transform:translate(-120%)}.transform-card:hover:after{transform:translate(120%)}.transform-media{z-index:1;background:#111827;border-radius:30px;min-height:430px;position:relative;overflow:hidden}.transform-media img{object-fit:cover;opacity:.82;filter:saturate(1.12)contrast(1.08);width:100%;height:100%;transition:transform .8s var(--ease-out), opacity .4s ease}.transform-card:hover .transform-media img{opacity:.94;transform:scale(1.055)}.media-orb{filter:blur(16px);background:radial-gradient(circle,#75ffc485,#0000 70%);border-radius:50%;width:260px;height:260px;position:absolute;bottom:-100px;right:-100px}.transform-copy{z-index:2;align-self:center;padding:clamp(24px,4vw,54px);position:relative}.transform-eyebrow{color:#f6f8ffc7;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;width:fit-content;padding:9px 13px;font-size:12px;font-weight:900}.transform-copy h3{letter-spacing:-.06em;margin:20px 0 0;font-family:Space Grotesk,sans-serif;font-size:clamp(32px,4.8vw,66px);line-height:.94}.transform-copy p{max-width:620px;color:var(--muted);margin:20px 0 0;font-size:16px;line-height:1.75}.before-after{grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;margin-top:32px;display:grid}.before-after div{background:#ffffff0f;border:1px solid #ffffff1a;border-radius:24px;min-height:122px;padding:18px}.before-after div:last-child{background:#75ffc413;border-color:#75ffc42e}.before-after strong,.before-after span{display:block}.before-after strong{color:var(--mint);margin-bottom:8px}.before-after span{color:var(--soft);font-size:14px;line-height:1.55}@media (max-width:900px){.transform-section{width:min(100% - 28px,720px);padding-top:90px}.section-heading{margin-bottom:58px}.transform-card{border-radius:30px;grid-template-columns:1fr;gap:16px;min-height:auto;margin-bottom:22vh;padding:14px;top:78px}.transform-media{border-radius:24px;min-height:260px}.transform-copy{padding:22px}.before-after{grid-template-columns:1fr}.before-after svg{margin:0 auto;transform:rotate(90deg)}}@media (max-width:560px){.transform-card{top:72px}.transform-media{min-height:220px}.transform-copy h3{font-size:clamp(30px,10vw,44px)}.transform-copy p{font-size:15px}}