@font-face {
  font-family: "IBM Plex Sans Panel";
  src: url("./IBM_Plex_Sans/IBMPlexSans-VariableFont_wdth,wght.ttf") format("truetype");
  font-weight: 100 700; font-display: swap;
}
html { scrollbar-gutter: stable; }
body.site-layer-open { overflow: hidden; }
.site-layer {
  position: fixed; inset: 0; width: min(84rem, calc(100% - 4rem));
  max-width: none; max-height: calc(100svh - 4rem); margin: auto;
  border: 0; padding: 0; background: transparent; color: #f4eee3;
  overflow: visible; opacity: 0; transform: translateY(12px);
  transition: opacity 280ms ease, transform 360ms cubic-bezier(.2,.65,.3,1);
}
.site-layer[open] { display: block; }
.site-layer.is-visible { opacity: 1; transform: translateY(0); }
.site-layer::backdrop { background: rgb(6 6 8 / 24%); backdrop-filter: blur(3px); }
.site-layer__sheet {
  max-height: calc(100svh - 4rem); overflow-y: auto; overscroll-behavior: contain;
  padding: clamp(1.5rem, 3.6vw, 3.6rem);
  background: linear-gradient(115deg, rgb(222 193 144 / 2%), transparent 45%), rgb(20 20 19 / 84%);
  box-shadow: 0 18px 90px rgb(0 0 0 / 14%);
}
.site-layer__header { position: sticky; top: 0; z-index: 2; display: flex; align-items: start; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.site-layer__header h2 { margin: 0; font: 400 clamp(2.8rem, 6.5vw, 6rem)/1.05 "IBM Plex Serif", Georgia, serif; letter-spacing: -.045em; }
.site-layer__close { position: sticky; top: 0; flex: none; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; padding: 0; border: 0; background: transparent; color: #e4d5ba; font: 300 2rem/1 "IBM Plex Sans Panel", sans-serif; cursor: pointer; }
.site-layer__close:hover { color: #fff8eb; }
.site-layer a, .site-layer button { -webkit-tap-highlight-color: transparent; }
.site-layer :focus-visible { outline: 1px solid #d8b37a; outline-offset: 5px; }
.services-editorial { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.services-roles { display: grid; gap: .65rem; list-style: none; padding: 0; margin: 0; }
.services-roles li { font: 400 clamp(1.15rem, 2.3vw, 2rem)/1.35 "IBM Plex Serif", Georgia, serif; letter-spacing: -.02em; }
.services-enquiry { margin-top: clamp(2rem, 5vw, 4rem); font-family: "IBM Plex Sans Panel", sans-serif; }
.services-enquiry h3 { margin-bottom: .5rem; font: 400 1rem/1.5 "IBM Plex Sans Panel", sans-serif; }
.services-enquiry p { max-width: 31ch; color: #bfb8ac; font: 400 .875rem/1.65 "IBM Plex Sans Panel", sans-serif; }
.services-enquiry a { display: inline-block; margin-top: 1.25rem; color: #dfc79f; font-size: .875rem; text-underline-offset: .4em; }
.services-editorial__photos { display: grid; grid-template-columns: 1.65fr .8fr; gap: .75rem; max-height: 31rem; }
.services-editorial__photos img { display: block; width: 100%; height: 100%; min-height: 0; object-fit: cover; filter: saturate(.82); }
.services-editorial__main-photo { aspect-ratio: 3 / 5; max-height: 31rem; }
.services-editorial__small-photos { min-height: 0; display: grid; grid-template-rows: 1fr 1fr; gap: .75rem; overflow: hidden; }
.projects-layer-frame { display: block; width: 100%; height: min(66svh, 45rem); border: 0; background: transparent; }
.site-layer[data-view="cotiza"] .site-layer__header { margin-bottom: 0; justify-content: end; }
.site-layer[data-view="cotiza"] #layer-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.quote-section .quote-editorial { position: relative; z-index: 4; max-width: 80rem; margin-inline: auto; }
.quote-editorial { padding: 0 clamp(0rem, 2vw, 2rem) 3rem; }
.quote-section .quote-editorial__title, .quote-editorial__title {
  margin: 0; text-align: left; color: #e4d5ba;
  font: 400 clamp(3.1rem, 7.8vw, 7.5rem)/1.06 "IBM Plex Serif", Georgia, serif; letter-spacing: -.055em;
}
.quote-editorial__title span { display: block; }
.quote-editorial__title span + span { padding-left: 1.15em; }
.quote-editorial__details { display: grid; justify-items: start; gap: 1rem; margin-top: 3.5rem; font: 400 clamp(.9rem, 1.25vw, 1.1rem)/1.5 "IBM Plex Sans Panel", sans-serif; }
.quote-editorial__details p { color: #b6afa3; font-size: .8rem; margin: 0 0 .2rem; }
.quote-editorial__details a { display: inline-block; color: #efe5d4; text-decoration: none; text-underline-offset: .35em; transition: color 180ms ease; }
.quote-editorial__details a:hover { color: #d8b37a; text-decoration: underline; }
.quote-editorial__details a span { margin-left: .65em; color: #c5b79f; font-size: .82em; }
.about-pending { font: 400 1rem/1.6 "IBM Plex Sans Panel", sans-serif; color: #bfb8ac; padding: 3rem 0 6rem; }
@media(max-width:48rem) {
  .site-layer { width: calc(100% - 1.25rem); max-height: calc(100svh - 1.25rem); }
  .site-layer__sheet { max-height: calc(100svh - 1.25rem); padding: 1.4rem; }
  .site-layer__header { margin-bottom: 1.8rem; gap: 1rem; }
  .site-layer__header h2 { font-size: clamp(2.6rem, 11vw, 4rem); }
  .services-editorial { grid-template-columns: 1fr; gap: 2rem; }
  .services-roles li { font-size: clamp(1.1rem, 5vw, 1.45rem); }
  .services-editorial__photos { max-height: 22rem; }
  .services-editorial__main-photo { max-height: 22rem; }
  .projects-layer-frame { height: 70svh; }
  .site-layer[data-view="proyectos"] .site-layer__sheet { padding-inline: 0; }
  .site-layer[data-view="proyectos"] .site-layer__header { padding-inline: 1.4rem; }
  .quote-section { padding-inline: 1.4rem; }
  .quote-section .quote-editorial__title, .quote-editorial__title { font-size: clamp(2.7rem, 12.8vw, 5rem); }
  .quote-editorial { padding-inline: 0; }
  .quote-editorial__details { margin-top: 2.5rem; gap: .9rem; }
}
@media(prefers-reduced-motion:reduce) { .site-layer, .quote-editorial__details a { transition: none; } }

/* Restored service photography and values; the profile list remains secondary. */
.site-layer__sheet { border-radius: .625rem; }
.services-showcase { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(2rem, 5vw, 5rem); }
.services-values { display: grid; gap: clamp(1.6rem, 3vw, 2.8rem); padding: 0; margin: 0; list-style: none; }
.services-values li { display: grid; grid-template-columns: 2rem minmax(0,1fr); align-items: center; gap: 1.5rem; }
.services-values img { display: block; width: 2rem; height: 2rem; object-fit: contain; }
.services-values span { color: #f4eee3; font: 400 clamp(.8rem,1.2vw,1rem)/1.5 "IBM Plex Sans Panel",sans-serif; letter-spacing: .15em; text-transform: uppercase; }
.services-cycle { width: min(100%, 24rem); padding-left: 2.2rem; justify-self: center; }
.services-cycle__figure { position: relative; margin: 0; opacity: 1; transition: opacity 240ms ease-in-out; }
.services-cycle__figure.is-changing { opacity: 0; }
.services-cycle__figure img { display: block; width: 100%; height: min(47svh, 27rem); aspect-ratio: 4/5; object-fit: contain; object-position: center; }
.services-cycle[data-profile="1"] .services-cycle__figure img { object-fit: contain; }
.services-cycle__label { position: absolute; right: calc(100% + .9rem); top: 50%; writing-mode: vertical-rl; transform: translateY(-50%) rotate(180deg); color: #d8b37a; font: 400 .875rem/1 "IBM Plex Sans Panel",sans-serif; letter-spacing: .3em; text-transform: uppercase; white-space: nowrap; }
.services-cycle__controls { display: flex; justify-content: center; align-items: center; gap: .35rem; margin-top: .4rem; }
.services-cycle__controls button { min-height: 2.75rem; min-width: 2.75rem; padding: .4rem; border: 0; background: transparent; color: #c9bda7; font: 400 .66rem/1.4 "IBM Plex Sans Panel",sans-serif; letter-spacing: .04em; cursor: pointer; }
.services-cycle__controls button:hover { color: #f4eee3; }
.services-profiles { margin-top: 3.5rem; }
.services-profiles h3 { margin: 0 0 1.2rem; color: #d8b37a; font: 400 .75rem/1.5 "IBM Plex Sans Panel",sans-serif; letter-spacing: .08em; }
.services-profile-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .75rem 2rem; margin: 0; padding: 0; list-style: none; }
.services-profile-list li { color: #e6dfd2; font: 400 clamp(.9rem,1.3vw,1.1rem)/1.55 "IBM Plex Sans Panel",sans-serif; }
.services-restored > .services-enquiry { margin-top: 3rem; padding-bottom: 1rem; }
@media(max-width:48rem) {
  .services-showcase { grid-template-columns: 1fr; gap: 2.4rem; }
  .services-values { grid-template-columns: 1fr 1fr; gap: 1.5rem .8rem; }
  .services-values li { grid-template-columns: 1.3rem minmax(0,1fr); gap: .6rem; }
  .services-values img { width: 1.3rem; height: 1.3rem; }
  .services-values span { font-size: clamp(.58rem,2.2vw,.75rem); letter-spacing: .08em; }
  .services-cycle { width: min(100%,21rem); padding-left: 2rem; }
  .services-cycle__figure img { height: min(47svh,25rem); }
  .services-cycle__label { font-size: .75rem; letter-spacing: .23em; }
  .services-profiles { margin-top: 2rem; }
  .services-profile-list { grid-template-columns: 1fr 1fr; gap: .7rem 1rem; }
}
@media(prefers-reduced-motion:reduce) { .services-cycle__figure { transition: none; } }

/* Let the desktop gallery use the space below its heading without overflowing. */
@media (min-width: 56rem) and (hover: hover) and (pointer: fine) {
  .site-layer[data-view="proyectos"] .site-layer__sheet {
    height: calc(100svh - 4rem);
    display: flex;
    flex-direction: column;
  }
  .site-layer[data-view="proyectos"] .site-layer__header { flex: 0 0 auto; }
  .site-layer[data-view="proyectos"] .site-layer__content { flex: 1 1 0; min-height: 0; }
  .site-layer[data-view="proyectos"] .projects-layer-frame { height: 100%; }
}
