/* =====================================================
   TEMPO DISEGNO v2 — styles.css
   Exaggerated Minimalism · Warm Monochrome · Editorial
   Breakpoints: 600px / 900px / 1200px
   ===================================================== */

/* =====================================================
   1. VARIABLES
   ===================================================== */
:root {
  --bg:         #07080b;
  --bg-alt:     #0d1117;
  --surface:    #0c1016;
  --surface-2:  #121720;
  --fg:         #f3f4f6;
  --muted:      #a1a1aa;
  --border:     rgba(255,255,255,.08);
  --accent:     #d6b46b;
  --accent-2:   #f3d18b;

  --serif:  'Cormorant Garamond', Georgia, serif;
  --sans:   'Manrope', system-ui, sans-serif;

  --radius: 14px;
  --ease:   cubic-bezier(0.16, 1, 0.3, 1);

  --max-w: 1320px;
  --slider-max: 1520px;
  --contact-max: 1020px;
  --gutter: clamp(1.25rem, 5vw, 4rem);
  --shadow-sm: 0 12px 30px rgba(0, 0, 0, .28);
  --shadow-md: 0 18px 55px rgba(0, 0, 0, .38);
  --header-height: 104px;
  --anchor-offset: 104px;
}

/* =====================================================
   2. RESET
   ===================================================== */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--anchor-offset);
}

body {
  background:
    radial-gradient(circle at top left, rgba(214,180,107,.08), transparent 24%),
    radial-gradient(circle at top right, rgba(255,255,255,.05), transparent 22%),
    linear-gradient(180deg, #050608 0%, var(--bg) 100%);
  color: var(--fg);
  font-family: var(--sans);
  font-size: 1rem;
  line-height: 1.65;
  overflow-x: hidden;
  font-weight: 300;
  padding-top: 0;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: 120px 120px;
  opacity: .18;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.5), rgba(0,0,0,0) 70%);
}

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

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

button { cursor: pointer; border: none; background: none; font-family: inherit; }

ul { list-style: none; }

:is(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

/* =====================================================
   3. SCROLL REVEAL
   ===================================================== */
.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease);
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* stagger por --i */
.step.reveal { transition-delay: calc(var(--i, 0) * 80ms); }

/* =====================================================
   4. SHARED TOKENS
   ===================================================== */
.section {
  padding-block: clamp(3.5rem, 7vw, 5.5rem);
  scroll-margin-top: var(--anchor-offset);
}

.section__header {
  padding-inline: var(--gutter);
  max-width: var(--max-w);
  margin-inline: auto;
  margin-bottom: 2rem;
}

.section__eyebrow {
  display: block;
  font-family: var(--sans);
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: .75rem;
}

.section__title {
  font-family: var(--serif);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--fg);
}

/* =====================================================
   5. HEADER
   ===================================================== */
.header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
  background: rgba(7,8,11,.72);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 0 rgba(255,255,255,.03);
  min-height: 0;
  padding-block: .55rem;
}

.header__inner {
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: var(--gutter);
  min-height: 0;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: .75rem;
}

.header__logo img {
  height: clamp(56px, 5.4vw, 92px);
  width: auto;
  object-fit: contain;
}

.nav-desktop {
  display: none;
}

.nav-desktop ul {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
}

.nav-desktop a {
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  padding: 0 1.1rem;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(243,244,246,.72);
  transition: color .2s, background .2s, border-color .2s, transform .15s;
  border: 1px solid transparent;
  border-radius: 999px;
}

.nav-desktop a:hover {
  color: #fff;
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.08);
  opacity: 0.6;
  transition: opacity 0.2s ease;
}

.nav-mobile a:hover {
  opacity: 0.6;
  transition: opacity 0.2s ease;
}

.header__actions {
  display: flex;
  align-items: center;
  gap: .7rem;
  margin-inline-start: auto;
  order: 0;
}

@media (min-width: 900px) {
  .quick-actions { display: none; }
  .header {
    min-height: 0;
  }
  .header__inner {
    flex-wrap: nowrap;
  }
  .nav-desktop {
    display: block;
    width: auto;
    order: 0;
    margin-inline-start: auto;
  }
  .nav-desktop ul {
    flex-wrap: nowrap;
  }
  .header__actions {
    order: 0;
    margin-inline-start: 0;
  }
  .header__logo img {
    height: 88px;
  }
  .hamburger { display: none; }
  .hero__actions { display: none; }
}

@media (min-width: 1400px) {
  .header__logo img {
    height: 96px;
  }
}

.header__wa {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-height: 44px;
  padding: .5rem 1.15rem;
  background: linear-gradient(135deg, #141924, #0a0d13);
  color: #fff;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  border-radius: 999px;
  box-shadow: var(--shadow-sm);
  transition: transform .15s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
}

.header__wa:hover {
  background: linear-gradient(135deg, #1b2230, #0f131a);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}
.header__wa:active { transform: scale(.98); }

.header__wa svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* Hamburguesa */
.hamburger {
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(231,221,210,.9);
  background: rgba(255,255,255,.8);
  box-shadow: var(--shadow-sm);
}

.hamburger[hidden],
.hero__actions[hidden] {
  display: none !important;
}

.hamburger span {
  display: block;
  width: 18px;
  height: 1.5px;
  background: var(--fg);
  transition: transform .3s var(--ease), opacity .3s;
}

.hamburger.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; }
.hamburger.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

@media (max-width: 899px) {
  .hamburger { display: flex; }
  .header__wa { display: none; }
  .nav-desktop { display: none; }
}

@media (max-width: 599px) {
  .header {
    padding-block-start: calc(1.92rem + env(safe-area-inset-top));
    padding-block-end: .45rem;
  }

  .header__inner {
    align-items: center;
  }

  .header__actions {
    padding-top: .52rem;
  }

  .hamburger {
    width: 42px;
    height: 42px;
    margin-top: .34rem;
    position: relative;
    top: .2rem;
  }

  .header__logo img {
    height: 74px;
    transform: translateY(.36rem);
  }
}

/* =====================================================
   6. NAV MÓVIL
   ===================================================== */
.nav-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(2,6,23,.7);
  z-index: 9998;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: opacity .3s;
}

.nav-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.nav-mobile {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(7,8,11,.98);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  padding: calc(var(--header-height) + 1.5rem) 1.75rem 2.35rem;
  transform: translate3d(102%, 0, 0);
  pointer-events: none;
  visibility: hidden;
  transition: transform .35s var(--ease), visibility 0s linear .35s;
  border-left: 1px solid var(--border);
  box-shadow: -24px 0 50px rgba(0, 0, 0, .45);
}

.nav-mobile.is-open {
  transform: none;
  pointer-events: auto;
  visibility: visible;
  transition-delay: 0s;
}

/* Botón cerrar dentro del nav-mobile */
.nav-mobile__close {
  position: absolute;
  top: calc(.55rem + env(safe-area-inset-top));
  right: calc(var(--gutter) - .25rem);
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(231,221,210,.5);
  background: rgba(255,255,255,.08);
  color: #fff;
  transition: background .2s;
}

.nav-mobile__close svg { width: 20px; height: 20px; }
.nav-mobile__close:hover { background: rgba(255,255,255,.15); }

.nav-mobile ul { display: flex; flex-direction: column; gap: 1.45rem; }

.nav-mobile a {
  font-family: var(--serif);
  font-size: 1.5rem;
  font-weight: 400;
  color: #fff;
}

.nav-mobile__wa {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .85rem 1.5rem;
  background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
  color: #fff;
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  border-radius: var(--radius);
}

.quick-actions {
  display: none !important;
}

.quick-actions__link {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 1rem;
  border-radius: 999px;
  background: rgba(166,92,31,.06);
  border: 1px solid transparent;
  color: var(--fg);
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: background .2s, transform .15s, border-color .2s;
}

.quick-actions__link:hover {
  background: rgba(166,92,31,.1);
  border-color: rgba(166,92,31,.18);
  transform: translateY(-1px);
}

.quick-actions__link--wa {
  background: linear-gradient(135deg, #25D366, #20bf5a);
  color: #fff;
}

.quick-actions__link--wa:hover {
  background: linear-gradient(135deg, #1fb75a, #19a94d);
  border-color: transparent;
}

/* =====================================================
   7. HERO
   ===================================================== */
.hero {
  position: relative;
  min-height: clamp(560px, 84svh, 740px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(1.5rem, 4vw, 2.5rem) var(--gutter) clamp(2.25rem, 4vw, 3.5rem);
  overflow: hidden;
  text-align: center;
}

@media (min-width: 900px) {
  .hero {
    min-height: clamp(680px, 82svh, 820px);
    padding: clamp(1.5rem, 2.6vw, 2rem) var(--gutter) clamp(2rem, 3vw, 2.8rem);
    align-items: center;
  }
  .hero__brand {
    display: none;
  }
  .hero__eyebrow {
    margin-bottom: .22rem;
    line-height: 1;
    transform: none;
  }
  .hero__title {
    font-size: clamp(4.8rem, 6.1vw, 6rem);
    line-height: .9;
    margin-top: 0;
    margin-bottom: .34rem;
  }
  .hero__sub {
    margin-bottom: .88rem;
    max-width: 42ch;
  }
}

.hero__bg {
  position: absolute;
  inset: 0;
}

.hero__bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  will-change: transform;
}

.hero__overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to right, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.3) 100%);
}

.hero__content {
  position: relative;
  z-index: 1;
  max-width: 920px;
  text-shadow: 0 4px 18px rgba(0,0,0,.18);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.hero__brand {
  width: auto;
  height: 80px;
  display: block;
  margin: 0 auto .3rem;
}

.hero__eyebrow {
  display: block;
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255,255,255,.66);
  margin-bottom: .24rem;
}

.hero__title {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(2.55rem, 4vw, 4.25rem);
  line-height: .98;
  letter-spacing: -0.03em;
  color: #fff;
  margin-top: 0;
  margin-bottom: .44rem;
  text-transform: none;
  text-wrap: balance;
}

.hero__title--mobile {
  max-width: 11ch;
  line-height: 1.02;
  font-size: clamp(2.08rem, 9.6vw, 2.95rem);
  text-wrap: balance;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
}

.hero__title .hero__char {
  display: inline-block;
  opacity: 0;
  transform: translateY(.45em);
  animation: hero-char-in .5s var(--ease) forwards;
  animation-delay: calc(var(--i, 0) * 32ms);
}

@keyframes hero-char-in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero__title .hero__char {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

.hero__sub {
  font-size: clamp(.92rem, 1.2vw, 1.02rem);
  font-weight: 300;
  color: rgba(255,255,255,.72);
  letter-spacing: .02em;
  margin-inline: auto;
  margin-bottom: 1.1rem;
  max-width: 42ch;
}

.hero__actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .75rem;
}

.hero__cta {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 1.15rem;
  border: 1px solid rgba(255,255,255,.12);
  color: #fff;
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-radius: 999px;
  transition: background .25s, border-color .25s, transform .15s, box-shadow .25s;
  background: rgba(255,255,255,.03);
}

.hero__cta:hover {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.18);
  box-shadow: var(--shadow-sm);
}

.hero__cta--ghost {
  background: transparent;
}

.hero__cta--ghost:hover {
  background: rgba(255,255,255,.06);
}

.hero__scroll {
  position: absolute;
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: rgba(255,255,255,.88);
  background: rgba(0,0,0,.34);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 10px 24px rgba(0,0,0,.24);
  animation: bounce 2.5s ease-in-out infinite;
}

.hero__scroll svg { width: 20px; height: 20px; }

@keyframes bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%       { transform: translateX(-50%) translateY(6px); }
}

/* =====================================================
   8. SLIDER SECTION
   ===================================================== */
.slider-section {
  background:
    radial-gradient(circle at top left, rgba(214,180,107,.08), transparent 24%),
    linear-gradient(180deg, #0b0f14 0%, #090c11 100%);
  overflow: hidden;
  position: relative;
  padding-block: clamp(3rem, 5.6vw, 4.35rem);
  min-height: clamp(740px, 83svh, 1020px);
}

.slider-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0) 18%),
    radial-gradient(circle at 100% 0%, rgba(214,180,107,.10), transparent 24%);
  pointer-events: none;
}

.slider-section > * {
  position: relative;
  z-index: 1;
}

/* Tabs */
.slider-tabs {
  display: flex;
  gap: .5rem;
  padding-inline: var(--gutter);
  max-width: var(--slider-max);
  margin-inline: auto;
  margin-bottom: 1.35rem;
  overflow-x: auto;
  scrollbar-width: none;
  position: relative;
  z-index: 2;
  justify-content: center;
  flex-wrap: wrap;
}

.slider-tabs::-webkit-scrollbar { display: none; }

.stab {
  flex-shrink: 0;
  min-height: 40px;
  padding: .48rem .95rem;
  font-family: var(--sans);
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(243,244,246,.68);
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  border-radius: 999px;
  box-shadow: var(--shadow-sm);
  transition: background .2s, color .2s, border-color .2s, transform .15s, box-shadow .2s;
  pointer-events: auto;
  touch-action: manipulation;
}

.stab:hover {
  color: #fff;
  border-color: rgba(255,255,255,.14);
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}

.stab.is-active {
  background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
  color: #fff;
  border-color: rgba(255,255,255,.12);
  box-shadow: var(--shadow-md);
}

/* Slider wrapper */
.slider {
  position: relative;
  display: flex;
  align-items: center;
  gap: .8rem;
  padding-inline: clamp(1.2rem, 3vw, 2.6rem);
  max-width: var(--slider-max);
  margin-inline: auto;
}

.slider__viewport {
  flex: 1;
  overflow: hidden;
  cursor: grab;
}

.slider__viewport:active { cursor: grabbing; }

.slider__track {
  display: flex;
  gap: 10px;
  transition: transform .45s var(--ease);
  will-change: transform;
}

.slide-item {
  display: block;
  appearance: none;
  border: 0;
  padding: 0;
  text-align: inherit;
  flex-shrink: 0;
  width: clamp(186px, 18vw, 272px);
  aspect-ratio: 5 / 4;
  overflow: hidden;
  border-radius: var(--radius);
  position: relative;
  cursor: zoom-in;
  box-shadow: var(--shadow-sm);
  background: #0d1117;
}

.slide-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s var(--ease);
}

.slide-item:hover img { transform: scale(1.04); }

.slide-item:focus-visible,
.gallery-modal__item:focus-visible {
  outline: 2px solid rgba(214,180,107,.8);
  outline-offset: 3px;
}

.slide-item__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.02) 0%, rgba(0,0,0,.58) 100%);
  opacity: 1;
  transition: opacity .3s;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 1rem;
}

.slide-item__overlay svg {
  width: 32px;
  height: 32px;
  color: #fff;
}

.slide-item__label {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 .85rem;
  border-radius: 999px;
  background: rgba(10, 13, 18, .88);
  color: #fff;
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  box-shadow: var(--shadow-sm);
}

.slide-item:hover img { transform: scale(1.05); }
.slide-item:hover .slide-item__overlay { background: linear-gradient(180deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.68) 100%); }

.hero__content,
.hero__brand,
.hero__title,
.hero__sub,
.hero__actions {
  position: relative;
  z-index: 1;
}

/* Flechas */
.slider__arrow {
  flex-shrink: 0;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  color: #fff;
  background: rgba(255,255,255,.03);
  box-shadow: var(--shadow-sm);
  transition: background .2s, border-color .2s, transform .15s, box-shadow .2s;
}

.slider__arrow svg { width: 20px; height: 20px; }
.slider__arrow:hover {
  background: rgba(255,255,255,.08);
  color: #fff;
  border-color: rgba(255,255,255,.16);
  box-shadow: var(--shadow-md);
}
.slider__arrow:active { transform: scale(.96); }
.slider__arrow:disabled { opacity: .3; pointer-events: none; }

/* Meta (counter + botón) */
.slider__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: var(--gutter);
  max-width: var(--slider-max);
  margin-inline: auto;
  margin-top: 1.1rem;
}

.slider__counter {
  font-size: .7rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(243,244,246,.55);
}

.slider__all {
  min-height: 44px;
  padding: 0 1rem;
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #fff;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  transition: color .2s, background .2s, transform .15s, box-shadow .2s;
  box-shadow: var(--shadow-sm);
}

.slider__all:hover {
  color: #fff;
  background: rgba(255,255,255,.08);
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}

.slider,
.slider__meta {
  position: relative;
  z-index: 2;
}

@media (min-width: 900px) {
  .slider__viewport {
    padding-block: .1rem;
  }

  .slide-item {
    width: clamp(286px, 21vw, 326px);
    aspect-ratio: 5 / 4;
  }
}

@media (min-width: 900px) {
  .slider-section .section__header,
  .slider-section .slider-tabs,
  .slider-section .slider,
  .slider-section .slider__meta {
    max-width: var(--slider-max);
    padding-inline: clamp(1rem, 2vw, 1.6rem);
  }

  .slider-section .section__header {
    margin-bottom: 1.9rem;
  }

  .slider-section .slider-tabs {
    margin-bottom: 1.35rem;
  }

  .slider-section .slider {
    gap: 1.15rem;
  }

  .slider-section .slider__meta {
    margin-top: 1.2rem;
  }
}

/* =====================================================
   9. NOSOTROS (50/50)
   ===================================================== */
.about {
  background:
    linear-gradient(180deg, #0b0f14 0%, #090d11 100%);
  padding-block: 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.about__grid {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 0;
}

@media (min-width: 900px) {
  .about__grid {
    grid-template-columns: 1fr 1fr;
    height: clamp(420px, 42vw, 560px);
    overflow: hidden;
  }
}

.about__img-col {
  position: relative;
  overflow: hidden;
  min-height: 240px;
  background: var(--bg-alt);
}

@media (min-width: 900px) {
  .about__img-col { min-height: unset; }
}

.about__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.about__text-col {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1.2rem, 3.1vw, 2.2rem) var(--gutter);
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
}

.about__title {
  font-family: var(--serif);
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: #fff;
  margin-top: .35rem;
  margin-bottom: .65rem;
}

.about__text {
  font-size: .95rem;
  font-weight: 300;
  color: rgba(243,244,246,.68);
  line-height: 1.64;
  max-width: 48ch;
  margin-bottom: .4rem;
}

.about__stats {
  display: flex;
  gap: 1.1rem;
  margin-block: .7rem .85rem;
  padding-top: .75rem;
  border-top: 1px solid var(--border);
}

.about__stat {
  display: flex;
  flex-direction: column;
  gap: .2rem;
}

.about__stat strong {
  font-family: var(--serif);
  font-size: 1.25rem;
  font-weight: 500;
  color: #fff;
}

.about__stat span {
  font-size: .65rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
}

.btn-primary {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  padding: .8rem 1.75rem;
  background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  color: #fff;
  font-family: var(--sans);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  border-radius: 999px;
  transition: background .2s, transform .15s, box-shadow .2s;
  box-shadow: var(--shadow-sm);
}

.btn-primary:hover {
  background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.05));
  box-shadow: var(--shadow-md);
}
.btn-primary:active { transform: scale(.98); }

/* =====================================================
   10. PROCESO
   ===================================================== */
.process {
  background:
    linear-gradient(180deg, #080b10, #07090d),
    radial-gradient(circle at top left, rgba(214,180,107,.12), transparent 40%);
}

.process__inner {
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.process .section__eyebrow { color: rgba(255,255,255,.45); }
.process .section__title   { color: #fff; }

.process__steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 0;
  margin-top: 1.75rem;
  border-top: 1px solid rgba(255,255,255,.1);
}

.step {
  padding: 2rem 0 1.85rem;
  padding-right: 1.4rem;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

@media (min-width: 900px) {
  .step {
    border-bottom: none;
    border-right: 1px solid rgba(255,255,255,.08);
    padding: 2.4rem 1.8rem 2.4rem 0;
  }
  .step:first-child { padding-left: 0; }
  .step:last-child  { border-right: none; padding-right: 0; padding-left: 1.8rem; }
  .step:not(:first-child):not(:last-child) { padding-inline: 1.8rem; }
}

.step__num {
  display: block;
  font-family: var(--serif);
  font-size: 2rem;
  font-weight: 400;
  color: rgba(255,255,255,.12);
  line-height: 1;
  margin-bottom: 1.5rem;
}

.step__title {
  font-family: var(--serif);
  font-size: 1.02rem;
  font-weight: 400;
  color: #fff;
  margin-bottom: .75rem;
}

.step__text {
  font-size: .82rem;
  font-weight: 300;
  color: rgba(255,255,255,.55);
  line-height: 1.7;
}

/* =====================================================
   11. CONTACTO
   ===================================================== */
.contact {
  background:
    linear-gradient(180deg, #080b10 0%, #090c11 100%);
  padding-block: clamp(1.25rem, 2.7vw, 1.95rem);
  border-top: 1px solid var(--border);
  position: relative;
  overflow: clip;
  min-height: calc(100svh - var(--header-height) - 28px);
  display: flex;
  align-items: center;
}

.contact__grid {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 0;
  gap: .65rem;
  padding-inline: var(--gutter);
  max-width: var(--contact-max);
  margin-inline: auto;
  align-items: start;
}

@media (min-width: 900px) {
  .contact__grid {
    grid-template-columns: minmax(210px, .72fr) minmax(300px, 1fr);
    gap: .6rem;
  }
}

/* Mapa */
.contact__map-col {
  min-height: 160px;
  border: 1px solid var(--border);
  border-radius: 20px;
  overflow: hidden;
  background: rgba(255,255,255,.02);
  box-shadow: var(--shadow-sm);
  position: relative;
  align-self: start;
}

@media (min-width: 900px) {
  .contact__map-col {
    height: clamp(180px, 16vw, 220px);
    min-height: 180px;
  }
}

.contact__map-col iframe {
  width: 100%;
  height: 100%;
  min-height: 160px;
  border: 0;
  display: block;
  position: relative;
  filter: grayscale(20%);
  background: var(--bg);
}

/* Datos */
.contact__info-col {
  padding: clamp(.9rem, 2.1vw, 1.35rem) clamp(.9rem, 2.3vw, 1.45rem);
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: var(--shadow-sm);
}

.contact__title {
  font-family: var(--serif);
  font-size: clamp(1.85rem, 3.6vw, 2.65rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  color: #fff;
  margin-top: .35rem;
  margin-bottom: .7rem;
}

.contact__data {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  margin-bottom: .75rem;
  padding-bottom: .65rem;
  border-bottom: 1px solid var(--border);
}

.contact__datum {
  display: flex;
  align-items: flex-start;
  gap: .62rem;
  padding: .58rem .72rem .58rem .7rem;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: calc(var(--radius) - 4px);
  box-shadow: var(--shadow-sm);
  transition: transform .15s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
}

.contact__datum:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
  border-color: rgba(214,180,107,.24);
}

.contact__datum svg {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  margin-top: 1px;
  color: rgba(243,244,246,.6);
}

.contact__datum > div {
  display: flex;
  flex-direction: column;
  gap: .15rem;
}

.contact__datum strong {
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #fff;
}

.contact__datum a,
.contact__datum span {
  font-size: .76rem;
  font-weight: 300;
  color: rgba(243,244,246,.68);
}

.contact__form {
  gap: .55rem;
}

.form-row input,
.form-row select,
.form-row textarea {
  padding: .56rem .82rem;
}

.form-row textarea {
  min-height: 74px;
}

.contact__datum a:hover { color: #fff; }

.contact__datum--link {
  display: flex;
  color: inherit;
}

.contact__datum--link:focus-visible,
.contact__datum--link:hover {
  color: inherit;
}

@media (min-width: 900px) {
  .contact__data {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
    margin-bottom: .75rem;
    padding-bottom: .7rem;
  }

  .contact__datum:nth-child(3) {
    grid-column: auto;
  }

  .contact__form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem .65rem;
  }

  .contact__form .form-row:nth-child(1),
  .contact__form .form-row:nth-child(2) {
    min-width: 0;
  }

  .contact__form .form-row:nth-child(3),
  .contact__form .btn-submit {
    grid-column: 1 / -1;
  }
}

@media (min-width: 900px) {
  .contact__form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem .65rem;
  }

  .contact__form .form-row:nth-child(1),
  .contact__form .form-row:nth-child(2) {
    min-width: 0;
  }

  .contact__form .form-row:nth-child(3),
  .contact__form .btn-submit {
    grid-column: 1 / -1;
  }
}

@media (min-width: 900px) {
  .contact__info-col {
    padding: .95rem 1.1rem 1.05rem;
  }

  .contact__title {
    margin-top: .25rem;
    margin-bottom: .6rem;
  }

  .contact__form .form-row textarea {
    min-height: 62px;
  }

  .contact__form .btn-submit {
    min-height: 40px;
    padding: .62rem 1.1rem;
  }
}

@media (min-width: 1400px) {
  :root {
    --max-w: 1480px;
    --slider-max: 1740px;
    --contact-max: 1180px;
  }

  .section__header {
    margin-bottom: 2.55rem;
  }

  .section__eyebrow {
    font-size: .74rem;
    letter-spacing: .2em;
    margin-bottom: .85rem;
  }

  .section__title {
    font-size: clamp(2.55rem, 2.35vw, 3.6rem);
    line-height: 1.06;
  }

  .hero {
    min-height: clamp(640px, 74svh, 820px);
    padding-top: clamp(1.15rem, 1.7vw, 1.6rem);
    padding-bottom: clamp(1.7rem, 2.4vw, 2.35rem);
  }

  .hero__content {
    max-width: 860px;
  }

  .hero__eyebrow {
    font-size: .62rem;
    letter-spacing: .22em;
    margin-bottom: .15rem;
  }

  .hero__title {
    font-size: clamp(4.05rem, 3.9vw, 5rem);
    line-height: .9;
    letter-spacing: -0.035em;
    margin-bottom: .5rem;
  }

  .hero__sub {
    font-size: clamp(1.08rem, 1.04vw, 1.2rem);
    line-height: 1.74;
    max-width: 48ch;
    margin-bottom: 1.2rem;
    color: rgba(255,255,255,.76);
  }

  .hero__actions {
    gap: .9rem;
  }

  .slider-section {
    min-height: clamp(620px, 64svh, 780px);
    padding-block: clamp(1.95rem, 2.9vw, 3rem) clamp(3rem, 3.8vw, 3.8rem);
  }

  .about__grid {
    height: clamp(480px, 41vw, 640px);
  }

  .about__text-col {
    padding: clamp(1.75rem, 2.75vw, 2.75rem) var(--gutter);
  }

  .about__title {
    font-size: clamp(2.2rem, 2.85vw, 3.35rem);
    line-height: 1.08;
  }

  .about__text {
    font-size: 1.02rem;
    line-height: 1.74;
    max-width: 52ch;
  }

  .about__stats {
    gap: 1.5rem;
    margin-block: .95rem 1.05rem;
  }

  .about__stat strong {
    font-size: 1.52rem;
  }

  .btn-primary {
    padding: .95rem 2.05rem;
    font-size: .78rem;
  }

  .process__inner {
    padding-inline: clamp(1.6rem, 2.6vw, 2.35rem);
  }

  .process__steps {
    margin-top: 2.35rem;
  }

  .step {
    padding: 2.75rem 0 2.35rem;
    padding-right: 1.95rem;
  }

  .step__num {
    font-size: 2.55rem;
    margin-bottom: 1.8rem;
  }

  .step__title {
    font-size: 1.16rem;
    margin-bottom: .85rem;
  }

  .step__text {
    font-size: .92rem;
    line-height: 1.8;
  }

  .slider {
    gap: 1.1rem;
  }

  .slide-item {
    width: clamp(312px, 18.4vw, 352px);
  }

  .contact {
    min-height: auto;
    padding-block: clamp(2.15rem, 3.1vw, 2.75rem);
  }

  .contact__grid {
    gap: .85rem;
  }

  .contact__info-col {
    padding: 1.28rem 1.45rem 1.35rem;
  }

  .contact__title {
    font-size: clamp(2.3rem, 2.8vw, 3.35rem);
    line-height: 1.08;
  }

  .contact__data {
    gap: .65rem;
    margin-bottom: .95rem;
    padding-bottom: .9rem;
  }

  .contact__datum {
    padding: .78rem .95rem .76rem;
  }

  .contact__datum strong {
    font-size: .71rem;
  }

  .contact__datum a,
  .contact__datum span {
    font-size: .86rem;
  }

  .contact__form {
    gap: .8rem;
  }

  .form-row input,
  .form-row select,
  .form-row textarea {
    padding: .84rem 1.05rem;
    font-size: .98rem;
  }

  .btn-submit {
    padding: .95rem 1.95rem;
    font-size: .8rem;
  }
}

@media (min-width: 1920px) {
  :root {
    --max-w: 1600px;
    --slider-max: 1880px;
    --contact-max: 1320px;
  }

  .section__header {
    margin-bottom: 2.8rem;
  }

  .section__title {
    font-size: clamp(2.8rem, 2.2vw, 3.9rem);
  }

  .hero {
    min-height: clamp(640px, 66svh, 820px);
    padding-top: clamp(1.05rem, 1.3vw, 1.45rem);
    padding-bottom: clamp(1.5rem, 1.95vw, 2.1rem);
  }

  .hero__content {
    max-width: 900px;
  }

  .hero__title {
    font-size: clamp(4.2rem, 3.25vw, 5.15rem);
    line-height: .9;
    margin-bottom: .45rem;
  }

  .hero__sub {
    font-size: clamp(1.1rem, .98vw, 1.2rem);
    line-height: 1.78;
    max-width: 50ch;
    margin-bottom: 1.25rem;
  }

  .about__title {
    font-size: clamp(2.4rem, 2.25vw, 3.55rem);
  }

  .contact__title {
    font-size: clamp(2.45rem, 2.3vw, 3.6rem);
  }

  .slider-section {
    min-height: clamp(540px, 58svh, 720px);
    padding-block: clamp(1.7rem, 2.25vw, 2.5rem) clamp(2.45rem, 3.2vw, 3.2rem);
  }

  .slide-item {
    width: clamp(320px, 16vw, 372px);
  }

  .contact__grid {
    gap: 1rem;
  }
}

@media (min-width: 2400px) {
  :root {
    --max-w: 1720px;
    --slider-max: 2020px;
    --contact-max: 1400px;
  }

  .section__header {
    margin-bottom: 3rem;
  }

  .section__title {
    font-size: clamp(3rem, 2vw, 4.15rem);
  }

  .hero {
    min-height: clamp(660px, 62svh, 860px);
    padding-top: clamp(1.05rem, 1.1vw, 1.35rem);
    padding-bottom: clamp(1.3rem, 1.7vw, 1.95rem);
  }

  .hero__content {
    max-width: 940px;
  }

  .hero__title {
    font-size: clamp(4.35rem, 2.95vw, 5.35rem);
  }

  .hero__sub {
    font-size: clamp(1.12rem, .86vw, 1.22rem);
    max-width: 52ch;
  }

  .about__title {
    font-size: clamp(2.55rem, 2vw, 3.8rem);
  }

  .contact__title {
    font-size: clamp(2.6rem, 2.05vw, 3.85rem);
  }

  .slider-section {
    min-height: clamp(560px, 56svh, 740px);
    padding-block: clamp(1.6rem, 2.05vw, 2.3rem) clamp(2.25rem, 2.95vw, 3rem);
  }

  .contact__grid {
    gap: 1rem;
  }
}

/* Formulario */
.contact__form {
  display: flex;
  flex-direction: column;
  gap: .85rem;
}

.form-row {
  display: flex;
  flex-direction: column;
  gap: .4rem;
}

.form-row label {
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(243,244,246,.58);
}

.form-row input,
.form-row select,
.form-row textarea {
  font-family: var(--sans);
  font-size: .9rem;
  font-weight: 300;
  color: #fff;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: calc(var(--radius) - 4px);
  padding: .7rem .95rem;
  transition: border-color .2s;
  width: 100%;
  appearance: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
}

.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus {
  outline: none;
  border-color: rgba(214,180,107,.38);
}

.form-row input::placeholder,
.form-row textarea::placeholder {
  color: rgba(243,244,246,.38);
}

.form-row textarea { min-height: 94px; resize: vertical; }

.btn-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  padding: .82rem 1.55rem;
  background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  color: #fff;
  font-family: var(--sans);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-radius: 999px;
  transition: background .2s, transform .15s, box-shadow .2s;
  align-self: flex-start;
  box-shadow: var(--shadow-sm);
}

.btn-submit svg { width: 17px; height: 17px; }
.btn-submit:hover  { background: rgba(255,255,255,.14); }
.btn-submit:active { transform: scale(.98); }

/* =====================================================
   12. FOOTER
   ===================================================== */
.footer {
  background: #06070a;
  padding-block: 1.15rem;
  border-top: 1px solid var(--border);
}

.footer__inner {
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: var(--gutter);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .8rem;
  text-align: center;
}

@media (min-width: 600px) {
  .footer__inner {
    flex-direction: row;
    justify-content: space-between;
    text-align: left;
  }
}

.footer__logo {
  height: 72px;
  width: auto;
  object-fit: contain;
  opacity: .92;
}

.footer__nav {
  display: flex;
  gap: 2rem;
}

.footer__nav a {
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(243,244,246,.58);
  transition: color .2s;
}

.footer__nav a:hover { color: #fff; }

.footer__copy {
  font-size: .7rem;
  letter-spacing: .06em;
  color: rgba(243,244,246,.36);
}

/* =====================================================
   13. LIGHTBOX
   ===================================================== */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 6000;
  background: rgba(0,0,0,.92);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity .3s;
}

.lightbox[hidden] {
  display: none !important;
}

.lightbox.is-open { opacity: 1; }

.lb-img {
  max-width: min(90vw, 1200px);
  max-height: 88dvh;
  object-fit: contain;
  border-radius: var(--radius);
}

.lb-btn {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  color: rgba(255,255,255,.7);
  border-radius: var(--radius);
  background: rgba(255,255,255,.08);
  transition: background .2s, color .2s;
}

.lb-btn:hover { background: rgba(255,255,255,.18); color: #fff; }

.lb-close { top: 1.25rem; right: 1.25rem; }
.lb-close svg { width: 22px; height: 22px; }

.lb-prev  { left: 1.25rem;  top: 50%; transform: translateY(-50%); }
.lb-next  { right: 1.25rem; top: 50%; transform: translateY(-50%); }
.lb-prev svg, .lb-next svg { width: 22px; height: 22px; }

.lb-counter {
  position: absolute;
  bottom: 1.25rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: .7rem;
  letter-spacing: .1em;
  color: rgba(255,255,255,.45);
}

/* =====================================================
   14. GALERÍA MODAL (ver todas)
   ===================================================== */
.gallery-modal {
  position: fixed;
  inset: 0;
  z-index: 5500;
  background: #07080b;
  overflow-y: auto;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: opacity .3s;
}

.gallery-modal.is-open {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.gallery-modal__header {
  position: sticky;
  top: 0;
  background: rgba(7,8,11,.92);
  border-bottom: 1px solid var(--border);
  padding: 1rem var(--gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 1;
}

.gallery-modal__header h3 {
  font-family: var(--serif);
  font-size: 1rem;
  font-weight: 400;
  color: #fff;
}

.gallery-modal__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius);
  color: #fff;
  transition: background .2s;
}

.gallery-modal__close svg { width: 18px; height: 18px; }
.gallery-modal__close:hover { background: rgba(255,255,255,.08); color: #fff; }

.gallery-modal__body {
  padding: 1.5rem var(--gutter) 2rem;
  max-width: var(--max-w);
  margin-inline: auto;
}

.gallery-modal__filters {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 2rem;
}

.gallery-modal__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px;
}

.gallery-modal__item {
  display: block;
  appearance: none;
  border: 0;
  padding: 0;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: var(--radius);
  cursor: pointer;
  background: #0d1117;
}

.gallery-modal__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s var(--ease);
}

.gallery-modal__item:hover img { transform: scale(1.04); }

/* =====================================================
   15. RESPONSIVE POLISH
   ===================================================== */
@media (max-width: 1099px) {
  .header__inner {
    gap: .6rem;
  }

  .hero {
    min-height: clamp(520px, 86svh, 700px);
  }

  .hero__title {
    font-size: clamp(2.2rem, 4.2vw, 3.45rem);
    line-height: .98;
  }

  .hero__sub {
    max-width: 36ch;
  }
}

@media (max-width: 899px) {
  :root {
    --anchor-offset: 88px;
  }

  .nav-mobile {
    padding-bottom: 4rem;
  }

  .header {
    padding-block-start: calc(1.98rem + env(safe-area-inset-top));
    padding-block-end: .6rem;
  }

  .header__inner {
    align-items: flex-start;
  }

  .header__actions {
    padding-top: .82rem;
  }

  .hamburger {
    width: 42px;
    height: 42px;
    margin-top: .54rem;
  }

  .hero {
    min-height: 100svh;
    padding-top: calc(var(--header-height) + 1.7rem);
    padding-bottom: 2.15rem;
    align-items: flex-start;
    justify-content: center;
  }

  .hero__bg-img {
    object-position: center 30%;
  }

  .hero__brand {
    display: none;
  }

  .hero__eyebrow {
    margin-bottom: .34rem;
    line-height: 1;
  }

  .hero__title {
    font-size: clamp(2.12rem, 9vw, 3.05rem);
    line-height: 1.02;
    margin-top: 0;
    margin-bottom: .62rem;
    max-width: 11ch;
  }

  .hero__sub {
    margin-bottom: 1.08rem;
    max-width: 31ch;
  }

  .hero__actions {
    margin-top: 5.9rem;
  }

  .hero__scroll {
    bottom: .8rem;
  }

  .nav-mobile__wa {
    margin-top: auto;
    margin-bottom: .18rem;
  }

  .slider-tabs {
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: .45rem;
  }

  .about__grid {
    gap: 0;
  }

  .about__text-col {
    order: 1;
    padding: 1.8rem var(--gutter) 1.9rem;
  }

  .about__img-col {
    order: 2;
    min-height: 220px;
  }

  .about__stats {
    gap: 1.25rem;
    flex-wrap: wrap;
  }

  .process__steps {
    grid-template-columns: 1fr;
  }

  .step {
    padding-right: 0;
  }

  .contact__grid {
    gap: .58rem;
  }

  .contact__map-col {
    min-height: 132px;
  }

  .contact__map-col iframe {
    min-height: 132px;
  }

  .contact__info-col {
    padding: .88rem .92rem .96rem;
  }

  .contact {
    min-height: 0;
    display: block;
    padding-block: 1.7rem 2.05rem;
  }

  .contact__title {
    font-size: clamp(1.66rem, 7vw, 2.08rem);
    margin-top: .24rem;
    margin-bottom: .42rem;
  }

  .contact__data {
    gap: .36rem;
    margin-bottom: .5rem;
    padding-bottom: .45rem;
  }

  .contact__datum {
    gap: .46rem;
    padding: .46rem .62rem .46rem .6rem;
  }

  .contact__datum svg {
    width: 14px;
    height: 14px;
  }

  .contact__datum a,
  .contact__datum span {
    font-size: .7rem;
  }

  .contact__form {
    gap: .38rem;
  }

  .form-row label {
    line-height: 1.1;
  }

  .form-row input,
  .form-row select,
  .form-row textarea {
    font-size: .8rem;
    padding: .44rem .66rem;
  }

  .form-row textarea {
    min-height: 48px;
  }

  .contact__form .btn-submit {
    min-height: 35px;
    padding: .48rem .92rem;
  }

  .footer__logo {
    height: 64px;
  }
}

@media (max-width: 599px) {
  :root {
    --anchor-offset: 80px;
  }

  .section {
    padding-block: 3rem;
  }

  .section__header {
    margin-bottom: 1.5rem;
  }

  .section__title {
    font-size: clamp(1.9rem, 9vw, 2.4rem);
  }

  .slider-section {
    padding-block: 3.55rem 4.55rem;
    min-height: clamp(700px, 82svh, 930px);
  }

  .slider {
    padding-inline: 0;
  }

  .slider__meta,
  .slider-tabs {
    padding-inline: 0;
  }

  .slider__arrow {
    width: 40px;
    height: 40px;
  }

  .slide-item {
    width: clamp(198px, 76vw, 300px);
    aspect-ratio: 5 / 4;
  }

  .about__title {
    font-size: clamp(1.65rem, 7vw, 2.2rem);
  }

  .about__text {
    max-width: none;
    line-height: 1.68;
  }

  .about__stats strong {
    font-size: 1.3rem;
  }

  .contact__grid {
    gap: .42rem;
  }

  .contact__info-col {
    padding: .76rem .82rem .86rem;
  }

  .contact__title {
    font-size: clamp(1.58rem, 6.8vw, 1.95rem);
    margin-top: .18rem;
    margin-bottom: .35rem;
  }

  .contact__data {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .34rem;
    margin-bottom: .45rem;
    padding-bottom: .42rem;
  }

  .contact__datum {
    padding: .42rem .54rem .42rem .52rem;
    gap: .42rem;
  }

  .contact__datum a,
  .contact__datum span {
    font-size: .69rem;
  }

  .contact__form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .35rem .48rem;
  }

  .contact__form .form-row:nth-child(1),
  .contact__form .form-row:nth-child(2) {
    min-width: 0;
  }

  .contact__form .form-row:nth-child(3),
  .contact__form .btn-submit {
    grid-column: 1 / -1;
  }

  .form-row input,
  .form-row select,
  .form-row textarea {
    padding: .4rem .62rem;
    font-size: .79rem;
  }

  .form-row textarea {
    min-height: 44px;
  }

  .contact__form .btn-submit {
    min-height: 34px;
    padding: .46rem .86rem;
    font-size: .68rem;
  }

  .process {
    padding-block: 3rem;
  }

  .process__steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    border-top: none;
    margin-top: 1.25rem;
  }

  .step {
    padding: 1.2rem .95rem 1rem;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    background: rgba(255,255,255,.02);
  }

  .step__num {
    font-size: 1.6rem;
    margin-bottom: .85rem;
  }

  .contact {
    padding-block: 2.75rem;
  }

  .contact__title {
    font-size: clamp(1.8rem, 8vw, 2.4rem);
  }

  .contact__map-col {
    min-height: 140px;
  }

  .contact__map-col iframe {
    min-height: 140px;
  }

  .footer {
    padding-block: .95rem;
  }

  .footer__nav {
    gap: 1.25rem;
    flex-wrap: wrap;
    justify-content: center;
  }

  .footer__copy {
    line-height: 1.4;
  }

.gallery-modal__grid {
  grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 900px) and (max-width: 1399px) {
  .hero__brand {
    display: none !important;
  }

  .hero__title {
    font-size: clamp(5.25rem, 6.2vw, 6rem);
    line-height: .92;
  }
}