/* Stronger contrast and motion across the agency page. */
body{color:#202126}
.site-header.scrolled{background:#ffffffed;box-shadow:0 7px 28px #19243a12}
.main-nav>a{color:#3d4149}
.main-nav>a:hover{color:#1d65d9}

.hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:radial-gradient(ellipse 63% 63% at 50% 22%,#dceaff 0%,#edf4ff 48%,#fff 100%);
}
.hero::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:16%;right:16%;top:0;
  height:520px;
  border-radius:50%;
  background:radial-gradient(ellipse at center,#b8d7ff99 0%,#d8e9ff5e 43%,transparent 72%);
  filter:blur(38px);
  transform:translate3d(-4%,0,0) scale(1);
  animation:hero-glow-drift 11s ease-in-out infinite alternate;
  pointer-events:none;
}
.hero::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:linear-gradient(90deg,#ffffff00 0%,#ffffff7d 49%,#ffffff00 100%);
  transform:translateX(-130%);
  animation:hero-light-sweep 12s ease-in-out 1.4s infinite;
  pointer-events:none;
}
.hero-inner{position:relative;z-index:1}
.hero h1{color:#171d2a;font-weight:650;text-shadow:0 1px 0 #fff8}
.hero .hero-description{color:#4d586a;font-size:19px;font-weight:440;line-height:1.57}
.hero-capture{border-color:#bdcde4;box-shadow:0 15px 38px #3164a126,0 3px 9px #1a355e0d;transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease}
.hero-capture:focus-within{transform:translateY(-2px);border-color:#6da6f4;box-shadow:0 20px 46px #3164a13b,0 0 0 4px #79aafa26}
.hero small{color:#58677a}
.hero .trust-label{color:#505967;font-weight:620}
.trust-dock{box-shadow:inset 0 1px #ffffff2e,0 22px 46px #0b122e36}
@keyframes hero-glow-drift{to{transform:translate3d(6%,8%,0) scale(1.16)}}
@keyframes hero-light-sweep{0%,36%{transform:translateX(-130%)}65%,100%{transform:translateX(130%)}}

.section-intro h2,.stories h2,.goals h2,.faq h2,.final-cta h2{color:#1a202a;font-weight:640}
.section-intro p,.stories>p,.goals .section-shell>p,.final-cta p{color:#515a68}
.eyebrow{color:#2865c8;font-weight:680;letter-spacing:.03em}
.eyebrow::before{width:29px;height:2px;background:#4c8ef3}
.proof-stat{border-color:#d7e5fb;box-shadow:0 12px 30px #3673c51e}
.proof-stat strong{color:#152037;font-weight:680}
.proof-stat span{color:#4b5665;font-weight:520}
.metric{box-shadow:0 18px 42px #1d4a8b17}
.metric:hover{box-shadow:0 26px 56px #1d4a8b2c}
.metric p{color:#555d6a}
.scale-bottom .text-link{color:#215fc5;font-weight:680;text-decoration:none;transition:color .2s ease,transform .2s ease}
.scale-bottom .text-link:hover{color:#0d429b;transform:translateY(-2px)}

.how{border-top:1px solid #e3eaf4}
.section-intro.large h2{font-size:clamp(44px,4.8vw,64px)}
.step-copy h3{color:#1d2533;font-weight:640}
.step-copy p{color:#525f72;font-size:17px}
.step-kicker{color:#2d6bd5;font-weight:750}
.step-visual{
  position:relative;
  isolation:isolate;
  height:338px;
  overflow:hidden;
  border:1px solid #d8e7fa;
  border-radius:28px;
  background:linear-gradient(140deg,#dfeeff 0%,#edf6ff 55%,#f8fbff 100%);
  box-shadow:inset 0 1px #fff,0 22px 47px #184e981c;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease,border-color .45s ease;
}
.step-visual::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background-image:linear-gradient(#8ab7ef19 1px,transparent 1px),linear-gradient(90deg,#8ab7ef19 1px,transparent 1px);
  background-size:28px 28px;
  mask-image:radial-gradient(ellipse at center,#000 10%,transparent 78%);
  pointer-events:none;
}
.step-visual::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:260px;height:260px;
  right:-85px;top:-95px;
  border-radius:50%;
  background:#a9ceff70;
  filter:blur(30px);
  animation:visual-orbit 7s ease-in-out infinite alternate;
  pointer-events:none;
}
.step-visual:hover{transform:translateY(-7px) scale(1.012);border-color:#b8d6f8;box-shadow:inset 0 1px #fff,0 31px 60px #184e9830}
.visual-brief{mask-image:none;padding:70px 54px;background:linear-gradient(140deg,#e3f0ff,#f7fbff)}
.visual-brief::before{z-index:0}
.visual-brief::after{z-index:0}
.visual-brief>*{position:relative;z-index:1}
.visual-brief .site-input{width:min(370px,100%);padding:21px 23px;border-color:#cbdcf3;border-radius:17px;box-shadow:0 17px 38px #174d9324;color:#1c2533;font-weight:620;animation:brief-float 5s ease-in-out infinite alternate}
.visual-brief .muted-small{color:#536982;font-size:13px;font-weight:540}
.visual-brief .green-pill{display:inline-block;padding:7px 12px;box-shadow:0 5px 15px #11a45635;animation:status-pulse 2.8s ease-in-out infinite}
.visual-tag{color:#41608b;font-weight:720}
.casting-card,.workflow-card,.learning-card{width:min(368px,100%);border-color:#cadbf1;border-radius:20px;box-shadow:0 23px 46px #174d932d}
.step-visual.in-view :is(.casting-card,.workflow-card,.learning-card){animation:panel-appear .85s ease-out both}
.casting-card strong,.learning-card strong{color:#1b2b44}
.casting-bars i{background:linear-gradient(90deg,#83b5fc,#c9dfff);transform-origin:left}
.step-visual.in-view .casting-bars i{animation:casting-fill .9s cubic-bezier(.2,.8,.2,1) both}
.step-visual.in-view .casting-bars i:nth-child(2){animation-delay:.13s}
.step-visual.in-view .casting-bars i:nth-child(3){animation-delay:.25s}
.workflow-card>div{transition:background-color .25s ease,transform .25s ease}
.workflow-card>div:hover{transform:translateX(4px);background:#f3f8ff}
.workflow-card b{color:#3676d9}
.workflow-card em{background:#dcf7e9;color:#16834c}
.learning-sparkline i{background:linear-gradient(#4f96fb,#bcd8ff);transform-origin:bottom}
.step-visual.in-view .learning-sparkline i{animation:learning-pulse 2.6s ease-in-out infinite alternate}
.learning-sparkline i:nth-child(2n){animation-delay:-1.3s}
.learning-sparkline i:nth-child(3n){animation-delay:-.7s}
@keyframes visual-orbit{to{transform:translate(-36px,28px) scale(1.2)}}
@keyframes brief-float{to{transform:translateY(-7px)}}
@keyframes status-pulse{50%{box-shadow:0 6px 21px #11a45669}}
@keyframes panel-appear{from{opacity:0;filter:blur(7px)}to{opacity:1;filter:blur(0)}}
@keyframes casting-fill{from{transform:scaleX(.18)}to{transform:scaleX(1)}}
@keyframes learning-pulse{from{transform:scaleY(.68);filter:brightness(.93)}to{transform:scaleY(1);filter:brightness(1.1)}}

.stories{border-color:#e3eaf4}
.use-case-grid{gap:24px}
.use-case-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:440px;
  border:1px solid #d8e7fa;
  border-radius:27px;
  background:linear-gradient(135deg,#eaf4ff,#f8fbff 75%);
  box-shadow:0 19px 42px #204e8918;
  transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease,border-color .4s ease;
}
.use-case-card:nth-child(2){background:linear-gradient(135deg,#eef0ff,#fbfaff 78%);border-color:#dfe3f8}
.use-case-card::before{content:"";position:absolute;z-index:-1;width:250px;height:250px;top:-95px;right:-75px;border-radius:50%;background:#bddcff99;filter:blur(22px);transition:transform .5s ease}
.use-case-card:nth-child(2)::before{background:#d9d5ff99}
.use-case-card:hover{transform:translateY(-8px);border-color:#b9d7fa;box-shadow:0 30px 58px #204e892d}
.use-case-card:hover::before{transform:translate(-30px,20px) scale(1.25)}
.use-case-top img{width:62px;height:62px;padding:10px;border-color:#cfe0f8;border-radius:17px;box-shadow:0 8px 20px #24599f17;transition:transform .4s cubic-bezier(.2,1.2,.3,1),box-shadow .4s ease}
.use-case-card:hover .use-case-top img{transform:translateY(-4px) rotate(-7deg) scale(1.06);box-shadow:0 14px 25px #24599f2d}
.use-case-top span{color:#406397;font-weight:750}
.use-case-card h3{color:#1d293b;font-weight:650}
.use-case-card p,.use-case-card ul{color:#4c5a6d}
.use-case-card li::before{color:#2671df}
.use-case-card>a{color:#175bc2;text-underline-offset:4px}
.use-case-card>a:hover{text-decoration:underline}

.goals{background:radial-gradient(ellipse 68% 70% at 50% 45%,#e5f0ff 0%,#f3f8ff 56%,#fff 100%)}
.goal-tabs{border-color:#d9e5f5;box-shadow:0 10px 25px #234f8416}
.goal-tabs button{transition:background-color .25s ease,color .25s ease,transform .25s ease,box-shadow .25s ease}
.goal-tabs button:hover{transform:translateY(-2px)}
.goal-tabs button.active{background:#172b4c;box-shadow:0 5px 13px #17396631}
.goal-panel{border-color:#d5e2f3;box-shadow:0 29px 68px #214e8f24}
.goal-left h3{color:#1d2839;font-weight:660}
.goal-left>p,.goal-left ul{color:#516075}
.goal-right{background:linear-gradient(145deg,#e7f1ff,#dcecff)}
.goal-visual-row{border-color:#cfdef3;box-shadow:0 7px 15px #1e52851a;transition:transform .25s ease,box-shadow .25s ease}
.goal-visual-row:hover{transform:translateX(5px);box-shadow:0 11px 21px #1e52852b}
.goal-panel.in-view .goal-visual-row{animation:goal-row-in .65s cubic-bezier(.2,.8,.2,1) both}
.goal-panel.in-view .goal-visual-row:nth-child(3){animation-delay:.12s}
.goal-panel.in-view .goal-visual-row:nth-child(4){animation-delay:.24s}
.goal-visual-row i{background:#33b975;animation:goal-dot 2.7s ease-in-out infinite}
@keyframes goal-row-in{from{opacity:0;filter:blur(5px)}to{opacity:1;filter:blur(0)}}
@keyframes goal-dot{50%{box-shadow:0 0 0 7px #47c98a26}}

.faq-list{max-width:870px}
.faq-list details{margin:10px 0;padding:0 23px;border:1px solid #e2e9f3;border-radius:16px;background:#fff;box-shadow:0 5px 15px #2049780b;transition:border-color .25s ease,background-color .25s ease,box-shadow .25s ease}
.faq-list details:hover{border-color:#bed5f5;box-shadow:0 10px 23px #20497819}
.faq-list details[open]{border-color:#c6dbf8;background:#f4f9ff;box-shadow:0 14px 28px #20497818}
.faq-list summary{padding:20px 0;color:#293342;font-weight:640}
.faq-list summary::after{display:grid;place-items:center;float:right;width:28px;height:28px;margin-top:-3px;border-radius:50%;background:#edf4ff;color:#3978d9;font-size:20px;line-height:1;transition:transform .25s ease,background-color .25s ease}
.faq-list details[open] summary::after{background:#dbeaff;transform:rotate(180deg)}
.faq-list p{margin:0;padding:0 0 20px;color:#546174}

.final-cta{isolation:isolate;background:radial-gradient(ellipse 64% 75% at 50% 23%,#d1e5ff 0%,#e9f3ff 53%,#fff 100%)}
.final-cta::before{content:"";position:absolute;z-index:-1;left:18%;right:18%;top:-110px;height:410px;border-radius:50%;background:#9dc7ff63;filter:blur(55px);animation:final-glow 9s ease-in-out infinite alternate;pointer-events:none}
.final-cta h2{color:#182438;font-weight:670}
.final-cta p{color:#4b5b70}
.final-cta form{border-color:#bbd2ef;box-shadow:0 19px 43px #24589e30;transition:transform .25s ease,box-shadow .25s ease}
.final-cta form:focus-within{transform:translateY(-3px);box-shadow:0 25px 53px #24589e42}
.twinkle-field i{width:5px;height:5px;background:#5e9df8}
@keyframes final-glow{to{transform:translateY(24px) scale(1.12)}}

.footer{background:#f2f6fc}
.footer h3{color:#24344e;font-weight:680}
.footer-top a:not(.button){color:#526177;transition:color .2s ease}
.footer-top a:not(.button):hover{color:#1c64ce}

.reveal{opacity:0;filter:blur(5px);transform:translateY(36px);transition:opacity .8s ease,filter .8s ease,transform .8s cubic-bezier(.17,.85,.22,1);transition-delay:var(--reveal-delay)}
.reveal.in-view{opacity:1;filter:blur(0);transform:translateY(0)}
.metric.reveal.in-view:hover,.use-case-card.reveal.in-view:hover{transform:translateY(-8px)}
.step-visual.reveal.in-view:hover{transform:translateY(-7px) scale(1.012)}

@media(max-width:800px){
  .hero h1{font-weight:640}
  .hero .hero-description{font-size:17px}
  .step-visual{height:292px}
  .use-case-card{min-height:390px}
  .goal-visual-row:hover{transform:none}
}
@media(max-width:520px){
  .hero{overflow:hidden}
  .hero h1{font-size:clamp(39px,9.4vw,48px)}
  .hero .hero-description{font-size:16px}
  .section-intro.large h2{font-size:clamp(36px,9vw,45px)}
  .step-copy p{font-size:16px}
  .step-visual{height:265px;border-radius:23px}
  .visual-brief{padding:70px 26px}
  .visual-brief .site-input{font-size:16px}
  .use-case-card{min-height:0;padding:27px;border-radius:22px}
  .use-case-top img{width:54px;height:54px}
  .faq-list details{padding-inline:17px}
  .faq-list summary{font-size:16px}
}
@media(prefers-reduced-motion:reduce){
  .hero::before,.hero::after,.step-visual::after,.visual-brief .site-input,.visual-brief .green-pill,.step-visual.in-view :is(.casting-card,.workflow-card,.learning-card),.step-visual.in-view .casting-bars i,.step-visual.in-view .learning-sparkline i,.goal-panel.in-view .goal-visual-row,.goal-visual-row i,.final-cta::before{animation:none}
  .reveal{opacity:1;filter:none;transform:none}
}
