/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.2
 Text Domain:  bricks
*/

/* Landing Page -- Under Construction -- Splash Page */

/* 1. Main Outer Container */
#brxe-ipkuop {
  max-width: 350px;
}
.splash-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center; /* Horizontally center all children */
  justify-content: space-between; /* Pushes top spacer/middle to center, bottom to floor */
  min-height: 100dvh; /* Full screen height (dvh handles mobile browsers cleanly) */
  padding: 5rem 1.5rem; /* Prevents elements touching browser edges */
  box-sizing: border-box;
}

/* 2. Middle Content (Logo + Links) */
.splash-main-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.5rem; /* Clean spacing between VdC Logo and Links */
  margin-top: auto; /* Auto margin trick pushes it into true vertical center */
  margin-bottom: auto; /* Auto margin trick balances top and bottom distance */
}

/* 3. Links Row */
.splash-links {
  display: flex;
  gap: 10rem; /* Equal horizontal spacing between Cava Jardín, Bistró, etc. */
  align-items: center;
  padding: 4.5rem 5rem 0;
}

/* 4. Bottom Footer Text */
.proximamente-text {
  margin-top: 0; /* Anchors directly to bottom padding */
  align-items: center; /* Centers text horizontally */
}

/* ==========================================================================
   Mobile Responsive Adaptations (Mobile / Tablet)
   ========================================================================== */

@media (max-width: 767px) {
  #brxe-ipkuop {
    max-width: 280px;
  }
  /* Reduce outer container padding to give content room on small screens */
  .splash-wrapper {
    padding: 2.5rem 1.25rem;
  }

  /* Compact the spacing between logo and links */
  .splash-main-content {
    gap: 1.75rem;
  }

  /* Scale SVG logo appropriately for handheld screens */
  .splash-main-content .brxe-svg {
    max-width: 300px;
  }

  /* Stack nav links vertically, center them, and reset huge desktop margins */
  .splash-links {
    flex-direction: column;
    gap: 1rem;
    padding: 2.2rem 0 0; /* Clears the large 10rem / 6rem padding */
    text-align: center;
  }
}

/* Optional: Handling short screen heights (e.g. landscape phones) */
@media (max-height: 600px) {
  .splash-wrapper {
    padding: 1.5rem 1rem;
  }

  .splash-main-content {
    gap: 1rem;
  }

  .splash-links {
    padding-top: 0.5rem;
    gap: 0.5rem;
  }
}
/* Ensure cursor feedback and smooth GPU acceleration */
.splash-links h2 {
  will-change: transform, opacity;
  transition: color 0.3s ease;
  cursor: default;
  user-select: none;
}
