
/* =========================================
   JUST DANCE — KONTAKT
   ========================================= */

.jd-contact{
  background:#f8f7f3;
  color:#292724;
}

/* HERO */
.jd-contact__hero{
  position:relative;
  min-height:340px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    linear-gradient(115deg,#30251d 0%,#70471f 48%,#9a6936 100%);
}

.jd-contact__hero::after{
  content:"";
  position:absolute;
  left:-5%;
  right:-5%;
  bottom:-48px;
  height:105px;
  background:#f8f7f3;
  border-top:2px solid #c48a3c;
  border-radius:50% 50% 0 0 / 28% 28% 0 0;
}

.jd-contact__hero-inner{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  position:relative;
  z-index:2;
  padding:60px 0 90px;
  text-align:center;
}

.jd-contact__eyebrow{
  display:block;
  color:#d3a35f;
  font-size:11px;
  font-weight:700;
  letter-spacing:.3em;
  margin-bottom:16px;
}

.jd-contact__hero h1{
  margin:0;
  color:#fff;
  font-size:clamp(52px,7vw,82px);
  line-height:1;
  font-weight:300;
  letter-spacing:.01em;
}

.jd-contact__hero p{
  margin:20px 0 0;
  color:#eadfd1;
  font-size:17px;
  letter-spacing:.04em;
}

/* CONTENT */
.jd-contact__content{
  padding:75px 0 100px;
}

.jd-contact__grid{
  width:min(1080px,calc(100% - 48px));
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);
  gap:80px;
  align-items:start;
}

.jd-contact__section{
  display:grid;
  grid-template-columns:74px minmax(0,1fr);
  gap:28px;
  align-items:start;
}

.jd-contact__icon{
  width:68px;
  height:68px;
  border:1.5px solid #c28a3c;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#a96f29;
  font-family:Georgia,serif;
  font-size:28px;
  font-weight:400;
}

.jd-contact__label{
  display:block;
  margin:4px 0 11px;
  color:#b17831;
  font-size:10px;
  font-weight:700;
  letter-spacing:.22em;
}

.jd-contact__section h2{
  margin:0;
  color:#292724;
  font-family:Georgia,"Times New Roman",serif;
  font-size:32px;
  line-height:1.15;
  font-weight:400;
}

.jd-contact__section p{
  margin:17px 0 25px;
  color:#6d6862;
  font-size:15px;
  line-height:1.75;
}

.jd-contact__details{
  display:flex;
  flex-direction:column;
  gap:15px;
}

.jd-contact__details a{
  display:flex;
  align-items:center;
  gap:13px;
  color:#3e3934;
  text-decoration:none;
  font-size:15px;
}

.jd-contact__details a:hover{
  color:#a96f29;
}

.jd-contact__detail-icon{
  color:#b17831;
  font-size:21px;
  width:25px;
  text-align:center;
}

.jd-contact__divider{
  width:calc(100% - 102px);
  height:1px;
  background:#dfd4c4;
  margin:42px 0 42px 102px;
}

/* FACEBOOK */
.jd-contact__facebook{
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:13px 18px;
  border:1px solid #b98543;
  color:#9b672d;
  text-decoration:none;
  font-size:13px;
  letter-spacing:.03em;
  transition:all .25s ease;
}

.jd-contact__facebook span{
  font-family:Arial,sans-serif;
  font-weight:700;
  font-size:19px;
}

.jd-contact__facebook strong{
  font-size:17px;
  font-weight:400;
  margin-left:5px;
}

.jd-contact__facebook:hover{
  background:#b98543;
  color:#fff;
}

/* SIDE CARD */
.jd-contact__card{
  background:#302a25;
  color:#fff;
  padding:48px 42px;
  position:relative;
  overflow:hidden;
  box-shadow:0 18px 45px rgba(35,29,24,.12);
}

.jd-contact__card::before{
  content:"";
  position:absolute;
  width:170px;
  height:170px;
  border:1px solid rgba(201,151,82,.3);
  border-radius:50%;
  right:-75px;
  top:-75px;
}

.jd-contact__card::after{
  content:"";
  position:absolute;
  width:100px;
  height:100px;
  border:1px solid rgba(201,151,82,.18);
  border-radius:50%;
  right:-40px;
  top:-40px;
}

.jd-contact__card-kicker{
  display:block;
  color:#d0a05c;
  font-size:10px;
  font-weight:700;
  letter-spacing:.23em;
  margin-bottom:18px;
}

.jd-contact__card h2{
  margin:0;
  color:#fff;
  font-family:Georgia,"Times New Roman",serif;
  font-size:38px;
  line-height:1.08;
  font-weight:400;
}

.jd-contact__card p{
  margin:22px 0 34px;
  color:#d3ccc5;
  font-size:14px;
  line-height:1.75;
}

.jd-contact__address{
  display:flex;
  align-items:flex-start;
  gap:18px;
}

.jd-contact__address-icon{
  color:#d0a05c;
  font-size:28px;
  line-height:1;
}

.jd-contact__address strong{
  display:block;
  margin-bottom:7px;
  color:#d0a05c;
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
}

.jd-contact__address span:last-child{
  color:#fff;
  font-size:14px;
  line-height:1.6;
}

.jd-contact__card-line{
  width:48px;
  height:1px;
  background:#b98543;
  margin:35px 0 22px;
}

.jd-contact__small{
  display:block;
  color:#aaa29b;
  font-size:11px;
  line-height:1.6;
}

.jd-contact__small + .jd-contact__small{
  margin-top:5px;
}

/* MOBILE */
@media(max-width:850px){
  .jd-contact__grid{
    grid-template-columns:1fr;
    gap:45px;
  }

  .jd-contact__card{
    max-width:560px;
  }
}

@media(max-width:600px){
  .jd-contact__hero{
    min-height:285px;
  }

  .jd-contact__hero-inner{
    width:calc(100% - 30px);
    padding:50px 0 80px;
  }

  .jd-contact__content{
    padding:55px 0 70px;
  }

  .jd-contact__grid{
    width:calc(100% - 30px);
  }

  .jd-contact__section{
    grid-template-columns:52px minmax(0,1fr);
    gap:17px;
  }

  .jd-contact__icon{
    width:50px;
    height:50px;
    font-size:22px;
  }

  .jd-contact__section h2{
    font-size:26px;
  }

  .jd-contact__section p{
    font-size:14px;
  }

  .jd-contact__divider{
    width:calc(100% - 69px);
    margin-left:69px;
  }

  .jd-contact__card{
    padding:36px 28px;
  }

  .jd-contact__card h2{
    font-size:32px;
  }
}
