/* contact page */

/* right hand card */

.page-template-page-contato .contact-info-container {
  background: #9f1f63;
  padding: 2.2em 1.8em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.page-template-page-contato .contact-info {
  color: #fff;
  text-align: left;
  font-family: Miso-Light, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1.6em;
  line-height: 1.5;
}

.page-template-page-contato #content-container .contact-info p {
  font-size: 1em;
  line-height: 1.5;
  margin: 0;
}

.page-template-page-contato #content-container .contact-info .name {
  font-family: Miso-Bold, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1.5em !important;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #fff;
  padding-bottom: .5em;
  margin: 0 0 .7em;
  border-bottom: 3px solid #ddb109;
}

/* contact points: one icon per line, same glyph vocabulary as the buttons
   below and the form fields on the left */

.page-template-page-contato .contact-info .contact-points {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* base.css sets li { display: inline-block } site wide */

.page-template-page-contato #content-container .contact-info .contact-points li {
  display: block;
  position: relative;
  font-size: 1em;
  line-height: 1.4;
  margin: 0 0 .5em;
  padding-left: 1.9em;
  background-repeat: no-repeat;
  background-size: 1.15em 1.15em;
  background-position: 0 .12em;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/* place and phone read as a second group; spacing does the separating, so no
   rule is needed inside the card */

.page-template-page-contato #content-container .contact-info .contact-points li.contact-point-place {
  margin-top: 1.3em;
}

.page-template-page-contato .contact-info .contact-point-email {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M2 4h20v16H2V4zm2 2v.4l8 5 8-5V6H4zm16 3.7l-8 5-8-5V18h16V9.7z'/%3E%3C/svg%3E");
}

.page-template-page-contato .contact-info .contact-point-facebook {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M22 12.06C22 6.5 17.52 2 12 2S2 6.5 2 12.06c0 5 3.66 9.15 8.44 9.94v-7.03H7.9v-2.91h2.54V9.85c0-2.51 1.49-3.9 3.77-3.9 1.09 0 2.24.2 2.24.2v2.46h-1.26c-1.24 0-1.63.77-1.63 1.56v1.89h2.78l-.45 2.91h-2.33V22c4.78-.79 8.44-4.94 8.44-9.94z'/%3E%3C/svg%3E");
}

.page-template-page-contato .contact-info .contact-point-instagram {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 2.16c3.2 0 3.58.01 4.85.07 1.17.05 1.8.25 2.23.41.56.22.96.48 1.38.9.42.42.68.82.9 1.38.16.42.36 1.06.41 2.23.06 1.27.07 1.65.07 4.85s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.41 2.23-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.16-1.06.36-2.23.41-1.27.06-1.65.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.23-.41-.56-.22-.96-.48-1.38-.9-.42-.42-.68-.82-.9-1.38-.16-.42-.36-1.06-.41-2.23-.06-1.27-.07-1.65-.07-4.85s.01-3.58.07-4.85c.05-1.17.25-1.8.41-2.23.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.16 1.06-.36 2.23-.41 1.27-.06 1.65-.07 4.85-.07zm0 5.68a4.16 4.16 0 1 0 0 8.32 4.16 4.16 0 0 0 0-8.32zm0 6.86a2.7 2.7 0 1 1 0-5.4 2.7 2.7 0 0 1 0 5.4zm5.3-7.02a.97.97 0 1 1-1.94 0 .97.97 0 0 1 1.94 0z'/%3E%3C/svg%3E");
}

.page-template-page-contato .contact-info .contact-point-place {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E");
}

.page-template-page-contato .contact-info .contact-point-phone {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M6.62 10.79a15.05 15.05 0 0 0 6.59 6.59l2.2-2.2a1 1 0 0 1 1.01-.24c1.12.37 2.33.57 3.58.57a1 1 0 0 1 1 1V20a1 1 0 0 1-1 1C10.4 21 3 13.6 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.46.57 3.58a1 1 0 0 1-.25 1.01l-2.2 2.2z'/%3E%3C/svg%3E");
}

/* no underline at rest; the yellow accent shows up on hover as a rule under
   the label, so the text itself stays white and keeps its contrast */

.page-template-page-contato .contact-info a,
.page-template-page-contato .contact-info a:visited {
  color: #fff;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

.page-template-page-contato .contact-info a:hover,
.page-template-page-contato .contact-info a:focus,
.page-template-page-contato .contact-info a:active {
  color: #fff;
  border-bottom-color: #ddb109;
  text-decoration: none;
  opacity: 1;
}

.page-template-page-contato .contact-info a:focus-visible {
  outline: 2px solid #ddb109;
  outline-offset: 3px;
}

/* action buttons */

/* the buttons continue the card above, so they sit the same 8px apart from it
   as they do from each other, at both breakpoints */

.page-template-page-contato .contact-actions {
  float: right !important;
  clear: right;
  margin-top: .8em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.page-template-page-contato .contact-action {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-family: Miso-Bold, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1.8em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: .06em;
  text-decoration: none;
  padding: 14px 16px;
  border: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.page-template-page-contato .contact-action + .contact-action {
  margin-top: .45em;
}

.page-template-page-contato .contact-action:hover,
.page-template-page-contato .contact-action:focus,
.page-template-page-contato .contact-action:active {
  text-decoration: none;
  opacity: 1;
  -webkit-box-shadow: none;
  box-shadow: none;
  outline: 0;
}

.page-template-page-contato .contact-action-icon {
  display: block;
  width: 1em;
  height: 1em;
  margin-right: .45em;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
}

.page-template-page-contato .contact-action-whatsapp,
.page-template-page-contato .contact-action-whatsapp:visited,
.page-template-page-contato .contact-action-whatsapp:hover,
.page-template-page-contato .contact-action-whatsapp:focus,
.page-template-page-contato .contact-action-whatsapp:active {
  background: #25d366;
  color: #0b3c1e;
}

.page-template-page-contato .contact-action-whatsapp:hover {
  background: #1fbb59;
}

.page-template-page-contato .contact-action-whatsapp:focus-visible {
  outline: 3px solid #0b3c1e;
  outline-offset: -3px;
}

.page-template-page-contato .contact-action-phone,
.page-template-page-contato .contact-action-phone:visited,
.page-template-page-contato .contact-action-phone:hover,
.page-template-page-contato .contact-action-phone:focus,
.page-template-page-contato .contact-action-phone:active {
  background: #ddb109;
  color: #3a3628;
}

.page-template-page-contato .contact-action-phone:hover {
  background: #c99f08;
}

.page-template-page-contato .contact-action-phone:focus-visible {
  outline: 3px solid #3a3628;
  outline-offset: -3px;
}

.page-template-page-contato .contact-action-email,
.page-template-page-contato .contact-action-email:visited {
  background: transparent;
  color: #9f1f63;
  border: 1px solid #9f1f63;
  padding: 13px 15px;
}

.page-template-page-contato .contact-action-email:hover,
.page-template-page-contato .contact-action-email:focus,
.page-template-page-contato .contact-action-email:active {
  background: #9f1f63;
  color: #fff;
  border-color: #9f1f63;
}

.page-template-page-contato .contact-action-email:focus-visible {
  outline: 3px solid #9f1f63;
  outline-offset: -3px;
}

/* contact form */

.page-template-page-contato #content-container .contact-form-container form p {
  font-size: 1.8em;
  line-height: 1.4;
  margin: 0 0 .8em;
  position: relative;
}

/* the placeholders carry the field names; the labels stay in the markup,
   visually hidden, so screen readers still announce them */

.page-template-page-contato .contact-form-container label {
  font-family: Miso, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1em;
  line-height: 1.4;
  color: #655d5f;
  text-transform: uppercase;
  letter-spacing: .04em;
  text-shadow: none;
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.page-template-page-contato .contact-form-container .wpcf7-form-control-wrap {
  display: block;
}

.page-template-page-contato .contact-form-container input[type="text"],
.page-template-page-contato .contact-form-container input[type="email"],
.page-template-page-contato .contact-form-container input[type="tel"],
.page-template-page-contato .contact-form-container textarea,
.page-template-page-contato .contact-form-container select {
  display: block;
  width: 100%;
  max-width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #bebdb5;
  background: #fff;
  color: #0d0d0c;
  font-family: Miso, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1em;
  line-height: 1.4;
  padding: 8px 10px;
}

.page-template-page-contato .contact-form-container select optgroup {
  font-family: Miso-Bold, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1em;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #655d5f;
  background: #f4f3ef;
}

.page-template-page-contato .contact-form-container select optgroup option {
  font-family: Miso, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  text-transform: none;
  letter-spacing: 0;
  color: #0d0d0c;
  background: #fff;
}

.page-template-page-contato .contact-form-container textarea {
  height: 140px;
  min-height: 140px;
  resize: vertical;
}

.page-template-page-contato .contact-form-container input[type="text"]:focus,
.page-template-page-contato .contact-form-container input[type="email"]:focus,
.page-template-page-contato .contact-form-container input[type="tel"]:focus,
.page-template-page-contato .contact-form-container textarea:focus,
.page-template-page-contato .contact-form-container select:focus {
  border-color: #ddb109;
  color: #0d0d0c;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.page-template-page-contato .contact-form-container input[type="submit"] {
  display: inline-block;
  min-width: 180px;
  background: #ddb109;
  border: 0;
  color: #3a3628;
  font-family: Miso, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1em;
  line-height: 1.4;
  text-transform: uppercase;
  letter-spacing: .06em;
  text-shadow: none;
  padding: 12px 22px;
  cursor: pointer;
}

.page-template-page-contato .contact-form-container input[type="submit"]:hover,
.page-template-page-contato .contact-form-container input[type="submit"]:focus,
.page-template-page-contato .contact-form-container input[type="submit"]:active {
  background: #c99f08;
  color: #3a3628;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.page-template-page-contato .contact-form-container input[type="submit"]:focus-visible {
  outline: 3px solid #3a3628;
  outline-offset: -3px;
}

.page-template-page-contato .contact-form-container .wpcf7-spinner {
  vertical-align: middle;
}

.page-template-page-contato .contact-form-container .wpcf7-not-valid-tip {
  position: static;
  top: auto;
  right: auto;
  display: block;
  font-family: Miso-Light, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: .85em;
  line-height: 1.3;
  color: #b94a48;
  margin-top: 4px;
}

.page-template-page-contato .contact-form-container .wpcf7-not-valid {
  border-color: #b94a48;
}

.page-template-page-contato .contact-form-container .wpcf7 form .wpcf7-response-output {
  font-family: Miso, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1.6em;
  line-height: 1.4;
  color: #b94a48;
  background: #f2dede;
  border: 1px solid #eed3d7;
  margin: 1em 0 0;
  padding: .7em .9em;
}

.page-template-page-contato .contact-form-container .wpcf7 form.sent .wpcf7-response-output {
  color: #3a3628;
  background: #fbf3d2;
  border-color: #ddb109;
}

/* field icons, same glyph vocabulary as the property form */

.page-template-page-contato .contact-form-container input[name="form-name"],
.page-template-page-contato .contact-form-container input[name="email"],
.page-template-page-contato .contact-form-container input[name="phone"],
.page-template-page-contato .contact-form-container select[name="subject"] {
  padding-left: 38px;
  background-repeat: no-repeat;
  background-size: 18px 18px;
  background-position: 11px center;
}

.page-template-page-contato .contact-form-container input[name="form-name"] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23655d5f'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-5 0-9 2.5-9 5.5V22h18v-2.5c0-3-4-5.5-9-5.5z'/%3E%3C/svg%3E");
}

.page-template-page-contato .contact-form-container input[name="email"] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23655d5f'%3E%3Cpath d='M2 4h20v16H2V4zm2 2v.4l8 5 8-5V6H4zm16 3.7l-8 5-8-5V18h16V9.7z'/%3E%3C/svg%3E");
}

.page-template-page-contato .contact-form-container input[name="phone"] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23655d5f'%3E%3Cpath d='M6.62 10.79a15.05 15.05 0 0 0 6.59 6.59l2.2-2.2a1 1 0 0 1 1.01-.24c1.12.37 2.33.57 3.58.57a1 1 0 0 1 1 1V20a1 1 0 0 1-1 1C10.4 21 3 13.6 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.46.57 3.58a1 1 0 0 1-.25 1.01l-2.2 2.2z'/%3E%3C/svg%3E");
  padding-right: 10px;
}

.page-template-page-contato .contact-form-container select[name="subject"] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23655d5f'%3E%3Cpath d='M21.41 11.58l-9-9A2 2 0 0 0 11 2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 .59 1.42l9 9a2 2 0 0 0 2.82 0l7-7a2 2 0 0 0 0-2.84zM6.5 8A1.5 1.5 0 1 1 8 6.5 1.5 1.5 0 0 1 6.5 8z'/%3E%3C/svg%3E");
  padding-right: 28px;
}

.page-template-page-contato .contact-form-container textarea[name="message"] {
  background-image: none;
  padding-left: 10px;
}

.page-template-page-contato .contact-form-container ::-webkit-input-placeholder {
  color: #66605b;
}

.page-template-page-contato .contact-form-container ::placeholder {
  color: #66605b;
}

/* stacked layout on the fixed grid breakpoint */

@media only screen and (max-width: 959px) {
  .page-template-page-contato .contact-form-container,
  .page-template-page-contato .contact-info-container,
  .page-template-page-contato .contact-actions {
    display: block;
    float: none !important;
    clear: both;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .page-template-page-contato .contact-info-container {
    margin-top: 2.4em;
  }

  .page-template-page-contato .contact-actions {
    margin-bottom: 2.4em;
  }
}
