/*
  Lighting Solutions LLC — Professional theme
  Warm, premium lighting brand.
*/

@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap");

:root {
  --ls-font-sans: "Plus Jakarta Sans", system-ui, sans-serif;
  --ls-font-serif: "Instrument Serif", Georgia, serif;
  --ls-bg-dark: #0c0e10;
  --ls-bg-card: #14171c;
  --ls-bg-cream: #faf8f5;
  --ls-bg-white: #ffffff;
  --ls-accent: #c9a227;
  --ls-accent-hover: #d4af37;
  --ls-accent-muted: rgba(201, 162, 39, 0.15);
  --ls-text: #1a1a1a;
  --ls-text-muted: #5c5c5c;
  --ls-text-on-dark: #e8e6e3;
  --ls-border: rgba(255, 255, 255, 0.08);
  --ls-radius: 12px;
  --ls-radius-lg: 20px;
  --ls-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
  --ls-shadow-lg: 0 24px 48px rgba(0, 0, 0, 0.12);
  --ls-transition: 0.25s ease;
}

#snow-container { display: none !important; }
.cart-container { display: none !important; }
/* Preloader disabled – no loading screen on page load */
.js-preloader { display: none !important; visibility: hidden !important; }

body {
  font-family: var(--ls-font-sans) !important;
  color: var(--ls-text) !important;
  background-color: var(--ls-bg-cream) !important;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ls-font-sans) !important;
  font-weight: 700 !important;
  color: var(--ls-text) !important;
  letter-spacing: -0.02em;
}

.section-heading h2 {
  font-size: clamp(1.75rem, 4vw, 2.5rem) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.03em !important;
}

.section-heading h6 {
  color: var(--ls-accent) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
}

.section-heading h2 em {
  color: var(--ls-accent) !important;
  font-style: italic;
  font-family: var(--ls-font-serif) !important;
}

.js-preloader { background-color: var(--ls-bg-dark) !important; }
.preloader-inner .dot,
.preloader-inner .dots span { background-color: var(--ls-accent) !important; }

.header-area {
  background: rgba(12, 14, 16, 0.85) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--ls-border) !important;
  height: 80px !important;
  box-shadow: none !important;
}

.header-area .main-nav .logo img {
  width: 48px !important;
  height: auto !important;
  border-radius: 10px !important;
  padding: 2px !important;
}

.header-area .main-nav .nav li { height: 80px !important; line-height: 80px !important; }
.header-area .main-nav .nav li a {
  color: var(--ls-text-on-dark) !important;
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  opacity: 0.9;
}
.header-area .main-nav .nav li a:hover,
.header-area .main-nav .nav li a.active { color: #fff !important; opacity: 1; }
.header-area .main-nav .nav li a.active { color: var(--ls-accent) !important; }

.header-area .main-nav .nav li:last-child a {
  background: var(--ls-accent) !important;
  color: var(--ls-bg-dark) !important;
  padding: 0 1.25rem !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
}
.header-area .main-nav .nav li:last-child a i {
  background: rgba(0,0,0,0.2) !important;
  color: inherit !important;
}
.header-area .main-nav .nav li:last-child a:hover {
  background: var(--ls-accent-hover) !important;
  color: var(--ls-bg-dark) !important;
}
.header-area.header-sticky .main-nav .nav { margin-top: 0 !important; }

.main-banner {
  position: relative;
  min-height: 34vh;
  max-height: 40vh;
  height: 36vh;
  display: flex;
  align-items: center;
  overflow: visible;
  margin-bottom: 0;
}
.main-banner .item {
  background-size: cover !important;
  background-position: center !important;
  position: relative;
  padding: 2.5rem 15% !important;
  min-height: 34vh !important;
  height: 36vh !important;
}
.main-banner .item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(12, 14, 16, 0.75) 0%, rgba(12, 14, 16, 0.4) 100%);
  pointer-events: none;
}
.main-banner .header-text { position: relative; z-index: 2; max-width: 720px; }
.main-banner .item span.category {
  background: var(--ls-accent-muted) !important;
  color: var(--ls-text-on-dark) !important;
  border: 1px solid rgba(201, 162, 39, 0.4);
  padding: 0.35rem 0.9rem !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
}
.main-banner .item span.category em { color: var(--ls-accent) !important; }
.main-banner .item h2 {
  font-size: clamp(2.25rem, 5vw, 3.5rem) !important;
  line-height: 1.15 !important;
  color: #fff !important;
  font-weight: 700 !important;
  text-shadow: 0 2px 24px rgba(0,0,0,0.3);
}
.main-banner .owl-dots .owl-dot span { background: rgba(255,255,255,0.4) !important; transition: var(--ls-transition); }
.main-banner .owl-dots .owl-dot.active span,
.main-banner .owl-dots .owl-dot:hover span { background: var(--ls-accent) !important; transform: scale(1.2); }
.main-banner .owl-nav button {
  background: rgba(255,255,255,0.1) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  color: #fff !important;
  transition: var(--ls-transition);
}
.main-banner .owl-nav button:hover {
  background: var(--ls-accent) !important;
  border-color: var(--ls-accent) !important;
  color: var(--ls-bg-dark) !important;
}

.section { margin-top: 3rem !important; padding-top: 1rem; padding-bottom: 1rem; }
/* Featured: must sit clearly below hero – no overlap */
.featured.section {
  background: var(--ls-bg-white);
  padding: 4rem 0 !important;
  margin-top: 5rem !important;
  margin-bottom: 0 !important;
  border-radius: var(--ls-radius-lg);
  box-shadow: var(--ls-shadow);
  position: relative;
  z-index: 1;
}
.featured .left-image {
  border-radius: var(--ls-radius-lg);
  overflow: hidden;
  box-shadow: var(--ls-shadow-lg);
}
.featured .left-image img { width: 100%; height: 100%; object-fit: cover; }

.accordion-button {
  font-family: var(--ls-font-sans) !important;
  font-weight: 600 !important;
  color: var(--ls-text) !important;
  background: var(--ls-bg-cream) !important;
  border: none !important;
}
.accordion-button:not(.collapsed) {
  color: var(--ls-accent) !important;
  background: var(--ls-accent-muted) !important;
  box-shadow: none !important;
}
.accordion-button:focus { box-shadow: none !important; border-color: transparent !important; }
.accordion-body {
  color: var(--ls-text-muted) !important;
  font-size: 0.9375rem !important;
  line-height: 1.7 !important;
}

.info-table ul li {
  background: var(--ls-bg-white) !important;
  border-radius: var(--ls-radius) !important;
  padding: 1.25rem !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  transition: var(--ls-transition);
}
.info-table ul li:hover { border-color: var(--ls-accent-muted) !important; box-shadow: var(--ls-shadow); }
.info-table ul li h4 { font-size: 1rem !important; font-weight: 600 !important; color: var(--ls-text) !important; }
.info-table ul li h4 span { font-weight: 400 !important; color: var(--ls-text-muted) !important; font-size: 0.875rem !important; }

.icon-button a,
.main-button a {
  font-family: var(--ls-font-sans) !important;
  font-weight: 600 !important;
  background-color: var(--ls-bg-dark) !important;
  border-radius: 999px !important;
  transition: var(--ls-transition) !important;
}
.icon-button a:hover,
.main-button a:hover { background-color: var(--ls-accent) !important; color: var(--ls-bg-dark) !important; }
.icon-button a i { background-color: var(--ls-accent) !important; color: var(--ls-bg-dark) !important; }

/* Video section: no overlap, normal flow */
.video.section,
.video { margin-top: 3rem !important; padding: 3rem 0 !important; }
.video.section .section-heading h2 { color: var(--ls-text) !important; }
.video-content {
  margin-top: 0 !important;
  padding: 0 0 2rem !important;
}
.video-content .video-frame { border-radius: var(--ls-radius-lg) !important; overflow: hidden; box-shadow: var(--ls-shadow-lg) !important; }
.video-content .video-frame iframe { border-radius: var(--ls-radius-lg) !important; }
/* YouTube in a small, compact container – centered */
.video-content .row.justify-content-center { margin: 0 auto; }
.video-frame--compact {
  max-width: 480px !important;
  margin: 0 auto;
  position: relative;
  border-radius: var(--ls-radius-lg) !important;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12) !important;
  border: 1px solid rgba(0,0,0,0.08);
}
.video-frame--compact::before { content: ""; display: block; padding-bottom: 56.25%; }
.video-frame--compact iframe { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; border: none !important; border-radius: var(--ls-radius-lg); }

/* Stats (fun-facts): visible text on dark background */
.fun-facts { background: var(--ls-bg-dark) !important; padding: 3rem 0 !important; margin-top: 3rem !important; }
.fun-facts .wrapper { max-width: 100%; }
.fun-facts .counter {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  border-radius: var(--ls-radius) !important;
  padding: 1.5rem 1.25rem !important;
  width: 100% !important;
  max-width: 280px !important;
  display: block !important;
  text-align: center !important;
}
.fun-facts .counter:after { display: none !important; }
.fun-facts .counter h2,
.fun-facts .counter p { display: block !important; text-align: center !important; }
.fun-facts .counter h2 {
  color: var(--ls-accent) !important;
  font-size: clamp(1.75rem, 4vw, 2.5rem) !important;
  font-weight: 700 !important;
  margin: 0 0 0.25rem 0 !important;
}
.fun-facts .counter p,
.fun-facts .counter .count-text {
  color: var(--ls-text-on-dark) !important;
  opacity: 1 !important;
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

.best-deal .nav-tabs,
.best-deal .tabs-content ul.nav-tabs {
  border: none !important;
  gap: 0 !important;
  flex-wrap: nowrap !important;
  margin: 0 auto !important;
  margin-top: 0 !important;
  justify-content: center !important;
  display: inline-flex !important;
  padding: 2px !important;
  background: rgba(0,0,0,0.06) !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.06) !important;
}
.best-deal .nav-wrapper { display: flex !important; justify-content: center !important; }
.best-deal .tabs-content ul.nav-tabs .nav-item { margin: 0 !important; }
.best-deal.section,
.best-deal { padding: 3rem 0 !important; margin-top: 3rem !important; background-color: var(--ls-bg-cream) !important; }
/* Find Your Perfect Lighting + tabs – center aligned, visible */
.best-deal .section-heading { text-align: center !important; }
.best-deal .section-heading h6 { color: var(--ls-accent) !important; }
.best-deal .section-heading h2 { color: var(--ls-text) !important; font-weight: 700 !important; }
.best-deal .nav-link,
.best-deal .tabs-content .nav-link {
  border: none !important;
  border-radius: 999px !important;
  padding: 0.35rem 0.75rem !important;
  font-weight: 600 !important;
  font-size: 0.8125rem !important;
  color: var(--ls-text) !important;
  background: transparent !important;
  box-shadow: none !important;
  transition: var(--ls-transition);
}
.best-deal .nav-link:hover,
.best-deal .tabs-content .nav-link:hover { color: var(--ls-text) !important; background: rgba(255,255,255,0.7) !important; }
.best-deal .nav-link.active,
.best-deal .tabs-content .nav-tabs .nav-link.active { background: var(--ls-accent) !important; color: var(--ls-bg-dark) !important; }
/* Find Your Perfect Lighting – spec list: bottom borders only, larger text */
.best-deal .info-table {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 1.5rem 0 !important;
  box-shadow: none !important;
  list-style: none !important;
}
.best-deal .info-table ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.best-deal .info-table ul li {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  margin: 0 !important;
  padding: 0.85rem 0 !important;
  border-bottom: 1px solid rgba(0,0,0,0.1) !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  background: transparent !important;
  border-radius: 0 !important;
  font-size: 1.125rem !important;
  line-height: 1.4 !important;
  color: var(--ls-text-muted) !important;
}
.best-deal .info-table ul li:last-child {
  border-bottom: none !important;
  padding-bottom: 0 !important;
}
.best-deal .info-table ul li span {
  float: none !important;
  font-weight: 600 !important;
  color: var(--ls-text) !important;
  font-size: 1.125rem !important;
  text-align: right !important;
}
.best-deal .tab-pane img { border-radius: var(--ls-radius-lg) !important; box-shadow: var(--ls-shadow); }

/* Contact: no overlap, map + contact info side by side */
.contact.section,
.contact {
  padding: 3rem 0 4rem !important;
  margin-top: 4rem !important;
  background: var(--ls-bg-cream) !important;
  background-image: none !important;
}
.contact-content {
  margin-top: 2rem !important;
  margin-bottom: 0 !important;
}
.contact.section .section-heading h2 { color: var(--ls-text) !important; }
.contact-map-and-info { margin-top: 2rem !important; }
.contact-map-and-info .row { align-items: stretch !important; }
.contact-map-and-info .row > [class*="col-"] { display: flex !important; }
.contact-map-wrap,
.contact-info-card {
  height: 400px !important;
  min-height: 400px !important;
}
.contact-map-wrap {
  border-radius: var(--ls-radius-lg);
  overflow: hidden;
  box-shadow: var(--ls-shadow-lg);
  border: 1px solid rgba(0,0,0,0.06);
  background: var(--ls-bg-cream);
}
.contact-map-wrap iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: none;
  border-radius: var(--ls-radius-lg);
}
.contact-info-card {
  background: #f5f4f1 !important;
  border-radius: var(--ls-radius-lg);
  padding: 2rem;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  border: 1px solid rgba(0,0,0,0.08);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.contact-info-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--ls-text);
  margin-bottom: 1.5rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid var(--ls-accent);
}
.contact-info-item {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.contact-info-item:last-child { margin-bottom: 0; }
.contact-info-item i {
  color: var(--ls-accent);
  font-size: 1.25rem;
  margin-top: 0.2rem;
  flex-shrink: 0;
}
.contact-info-item strong {
  display: block;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--ls-accent);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 0.25rem;
}
.contact-info-item p {
  margin: 0;
  font-size: 1rem;
  color: var(--ls-text);
  line-height: 1.5;
}
.contact-info-item a {
  color: var(--ls-text);
  text-decoration: none;
  transition: var(--ls-transition);
}
.contact-info-item a:hover { color: var(--ls-accent); }
.contact-content .item.phone h6,
.contact-content .item.email h6 { color: var(--ls-text) !important; font-weight: 600 !important; }
.contact-content .item.phone span,
.contact-content .item.email span { color: var(--ls-text-muted) !important; font-size: 0.875rem !important; }

footer {
  background: var(--ls-bg-dark) !important;
  color: var(--ls-text-on-dark) !important;
  padding: 2rem 0 1.5rem !important;
  margin-top: 4rem !important;
  border-top: 1px solid var(--ls-border);
}
footer .sub-header { background: transparent !important; border: none !important; padding: 0 0 1rem !important; }
footer .info li,
footer .info li i { color: var(--ls-text-on-dark) !important; opacity: 0.9; font-size: 0.9375rem !important; }
footer .social-links li a { background: rgba(255,255,255,0.1) !important; color: var(--ls-text-on-dark) !important; transition: var(--ls-transition); }
footer .social-links li a:hover { background: var(--ls-accent) !important; color: var(--ls-bg-dark) !important; }
footer .container p { color: var(--ls-text-on-dark) !important; opacity: 0.7; font-size: 0.875rem !important; margin: 0 !important; }

/* Inner page: no big cover banner – use a minimal title bar */
.page-heading.header-text {
  background: transparent !important;
  padding: 1.25rem 0 !important;
  margin-bottom: 0 !important;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
.page-heading .breadcrumb { color: var(--ls-text-muted) !important; font-size: 0.8125rem !important; }
.page-heading .breadcrumb a { color: var(--ls-text) !important; text-decoration: none !important; transition: var(--ls-transition); }
.page-heading .breadcrumb a:hover { color: var(--ls-accent) !important; }
.page-heading h3 { color: var(--ls-text) !important; font-size: 1.25rem !important; font-weight: 700 !important; margin-top: 0.25rem !important; }

/* Inner page content – no cover, so add top padding after nav */
body.ls-theme .single-property.section { padding: 2rem 0 4rem !important; }
body.ls-theme .section.properties { padding-top: 2rem !important; }
body.ls-theme .contact-page.section { padding-top: 2rem !important; }
.single-property .main-image {
  border-radius: var(--ls-radius-lg) !important;
  overflow: hidden;
  box-shadow: var(--ls-shadow-lg) !important;
  width: 100%;
}
.single-property .main-image img {
  width: 100% !important;
  height: auto !important;
  min-height: 280px;
  object-fit: cover !important;
  display: block;
  border-radius: var(--ls-radius-lg) !important;
}
/* About page: keep image small to avoid pixelation */
.about-page .main-image {
  max-width: 380px !important;
}
.about-page .main-image img {
  min-height: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}
.single-property .main-content .category { display: none !important; }
.single-property .main-content h4 { font-size: 1.125rem !important; color: var(--ls-text-muted) !important; font-weight: 500 !important; margin-bottom: 1rem !important; }
.single-property .main-content p { font-size: 1rem !important; line-height: 1.75 !important; color: var(--ls-text) !important; margin-bottom: 1rem !important; }

/* Service cards (Services page) */
.service-card {
  background: var(--ls-bg-white);
  border-radius: var(--ls-radius-lg) !important;
  overflow: hidden;
  box-shadow: var(--ls-shadow) !important;
  border: 1px solid rgba(0,0,0,0.06);
  transition: var(--ls-transition);
  height: 100%;
}
.service-card:hover { box-shadow: var(--ls-shadow-lg) !important; border-color: var(--ls-accent-muted) !important; }
.service-card img { border-radius: var(--ls-radius-lg) !important; width: 100%; height: 220px; object-fit: cover; }
.service-card .overlay {
  background: linear-gradient(to top, rgba(12,14,16,0.95), transparent) !important;
  color: #fff !important;
  padding: 1.25rem !important;
  font-size: 0.9375rem !important;
  line-height: 1.5 !important;
}
.service-card h5 { font-size: 1rem !important; font-weight: 600 !important; color: var(--ls-text) !important; }

/* CTA block for inner pages */
.ls-cta-block {
  background: var(--ls-bg-dark);
  color: var(--ls-text-on-dark);
  padding: 2.5rem 2rem;
  border-radius: var(--ls-radius-lg);
  text-align: center;
  margin-top: 2rem;
}
.ls-cta-block h4 { color: #fff !important; font-size: 1.25rem !important; margin-bottom: 0.5rem !important; }
.ls-cta-block p { color: rgba(255,255,255,0.85) !important; font-size: 0.9375rem !important; margin-bottom: 1rem !important; }
.ls-cta-block .icon-button a { background: var(--ls-accent) !important; color: var(--ls-bg-dark) !important; }
.ls-cta-block .icon-button a:hover { background: var(--ls-accent-hover) !important; color: var(--ls-bg-dark) !important; }

/* Portfolio grid (Gallery / Our Work) */
.portfolio-grid { margin-bottom: 1.5rem; }
.portfolio-thumb {
  border-radius: var(--ls-radius) !important;
  overflow: hidden;
  box-shadow: var(--ls-shadow);
  aspect-ratio: 4 / 3;
  background: var(--ls-bg-cream);
}
.portfolio-thumb img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }

.contact-page.section { padding: 3rem 0 !important; }
.contact-page .section-heading h2 { color: var(--ls-text) !important; }
.contact-page #map iframe { border-radius: var(--ls-radius-lg) !important; }

::selection { background: var(--ls-accent) !important; color: var(--ls-bg-dark) !important; }

@media (max-width: 992px) {
  .header-area .main-nav .nav { background-color: var(--ls-bg-dark) !important; }
  .header-area .main-nav .nav li { border-top: 1px solid var(--ls-border) !important; }
  .header-area .main-nav .nav li a { color: var(--ls-text-on-dark) !important; }
  .main-banner .item h2 { font-size: clamp(1.75rem, 6vw, 2.5rem) !important; }
}
@media (max-width: 768px) {
  .section { margin-top: 3rem !important; }
  .featured.section { padding: 2.5rem 0 !important; }
  .fun-facts { padding: 3rem 0 !important; }
  .contact-map-wrap { height: 280px !important; min-height: 260px !important; }
  .contact-info-card { height: auto !important; min-height: 0 !important; padding: 1.5rem; }
}