/* v42 final adjustments: contact simplification, responsive crop and CMS-ready works flow. */

:root {
  --v42-brand: #39779d; --text-v37-v42-brand: #315f7d;
  --v42-brand-deep: #39779d; --text-v37-v42-brand-deep: #284f69;
  --v42-brand-shadow: #39779d; --text-v37-v42-brand-shadow: #1c4057;
  --v42-white: #fff; --text-v37-v42-white: #fff;
}

/* CONTACT: the five-step block was removed; keep the form opening intentional. */
body.page-contact .contact-main {
  padding-top: clamp(68px, 7vw, 108px);
}

body.page-contact .form-row--simulator {
  align-items: center;
}

body.page-contact .form-simulator-launch {
  position: relative;
  display: flex;
  grid-column: 2;
  align-items: center;
  justify-content: center;
  gap: 24px;
  width: min(100%, 470px);
  min-height: 64px;
  padding: 15px 30px;
  overflow: hidden;
  color: var(--text-v37-v42-white);
  font: inherit;
  letter-spacing: .08em;
  cursor: pointer;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 999px;
  background: linear-gradient(145deg, #39779d 0%, var(--v42-brand) 56%, var(--v42-brand-deep) 100%);
  box-shadow:
    0 8px 0 var(--v42-brand-shadow),
    0 17px 28px rgba(57, 119, 157, .2),
    inset 0 1px 0 rgba(255, 255, 255, .48);
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

body.page-contact .form-simulator-launch::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 20%, rgba(255, 255, 255, .2) 42%, transparent 64%);
  transform: translateX(-120%);
  transition: transform .65s ease;
}

body.page-contact .form-simulator-launch > span {
  position: relative;
  z-index: 1;
}

body.page-contact .form-simulator-launch:hover {
  filter: brightness(1.05);
  transform: translateY(-2px);
  box-shadow:
    0 10px 0 var(--v42-brand-shadow),
    0 21px 34px rgba(57, 119, 157, .23),
    inset 0 1px 0 rgba(255, 255, 255, .5);
}

body.page-contact .form-simulator-launch:hover::before {
  transform: translateX(120%);
}

body.page-contact .form-simulator-launch:active {
  transform: translateY(6px);
  box-shadow:
    0 2px 0 var(--v42-brand-shadow),
    0 8px 16px rgba(57, 119, 157, .18),
    inset 0 1px 0 rgba(255, 255, 255, .42);
}

/* CONTACT FAQ: no card/qualification-style frame; a quiet ruled list instead. */
body.page-contact .contact-faq {
  padding: 76px 0 84px;
}

body.page-contact .contact-faq .container {
  width: min(1180px, calc(100% - 96px));
  max-width: none;
}

body.page-contact .contact-faq__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.page-contact .faq-pill {
  min-height: 76px;
  padding: 18px 2px;
  color: rgba(255, 255, 255, .94);
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, .24) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.page-contact .faq-pill:first-child {
  border-top: 1px solid rgba(255, 255, 255, .24) !important;
}

body.page-contact .faq-pill:hover {
  color: #fff;
  background: rgba(255, 255, 255, .055) !important;
}

body.page-contact .faq-btn {
  display: inline-flex;
  width: max-content;
  min-height: 0;
  margin-top: 28px;
  padding: 0 0 9px;
  color: #fff;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .55);
  border-radius: 0;
  background: transparent;
}

/* WORKS: add breathing room between the fixed header and the visual badge. */
body.page-works .works-hero {
  margin-top: clamp(30px, 3.2vw, 54px);
}

/* COMPANY: portrait numbering is removed; compact the mobile OUR WORK block. */
body.page-company .company-person__portrait {
  padding-bottom: 0;
}

/* ABOUT: force the supplied letterboxed movie beyond tablet viewport edges. */
@media (min-width: 621px) and (max-width: 1180px) {
  body.page-about .about-film__video {
    inset: -5%;
    width: 110%;
    height: 110%;
    object-fit: cover;
    object-position: 50% 50%;
    transform: scale(1.42) !important;
    clip-path: inset(1px);
  }

  body.page-about .about-film.is-veiled .about-film__video {
    transform: scale(1.39) !important;
  }
}

/* ABOUT WORKS: the original CMS cards stay first; JS mirrors them for a seamless loop. */
body.page-about .works-sec__inner {
  grid-template-columns: minmax(250px, 310px) minmax(0, 1fr);
  gap: clamp(42px, 5vw, 78px);
}

body.page-about .works-slider {
  width: 100%;
  min-width: 0;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

body.page-about .works-slider__track[data-marquee-ready="true"] {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 24px;
  width: max-content;
  padding: 12px 0 30px;
  animation: v42WorksMarqueeRight var(--works-loop-duration, 38s) linear infinite;
  will-change: transform;
}

body.page-about .works-slider__track[data-marquee-ready="true"] > .work-card {
  flex: 0 0 clamp(280px, 22vw, 336px);
  width: clamp(280px, 22vw, 336px);
  opacity: 1 !important;
  filter: none !important;
}

/* Cards can enter the viewport through the track transform before the global
   intersection observer fires. Keep every CMS card and its mirrored copy
   fully painted so the seamless loop never exposes an empty image. */
body.page-about .works-slider__track[data-marquee-ready="true"] > .work-card,
body.page-about .works-slider__track[data-marquee-ready="true"] > .work-card .reveal,
body.page-about .works-slider__track[data-marquee-ready="true"] > .work-card .wipe,
body.page-about .works-slider__track[data-marquee-ready="true"] > .work-card .pop,
body.page-about .works-slider__track[data-marquee-ready="true"] > .work-card .tx,
body.page-about .works-slider__track[data-marquee-ready="true"] > .work-card .tx-inner,
body.page-about .works-slider__track[data-marquee-ready="true"] > .work-card .motion-image {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
  clip-path: inset(0) !important;
}

body.page-about .works-slider__track[data-marquee-ready="true"]:hover {
  animation-play-state: paused;
}

@keyframes v42WorksMarqueeRight {
  from { transform: translate3d(var(--works-loop-start, -1080px), 0, 0); }
  to { transform: translate3d(0, 0, 0); }
}

@media (max-width: 900px) {
  body.page-company .company-work {
    padding: 76px 0 80px !important;
  }

  body.page-company .company-work__inner {
    padding: 0 !important;
  }

  body.page-company .company-work__intro {
    width: 100%;
    padding-top: 0 !important;
  }

  body.page-about .works-sec__inner {
    display: block;
  }

  body.page-about .works-intro {
    margin-bottom: 34px;
  }
}

@media (max-width: 768px) {
  body.page-contact .contact-main {
    padding-top: 52px;
  }

  body.page-contact .form-simulator-launch {
    grid-column: auto;
    width: 100%;
    min-height: 58px;
    padding-inline: 20px;
    box-shadow:
      0 6px 0 var(--v42-brand-shadow),
      0 14px 24px rgba(57, 119, 157, .2),
      inset 0 1px 0 rgba(255, 255, 255, .48);
  }

  body.page-contact .contact-faq {
    padding: 54px 0 60px;
  }

  body.page-contact .contact-faq .container {
    width: calc(100% - 40px);
  }

  body.page-contact .faq-pill {
    min-height: 68px;
    padding: 16px 0;
  }

  body.page-works .works-hero {
    margin-top: 42px;
  }

  body.page-company .company-work {
    padding: 58px 0 62px !important;
  }

  body.page-company .company-work__title {
    margin: 18px 0 20px;
  }

  body.page-company .company-work__lead {
    font-size: 12px;
    line-height: 2;
  }

  body.page-about .works-slider {
    margin-inline: -20px;
    width: calc(100% + 40px);
  }

  body.page-about .works-slider__track[data-marquee-ready="true"] {
    gap: 18px;
    padding-inline: 20px;
  }

  body.page-about .works-slider__track[data-marquee-ready="true"] > .work-card {
    flex-basis: min(82vw, 320px);
    width: min(82vw, 320px);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.page-about .works-slider {
    overflow-x: auto;
    -webkit-mask-image: none;
    mask-image: none;
    scroll-snap-type: x mandatory;
  }

  body.page-about .works-slider__track[data-marquee-ready="true"] {
    width: max-content;
    animation: none !important;
    transform: none !important;
  }

  body.page-about .works-slider__track .works-marquee__clone {
    display: none;
  }

  body.page-about .works-slider__track > .work-card {
    scroll-snap-align: start;
  }
}