/* Homepage corrections based on the supplied Finbest index-3 reference.
   Kept separate so the portal and other pages retain their existing design. */
.reference-home {
  --ink: #16243e;
  --muted: #67687a;
  --cyan-dark: #004d6e;
  --cyan: #00accc;
  background: #fff;
  font-family: 'Jost', sans-serif;
}
.reference-home h1,
.reference-home h2,
.reference-home h3,
.reference-home .ref-counter strong,
.reference-home .ref-client-count strong,
.reference-home .ref-ghost-number { font-family: 'Jost', sans-serif; }
.reference-home p { font-family: 'Kumbh Sans', sans-serif; line-height: 1.75; }
.reference-home .ref-container { width: min(1200px, calc(100% - 48px)); }
.reference-home .site-header { width: min(1400px, calc(100% - 60px)); min-height: 110px; }
.reference-home .site-nav { font-family: 'Jost', sans-serif; font-size: 17px; gap: 30px; }
.reference-home .site-nav .button { font-size: 15px; }
.reference-home .demo-ribbon { font-family: 'Jost', sans-serif; letter-spacing: .02em; font-size: 13px; padding-block: 12px; background: #16243e; }
.reference-home .ref-section { padding-block: 120px; }
.reference-home .ref-heading { margin-bottom: 45px; }
.reference-home .ref-kicker { font-size: 18px; letter-spacing: 4px; font-weight: 700; margin-bottom: 10px; line-height: 1.5; }
.reference-home .ref-heading h2,
.reference-home .ref-copy h2,
.reference-home .ref-support-copy h2,
.reference-home .ref-contact-card h2 { font-size: 48px; letter-spacing: -1.92px; font-weight: 600; line-height: 1.2; margin-bottom: 20px; }
.reference-home .ref-copy > p,
.reference-home .ref-support-copy > p { font-size: 16px; margin-bottom: 28px; }
.reference-home .ref-button { padding: 18px 36px; min-height: 60px; gap: 28px; font-size: 16px; font-weight: 600; background: linear-gradient(90deg, #004d6e, #00accc); transition: transform .2s, box-shadow .2s; }
.reference-home :is(a, button, input, textarea):focus-visible { outline: 3px solid #00a3c3; outline-offset: 4px; }
/* Use the original transparent artwork instead of wide skewed strips. */
.reference-home .ref-hero { background: #212240; min-height: 760px; }
.reference-home .ref-hero-track { position: relative; display: grid; }
.reference-home .ref-hero-slide { position: relative; grid-area: 1 / 1; inset: auto; min-width: 0; }
.reference-home .ref-hero-grid { min-height: 760px; grid-template-columns: 57% 43%; padding-block: 115px 110px; }
.reference-home .ref-hero-copy { max-width: 650px; padding: 0; }
.reference-home .ref-hero-copy h1 { font-size: 75px; font-weight: 600; letter-spacing: -3px; line-height: 1.1; margin-bottom: 25px; }
.reference-home .ref-hero-copy p { max-width: 520px; color: #fff; font-size: 16px; margin-bottom: 35px; }
.reference-home .ref-hero .ref-button { padding-inline: 48px; }
.reference-home .ref-hero-photo { width: 44%; z-index: 1; clip-path: polygon(26% 0, 100% 0, 100% 100%, 46% 100%, 0 26%); }
.reference-home .ref-hero-photo-original { background: none; }
.reference-home .ref-hero-photo-original img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
.reference-home .ref-source-shape { position: absolute; z-index: 2; pointer-events: none; }
.reference-home .ref-source-shape-top { width: 228px; height: auto; top: 0; right: 32%; transform: rotate(-2deg); }
.reference-home .ref-source-shape-bottom { width: 475px; height: auto; bottom: -22px; right: 21%; transform: rotate(2.5deg); }
.reference-home .ref-hero-controls { bottom: 32px; }
/* About: arched portrait, patterned backdrop, and layered activity details. */
.reference-home .ref-about { padding-top: 130px; padding-bottom: 140px; }
.reference-home .ref-two-col { gap: 60px; }
.reference-home .ref-about-visual { min-height: 520px; isolation: isolate; margin-right: 20px; }
.reference-home .ref-about-photo { width: 340px; height: 440px; right: 0; border-radius: 170px 170px 0 0; }
.reference-home .ref-about-pattern { width: 440px; top: 30px; right: 40px; z-index: -1; }
.reference-home .ref-float-note { width: 185px; top: 25px; left: 0; padding: 28px 20px; text-align: center; border-radius: 0; box-shadow: 0 10px 60px #00000014; }
.reference-home .ref-float-note b { display: grid; place-items: center; width: 60px; height: 60px; margin: auto; border-radius: 50%; background: #f6f6f9; }
.reference-home .ref-float-note b img { width: 32px; height: 32px; }
.reference-home .ref-float-note strong { font-size: 18px; font-weight: 500; }
.reference-home .ref-float-note span { font-size: 13px; }
.reference-home .ref-client-count { width: 244px; min-height: 252px; left: 12%; bottom: -60px; padding: 35px 25px; border-radius: 35px; background: linear-gradient(90deg, #004d6e, #00accc); }
.reference-home .ref-client-count strong { font-size: 48px; font-weight: 600; letter-spacing: -1.92px; margin-top: 20px; }
.reference-home .ref-client-count span { font-size: 16px; }
.reference-home .ref-mini-cards { gap: 20px; margin-block: 30px; }
.reference-home .ref-mini-cards article { background: transparent; padding: 0; gap: 15px; min-height: 70px; }
.reference-home .ref-mini-cards img { width: 50px; }
.reference-home .ref-mini-cards strong { font-size: 20px; font-weight: 600; line-height: 1.3; }
.reference-home .ref-actions { gap: 32px; }
.reference-home .ref-video { font-size: 15px; font-weight: 500; }
/* Restore the reference's type scale, shadows, and spacing below the fold. */
.reference-home :is(.ref-service-grid, .ref-project-grid, .ref-team-grid, .ref-process-grid, .ref-news-grid) { gap: 30px; }
.reference-home .ref-service-grid article { min-height: 405px; padding: 40px 40px 90px; border-radius: 5px; box-shadow: 0 10px 60px #00000012; }
.reference-home .ref-service-grid article > img { width: 60px; height: 60px; }
.reference-home .ref-service-grid h3 { font-size: 24px; font-weight: 600; letter-spacing: -.96px; margin-bottom: 25px; }
.reference-home .ref-service-grid p { font-size: 16px; }
.reference-home .ref-service-grid article > a { font-size: 16px; min-height: 60px; letter-spacing: .8px; }
.reference-home .ref-service-grid article > a:hover { background: linear-gradient(90deg, #004d6e, #00accc); }
.reference-home .ref-ghost-number { font-size: 75px; right: 35px; top: 45px; font-weight: 600; }
.reference-home .ref-tabs span { font-size: 15px; padding: 10px 24px; }
.reference-home .ref-project-grid article { background: transparent; padding-bottom: 0; }
.reference-home .ref-project-grid img { aspect-ratio: 410 / 380; border-radius: 5px; }
.reference-home .ref-project-grid span { font-size: 14px; margin-top: 24px; }
.reference-home .ref-project-grid h3 { font-size: 26px; font-weight: 600; letter-spacing: -.7px; }
.reference-home .ref-support-card { border-radius: 8px; }
.reference-home .ref-support-copy li { font-size: 16px; }
.reference-home .ref-testimonial-grid { gap: 30px; }
.reference-home .ref-testimonial-grid article { padding: 45px; border-radius: 25px; }
.reference-home .ref-testimonial-grid article > p { font-size: 17px; margin-block: 26px; }
.reference-home .ref-quote-row b { font-size: 13px; }
.reference-home .ref-testimonial-grid footer strong { font-size: 20px; font-weight: 600; }
.reference-home .ref-testimonial-grid footer small { font-size: 14px; }
.reference-home .ref-testimonial-grid footer img { width: 60px; height: 60px; }
.reference-home .ref-team-grid img { aspect-ratio: 410 / 450; }
.reference-home .ref-team-grid h3 { font-size: 27px; font-weight: 600; margin-bottom: 6px; }
.reference-home .ref-team-grid span { font-size: 15px; }
.reference-home .ref-counter { padding-block: 95px; }
.reference-home .ref-counter strong { font-size: 48px; font-weight: 600; margin-top: 22px; }
.reference-home .ref-counter span { font-size: 16px; color: #ffffffcc; }
.reference-home .ref-contact-card { border-radius: 5px; padding: 60px; gap: 60px; }
.reference-home .ref-contact-card input, .reference-home .ref-contact-card textarea { font-family: 'Kumbh Sans', sans-serif; }
.reference-home .ref-process-grid article { border-radius: 50%; min-height: 380px; padding: 48px 30px 70px; }
.reference-home .ref-process-grid h3 { font-size: 24px; font-weight: 600; }
.reference-home .ref-process-grid p { font-size: 15px; }
.reference-home .ref-process-grid b { font-size: 48px; bottom: 20px; }
.reference-home .ref-news-meta { font-size: 12px; }
.reference-home .ref-news-grid h3 { font-size: 25px; font-weight: 600; letter-spacing: -.5px; line-height: 1.3; }
.reference-home .ref-news-grid p { font-size: 15px; }
.reference-home .ref-news-grid a { font-size: 15px; }
@media (min-width: 1600px) {
  .reference-home .ref-hero, .reference-home .ref-hero-grid { min-height: 826px; }
}
@media (max-width: 1199px) {
  .reference-home .site-header { width: calc(100% - 48px); }
  .reference-home .site-nav { gap: 18px; font-size: 15px; }
  .reference-home .ref-hero, .reference-home .ref-hero-grid { min-height: 670px; }
  .reference-home .ref-hero-copy h1 { font-size: 65px; }
  .reference-home .ref-hero-copy p { max-width: 450px; }
  .reference-home .ref-source-shape-top { right: 28%; width: 195px; }
  .reference-home .ref-source-shape-bottom { right: 12%; width: 410px; }
  .reference-home .ref-two-col { gap: 45px; }
  .reference-home .ref-mini-cards strong { font-size: 17px; }
  .reference-home .ref-mini-cards img { width: 40px; }
  .reference-home .ref-service-grid article { padding: 30px 28px 85px; }
  .reference-home .ref-service-grid p { font-size: 15px; }
  .reference-home .ref-process-grid article { border-radius: 160px 160px 12px 12px; }
}
@media (max-width: 980px) {
  .reference-home .ref-hero-grid { grid-template-columns: 65% 35%; display: grid; }
  .reference-home .ref-hero-copy { max-width: 510px; }
  .reference-home .ref-hero-copy h1 { font-size: 58px; }
  .reference-home .ref-hero-photo { width: 48%; }
  .reference-home .ref-hero-slide.is-active .ref-hero-photo { opacity: .45; }
  .reference-home .ref-source-shape-top { width: 160px; right: 22%; opacity: .8; }
  .reference-home .ref-source-shape-bottom { width: 340px; right: -8%; }
  .reference-home .ref-section { padding-block: 85px; }
  .reference-home .ref-two-col { grid-template-columns: 1fr; gap: 110px; }
  .reference-home .ref-about-visual { width: min(540px, 100%); margin: 0 auto; }
  .reference-home .ref-copy { max-width: 680px; }
  .reference-home .ref-mini-cards { max-width: 500px; }
  .reference-home .ref-contact-card { padding: 35px; gap: 35px; }
  .reference-home .ref-process-grid article { border-radius: 20px; min-height: 350px; }
}
@media (max-width: 760px) {
  .reference-home .ref-container { width: calc(100% - 36px); }
  .reference-home .site-header { width: calc(100% - 36px); min-height: 80px; }
  .reference-home .site-nav { font-size: 16px; }
  .reference-home .ref-kicker { font-size: 14px; letter-spacing: 2px; }
  .reference-home .ref-heading h2, .reference-home .ref-copy h2, .reference-home .ref-support-copy h2, .reference-home .ref-contact-card h2 { font-size: 36px; letter-spacing: -1.2px; }
  .reference-home .ref-hero, .reference-home .ref-hero-grid { min-height: 620px; }
  .reference-home .ref-hero-grid { grid-template-columns: 1fr; padding-block: 75px 105px; }
  .reference-home .ref-hero-copy { width: 100%; max-width: 520px; }
  .reference-home .ref-hero-copy h1 { font-size: clamp(46px, 8.5vw, 60px); letter-spacing: -2px; max-width: 480px; }
  .reference-home .ref-hero-copy p { max-width: 440px; }
  .reference-home .ref-hero-photo { width: 65%; }
  .reference-home .ref-hero-slide.is-active .ref-hero-photo { opacity: .2; }
  .reference-home .ref-source-shape-top { width: 130px; right: 8%; opacity: .45; }
  .reference-home .ref-source-shape-bottom { width: 270px; right: -15%; opacity: .45; }
  .reference-home .ref-hero .ref-button { padding-inline: 32px; }
  .reference-home .ref-section { padding-block: 70px; }
  .reference-home .ref-about-visual { min-height: 480px; }
  .reference-home .ref-about-photo { width: min(340px, calc(100% - 35px)); height: 400px; }
  .reference-home .ref-client-count { width: 195px; min-height: 210px; left: 0; padding: 25px 20px; bottom: -40px; }
  .reference-home .ref-client-count strong { font-size: 40px; }
  .reference-home .ref-client-count span { font-size: 14px; }
  .reference-home .ref-float-note { width: 150px; padding: 20px 12px; top: 10px; }
  .reference-home .ref-float-note strong { font-size: 16px; }
  .reference-home .ref-float-note span { font-size: 12px; }
  .reference-home .ref-mini-cards { grid-template-columns: 1fr 1fr; gap: 15px; }
  .reference-home .ref-mini-cards strong { font-size: 16px; }
  .reference-home .ref-mini-cards article { gap: 10px; }
  .reference-home .ref-mini-cards img { width: 34px; }
  .reference-home .ref-actions { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 24px; }
  .reference-home .ref-service-grid article { min-height: 370px; }
  .reference-home .ref-contact-card { padding: 24px; }
  .reference-home .ref-testimonial-grid article { padding: 28px; }
  .reference-home .ref-process-grid article { min-height: 320px; padding: 35px 28px 65px; }
  .reference-home .ref-counter strong { font-size: 40px; }
  .reference-home .ref-counter span { font-size: 14px; }
}
@media (max-width: 575px) {
  .reference-home .ref-hero-photo, .reference-home .ref-source-shape { display: none; }
  .reference-home .ref-hero, .reference-home .ref-hero-grid { min-height: 560px; }
  .reference-home .ref-hero-copy h1 { font-size: 47px; }
  .reference-home .ref-hero-copy p { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .reference-home *, .reference-home *::before, .reference-home *::after { animation: none !important; transition: none !important; }
}
