.contact-page {
  position: relative;
  width: min(calc(100% - clamp(2rem, 8vw, 8rem)), 1560px);
  padding-block: clamp(.8rem, 1.4vw, 1.35rem) clamp(2.5rem, 4vw, 4rem);
  color: #18273b;
  background:
    radial-gradient(ellipse at 99% 6%, rgb(255 224 231 / 72%) 0, rgb(255 239 242 / 26%) 12rem, transparent 27rem),
    radial-gradient(ellipse at 1% 88%, rgb(255 226 230 / 55%) 0, transparent 20rem);
}
.contact-breadcrumb { display: flex; align-items: center; gap: .8rem; min-height: 2.25rem; margin-bottom: clamp(.8rem, 1.6vw, 1.2rem); color: #67748a; font-size: .88rem; }
.contact-breadcrumb a { display: grid; width: 1.7rem; height: 1.7rem; place-items: center; color: #df2459; }
.contact-breadcrumb svg { width: 1.45rem; height: 1.45rem; }
.contact-breadcrumb [aria-current="page"], .contact-breadcrumb__divider { color: #df2459; }
.contact-breadcrumb__divider { font-size: 1.4rem; line-height: 1; }
.contact-heading { display: flex; align-items: center; gap: clamp(.65rem, 1.35vw, 1.15rem); margin: 0 0 clamp(1.05rem, 2vw, 1.6rem); }
.contact-heading__flower, .contact-form-panel__flower { display: block; flex: 0 0 auto; color: #e64269; line-height: 0; }
.contact-heading__flower { width: clamp(3.3rem, 5vw, 4.5rem); height: clamp(4rem, 5vw, 4.8rem); }
.contact-heading__flower svg, .contact-form-panel__flower svg { display: block; width: 100%; height: 100%; }
.contact-heading .eyebrow { display: none; }
.contact-heading h1 { margin: 0 0 .12rem; color: #18273b; font-size: clamp(2.3rem, 3.7vw, 3.4rem); font-weight: 700; letter-spacing: -.055em; line-height: 1.12; }
.contact-heading p:last-child { margin: 0; color: #5e6c81; font-size: clamp(.95rem, 1.25vw, 1.12rem); line-height: 1.5; }
.contact-layout { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(390px, .88fr); align-items: stretch; gap: clamp(1rem, 1.7vw, 1.5rem); }
.contact-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(120px, 1fr) minmax(120px, 1fr) minmax(110px, auto); gap: clamp(.7rem, 1.2vw, 1rem); }
.contact-info-card { position: relative; display: flex; align-items: flex-start; gap: clamp(.8rem, 1.3vw, 1.15rem); min-height: clamp(132px, 10vw, 154px); padding: clamp(1rem, 1.5vw, 1.4rem); overflow: hidden; background: rgb(255 255 255 / 83%); border: 1px solid rgb(237 218 222 / 78%); border-radius: 19px; box-shadow: 0 10px 28px rgb(86 57 62 / 4%); }
.contact-info-card::after { position: absolute; right: 2px; bottom: -7px; width: 72px; height: 92px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 100' fill='none'%3E%3Cpath d='M8 94C35 76 44 49 58 8' stroke='%23dc6b82' stroke-width='2'/%3E%3Cpath d='M39 51c-14-9-22-8-28-1 9 10 18 10 29 5Zm9-24c-6-15-3-22 6-29 9 12 8 21-1 32Zm-5 38c14-12 24-13 33-5-9 12-20 15-34 10ZM22 76C10 67 4 69 0 75c7 8 14 8 22 4Z' fill='%23f9dfe5' stroke='%23dc6b82' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; content: ''; opacity: .62; transform: rotate(9deg); pointer-events: none; }
.contact-info-card__icon { display: grid; flex: 0 0 auto; width: clamp(48px, 5vw, 62px); height: clamp(48px, 5vw, 62px); place-items: center; color: #e2285c; background: #fff0f3; border: 1px solid #fde1e7; border-radius: 50%; }
.contact-info-card__icon svg { width: 25px; height: 25px; }
.contact-info-card > div { position: relative; z-index: 1; min-width: 0; padding-top: .1rem; }
.contact-info-card h2 { margin: 0 0 .16rem; color: #18273b; font-size: clamp(1rem, 1.35vw, 1.2rem); letter-spacing: -.025em; }
.contact-info-card p { margin: 0 0 .34rem; color: #617087; font-size: clamp(.8rem, 1vw, .92rem); line-height: 1.5; }
.contact-info-card a:not(.contact-info-card__button) { color: #df2459; font-size: clamp(.92rem, 1.25vw, 1.12rem); font-weight: 700; }
.contact-info-card strong { color: #df2459; font-size: clamp(1rem, 1.35vw, 1.2rem); }
.contact-info-card--whatsapp { background: linear-gradient(120deg, rgb(255 255 255 / 95%) 0%, rgb(255 255 255 / 95%) 68%, #fff0f3 100%); }
.contact-info-card .contact-info-card__button { display: inline-flex; align-items: center; justify-content: space-between; gap: .8rem; min-height: 42px; margin-top: .16rem; padding: .5rem .82rem; color: #fff; background: linear-gradient(100deg, #e83b6e, #c33165); border-radius: 11px; font-size: .79rem; font-weight: 700; }
.contact-info-card .contact-info-card__link { display: inline-flex; align-items: center; gap: .4rem; min-height: 34px; font-size: .8rem; }
.contact-info-card .contact-info-card__link span { font-size: .95rem; }
.contact-info-card--address { grid-column: 1 / -1; min-height: 110px; }
.contact-form-panel { position: relative; padding: clamp(1.2rem, 2vw, 1.8rem); overflow: hidden; background: rgb(255 255 255 / 91%); border: 1px solid #f0dfe2; border-radius: 23px; box-shadow: 0 16px 42px rgb(86 57 62 / 6%); }
.contact-form-panel::after { position: absolute; top: -80px; right: -65px; width: 185px; height: 185px; border: 1px solid rgb(215 126 145 / 16%); border-radius: 50%; content: ''; pointer-events: none; }
.contact-form-panel__intro { position: relative; z-index: 1; display: flex; align-items: flex-start; gap: .85rem; margin-bottom: 1rem; }
.contact-form-panel__flower { width: 3.2rem; height: 4rem; }
.contact-form-panel__intro h2 { margin: .02rem 0 .2rem; color: #18273b; font-size: clamp(1.55rem, 2.15vw, 1.95rem); letter-spacing: -.045em; line-height: 1.2; }
.contact-form-panel__intro p { max-width: 36rem; margin: 0; color: #617087; font-size: clamp(.8rem, .98vw, .9rem); line-height: 1.5; }
.contact-form { position: relative; z-index: 1; display: grid; gap: .62rem; }
.contact-form__row { display: grid; grid-template-columns: minmax(0, 1fr); gap: .62rem; }
.contact-form__field { position: relative; display: grid; gap: .32rem; min-width: 0; }
.contact-form__field label { position: absolute; z-index: 2; top: .88rem; left: .92rem; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.contact-form__field label span { color: #818998; font-weight: 400; }
.contact-form__field input, .contact-form__field select, .contact-form__field textarea { width: 100%; min-width: 0; min-height: 48px; padding: .68rem .85rem .68rem 3.15rem; color: #253143; background-color: #fff; background-repeat: no-repeat; background-position: 1rem center; background-size: 20px 20px; border: 1px solid #e3e2e6; border-radius: 12px; font-size: .84rem; transition: border-color 160ms ease, box-shadow 160ms ease; }
.contact-form__field input::placeholder, .contact-form__field textarea::placeholder { color: #8994a7; }
.contact-form__field input:focus, .contact-form__field select:focus, .contact-form__field textarea:focus { border-color: #d55273; outline: 0; box-shadow: 0 0 0 3px rgb(213 82 115 / 12%); }
.contact-form__field:nth-child(1) input { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238994a7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); }
.contact-form__row input[type="tel"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238994a7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.7a15 15 0 0 0 4.8 4.8L15 13l5 2v4c0 1.1-.9 2-2 2C10 20.5 3.5 14 3 6c0-1.1.9-2 2-2Z'/%3E%3C/svg%3E"); }
.contact-form__row input[type="email"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238994a7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E"); }
.contact-form__field select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238994a7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8l7 7 7-7'/%3E%3C/svg%3E"); background-position: right 1rem center; cursor: pointer; }
.contact-form__field textarea { min-height: 90px; padding-top: .85rem; resize: vertical; background-position: 1rem 1rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238994a7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h10l4 4v12H5z'/%3E%3Cpath d='M14 4v5h5M8 13h8M8 17h8'/%3E%3C/svg%3E"); }
.contact-form__submit { display: inline-flex; align-items: center; justify-content: center; gap: .7rem; width: 100%; min-height: 52px; padding: .75rem 1rem; color: #fff; background: linear-gradient(100deg, #e83b6e, #bd3765); border: 0; border-radius: 12px; font-size: .9rem; font-weight: 700; cursor: pointer; transition: transform 180ms ease, box-shadow 180ms ease; }
.contact-form__submit:hover { box-shadow: 0 9px 22px rgb(190 52 96 / 20%); transform: translateY(-1px); }
.contact-form__submit:active { transform: translateY(1px); }
.contact-form__submit svg { width: 20px; height: 20px; }
.contact-form__note, .contact-form__noscript { margin: 0; color: #7a8290; font-size: .69rem; text-align: center; }
.contact-form__noscript a { color: #c92f5c; text-decoration: underline; }
.contact-location { display: grid; grid-template-columns: minmax(300px, .62fr) minmax(0, 1.38fr); min-height: 340px; margin-top: clamp(1rem, 1.8vw, 1.4rem); overflow: hidden; background: rgb(255 255 255 / 84%); border: 1px solid #efdede; border-radius: 19px; box-shadow: 0 10px 30px rgb(86 57 62 / 4%); }
.contact-location__copy { position: relative; z-index: 1; display: flex; align-items: flex-start; gap: .9rem; padding: clamp(1.15rem, 2vw, 1.7rem); }
.contact-location__icon { display: grid; flex: 0 0 auto; width: 48px; height: 48px; place-items: center; color: #df2459; background: #fff0f3; border-radius: 50%; }
.contact-location__icon svg { width: 24px; height: 24px; }
.contact-location__copy h2 { margin: 0 0 .28rem; color: #18273b; font-size: clamp(1.3rem, 1.8vw, 1.55rem); letter-spacing: -.035em; }
.contact-location__copy p, .contact-location__copy address { margin: 0 0 .45rem; color: #617087; font-size: .82rem; font-style: normal; line-height: 1.55; }
.contact-location__button { display: inline-flex; align-items: center; gap: .55rem; min-height: 40px; margin-top: .18rem; padding: .5rem .86rem; color: #c92f5c; background: #fff; border: 1px solid #df456c; border-radius: 10px; font-size: .76rem; font-weight: 700; }
.contact-location__visual { min-width: 0; min-height: 340px; background: #e8f3f8; }
.contact-location__map { display: block; width: 100%; height: clamp(340px, 28vw, 460px); border: 0; }
@media (max-width: 960px) {
  .contact-layout { grid-template-columns: minmax(0, 1fr); }
  .contact-form-panel { grid-row: 1; }
  .contact-details { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .contact-page { width: calc(100% - 2rem); padding-top: .65rem; }
  .contact-breadcrumb { gap: .55rem; margin-bottom: .75rem; font-size: .78rem; }
  .contact-heading { align-items: flex-start; gap: .55rem; margin-bottom: .95rem; }
  .contact-heading__flower { width: 2.8rem; height: 3.5rem; }
  .contact-heading h1 { font-size: 2.15rem; }
  .contact-heading p:last-child { max-width: 34ch; font-size: .83rem; }
  .contact-layout { gap: .85rem; }
  .contact-form-panel { padding: 1rem; border-radius: 18px; }
  .contact-form-panel__intro { gap: .55rem; margin-bottom: .8rem; }
  .contact-form-panel__flower { width: 2.6rem; height: 3.3rem; }
  .contact-form-panel__intro h2 { font-size: 1.45rem; }
  .contact-form-panel__intro p { font-size: .78rem; }
  .contact-form { gap: .55rem; }
  .contact-form__row { gap: .55rem; }
  .contact-form__field input, .contact-form__field select, .contact-form__field textarea { min-height: 46px; font-size: .81rem; }
  .contact-form__field textarea { min-height: 82px; }
  .contact-details { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: .6rem; }
  .contact-info-card { min-height: 112px; padding: .9rem; }
  .contact-info-card__icon { width: 46px; height: 46px; }
  .contact-location { grid-template-columns: minmax(0, 1fr); margin-top: .85rem; }
  .contact-location__copy { padding: 1rem; }
  .contact-location__visual { min-height: 300px; grid-row: 1; }
  .contact-location__map { height: 300px; }
}
@media (prefers-reduced-motion: reduce) {
  .contact-form__field input, .contact-form__field select, .contact-form__field textarea, .contact-form__submit { transition: none; }
}
