/* ============================================================
   Seluruh nilai px di file ini adalah px DESAIN Figma (frame
   lebar 1920px) yang sudah dikonversi menjadi
   calc(N * var(--u)), dengan --u = 1px desain
   (lihat ../responsive.css). Dengan cara ini seluruh halaman
   menskalakan proporsional mengikuti resolusi layar: isi tidak
   terpotong dan tidak ada scroll samping.
   ============================================================ */

.contact,
.contact * {
  box-sizing: border-box;
}
.contact {
  background: #ffffff;
  width: var(--page-width);
  height: calc(1606 * var(--u));
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
.bg-contact {
  width: calc(2068.34 * var(--u));
  height: calc(1538.45 * var(--u));
  position: absolute;
  left: calc(-53 * var(--u));
  top: calc(-5 * var(--u));
  overflow: hidden;
}
.vector {
  width: 92.74%;
  height: 97.57%;
  position: absolute;
  right: 4.64%;
  left: 2.62%;
  bottom: 0%;
  top: 2.43%;
  overflow: visible;
}
.vector2 {
  width: 33.98%;
  height: 31.3%;
  position: absolute;
  right: 51.19%;
  left: 14.83%;
  bottom: 58.53%;
  top: 10.17%;
  overflow: visible;
}
.vector3 {
  width: 18.75%;
  height: 17.27%;
  position: absolute;
  right: 15.31%;
  left: 65.93%;
  bottom: 72.56%;
  top: 10.17%;
  overflow: visible;
}
.group {
  width: 16.53%;
  height: 22.03%;
  position: absolute;
  right: 82.72%;
  left: 0.75%;
  bottom: 77.97%;
  top: 0%;
  overflow: visible;
}
.vector4 {
  width: 12.85%;
  height: 25.21%;
  position: absolute;
  right: 84.46%;
  left: 2.69%;
  bottom: 35.27%;
  top: 39.52%;
  overflow: visible;
}
.vector5 {
  width: 24.47%;
  height: 48.02%;
  position: absolute;
  right: 4.82%;
  left: 70.71%;
  bottom: 24.22%;
  top: 27.76%;
  overflow: visible;
}
.group2 {
  width: 10.1%;
  height: 13.46%;
  position: absolute;
  right: 91.64%;
  left: -1.74%;
  bottom: 53.13%;
  top: 33.41%;
  overflow: visible;
}
.group3 {
  width: 11.07%;
  height: 14.76%;
  position: absolute;
  right: 87.96%;
  left: 0.97%;
  bottom: 23.23%;
  top: 62.01%;
  overflow: visible;
}
.group4 {
  width: 14.43%;
  height: 19.23%;
  position: absolute;
  right: 1.19%;
  left: 84.38%;
  bottom: 66.12%;
  top: 14.66%;
  overflow: visible;
}
.group5 {
  width: 23.48%;
  height: 31.29%;
  position: absolute;
  right: 0%;
  left: 76.52%;
  bottom: 26.91%;
  top: 41.8%;
  overflow: visible;
}
.group6 {
  width: 23.63%;
  height: 14.56%;
  position: absolute;
  right: 30.09%;
  left: 46.28%;
  bottom: 14.53%;
  top: 70.92%;
  transform: translate(calc(-31.31 * var(--u)), 0);
  overflow: visible;
}
.group7 {
  width: 23.63%;
  height: 14.56%;
  position: absolute;
  right: 69.99%;
  left: 6.38%;
  bottom: 13.55%;
  top: 71.89%;
  overflow: visible;
}
.group8 {
  width: 10.1%;
  height: 13.46%;
  position: absolute;
  right: -0.27%;
  left: 90.17%;
  bottom: 9.06%;
  top: 77.48%;
  overflow: visible;
}
.group9 {
  width: 3.96%;
  height: 5.33%;
  position: absolute;
  right: 66.02%;
  left: 30.02%;
  bottom: 63.15%;
  top: 31.53%;
  overflow: visible;
}
.vector6 {
  width: 3.12%;
  height: 7.01%;
  position: absolute;
  right: 66.32%;
  left: 30.56%;
  bottom: 24.28%;
  top: 68.71%;
  overflow: visible;
}
.hubungi-kami {
  color: #7f3814;
  text-align: left;
  font-family: "WashYourHand-Regular", sans-serif;
  font-size: calc(122 * var(--u));
  font-weight: 400;
  position: absolute;
  right: 34.25%;
  left: 32.2%;
  width: 33.55%;
  bottom: 74.06%;
  top: 18.53%;
  height: 7.41%;
  animation: contactHeadlineFloat 3.2s ease-in-out infinite;
}

@keyframes contactHeadlineFloat {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(calc(-8 * var(--u))) rotate(-1deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hubungi-kami {
    animation: none;
  }
}

.dusun-buniasih-rt-08-rw-14-desa-muktisari-kecamatan-cipaku-kabupaten-ciamis {
  color: #fdeed0;
  text-align: left;
  font-family: "Poppins-Medium", sans-serif;
  font-size: calc(30 * var(--u));
  font-weight: 500;
  position: absolute;
  right: 30.52%;
  left: 36.79%;
  width: 32.68%;
  bottom: 24.47%;
  top: 69.36%;
  height: 6.18%;
}
._082115864866 {
  color: #fdeed0;
  text-align: left;
  font-family: "Poppins-Medium", sans-serif;
  font-size: calc(30 * var(--u));
  font-weight: 500;
  position: absolute;
  right: 37.1%;
  left: 37.1%;
  width: 10.25%;
  bottom: 64.12%;
  top: 32.96%;
  height: 2.93%;
}
.contact-detail-link {
  text-decoration: none;
  transition: transform 180ms ease, filter 180ms ease, color 180ms ease;
}
.contact-detail-link:hover,
.contact-detail-link:focus-visible {
  color: #ffffff;
  filter: brightness(1.08);
  transform: translateX(calc(6 * var(--u)));
  outline: none;
}
.sothu-71 {
  color: #fdeed0;
  text-align: left;
  font-family: "Poppins-Medium", sans-serif;
  font-size: calc(30 * var(--u));
  font-weight: 500;
  position: absolute;
  right: 57.21%;
  left: 37.32%;
  width: 5.46%;
  bottom: 55.28%;
  top: 41.8%;
  height: 2.93%;
}
.sothu-06 {
  color: #fdeed0;
  text-align: left;
  font-family: "Poppins-Medium", sans-serif;
  font-size: calc(30 * var(--u));
  font-weight: 500;
  position: absolute;
  right: 56.68%;
  left: 37.32%;
  width: 6%;
  bottom: 45.27%;
  top: 51.81%;
  height: 2.93%;
}
.sothu-sothu {
  color: #fdeed0;
  text-align: left;
  font-family: "Poppins-Medium", sans-serif;
  font-size: calc(30 * var(--u));
  font-weight: 500;
  position: absolute;
  right: 53.83%;
  left: 37.32%;
  width: 8.85%;
  bottom: 36.23%;
  top: 60.84%;
  height: 2.93%;
}
.button-pesan {
  width: 14.6%;
  height: 5.01%;
  position: absolute;
  right: 48.61%;
  left: 36.79%;
  bottom: 63.14%;
  top: 31.85%;
  overflow: hidden;
  cursor: pointer;
  transition: transform 180ms ease, filter 180ms ease;
}
.vector7 {
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%;
  overflow: visible;
}
.pesan-sekarang {
  color: #fdeed0;
  text-align: left;
  font-family: "Poppins-Medium", sans-serif;
  font-size: calc(27 * var(--u));
  font-weight: 500;
  position: absolute;
  right: 13.25%;
  left: 13.58%;
  width: 73.18%;
  bottom: 22.08%;
  top: 24.68%;
  height: 53.25%;
}
.button-pesan:hover,
.button-pesan:focus-visible {
  transform: scale(1.04);
  filter: brightness(1.08);
  outline: none;
}
.button-pesan:active {
  transform: scale(0.97);
  filter: brightness(0.96);
}
.vector8 {
  width: 3.9%;
  height: 5.99%;
  position: absolute;
  right: 65.99%;
  left: 30.11%;
  bottom: 53.71%;
  top: 40.3%;
  overflow: visible;
}
.group10 {
  width: 4.37%;
  height: 5.52%;
  position: absolute;
  right: 65.85%;
  left: 29.78%;
  bottom: 44.45%;
  top: 50.03%;
  overflow: visible;
}
.group11 {
  width: 4.37%;
  height: 5.53%;
  position: absolute;
  right: 65.78%;
  left: 29.85%;
  bottom: 35.23%;
  top: 59.24%;
  overflow: visible;
}
.bar-bawah-contact {
  width: calc(1921.98 * var(--u));
  height: calc(371.46 * var(--u));
  position: absolute;
  left: calc(-2 * var(--u));
  top: calc(1235 * var(--u));
  overflow: hidden;
}
.vector9 {
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%;
  overflow: visible;
}
.vector10 {
  width: 19.82%;
  height: 70.27%;
  position: absolute;
  right: 79.27%;
  left: 0.91%;
  bottom: 0.54%;
  top: 29.19%;
  overflow: visible;
}
.vector11 {
  width: 15.95%;
  height: 56.53%;
  position: absolute;
  right: 1.53%;
  left: 82.52%;
  bottom: 0.54%;
  top: 42.93%;
  overflow: visible;
}
.logo-putih {
  width: 11.03%;
  height: 53.14%;
  position: absolute;
  right: 83.32%;
  left: 5.64%;
  bottom: 15.32%;
  top: 31.55%;
  overflow: visible;
}
.vector12 {
  width: 11.25%;
  height: 24.5%;
  position: absolute;
  right: 62.6%;
  left: 26.15%;
  bottom: 0.26%;
  top: 75.24%;
  overflow: visible;
}
.vector13 {
  width: 17.62%;
  height: 51.42%;
  position: absolute;
  right: 38.97%;
  left: 43.42%;
  bottom: 0.27%;
  top: 48.31%;
  overflow: visible;
}
.vector14 {
  width: 11.25%;
  height: 24.5%;
  position: absolute;
  right: 21.92%;
  left: 66.83%;
  bottom: 0.26%;
  top: 75.24%;
  overflow: visible;
}
.gurihnya-nyatu {
  color: #ffffff;
  text-align: left;
  font-family: "WashYourHand-Regular", sans-serif;
  font-size: calc(60 * var(--u));
  font-weight: 400;
  position: absolute;
  right: 4.94%;
  left: 74.3%;
  width: 20.76%;
  bottom: 29.74%;
  top: 55.19%;
  height: 15.08%;
}
.bar-contact {
  width: calc(1919.96 * var(--u));
  height: calc(150.46 * var(--u));
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
}
.vector15 {
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%;
  overflow: visible;
}
.logo-warna {
  width: 5.44%;
  height: 64.56%;
  position: absolute;
  right: 90.19%;
  left: 4.38%;
  bottom: 18.16%;
  top: 17.28%;
  overflow: hidden;
}
.group12 {
  width: 99.99%;
  height: 99.98%;
  position: absolute;
  right: 0.01%;
  left: 0%;
  bottom: 0.01%;
  top: 0.01%;
  overflow: visible;
}
.home {
  color: #78310b;
  text-align: left;
  font-family: "WashYourHand-Regular", sans-serif;
  font-size: calc(50 * var(--u));
  font-weight: 400;
  position: absolute;
  right: 56.72%;
  left: 37.71%;
  width: 5.57%;
  bottom: 34.2%;
  top: 34.56%;
  height: 31.24%;
}
.about-us {
  color: #78310b;
  text-align: left;
  font-family: "WashYourHand-Regular", sans-serif;
  font-size: calc(50 * var(--u));
  font-weight: 400;
  position: absolute;
  right: 42.03%;
  left: 47.97%;
  width: 10%;
  bottom: 32.87%;
  top: 35.89%;
  height: 31.24%;
}
.product {
  color: #78310b;
  text-align: left;
  font-family: "WashYourHand-Regular", sans-serif;
  font-size: calc(50 * var(--u));
  font-weight: 400;
  position: absolute;
  right: 28.33%;
  left: 62.66%;
  width: 9.01%;
  bottom: 32.87%;
  top: 35.89%;
  height: 31.24%;
}
.review {
  color: #78310b;
  text-align: left;
  font-family: "WashYourHand-Regular", sans-serif;
  font-size: calc(50 * var(--u));
  font-weight: 400;
  position: absolute;
  right: 16.51%;
  left: 76.36%;
  width: 7.14%;
  bottom: 32.87%;
  top: 35.89%;
  height: 31.24%;
}
.contact2 {
  color: #78310b;
  text-align: left;
  font-family: "WashYourHand-Regular", sans-serif;
  font-size: calc(50 * var(--u));
  font-weight: 400;
  position: absolute;
  right: 3.23%;
  left: 88.18%;
  width: 8.59%;
  bottom: 32.87%;
  top: 35.89%;
  height: 31.24%;
}
.frame {
  width: 8.49%;
  height: 5.98%;
  position: absolute;
  right: 3.23%;
  left: 88.28%;
  bottom: 19.58%;
  top: 74.44%;
  overflow: visible;
}