/* A compact opening: one promise, existing client proof and a clear next step. */
.home-hero h1 { font-size: clamp(60px, 6.6vw, 106px); line-height: 1.02; max-width: 1400px; }
.home-hero .hero-foot { margin-top: 24px; align-items: center; }
.home-hero .hero-foot > p { max-width: 580px; }
.home-hero .hero-actions { flex-wrap: wrap; gap: 16px 24px; }
.hero-gradient { color: #7830a6; }
@supports (background-clip: text) or (-webkit-background-clip: text) {
  .hero-gradient {
    background: linear-gradient(105deg, #6630ad 0%, #b51c76 33%, #7433b1 66%, #6630ad 100%);
    background-size: 250% 100%;
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
    animation: expertise-colour 8s ease-in-out infinite;
  }
}
@keyframes expertise-colour {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
.home-hero + .hero-media { aspect-ratio: 3; }
.home-hero + .hero-media img { object-fit: contain; }

/* One portfolio link follows the cards in source order. Desktop places it
   alongside the heading; phones read the projects before the next step. */
.work-layout { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 24px; }
.work-layout .work-top { grid-column: 1; grid-row: 1; }
.work-layout .work-grid { grid-column: 1 / -1; grid-row: 2; }
.work-layout > .work-explore { grid-column: 2; grid-row: 1; justify-self: end; align-self: end; margin-bottom: 32px; }

/* Retain the compact portfolio opening after shared section padding rules. */
@media (min-width: 601px) {
  .home .work { padding-top: 20px; }
}

@media (max-width: 1100px) {
  .home-hero h1 { font-size: clamp(52px, 6.6vw, 78px); }
  .home-hero .hero-foot { grid-template-columns: 1fr; gap: 20px; }
  .home-hero .hero-actions { justify-content: flex-start; }
}
@media (max-width: 600px) {
  .home-hero { padding-top: 28px; padding-bottom: 22px; }
  .home-hero .eyebrow { margin-bottom: 20px; }
  .home-hero h1 { font-size: clamp(33px, 10.6vw, 62px); letter-spacing: -.05em; line-height: 1.08; }
  .home-hero h1 .hero-gradient { display: block; }
  .home-hero .hero-foot { margin-top: 20px; gap: 12px; }
  .home-hero .hero-foot > p { font-size: 14px; line-height: 1.65; }
  .home-hero .hero-desktop-cta { display: none !important; }
  .home-hero .hero-actions { display: none; }
  .home-hero + .hero-media {
    aspect-ratio: 3; margin-top: 0; animation: none;
  }
  .home-hero + .hero-media + .ticker { display: none; }
  .home-hero ~ .proof-brands { margin-top: 12px; padding-block: 20px 24px; }
  .home-hero ~ .proof-brands .proof-brand-viewport { margin-top: 18px; }
  .work-layout { display: block; }
  .work-layout > .work-explore { margin: 26px 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-gradient { animation: none; }
}
@media (forced-colors: active) {
  .hero-gradient { background: none; color: CanvasText; -webkit-text-fill-color: CanvasText; }
}