/*
 * Alagendra storefront - contact page.
 * Derived from the reference design (reference html/style.css + responsive.css, .contact_page).
 */
.contact_page { padding: 100px 0; }
.contact_page .contact_main {
  display: flex; align-items: flex-start; background: #ffffff; padding: 40px;
  border-radius: 10px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
}

/* ---- form ---------------------------------------------------------------------------- */
.contact_page .contact_main .contact_form { width: 61%; padding-right: 40px; }
.contact_page .contact_main .contact_form h1 {
  font: 30px/32px Barlow-Bold; color: #333333; text-transform: uppercase; padding-bottom: 20px;
}
.contact_page .contact_main .contact_form > p { font: 17px/25px Barlow-Regular; color: #666666; padding-bottom: 24px; }
.contact_page .contact_main .contact_form .intext { margin-bottom: 14px; margin-top: 14px; }
.contact_page .contact_main .contact_form .intext.intext1 { display: flex; margin-top: 0; }
.contact_page .contact_main .contact_form .intext.intext1 .md-field { width: 49%; margin-right: 2%; }
.contact_page .contact_main .contact_form .intext.intext1 .md-field:last-child { margin-right: 0; }
.contact_page .contact_main .contact_form .md-field label,
.contact_page .contact_main .contact_form .ct-captcha-label {
  display: block; font: 17px/25px Barlow-Regular; color: #666666; padding-bottom: 6px;
}
.contact_page .contact_main .contact_form .intext .md-field input,
.contact_page .contact_main .contact_form .intext .md-field textarea {
  font: 17px/25px Barlow-Regular; color: #666666; display: block; width: 100%;
  border: 1px solid #dedede; border-radius: 5px; background: #ffffff;
}
.contact_page .contact_main .contact_form .intext .md-field input { height: 50px; padding: 0 15px; }
.contact_page .contact_main .contact_form .intext .md-field textarea { height: 120px; padding: 10px 15px; resize: vertical; min-height: 100px; }
.contact_page .contact_main .contact_form .intext .md-field textarea::-webkit-scrollbar { width: 4px; }
.contact_page .contact_main .contact_form .intext .md-field textarea::-webkit-scrollbar-thumb { border-radius: 5px; background-color: #cdcdcd; }
.contact_page .contact_main .contact_form input:focus,
.contact_page .contact_main .contact_form textarea:focus { outline: none; border-color: #1a6937; box-shadow: 0 0 0 2px rgba(26, 105, 55, 0.18); }
.contact_page .ct-req { color: #c0392b; }
.contact_page .ct-opt { font-size: 14px; color: #999999; }

/* Field errors: server-rendered and jQuery Validation use the same element. */
.contact_page .field-error { display: block; color: #c0392b; font: 14px/20px Barlow-Medium; padding-top: 5px; }
.contact_page [aria-invalid="true"] { border-color: #c0392b !important; }
.contact_page .ct-alert {
  background: #fdecea; color: #a93226; border-radius: 6px; padding: 10px 14px !important; margin-bottom: 16px;
  font: 16px/22px Barlow-Medium !important;
}

/* CAPTCHA: image, input and refresh button in one bordered box (reference .captcha_blk). */
.contact_page .contact_main .contact_form .captcha_blk {
  display: flex; align-items: stretch; border: 1px solid #dedede; border-radius: 5px; height: 50px;
  margin: 0; padding: 0; overflow: hidden; background: #ffffff;
}
.contact_page .contact_main .contact_form .captcha_blk:focus-within { border-color: #1a6937; box-shadow: 0 0 0 2px rgba(26, 105, 55, 0.18); }
.contact_page .contact_main .contact_form .captcha_blk img { height: 100%; width: auto; flex: 0 0 auto; border-right: 1px solid #dedede; }
.contact_page .contact_main .contact_form .captcha_blk input {
  flex: 1 1 auto; min-width: 0; height: 100%; border: 0; padding: 0 15px; box-shadow: none !important;
  font: 17px/25px Barlow-Regular; color: #333333; letter-spacing: 3px; text-transform: uppercase;
}
.contact_page .contact_main .contact_form .captcha_blk input::placeholder { letter-spacing: 0; text-transform: none; }
.contact_page .contact_main .contact_form .captcha_blk .refresh {
  flex: 0 0 50px; display: flex; align-items: center; justify-content: center; border: 0;
  background: transparent; color: #1a6937; font-size: 18px; cursor: pointer;
}
.contact_page .contact_main .contact_form .captcha_blk .refresh:hover,
.contact_page .contact_main .contact_form .captcha_blk .refresh:focus-visible { background: #f4f4f4; color: #f3b652; outline: none; }
.contact_page .contact_main .contact_form .captcha_blk .refresh.is-spinning i { animation: ct-spin 0.6s linear; }
@keyframes ct-spin { to { transform: rotate(360deg); } }
.contact_page .ct-help { display: block; font: 14px/20px Barlow-Regular; color: #888888; padding-top: 6px; }

/* Consent checkbox (reference .intext_check: custom box drawn on the text). */
.contact_page .contact_main .contact_form .intext.intext_check { position: relative; margin-top: 20px; }
.contact_page .contact_main .contact_form .intext.intext_check input.chk-bx {
  position: absolute; left: 0; top: 0; opacity: 0; height: 30px; width: 30px; z-index: 1; cursor: pointer; margin: 0;
}
.contact_page .contact_main .contact_form .intext.intext_check p {
  position: relative; font: 17px/25px Barlow-Regular; color: #666666; padding: 0 0 4px 30px;
}
.contact_page .contact_main .contact_form .intext.intext_check p a { color: #1a6937; position: relative; z-index: 5; }
.contact_page .contact_main .contact_form .intext.intext_check p a:hover { text-decoration: underline; }
.contact_page .contact_main .contact_form .intext.intext_check p:before {
  content: ""; position: absolute; top: 3px; left: 0; width: 20px; height: 20px;
  border: 1px solid #dedede; border-radius: 4px; background: #ffffff;
}
.contact_page .contact_main .contact_form .intext.intext_check p:after {
  content: ""; position: absolute; left: 7px; top: 5px; width: 7px; height: 13px;
  border-bottom: 2px solid #1a6937; border-right: 2px solid #1a6937; transform: rotate(45deg);
  opacity: 0; visibility: hidden;
}
.contact_page .contact_main .contact_form .intext.intext_check input:checked ~ p:after { opacity: 1; visibility: visible; }
.contact_page .contact_main .contact_form .intext.intext_check input:focus-visible ~ p:before { outline: 2px solid #1a6937; outline-offset: 2px; }
.contact_page .contact_main .contact_form .intext.intext_check input[aria-invalid="true"] ~ p:before { border-color: #c0392b; }

.contact_page .contact_main .contact_form .intext.intext_btn .ty-btn {
  font: 19px/46px Barlow-SemiBold; color: #ffffff; text-align: center; text-transform: uppercase;
  background: #f3b652; border-radius: 8px; border: 1px solid #f3b652; max-width: 175px; width: 100%;
  cursor: pointer; transition: background 0.2s ease, color 0.2s ease;
}
.contact_page .contact_main .contact_form .intext.intext_btn .ty-btn:hover,
.contact_page .contact_main .contact_form .intext.intext_btn .ty-btn:focus-visible { background: transparent; color: #f3b652; outline: none; }
.contact_page .contact_main .contact_form .intext.intext_btn .ty-btn:disabled { opacity: 0.7; cursor: progress; }

/* Honeypot: off-screen, not display:none (some bots skip hidden fields). */
.contact_page .ct-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* ---- contact information --------------------------------------------------------------- */
.contact_page .contact_main .contact_information { width: 39%; background: #f4f4f4; border-radius: 10px; padding: 20px 30px 40px; }
.contact_page .contact_main .contact_information h2 {
  font: 30px/40px Barlow-Bold; color: #333333; text-transform: uppercase; border-bottom: 1px solid #d1d1d1; padding-bottom: 11px;
}
.contact_page .contact_main .contact_information ul.ctinfo { padding: 45px 0 13px; }
.contact_page .contact_main .contact_information ul.ctinfo li {
  display: flex; align-items: flex-start; margin-bottom: 35px; padding-left: 0; background: none;
}
.contact_page .contact_main .contact_information ul.ctinfo li .img {
  width: 55px; height: 55px; min-width: 55px; display: flex; align-items: center; justify-content: center;
  border: 2px solid #1a6937; border-radius: 5px; margin-right: 20px; color: #1a6937; font-size: 22px;
  transition: background-color 0.2s ease;
}
.contact_page .contact_main .contact_information ul.ctinfo li .img img { object-fit: contain; }
.contact_page .contact_main .contact_information ul.ctinfo li strong { font: 20px/20px Barlow-Bold; color: #333333; display: block; padding-bottom: 12px; }
.contact_page .contact_main .contact_information ul.ctinfo li p { font: 17px/22px Barlow-Regular; color: #666666; }
.contact_page .contact_main .contact_information ul.ctinfo li a { font: 17px/25px Barlow-Regular; color: #666666; display: block; word-break: break-word; }
.contact_page .contact_main .contact_information ul.ctinfo li a:hover { color: #1a6937; }
.contact_page .contact_main .contact_information ul.ctinfo li.cl-call:hover .img,
.contact_page .contact_main .contact_information ul.ctinfo li.cl-mail:hover .img { background-color: #1a6937; }
.contact_page .contact_main .contact_information ul.ctinfo li.cl-call:hover img,
.contact_page .contact_main .contact_information ul.ctinfo li.cl-mail:hover img { filter: brightness(10); }
.contact_page .contact_main .contact_information .ct-none { font: 17px/25px Barlow-Regular; color: #666666; padding: 30px 0; }
.contact_page .contact_main .contact_information .contact-social { border-top: 1px solid #dedede; }
.contact_page .contact_main .contact_information .contact-social h3 { font: 25px/40px Barlow-Bold; color: #333333; padding: 14px 0 13px; }
.contact_page .contact_main .contact_information .contact-social ul { display: flex; }
.contact_page .contact_main .contact_information .contact-social ul li { margin-right: 30px; padding-left: 0; background: none; }
.contact_page .contact_main .contact_information .contact-social ul li a {
  text-indent: -2000rem; overflow: hidden; display: inline-block; width: 23px; height: 23px;
}
.contact_page .contact-social a.ct-fb { background: url('../images/ct_icon4.svg') no-repeat center center; }
.contact_page .contact-social a.ct-fb:hover, .contact_page .contact-social a.ct-fb:focus-visible { background-image: url('../images/ct_icon4_ho.svg'); }
.contact_page .contact-social a.ct-tw { background: url('../images/ct_icon5.svg') no-repeat center center; }
.contact_page .contact-social a.ct-tw:hover, .contact_page .contact-social a.ct-tw:focus-visible { background-image: url('../images/ct_icon5_ho.svg'); }
.contact_page .contact-social a.ct-ig { background: url('../images/ct_icon6.svg') no-repeat center center; }
.contact_page .contact-social a.ct-ig:hover, .contact_page .contact-social a.ct-ig:focus-visible { background-image: url('../images/ct_icon6_ho.svg'); }

section.map iframe { display: block; width: 100%; height: 450px; border: 0; }

/* ---- responsive (reference responsive.css) ---------------------------------------------- */
@media screen and (max-width: 1300px) { .contact_page { padding: 90px 0; } }
@media screen and (max-width: 1200px) {
  .contact_page { padding: 80px 0; }
  .contact_page .contact_main { padding: 35px; }
  .contact_page .contact_main .contact_form h1,
  .contact_page .contact_main .contact_information h2 { font-size: 28px; line-height: 35px; }
  .contact_page .contact_main .contact_information { padding: 20px 25px 35px; }
}
@media screen and (max-width: 1024px) {
  .contact_page .contact_main .contact_information { width: 42%; }
  .contact_page .contact_main .contact_form { width: 58%; padding-right: 30px; }
}
@media screen and (max-width: 991px) {
  .contact_page { padding: 70px 0; }
  .contact_page .contact_main { padding: 30px; }
  .contact_page .contact_main .contact_form h1,
  .contact_page .contact_main .contact_information h2 { font-size: 26px; line-height: 33px; }
  .contact_page .contact_main .contact_information { width: 45%; }
  .contact_page .contact_main .contact_form { width: 55%; }
  .contact_page .contact_main .contact_information ul.ctinfo { padding: 40px 0 10px; }
  .contact_page .contact_main .contact_information ul.ctinfo li { margin-bottom: 30px; }
  .contact_page .contact_main .contact_form .intext.intext_btn .ty-btn { font-size: 18px; }
  section.map iframe { height: 400px; }
}
@media screen and (max-width: 880px) {
  .contact_page { padding: 60px 0; }
  .contact_page .contact_main { padding: 30px 20px; }
  .contact_page .contact_main .contact_form { padding-right: 20px; }
  .contact_page .contact_main .contact_form h1,
  .contact_page .contact_main .contact_information h2 { font-size: 24px; line-height: 29px; }
  .contact_page .contact_main .contact_form h1 { padding-bottom: 15px; }
  .contact_page .contact_main .contact_information { padding: 20px 20px 30px; }
  .contact_page .contact_main .contact_information .contact-social h3 { padding: 10px 0; font-size: 24px; }
  .contact_page .contact_main .contact_information ul.ctinfo li .img { width: 50px; height: 50px; min-width: 50px; margin-right: 15px; }
  .contact_page .contact_main .contact_form .intext.intext_btn .ty-btn { line-height: 40px; }
}
@media screen and (max-width: 767px) {
  .contact_page { padding: 50px 0; }
  .contact_page .contact_main { padding: 25px 15px; flex-direction: column; }
  .contact_page .contact_main .contact_form h1,
  .contact_page .contact_main .contact_information h2 { font-size: 22px; line-height: 26px; }
  .contact_page .contact_main .contact_form { width: 100%; padding: 0; margin-bottom: 30px; }
  .contact_page .contact_main .contact_information { width: 100%; }
  .contact_page .contact_main .contact_information ul.ctinfo li { margin-bottom: 25px; }
  .contact_page .contact_main .contact_form > p,
  .contact_page .contact_main .contact_form .md-field label,
  .contact_page .contact_main .contact_form .intext.intext_check p,
  .contact_page .contact_main .contact_information ul.ctinfo li p,
  .contact_page .contact_main .contact_information ul.ctinfo li a { font-size: 16px; line-height: 23px; }
  .contact_page .contact_main .contact_form > p { padding-bottom: 20px; }
  .contact_page .contact_main .contact_form .intext .md-field input { height: 45px; }
  .contact_page .contact_main .contact_form .intext.intext1 { flex-direction: column; }
  .contact_page .contact_main .contact_form .intext.intext1 .md-field { width: 100%; margin: 0 0 10px; }
  .contact_page .contact_main .contact_form .intext { margin-bottom: 0; }
  .contact_page .contact_main .contact_form .intext.intext_btn .ty-btn { font-size: 17px; }
  .contact_page .contact_main .contact_information ul.ctinfo li strong { font-size: 19px; padding-bottom: 10px; }
  .contact_page .contact_main .contact_form .captcha_blk { height: 45px; }
  section.map iframe { height: 350px; }
}
@media screen and (max-width: 650px) {
  .contact_page .contact_main .contact_information .contact-social h3 { font-size: 23px; }
}
@media screen and (max-width: 400px) {
  .contact_page .contact_main .contact_form .captcha_blk img { width: 130px; height: auto; object-fit: cover; }
  .contact_page .contact_main .contact_form .captcha_blk input { padding: 0 10px; letter-spacing: 1px; }
  .contact_page .contact_main .contact_form .captcha_blk .refresh { flex-basis: 42px; }
  .contact_page .contact_main .contact_form .intext.intext_btn .ty-btn { max-width: none; }
  section.map iframe { height: 280px; }
}