/**
 * Construction Industry Theme
 * Professional palette: Primary #1E3A8A, Accent #F59E0B
 * Ensures strong contrast, readable text, and clear card hierarchy.
 */

/* ========== CSS Custom Properties ========== */
:root {
  --construction-primary: #1E3A8A;
  --construction-primary-hover: #1E40AF;
  --construction-primary-light: rgba(30, 58, 138, 0.08);
  --construction-primary-border: rgba(30, 58, 138, 0.25);
  --construction-accent: #F59E0B;
  --construction-accent-hover: #D97706;
  --construction-accent-light: rgba(245, 158, 11, 0.12);
  --construction-bg: #F8FAFC;
  --construction-section: #EEF2F7;
  --construction-card: #FFFFFF;
  --construction-text: #0F172A;
  --construction-text-secondary: #475569;
  --construction-border: #E2E8F0;
  --construction-shadow-sm: 0 1px 2px 0 rgba(15, 23, 42, 0.05);
  --construction-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.07), 0 2px 4px -2px rgba(15, 23, 42, 0.05);
  --construction-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.05);
  --construction-shadow-card: 0 1px 3px 0 rgba(15, 23, 42, 0.08), 0 1px 2px -1px rgba(15, 23, 42, 0.06);
}

/* ========== Base & Page Background ========== */
body.bg-slate-950 {
  background-color: var(--construction-bg) !important;
  color: var(--construction-text) !important;
}

/* Fixed background layer: subtle gradient instead of dark */
.fixed.inset-0.-z-10 .from-slate-950,
.fixed.inset-0.-z-10 .via-slate-950,
.fixed.inset-0.-z-10 .to-slate-900,
.bg-gradient-to-b.from-slate-950.via-slate-950.to-slate-900 {
  background: linear-gradient(180deg, var(--construction-bg) 0%, var(--construction-section) 100%) !important;
}

/* Decorative blurs: primary and accent tints (override inline radial gradients) */
.fixed.inset-0.-z-10 [style*="14,165,233"] {
  background: radial-gradient(closest-side, rgba(30, 58, 138, 0.12), transparent 70%) !important;
}
.fixed.inset-0.-z-10 [style*="16,185,129"] {
  background: radial-gradient(closest-side, rgba(245, 158, 11, 0.08), transparent 70%) !important;
}

.fixed.inset-0.-z-10 .noise {
  opacity: 0.4 !important;
}
.fixed.inset-0.-z-10 #particles {
  opacity: 0.25 !important;
}

/* ========== Typography & Readability ========== */
body .text-slate-100,
body .text-white,
body .text-white\/90,
body .text-white\/80,
body .text-white\/70 {
  color: var(--construction-text) !important;
}

/* Hero / carousel: keep white text over dark overlay */
.carousel-slide .text-white,
.carousel-slide .text-white\/80,
.carousel-slide .text-white\/90,
.hero-slide .text-white,
.hero-slide .text-white\/80,
.hero-slide .text-white\/90 {
  color: #ffffff !important;
}
.carousel-slide .text-slate-200\/90,
.carousel-slide .text-slate-200\/80 {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* Main content & cards: force dark text (beyaz kartta beyaz yazı olmasın) */
#main .text-white,
#main .text-white\/90,
#main .text-white\/80,
section:not(.carousel-slide) .text-white,
section:not(.carousel-slide) .text-white\/90,
section:not(.carousel-slide) .text-white\/80,
.glass .text-white,
.glass .text-white\/90,
.glass .text-white\/80,
.shadow-glow .text-white,
.shadow-glow .text-white\/90,
.shadow-glow .text-white\/80,
.rounded-2xl .text-white,
.rounded-2xl .text-white\/90,
.rounded-xl.p-5 .text-white,
.rounded-xl.p-6 .text-white,
.rounded-2xl.p-6 .text-white,
.rounded-2xl.p-8 .text-white,
.bg-white\/5 .text-white,
.border-white\/10 .text-white,
#main dd .text-white,
#main dl .text-white,
#main .font-semibold.text-white,
main .text-white,
main .text-white\/90,
main .text-white\/80 {
  color: var(--construction-text) !important;
}
.glass .text-slate-200\/70,
.glass .text-slate-200\/90,
.shadow-glow .text-slate-200\/70,
.shadow-glow .text-slate-200\/90,
.bg-white\/5 .text-slate-200\/70,
.border-white\/10 .text-slate-200\/70 {
  color: var(--construction-text-secondary) !important;
}
/* Avatar / gradient daire içindeki harf beyaz kalsın */
.bg-gradient-to-br .text-white,
.from-indigo-500\/60 .text-white {
  color: #ffffff !important;
}

/* Tüm beyaz alanlarda beyaz yazı kalmasın: modallar, dialog, her türlü kart */
[role="dialog"] .text-white,
[role="dialog"] .text-white\/90,
[role="dialog"] .text-white\/80,
[aria-modal="true"] .glass .text-white,
[aria-modal="true"] .glass .text-white\/90,
.fixed .glass .text-white,
.fixed .glass .text-white\/90,
.fixed .shadow-glow .text-white,
.reviews-scroll .text-white,
.reviews-scroll .text-white\/90,
.max-h-\[70vh\] .text-white {
  color: var(--construction-text) !important;
}
[role="dialog"] .text-slate-200\/75,
[role="dialog"] .text-slate-200\/50,
[role="dialog"] .text-slate-200\/80,
.fixed .glass .text-slate-200\/75,
.fixed .glass .text-slate-200\/50,
.fixed .glass .text-slate-200\/80,
.reviews-scroll .text-slate-200\/80,
.reviews-scroll .text-slate-200\/50,
.rounded-2xl .text-slate-200\/50,
.rounded-2xl .text-slate-200\/80,
.rounded-xl .text-slate-200\/50,
.rounded-xl .text-slate-200\/80,
.glass .text-slate-200\/50,
.glass .text-slate-200\/80,
.shadow-glow .text-slate-200\/50,
.shadow-glow .text-slate-200\/80 {
  color: var(--construction-text-secondary) !important;
}

/* Secondary text */
.text-slate-200\/90,
.text-slate-200\/75,
.text-slate-200\/70,
.text-slate-200\/60 {
  color: var(--construction-text-secondary) !important;
}

/* Headings in main content (not hero) */
#main h1,
#main h2,
#main h3,
section:not(.carousel-slide) h1,
section:not(.carousel-slide) h2,
section:not(.carousel-slide) h3 {
  color: var(--construction-text) !important;
}

/* ========== Header ========== */
header.bg-slate-950\/55,
header.backdrop-blur {
  background-color: rgba(255, 255, 255, 0.92) !important;
  border-bottom-color: var(--construction-border) !important;
}
header .text-white,
header .font-semibold.text-white {
  color: var(--construction-text) !important;
}
header .text-slate-200\/90,
header a.text-sm {
  color: var(--construction-text-secondary) !important;
}
header a.text-sm:hover,
header .hover\:text-white:hover {
  color: var(--construction-primary) !important;
}
header .bg-white\/5,
header .border-white\/10,
header .hover\:bg-white\/10 {
  background-color: var(--construction-section) !important;
  border-color: var(--construction-border) !important;
}
header .hover\:bg-white\/10:hover {
  background-color: var(--construction-border) !important;
}

/* ========== Buttons ========== */
/* Primary: blue */
.bg-sky-500,
.hover\:bg-sky-400:hover {
  background-color: var(--construction-primary) !important;
}
a.bg-sky-500:hover,
button.bg-sky-500:hover,
.hover\:bg-sky-400:hover {
  background-color: var(--construction-primary-hover) !important;
}
.bg-sky-500.text-white,
.bg-sky-500 .text-white {
  color: #ffffff !important;
}
.hover\:shadow-sky-400\/25:hover {
  box-shadow: 0 4px 14px rgba(30, 58, 138, 0.25) !important;
}

/* Secondary / outline on hero stay light; elsewhere use border */
.carousel-slide .bg-white\/10,
.carousel-slide .border-white\/20 {
  /* keep as-is for hero */
}
section:not(.carousel-slide) .bg-white\/10,
section:not(.carousel-slide) .border-white\/20 {
  background-color: transparent !important;
  border-color: var(--construction-primary) !important;
  color: var(--construction-primary) !important;
}
section:not(.carousel-slide) .bg-white\/10:hover,
section:not(.carousel-slide) .hover\:bg-white\/20:hover {
  background-color: var(--construction-primary-light) !important;
  color: var(--construction-primary-hover) !important;
}

/* Accent button (optional utility) */
.btn-accent {
  background-color: var(--construction-accent) !important;
  color: #ffffff !important;
}
.btn-accent:hover {
  background-color: var(--construction-accent-hover) !important;
}

/* ========== Cards ========== */
.glass,
.shadow-glow {
  background: var(--construction-card) !important;
  border: 1px solid var(--construction-border) !important;
  box-shadow: var(--construction-shadow-card) !important;
  backdrop-filter: none;
}
.glass.rounded-2xl,
.rounded-2xl.shadow-glow {
  box-shadow: var(--construction-shadow-lg) !important;
}

/* Card inner text (duplicate for specificity; main rules above) */
.glass .text-white,
.shadow-glow .text-white {
  color: var(--construction-text) !important;
}
.glass .text-slate-200\/70,
.shadow-glow .text-slate-200\/70 {
  color: var(--construction-text-secondary) !important;
}

/* Stats / gradient card section */
.rounded-2xl.border.border-white\/10.bg-gradient-to-r,
.bg-gradient-to-r.from-sky-500\/15 {
  background: var(--construction-card) !important;
  border-color: var(--construction-border) !important;
  box-shadow: var(--construction-shadow) !important;
}
.rounded-2xl.border.border-white\/10.bg-gradient-to-r .text-white,
.bg-gradient-to-r.from-sky-500\/15 .text-white {
  color: var(--construction-text) !important;
}
.rounded-2xl.border.border-white\/10.bg-gradient-to-r .text-slate-200\/75 {
  color: var(--construction-text-secondary) !important;
}

/* Small stat cards */
.rounded-xl.border.border-white\/10.bg-white\/5 {
  background: var(--construction-card) !important;
  border-color: var(--construction-border) !important;
  box-shadow: var(--construction-shadow-sm) !important;
}
.rounded-xl.border.border-white\/10.bg-white\/5 .text-white {
  color: var(--construction-text) !important;
}
.rounded-xl.border.border-white\/10.bg-white\/5 .text-slate-200\/70 {
  color: var(--construction-text-secondary) !important;
}

/* ========== Section Backgrounds ========== */
section#brands.bg-slate-950\/50,
section.border-t.border-white\/5,
.border-t.border-white\/5 {
  background-color: var(--construction-section) !important;
  border-top-color: var(--construction-border) !important;
}
section#brands .text-white,
section#brands .text-slate-200\/60 {
  color: var(--construction-text) !important;
}
section#brands .text-slate-200\/60 {
  color: var(--construction-text-secondary) !important;
}

/* Alternating section background for variety */
section#clients,
section#stats {
  background-color: transparent !important;
}
section#brands {
  background-color: var(--construction-section) !important;
}

/* ========== Brand Pills / Tags ========== */
.animate-marquee .rounded-xl.bg-white\/5,
.rounded-xl.bg-white\/5.border.border-white\/10.text-white\/80 {
  background-color: var(--construction-card) !important;
  border-color: var(--construction-border) !important;
  color: var(--construction-text) !important;
  box-shadow: var(--construction-shadow-sm) !important;
}
.animate-marquee .rounded-xl.bg-white\/5:hover,
.rounded-xl.bg-white\/5.hover\:bg-white\/10:hover {
  background-color: var(--construction-section) !important;
  color: var(--construction-primary) !important;
}

/* ========== Hero Overlay (readable text) ========== */
.carousel-slide .bg-gradient-to-t.from-slate-950,

.carousel-slide .from-slate-950\/70,
.hero-slide .from-slate-950\/70 {
  background: linear-gradient(
    to top, 
    rgba(255, 255, 255, 0.2) 0%, 
    rgba(245, 246, 252, 0.1) 50%, 
    rgba(255, 255, 255, 0.2) 100%
  ) !important;
}
/* Hero CTA: primary button stays white text */
.carousel-slide .bg-sky-500,
.carousel-slide .hover\:bg-sky-400:hover {
  background-color: var(--construction-accent) !important;
}
.carousel-slide .bg-sky-500:hover,
.carousel-slide .hover\:bg-sky-400:hover {
  background-color: var(--construction-accent-hover) !important;
}
.carousel-slide .bg-sky-500 .text-white {
  color: #ffffff !important;
}

/* ========== Gradients (utility overrides) ========== */
.from-sky-500\/15,
.from-sky-500\/20 {
  --tw-gradient-from: var(--construction-primary-light) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) !important;
}
.border-sky-400\/30,
.focus\:ring-sky-400\/50:focus {
  border-color: var(--construction-primary-border) !important;
  --tw-ring-color: rgba(30, 58, 138, 0.4) !important;
}

/* ========== Focus & Accessibility ========== */
:focus-visible {
  outline: 2px solid var(--construction-primary) !important;
  outline-offset: 3px !important;
}
.sr-only-focusable.p-3.bg-sky-500 {
  background-color: var(--construction-primary) !important;
  color: #ffffff !important;
}

/* ========== Scrollbars ========== */
.reviews-scroll {
  scrollbar-color: var(--construction-border) transparent;
}
.reviews-scroll::-webkit-scrollbar-thumb {
  background: var(--construction-border);
  border-radius: 4px;
}

/* ========== Star Rating ========== */
.star-filled {
  color: var(--construction-accent) !important;
}
.star-empty {
  color: var(--construction-border) !important;
}

/* ========== Footer: koyu mavi arka plan, beyaz yazı ========== */
footer {
  background-color: #000 !important;
}
footer .text-white,
footer .text-white\/90,
footer .text-white\/80,
footer .text-slate-200\/90,
footer .text-slate-200\/75,
footer .text-slate-200\/60 {
  color: rgba(255, 255, 255, 0.95) !important;
}
footer .text-slate-200\/75,
footer .text-slate-200\/70,
footer .text-slate-200\/60 {
  color: rgba(255, 255, 255, 0.8) !important;
}
footer.bg-slate-950,
footer .bg-slate-950,
footer.bg-slate-900,
footer .bg-slate-900 {
  background-color: #000 !important;
}
footer .border-white\/5,
footer .border-white\/10 {
  border-color: rgba(255, 255, 255, 0.15) !important;
}
/* ========== Mobile menu ========== */
#mobileMenu .bg-white\/0,
#mobileMenu .hover\:bg-white\/5,
#mobileMenu .border-white\/10 {
  background-color: var(--construction-card) !important;
  border-color: var(--construction-border) !important;
}
#mobileMenu a {
  color: var(--construction-text) !important;
}
#mobileMenu a:hover {
  background-color: var(--construction-section) !important;
  color: var(--construction-primary) !important;
}

/* ========== Language switcher (hero) ========== */
.carousel-slide .glass {
  background: rgba(255, 255, 255, 0.95) !important;
  border-color: var(--construction-border) !important;
}
.carousel-slide .glass .text-slate-200\/90 {
  color: var(--construction-text-secondary) !important;
}
.carousel-slide .glass .hover\:text-white:hover {
  color: var(--construction-primary) !important;
}

/* ========== Lightbox ========== */
.lightbox {
  background: rgba(15, 23, 42, 0.94) !important;
}

/* ========== Spacing & hierarchy (base) ========== */
section .mx-auto.max-w-7xl {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
@media (min-width: 640px) {
  section .mx-auto.max-w-7xl {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
}

/* =============================================================================
   DESIGNER REFINEMENTS – Visual design only (no content/structure/function change)
   Spacing, typography, shadows, alignment, consistency across all pages.
   ============================================================================= */

/* ---------- Design tokens ---------- */
:root {
  --space-section: 4rem;
  --space-section-sm: 3rem;
  --space-card: 1.5rem;
  --space-content: 1.25rem;
  --radius-card: 1rem;
  --radius-button: 0.75rem;
  --radius-sm: 0.5rem;
  --shadow-card-hover: 0 4px 12px rgba(15, 23, 42, 0.1), 0 2px 4px rgba(15, 23, 42, 0.06);
  --shadow-button: 0 2px 4px rgba(30, 58, 138, 0.2);
  --shadow-button-hover: 0 4px 12px rgba(30, 58, 138, 0.25);
  --transition-smooth: 0.2s ease;
}

/* ---------- Section spacing (consistent vertical rhythm) ---------- */
section {
  margin-bottom: 0;
}
section .mx-auto.max-w-7xl {
  padding-top: var(--space-section-sm) !important;
  padding-bottom: var(--space-section-sm) !important;
}
@media (min-width: 640px) {
  section .mx-auto.max-w-7xl {
    padding-top: var(--space-section) !important;
    padding-bottom: var(--space-section) !important;
  }
}
section + section .mx-auto.max-w-7xl {
  padding-top: var(--space-section) !important;
}
#main > section:first-of-type .mx-auto.max-w-7xl {
  padding-top: var(--space-section-sm) !important;
}
@media (min-width: 640px) {
  #main > section:first-of-type .mx-auto.max-w-7xl {
    padding-top: var(--space-section) !important;
  }
}

/* ---------- Content container alignment & padding ---------- */
.mx-auto.max-w-7xl {
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
}
@media (min-width: 640px) {
  .mx-auto.max-w-7xl {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
}
@media (min-width: 1024px) {
  .mx-auto.max-w-7xl {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
  }
}

/* ---------- Typography hierarchy ---------- */
#main h1,
section:not(.carousel-slide) h1 {
  font-size: clamp(1.75rem, 4vw, 2.25rem) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
  font-weight: 700 !important;
}
#main h2,
section:not(.carousel-slide) h2 {
  font-size: clamp(1.5rem, 3vw, 1.875rem) !important;
  line-height: 1.25 !important;
  letter-spacing: -0.01em !important;
  font-weight: 600 !important;
  margin-bottom: 0.5rem !important;
}
#main h3,
section:not(.carousel-slide) h3 {
  font-size: 1.125rem !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
}
#main p,
section:not(.carousel-slide) p {
  line-height: 1.6 !important;
}
#main .text-sm,
section:not(.carousel-slide) .text-sm {
  line-height: 1.5 !important;
}

/* ---------- Card layout & spacing ---------- */
.glass,
.shadow-glow {
  padding: var(--space-card) !important;
  border-radius: var(--radius-card) !important;
  transition: box-shadow var(--transition-smooth), transform var(--transition-smooth) !important;
}
.glass.rounded-2xl,
.rounded-2xl.shadow-glow {
  border-radius: var(--radius-card) !important;
  padding: 1.5rem !important;
}
@media (min-width: 640px) {
  .glass.rounded-2xl,
  .rounded-2xl.shadow-glow {
    padding: 1.75rem !important;
  }
}
.rounded-xl.p-5,
.rounded-xl.p-6 {
  padding: 1.25rem !important;
  border-radius: var(--radius-card) !important;
}
.rounded-2xl.p-6,
.rounded-2xl.p-8 {
  padding: 1.5rem !important;
  border-radius: var(--radius-card) !important;
}
@media (min-width: 640px) {
  .rounded-2xl.p-8 {
    padding: 2rem !important;
  }
}

/* Card grid gaps (consistent spacing between cards) */
.grid.gap-4 {
  gap: 1rem !important;
}
@media (min-width: 640px) {
  .grid.gap-4 {
    gap: 1.25rem !important;
  }
}
.grid.gap-6,
.grid.gap-8 {
  gap: 1.5rem !important;
}
@media (min-width: 640px) {
  .grid.gap-8 {
    gap: 2rem !important;
  }
}

/* Card hover (subtle lift for interactivity) */
.glass:hover,
.shadow-glow:hover {
  box-shadow: var(--shadow-card-hover) !important;
}
.group.glass:hover,
.group.rounded-2xl.shadow-glow:hover {
  box-shadow: var(--shadow-card-hover) !important;
}

/* ---------- Stats / gradient card section ---------- */
.rounded-2xl.border.border-white\/10.bg-gradient-to-r,
.bg-gradient-to-r.from-sky-500\/15 {
  padding: 2rem !important;
  border-radius: var(--radius-card) !important;
}
@media (min-width: 640px) {
  .rounded-2xl.border.border-white\/10.bg-gradient-to-r,
  .bg-gradient-to-r.from-sky-500\/15 {
    padding: 2.5rem !important;
  }
}

/* Small stat cards inside stats section */
.rounded-xl.border.border-white\/10.bg-white\/5 {
  padding: 1.25rem !important;
  border-radius: var(--radius-sm) !important;
  transition: box-shadow var(--transition-smooth) !important;
}

/* ---------- Buttons (modern, consistent) ---------- */
a.inline-flex.rounded-xl,
button.rounded-xl,
.rounded-xl.px-6.py-3,
.rounded-xl.px-4.py-2 {
  border-radius: var(--radius-button) !important;
  padding: 0.625rem 1.25rem !important;
  font-weight: 600 !important;
  transition: box-shadow var(--transition-smooth), transform var(--transition-smooth) !important;
}
.px-6.py-3 {
  padding: 0.75rem 1.5rem !important;
}
.bg-sky-500,
a.bg-sky-500 {
  box-shadow: var(--shadow-button) !important;
}
.bg-sky-500:hover,
a.bg-sky-500:hover,
.hover\:bg-sky-400:hover {
  box-shadow: var(--shadow-button-hover) !important;
}

/* ---------- Section headings + description spacing ---------- */
section .flex.flex-col.sm\:flex-row + .mt-10,
section .mt-10.grid {
  margin-top: 2rem !important;
}
section h2 + .mt-4,
section .mt-4.text-slate-200 {
  margin-top: 0.75rem !important;
}

/* ---------- Brands section (marquee area) ---------- */
section#brands .mx-auto.max-w-7xl.mb-8 {
  margin-bottom: 2rem !important;
}
section#brands .animate-marquee {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

/* ---------- Modals (policy dialogs) ---------- */
.glass.rounded-2xl.p-6.shadow-glow.border.border-white\/10,
.glass.rounded-2xl.p-6.sm\:p-8.shadow-glow {
  padding: 1.5rem !important;
  border-radius: var(--radius-card) !important;
  max-width: min(90vw, 32rem) !important;
}
@media (min-width: 640px) {
  .glass.rounded-2xl.p-6.sm\:p-8.shadow-glow {
    padding: 2rem !important;
  }
}

/* ---------- Footer internal spacing ---------- */
footer .relative.mx-auto.max-w-7xl {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}
@media (min-width: 640px) {
  footer .relative.mx-auto.max-w-7xl {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
}
footer .grid.gap-10 {
  gap: 2.5rem !important;
}
footer .mt-12 {
  margin-top: 2.5rem !important;
}
footer .border-t.pt-6 {
  padding-top: 1.5rem !important;
}

/* Mobile footer: larger, centered logo */
@media (max-width: 640px) {
  footer .flex.items-center.gap-3 {
    justify-content: center !important;
  }
  footer img[alt="ALTAN YAPI MARKET Logo"] {
    height: 4.25rem !important;
  }
  footer .lg\:col-span-4 > .flex.items-center.gap-3 {
    width: 100%;
  }
}

/* ========== Header (always visible on scroll) ========== */
/* Sticky can fail when any ancestor has overflow/transform; fixed is reliable. */
body > header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 1000 !important;
}
main#main {
  padding-top: 4rem !important; /* header height (h-16) */
}

/* ---------- Refined shadows (cards stand out, soft) ---------- */
.glass.rounded-2xl.p-6.shadow-glow,
.rounded-2xl.shadow-glow {
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06), 0 2px 6px rgba(15, 23, 42, 0.04) !important;
}
.rounded-xl.border.border-white\/10.bg-white\/5 {
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06) !important;
}

/* ---------- Balance: first section after hero ---------- */
#midSections section:first-child .mx-auto.max-w-7xl {
  padding-top: var(--space-section) !important;
}

/* ========== Gallery page tweaks ========== */
/* Reduce "double border" look on gallery carousel slides */
section#gallery .carousel-slide > div {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Gallery carousel wrapper: remove theme padding to avoid inset frame */
section#gallery .mt-10.relative.rounded-2xl.overflow-hidden.border.border-white\/10.bg-white\/5.shadow-glow {
  padding: 0 !important;
  background: var(--construction-card) !important;
  border-color: var(--construction-border) !important;
  box-shadow: var(--construction-shadow-lg) !important;
}

/* Make images fill the card cleanly */
section#gallery .carousel-slide img {
  height: clamp(320px, 46vw, 460px) !important;
  border-radius: 0 !important;
}

/* Gallery slide captions (bottom-left text) */
section#gallery .carousel-slide .absolute.bottom-0 p,
section#gallery .carousel-slide .absolute.bottom-0 .text-white {
  color: #ffffff !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}

/* Ensure gallery heading/intro stays readable on light theme */
section#gallery h2,
section#gallery .text-slate-200\/75 {
  color: #ffffff !important;
}

/* Add subtle dark header strip behind gallery intro for readability */
section#gallery {
  position: relative;
}
section#gallery::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 220px;
  background: linear-gradient(180deg, rgba(2, 6, 23, 0.88) 0%, rgba(2, 6, 23, 0.55) 55%, rgba(2, 6, 23, 0) 100%);
  pointer-events: none;
}
section#gallery > .mx-auto {
  position: relative;
  z-index: 1;
}

/* ========== FAQ (SSS) – tighter, more professional layout ========== */
section#faq .mx-auto.max-w-7xl {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}
@media (min-width: 640px) {
  section#faq .mx-auto.max-w-7xl {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
}

/* Keep FAQ content from spanning too wide */
section#faq .mt-10.max-w-3xl {
  max-width: 52rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Center FAQ title/intro block for visual balance */
section#faq .max-w-2xl {
  max-width: 52rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* Slimmer accordion cards */
section#faq .glass.rounded-xl.shadow-glow {
  padding: 0 !important; /* button controls internal padding */
  border-radius: 0.875rem !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 8px 22px rgba(15, 23, 42, 0.06) !important;
}

/* Accordion header button */
section#faq .glass.rounded-xl.shadow-glow > button {
  padding: 0.875rem 1rem !important;
}
@media (min-width: 640px) {
  section#faq .glass.rounded-xl.shadow-glow > button {
    padding: 1rem 1.125rem !important;
  }
}

/* Left icon box: smaller & softer */
section#faq .glass.rounded-xl.shadow-glow .h-8.w-8 {
  height: 2rem !important;
  width: 2rem !important;
  border-radius: 0.6rem !important;
  background-color: rgba(30, 58, 138, 0.08) !important;
  border-color: rgba(30, 58, 138, 0.18) !important;
}
section#faq .glass.rounded-xl.shadow-glow .h-8.w-8 i {
  font-size: 0.75rem !important;
  color: rgba(30, 58, 138, 0.75) !important;
}

/* Question typography */
section#faq .glass.rounded-xl.shadow-glow span.text-sm.font-semibold {
  font-size: 0.95rem !important;
  line-height: 1.35 !important;
}

/* Chevron a bit subtler */
section#faq .glass.rounded-xl.shadow-glow .qa-chevron {
  opacity: 0.7;
}

/* Answer area spacing */
section#faq .glass.rounded-xl.shadow-glow .qa-answer {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}
@media (min-width: 640px) {
  section#faq .glass.rounded-xl.shadow-glow .qa-answer {
    padding-left: 1.125rem !important;
    padding-right: 1.125rem !important;
  }
}