/* SEO Solutions Peru - Case studies visual refinement 3.9.6.
   Only case-detail pages load this stylesheet; home and project listing are untouched. */
body.project-detail-page .project-detail-hero {
  min-height: 510px;
  padding: 128px 0 66px;
}
body.project-detail-page .project-detail-hero-inner {
  width: min(1100px, calc(100% - 72px));
  padding-inline: clamp(12px, 2.1vw, 32px);
  position: relative;
  z-index: 2;
}
body.project-detail-page .project-detail-hero h1 {
  max-width: 660px;
  font-size: clamp(2.1rem, 3.25vw, 3.45rem);
  line-height: 1.13;
  letter-spacing: -.032em;
  font-weight: 780;
  margin: 12px 0 17px;
  text-wrap: balance;
}
body.project-detail-page .project-detail-hero .lead {
  max-width: 610px;
  font-size: clamp(.98rem, 1.13vw, 1.11rem);
  line-height: 1.74;
  color: #c0d3e3;
  margin-bottom: 16px;
}
body.project-detail-page .project-detail-hero .eyebrow {
  font-size: .78rem;
  letter-spacing: .13em;
  margin-bottom: 10px;
}
body.project-detail-page .project-detail-hero .breadcrumbs {
  font-size: .85rem;
  line-height: 1.5;
  margin-bottom: 19px;
}
body.project-detail-page .project-detail-hero .case-meta {
  max-width: 610px;
  gap: 8px;
  margin: 15px 0 0;
}
body.project-detail-page .project-detail-hero .case-meta span {
  font-size: .79rem;
  padding: 5px 10px;
}
body.project-detail-page .project-detail-visual img {
  width: clamp(220px, 25vw, 365px);
  height: auto;
  max-height: 245px;
  padding: 19px;
  border-radius: 19px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 20px 64px rgba(0,0,0,.25);
  opacity: .91;
  transform: translateX(min(27vw, 435px));
}
body.project-detail-page .project-detail-hero::after {
  background: linear-gradient(90deg, rgba(2,10,19,.97) 0%, rgba(2,10,19,.94) 38%, rgba(2,10,19,.69) 66%, rgba(2,10,19,.24) 100%);
}
body.project-detail-page main > .section {
  padding-top: clamp(58px, 6vw, 84px);
  padding-bottom: clamp(58px, 6vw, 84px);
}
body.project-detail-page .project-detail-grid {
  width: min(1090px, calc(100% - 72px));
  padding-inline: clamp(12px, 1.8vw, 28px);
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: clamp(30px, 4vw, 58px);
  align-items: start;
}
body.project-detail-page .project-detail-grid h2 {
  font-size: clamp(1.65rem, 2.2vw, 2.35rem);
  line-height: 1.18;
  letter-spacing: -.027em;
  margin-bottom: 18px;
  text-wrap: pretty;
}
body.project-detail-page .project-detail-grid p {
  font-size: 1rem;
  line-height: 1.82;
  max-width: 70ch;
}
body.project-detail-page .project-client-card {
  min-height: 255px;
  padding: 24px;
  border-radius: 18px;
  gap: 8px;
}
body.project-detail-page .project-client-card img {
  width: min(100%, 260px);
  height: 105px;
  max-height: 105px;
  padding: 14px 20px;
  margin: 8px 0;
  object-fit: contain;
  border-radius: 13px;
}
body.project-detail-page .project-client-card strong {
  font-size: 1.05rem;
  line-height: 1.4;
}
body.project-detail-page .project-client-card p {
  font-size: .88rem;
  line-height: 1.65;
  max-width: 42ch;
}
body.project-detail-page .service-point-grid > div strong {
  font-size: .98rem;
  line-height: 1.55;
}
body.project-detail-page .project-approach-section .project-detail-grid {
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
}
body.project-detail-page .section-heading h2 {
  font-size: clamp(1.75rem, 2.4vw, 2.5rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}
body.project-detail-page .section-heading,
body.project-detail-page .service-case-card {
  max-width: 1090px;
  margin-inline: auto;
}
body.project-detail-page .service-case-card {
  padding: 32px 35px;
}
body.project-detail-page .service-case-card h2 {
  font-size: clamp(1.65rem, 2.3vw, 2.45rem);
  line-height: 1.18;
}
@media (max-width: 1180px) {
  body.project-detail-page .project-detail-visual img {
    width: min(30vw, 300px);
    transform: translateX(26vw);
    opacity: .65;
  }
  body.project-detail-page .project-detail-hero::after {
    background: linear-gradient(90deg, rgba(2,10,19,.98),rgba(2,10,19,.89) 55%,rgba(2,10,19,.48));
  }
}
@media (max-width: 980px) {
  body.project-detail-page .project-detail-hero { min-height: 0; padding: 117px 0 58px; }
  body.project-detail-page .project-detail-hero-inner { width: min(800px, calc(100% - 48px)); padding-inline: 12px; }
  body.project-detail-page .project-detail-hero h1 { max-width: 680px; font-size: clamp(2.05rem, 5vw, 2.85rem); }
  body.project-detail-page .project-detail-visual { align-items: start; padding-top: 95px; }
  body.project-detail-page .project-detail-visual img {
    width: min(39vw, 235px);
    max-height: 155px;
    padding: 12px;
    transform: translateX(29vw);
    opacity: .19;
  }
  body.project-detail-page .project-detail-hero::after {
    background: linear-gradient(90deg, rgba(2,10,19,.96), rgba(2,10,19,.78));
  }
  body.project-detail-page .project-detail-grid,
  body.project-detail-page .project-approach-section .project-detail-grid {
    grid-template-columns: minmax(0,1fr);
    width: min(800px, calc(100% - 48px));
    gap: 26px;
    padding-inline: 12px;
  }
  body.project-detail-page .project-client-card { width: 100%; max-width: 460px; margin-inline: auto; }
}
@media (max-width: 720px) {
  body.project-detail-page .project-detail-hero { padding: 108px 0 47px; }
  body.project-detail-page .project-detail-hero-inner { width: calc(100% - 38px); padding-inline: 5px; }
  body.project-detail-page .project-detail-hero .breadcrumbs { font-size: .79rem; margin-bottom: 17px; }
  body.project-detail-page .project-detail-hero h1 {
    font-size: clamp(1.83rem, 7.7vw, 2.45rem);
    max-width: 100%;
    line-height: 1.16;
    margin: 8px 0 14px;
  }
  body.project-detail-page .project-detail-hero .lead { font-size: .97rem; line-height: 1.72; }
  body.project-detail-page .project-detail-visual img {
    width: min(48vw, 184px);
    max-height: 102px;
    margin-left: auto;
    margin-right: 5vw;
    padding: 8px;
    transform: none;
    opacity: .16;
  }
  body.project-detail-page .project-detail-hero::after {
    background: linear-gradient(180deg,rgba(2,10,19,.84),rgba(2,10,19,.9) 60%,rgba(2,10,19,.98));
  }
  body.project-detail-page .project-detail-grid,
  body.project-detail-page .project-approach-section .project-detail-grid {
    width: calc(100% - 38px);
    padding-inline: 5px;
  }
  body.project-detail-page .project-detail-grid h2 { font-size: clamp(1.55rem, 6vw, 1.92rem); }
  body.project-detail-page .project-detail-grid p { font-size: .97rem; line-height: 1.78; }
  body.project-detail-page .project-client-card { padding: 20px; min-height: 0; }
  body.project-detail-page .project-client-card img { height: 85px; max-height: 85px; width: min(100%, 220px); }
  body.project-detail-page .section-heading h2 { font-size: 1.7rem; }
  body.project-detail-page .service-case-card { padding: 25px 22px; }
}
