/* November Figma revisions. Keep text and controls live while using the original artwork. */
/* Keep the full hero height and its paragraph breathing room. The logo sheet
   starts directly below it and scrolls with every following section. */
.hero-stage{padding-bottom:0}
.page-content{margin-top:0}

.intro-grid h2{max-width:770px;text-wrap:balance}
.intro-grid{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);column-gap:10.6vw}
.comparison-labels button{opacity:.26}
.comparison-labels button[aria-pressed="true"]{opacity:1}
.after-view .service{position:relative;isolation:isolate;overflow:hidden;background:#f2f3e9 var(--service-surface) center/cover no-repeat;font-weight:400}
.service>span{position:relative;z-index:1}
.service .service-metal-icon{position:absolute;left:var(--icon-left);top:50%;width:var(--icon-width);height:auto;max-width:none;transform:translateY(-50%);pointer-events:none}
.service-media{--service-surface:url('assets/comparison/background-media.svg');--icon-left:71.14%;--icon-width:20.92%}
.service-strategy{--service-surface:url('assets/comparison/background-strategy.svg');--icon-left:73.18%;--icon-width:19.31%}
.service-dashboards{--service-surface:url('assets/comparison/background-dashboards.svg');--icon-left:73.76%;--icon-width:17.5%}
.service-concepts{--service-surface:url('assets/comparison/background-concepts.svg');--icon-left:73.76%;--icon-width:17.5%}
.service-static{--service-surface:url('assets/comparison/background-static.svg');--icon-left:72.89%;--icon-width:17.5%}
.service-motion{--service-surface:url('assets/comparison/background-motion.svg');--icon-left:66.76%;--icon-width:26.82%}
.service-landing{--service-surface:url('assets/comparison/background-landing.svg');--icon-left:69.68%;--icon-width:23.65%}
.service-cro{--service-surface:url('assets/comparison/background-cro.svg');--icon-left:74.05%;--icon-width:16.62%}

.founder{align-items:start}
.founder-intro{display:flex;flex-direction:column;justify-content:flex-start;min-height:0;gap:0;align-self:start;padding-top:0}
.founder-credit{margin:1.8vw 0 0}
.founder-portrait{width:12.4vw;height:12.4vw;max-width:238px;max-height:238px;margin:2.2vw 0 0;border-radius:.89vw}

.offers .eyebrow{font-size:clamp(13px,1.05vw,20px);font-weight:400;line-height:1.2;margin-bottom:clamp(16px,1.25vw,24px)}

.working{position:relative;isolation:isolate;overflow:hidden}
.working .chat-grid{position:relative;isolation:isolate}
.working .chat-column{position:relative;z-index:1}
.working .chat-column:last-child{isolation:isolate}
.slack-ambient{position:absolute;z-index:-1;pointer-events:none;width:205%;aspect-ratio:1;left:-54%;top:50%;background:url('assets/figma/slack-lime-glow.svg') center/contain no-repeat;transform:translate3d(0,-50%,0);animation:slack-ambient-drift 7.5s ease-in-out infinite alternate;will-change:transform}
@keyframes slack-ambient-drift{from{transform:translate3d(-3%,-52%,0) scale(.96)}to{transform:translate3d(3%,-47%,0) scale(1.045)}}
.motion-paused .slack-ambient{animation-play-state:paused}

.testimonials{background:#f2f3e9;padding-block:clamp(64px,4.3vw,90px) clamp(70px,6.3vw,125px)}
.testimonial-heading{margin-bottom:clamp(42px,4.1vw,79px)}
.testimonial-heading h2{max-width:570px;width:100%;text-wrap:balance}
.clutch-rating{margin-top:1.3vw;font-size:var(--body)}
.testimonial-track{--testimonial-card-width:29.0867vw;--testimonial-gap:2.1196vw;padding-block:0}
.testimonial-set .testimonial{background:#fff;border-radius:clamp(10px,.75vw,15px);min-height:clamp(350px,32.98vw,635px);padding:2.2vw}
.testimonial .quote-mark{width:2.58vw;height:auto;margin-bottom:2.7vw}
.testimonial .quote-heading{font-size:clamp(21px,1.6845vw,33px);line-height:1.2;margin-bottom:1.1em}
.testimonial blockquote{font-size:clamp(17px,1.3102vw,26px);line-height:1.25;margin-bottom:1.6em}
.testimonial figcaption strong,.testimonial figcaption small{font-size:clamp(16px,1.3102vw,26px);line-height:1.25;font-weight:400}
.testimonial figcaption strong{margin-bottom:0}
@media(max-width:1100px){
 .intro-grid{column-gap:6vw}
 .testimonial-track{--testimonial-card-width:38vw;--testimonial-gap:22px}
 .testimonial-set .testimonial{padding:28px;min-height:370px}
 .testimonial .quote-mark{width:32px;margin-bottom:30px}
}
@media(max-width:800px){
 .intro-grid{grid-template-columns:1fr;gap:28px}
 .founder-intro{display:flex;align-items:flex-start;padding-top:0;gap:0}
 .founder-credit{margin:24px 0 0}
 .founder-portrait{width:150px;height:150px;border-radius:11px;margin:26px 0 0}
 .slack-ambient{width:180%;left:-40%;top:52%}
 .testimonial-track{--testimonial-card-width:60vw}
 .clutch-rating{margin-top:22px}
}
@media(max-width:560px){
 .intro-grid h2{font-size:34px;line-height:1.25}
 .service .service-metal-icon{left:auto;right:7%;width:25%;max-height:65%;object-fit:contain}
 .service-motion .service-metal-icon,.service-landing .service-metal-icon{width:29%}
 .founder-portrait{width:136px;height:136px;margin-top:24px}
 .testimonial-track{--testimonial-card-width:78vw;--testimonial-gap:18px}
 .testimonial-set .testimonial{padding:25px;min-height:360px}
 .testimonial-heading h2{font-size:32px}
 .testimonial .quote-heading{font-size:22px}
 .testimonial blockquote{font-size:17px}
}
@media(prefers-reduced-motion:reduce){.slack-ambient{animation:none;will-change:auto}}

/* Blur only the CTA surface so its label and arrow stay crisp. */
.button,.button.lime,.text-link{position:relative;isolation:isolate;overflow:visible;user-select:none;transition:color .25s ease,border-color .25s ease}
.button,.button.lime{background:transparent}
.button{--cta-fill:#111}
.button.lime{--cta-fill:var(--lime)}
.button::before,.text-link::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background:var(--cta-fill,#111);filter:blur(0);transition:background-color .25s ease,filter .25s ease,opacity .25s ease}
.text-link::before{inset:-5px -16px;border-radius:999px;background:#e2b0f4;opacity:0}
.button:is(:hover,:focus-visible,:active),.button.lime:is(:hover,:focus-visible,:active){background:transparent;color:#000;transform:none}
.text-link:is(:hover,:focus-visible,:active){color:#000;border-bottom-color:transparent;gap:22px}
.button:is(:hover,:focus-visible,:active)::before,.text-link:is(:hover,:focus-visible,:active)::before{background:#e2b0f4;filter:blur(5px);opacity:1}
@media(prefers-reduced-motion:reduce){.button,.text-link,.button::before,.text-link::before{transition:none}}