.projects-gallery{position:relative;background:#fff;padding:4.2vw 3vw 7.4vw;text-align:center;overflow:hidden}
.projects-gallery::before{content:"";position:absolute;left:-110px;top:19vw;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,#e8f6ff 0%,rgba(232,246,255,0) 72%);pointer-events:none}
.projects-gallery::after{content:"";position:absolute;right:-125px;bottom:0;width:350px;height:350px;border-radius:50%;background:radial-gradient(circle,#eef1ff 0%,rgba(238,241,255,0) 72%);pointer-events:none}
.projects-gallery-heading{position:relative;z-index:1;margin-bottom:3.65vw}
.projects-gallery-heading p{font-size:1.27vw;color:#191349;line-height:1.2;margin:0 0 1.25vw}
.projects-gallery-heading h2{font-size:2.55vw;line-height:1.1;margin:0;color:#0b8bdf}
.project-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.6vw;width:min(100%,1200px);margin:0 auto}
.project-card{position:relative;display:flex;align-items:center;flex-direction:column;min-width:0;padding:1.3vw 1vw;color:#191349;text-align:center;transition:transform .3s}
.project-card:hover{transform:translateY(-6px)}
.project-image{display:grid;place-items:center;width:10.8vw;height:10.8vw;max-width:154px;max-height:154px;margin:0 auto 1.5vw;padding:.55vw;border-radius:1.8vw;background:#f3f8fd;box-shadow:0 .6vw 1.4vw rgba(10,58,114,.13),inset 0 0 0 1px #e5eff9;transition:background .3s,transform .3s,box-shadow .3s}
.project-card:hover .project-image{background:#e7f5ff;transform:scale(1.06);box-shadow:0 1vw 1.8vw rgba(4,103,180,.2)}
.project-image img{display:block;width:100%;height:100%;object-fit:contain;border-radius:1.3vw;animation:project-logo-float 4.8s ease-in-out infinite;transition:transform .35s}
.project-card:nth-child(2) .project-image img{animation-delay:-1.2s}.project-card:nth-child(3) .project-image img{animation-delay:-2.4s}.project-card:nth-child(4) .project-image img{animation-delay:-3.6s}
.project-card:hover .project-image img{animation-play-state:paused;transform:scale(1.06)}
.project-info{width:100%;margin-top:auto}
.project-info h3{font-size:1.5vw;line-height:1.2;margin:0 0 .55vw;color:#0b1856}
.project-card:hover .project-info h3{color:#0b8bdf}
.project-info p{max-width:15vw;margin:0 auto;color:#5c6b85;font-size:1.03vw;line-height:1.3}
.project-card.is-visible{animation:project-card-enter .7s both}
.project-card:nth-child(2).is-visible{animation-delay:.08s}.project-card:nth-child(3).is-visible{animation-delay:.16s}.project-card:nth-child(4).is-visible{animation-delay:.24s}
@keyframes project-card-enter{from{opacity:0;transform:translateY(28px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes project-logo-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

@media(max-width:1100px){
  .projects-gallery{padding:65px 30px 105px}.projects-gallery-heading{margin-bottom:55px}.projects-gallery-heading p{font-size:21px;margin-bottom:15px}.projects-gallery-heading h2{font-size:40px}
  .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;max-width:650px}
  .project-card{min-height:230px;padding:18px 15px}
  .project-image{width:130px;height:130px;margin-bottom:20px;padding:7px;border-radius:22px}.project-image img{border-radius:15px}
  .project-info h3{font-size:23px;margin-bottom:8px}.project-info p{max-width:245px;font-size:16px}
}
@media(max-width:700px){
  .projects-gallery{padding:42px 18px 80px}.projects-gallery-heading{margin-bottom:34px}.projects-gallery-heading p{font-size:19px}.projects-gallery-heading h2{font-size:36px}
  .project-grid{gap:12px}.project-card{min-height:200px;padding:16px 8px}
  .project-image{width:min(24vw,110px);height:min(24vw,110px);min-width:82px;min-height:82px;margin-bottom:15px;border-radius:18px;padding:5px}.project-image img{border-radius:13px}
  .project-info h3{font-size:20px;margin-bottom:6px}.project-info p{font-size:14px;line-height:1.25}
}
@media(prefers-reduced-motion:reduce){.project-card,.project-image,.project-image img{transition:none!important;animation:none!important}.project-card:hover{transform:none}.project-card.is-visible{animation:none}}

/* Client-led projects page */
.projects-showcase{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);align-items:center;gap:3.5vw;padding:3.6vw 7vw 2.8vw;background:#fff}
.projects-showcase-copy{max-width:640px;text-align:left}
.projects-showcase-copy .eyebrow{margin:0 0 12px;color:#0b8bdf;font-size:clamp(16px,1vw,20px);font-weight:700}
.projects-showcase-copy h2{margin:0 0 16px;color:#10165d;font-size:clamp(34px,3vw,56px);line-height:1.1;font-weight:800}
.projects-showcase-copy>p:last-child{margin:0;color:#25336d;font-size:clamp(16px,1.05vw,21px);line-height:1.55}
.projects-showcase-illustration{min-height:270px;background:url('./assets/social-illustration.png') center/contain no-repeat}
.projects-client-band{padding-top:16px}
@media(max-width:900px){.projects-showcase{grid-template-columns:1fr;gap:12px;padding:42px 24px 28px;text-align:center}.projects-showcase-copy{text-align:center;margin:0 auto}.projects-showcase-copy h2{font-size:clamp(30px,7vw,46px)}.projects-showcase-copy>p:last-child{font-size:17px;line-height:1.55}.projects-showcase-illustration{min-height:220px}}
@media(max-width:520px){.projects-showcase{padding-inline:20px}.projects-showcase-copy>p:last-child{font-size:16px}.projects-showcase-illustration{min-height:180px}}

/* Filled projects page: compact case-study cards between the intro and client reel. */
.projects-page .services-hero .about-hero-wave{z-index:3;bottom:-2px;height:calc(4.22vw + 2px)}
.projects-page .services-hero .about-hero-wave path{fill:#eaf5ff}
.projects-page .projects-showcase{position:relative;isolation:isolate;min-height:420px;margin-top:-3px;padding:72px clamp(28px,7vw,120px) 64px;background:linear-gradient(180deg,#eaf5ff 0%,#f4faff 62%,#edf5ff 100%);overflow:hidden}
.projects-page .projects-showcase::after{content:"";position:absolute;z-index:-1;right:-100px;top:-130px;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle,rgba(14,151,225,.18),rgba(14,151,225,0) 69%)}
.projects-page .projects-showcase-copy{max-width:690px}
.projects-page .projects-showcase-copy h2{font-size:clamp(36px,3.2vw,58px);line-height:1.12}
.projects-page .projects-showcase-copy>p:last-child{max-width:660px;font-size:clamp(17px,1.05vw,20px)}
.projects-page .projects-showcase-illustration{min-height:300px;filter:drop-shadow(0 22px 28px rgba(10,38,93,.14))}
.projects-page .projects-gallery{padding:70px clamp(24px,6vw,100px) 86px;background:linear-gradient(180deg,#f5faff 0%,#fff 100%)}
.projects-page .projects-gallery::before,.projects-page .projects-gallery::after{display:none}
.projects-page .projects-gallery-heading{max-width:720px;margin:0 auto 38px;text-align:center}
.projects-page .projects-gallery-heading p{margin:0 0 10px;color:#0b8bdf;font-size:17px;font-weight:800;letter-spacing:.04em}
.projects-page .projects-gallery-heading h2{margin:0;color:#0b1856;font-size:clamp(30px,2.7vw,46px);line-height:1.18}
.projects-page .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;width:min(100%,1120px)}
.projects-page .project-card{display:grid;grid-template-columns:156px minmax(0,1fr);align-items:center;gap:24px;min-height:190px;padding:17px 24px 17px 17px;border:1px solid #dceaf7;border-radius:25px;background:rgba(255,255,255,.94);box-shadow:0 16px 42px rgba(15,54,110,.09);text-align:left;overflow:hidden}
.projects-page .project-card:hover{transform:translateY(-5px);border-color:#9ed5f6;box-shadow:0 22px 48px rgba(15,86,150,.15)}
.projects-page .project-image{width:156px;height:156px;max-width:none;max-height:none;margin:0;padding:9px;border-radius:19px;background:#f2f7fc;box-shadow:inset 0 0 0 1px #e3edf7}
.projects-page .project-image img{width:100%;height:100%;border-radius:13px;object-fit:contain;animation:none}
.projects-page .project-card:hover .project-image{transform:none;background:#eef8ff;box-shadow:inset 0 0 0 1px #cce8f8}
.projects-page .project-card:hover .project-image img{transform:scale(1.035)}
.projects-page .project-info{align-self:center;margin:0}
.projects-page .project-number{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:25px;margin:0 0 13px;padding:0 10px;border-radius:999px;background:#e3f4ff;color:#0789da;font-size:13px;font-weight:900;letter-spacing:.08em}
.projects-page .project-info h3{margin:0 0 8px;color:#0b1856;font-size:clamp(23px,1.55vw,29px);line-height:1.15}
.projects-page .project-info p{max-width:300px;margin:0;color:#56698d;font-size:16px;line-height:1.45}
.projects-page .project-link{display:inline-flex;margin-top:14px;color:#0789da;font-size:14px;font-weight:800;text-decoration:none}.projects-page .project-link:hover{text-decoration:underline}
.projects-page .projects-client-band{padding:12px 0;background:linear-gradient(105deg,#0752ba 0%,#118fe1 48%,#07b7e5 100%)}
.projects-page .projects-client-band .client-logo{height:106px}
@media(max-width:900px){
  .projects-page .services-hero .about-hero-wave{height:72px}
  .projects-page .projects-showcase{min-height:0;padding:52px 28px 45px}.projects-page .projects-showcase-illustration{min-height:230px}
  .projects-page .projects-gallery{padding:58px 24px 72px}.projects-page .project-grid{grid-template-columns:1fr;max-width:650px}.projects-page .project-card{min-height:174px}
}
@media(max-width:520px){
  .projects-page .services-hero .about-hero-wave{height:47px}
  .projects-page .projects-showcase{padding:42px 20px 34px}.projects-page .projects-showcase-copy h2{font-size:32px}.projects-page .projects-showcase-illustration{min-height:190px}
  .projects-page .projects-gallery{padding:48px 16px 62px}.projects-page .projects-gallery-heading{margin-bottom:28px}.projects-page .projects-gallery-heading h2{font-size:29px}
  .projects-page .project-grid{gap:14px}.projects-page .project-card{grid-template-columns:108px minmax(0,1fr);gap:15px;min-height:140px;padding:14px;border-radius:20px}.projects-page .project-image{width:108px;height:108px;padding:7px;border-radius:15px}.projects-page .project-image img{border-radius:10px}.projects-page .project-number{height:22px;margin-bottom:9px;font-size:11px}.projects-page .project-info h3{font-size:21px}.projects-page .project-info p{font-size:14px;line-height:1.35}
}
