@import url('/styles/styles.fonts.css?v=1-we2');
@import url('/styles/styles.base.css?v=19-we2');
@import url('/styles/styles.responsive.css?v=1-we2');
@import url('/styles/styles.ux.css?v=1-we2');
@import url('/styles/styles.redesign.css?v=2-we2');
@import url('/styles/styles.youth.css?v=7-we2');
@import url('/styles/styles.client-youth.css?v=4-we2');
@import url('/styles/styles.admin-enhanced.css?v=6-we2');
@import url('/styles/styles.hero-motion.css?v=11-we2');
@import url('/styles/styles.landing-contact.css?v=3-we2');
@import url('/styles/styles.pricing-receipt.css?v=2-we2');
@import url('/styles/styles.cookie.css?v=2-we2');
@import url('/styles/styles.loader.css?v=2-we2');

.panel--ink .button--quiet {
  border-color: rgba(255, 255, 255, .35);
  color: white;
}

@media (max-width: 900px) {
  #loginButton { display: inline-flex; }
}


/* Workevie responsive hero fix v61 */
html, body { max-width: 100%; overflow-x: clip; }
#landingView .hero-media,
#landingView .image-frame--motion,
#landingView .motion-stage,
#landingView .hero-caption { min-width: 0; max-width: 100%; }

@media (min-width: 901px) {
  #landingView .hero-media {
    width: 100%;
    max-width: 720px;
  }
}

@media (max-width: 1120px) {
  #landingView .hero {
    grid-template-columns: 1fr;
    gap: 48px;
  }
  #landingView .hero::before { display: none; }
  #landingView .hero-copy {
    max-width: 780px;
    justify-self: start;
  }
  #landingView .hero-media {
    width: 100%;
    max-width: 820px;
    justify-self: start;
  }
  #landingView .image-frame--motion {
    width: 100%;
    height: min(66vw, 610px);
    min-height: 430px;
  }
}

@media (max-width: 700px) {
  #landingView .hero-media { width: 100%; }
  #landingView .image-frame--motion {
    width: 100%;
    height: min(112vw, 510px);
    min-height: 360px;
  }
  #landingView .hero-caption {
    width: 100%;
    grid-template-columns: 1fr;
    gap: 6px;
  }
}


/* Workevie v61: final anti-overflow rules */
@media (max-width: 900px) {
  #landingView .hero { padding-left: 14px !important; padding-right: 14px !important; }
  #landingView .hero-media { width: 100% !important; max-width: none !important; justify-self: stretch !important; margin: 0 !important; }
  #landingView .image-frame--motion { width: 100% !important; height: auto !important; min-height: 0 !important; aspect-ratio: 4 / 3; }
}
@media (max-width: 700px) {
  #landingView .hero-caption { grid-template-columns: minmax(0,1fr) !important; }
}