@charset "utf-8";
/* CSS Document */

/* ===== Hero Section (Static Grid) ===== */

.fullscreen {
  min-height: 100vh;
  position: relative;
  overflow: hidden;
}

/* Gradient background */
.theme-bg.gr-blte {
  background: linear-gradient(90deg, #0b70b8 0%, #00babb 100%);
  position: absolute;
  inset: 0;
  z-index: 0;
}

/* Overlay (optional tint, can remove if not needed) */
.bg-overlay[data-style="4"] {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.2), rgba(0,0,0,.05));
  z-index: 1;
  pointer-events: none;
}

/* Ensure content sits above */
#about-our-theme .container {
  position: relative;
  z-index: 2;
}

/* Card grid */
.card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 230px;
  gap: 15px;
}

.card-tile {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
}

.image-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Spans */
.card-wide { grid-column: span 2; }
.card-tall { grid-row: span 2; }

/* Text card */
.theme-text {
  background: rgba(255, 255, 255, 0.15);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2rem;
  text-align: left;
}
.theme-text h2 {
  margin-bottom: 1rem;
  font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem);
  font-weight: 600;
}
.theme-text p {
  margin-bottom: 1.5rem;
  opacity: 0.95;
}

/* Responsive */
@media (max-width: 991.98px) {
  .card-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 180px;
  }
}
@media (max-width: 575.98px) {
  .card-grid {
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 160px;
  }
 .card-grid {
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 160px;
    gap: 12px;
  }
  .tile--text {
    grid-column: 1 / -1;  /* span both columns */
    min-height: 200px;
  }
  .tile--building,
  .tile--fisher {
    display: none !important;
  }}
/* Mobile: let grid rows grow to fit the text tile */
@media (max-width: 575.98px){
  .card-grid{
    grid-template-columns: 1fr 1fr;
    /* was: grid-auto-rows: 160px; */
    grid-auto-rows: minmax(160px, auto);
    gap: 12px;
  }
  .tile--text{
    grid-column: 1 / -1;          /* full width */
    min-height: 0;                 /* don't force overflow */
    padding: 1.25rem 1.25rem 1.5rem;
  }
  /* tidy inner spacing so buttons don't push overflow */
  .tile--text > *:last-child{ margin-bottom: 0; }
}

/* iPad portrait too */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){
  .card-grid{
    grid-auto-rows: minmax(180px, auto);
    gap: 14px;
  }
  .tile--text{
    grid-column: 1 / -1;
    min-height: 0;
  }
}
#about-our-theme .container {
  padding-right: 35px !important;  /* remove right gap */
}

@media (min-width: 1200px) and (max-width: 1400px) {
  .home-laptop-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 230px;   /* ✅ fixes spacing issue */
    gap: 15px;
  }
  
  .home-text-block {
    display: flex;
    flex-direction: column;
    justify-content: center;   /* centers vertically */
    align-items: flex-start;   /* left aligned */
    padding: 20px;
    height: auto;
  }

  .home-text-block p {
    font-size: 1rem;
    line-height: 1.4;
  }
}

/* For 1440px wide screens (laptops / WSXGA) */
@media (min-width: 1400px) and (max-width: 1500px) {
  .card-grid {
    grid-auto-rows: 215px!important;  /* the value you tested */
  }
}