:root { --dark-gray: #132945; }
html { scroll-behavior: smooth; }
section[id], footer[id], #ubicacion { scroll-margin-top: 100px; }

/* A short architectural introduction before the Crafto page is revealed. */
body.gug-is-loading { overflow: hidden; }
.gug-loader {
  isolation: isolate;
  overflow: hidden;
  min-height: 100vh;
  min-height: 100svh;
  padding: 32px;
  background: radial-gradient(circle at 50% 43%, #16335b 0, #0b2042 38%, #07172f 76%);
  font-family: var(--alt-font, 'Urbanist', sans-serif);
  text-align: center;
  transform: translateY(0);
  transition: transform .82s cubic-bezier(.76, 0, .24, 1);
  will-change: transform;
  animation: gug-loader-failsafe 0s linear 7s forwards;
}
.gug-loader::before {
  content: '';
  position: absolute;
  inset: -30%;
  z-index: -1;
  background: radial-gradient(circle, rgba(204, 165, 91, .12), transparent 35%);
  pointer-events: none;
}
.gug-loader::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #f2d798 50%, transparent);
  opacity: .85;
}
.gug-loader.is-exiting { transform: translateY(-102%); pointer-events: none; }
.gug-loader__grid {
  position: absolute;
  inset: -60px;
  z-index: -1;
  background-image: linear-gradient(rgba(239, 218, 173, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(239, 218, 173, .045) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at center, #000 8%, transparent 72%);
  animation: gug-grid-drift 5s linear infinite;
  pointer-events: none;
}
.gug-loader__edge {
  position: absolute;
  right: clamp(24px, 4vw, 62px);
  left: clamp(24px, 4vw, 62px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  color: #b6c6db;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .22em;
  line-height: 1.4;
}
.gug-loader__edge--top { top: 35px; }
.gug-loader__edge--top span:first-child { color: #dabb78; }
.gug-loader__edge--bottom { bottom: 35px; }
.gug-loader__progress { flex: 0 1 220px; height: 1px; background: rgba(255,255,255,.22); overflow: hidden; }
.gug-loader__progress span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #a67d3c, #f8dfa5, #a67d3c);
  transform: scaleX(0);
  transform-origin: left;
  animation: gug-progress 1.8s .15s cubic-bezier(.25, .1, .3, 1) forwards;
}
.gug-loader__stage { width: min(780px, 100%); transform: translateY(-8px); }
.gug-loader__eyebrow {
  display: block;
  color: #e1c58b;
  font-size: clamp(9px, 1.1vw, 12px);
  font-weight: 700;
  letter-spacing: .25em;
  opacity: 0;
  animation: gug-rise .55s .08s ease-out forwards;
}
.gug-loader__architecture { display: block; width: 100%; height: auto; margin: 12px auto -12px; overflow: visible; }
.gug-loader__plane { fill: #d2b16f; opacity: 0; animation: gug-plane .9s .56s ease-out forwards; }
.gug-loader__stroke {
  stroke: url(#gug-loader-gold);
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: gug-draw 1.1s .28s cubic-bezier(.45, 0, .2, 1) forwards;
}
.gug-loader__stroke--roof { stroke-width: 2.5; animation-delay: .18s; }
.gug-loader__stroke--wall { stroke-width: 1.8; animation-delay: .34s; }
.gug-loader__stroke--wing { animation-delay: .52s; }
.gug-loader__stroke--inner { animation-delay: .6s; }
.gug-loader__stroke--details { stroke: #dce6f3; stroke-width: 1.1; animation-delay: .76s; }
.gug-loader__stroke--ground { stroke-width: 1.8; animation-delay: .42s; }
.gug-loader__stroke--measure { stroke: #7291b9; animation-delay: .86s; }
.gug-loader__brand { display: flex; flex-direction: column; align-items: center; margin-top: -12px; }
.gug-loader__brand img {
  display: block;
  width: clamp(82px, 10vw, 112px);
  height: auto;
  margin-bottom: 12px;
  opacity: 0;
  filter: drop-shadow(0 4px 15px rgba(214, 171, 83, .24));
  animation: gug-logo .8s .72s cubic-bezier(.2, .7, .2, 1) forwards;
}
.gug-loader__brand strong {
  color: #fff;
  font-size: clamp(20px, 3.3vw, 36px);
  font-weight: 600;
  letter-spacing: .14em;
  line-height: 1.1;
  opacity: 0;
  animation: gug-rise .65s 1.03s ease-out forwards;
}
.gug-loader__brand > span {
  display: block;
  margin-top: 8px;
  color: #dabb78;
  font-size: clamp(9px, 1vw, 11px);
  font-weight: 700;
  letter-spacing: .33em;
  opacity: 0;
  animation: gug-rise .65s 1.15s ease-out forwards;
}
@keyframes gug-draw { to { stroke-dashoffset: 0; } }
@keyframes gug-plane { to { opacity: .06; } }
@keyframes gug-rise { from { opacity: 0; transform: translateY(13px); } to { opacity: 1; transform: translateY(0); } }
@keyframes gug-logo { from { opacity: 0; transform: translateY(15px) scale(.91); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes gug-progress { to { transform: scaleX(1); } }
@keyframes gug-grid-drift { to { transform: translate(48px, 48px); } }
@keyframes gug-loader-failsafe { to { visibility: hidden; pointer-events: none; } }

@media (max-width: 767px) {
  .gug-loader { padding: 25px; }
  .gug-loader__edge { font-size: 8px; letter-spacing: .13em; }
  .gug-loader__edge--top { top: 24px; }
  .gug-loader__edge--bottom { bottom: 26px; flex-wrap: wrap; justify-content: center; gap: 9px 20px; }
  .gug-loader__edge--bottom > span:first-child { width: 100%; }
  .gug-loader__progress { order: 3; flex-basis: min(230px, 74vw); margin-top: 7px; }
  .gug-loader__stage { transform: translateY(-18px); }
  .gug-loader__architecture { margin-top: 18px; margin-bottom: -3px; }
  .gug-loader__brand { margin-top: 0; }
  .gug-loader__brand img { margin-bottom: 10px; }
  .gug-loader__brand strong { letter-spacing: .08em; }
  .gug-loader__brand > span { letter-spacing: .19em; }
}
@media (max-width: 380px) {
  .gug-loader__edge--top span:last-child { max-width: 142px; text-align: right; }
  .gug-loader__eyebrow { max-width: 240px; margin: auto; line-height: 1.5; }
}
@media (prefers-reduced-motion: reduce) {
  .gug-loader, .gug-loader__grid, .gug-loader__stroke, .gug-loader__plane, .gug-loader__eyebrow,
  .gug-loader__brand img, .gug-loader__brand strong, .gug-loader__brand > span, .gug-loader__progress span {
    animation: none !important;
    transition-duration: .15s !important;
  }
  .gug-loader__stroke { stroke-dashoffset: 0; }
  .gug-loader__plane { opacity: .06; }
  .gug-loader__eyebrow, .gug-loader__brand img, .gug-loader__brand strong, .gug-loader__brand > span { opacity: 1; transform: none; }
  .gug-loader__progress span { transform: scaleX(1); }
}

/* Grupo United Gold identity inside the supplied Crafto layout. */
header .navbar-brand.gug-brand { gap: 12px; padding: 7px 0; }
header .navbar-brand.gug-brand img {
  max-height: 68px;
  max-width: 78px;
  width: auto;
  object-fit: contain;
}
.gug-brand-text { display: flex; flex-direction: column; line-height: 1.18; white-space: nowrap; }
.gug-brand-text strong { font-family: var(--alt-font); font-size: 17px; letter-spacing: .075em; color: #0c1d3f; }
.gug-brand-text small { font-family: var(--alt-font); font-size: 10px; font-weight: 700; letter-spacing: .17em; color: #9c7a35; }
.navbar .navbar-nav .nav-link { font-size: 16px; }
.bg-orange { background-color: #a7833f; }
.text-orange { color: #a7833f; }

#inicio .col-md-8.position-relative { max-width: 850px; }
#inicio .col-md-8.position-relative > div.alt-font {
  text-wrap: balance;
  width: 100% !important;
  font-size: clamp(58px, 7.2vw, 100px);
  line-height: .94;
  word-break: normal;
  overflow-wrap: normal;
}
#inicio .swiper-slide .position-absolute.col-xxl-5 { min-height: 155px; }
#inicio .swiper-slide .position-absolute.col-xxl-5 h4 { font-size: 32px; line-height: 1.12; }

#proyectos .image > a { display: block; }
#proyectos .image > a img { display: block; width: 100%; aspect-ratio: 1.42; object-fit: cover; }
#proyectos .content > p { min-height: 56px; line-height: 1.55; }
#proyectos .content .row.g-0 .fw-600 { font-size: 15px; }
#proyectos .fs-24.alt-font { font-size: 18px !important; }
#proyectos .content .row.g-0 .col { min-width: 0; }
#proyectos .content .row.g-0 .col span { overflow-wrap: anywhere; }

#arrecife .interactive-banner-style-05 figure > a > img {
  aspect-ratio: .78;
  object-fit: cover;
}
#arrecife .interactive-banner-style-05 figcaption > img {
  width: 65px;
  height: 65px !important;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
@media (hover: none), (pointer: coarse) {
  #arrecife .interactive-banner-style-05 figure figcaption .btn {
    margin-bottom: 0;
    visibility: visible;
    opacity: 1;
  }
}
#principios .amenity-icon { width: 75px; height: 75px; object-fit: contain; }
#mirada .review-style-08 img { object-fit: contain; background: #eff3f8; padding: 10px; }
#mirada .review-star-icon { color: #697990; font-size: 14px !important; letter-spacing: 0; }
#mirada figure figcaption h1 { font-size: 48px; line-height: 1.1; padding-top: 12px; }
#galeria .blog-image img { width: 100%; aspect-ratio: 1.1; object-fit: cover; }

footer .gug-footer-brand img { max-height: 105px; max-width: 135px; }
footer .bg-base-color .btn-white { white-space: nowrap; }
#lead-feedback { display: block; }
#lead-feedback[hidden] { display: none !important; }

@media (max-width: 1399px) {
  .gug-brand-text strong { font-size: 14px; }
  .gug-brand-text small { font-size: 8px; }
  .navbar .navbar-nav .nav-link { font-size: 15px; }
  header .col-auto.ms-auto.ps-lg-0 { display: none !important; }
}
@media (max-width: 1199px) {
  /* Keep entrance translations from widening the touch viewport mid-scroll. */
  #enfoque, #proyectos { overflow-x: clip; }
  .gug-brand-text { display: none; }
  #inicio .swiper-slide .position-absolute.col-xxl-5 { min-height: auto; }
}
/* The desktop hero summary remains present on touch screens, with its own space. */
@media (max-width: 991px) {
  #inicio .swiper.full-screen {
    height: clamp(680px, calc(100svh - 80px), 820px) !important;
  }
  #inicio .swiper-slide > .container > .row {
    align-items: flex-start !important;
    padding-top: clamp(48px, 8vh, 76px);
  }
  #inicio .gug-hero-info {
    display: block;
    width: min(700px, calc(100% - 24px));
    min-height: 132px !important;
    padding: 22px 24px !important;
    border-radius: 12px 0 0 0;
    box-shadow: 0 -12px 38px rgba(7, 20, 45, .15);
  }
  #inicio .gug-hero-info > .row {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    margin: 0;
  }
  #inicio .gug-hero-info > .row > div {
    width: auto;
    min-width: 0;
    padding: 0 !important;
    margin-bottom: 0 !important;
  }
  #inicio .gug-hero-info .col { padding-inline: 6px; }
  #inicio .gug-hero-info img { height: 38px !important; margin-bottom: 3px !important; }
  #inicio .gug-hero-info .col span { font-size: 13px !important; line-height: 1.2; }
  #inicio .gug-hero-info .col-xl-5 > span { font-size: 13px; line-height: 1.3; }
  #inicio .gug-hero-info h4 { font-size: 25px !important; line-height: 1.08 !important; }
  #inicio .swiper-number-pagination-style-01 .swiper-number { bottom: 158px !important; }
}
@media (max-width: 767px) {
  header .navbar-brand.gug-brand img { max-height: 58px; max-width: 65px; }
  .gug-brand-text { display: flex; }
  .gug-brand-text strong { font-size: 12px; letter-spacing: .045em; }
  .gug-brand-text small { font-size: 7px; letter-spacing: .09em; }
  header .navbar-brand.gug-brand { gap: 7px; }
  #inicio .col-md-8.position-relative > div.alt-font { font-size: clamp(42px, 10vw, 74px) !important; line-height: .95 !important; }
  #inicio .swiper-slide .col-md-8.position-relative > span {
    font-size: 14px !important;
    line-height: 1.3;
    margin-bottom: 12px !important;
  }
  #inicio .swiper-slide .col-md-8.position-relative > a.btn {
    font-size: 12px;
    padding: 13px 18px;
  }
  #proyectos .content > p { min-height: 0; }
  #proyectos .fs-24.alt-font { font-size: 16px !important; }
  #arrecife .interactive-banner-style-05 figure > a > img { aspect-ratio: 1.05; }
  footer .bg-base-color .btn-white { white-space: normal; }
  #lead-form input { padding: 15px 20px !important; height: 56px; }
  #lead-form button.btn {
    position: static !important;
    transform: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: auto;
    margin-top: 12px;
    padding: 12px 20px !important;
    background: #fff;
    border: 1px solid #fff;
    border-radius: 6px;
    color: #0c1d3f;
  }
  #lead-form button.btn span { display: inline !important; }
}

@media (max-width: 575px) {
  #inicio .swiper.full-screen {
    height: clamp(665px, calc(100svh - 72px), 790px) !important;
  }
  #inicio .swiper-slide > .container > .row { padding-top: 46px; }
  #inicio .gug-hero-info {
    width: calc(100% - 16px);
    min-height: 166px !important;
    padding: 16px 18px 18px !important;
  }
  #inicio .gug-hero-info > .row {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
  #inicio .gug-hero-info .col { padding-inline: 3px; }
  #inicio .gug-hero-info img { height: 34px !important; margin-bottom: 2px !important; }
  #inicio .gug-hero-info .col span { font-size: 11px !important; }
  #inicio .gug-hero-info .col-xl-5 { text-align: center !important; }
  #inicio .gug-hero-info .col-xl-5 > span { margin-bottom: 2px !important; font-size: 12px; }
  #inicio .gug-hero-info h4 { font-size: 22px !important; line-height: 1.08 !important; }
  #inicio .swiper-number-pagination-style-01 .swiper-number { bottom: 188px !important; }
}
@media (max-width: 359px) {
  #inicio .swiper.full-screen {
    height: clamp(630px, calc(100svh - 68px), 790px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}