html,
body {
  width: 100%;
  min-height: 100%;
}

html {
  scroll-padding-top: 84px;
}

body {
  margin: 0;
  font-family: Merriweather, "Helvetica Neue", Arial, sans-serif;
  color: rgba(255, 255, 255, 0.85);
  -webkit-tap-highlight-color: #212529;
}

h1,
h2,
h3,
h4,
h5,
h6,
.navbar,
.navbar-brand,
.nav-link,
.btn {
  font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif;
}

a {
  color: #ffffff;
  transition: color 0.2s;
}

a:hover {
  color: rgba(255, 255, 255, 0.8);
}

section {
  padding: 8rem 0;
}

/* Keep anchored sections visible under fixed navbar */
#about,
#services,
#faq,
#prices,
#schedule,
#pictures,
#contact,
#to-register {
  scroll-margin-top: 84px;
}

#mainNav {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  background-color: rgba(138, 108, 154, 0.72);
  -webkit-backdrop-filter: saturate(140%) blur(10px);
  backdrop-filter: saturate(140%) blur(10px);
  transition: all 0.2s;
}

#mainNav .navbar-brand {
  font-weight: 700;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.82);
}

#mainNav .navbar-brand:hover,
#mainNav .navbar-brand:focus {
  color: #ffffff;
}

#mainNav .navbar-nav > li.nav-item > a.nav-link,
#mainNav .navbar-nav > li.nav-item > a.nav-link:focus {
  font-size: 0.9rem;
  font-weight: 700;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.82);
}

#mainNav .navbar-nav > li.nav-item > a.nav-link:hover,
#mainNav .navbar-nav > li.nav-item > a.nav-link:focus:hover {
  color: #ffffff;
}

.bg-primary {
  background: #9d83ae;
}

.bg-dark {
  background: #1e252f;
}

.text-faded {
  color: rgba(255, 255, 255, 0.82);
}

.text-faded a {
  color: #ffffff;
}

hr {
  max-width: 50px;
  border-width: 3px;
  border-color: #97787d;
}

hr.light {
  border-color: #ffffff;
}

.c-justify p {
  text-align: justify;
}

.section-heading {
  margin-top: 0;
  margin-bottom: 1rem;
  font-weight: 300;
}

.btn {
  font-weight: 700;
  text-transform: uppercase;
  border: none;
  border-radius: 300px;
}

.btn-primary {
  background-color: #97787d;
  border-color: #97787d;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #8b6b70;
  border-color: #8b6b70;
}

.btn-xl {
  padding: 1rem 2rem;
}

header.masthead {
  min-height: 70vh;
  padding-top: 9.5rem;
  padding-bottom: 4rem;
  background-color: #7a6069;
  background: linear-gradient(rgba(129, 98, 103, 0.62), rgba(83, 64, 98, 0.66)), url("/assets/sections/DSC_0818-1920.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header.masthead h1 {
  font-size: 2.2rem;
  text-shadow: 2px 2px 8px #160b0b;
}

header.masthead .btn {
  text-shadow: 1px 1px 10px #816267;
}

/* Hero-only CTA styling for stronger affordance and modern glass effect. */
.home-page .hero-cta-btn,
.home-page .hero-scroll-btn {
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: linear-gradient(135deg, rgba(196, 161, 177, 0.52), rgba(132, 96, 116, 0.42));
  color: #ffffff;
  box-shadow: 0 12px 30px rgba(27, 15, 24, 0.28);
  -webkit-backdrop-filter: blur(9px) saturate(125%);
  backdrop-filter: blur(9px) saturate(125%);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.home-page .hero-cta-btn {
  min-width: 230px;
  letter-spacing: 0.02em;
}

.home-page .hero-scroll-btn {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.home-page .hero-scroll-btn i {
  font-size: 1.15rem;
}

.home-page .hero-cta-btn:hover,
.home-page .hero-cta-btn:focus,
.home-page .hero-scroll-btn:hover,
.home-page .hero-scroll-btn:focus {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.48);
  background: linear-gradient(135deg, rgba(211, 173, 190, 0.72), rgba(144, 105, 126, 0.58));
  box-shadow: 0 16px 36px rgba(20, 10, 18, 0.36);
  transform: translateY(-1px);
}

.home-page .hero-cta-btn:active,
.home-page .hero-scroll-btn:active {
  transform: translateY(0);
}

.home-page .hero-cta-btn:focus-visible,
.home-page .hero-scroll-btn:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.86);
  outline-offset: 2px;
}

.header-about {
  min-height: 100vh;
  padding-top: 8rem;
  padding-bottom: 5rem;
}

#about,
#services,
#faq,
#prices,
#schedule,
#contact {
  position: relative;
  overflow: hidden;
}

/* Fallback colors for slow image loads: keep expected tone and contrast. */
#about {
  background-color: #9d83ae;
}

#services {
  background-color: #ece8e5;
}

#faq {
  background-color: #212934;
}

#prices {
  background-color: #9983ac;
}

#schedule {
  background-color: #1f2832;
}

#contact {
  background-color: #f1ece8;
}

#about::before,
#services::before,
#faq::before,
#prices::before,
#schedule::before,
#contact::before {
  content: "";
  position: absolute;
  inset: -24px;
  z-index: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: blur(10px);
  transform: scale(1.06);
}

#about::before {
  background-image: linear-gradient(rgba(157, 131, 174, 0.46), rgba(157, 131, 174, 0.46)), url("/assets/sections/DSC_0818-b.jpg");
}

#services::before {
  background-image: linear-gradient(rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0.74)), url("/assets/sections/20171229-DSCF9297-UC-1024.jpg");
}

#faq::before {
  background-image: linear-gradient(rgba(30, 37, 47, 0.74), rgba(30, 37, 47, 0.74)), url("/assets/sections/DSCF9297-800.jpg");
}

#prices::before {
  background-image: linear-gradient(rgba(157, 131, 174, 0.5), rgba(157, 131, 174, 0.5)), url("/assets/sections/DSC_0818-800.jpg");
}

#schedule::before {
  background-image: linear-gradient(rgba(30, 37, 47, 0.7), rgba(30, 37, 47, 0.7)), url("/assets/sections/DSC_0818-1920.jpg");
}

#contact::before {
  background-image: linear-gradient(rgba(255, 255, 255, 0.76), rgba(255, 255, 255, 0.76)), url("/assets/sections/DSC_0818-b.jpg");
}

#about > *,
#services > *,
#faq > *,
#prices > *,
#schedule > *,
#contact > * {
  position: relative;
  z-index: 1;
}

.service-box {
  max-width: 400px;
}

.service-box i {
  color: rgba(255, 255, 255, 0.95);
}

#services .service-box i,
#contact i {
  color: #37404a;
}

#about .service-box p,
#about .service-box h3 {
  color: rgba(255, 255, 255, 0.92);
}

#about .values-item-content p {
  margin-bottom: 0;
}

#services .services-item-content p {
  margin-bottom: 0;
}

#about .about-markdown h2 {
  color: #ffffff;
  text-align: center;
  margin-top: 3rem;
  margin-bottom: 1.2rem;
  font-weight: 300;
}

#about .about-markdown h2:first-child {
  margin-top: 0;
}

#about .about-markdown h3 {
  color: #ffffff;
  text-align: center;
  margin-top: 2.1rem;
  margin-bottom: 0.6rem;
  font-weight: 400;
}

#about .about-markdown hr {
  max-width: 220px;
  border-top: 2px solid rgba(255, 255, 255, 0.6);
  margin: 2.2rem auto;
}

.section-services,
#contact {
  color: #2d3742;
}

#services p,
#contact p,
#contact a,
#services h3,
#services h2,
#contact h2,
#contact h3 {
  color: #2d3742;
}

#services p,
#contact p,
#faq p,
#faq li,
#prices p,
#about p {
  font-size: 1.18rem;
  line-height: 1.5;
}

#faq .faq-markdown {
  max-width: 780px;
  margin: 0 auto;
}

#faq .faq-markdown h3 {
  margin-top: 2rem;
  margin-bottom: 0.7rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  font-weight: 400;
  font-size: clamp(1.55rem, 2.2vw, 2.35rem);
  line-height: 1.24;
}

#faq .faq-markdown h3:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

#faq .faq-markdown p,
#faq .faq-markdown li {
  text-align: left;
  line-height: 1.48;
}

#faq .faq-markdown p {
  margin-bottom: 1.05rem;
}

#faq .faq-markdown ul {
  margin: 0 0 1.35rem 1.2rem;
  padding-left: 0.35rem;
}

#faq .faq-markdown li {
  margin-bottom: 0.28rem;
}

#prices .service-box h3,
#prices .service-box h4,
#prices .service-box p {
  text-align: center;
}

.schedule-table {
  margin-top: 1rem;
  font-size: 1.15rem;
}

.schedule-table th,
.schedule-table td {
  padding: 0.95rem;
}

#pictures {
  padding: 0;
  background: #1b212a;
}

#pictures .gallery-item {
  position: relative;
  display: block;
  overflow: hidden;
  cursor: zoom-in;
}

#pictures .gallery-lazy-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transform: scale(1.06);
  filter: blur(12px);
  opacity: 0;
  transition: opacity 0.28s ease;
}

#pictures .gallery-item img {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  opacity: 1;
  transition: opacity 0.28s ease, transform 0.25s ease;
}

#pictures .gallery-item.is-loading .gallery-lazy-bg {
  opacity: 1;
}

#pictures .gallery-item.is-loading img {
  opacity: 0;
}

#pictures .gallery-item.is-loaded .gallery-lazy-bg {
  opacity: 0;
}

#pictures .portfolio-box-caption {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.25s ease;
  background: linear-gradient(to top, rgba(30, 37, 47, 0.68), rgba(30, 37, 47, 0.05));
}

#pictures .project-category {
  color: #ffffff;
  font-size: 1rem;
  font-weight: 600;
  padding: 0.8rem;
  text-align: center;
}

#pictures .gallery-item:hover img {
  transform: scale(1.03);
}

#pictures .gallery-item:hover .portfolio-box-caption {
  opacity: 1;
}

.gallery-modal[hidden] {
  display: none;
}

.gallery-modal {
  position: fixed;
  inset: 0;
  z-index: 100000001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(14, 19, 24, 0.92);
}

.gallery-modal-figure {
  margin: 0;
  max-width: min(96vw, 1600px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
}

.gallery-modal-image {
  max-width: 100%;
  max-height: 84vh;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
}

.gallery-modal-caption {
  color: rgba(255, 255, 255, 0.95);
  text-align: center;
  font-size: 0.98rem;
  line-height: 1.35;
  padding: 0.2rem 0.8rem;
}

.gallery-modal-close,
.gallery-modal-nav {
  position: absolute;
  border: 0;
  color: #ffffff;
  background: rgba(0, 0, 0, 0.36);
  cursor: pointer;
  line-height: 1;
  border-radius: 999px;
}

.gallery-modal-close {
  top: max(10px, env(safe-area-inset-top));
  right: max(10px, env(safe-area-inset-right));
  width: 48px;
  height: 48px;
  font-size: 2rem;
}

.gallery-modal-nav {
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  font-size: 1.9rem;
}

.gallery-modal-prev {
  left: 14px;
}

.gallery-modal-next {
  right: 14px;
}

.gallery-modal-close:hover,
.gallery-modal-nav:hover,
.gallery-modal-close:focus,
.gallery-modal-nav:focus {
  background: rgba(0, 0, 0, 0.56);
  outline: none;
}

.gallery-modal-nav:disabled {
  opacity: 0.35;
  cursor: default;
}

#contact .t-map,
#contact .t-share,
#contact .t-contact {
  color: #97787d;
}

#contact .text-muted {
  color: #6e7b87 !important;
}

.site-footer {
  padding: 1rem 0;
}

.site-footer a {
  color: rgba(255, 255, 255, 0.85);
}

.gdpr-box {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(16, 5, 5, 0.8);
  color: rgb(239, 194, 199);
  padding: 1em;
  z-index: 100000000;
  text-align: center;
}

.gdpr-box a.accept {
  background: rgba(58, 65, 58, 0.3);
  color: #e3ffce;
  border: 1px solid rgba(97, 105, 97, 0.3);
  padding: 0.2em;
  border-radius: 2px;
  font-weight: bold;
  margin-left: 0.2em;
}

.gdpr-box a.accept:hover {
  background: rgba(97, 105, 97, 0.3);
  border: 1px solid rgba(133, 141, 133, 0.3);
  text-decoration: none;
}

.gdpr-box a.read-more {
  margin-left: 0.35em;
}

.content-page .page-content {
  line-height: 1.65;
}

.content-page .page-content .section-heading,
.content-page .page-content h1,
.content-page .page-content h2 {
  color: #ffffff;
  margin-top: 2rem;
  margin-bottom: 1rem;
  font-weight: 300;
}

.content-page .page-content .section-heading {
  margin-top: 0;
  font-size: 3rem;
}

.content-page .page-content p,
.content-page .page-content li {
  color: rgba(255, 255, 255, 0.82);
  font-size: 1.18rem;
  font-weight: 400;
  margin-bottom: 1.1rem;
}

.content-page .page-content ul {
  text-align: left;
  padding-left: 2.2rem;
  margin-bottom: 1.6rem;
}

.content-page .page-content strong {
  color: #ffffff;
}

.content-page .page-content em {
  color: rgba(255, 255, 255, 0.95);
}

@media (max-width: 991.98px) {
  section {
    padding: 5rem 0;
  }

  header.masthead {
    min-height: 60vh;
    padding-top: 7.5rem;
    padding-bottom: 3rem;
  }

  header.masthead h1 {
    font-size: 1.6rem;
  }

  .home-page .hero-cta-btn {
    min-width: 210px;
  }

  .header-about {
    min-height: auto;
    padding-top: 6rem;
  }

  #services p,
  #contact p,
  #faq p,
  #faq li,
  #prices p,
  #about p,
  .content-page .page-content p,
  .content-page .page-content li {
    font-size: 1.03rem;
  }

  #faq .faq-markdown h3 {
    margin-top: 1.4rem;
    padding-top: 1rem;
    font-size: clamp(1.35rem, 5vw, 1.75rem);
  }

  #faq .faq-markdown ul {
    margin-left: 0.9rem;
  }

  .content-page .page-content .section-heading {
    font-size: 2.2rem;
  }

  .schedule-table {
    font-size: 0.96rem;
  }

  #pictures .project-category {
    font-size: 0.92rem;
  }

  .gallery-modal {
    padding: 0.5rem;
  }

  .gallery-modal-image {
    max-height: 80vh;
  }

  .gallery-modal-nav {
    width: 44px;
    height: 44px;
    font-size: 1.6rem;
  }

  .gallery-modal-prev {
    left: 8px;
  }

  .gallery-modal-next {
    right: 8px;
  }

  .gdpr-box {
    padding: 2em;
    font-size: 1.1em;
    border: 1px solid rgb(239, 194, 199);
  }

  .gdpr-box a.accept {
    padding: 0.6em;
    border-radius: 10px;
    margin-left: 0.2em;
    margin-right: 0.2em;
  }
}