/* MARESA: un recorrido visual compacto, con más presencia para cada imagen. */
.wrap { width: min(100% - 7vw, 1460px); }
.section-pad { padding: clamp(64px, 7vw, 100px) 0; }
main section[id] { scroll-margin-top: 72px; }

.hero { height: min(720px, 100svh); min-height: 620px; }
.hero-content { padding-top: clamp(160px, 20vh, 205px); }
.hero h1 { font-size: clamp(58px, 6.1vw, 94px); max-width: 970px; margin-bottom: 18px; }
.hero-copy { font-size: clamp(16px, 1.15vw, 18px); line-height: 1.6; margin-bottom: 27px; }
.hero-bottom { min-height: 72px; }

.intro { border-bottom: 1px solid #d9dfd7; }
.intro-grid { grid-template-columns: 23% 1fr; gap: 3vw; }
.statement { font-size: clamp(48px, 5.3vw, 78px); margin-bottom: 28px; }
.intro-detail { max-width: 820px; }
.intro-detail p { font-size: 16px; line-height: 1.7; }
.intro-watermark { font-size: clamp(155px, 22vw, 340px); opacity: .28; }
.round-arrow { height: 56px; width: 56px; font-size: 24px; }

.section-head { margin-bottom: 38px; }
.section-head h2, .process h2, .contact h2 { font-size: clamp(48px, 4.8vw, 74px); }
.services-layout { grid-template-columns: 1.06fr .94fr; gap: 4vw; }
.service-item { min-height: 80px; gap: 20px; }
.service-name { font-size: clamp(25px, 2.3vw, 35px); }
.service-no { font-size: 19px; }
.service-visual { min-height: 400px; }
.service-visual-caption { bottom: 24px; left: 25px; right: 25px; }

/* Esta pausa fotográfica conserva su composición original. */
.feature-content.wrap { width: min(100% - 8vw, 1600px); }

.process-header { grid-template-columns: .9fr 1.5fr .9fr; gap: 3vw; margin-bottom: 38px; }
.process-header > p:last-child { font-size: 15px; }
.step { min-height: 210px; padding: 20px 3vw 0 0; }
.step + .step { padding-left: 3vw; }
.step-symbol { font-size: 30px; margin: 13px 0 10px; }
.step h3 { font-size: 24px; margin-bottom: 10px; }
.step p { line-height: 1.55; }

.contact { grid-template-columns: 45% 55%; min-height: 650px; }
.contact-content { padding: clamp(54px, 6vw, 85px) clamp(38px, 5.5vw, 90px); }
.contact h2 { margin: 15px 0 17px; }
.contact-content > p:not(.section-kicker) { margin-bottom: 22px; line-height: 1.6; }
.contact select, .contact textarea { margin-bottom: 19px; padding: 10px 0 12px; }

.footer { padding-top: 55px; }
.footer-top { padding-bottom: 50px; }
.footer-top p { margin-top: 20px; }

@media (max-width: 800px) {
  .hero { height: 100svh; min-height: 620px; }
  .hero-content { padding-top: clamp(155px, 21vh, 190px); }
  .hero h1 { font-size: clamp(55px, 8.5vw, 70px); }
  .intro-grid { display: grid; grid-template-columns: 22% 1fr; gap: 20px; }
  .intro-grid > .section-kicker { margin: 5px 0 0; }
  .statement { font-size: clamp(48px, 7.1vw, 62px); margin-bottom: 22px; }
  .intro-detail p { font-size: 15px; }
  .section-head { margin-bottom: 32px; }
  .section-head h2, .process h2, .contact h2 { font-size: clamp(45px, 6.8vw, 58px); }
  .services-layout { grid-template-columns: 1.03fr .97fr; gap: 24px; }
  .service-item { min-height: 75px; gap: 12px; }
  .service-name { font-size: clamp(22px, 3.2vw, 28px); }
  .service-no { min-width: 26px; font-size: 17px; }
  .service-icon { font-size: 22px; }
  .service-visual { min-height: 375px; }
  .process-header { display: grid; grid-template-columns: 25% 1fr; gap: 0 20px; margin-bottom: 30px; }
  .process-header .section-kicker { grid-column: 1; grid-row: 1 / 3; margin-top: 5px; }
  .process-header h2 { grid-column: 2; margin: 0 0 12px; }
  .process-header > p:last-child { grid-column: 2; margin: 0; }
  .step { min-height: 190px; padding-right: 15px; }
  .step + .step { padding-left: 18px; }
  .step h3 { font-size: 21px; }
  .step p { font-size: 13px; }
  .contact { grid-template-columns: 42% 58%; min-height: 0; }
  .contact-photo { height: auto; }
  .contact-content { padding: 48px 34px 52px; }
  .contact-content > p:not(.section-kicker) { font-size: 14px; }
}

@media (max-width: 640px) {
  .wrap { width: min(100% - 36px, 540px); }
  .section-pad { padding: 48px 0; }
  main section[id] { scroll-margin-top: 62px; }
  .hero { height: min(700px, 100svh); min-height: 620px; }
  .hero-content { padding-top: 145px; }
  .hero h1 { font-size: clamp(43px, 10.4vw, 58px); line-height: 1.08; }
  .hero-copy { font-size: 15px; line-height: 1.5; margin-bottom: 23px; }
  .hero-bottom { min-height: 58px; }
  .intro-grid { display: block; }
  .intro-grid > .section-kicker { margin-bottom: 23px; }
  .statement { font-size: clamp(42px, 9.5vw, 54px); margin-bottom: 18px; }
  .intro-detail { gap: 18px; }
  .intro-detail p { font-size: 14px; line-height: 1.6; }
  .round-arrow { height: 44px; width: 44px; font-size: 21px; }
  .intro-watermark { font-size: 41vw; }
  .section-head { gap: 12px; margin-bottom: 26px; }
  .section-head h2, .process h2, .contact h2 { font-size: clamp(40px, 9.5vw, 53px); }
  .section-head > p { font-size: 14px; line-height: 1.5; }
  .services-layout { display: flex; flex-direction: column; gap: 18px; }
  .service-visual { order: -1; height: 250px; min-height: 250px; }
  .service-visual-caption { bottom: 18px; left: 18px; right: 18px; }
  .service-visual-caption h3 { font-size: 31px; margin: 7px 0 5px; }
  .service-visual-caption p { font-size: 12px; line-height: 1.35; }
  .service-item { min-height: 58px; gap: 13px; }
  .service-name { font-size: clamp(21px, 5.4vw, 27px); }
  .service-no { font-size: 16px; }
  .service-icon { font-size: 20px; }
  .process-header { display: block; margin-bottom: 22px; }
  .process-header .section-kicker { margin-bottom: 20px; }
  .process-header h2 { margin: 0 0 14px; }
  .process-header > p:last-child { font-size: 14px; line-height: 1.55; }
  .steps { display: block; }
  .step, .step + .step { display: grid; grid-template-columns: 28px 1fr; column-gap: 14px; min-height: 0; padding: 14px 0; border-right: 0; border-bottom: 1px solid #c7d0c9; }
  .step-no { grid-column: 1; grid-row: 1 / 3; padding-top: 3px; }
  .step-symbol { display: none; }
  .step h3 { grid-column: 2; font-size: 21px; margin-bottom: 5px; }
  .step p { grid-column: 2; max-width: none; font-size: 13px; line-height: 1.5; margin: 0; }
  .contact { display: block; }
  .contact-photo { height: 180px; }
  .contact-content { padding: 44px 20px 48px; }
  .contact h2 { margin: 15px 0; }
  .contact-content > p:not(.section-kicker) { margin-bottom: 20px; }
  .contact select, .contact textarea { margin-bottom: 16px; }
  .footer { padding-top: 38px; }
  .footer-top { padding-bottom: 26px; }
  .footer-top p { margin-top: 14px; line-height: 1.5; }
  .footer-phone { margin-top: 12px; }
  .footer nav { margin-top: 24px; }
  .footer-top-link { margin-top: 22px; }
  .footer-bottom { padding: 17px 0; }
}
