@charset "utf-8";
/* Marbella Website Design - homepage only */

/* ------------------------------------------------------------
   Hero
------------------------------------------------------------ */
.mwd-hero {
  background-color: #003F72;
}
.mwd-hero-home h1 {
  font-size:clamp(2.9rem,5.2vw,4.9rem);
  letter-spacing:-.03em;
}

@media only screen and (max-width: 600px) {
  .mwd-hero-home h1 {
    font-size: clamp(2.2rem,6.5vw,2.9rem);
    letter-spacing: -.03em;
  }
}

/* ------------------------------------------------------------
   About
------------------------------------------------------------ */
.home-about .image-card {
  box-shadow:0 22px 55px rgba(0,0,0,.14);
}
.home-feature-panel .text-link {
  margin-top:1.8em;
}

/* ------------------------------------------------------------
   Testimonials
------------------------------------------------------------ */
.home-testimonials .section-heading { margin-bottom: 2em;}
.testimonial-carousel {
  width:100%;
  margin:0 auto;
}
.home-testimonials .owl-carousel{
  padding:0 20px;
}
.home-testimonials .owl-stage-outer{
  padding:22px 26px 30px;
  margin: 0 -26px;
}
.testimonial-card {
  min-height:270px;
  padding:2.4em 2.4em 2.1em;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  color:#242424;
  text-align:left;
  box-shadow:0 4px 26px rgba(0,0,0,.08);
}
.testimonial-card{
  transition:transform .25s ease, box-shadow .25s ease;
}
.testimonial-card:hover{
  transform:translateY(-4px);
}
.testimonial-card:after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:6px;
  background:linear-gradient(90deg,#b98217,#e2b849,#b98217);
}
.quote-mark {
  background:url(../../core_assets/icons/quote-georgia-left.svg) no-repeat center;
  background-size: contain;
  height:2.5rem;
  width: 2.5rem;
  margin-bottom: 1rem;
  filter: var(--mwd-filter-gold);
}
.testimonial-card p {
  color:#202020;
  font-size:1.05rem;
  line-height:1.65;
  margin:0;
}
.testimonial-line {
  margin:1.45em 0 1.1em;
}
.testimonial-card h3 {
  color:#111;
  font-size:1.25rem;
  font-weight:650;
  margin:0 0 .15em;
  text-transform:none;
  letter-spacing:0;
}
.testimonial-card .role {
  color:#5d5d5d;
  font-size:.95rem;
  line-height:1.35;
}
.testimonial-carousel .owl-dots {
  display:flex;
  justify-content:center;
  gap:11px;
  margin-top:0.5em;
}
.testimonial-carousel .owl-dots button {
  width:12px;
  height:12px;
  border-radius:50%;
  background:#d8d8d8 !important;
  border:0 !important;
  box-shadow:none !important;
  margin:0 !important;
  padding:0 !important;
}
.testimonial-carousel .owl-dots button.active {
  background:var(--mwd-gold) !important;
}
.testimonial-carousel .owl-nav {
  display:none;
}

/* ------------------------------------------------------------
   Services
------------------------------------------------------------ */
#services {
  min-height:760px;
  padding: 1em 0;
}
.home-services-bg img {
  opacity:.55;
}
.home-services-overlay {
  background:
    linear-gradient(180deg, rgba(0,0,0,.68) 0%, rgba(0,0,0,.48) 45%, rgba(0,0,0,.78) 100%),
    radial-gradient(circle at center, rgba(215,169,59,.08), transparent 45%);
}
#services .container {
  z-index:2;
}
.home-services-intro h2 {
  font-size:clamp(2.6rem,3vw,3.4rem);
}
.home-service-cards {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:46px;
}
.service-card {
  min-height:430px;
}
.service-card .card-frame-gold-content {
  width:100%;
  height:100%;
  padding:3em 2em;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.service-card h2 {
  color:#fff;
  font-size:clamp(1.4rem,2vw,2.4rem);
  line-height:1.18;
  font-weight:300;
  margin:0;
  text-align:center;
}
.service-card p {
  max-width:350px;
  margin:0 auto 2.4em;
  color:rgba(255,255,255,.68);
  font-size:1.08rem;
  line-height:1.72;
  text-align:center;
}
.service-card .text-link,
.service-card .btn-row {
  margin:auto 0 0;
  padding: 0;
}
.service-card .card-icon {
  margin-bottom:2.1em;
}

/* ------------------------------------------------------------
   Website Design + SEO Feature Rows
------------------------------------------------------------ */
.home-feature-row {
  border-top:1px solid rgba(0,0,0,.06);
}
.home-feature-grid-reverse .image-card {
  order:2;
}

/* ------------------------------------------------------------
   Recent Projects
------------------------------------------------------------ */

.home-projects-panel {
  overflow:hidden;
  padding: 1em 0;
}

.home-projects-bg img {
  opacity:.55;
}

.home-projects-overlay {
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.65) 1%,
      rgba(0,0,0,.4) 30%,
      rgba(0,0,0,.3) 100%
    );
}
.home-projects-panel .container {
  z-index:2;
}
.home-projects-panel h2 {
  font-size:clamp(2.6rem,3vw,3.4rem);
  text-shadow: 0 0 1em rgba(0,0,0,.55);
}

.project-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:34px;
}

.project-card {
  min-height:100%;
  box-shadow:0 0 1.5em rgba(0,0,0,.55);
}

.project-card .card-frame-gold-content {
  padding:2px;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.55),
      rgba(0,0,0,.9)
    );
}

.project-card a {
  display:block;
  color:#fff;
  text-decoration:none;
}

.project-image {
  overflow:hidden;
  border-radius:4px;
  line-height:0;
}

.project-image img {
  display:block;
  width:100%;
  height:auto;
  transition:
    transform .7s ease,
    opacity .35s ease;
}
.project-card:hover .project-image img {
  opacity:1;
  filter:brightness(1);
  transform:scale(1.02);
}

.project-overlay {
  position:absolute;
  inset:0;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  background:rgba(0,0,0,.55);

  opacity:0;

  transition:opacity .3s ease;
}

.project-icon {
  color:var(--mwd-gold);
  font-size:2rem;
  margin-bottom:.6em;
}

.project-title {
  color:#fff;
  font-size:1.2rem;
  font-weight:500;
  text-align:center;
}

.project-card:hover .project-image img {
  transform:scale(1.06);
  opacity:.72;
}

.project-card:hover .project-overlay {
  opacity:1;
}

.project-cta {
  margin-top:3em;
  text-align:center;
}

@media only screen and (max-width:900px) {

  .project-grid {
    grid-template-columns:1fr 1fr;
  }

}

@media only screen and (max-width:850px) {
    #aboutBen .split__copy .br { display: inline; }
    .project-grid {
        grid-template-columns:1fr 1fr;
    }
}

@media only screen and (max-width:600px) {
    #aboutBen .split__copy .br { display: block; }

  .project-grid {
    grid-template-columns:1fr;
  }

}


/* ------------------------------------------------------------
   Responsive
------------------------------------------------------------ */
@media only screen and (max-width:1100px) {
  .home-service-cards {
    gap:28px;
  }
  .service-card .card-frame-gold-content {
    padding:46px 32px 42px;
  }
  .service-card p {
    font-size:1rem;
  }
}

@media only screen and (max-width:900px) {
  .testimonial-card {
    min-height:auto;
    padding:2em;
  }
  .project-grid {
    grid-template-columns:1fr 1fr;
  }
}

@media only screen and (max-width:850px) {
  .home-services-intro {
    margin-bottom:3.5em;
  }
  .home-service-cards {
    grid-template-columns:1fr;
    max-width:560px;
    margin:0 auto;
  }
  .home-feature-grid-reverse .split__copy {
    order:2;
  }
  .home-feature-grid-reverse .image-card {
    order:1;
  }
}

@media only screen and (max-width:600px) {
  .home-about .padding,
  .home-testimonials .padding,
  #services .padding,
  .home-feature-panel .padding,
  .home-projects-panel .padding,
  .home-cta-panel .padding {
    padding-top:55px;
    padding-bottom:55px;
  }
  .testimonial-card {
    padding:1.8em 1.6em 1.9em;
  }
  .testimonial-card p {
    font-size:.98rem;
  }
  .home-services-intro p {
    font-size:1rem;
  }
  .service-card {
    min-height:auto;
  }
  .service-card .card-frame-gold-content {
    padding:38px 26px 34px;
  }
  .project-grid {
    grid-template-columns:1fr;
  }
}