/* Interior pages: editorial rhythm inspired by the reference, in the client's palette. */

.page-services .service-jump {
  position: sticky;
  top: var(--interior-nav-offset, 70px);
  z-index: 20;
  padding: 15px 0;
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid #e3e7e5;
  box-shadow: 0 10px 26px rgba(11, 42, 57, .06);
  backdrop-filter: blur(12px);
}

.page-services .service-jump .container {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.page-services .service-jump a {
  min-height: 57px;
  padding: 10px 17px;
  gap: 12px;
  justify-content: center;
  border: 1px solid #d7e2de;
  border-radius: 50px;
  background: #fff;
  color: var(--deep);
  font-size: .79rem;
  line-height: 1.2;
  text-align: center;
  transition: color .25s, background .25s, border-color .25s, transform .25s;
}

.page-services .service-jump a:first-child { border-left: 1px solid #d7e2de; }
.page-services .service-jump a:hover,
.page-services .service-jump a:focus-visible {
  background: var(--teal);
  border-color: var(--teal);
  color: #fff;
  transform: translateY(-2px);
}
.page-services .service-jump a:hover span,
.page-services .service-jump a:focus-visible span { color: #f2d78e; }
.page-services .service-jump span { font-size: .68rem; color: var(--teal); }

.page-services .service-detail {
  scroll-margin-top: 163px;
  padding-block: clamp(74px, 7vw, 112px);
  border-bottom: 1px solid #e7ece9;
}
.page-services .service-detail:nth-of-type(even) { background: #f8f9f7; }
.page-services .service-detail__grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(48px, 7.4vw, 118px);
}
.page-services .service-detail__media {
  height: clamp(420px, 42vw, 560px);
  background: var(--deep);
}
.page-services .service-detail__media img {
  transition: transform .7s ease;
}
.page-services .service-detail__media:hover img { transform: scale(1.035); }
.page-services .service-detail__media span {
  padding: 15px 21px;
  background: #fff;
  color: var(--teal);
  font-size: .7rem;
  letter-spacing: .13em;
}
.page-services .service-detail__copy { max-width: 575px; }
.page-services .service-detail__copy .eyebrow { color: var(--teal); }
.page-services .service-detail__copy h2 {
  margin: 20px 0 18px;
  font-size: clamp(2.18rem, 3.25vw, 3.35rem);
  line-height: 1.12;
}
.page-services .service-detail__copy h3 {
  margin-bottom: 20px;
  color: #417489;
  font-size: clamp(1.08rem, 1.4vw, 1.28rem);
  line-height: 1.45;
}
.page-services .service-detail__copy p {
  max-width: 56ch;
  margin-bottom: 21px;
  font-size: 1.06rem;
  line-height: 1.72;
}
.page-services .service-detail__copy ul { margin: 25px 0 29px; }
.page-services .service-detail__copy li {
  padding-block: 12px;
  font-size: .99rem;
  font-weight: 500;
}
.page-services .service-detail__copy li::before { top: 23px; }
.page-services .closing-cta { border-top: 1px solid #d9e3e0; }

.page-projects .project-gallery { padding-block: clamp(75px, 7vw, 108px); }
.page-projects .project-gallery .section-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  margin: 0 auto 50px;
  text-align: center;
}
.page-projects .project-gallery .section-head h2 {
  max-width: 770px;
  margin: 18px auto 0;
  font-size: clamp(2.2rem, 3.4vw, 3.4rem);
}
.page-projects .project-gallery .section-head > p {
  max-width: 660px;
  margin: 0 auto;
  font-size: 1.03rem;
  line-height: 1.65;
}
.page-projects .project-gallery__grid { gap: 14px; }
.page-projects .gallery-card { min-height: 330px; }
.page-projects .gallery-card:first-child,
.page-projects .gallery-card:nth-child(2) { min-height: 460px; }
.page-projects .gallery-card::after {
  background: linear-gradient(0deg, rgba(7, 29, 42, .9), rgba(7, 29, 42, .08) 61%),
    linear-gradient(90deg, rgba(24, 100, 111, .13), rgba(193, 160, 85, .11));
  transition: background .3s, opacity .3s;
}
.page-projects .gallery-card:hover::after,
.page-projects .gallery-card:focus-visible::after { opacity: .86; }
.page-projects .gallery-card img { transition: transform .55s ease; }
.page-projects .gallery-card:hover img,
.page-projects .gallery-card:focus-visible img { transform: scale(1.055); }
.page-projects .gallery-card__caption {
  left: 28px;
  right: 28px;
  bottom: 27px;
}
.page-projects .gallery-card__caption small {
  color: #f1d68d;
  letter-spacing: .12em;
}
.page-projects .gallery-card__caption strong {
  max-width: 23ch;
  font-size: clamp(1.2rem, 1.7vw, 1.65rem);
  line-height: 1.25;
}
.page-projects .gallery-card__caption svg {
  width: 25px;
  height: 25px;
  transition: transform .25s;
}
.page-projects .gallery-card:hover .gallery-card__caption svg { transform: translate(3px, -3px); }

.page-projects .video-feature {
  padding-block: clamp(75px, 7vw, 108px);
  background: #f6f7f5;
}
.page-projects .video-feature__grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(48px, 7vw, 110px);
}
.page-projects .video-feature__copy { max-width: 530px; }
.page-projects .video-feature__copy h2 {
  margin: 20px 0 21px;
  font-size: clamp(2.25rem, 3.7vw, 3.7rem);
}
.page-projects .video-feature__copy p { line-height: 1.7; }
.page-projects .video-feature__copy .video-feature__note {
  margin: 30px 0 26px;
  padding-left: 15px;
  border-left: 2px solid var(--gold);
  color: #55717c;
}
.page-projects .video-feature__media {
  min-height: 565px;
  padding: 24px;
  background: linear-gradient(135deg, #dfe9e6, #d2ded9);
  border-radius: 0 0 0 65px;
}
.page-projects .video-feature video {
  max-width: 100%;
  box-shadow: 0 24px 54px rgba(11, 43, 58, .2);
}

.page-about .about-intro { padding-block: clamp(75px, 7vw, 108px); }
.page-about .about-intro__grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0;
  min-height: 450px;
}
.page-about .about-intro__grid > div:first-child {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(48px, 6vw, 85px);
  background: #edf0ee;
  border-radius: 0 0 0 76px;
}
.page-about .about-intro__grid > div:last-child {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(42px, 6vw, 80px);
  background: #fff;
}
.page-about .about-intro h2 {
  max-width: 14ch;
  margin: 22px 0 0;
  font-size: clamp(2.25rem, 3.15vw, 3.35rem);
  line-height: 1.16;
}
.page-about .about-intro p { max-width: 58ch; line-height: 1.7; }
.page-about .about-intro .lead {
  color: #344f5d;
  font-size: clamp(1.08rem, 1.5vw, 1.24rem);
}

.page-about .approach { background: #f8f9f7; }
.page-about .approach .section-head {
  justify-content: center;
  margin-bottom: 43px;
  text-align: center;
}
.page-about .approach .section-head h2 {
  max-width: 790px;
  margin-inline: auto;
  font-size: clamp(2.2rem, 3.25vw, 3.3rem);
}
.page-about .approach__grid {
  gap: 0;
  border-top: 1px solid #cadad7;
  border-bottom: 1px solid #cadad7;
}
.page-about .approach article {
  position: relative;
  min-height: 270px;
  margin: 0;
  padding: 33px clamp(24px, 3vw, 43px) 30px;
  border-right: 1px solid #cadad7;
}
.page-about .approach article:last-child { border-right: 0; }
.page-about .approach article span {
  margin-bottom: 35px;
  color: var(--teal);
  font-size: 1.35rem;
}
.page-about .approach h3 { font-size: clamp(1.2rem, 1.55vw, 1.52rem); }
.page-about .approach p { max-width: 32ch; line-height: 1.6; }

.page-about .about-photo {
  min-height: 600px;
  padding-block: 70px;
}
.page-about .about-photo::after {
  background: linear-gradient(90deg, rgba(8, 31, 43, .15), rgba(8, 31, 43, .52));
}
.page-about .about-photo .container {
  display: flex;
  justify-content: flex-end;
}
.page-about .about-photo__message {
  max-width: 620px;
  margin: 0;
  padding: clamp(40px, 5vw, 66px);
  background: rgba(8, 25, 36, .88);
  border-radius: 80px 5px 80px 5px;
  color: #fff;
  font-size: clamp(2rem, 3.15vw, 3.2rem);
  line-height: 1.22;
  backdrop-filter: blur(4px);
}

.page-contact .contact { padding-block: clamp(78px, 7vw, 112px); }
.page-contact .contact__grid {
  grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr);
  gap: clamp(46px, 8vw, 120px);
  align-items: start;
}
.page-contact .contact-form { order: -1; }
.page-contact .contact__intro { padding-top: 19px; }
.page-contact .contact__intro h2 {
  max-width: 12ch;
  margin: 20px 0 24px;
  font-size: clamp(2.3rem, 3.5vw, 3.55rem);
}
.page-contact .contact__intro > p {
  max-width: 45ch;
  line-height: 1.7;
}
.page-contact .contact__info { margin-top: 64px; }
.page-contact .contact__info span { margin-bottom: 9px; }
.page-contact .contact__info a {
  font-size: clamp(1.1rem, 1.6vw, 1.4rem);
  border-bottom: 1px solid var(--teal);
  width: fit-content;
  max-width: 100%;
}
.page-contact .contact__line { max-width: 420px; margin-block: 45px 28px; }
.page-contact .contact-form {
  gap: 22px;
  padding: clamp(32px, 4vw, 57px);
  border: 1px solid #e0e9e5;
  border-radius: 0 0 0 70px;
  background: #f4f6f4;
  box-shadow: 0 20px 55px rgba(16, 47, 66, .07);
}
.page-contact .contact-form label {
  gap: 9px;
  color: var(--deep);
  font-size: .8rem;
  letter-spacing: .015em;
}
.page-contact .contact-form input,
.page-contact .contact-form select,
.page-contact .contact-form textarea {
  min-height: 55px;
  padding: 12px 15px;
  border: 1px solid #d1dcd8;
  background: #fff;
  color: var(--deep);
  font-size: 1rem;
}
.page-contact .contact-form textarea { min-height: 150px; }
.page-contact .contact-form input:hover,
.page-contact .contact-form select:hover,
.page-contact .contact-form textarea:hover { border-color: #94b6af; }
.page-contact .contact-form input:focus,
.page-contact .contact-form select:focus,
.page-contact .contact-form textarea:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(23, 109, 115, .15);
}
.page-contact .contact-form__hint { max-width: 62ch; line-height: 1.55; }
.page-contact .contact-form .button { min-width: 212px; }

@media (max-width: 1000px) {
  .page-services .service-jump { position: relative; top: auto; }
  .page-services .service-detail { scroll-margin-top: 90px; }
  .page-services .service-detail__grid { gap: 45px; }
  .page-services .service-detail__copy h2 { font-size: clamp(2rem, 3.5vw, 3rem); }
  .page-about .about-intro__grid > div:first-child,
  .page-about .about-intro__grid > div:last-child { padding: 50px 42px; }
  .page-contact .contact__grid { gap: 47px; }
}

@media (max-width: 760px) {
  .page-services .service-jump { padding: 11px 0; overflow-x: auto; }
  .page-services .service-jump .container {
    display: flex;
    width: max-content;
    min-width: 100%;
    gap: 8px;
    padding-inline: 20px;
  }
  .page-services .service-jump a {
    flex: none;
    min-width: 165px;
    min-height: 53px;
    padding: 9px 14px;
    white-space: normal;
  }
  .page-services .service-detail { padding-block: 70px; }
  .page-services .service-detail__grid { grid-template-columns: 1fr; gap: 33px; }
  .page-services .service-detail:nth-of-type(odd) .service-detail__media { order: 0; }
  .page-services .service-detail__media { height: clamp(330px, 70vw, 470px); }
  .page-services .service-detail__copy { max-width: none; }
  .page-services .service-detail__copy h2 { font-size: clamp(2.18rem, 6vw, 2.85rem); }

  .page-projects .project-gallery .section-head { margin-bottom: 34px; }
  .page-projects .project-gallery__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .page-projects .gallery-card,
  .page-projects .gallery-card:first-child,
  .page-projects .gallery-card:nth-child(2),
  .page-projects .gallery-card:nth-child(3),
  .page-projects .gallery-card:nth-child(4),
  .page-projects .gallery-card:nth-child(5) { grid-column: auto; min-height: 290px; }
  .page-projects .gallery-card:first-child { grid-column: 1 / -1; min-height: 440px; }
  .page-projects .video-feature__grid { grid-template-columns: 1fr; gap: 40px; }
  .page-projects .video-feature__media { min-height: 0; }

  .page-about .about-intro__grid { grid-template-columns: 1fr; min-height: 0; }
  .page-about .about-intro__grid > div:first-child { min-height: 320px; }
  .page-about .about-intro__grid > div:last-child { padding: 43px 20px 0; }
  .page-about .approach__grid { grid-template-columns: 1fr; }
  .page-about .approach article { min-height: 0; padding: 29px 5px; border-right: 0; border-bottom: 1px solid #cadad7; }
  .page-about .approach article:last-child { border-bottom: 0; }
  .page-about .approach article span { margin-bottom: 18px; }
  .page-about .about-photo { min-height: 0; padding-block: 75px; }
  .page-about .about-photo .container { justify-content: center; }

  .page-contact .contact__grid { grid-template-columns: 1fr; gap: 38px; }
  .page-contact .contact-form { order: 0; }
  .page-contact .contact__intro { order: -1; }
  .page-contact .contact__intro { padding-top: 0; }
  .page-contact .contact__info { margin-top: 34px; }
  .page-contact .contact__line { margin-block: 30px 22px; }
}

@media (max-width: 520px) {
  .page-services .service-detail__media { height: 340px; }
  .page-services .service-detail__copy h2 { font-size: clamp(2.06rem, 9vw, 2.55rem); }
  .page-projects .project-gallery__grid { grid-template-columns: 1fr; }
  .page-projects .gallery-card,
  .page-projects .gallery-card:first-child,
  .page-projects .gallery-card:nth-child(2),
  .page-projects .gallery-card:nth-child(3),
  .page-projects .gallery-card:nth-child(4),
  .page-projects .gallery-card:nth-child(5) { grid-column: auto; min-height: 330px; }
  .page-projects .gallery-card__caption { left: 22px; right: 22px; bottom: 22px; }
  .page-projects .video-feature__media { padding: 15px; border-radius: 0 0 0 42px; }
  .page-projects .video-feature video { max-height: 480px; }
  .page-about .about-intro__grid > div:first-child { padding: 43px 26px; border-radius: 0 0 0 50px; }
  .page-about .about-intro__grid > div:last-child { padding: 36px 5px 0; }
  .page-about .about-intro h2 { font-size: clamp(2.1rem, 9vw, 2.7rem); }
  .page-about .about-photo__message { padding: 38px 27px; border-radius: 55px 4px 55px 4px; font-size: clamp(1.8rem, 8vw, 2.55rem); }
  .page-contact .contact-form { padding: 30px 22px; border-radius: 0 0 0 46px; }
  .page-contact .contact-form__row { grid-template-columns: 1fr; }
  .page-contact .contact-form .button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .page-services .service-detail__media img,
  .page-projects .gallery-card img,
  .page-projects .gallery-card__caption svg { transition: none; }
}
