/* ==========================================================================
   Additions on top of the approved main.css, for CMS features added after
   the initial conversion (custom pages, menu dropdowns). Deliberately kept
   in its own file rather than edited into main.css, so main.css stays a
   byte-for-byte copy of the approved design file.
   ========================================================================== */

/* Free-form rich content on admin-created custom pages
   (resources/views/pages/custom.blade.php) */
.page-content {
  font-family: "Barlow", system-ui, sans-serif;
  font-size: 1.05rem;
  line-height: 1.75;
  color: #2b3948;
}
.page-content h2, .page-content h3, .page-content h4 {
  font-family: "Archivo", system-ui, sans-serif;
  font-weight: 700;
  color: #0b1622;
  margin-top: 2rem;
  margin-bottom: .75rem;
}
.page-content p { margin-bottom: 1.1rem; }
.page-content ul, .page-content ol { margin-bottom: 1.1rem; padding-left: 1.4rem; }
.page-content img { max-width: 100%; border-radius: 10px; margin: 1rem 0; }
.page-content a { color: #f7761f; }

/* Bootstrap-dropdown submenus rendered from Menu/MenuItem records
   (resources/views/partials/header.blade.php). Nests inside the existing
   .ses-nav styling from main.css without altering it. */
.ses-nav .nav-item-has-children { position: relative; }
.ses-nav .dropdown-toggle::after { margin-left: .35rem; vertical-align: .1em; }
.ses-nav .dropdown-menu {
  border: 0;
  border-radius: 10px;
  box-shadow: 0 18px 40px rgba(6, 13, 22, 0.18);
  padding: .5rem;
  margin-top: .5rem;
}
.ses-nav .dropdown-menu .dropdown-item {
  border-radius: 6px;
  padding: .55rem .75rem;
  font-size: .92rem;
}
.ses-nav .dropdown-menu .dropdown-item:hover,
.ses-nav .dropdown-menu .dropdown-item:focus {
  background: rgba(247, 118, 31, 0.08);
  color: #f7761f;
}

.ses-drawer .drawer-submenu {
  padding-left: 1rem;
  border-left: 1px solid rgba(255, 255, 255, 0.12);
  margin: .25rem 0 .5rem 1rem;
}

/* Project Gallery: responsive thumbnail grid + lightbox modal
   (resources/views/pages/project-galleries/show.blade.php). */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}
@media (min-width: 576px) { .gallery-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 992px) { .gallery-grid { grid-template-columns: repeat(4, 1fr); } }

.gallery-thumb {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  cursor: pointer;
}
.gallery-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease;
}
.gallery-thumb:hover img, .gallery-thumb:focus img { transform: scale(1.06); }
.gallery-thumb__zoom {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.5rem;
  background: rgba(11, 22, 34, 0);
  opacity: 0;
  transition: opacity .25s ease, background .25s ease;
}
.gallery-thumb:hover .gallery-thumb__zoom,
.gallery-thumb:focus .gallery-thumb__zoom {
  opacity: 1;
  background: rgba(11, 22, 34, .35);
}
.gallery-thumb__caption {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: .5rem .65rem;
  font-size: .82rem;
  color: #fff;
  text-align: left;
  background: linear-gradient(180deg, rgba(11, 22, 34, 0) 0%, rgba(11, 22, 34, .8) 100%);
}

#galleryModal .modal-content { background: #0b1622; border: 0; }
#galleryModal .carousel-item img { max-height: 78vh; width: 100%; object-fit: contain; background: #000; }
#galleryModal .btn-close { filter: invert(1) grayscale(1) brightness(2); }