/* Composiciones interiores. La escala, los colores y los componentes son comunes. */
@media (min-width: 1024px) {
  .interior-page h1 { font-size: 65px; }
}
.interior-banner { position: relative; height: clamp(260px, 27.34375vw, 525px); background: var(--negro); }
.interior-banner > .hero-image { object-position: center; }
.interior-intro h1 { max-width: 1240px; }
.interior-intro > .container > .text-large { max-width: 650px; }
.interior-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 64px; align-items: start; }
.interior-split > *, .interior-columns > *, .interior-cards > * { min-width: 0; }
.interior-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; align-items: start; }
.interior-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; align-items: start; }
.interior-cards h3, .principles h3, .process-details h3, .photo-section h3 { font-size: 18px; margin-bottom: 13px; }
.timeline h3 { font-size: 18px; margin-bottom: 0; }
.timeline { margin: 0; padding: 0; list-style: none; }
.timeline li + li { margin-top: 32px; }
.timeline .timeline-year { margin-bottom: 10px; }
.ruled-card { border-top: 2px solid var(--negro); padding-top: 26px; }
.number-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 50px 48px; margin-top: 45px; }
.number-grid .stat-number { margin-block: 12px; }
.former-number { display: flex; align-items: center; gap: 10px; color: var(--gris); font-size: 19px; text-decoration-thickness: 1px; }
.growth-arrow { display: block; width: 1em; height: 1em; flex-shrink: 0; }
.number-symbol-section, .process-section { position: relative; isolation: isolate; }
.number-symbol-section::after, .process-section::after { content: ""; position: absolute; bottom: -48px; left: max(24px, calc((100% - var(--container-max)) / 2)); width: 252px; height: 330px; background: url("../img/Topo-Intxausti.svg") center / contain no-repeat; z-index: 1; pointer-events: none; }
.number-symbol-section { z-index: 1; padding-bottom: calc(var(--section-spacing) + 45px); }
.process-section::after { bottom: 50px; opacity: .55; filter: grayscale(1) brightness(0) invert(1); }
.photo-section { position: relative; color: var(--blanco); background: var(--negro); }
.photo-section > .section-background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.photo-section > .container { position: relative; }
.photo-section h2, .photo-section .section-tag { color: var(--blanco); }
.photo-section .interior-split { padding-bottom: 35px; }
.photo-values article + article { margin-top: 38px; }
/* Compensar el inicio visible de Raleway frente a PT Sans, con las fuentes locales. */
.group-intro-content { padding-top: 1px; }
.group-intro-content > .group-section-intro { margin-bottom: 75px; }
.group-intro-content > .number-grid { margin-top: 0; }

.section-lead { max-width: 700px; margin-bottom: 44px; }
.section-lead h2 { margin-bottom: 30px; }
.company-card > img, .capability-card > img, .capability-visual { width: 100%; height: auto; aspect-ratio: 1672 / 941; object-fit: cover; margin-bottom: 28px; }
.eyebrow { font-size: 12px; line-height: 1.4; margin-bottom: 12px; text-transform: uppercase; }
.company-card h3, .capability-card h3 { font-size: 18px; }
.card-meta { list-style: none; margin: 18px 0 0; padding: 0; }
.card-meta li::before { content: "— "; }
.principles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; margin-top: 75px; }
/* Compartir la fila de subtítulos: los párrafos comienzan a la misma altura. */
.principles > .ruled-card { display: grid; grid-template-rows: subgrid; grid-row: span 2; row-gap: 13px; }
.principles h3 { margin-bottom: 0; }
.philosophy-heading { max-width: 1160px; margin-bottom: 0; }
.project-cta { position: relative; padding-block: 150px; color: var(--blanco); background: var(--negro) url("../img/Hablamos.webp") center / cover no-repeat; }
.project-cta h2 { color: var(--blanco); margin-bottom: 0; }
.project-cta .arrow-icon { color: var(--blanco); }
.project-cta-content { display: flex; flex-direction: column; justify-content: center; align-self: stretch; min-width: 0; }
.project-cta-content > .text-large { margin-bottom: 0; }
.project-cta-content .arrow-button { margin-bottom: 0; }

.cta-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.cta-actions { display: flex; flex-wrap: wrap; gap: 8px 30px; margin-top: 24px; }
.project-cta .arrow-button, .application-cta .arrow-button { color: var(--blanco); }
.project-cta .arrow-button:hover, .project-cta .arrow-button:focus-visible { color: var(--verde); }
.process-phases { display: grid; gap: 55px; }
.process-phase { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 20px; }
.phase-number { padding-top: 0; }
.process-phase > div > .eyebrow { font-size: 19px; line-height: 1.35; }
.process-phase > div > h3 { font-weight: 600; margin-bottom: 13px; }
.process-details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 30px; }
.process-details > .ruled-card { display: grid; grid-template-rows: subgrid; grid-row: span 2; row-gap: 13px; }
.process-details h3 { font-size: 16px; line-height: 1.4; margin-bottom: 0; }
.methodology-section { isolation: isolate; }
.methodology-section::before { content: ""; position: absolute; inset: 0; z-index: 1; background: rgb(0 0 0 / 20%); pointer-events: none; }
.methodology-section > .container { z-index: 2; }
@media (min-width: 1024px) {
  .methodology-columns { align-items: stretch; row-gap: 0; }
  .methodology-columns > article { display: grid; grid-template-rows: subgrid; grid-row: span 3; }
  .methodology-columns > article > p { margin-bottom: 0; }
}

.methodology-list { margin: 25px 0 0; padding-left: 20px; }
.methodology-list li + li { margin-top: 15px; }
.capability-visual { display: grid; place-items: center; background: var(--fondo-seccion); }
.capability-visual img { width: 55px; height: 72px; }
.certification-content > h3 { font-size: 18px; }
.interior-certifications { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 30px 0 45px; align-items: start; }
.interior-certifications figure { display: flex; flex-direction: column; align-items: center; gap: 18px; text-align: center; }
.interior-certifications img { width: 100%; height: 100px; object-fit: contain; }
.carbon-records { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 0; margin: 25px 0 0; list-style: none; }
.carbon-records li { border: 2px solid var(--gris); padding: 14px; }
.carbon-records span, .carbon-records strong { display: block; }
.carbon-records .carbon-label { font-size: 12px; }
.carbon-records strong { font-size: 28px; line-height: 1.2; margin-block: 6px; }
.carbon-records .carbon-status { font-size: 14px; }
.carbon-records .is-active { border-color: var(--verde); }
.environment-metrics { margin-top: 60px; }
.environment-metrics h3 { font-size: 21px; }
.environment-metrics .stat-number { font-size: 48px; }
.team-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.team-benefits h3 { font-size: 18px; }
.team-editorial-images { display: grid; grid-template-columns: 1fr 2fr; gap: 35px; margin-top: 45px; align-items: start; }
.team-editorial-images img { width: 100%; height: auto; }
.team-editorial-images img:last-child { margin-top: 60px; }
.offers-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-bottom: 40px; }
.offers-heading h2 { margin-bottom: 0; }
.offers-heading p { font-size: 14px; text-transform: uppercase; }
.offers-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: end; gap: 16px 24px; }
.offers-tools p { margin: 0; }
.offers-view-switch:not([hidden]) { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.offers-view-switch { width: 44px; height: 44px; padding: 10px; border: 1px solid var(--negro); }
.offers-view-switch svg { width: 22px; height: 22px; }
.offers-view-switch svg[hidden] { display: none; }
.offers-view-switch:hover { border-color: var(--verde); }
.job-list { display: grid; grid-template-columns: 1fr; gap: 24px; max-width: 1060px; margin-inline: auto; }
.job-link { display: flex; gap: 30px; justify-content: space-between; align-items: center; min-width: 0; min-height: 150px; padding: 30px 40px; border: 1px solid var(--negro); }
.job-link > div { min-width: 0; }
.job-link h3 { font-size: 21px; margin-bottom: 13px; }
.job-link p:last-child { margin-bottom: 0; }
.job-link .arrow-icon { flex-shrink: 0; transition: transform .3s ease; }
.job-link:hover .arrow-icon { transform: translateX(5px); }
.job-list[data-view="grid"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* Las tarjetas verticales solo se usan cuando la cuadrícula tiene varias columnas. */
@media (min-width: 768px) {
  .job-list[data-view="grid"] .job-link { flex-direction: column; align-items: stretch; gap: 24px; padding: 28px; }
  .job-list[data-view="grid"] .arrow-icon { align-self: end; }
}
.application-cta { padding-block: 150px; background: var(--verde); color: var(--blanco); }
.application-cta h2 { color: var(--blanco); margin-bottom: 0; }
.application-cta .cta-layout > div { display: flex; flex-direction: column; justify-content: center; align-self: stretch; gap: 24px; min-width: 0; }
.application-cta .text-large, .application-cta .arrow-button { margin-bottom: 0; }
.application-cta .arrow-button { align-self: start; }
.application-cta .arrow-button .arrow-icon { color: var(--blanco); align-self: center; }
.application-cta .arrow-button:hover, .application-cta .arrow-button:focus-visible { color: var(--negro); }
.page-contact .site-header { background: var(--negro); }
.page-contact main { padding-top: 145px; }
.contact-page-section { position: relative; }
.contact-page-section > .linkedin-tab { top: 110px; }
.contact-page-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 90px; align-items: start; }
.contact-page-form > .text-large { margin-bottom: 50px; }
.contact-page-form .contact-form { margin-bottom: 0; }
.contact-page-offices { display: block; }
.contact-page-offices .contact-direct { margin-bottom: 45px; }
.office-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
.contact-page-offices .office-card { display: block; }
.office-card > img { width: 100%; height: auto; aspect-ratio: 1170 / 1345; object-fit: cover; margin-bottom: 20px; }
.office-card address { font-style: normal; }
.office-name { display: flex; align-items: baseline; gap: 8px; }
.office-name img { flex-shrink: 0; }
.office-card:hover .office-name img, .office-card:focus-visible .office-name img { animation: office-bounce .65s ease; }
.office-address { display: block; padding-left: 22px; }
.contact-panorama { width: 100%; height: auto; aspect-ratio: 2560 / 598; object-fit: cover; }

@media (min-width: 1600px) {
  .page-contact main { padding-top: 165px; }
}
@media (max-width: 1120px) {
  .job-list[data-view="grid"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .interior-columns { gap: 28px; }
  .principles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process-layout h2 { max-width: 650px; }
  .team-introduction > .text-large { max-width: 650px; }
  .contact-page-layout { gap: 40px; }
  .contact-page-offices .contact-direct { flex-direction: column; align-items: start; }
  .contact-page-offices .contact-phone > span { display: none; }
  .office-cards { gap: 20px; }
  .page-contact main { padding-top: 115px; }
}
/* En tablet, reservar todo el ancho al titular antes de mostrar el contenido. */
@media (max-width: 1179px) {
  .interior-split, .cta-layout { grid-template-columns: 1fr; gap: 35px; }
  .interior-split > h2, .cta-layout > h2 { margin-bottom: 0; }
  .group-intro-content { padding-top: 0; }
  .number-symbol-section::after, .process-section::after { display: none; }
}
@media (max-width: 1023px) {
  .interior-columns { grid-template-columns: 1fr; }
  .interior-cards { gap: 24px; }
  .number-grid { gap: 35px 24px; }
  .number-grid .stat-number { font-size: 42px; }
  .contact-page-layout { grid-template-columns: 1fr; gap: 50px; }
  .contact-page-offices .contact-direct { flex-direction: row; }
  .office-cards { max-width: 650px; gap: 30px; }
  .certification-layout { grid-template-columns: 1fr; }
  .certification-content { max-width: 700px; }
}
@media (max-width: 767px) {
  .group-intro-content { padding-top: 0; }
  .interior-banner { height: 260px; }
  .interior-banner .linkedin-tab { top: 120px; }
  .interior-intro h1 br { display: none; }
  .interior-split, .interior-columns, .interior-cards, .cta-layout { grid-template-columns: 1fr; gap: 30px; }
  .number-grid { margin-top: 30px; }
  .number-symbol-section { padding-bottom: var(--section-spacing); }
  .number-symbol-section::after { display: none; }
  .photo-section .interior-split { padding-bottom: 0; }
  .photo-section > .section-background { object-position: 60% center; }
  .photo-values article + article { margin-top: 30px; }
  .company-card > img, .capability-card > img, .capability-visual { margin-bottom: 22px; }
  .interior-cards { row-gap: 45px; }
  .principles { gap: 30px 22px; }
  .principles h3 { font-size: 18px; }
  .process-phase { grid-template-columns: 1fr; gap: 5px; }
  .process-phases { gap: 45px; }
  .process-details { grid-template-columns: 1fr; gap: 25px; }
  .interior-certifications { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px; }
  .interior-certifications figure:last-child { grid-column: 1 / -1; }
  .interior-certifications img { height: 76px; max-width: 180px; margin-inline: auto; }
  .carbon-records { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .environment-metrics { margin-top: 40px; }
  .team-benefits { grid-template-columns: 1fr; gap: 25px; }
  .team-editorial-images { gap: 20px; margin-top: 30px; }
  .team-editorial-images img:last-child { margin-top: 40px; }
  .offers-heading { align-items: start; flex-direction: column; margin-bottom: 30px; }
  .offers-heading p { margin: 0; }
  .offers-tools { justify-content: start; }
  .job-list { gap: 20px; }
  .job-list[data-view="grid"] { grid-template-columns: 1fr; }
  .job-link { min-height: 160px; padding: 25px 20px; gap: 16px; }
  .job-link h3 { font-size: 19px; }
  .job-link .arrow-icon { width: 28px; }
  .page-contact main { padding-top: 95px; }
  .contact-page-section > .linkedin-tab { top: 100px; }
  .contact-page-layout { gap: 45px; }
  .contact-page-form > .text-large { margin-bottom: 40px; }
  .office-cards { gap: 22px; }
  .contact-panorama { aspect-ratio: 4 / 3; }
}
@media (max-width: 374px) {
  .interior-page h2 { hyphens: auto; overflow-wrap: break-word; }
  .principles, .office-cards { grid-template-columns: 1fr; }
  .office-cards { max-width: 300px; }
  .number-grid .stat-number { font-size: 36px; }
}
@media (max-height: 650px) and (min-width: 768px) {
  .page-contact main { padding-top: 90px; }
}
@media (max-height: 550px) and (max-width: 767px) {
  .page-contact main { padding-top: 70px; }
}