@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700;9..144,800&family=Manrope:wght@400;500;600;700;800&display=swap');

    :root {
      --piedra: #e5e5e3;
      --piedra-2: #f3f2ee;
      --carbon: #1f1f1f;
      --carbon-soft: rgba(31, 31, 31, .72);
      --roble: #8a705b;
      --nogal: #5a4636;
      --line: rgba(31, 31, 31, .14);
      --white: #ffffff;
      --max: 1560px;
      --pad: clamp(20px, 4vw, 56px);
    }

    * { box-sizing: border-box; }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      background: var(--piedra);
      color: var(--carbon);
      font-family: Manrope, Arial, sans-serif;
      font-weight: 500;
      line-height: 1.55;
    }

    body.page-enter .page-shell {
      animation: pageEnterSoft .9s cubic-bezier(.16, 1, .3, 1) both;
    }

    body.is-page-leaving .page-shell {
      animation: pageLeaveSoft .32s cubic-bezier(.45, 0, .2, 1) forwards;
    }

    img { max-width: 100%; display: block; }

    a {
      color: inherit;
      text-decoration: none;
    }

    .skip-link {
      position: fixed;
      top: 10px;
      left: 10px;
      z-index: 2000;
      padding: 12px 16px;
      background: var(--carbon);
      color: var(--piedra-2);
      transform: translateY(-160%);
      transition: transform .2s ease;
    }

    .skip-link:focus {
      transform: translateY(0);
    }

    :focus-visible {
      outline: 3px solid var(--roble);
      outline-offset: 4px;
    }

    .page-shell {
      background: var(--piedra);
    }

    .scroll-progress {
      position: fixed;
      inset: 0 auto auto 0;
      z-index: 50;
      width: 100%;
      height: 3px;
      background: transparent;
      pointer-events: none;
    }

    .scroll-progress span {
      display: block;
      width: calc(var(--scroll, 0) * 100%);
      height: 100%;
      background: var(--roble);
      transform-origin: left center;
    }

    .site-header {
      position: fixed;
      inset: 0 0 auto 0;
      z-index: 20;
      padding: 18px var(--pad);
      transition: background .25s ease, border-color .25s ease;
      border-bottom: 1px solid transparent;
    }

    .site-header.is-scrolled {
      background: rgba(229, 229, 227, .92);
      border-color: var(--line);
      backdrop-filter: blur(16px);
    }

    .nav {
      max-width: var(--max);
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 14px;
    }

    .brand img {
      width: 76px;
      height: auto;
    }

    .brand-name {
      display: grid;
      gap: 2px;
      color: var(--carbon);
      line-height: 1;
      text-transform: uppercase;
    }

    .brand-name strong {
      font-size: 14px;
      font-weight: 800;
      letter-spacing: .18em;
    }

    .brand-name span {
      color: var(--roble);
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .48em;
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 26px;
      font-size: 12px;
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .nav-links a {
      color: rgba(31, 31, 31, .76);
    }

    .nav-links a:hover {
      color: var(--carbon);
    }

    .menu-toggle {
      display: none;
      width: 48px;
      height: 48px;
      border: 1px solid rgba(31, 31, 31, .16);
      background: rgba(243, 242, 238, .84);
      color: var(--carbon);
      padding: 0;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      gap: 6px;
      cursor: pointer;
    }

    .menu-toggle span {
      width: 22px;
      height: 2px;
      background: currentColor;
      display: block;
      transition: transform .24s ease, opacity .24s ease;
    }

    .menu-toggle.is-open span:nth-child(1) {
      transform: translateY(8px) rotate(45deg);
    }

    .menu-toggle.is-open span:nth-child(2) {
      opacity: 0;
    }

    .menu-toggle.is-open span:nth-child(3) {
      transform: translateY(-8px) rotate(-45deg);
    }

    .mobile-menu-actions,
    .mobile-nav-cta {
      display: none;
    }

    .btn {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 150px;
      min-height: 46px;
      padding: 0 22px;
      background: var(--carbon);
      color: var(--piedra-2);
      font-size: 12px;
      letter-spacing: .14em;
      text-transform: uppercase;
      border: 1px solid var(--carbon);
      text-decoration: none;
      transition: transform .2s ease, background .2s ease, color .2s ease;
      will-change: transform;
      overflow: hidden;
      --mx: 0px;
      --my: 0px;
    }

    .btn:hover {
      transform: translateY(-2px);
      background: transparent;
      color: var(--carbon);
    }

    .btn::after {
      content: "";
      position: absolute;
      inset: -65%;
      background: radial-gradient(circle at center, rgba(255, 255, 255, .36), transparent 34%);
      opacity: 0;
      transform: translate(var(--mx), var(--my)) scale(.4);
      transition: opacity .25s ease, transform .25s ease;
      pointer-events: none;
    }

    .btn:hover::after {
      opacity: .55;
      transform: translate(var(--mx), var(--my)) scale(1);
    }

    .btn.secondary {
      background: transparent;
      color: var(--carbon);
      border-color: rgba(31, 31, 31, .26);
    }

    .btn.secondary:hover {
      background: var(--carbon);
      color: var(--piedra-2);
    }

    .section-cta {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 32px;
    }

    .section-cta .btn {
      min-width: 210px;
      background: var(--roble);
      border-color: var(--roble);
      color: var(--piedra-2);
    }

    .section-cta .btn:hover {
      background: var(--carbon);
      border-color: var(--carbon);
      color: var(--piedra-2);
    }

    .services .section-cta .btn,
    .zone-section .section-cta .btn,
    .contact .section-cta .btn {
      background: var(--piedra-2);
      border-color: var(--piedra-2);
      color: var(--carbon);
    }

    .services .section-cta .btn:hover,
    .zone-section .section-cta .btn:hover,
    .contact .section-cta .btn:hover {
      background: var(--roble);
      border-color: var(--roble);
      color: var(--piedra-2);
    }

    .nav-links .btn.nav-cta {
      min-width: 168px;
      border-color: var(--roble);
      background: var(--roble);
      color: var(--piedra-2);
      box-shadow: 0 10px 24px rgba(31, 31, 31, .10);
    }

    .nav-links .btn.nav-cta:hover {
      border-color: var(--carbon);
      background: var(--piedra-2);
      color: var(--carbon);
    }

    .hero {
      min-height: 72svh;
      display: grid;
      grid-template-rows: minmax(58svh, 72svh);
      padding-top: 98px;
    }

    .hero-brand-title {
      max-width: var(--max);
      width: 100%;
      margin: 0 auto;
      padding: clamp(18px, 3vw, 34px) var(--pad) clamp(14px, 2.4vw, 28px);
    }

    .hero-brand-title h2 {
      margin: 0;
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(46px, 8vw, 118px);
      line-height: .86;
      font-weight: 800;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .hero-brand-title h2 span {
      color: var(--roble);
    }

    .hero-brand-title small {
      display: block;
      margin-top: 10px;
      color: var(--roble);
      font-family: Manrope, Arial, sans-serif;
      font-size: clamp(15px, 2vw, 28px);
      font-weight: 800;
      letter-spacing: .52em;
      line-height: 1;
      text-transform: uppercase;
    }

    .hero-copy {
      max-width: var(--max);
      width: 100%;
      margin: 0 auto;
      padding: clamp(34px, 5vw, 64px) var(--pad) clamp(48px, 7vw, 82px);
      animation: sectionBreathe 8s ease-in-out infinite;
    }

    .eyebrow {
      display: flex;
      align-items: center;
      gap: 12px;
      margin: 0 0 26px;
      color: var(--roble);
      font-family: "Courier New", Courier, monospace;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .18em;
      text-transform: uppercase;
    }

    .eyebrow::before {
      content: "";
      width: 38px;
      height: 2px;
      background: var(--roble);
    }

    h1, h2, h3, p { margin-top: 0; }

    h1 {
      max-width: 780px;
      margin-bottom: 28px;
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(52px, 7vw, 106px);
      line-height: .91;
      font-weight: 700;
      letter-spacing: 0;
    }

    .hero-lead {
      max-width: 560px;
      margin-bottom: 34px;
      font-size: clamp(17px, 1.6vw, 21px);
      color: var(--carbon-soft);
    }

    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
    }

    .hero-actions.hero-actions-single {
      align-items: center;
    }

    .btn.whatsapp-main {
      min-width: min(100%, 315px);
      min-height: 60px;
      padding: 0 34px;
      border-color: var(--roble);
      background: var(--roble);
      color: var(--piedra-2);
      font-size: 13px;
      box-shadow: 0 18px 38px rgba(31, 31, 31, .14);
    }

    .btn.whatsapp-main:hover {
      border-color: var(--carbon);
      background: var(--carbon);
      color: var(--piedra-2);
    }

    .hero-service-buttons {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: clamp(16px, 2vw, 24px);
      width: min(100%, 920px);
    }

    .hero-service-buttons .service-choice:last-child {
      grid-column: 1 / -1;
    }

    .service-choice {
      min-height: clamp(78px, 8vw, 104px);
      min-width: 0;
      padding: 0 clamp(22px, 3vw, 38px);
      border-color: rgba(31, 31, 31, .18);
      background: rgba(243, 242, 238, .72);
      color: var(--carbon);
      backdrop-filter: blur(12px);
      font-size: clamp(13px, 1.3vw, 17px);
      text-align: center;
    }

    .service-choice:hover {
      border-color: var(--carbon);
      background: var(--carbon);
      color: var(--piedra-2);
    }

    .service-choice {
      animation: buttonPulse 5.8s ease-in-out infinite;
    }

    .service-choice:nth-child(2) { animation-delay: -1s; }
    .service-choice:nth-child(3) { animation-delay: -2s; }
    .service-choice:nth-child(4) { animation-delay: -3s; }
    .service-choice:nth-child(5) { animation-delay: -4s; }
    .service-choice:nth-child(6) { animation-delay: -5s; }

    .hero-visual {
      position: relative;
      min-height: 0;
      width: 100%;
    }

    .hero-carousel {
      position: relative;
      width: 100%;
      height: 100%;
      min-height: 54svh;
      overflow: hidden;
      box-shadow: none;
      background: var(--carbon);
      border: 0;
      animation: heroRevealMask 1.15s cubic-bezier(.2, .8, .2, 1) both;
    }

    .brand-symbol {
      position: absolute;
      z-index: 4;
      display: grid;
      place-items: center;
      width: 64px;
      height: 64px;
      background: transparent;
      border: 0;
      backdrop-filter: none;
    }

    .brand-symbol img {
      width: 30px;
      height: 30px;
      object-fit: contain;
    }

    .hero-symbol {
      left: var(--pad);
      bottom: 22px;
    }

    .hero-slide {
      position: absolute;
      inset: 0;
      opacity: 0;
      transition: opacity .9s ease;
    }

    .hero-slide.is-active {
      opacity: 1;
    }

    .hero-slide img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
      transform: scale(1);
      transition: transform 6.8s ease;
    }

    .hero-slide.is-active img {
      animation: heroKenburns 6.8s ease both;
    }

    .hero-slide:nth-child(2) img {
      object-position: center;
    }

    .hero-slide:nth-child(3) img {
      object-position: 62% center;
    }

    .hero-controls {
      position: absolute;
      right: 18px;
      bottom: 18px;
      z-index: 3;
      display: flex;
      gap: 8px;
    }

    .hero-dot {
      width: 34px;
      height: 3px;
      padding: 0;
      border: 0;
      background: rgba(243, 242, 238, .5);
      cursor: pointer;
    }

    .hero-dot.is-active {
      background: var(--roble);
    }

    .quick-jump {
      position: sticky;
      top: 82px;
      z-index: 12;
      max-width: var(--max);
      margin: 0 auto;
      padding: 0 var(--pad);
      transform: translateY(-50%);
      pointer-events: none;
    }

    .quick-jump-inner {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      width: fit-content;
      max-width: 100%;
      padding: 8px;
      background: rgba(243, 242, 238, .82);
      border: 1px solid rgba(31, 31, 31, .1);
      backdrop-filter: blur(14px);
      pointer-events: auto;
    }

    .quick-jump a {
      display: inline-flex;
      align-items: center;
      min-height: 34px;
      padding: 0 13px;
      color: rgba(31, 31, 31, .72);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
      transition: background .2s ease, color .2s ease, transform .2s ease;
    }

    .quick-jump a:hover {
      background: var(--carbon);
      color: var(--piedra-2);
      transform: translateY(-1px);
    }

    .hero-stamp {
      position: absolute;
      left: -44px;
      bottom: 96px;
      width: 128px;
      height: 128px;
      display: grid;
      place-items: center;
      background: var(--piedra-2);
      border: 1px solid var(--line);
    }

    .hero-stamp img {
      width: 82px;
    }

    .section {
      padding: clamp(72px, 10vw, 138px) var(--pad);
      position: relative;
      overflow: clip;
    }

    .section-inner {
      max-width: var(--max);
      margin: 0 auto;
    }

    @media (min-width: 981px) {
      :root {
        --max: 1560px;
        --pad: clamp(34px, 4vw, 72px);
      }

      .nav,
      .hero-intro,
      .intro-band-inner,
      .section-inner,
      .about-panel,
      .promise-panel,
      .visual-block,
      .zone-band,
      .contact-card,
      .site-footer .footer-inner {
        max-width: var(--max);
      }

      .about-panel {
        grid-template-columns: minmax(360px, .72fr) minmax(0, 1.28fr);
        gap: clamp(64px, 8vw, 150px);
      }

      .split,
      .promise-panel,
      .visual-block {
        grid-template-columns: minmax(360px, .72fr) minmax(0, 1.28fr);
        gap: clamp(58px, 7vw, 132px);
      }

      .service-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
      }

      .gallery-grid,
      .gallery-grid.gallery-collage {
        max-width: var(--max);
        margin-left: auto;
        margin-right: auto;
      }
    }

    .about-panel {
      position: relative;
      max-width: min(1560px, calc(100vw - (var(--pad) * 2)));
      display: grid;
      grid-template-columns: minmax(320px, .78fr) minmax(0, 1.22fr);
      gap: clamp(44px, 8vw, 140px);
      align-items: start;
      padding: clamp(54px, 8vw, 118px);
      background: rgba(243, 242, 238, .72);
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      overflow: hidden;
      animation: panelPulse 9s ease-in-out infinite;
    }

    .about-panel.reveal {
      opacity: 1;
      transform: none;
    }

    .about-panel::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      background: var(--carbon);
      transform: translateY(0);
      transition: transform 1.15s cubic-bezier(.76, 0, .24, 1);
      pointer-events: none;
    }

    .about-panel::after {
      content: "Trazo y Obra";
      position: absolute;
      inset: 0;
      z-index: 3;
      display: grid;
      place-items: center;
      color: rgba(243, 242, 238, .8);
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(38px, 6vw, 86px);
      font-weight: 800;
      line-height: .9;
      text-transform: uppercase;
      transition: opacity .45s ease, transform .65s ease;
      pointer-events: none;
    }

    .about-panel.reveal.is-visible::before {
      transform: translateY(-102%);
    }

    .about-panel.reveal.is-visible::after {
      opacity: 0;
      transform: translateY(-28px);
      transition-delay: .42s;
    }

    .about-panel > * {
      position: relative;
      z-index: 1;
    }

    .about-copy {
      display: grid;
      gap: 38px;
    }

    .about-copy p {
      max-width: 720px;
      color: var(--carbon-soft);
      font-size: 18px;
      line-height: 1.85;
      margin: 0;
    }

    .about-steps {
      display: grid;
      gap: 18px;
      background: transparent;
    }

    .about-step {
      display: grid;
      grid-template-columns: 54px 1fr;
      gap: 28px;
      min-height: 150px;
      padding: 34px 36px;
      background: var(--piedra-2);
      border: 1px solid rgba(31, 31, 31, .1);
      transition: transform .28s ease, background .28s ease, box-shadow .28s ease;
      animation: stepWave 7s ease-in-out infinite;
    }

    .about-step:nth-child(2) { animation-delay: -2s; }
    .about-step:nth-child(3) { animation-delay: -4s; }

    .about-step:hover {
      transform: translateY(-4px);
      background: #fffaf2;
      box-shadow: 0 18px 42px rgba(31, 31, 31, .08);
    }

    .about-step span {
      width: 42px;
      height: 42px;
      margin-top: 2px;
      display: grid;
      place-items: center;
      animation: symbolBreathe 5.8s ease-in-out infinite;
    }

    .about-step span img {
      width: 42px;
      height: 42px;
      object-fit: contain;
    }

    .about-step h3 {
      margin: 0 0 14px;
      font-size: clamp(26px, 2.4vw, 34px);
      line-height: 1.1;
    }

    .about-step p {
      margin: 0;
      color: var(--carbon-soft);
    }

    .split {
      display: grid;
      grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
      gap: clamp(34px, 7vw, 94px);
      align-items: start;
    }

    .section-title {
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(42px, 5vw, 74px);
      line-height: .98;
      font-weight: 700;
      margin-bottom: 22px;
    }

    .section-text {
      color: var(--carbon-soft);
      font-size: 17px;
      max-width: 560px;
    }

    .facts {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }

    .fact {
      position: relative;
      min-height: 132px;
      padding: 26px 24px;
      border-right: 1px solid var(--line);
    }

    .fact img {
      position: absolute;
      right: 18px;
      bottom: 18px;
      width: 30px;
      height: 30px;
      opacity: .28;
    }

    .fact:last-child { border-right: 0; }

    .fact strong {
      display: block;
      font-family: Fraunces, Georgia, serif;
      font-size: 34px;
      line-height: 1;
      color: var(--carbon);
    }

    .fact span {
      display: block;
      margin-top: 12px;
      color: rgba(31, 31, 31, .66);
      font-size: 13px;
    }

    .promise {
      padding-top: 0;
    }

    .promise-panel {
      display: grid;
      grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
      gap: clamp(32px, 6vw, 84px);
      align-items: end;
      padding-bottom: clamp(58px, 8vw, 96px);
      border-bottom: 1px solid var(--line);
    }

    .promise-panel h2 {
      margin: 0;
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(38px, 5vw, 72px);
      line-height: .98;
      font-weight: 700;
    }

    .promise-list {
      display: grid;
      gap: 18px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .promise-list li {
      display: grid;
      grid-template-columns: 42px 1fr;
      gap: 18px;
      align-items: start;
      color: var(--carbon-soft);
      font-size: 16px;
    }

    .promise-list strong {
      color: var(--carbon);
      font-size: 12px;
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .marquee {
      overflow: hidden;
      padding: 22px 0;
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      background: rgba(243, 242, 238, .42);
    }

    .marquee-track {
      display: flex;
      gap: 34px;
      width: max-content;
      animation: marqueeMove 28s linear infinite;
    }

    .marquee span {
      white-space: nowrap;
      color: rgba(31, 31, 31, .62);
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(26px, 4vw, 52px);
      line-height: 1;
    }

    .marquee em {
      color: var(--roble);
      font-style: normal;
    }

    .services {
      background: var(--carbon);
      color: var(--piedra-2);
    }

    .services .eyebrow,
    .services .section-text {
      color: rgba(243, 242, 238, .72);
    }

    .services .eyebrow::before { background: var(--roble); }

    .service-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1px;
      background: rgba(243, 242, 238, .2);
      margin-top: 46px;
    }

    .service-card {
      min-height: 288px;
      padding: 32px;
      background: var(--carbon);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      transition: transform .28s ease, background .28s ease;
    }

    .service-card:hover {
      transform: translateY(-8px);
      background: #292927;
    }

    .service-card img {
      width: 34px;
      height: 34px;
      object-fit: contain;
      opacity: .82;
      filter: invert(1);
    }

    .service-card h3 {
      margin: 34px 0 12px;
      font-size: 22px;
      line-height: 1.08;
      font-weight: 500;
    }

    .service-card p {
      margin: 0;
      color: rgba(243, 242, 238, .68);
    }

    .service-card a {
      display: inline-flex;
      margin-top: 22px;
      color: var(--piedra-2);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
      border-bottom: 1px solid var(--roble);
      padding-bottom: 6px;
    }

    .service-showcase {
      display: grid;
      gap: 26px;
    }

    .service-row {
      position: relative;
      isolation: isolate;
      display: grid;
      grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
      min-height: 440px;
      border-top: 1px solid var(--line);
      background: rgba(243, 242, 238, .34);
      overflow: hidden;
      transition: transform .35s ease, box-shadow .35s ease, background .35s ease;
      animation: serviceOpen 10s ease-in-out infinite;
    }

    .service-row:nth-child(2) { animation-delay: -2s; }
    .service-row:nth-child(3) { animation-delay: -4s; }
    .service-row:nth-child(4) { animation-delay: -6s; }
    .service-row:nth-child(5) { animation-delay: -8s; }

    .service-row::before {
      content: "";
      position: absolute;
      inset: 0 auto 0 0;
      width: 7px;
      background: var(--roble);
      transform: scaleY(0);
      transform-origin: top;
      transition: transform .55s cubic-bezier(.2, .8, .2, 1);
      z-index: 2;
    }

    .service-row::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(110deg, transparent 0 42%, rgba(255, 255, 255, .24) 50%, transparent 58% 100%);
      transform: translateX(-120%);
      transition: transform .9s ease;
      pointer-events: none;
      z-index: 3;
    }

    .service-row:hover {
      transform: translateY(-6px);
      background: rgba(243, 242, 238, .62);
      box-shadow: 0 22px 60px rgba(31, 31, 31, .10);
    }

    .service-row:hover::before {
      transform: scaleY(1);
    }

    .service-row:hover::after {
      transform: translateX(120%);
    }

    .service-row:nth-child(even) {
      grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    }

    .service-row:nth-child(even) .service-photo {
      order: 2;
    }

    .service-photo {
      width: 100%;
      height: 100%;
      min-height: 440px;
      object-fit: cover;
      transition: transform .7s ease, filter .7s ease;
    }

    .service-row:hover .service-photo {
      filter: contrast(1.04) saturate(1.03);
    }

    .service-detail {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 20px;
      padding: clamp(34px, 5vw, 72px);
    }

    .service-detail h3 {
      max-width: 580px;
      font-size: clamp(38px, 5vw, 82px);
      line-height: .95;
      margin: 0;
    }

    .service-detail p {
      max-width: 560px;
      color: var(--carbon-soft);
      font-size: 17px;
      line-height: 1.8;
      margin: 0;
    }

    .service-detail .btn {
      width: fit-content;
      min-width: 190px;
    }

    .services-final-cta {
      justify-content: center;
      margin-top: clamp(34px, 5vw, 58px);
      padding-inline: var(--pad);
      overflow: visible;
    }

    .services-final-cta .btn {
      min-width: 220px;
      background: var(--piedra-2);
      border-color: var(--piedra-2);
      color: var(--carbon);
    }

    .brand-break {
      padding: clamp(34px, 5vw, 62px) var(--pad) 0;
      background: var(--carbon);
      color: var(--piedra-2);
      overflow: hidden;
      position: relative;
      isolation: isolate;
    }

    .brand-break::before,
    .brand-break::after {
      content: "";
      position: absolute;
      inset: auto auto 0 0;
      width: 38vw;
      height: 1px;
      background: rgba(151, 123, 101, .2);
      animation: lineSweep 6.8s ease-in-out infinite;
      z-index: -1;
    }

    .brand-break::after {
      inset: 0 0 auto auto;
      animation-delay: -3.2s;
    }

    .brand-break-inner {
      max-width: var(--max);
      margin: 0 auto;
      display: grid;
      gap: clamp(22px, 4vw, 38px);
      transform: none;
    }

    .brand-break p {
      margin: 0;
      color: var(--roble);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .22em;
      text-transform: uppercase;
    }

    .brand-break h2 {
      margin: 0;
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(42px, 7vw, 96px);
      line-height: .92;
      font-weight: 800;
      letter-spacing: 0;
      text-transform: uppercase;
      display: grid;
      gap: 14px;
      animation: titlePulse 5.6s ease-in-out infinite;
    }

    .brand-break .brand-wordmark {
      display: block;
      color: var(--roble);
    }

    .brand-break small {
      display: block;
      margin: 0;
      color: var(--piedra-2);
      font-family: Manrope, Arial, sans-serif;
      font-size: clamp(18px, 2.4vw, 34px);
      font-weight: 800;
      letter-spacing: .4em;
      line-height: 1;
    }

    .brand-ticker {
      margin-top: 0;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      width: 100vw;
      padding: 18px 0;
      overflow: hidden;
      color: rgba(243, 242, 238, .78);
      border-top: 1px solid rgba(151, 123, 101, .28);
    }

    .brand-ticker-track {
      display: flex;
      width: max-content;
      min-width: max-content;
      will-change: transform;
      animation: tickerDrift 20s linear infinite;
    }

    .brand-ticker-group {
      display: flex;
      align-items: center;
      gap: 34px;
      flex: 0 0 auto;
      padding-right: 34px;
      font-size: clamp(14px, 1.8vw, 25px);
      font-weight: 800;
      letter-spacing: .2em;
      text-transform: uppercase;
    }

    .brand-ticker-group span::after {
      content: "/";
      margin-left: 34px;
      color: var(--roble);
    }

    .brand-ticker-group span {
      flex: 0 0 auto;
      white-space: nowrap;
    }

    .social-section {
      display: grid;
      grid-template-columns: minmax(0, .8fr) minmax(340px, .95fr);
      gap: clamp(28px, 5vw, 56px);
      align-items: center;
    }

    .warm-section {
      background: var(--nogal);
      color: var(--piedra-2);
    }

    .warm-section .section-title,
    .warm-section .section-text,
    .warm-section .social-list li {
      color: var(--piedra-2);
    }

    .warm-section .social-list strong {
      color: var(--piedra-2);
    }

    .warm-section .section-cta .btn {
      background: var(--piedra-2);
      border-color: var(--piedra-2);
      color: var(--carbon);
    }

    .warm-section .section-cta .btn:hover {
      background: var(--carbon);
      border-color: var(--carbon);
      color: var(--piedra-2);
    }

    .social-visual {
      margin: 0;
      overflow: hidden;
    }

    .social-section img {
      width: 100%;
      min-height: 420px;
      object-fit: cover;
      border: 1px solid rgba(31, 31, 31, .1);
    }

    .visual-full-section {
      background: var(--piedra);
      padding-top: clamp(18px, 3vw, 42px);
    }

    .big-work-photo {
      margin: 0;
      overflow: visible;
      border: 1px solid rgba(31, 31, 31, .12);
      background: var(--piedra-2);
    }

    .big-work-photo img {
      width: 100%;
      height: auto;
      min-height: 0;
      object-fit: contain;
      object-position: center;
      display: block;
      animation: none;
      transform: none;
    }

    .social-list {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
      margin-top: 36px;
      padding: 0;
      list-style: none;
    }

    .social-list li {
      min-height: 190px;
      display: grid;
      align-content: space-between;
      gap: 18px;
      padding: clamp(24px, 3vw, 34px);
      border: 1px solid rgba(243, 242, 238, .22);
      background: rgba(243, 242, 238, .08);
      color: rgba(243, 242, 238, .78);
      transition: transform .28s ease, background .28s ease;
    }

    .social-list li:hover {
      transform: translateY(-6px);
      background: rgba(243, 242, 238, .14);
    }

    .social-list strong {
      color: var(--piedra-2);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .social-list span {
      max-width: 260px;
      font-size: clamp(18px, 2vw, 24px);
      font-weight: 700;
      line-height: 1.55;
    }

    .network-section {
      background: var(--piedra);
    }

    .network-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
      margin-top: 44px;
    }

    .network-card {
      min-height: 270px;
      padding: clamp(24px, 3vw, 38px);
      display: grid;
      align-content: space-between;
      gap: 28px;
      border: 1px solid rgba(31, 31, 31, .12);
      background: var(--piedra-2);
      color: var(--carbon);
      text-decoration: none;
      transition: transform .28s ease, background .28s ease, color .28s ease, box-shadow .28s ease;
      animation: cardSlowFloat 7.2s ease-in-out infinite;
    }

    .network-card:nth-child(2) { animation-delay: -2.1s; }
    .network-card:nth-child(3) { animation-delay: -4.2s; }

    .network-card:hover {
      transform: translateY(-7px);
      background: var(--carbon);
      color: var(--piedra-2);
      box-shadow: 0 24px 60px rgba(31, 31, 31, .12);
    }

    .network-icon {
      width: 54px;
      height: 54px;
      display: grid;
      place-items: center;
      border: 1px solid currentColor;
      color: var(--roble);
    }

    .network-icon svg {
      width: 28px;
      height: 28px;
      display: block;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.8;
      stroke-linecap: square;
      stroke-linejoin: miter;
    }

    .network-icon .icon-fill {
      fill: currentColor;
      stroke: none;
    }

    .network-card h3 {
      margin: 0;
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(34px, 4vw, 58px);
      line-height: .95;
    }

    .network-card p {
      margin: 0;
      color: currentColor;
      opacity: .68;
      font-size: 13px;
      font-weight: 800;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    .process-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 0;
      margin-top: 48px;
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }

    .process-item {
      position: relative;
      padding: 34px 28px;
      border-right: 1px solid var(--line);
      overflow: hidden;
      animation: processGlow 7.5s ease-in-out infinite;
    }

    .process-item:nth-child(2) { animation-delay: -2.5s; }
    .process-item:nth-child(3) { animation-delay: -5s; }

    .process-item::after {
      content: "";
      position: absolute;
      inset: auto 28px 0 28px;
      height: 2px;
      background: var(--roble);
      transform: scaleX(0);
      transform-origin: left center;
      transition: transform .45s ease;
    }

    .process-item:hover::after {
      transform: scaleX(1);
    }

    .process-item img {
      position: absolute;
      top: 34px;
      right: 28px;
      width: 32px;
      height: 32px;
      opacity: .35;
    }

    .process-item:last-child { border-right: 0; }

    .process-item span {
      display: block;
      margin-bottom: 22px;
      color: var(--roble);
      font-size: 12px;
      letter-spacing: .18em;
    }

    .process-item h3 {
      font-size: 25px;
      margin-bottom: 12px;
    }

    .process-item p {
      color: var(--carbon-soft);
      margin: 0;
    }

    .process-section {
      background: #f6f0e6;
    }

    .process-section .process-grid {
      background: rgba(151, 123, 101, .28);
      border-color: rgba(151, 123, 101, .28);
    }

    .process-section .process-item {
      background: rgba(255, 250, 242, .62);
    }

    .confidence-section {
      background: var(--carbon);
      color: var(--piedra-2);
    }

    .confidence-section .section-title {
      color: var(--piedra-2);
    }

    .confidence-section .trust-grid {
      background: rgba(243, 242, 238, .16);
      border-color: rgba(243, 242, 238, .16);
    }

    .confidence-section .trust-card {
      background: rgba(243, 242, 238, .08);
      color: var(--piedra-2);
    }

    .confidence-section .trust-card p {
      color: rgba(243, 242, 238, .72);
    }

    .trust-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1px;
      margin-top: 44px;
      background: var(--line);
      border: 1px solid var(--line);
    }

    .trust-card {
      min-height: 220px;
      padding: 30px;
      background: var(--piedra);
      transition: transform .32s ease, background .32s ease;
      will-change: transform;
      position: relative;
      overflow: hidden;
    }

    .trust-card::after {
      content: "";
      position: absolute;
      inset: auto 30px 24px 30px;
      height: 2px;
      background: var(--roble);
      transform: scaleX(.24);
      transform-origin: left;
      animation: reviewLine 4.8s ease-in-out infinite;
    }

    .trust-card:hover {
      transform: translateY(-10px);
    }

    .confidence-section .trust-card {
      animation: reviewDrift 5.8s ease-in-out infinite;
    }

    .confidence-section .trust-card:nth-child(2) {
      animation-delay: -1.9s;
    }

    .confidence-section .trust-card:nth-child(3) {
      animation-delay: -3.6s;
    }

    .trust-card span {
      display: block;
      margin-bottom: 32px;
      color: var(--roble);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .18em;
      text-transform: uppercase;
    }

    .trust-card h3 {
      margin-bottom: 12px;
      font-size: 24px;
      line-height: 1.1;
    }

    .trust-card p {
      margin: 0;
      color: var(--carbon-soft);
    }

    .problem-section {
      background: var(--piedra-2);
      min-height: auto;
    }

    .problem-grid {
      display: grid;
      gap: clamp(26px, 5vw, 68px);
      margin-top: 46px;
      background: transparent;
    }

    .problem-grid.reveal {
      opacity: 1;
      transform: none;
    }

    .problem-card {
      position: sticky;
      top: clamp(86px, 10vh, 118px);
      min-height: 0;
      padding: clamp(22px, 3vw, 34px);
      background: rgba(243, 242, 238, .72);
      display: grid;
      grid-template-columns: minmax(300px, .9fr) minmax(0, 1.1fr);
      gap: clamp(20px, 4vw, 58px);
      align-items: stretch;
      border: 1px solid rgba(31, 31, 31, .1);
      box-shadow: 0 18px 46px rgba(31, 31, 31, .06);
      opacity: 1;
      transform: translateY(0) scale(1);
      pointer-events: auto;
      transition: opacity .42s ease, transform .58s cubic-bezier(.2, .8, .2, 1), background .28s ease, box-shadow .28s ease;
      isolation: isolate;
    }

    .problem-card:nth-child(1) { z-index: 1; }
    .problem-card:nth-child(2) { z-index: 2; }
    .problem-card:nth-child(3) { z-index: 3; }
    .problem-card:nth-child(4) { z-index: 4; }

    .problem-card.is-active {
      opacity: 1;
      transform: translateY(0) scale(1);
      pointer-events: auto;
      z-index: 2;
    }

    .problem-card.is-before {
      opacity: 1;
      transform: translateY(0) scale(1);
    }

    .problem-card.is-after {
      opacity: 1;
      transform: translateY(0) scale(1);
    }

    .problem-card:hover {
      transform: translateY(-5px);
      background: #fffaf2;
      box-shadow: 0 24px 60px rgba(31, 31, 31, .09);
    }

    .problem-side,
    .solution-side {
      display: grid;
      align-content: center;
      gap: 16px;
    }

    .solution-side {
      padding: clamp(22px, 3vw, 38px);
      background: var(--carbon);
      color: var(--piedra-2);
      position: relative;
      overflow: hidden;
    }

    .solution-side::before {
      content: "";
      position: absolute;
      inset: 0 auto 0 0;
      width: 6px;
      background: var(--roble);
    }

    .problem-card span {
      color: var(--roble);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .18em;
      text-transform: uppercase;
    }

    .problem-side h3,
    .solution-side h3 {
      margin: 0;
      line-height: 1.05;
    }

    .problem-side h3 {
      max-width: 520px;
      color: rgba(31, 31, 31, .78);
      font-size: clamp(28px, 3vw, 44px);
      font-weight: 700;
    }

    .solution-side h3 {
      max-width: 660px;
      font-size: clamp(34px, 4vw, 58px);
      font-family: Georgia, "Times New Roman", serif;
      font-weight: 800;
    }

    .problem-card p {
      margin: 0;
      color: rgba(243, 242, 238, .78);
      font-size: clamp(16px, 1.4vw, 20px);
      line-height: 1.65;
    }

    .case-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
      margin-top: 46px;
    }

    .case-card {
      background: var(--piedra-2);
      border: 1px solid var(--line);
      overflow: hidden;
      transition: transform .28s ease, box-shadow .28s ease;
    }

    .case-card:hover {
      transform: translateY(-7px);
      box-shadow: 0 24px 70px rgba(31, 31, 31, .12);
    }

    .case-card img {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
    }

    .case-card div {
      padding: 26px;
    }

    .case-card span {
      display: block;
      margin-bottom: 18px;
      color: var(--roble);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .case-card h3 {
      margin-bottom: 10px;
      font-size: 25px;
      line-height: 1.08;
    }

    .case-card p {
      margin: 0;
      color: var(--carbon-soft);
    }

    .section.zone-section,
    .section.contact {
      background: var(--carbon);
      color: var(--piedra-2);
    }

    .zone-band {
      display: grid;
      grid-template-columns: .85fr 1.15fr;
      gap: clamp(32px, 6vw, 82px);
      align-items: start;
      padding: 0;
      background: transparent;
      color: var(--piedra-2);
    }

    .zone-band .section-title,
    .zone-band .section-text {
      color: var(--piedra-2);
    }

    .zone-list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 1px;
      margin: 0;
      padding: 0;
      list-style: none;
      background: rgba(243, 242, 238, .18);
      border: 1px solid rgba(243, 242, 238, .18);
    }

    .zone-list li {
      min-height: 76px;
      padding: 22px;
      background: rgba(243, 242, 238, .05);
      color: rgba(243, 242, 238, .82);
      font-size: 13px;
      letter-spacing: .1em;
      text-transform: uppercase;
    }

    .zone-map {
      position: relative;
      min-height: 430px;
      padding: clamp(26px, 4vw, 44px);
      border: 1px solid rgba(243, 242, 238, .18);
      background:
        radial-gradient(circle at 22% 22%, rgba(138, 112, 91, .24), transparent 34%),
        rgba(243, 242, 238, .05);
      overflow: hidden;
    }

    .zone-band .section-cta {
      grid-column: 1 / -1;
      margin-top: 0;
    }

    .zone-map svg {
      width: 100%;
      height: 100%;
      min-height: 360px;
      overflow: visible;
    }

    .map-line {
      fill: none;
      stroke: rgba(243, 242, 238, .38);
      stroke-width: 2;
      stroke-linecap: round;
      stroke-dasharray: 8 10;
    }

    .map-coast {
      fill: none;
      stroke: rgba(243, 242, 238, .18);
      stroke-width: 16;
      stroke-linecap: round;
    }

    .map-dot {
      fill: var(--roble);
      stroke: var(--piedra-2);
      stroke-width: 3;
    }

    .map-main {
      fill: var(--piedra-2);
      stroke: var(--roble);
      stroke-width: 4;
    }

    .map-label {
      fill: var(--piedra-2);
      font-family: Manrope, Arial, sans-serif;
      font-size: 13px;
      font-weight: 800;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    .map-small {
      fill: rgba(243, 242, 238, .58);
      font-family: Manrope, Arial, sans-serif;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
    }

    .map-icon {
      fill: none;
      stroke: var(--roble);
      stroke-width: 4;
      stroke-linecap: square;
      stroke-linejoin: miter;
    }

    .checklist {
      display: grid;
      gap: 1px;
      margin-top: 44px;
      background: var(--line);
      border: 1px solid var(--line);
    }

    .info-warm {
      background: #7d604b;
      color: var(--piedra-2);
    }

    .info-warm .section-title,
    .info-warm .section-text {
      color: var(--piedra-2);
    }

    .info-warm .checklist {
      background: rgba(243, 242, 238, .18);
      border-color: rgba(243, 242, 238, .18);
    }

    .info-warm .check-item {
      background: rgba(243, 242, 238, .08);
    }

    .info-warm .check-item strong,
    .info-warm .check-item p {
      color: var(--piedra-2);
    }

    .check-item {
      display: grid;
      grid-template-columns: 110px 1fr;
      gap: 26px;
      padding: 26px 30px;
      background: rgba(243, 242, 238, .72);
    }

    .check-item strong {
      color: var(--roble);
      font-size: 12px;
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .check-item p {
      margin: 0;
      color: var(--carbon-soft);
    }

    .visual-block {
      display: grid;
      grid-template-columns: 1fr 1fr;
      min-height: 620px;
      background: var(--piedra-2);
    }

    .visual-block img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .float-image {
      will-change: transform;
      animation: imageDrift 6.4s ease-in-out infinite;
    }

    .gallery-side .float-image:nth-child(2),
    .service-row:nth-child(even) .float-image {
      animation-delay: -3.5s;
    }

    .visual-copy {
      padding: clamp(38px, 6vw, 78px);
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .visual-copy h2 {
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(40px, 5vw, 72px);
      line-height: .98;
      font-weight: 700;
    }

    .gallery-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: clamp(28px, 4vw, 52px);
      margin-top: clamp(42px, 6vw, 72px);
    }

    .gallery-collage {
      grid-template-columns: repeat(6, minmax(0, 1fr));
      align-items: stretch;
    }

    .gallery-collage img {
      grid-column: span 3;
    }

    .gallery-collage img:nth-child(5) {
      grid-column: 2 / span 4;
    }

    .gallery-collage img.gallery-wide {
      grid-column: 1 / -1;
      width: 100%;
      height: auto;
      aspect-ratio: auto;
      object-fit: contain;
    }

    .gallery-extra {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: clamp(28px, 4vw, 52px);
      margin-top: clamp(28px, 4vw, 52px);
    }

    .symbol-strip {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1px;
      margin-top: 48px;
      background: var(--line);
      border: 1px solid var(--line);
    }

    .symbol-strip article {
      min-height: 152px;
      padding: 28px;
      background: rgba(243, 242, 238, .72);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      transition: background .25s ease, transform .25s ease;
    }

    .symbol-strip article:hover {
      background: var(--piedra-2);
      transform: translateY(-4px);
    }

    .symbol-strip img {
      width: 44px;
      height: 44px;
      object-fit: contain;
      animation: symbolBreathe 5s ease-in-out infinite;
    }

    .symbol-strip strong {
      display: block;
      margin-top: 24px;
      font-size: 12px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--carbon-soft);
    }

    .gallery-grid img,
    .gallery-extra img {
      width: 100%;
      height: clamp(430px, 34vw, 620px);
      min-height: 0;
      max-height: 640px;
      object-fit: cover;
      object-position: center;
      background: var(--piedra-2);
      filter: brightness(1.08) contrast(1.04) saturate(1.08);
      transition: transform .65s ease, filter .65s ease;
    }

    .gallery-grid img:hover,
    .gallery-extra img:hover {
      transform: scale(1.025);
      filter: brightness(1.12) contrast(1.06) saturate(1.12);
    }

    .gallery-side {
      display: contents;
    }

    .faq-grid {
      display: grid;
      grid-template-columns: .8fr 1.2fr;
      gap: clamp(32px, 6vw, 84px);
      align-items: start;
    }

    .faq-list {
      display: grid;
      gap: 1px;
      background: var(--line);
      border: 1px solid var(--line);
    }

    .faq-item {
      background: var(--piedra);
      transition: background .25s ease;
      animation: faqBreath 9s ease-in-out infinite;
    }

    .faq-item:nth-child(2) { animation-delay: -1.2s; }
    .faq-item:nth-child(3) { animation-delay: -2.4s; }
    .faq-item:nth-child(4) { animation-delay: -3.6s; }
    .faq-item:nth-child(5) { animation-delay: -4.8s; }
    .faq-item:nth-child(6) { animation-delay: -6s; }
    .faq-item:nth-child(7) { animation-delay: -7.2s; }

    .faq-item.is-open {
      background: var(--piedra-2);
    }

    .faq-item button {
      width: 100%;
      min-height: 76px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
      padding: 24px 28px;
      border: 0;
      background: transparent;
      color: var(--carbon);
      font-family: Fraunces, Georgia, serif;
      text-align: left;
      cursor: pointer;
    }

    .faq-item button::after {
      content: "+";
      display: grid;
      place-items: center;
      flex: 0 0 32px;
      width: 32px;
      height: 32px;
      border: 1px solid rgba(31, 31, 31, .18);
      color: var(--roble);
      font-family: Manrope, Arial, sans-serif;
      font-size: 18px;
      line-height: 1;
      transition: transform .25s ease, background .25s ease, color .25s ease;
    }

    .faq-item.is-open button::after {
      transform: rotate(45deg);
      background: var(--roble);
      color: var(--piedra-2);
    }

    .faq-item h3 {
      margin: 0;
      font-size: 20px;
    }

    .faq-item p {
      max-height: 0;
      overflow: hidden;
      margin: 0;
      padding: 0 28px;
      color: var(--carbon-soft);
      transition: max-height .35s ease, padding .35s ease;
    }

    .faq-item.is-open p {
      max-height: 180px;
      padding: 0 28px 26px;
    }

    .contact-card {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 32px;
      align-items: end;
      padding: 0;
      background: transparent;
      color: var(--piedra-2);
    }

    .contact-card h2 {
      max-width: 740px;
      margin-bottom: 18px;
      font-family: Fraunces, Georgia, serif;
      font-size: clamp(42px, 6vw, 80px);
      line-height: .96;
      font-weight: 700;
    }

    .contact-card p {
      max-width: 520px;
      color: rgba(243, 242, 238, .7);
    }

    .contact-list {
      display: grid;
      gap: 10px;
      margin: 26px 0 0;
      padding: 0;
      list-style: none;
      color: rgba(243, 242, 238, .78);
      font-size: 14px;
    }

    .contact-list li {
      display: flex;
      gap: 10px;
      align-items: baseline;
    }

    .contact-list strong {
      min-width: 92px;
      color: var(--piedra-2);
      font-size: 11px;
      letter-spacing: .14em;
      text-transform: uppercase;
    }

    .contact .btn {
      background: var(--piedra-2);
      color: var(--carbon);
      border-color: var(--piedra-2);
      white-space: nowrap;
    }

    .footer {
      padding: 34px var(--pad);
      background: var(--carbon);
      color: rgba(243, 242, 238, .58);
    }

    .whatsapp-float {
      position: fixed;
      right: 22px;
      bottom: 22px;
      z-index: 30;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      min-height: 48px;
      padding: 0 18px;
      background: var(--carbon);
      color: var(--piedra-2);
      border: 1px solid rgba(243, 242, 238, .18);
      box-shadow: 0 18px 50px rgba(31, 31, 31, .22);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    .whatsapp-float svg {
      width: 18px;
      height: 18px;
      fill: none;
      stroke: var(--roble);
      stroke-width: 2;
    }

    .footer-inner {
      max-width: var(--max);
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      gap: 24px;
      font-size: 12px;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    .reveal {
      opacity: 0;
      transform: translateY(46px) scale(.985);
      transition: opacity .9s ease, transform .9s cubic-bezier(.2, .8, .2, 1);
    }

    .reveal.is-visible {
      opacity: 1;
      transform: translateY(0) scale(1);
    }

    .brand-break.reveal {
      transform: translateY(34px) scale(.98);
    }

    .brand-break.reveal.is-visible {
      transform: translateY(0) scale(1);
    }

    .reveal.is-visible .section-title,
    .reveal.is-visible h1,
    .reveal.is-visible h2 {
      animation: titleLift .72s cubic-bezier(.2, .8, .2, 1) both;
    }

    .reveal.is-visible .about-step,
    .reveal.is-visible .process-item,
    .reveal.is-visible .trust-card,
    .reveal.is-visible .check-item,
    .reveal.is-visible .service-row,
    .reveal.is-visible .faq-item {
      animation: riseSoft .72s cubic-bezier(.2, .8, .2, 1) both;
    }

    .reveal.is-visible .about-step:nth-child(2),
    .reveal.is-visible .process-item:nth-child(2),
    .reveal.is-visible .trust-card:nth-child(2),
    .reveal.is-visible .check-item:nth-child(2),
    .reveal.is-visible .service-row:nth-child(2),
    .reveal.is-visible .faq-item:nth-child(2) {
      animation-delay: .1s;
    }

    .reveal.is-visible .about-step:nth-child(3),
    .reveal.is-visible .process-item:nth-child(3),
    .reveal.is-visible .trust-card:nth-child(3),
    .reveal.is-visible .check-item:nth-child(3),
    .reveal.is-visible .service-row:nth-child(3),
    .reveal.is-visible .faq-item:nth-child(3) {
      animation-delay: .2s;
    }

    .reveal.is-visible .check-item:nth-child(4),
    .reveal.is-visible .service-row:nth-child(4),
    .reveal.is-visible .faq-item:nth-child(4) {
      animation-delay: .3s;
    }

    .reveal.is-visible .service-row:nth-child(5),
    .reveal.is-visible .faq-item:nth-child(5) {
      animation-delay: .4s;
    }

    .confidence-section .reveal.is-visible .trust-card {
      animation-name: reviewFloatIn, reviewDrift;
      animation-duration: .9s, 5.8s;
      animation-timing-function: cubic-bezier(.2, .8, .2, 1), ease-in-out;
      animation-iteration-count: 1, infinite;
      animation-fill-mode: both, none;
    }

    .confidence-section .trust-card:nth-child(2) {
      animation-delay: .12s, -1.9s;
    }

    .confidence-section .trust-card:nth-child(3) {
      animation-delay: .24s, -3.6s;
    }

    .gallery-grid.reveal.is-visible > img {
      animation: galleryOpen .9s cubic-bezier(.2, .8, .2, 1) both, imageDrift 6.8s ease-in-out infinite .9s;
    }

    .gallery-grid.reveal.is-visible .gallery-side img {
      animation: galleryOpen .9s cubic-bezier(.2, .8, .2, 1) both, imageDrift 6.8s ease-in-out infinite .9s;
    }

    .gallery-grid.reveal.is-visible .gallery-side img:nth-child(2) {
      animation-delay: .12s, 1s;
    }

    .gallery-extra.reveal.is-visible img {
      animation: galleryOpen .9s cubic-bezier(.2, .8, .2, 1) both, imageDrift 6.8s ease-in-out infinite .9s;
    }

    .gallery-extra.reveal.is-visible img:nth-child(2) {
      animation-delay: .12s, 1s;
    }

    @keyframes marqueeMove {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }

    @keyframes homePageExit {
      from {
        opacity: 0;
        transform: translateY(100%);
      }
      to {
        opacity: .16;
        transform: translateY(0);
      }
    }

    @keyframes homeContentExit {
      from {
        opacity: 1;
        transform: translateY(0);
      }
      to {
        opacity: .76;
        transform: translateY(-12px) scale(.996);
        filter: blur(2px);
      }
    }

    @keyframes pageEnterSoft {
      from {
        opacity: 0;
        transform: translateY(22px) scale(.992);
      }
      to {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
    }

    @keyframes pageLeaveSoft {
      from {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
      to {
        opacity: .82;
        transform: translateY(10px) scale(.996);
      }
    }

    @keyframes pageCover {
      0% {
        opacity: 0;
        transform: translateX(-100%);
      }
      16% {
        opacity: 1;
      }
      100% {
        opacity: 1;
        transform: translateX(0);
      }
    }

    @keyframes pageUncover {
      0% {
        opacity: 1;
        transform: translateX(0);
      }
      86% {
        opacity: 1;
        transform: translateX(100%);
      }
      100% {
        opacity: 0;
        transform: translateX(100%);
      }
    }

    @keyframes heroRevealMask {
      from { clip-path: inset(0 0 100% 0); }
      to { clip-path: inset(0 0 0 0); }
    }

    @keyframes heroKenburns {
      from { transform: scale(1.015) translate3d(-.7%, 0, 0); }
      to { transform: scale(1) translate3d(.7%, 0, 0); }
    }

    @keyframes symbolBreathe {
      0%, 100% { transform: translateY(0); opacity: .78; }
      50% { transform: translateY(-6px); opacity: 1; }
    }

    @keyframes imageDrift {
      0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
      50% { transform: translate3d(0, -14px, 0) scale(1.025); }
    }

    @keyframes tickerDrift {
      from { transform: translate3d(0, 0, 0); }
      to { transform: translate3d(calc(-100% / 3), 0, 0); }
    }

    @keyframes riseSoft {
      from { opacity: 0; transform: translateY(36px) scale(.97); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    @keyframes reviewFloatIn {
      from { opacity: 0; transform: translateY(46px) rotate(-1.5deg) scale(.96); }
      to { opacity: 1; transform: translateY(0) rotate(0) scale(1); }
    }

    @keyframes reviewDrift {
      0%, 100% { transform: translate3d(0, 0, 0) rotate(0); }
      35% { transform: translate3d(0, -16px, 0) rotate(-.7deg); }
      70% { transform: translate3d(0, 8px, 0) rotate(.5deg); }
    }

    @keyframes reviewLine {
      0%, 100% { transform: scaleX(.2); opacity: .55; }
      50% { transform: scaleX(1); opacity: 1; }
    }

    @keyframes cardSlowFloat {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-12px); }
    }

    @keyframes problemFloat {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-7px); }
    }

    @keyframes sectionBreathe {
      0%, 100% { background: rgba(243, 242, 238, 0); }
      50% { background: rgba(151, 123, 101, .055); }
    }

    @keyframes buttonPulse {
      0%, 100% { transform: translateY(0); box-shadow: none; }
      50% { transform: translateY(-5px); box-shadow: 0 16px 34px rgba(31, 31, 31, .08); }
    }

    @keyframes panelPulse {
      0%, 100% { box-shadow: 0 0 0 rgba(31, 31, 31, 0); }
      50% { box-shadow: 0 28px 80px rgba(31, 31, 31, .08); }
    }

    @keyframes stepWave {
      0%, 100% { transform: translateX(0); }
      50% { transform: translateX(8px); }
    }

    @keyframes serviceOpen {
      0%, 100% { transform: translateY(0); }
      45%, 55% { transform: translateY(-7px); box-shadow: 0 20px 46px rgba(31, 31, 31, .08); }
    }

    @keyframes processGlow {
      0%, 100% { background: transparent; }
      50% { background: rgba(151, 123, 101, .12); }
    }

    @keyframes faqBreath {
      0%, 100% { background: var(--piedra); }
      50% { background: #fffaf2; }
    }

    @keyframes titleLift {
      from { opacity: 0; transform: translateY(28px); }
      to { opacity: 1; transform: translateY(0); }
    }

    @keyframes titlePulse {
      0%, 100% { transform: translateX(0); }
      50% { transform: translateX(16px); }
    }

    @keyframes lineSweep {
      0%, 100% { transform: translateX(-10%) rotate(-8deg); opacity: .25; }
      50% { transform: translateX(38%) rotate(-8deg); opacity: .72; }
    }

    @keyframes galleryOpen {
      from { opacity: 0; clip-path: inset(0 100% 0 0); transform: translateX(-26px) scale(.98); }
      to { opacity: 1; clip-path: inset(0 0 0 0); transform: translateX(0) scale(1); }
    }

    @keyframes openPanelFallback {
      from { transform: translateY(0); }
      to { transform: translateY(-102%); }
    }

    @media (min-width: 981px) {
      .nav,
      .hero-intro,
      .intro-band-inner,
      .section-inner,
      .promise-panel,
      .visual-block,
      .gallery-grid,
      .zone-band,
      .contact-card,
      .footer-inner {
        max-width: min(1560px, calc(100vw - 88px));
      }

      .section {
        padding-left: clamp(44px, 5vw, 92px);
        padding-right: clamp(44px, 5vw, 92px);
      }

      .about-panel {
        max-width: min(1680px, calc(100vw - 72px));
        margin-left: auto;
        margin-right: auto;
      }

      .service-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
      }

      .service-row,
      .service-row:nth-child(even),
      .social-section,
      .contact-card {
        max-width: min(1560px, calc(100vw - 88px));
        margin-left: auto;
        margin-right: auto;
      }
    }

    @media (max-width: 980px) {
      .site-header {
        padding: 14px 18px 10px;
      }

      .nav {
        position: relative;
        flex-wrap: nowrap;
        align-items: center;
        gap: 14px 18px;
      }

      .mobile-menu-actions {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 10px;
        margin-left: auto;
        position: relative;
        z-index: 35;
      }

      .menu-toggle {
        display: inline-flex;
        margin-left: 0;
      }

      .mobile-nav-cta {
        display: inline-flex;
        min-width: 0;
        min-height: 44px;
        padding: 0 18px;
        border-color: rgba(151, 121, 98, .45);
        background: var(--roble);
        color: var(--piedra-2);
        box-shadow: 0 10px 24px rgba(31, 31, 31, .10);
        font-size: 10px;
        letter-spacing: .12em;
      }

      .nav-links {
        position: absolute;
        top: calc(100% + 12px);
        right: 0;
        width: min(320px, calc(100vw - 36px));
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 10px;
        background: rgba(229, 229, 227, .98);
        border: 1px solid rgba(31, 31, 31, .12);
        box-shadow: 0 18px 44px rgba(31, 31, 31, .14);
        opacity: 0;
        pointer-events: none;
        overflow: visible;
        transform: translateY(-8px);
        transition: opacity .22s ease, transform .22s ease;
        z-index: 30;
      }

      .nav-links.is-open {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
      }

      .nav-links a {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
        padding: 10px 14px;
        border: 1px solid rgba(31, 31, 31, .14);
        background: rgba(243, 242, 238, .72);
        color: var(--carbon);
        font-size: 10px;
        letter-spacing: .12em;
      }

      .nav-links a[href="#proceso"] {
        display: flex;
      }

      .nav-links .btn.nav-cta {
        display: none;
      }

      .hero,
      .split,
      .about-panel,
      .visual-block,
      .service-row,
      .service-row:nth-child(even),
      .social-section,
      .contact-card,
      .promise-panel,
      .faq-grid {
        grid-template-columns: 1fr;
      }

      .hero {
        padding-top: 148px;
      }

      .hero-copy {
        padding-top: 30px;
      }

      .hero-carousel {
        min-height: 58svh;
      }

      .service-row:nth-child(even) .service-photo {
        order: 0;
      }

      .service-photo,
      .social-section img {
        min-height: 360px;
      }

      .hero-stamp {
        left: 18px;
        bottom: 18px;
        width: 96px;
        height: 96px;
      }

      .hero-stamp img { width: 62px; }

      .facts,
      .service-grid,
      .hero-service-buttons,
      .process-grid,
      .gallery-grid,
      .symbol-strip,
      .social-list,
      .trust-grid,
      .network-grid,
      .case-grid,
      .zone-band {
        grid-template-columns: 1fr 1fr;
      }

      .service-card,
      .process-item,
      .fact {
        border-right: 0;
        border-bottom: 1px solid var(--line);
      }
    }

    @media (max-width: 640px) {
      .site-header {
        padding: 12px 12px 10px;
      }

      .nav {
        gap: 12px;
      }

      .brand img {
        width: 58px;
      }

      .brand {
        gap: 10px;
      }

      .brand-name strong {
        font-size: 11px;
        letter-spacing: .12em;
      }

      .brand-name span {
        font-size: 8px;
        letter-spacing: .34em;
      }

      .brand-break {
        padding: 56px 18px;
      }

      .brand-break-inner {
        transform: none;
      }

      .nav-links .btn {
        min-width: 0;
        min-height: 40px;
        padding: 0 14px;
        font-size: 10px;
      }

      .mobile-menu-actions {
        gap: 9px;
      }

      .mobile-nav-cta {
        min-height: 42px;
        padding: 0 14px;
        font-size: 9px;
      }

      .nav-links {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
      }

      .nav-links a {
        min-height: 48px;
        padding: 12px 6px 10px;
        font-size: 9px;
        letter-spacing: .08em;
      }

      .nav-links .btn.nav-cta {
        display: none;
      }

      .section {
        padding-left: 18px;
        padding-right: 18px;
      }

      .hero {
        min-height: auto;
        grid-template-rows: minmax(0, auto);
        padding: 144px 0 0;
      }

      .hero-visual {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
      }

      .hero-carousel {
        width: 100vw;
        min-height: 0;
        height: auto;
        aspect-ratio: 4 / 5;
        overflow: hidden;
        display: grid;
        align-items: center;
        background: var(--carbon);
      }

      .hero-slide {
        width: 100vw;
        height: 100%;
        display: grid;
        place-items: center;
      }

      .hero-slide img {
        width: 100vw;
        max-width: 100vw;
        height: 100%;
        max-height: 100%;
        object-fit: contain;
        object-position: center;
        animation: none !important;
        transform: none !important;
      }

      .facts,
      .service-grid,
      .process-grid,
      .problem-grid,
      .gallery-grid,
      .symbol-strip,
      .social-list,
      .trust-grid,
      .network-grid,
      .case-grid,
      .zone-band,
      .zone-list,
      .check-item {
        grid-template-columns: 1fr;
      }

      .gallery-collage img,
      .gallery-collage img:nth-child(5) {
        grid-column: auto;
      }

      .gallery-grid.gallery-collage {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 16px;
      }

      .gallery-grid.gallery-collage img {
        grid-column: span 3;
        width: 100%;
        height: auto;
        min-height: 0;
        object-fit: contain;
      }

      .gallery-grid.gallery-collage img:first-child,
      .gallery-grid.gallery-collage img:nth-child(4),
      .gallery-grid.gallery-collage img.gallery-wide {
        grid-column: 1 / -1;
      }

      .gallery-grid.gallery-collage.reveal.is-visible > img {
        animation: galleryOpen .95s cubic-bezier(.2, .8, .2, 1) both, imageDrift 7.4s ease-in-out infinite 1s;
      }

      .gallery-grid.gallery-collage.reveal.is-visible > img:nth-child(2) {
        animation-delay: .1s, 1.1s;
      }

      .gallery-grid.gallery-collage.reveal.is-visible > img:nth-child(3) {
        animation-delay: .18s, 1.18s;
      }

      .gallery-grid.gallery-collage.reveal.is-visible > img:nth-child(4) {
        animation-delay: .26s, 1.26s;
      }

      .gallery-grid.gallery-collage.reveal.is-visible > img:nth-child(5) {
        animation-delay: .34s, 1.34s;
      }

      .visual-full-section {
        padding-left: 0 !important;
        padding-right: 0 !important;
      }

      .visual-full-section .section-inner {
        width: 100vw !important;
        max-width: none !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
      }

      .big-work-photo {
        width: 100vw !important;
        margin: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        background: transparent !important;
      }

      .big-work-photo img {
        width: 100vw !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center !important;
        padding: 0 !important;
      }

      .problem-card {
        grid-template-columns: 1fr;
        position: relative;
        inset: auto;
        top: auto;
        opacity: 1;
        transform: none;
        pointer-events: auto;
      }

      .problem-section {
        min-height: auto;
      }

      .problem-grid {
        position: relative;
        top: auto;
        height: auto;
        display: grid;
        gap: 18px;
      }

      .brand-symbol {
        width: 68px;
        height: 68px;
      }

      .brand-symbol img {
        width: 32px;
        height: 32px;
      }

      .visual-block {
        min-height: 0;
      }

      .visual-block img,
      .service-photo,
      .social-section img,
      .gallery-grid img {
        min-height: 280px;
      }

      .gallery-collage img.gallery-wide {
        grid-column: auto;
        height: auto;
        min-height: 0;
        object-fit: contain;
      }

      .about-panel {
        padding: 34px 22px;
      }

      .about-step {
        grid-template-columns: 34px 1fr;
        gap: 18px;
        min-height: 0;
        padding: 26px 22px;
      }

      .about-step span {
        width: 16px;
        height: 16px;
      }

      .zone-map {
        min-height: 340px;
        padding: 18px;
      }

      .zone-map svg {
        min-height: 300px;
      }

      .footer-inner {
        flex-direction: column;
      }

      .whatsapp-float {
        right: 14px;
        bottom: 14px;
        padding: 0 14px;
        min-height: 42px;
        font-size: 10px;
      }

      .quick-jump {
        position: static;
        transform: none;
        padding: 14px 18px 0;
      }

      .quick-jump-inner {
        width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
      }

      .reveal {
        opacity: 1;
        transform: none;
      }
    }
    /* Brandbook Trazo y Obra: capa de coherencia visual */
    body {
      background: var(--piedra);
    }

    .btn,
    .nav-cta,
    .work-page-link,
    .contact .btn {
      border-radius: 0;
      box-shadow: none;
      font-family: Manrope, Arial, sans-serif;
      font-weight: 700;
      letter-spacing: .14em;
    }

    .btn::after {
      display: none;
    }

    .btn:hover,
    .section-cta .btn:hover,
    .nav-links .btn.nav-cta:hover {
      transform: translateY(-2px);
      background: var(--roble);
      border-color: var(--roble);
      color: var(--piedra-2);
    }

    .section,
    .intro-panel,
    .service-row,
    .problem-card,
    .process-card,
    .faq-item,
    .network-card,
    .contact-panel {
      border-radius: 0;
      box-shadow: none;
    }

    .section-title,
    .hero-title,
    .statement-title,
    .brand-title,
    .solution-side h3,
    .trust-card strong,
    .review-card strong {
      font-family: Fraunces, Georgia, serif;
      font-weight: 400;
      letter-spacing: 0;
    }

    .eyebrow,
    .nav-links,
    .brand-name span,
    .map-label,
    .map-small {
      font-family: Manrope, Arial, sans-serif;
    }

    .service-row {
      animation-duration: 16s;
      background: rgba(243, 242, 238, .62);
      border-color: rgba(31, 31, 31, .12);
    }

    .service-row::after,
    .zone-map {
      background-image: none;
    }

    .service-row:hover {
      box-shadow: none;
      background: var(--piedra-2);
    }

    .warm-section,
    .info-warm {
      background: var(--roble);
    }

    .dark-band,
    .services,
    .problem-section .solution-side,
    .contact {
      background: var(--carbon);
    }

    .problem-card {
      background: var(--piedra);
      border-color: rgba(31, 31, 31, .14);
    }

    .gallery-card,
    .process-card,
    .faq-item,
    .network-card {
      border: 1px solid rgba(31, 31, 31, .14);
      background-color: var(--piedra-2);
    }

    .zone-map {
      border: 1px solid rgba(243, 242, 238, .18);
      background:
        linear-gradient(135deg, rgba(31, 31, 31, .98), rgba(31, 31, 31, .88)),
        var(--carbon);
    }

    .zone-map .map-line {
      stroke: rgba(243, 242, 238, .48);
    }

    .zone-map .map-coast {
      stroke: rgba(243, 242, 238, .18);
    }

    .zone-map .map-label,
    .zone-map .map-small {
      fill: var(--piedra-2);
    }

    .zone-map .map-main {
      fill: var(--piedra-2);
      stroke: var(--roble);
    }

    .contact-panel,
    .cta-band,
    .final-section {
      background: var(--carbon);
      color: var(--piedra-2);
    }
    /* Ajuste final de composición: fotos más grandes y páginas menos centradas. */
    @media (min-width: 981px) {
      .service-showcase,
      .gallery-grid,
      .gallery-grid.gallery-collage,
      .gallery-extra,
      .visual-block {
        width: min(1880px, calc(100vw - 28px));
        max-width: none;
        margin-left: auto;
        margin-right: auto;
      }

      .service-row {
        grid-template-columns: minmax(360px, .78fr) minmax(0, 1.22fr);
        min-height: clamp(520px, 40vw, 720px);
      }

      .service-row:nth-child(even) {
        grid-template-columns: minmax(0, 1.22fr) minmax(360px, .78fr);
      }

      .service-photo {
        min-height: clamp(520px, 40vw, 720px);
        object-fit: cover;
      }

      .visual-block {
        grid-template-columns: minmax(380px, .76fr) minmax(0, 1.24fr);
      }

      .gallery-grid img,
      .gallery-extra img {
        height: clamp(520px, 38vw, 740px);
      }
    }
    /* Ajuste final de galeria principal: fotos completas, sin recorte. */
    .gallery-grid.gallery-collage,
    .gallery-extra {
      width: min(1780px, calc(100vw - 48px)) !important;
      max-width: none !important;
      margin-left: auto !important;
      margin-right: auto !important;
      align-items: center !important;
      gap: clamp(22px, 2.4vw, 44px) !important;
    }

    .gallery-grid.gallery-collage img,
    .gallery-extra img,
    .gallery-grid img {
      width: 100% !important;
      height: auto !important;
      min-height: 0 !important;
      max-height: none !important;
      object-fit: contain !important;
      aspect-ratio: auto !important;
      display: block !important;
      background: rgba(243, 242, 238, .45) !important;
    }

    .gallery-grid.gallery-collage img.gallery-wide {
      grid-column: span 12 !important;
    }

    @media (max-width: 760px) {
      .gallery-grid.gallery-collage,
      .gallery-extra {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        gap: 22px !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
      }

      .gallery-grid.gallery-collage img,
      .gallery-extra img,
      .gallery-grid img {
        width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
      }
    }

    /* Correccion final portada: servicios alineados y fotos completas, sin recorte. */
    @media (min-width: 981px) {
      .services .service-showcase {
        width: min(1680px, calc(100vw - 72px)) !important;
        max-width: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
        gap: 34px !important;
      }

      .services .service-row,
      .services .service-row:nth-child(even) {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        min-height: 0 !important;
        align-items: center !important;
        overflow: visible !important;
      }

      .services .service-row:nth-child(even) .service-photo {
        order: 2 !important;
      }

      .services .service-photo {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: 620px !important;
        object-fit: contain !important;
        aspect-ratio: auto !important;
        align-self: center !important;
        justify-self: center !important;
        background: rgba(243, 242, 238, .48) !important;
      }

      .services .service-detail {
        min-height: 520px !important;
      }
    }

    @media (max-width: 760px) {
      .services .service-row,
      .services .service-row:nth-child(even) {
        display: flex !important;
        flex-direction: column !important;
        overflow: visible !important;
      }

      .services .service-row:nth-child(even) .service-photo {
        order: 0 !important;
      }

      .services .service-photo {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        object-fit: contain !important;
        aspect-ratio: auto !important;
      }
    }

    /* Desktop final: imagenes completas, sin recorte y con proporcion estable. */
    @media (min-width: 981px) {
      .hero-carousel {
        width: min(100%, 1760px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
      }

      .hero-slide img {
        width: 100% !important;
        height: auto !important;
        max-height: 760px !important;
        object-fit: contain !important;
        object-position: center center !important;
      }

      .services .service-showcase {
        width: min(1760px, calc(100vw - 64px)) !important;
      }

      .services .service-row,
      .services .service-row:nth-child(even) {
        grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr) !important;
        align-items: center !important;
      }

      .services .service-photo {
        width: 100% !important;
        height: auto !important;
        max-height: 680px !important;
        min-height: 0 !important;
        object-fit: contain !important;
        object-position: center center !important;
        aspect-ratio: auto !important;
      }

      .gallery-grid.gallery-collage,
      .gallery-extra {
        width: min(1760px, calc(100vw - 64px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        align-items: center !important;
        justify-items: center !important;
      }

      .gallery-grid img,
      .gallery-extra img {
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 620px !important;
        object-fit: contain !important;
        object-position: center center !important;
      }

      .gallery-grid.gallery-collage img {
        grid-column: span 3 !important;
      }

      .gallery-grid.gallery-collage img.gallery-wide {
        grid-column: 1 / -1 !important;
        max-height: 560px !important;
      }
    }

    /* Correccion visual final: portada completa, servicios alineados, collage limpio y redes solo con iconos. */
    .hero {
      width: 100vw !important;
      margin-left: calc(50% - 50vw) !important;
      margin-right: calc(50% - 50vw) !important;
      padding-left: 0 !important;
      padding-right: 0 !important;
      background: var(--carbon) !important;
    }

    .hero-visual,
    .hero-carousel {
      width: 100% !important;
      max-width: none !important;
      margin: 0 !important;
      background: var(--carbon) !important;
    }

    .hero-slide img {
      object-fit: contain !important;
      object-position: center center !important;
      background: var(--carbon) !important;
    }

    .services .service-showcase {
      width: min(1640px, calc(100vw - 80px)) !important;
      max-width: none !important;
      margin-left: auto !important;
      margin-right: auto !important;
      display: grid !important;
      gap: 30px !important;
    }

    .services .service-row,
    .services .service-row:nth-child(even) {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
      min-height: 0 !important;
      align-items: stretch !important;
      background: rgba(243, 242, 238, .48) !important;
      border: 1px solid rgba(31, 31, 31, .08) !important;
      overflow: hidden !important;
    }

    .services .service-row:nth-child(even) .service-photo {
      order: 2 !important;
    }

    .services .service-photo {
      width: 100% !important;
      height: clamp(430px, 31vw, 560px) !important;
      min-height: 0 !important;
      max-height: none !important;
      object-fit: contain !important;
      object-position: center center !important;
      background: rgba(243, 242, 238, .7) !important;
      display: block !important;
    }

    .services .service-detail {
      min-height: clamp(430px, 31vw, 560px) !important;
      height: auto !important;
      justify-content: center !important;
    }

    .gallery-grid.gallery-collage {
      width: min(1500px, calc(100vw - 96px)) !important;
      max-width: none !important;
      margin-left: auto !important;
      margin-right: auto !important;
      display: grid !important;
      grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
      gap: clamp(24px, 2.2vw, 38px) !important;
      align-items: stretch !important;
      justify-items: stretch !important;
    }

    .gallery-grid.gallery-collage img {
      width: 100% !important;
      height: 100% !important;
      max-width: none !important;
      max-height: none !important;
      object-fit: contain !important;
      object-position: center center !important;
      background: rgba(243, 242, 238, .62) !important;
      padding: 0 !important;
      box-sizing: border-box !important;
    }

    .gallery-grid.gallery-collage img:nth-child(1) {
      grid-column: 1 / span 6 !important;
      grid-row: 1 !important;
      aspect-ratio: 4 / 5 !important;
    }

    .gallery-grid.gallery-collage img:nth-child(4) {
      grid-column: 7 / span 6 !important;
      grid-row: 1 !important;
      aspect-ratio: 4 / 5 !important;
    }

    .gallery-grid.gallery-collage img:nth-child(2) {
      grid-column: 1 / span 6 !important;
      grid-row: 2 !important;
      aspect-ratio: 16 / 10 !important;
    }

    .gallery-grid.gallery-collage img:nth-child(3) {
      grid-column: 7 / span 6 !important;
      grid-row: 2 !important;
      aspect-ratio: 16 / 10 !important;
    }

    .gallery-grid.gallery-collage img.gallery-wide,
    .gallery-grid.gallery-collage img:nth-child(5) {
      grid-column: 1 / -1 !important;
      grid-row: 3 !important;
      aspect-ratio: 16 / 8 !important;
    }

    .network-grid {
      width: min(760px, 100%) !important;
      margin-left: auto !important;
      margin-right: auto !important;
      justify-items: center !important;
    }

    .network-card {
      min-height: 150px !important;
      aspect-ratio: 1 / 1 !important;
      padding: 0 !important;
      display: grid !important;
      place-items: center !important;
      align-content: center !important;
      justify-content: center !important;
    }

    .network-card > div {
      display: none !important;
    }

    .network-icon {
      width: 72px !important;
      height: 72px !important;
    }

    .network-icon svg {
      width: 36px !important;
      height: 36px !important;
    }

    @media (max-width: 760px) {
      html,
      body,
      .page-shell {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden !important;
      }

      .site-header {
        width: 100% !important;
        padding: 14px 18px 12px !important;
        background: var(--piedra) !important;
        border-bottom: 1px solid rgba(31, 31, 31, .10) !important;
        z-index: 1000 !important;
      }

      .nav {
        width: 100% !important;
        max-width: none !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: start !important;
        gap: 14px !important;
      }

      .brand {
        min-width: 0 !important;
        gap: 12px !important;
        align-items: center !important;
      }

      .brand img {
        width: 76px !important;
        min-width: 76px !important;
        height: auto !important;
        display: block !important;
      }

      .brand-name strong {
        font-size: 13px !important;
        line-height: 1.1 !important;
        letter-spacing: .15em !important;
      }

      .brand-name span {
        font-size: 9px !important;
        letter-spacing: .34em !important;
      }

      .mobile-menu-actions {
        gap: 10px !important;
      }

      .menu-toggle {
        width: 52px !important;
        height: 52px !important;
      }

      .mobile-nav-cta {
        min-height: 46px !important;
        padding: 0 18px !important;
        font-size: 10px !important;
        white-space: nowrap !important;
      }

      main#inicio {
        padding-top: 132px !important;
      }

      .hero {
        width: 100vw !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        min-height: 0 !important;
        grid-template-rows: auto !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        display: block !important;
        background: var(--carbon) !important;
        overflow: hidden !important;
      }

      .hero-visual {
        width: 100vw !important;
        max-width: none !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 26px 0 34px !important;
        background: var(--carbon) !important;
        overflow: hidden !important;
      }

      .hero-carousel {
        width: 100vw !important;
        max-width: none !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 0 14px 52px !important;
        background: var(--carbon) !important;
        overflow: hidden !important;
      }

      .hero-slide {
        position: relative !important;
        display: none !important;
        width: 100% !important;
        margin: 0 !important;
      }

      .hero-slide.is-active {
        display: block !important;
      }

      .hero-slide img {
        width: 100% !important;
        height: auto !important;
        max-height: 68svh !important;
        object-fit: contain !important;
        object-position: center center !important;
        display: block !important;
        background: var(--carbon) !important;
      }

      .hero-controls {
        left: 50% !important;
        right: auto !important;
        bottom: 18px !important;
        transform: translateX(-50%) !important;
        width: calc(100vw - 82px) !important;
        justify-content: center !important;
        gap: 8px !important;
      }

      .hero-dot {
        flex: 1 1 auto !important;
        max-width: 58px !important;
      }

      .services .service-showcase {
        width: calc(100vw - 34px) !important;
        gap: 22px !important;
      }

      .services .service-row,
      .services .service-row:nth-child(even) {
        display: flex !important;
        flex-direction: column !important;
      }

      .services .service-row:nth-child(even) .service-photo {
        order: 0 !important;
      }

      .services .service-photo,
      .services .service-detail {
        min-height: 0 !important;
        height: auto !important;
      }

      .gallery-grid.gallery-collage {
        width: calc(100vw - 34px) !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 22px !important;
        padding: 0 !important;
      }

      .gallery-grid.gallery-collage img,
      .gallery-grid.gallery-collage img.gallery-wide {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: auto !important;
      }

      .network-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 12px !important;
      }

      .network-card {
        min-height: 102px !important;
      }

      .network-icon {
        width: 54px !important;
        height: 54px !important;
      }

      .network-icon svg {
        width: 28px !important;
        height: 28px !important;
      }
    }
    /* Servicios portada: fotos solas, sin borde ni fondo, manteniendo proporción completa. */
    .services .service-row > img.service-photo,
    .services .service-row > img.service-photo.float-image {
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
      outline: 0 !important;
      padding: 0 !important;
      object-fit: contain !important;
      object-position: center center !important;
    }

    /* Encabezado portada: la franja superior debe verse gris desde el primer pixel. */
    .site-header,
    .site-header:not(.is-scrolled) {
      background: var(--piedra) !important;
      border-bottom: 1px solid rgba(31, 31, 31, .10) !important;
      z-index: 1000 !important;
    }

    /* Contraste accesible usando únicamente la paleta de marca. */
    .eyebrow,
    .brand-name span,
    .process-item span,
    .trust-card span,
    .problem-card span,
    .case-card span,
    .check-item strong {
      color: var(--nogal);
    }

    .services .eyebrow,
    .confidence-section .eyebrow,
    .zone-section .eyebrow,
    .contact .eyebrow,
    .brand-break p {
      color: #d8c2ad;
    }

    .warm-section,
    .info-warm {
      background: var(--nogal);
    }

    .section-cta .btn,
    .nav-links .btn.nav-cta,
    .btn.whatsapp-main,
    .mobile-nav-cta,
    .faq-item.is-open button::after {
      background: var(--nogal);
      border-color: var(--nogal);
      color: var(--piedra-2);
    }

    /* Mantiene los bloques a sangre sin provocar desplazamiento horizontal. */
    @media (min-width: 901px) {
      .hero,
      .hero-visual,
      .hero-carousel,
      .brand-ticker {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
      }

      .services .service-showcase {
        margin-left: calc((100% - min(1640px, calc(100vw - 80px))) / 2) !important;
        margin-right: calc((100% - min(1640px, calc(100vw - 80px))) / 2) !important;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
      }
    }