/* ══════════════════════════════════════════════════════════════════════
   VAYANTA — Contact page v2 (/contact, resources/views/contact-v2/show)
   Design: LANDING-PAGE/contact-v2 (approved). Buttons, headings, form fields and the
   FAQ accordion come from v2-components.css; open / closed copy is shown by the shared
   business-hours rule ([data-when] in vh-theme.css). Only this page's layout is here.
   ══════════════════════════════════════════════════════════════════════ */
.cv2 { font-family: 'Manrope', sans-serif; color: #13201B; background: #F5F4EF; width: 100%; min-width: 0; padding-bottom: 56px; }
.cv2 *, .cv2 *::before, .cv2 *::after { box-sizing: border-box; }
.cv2 a { color: #0E3B2E; }
.cv2 a:focus-visible, .cv2 button:focus-visible, .cv2 input:focus-visible + span { outline: 3px solid #F2A93B; outline-offset: 2px; }
.cv2-wrap { max-width: 1240px; margin: 0 auto; padding-left: 20px; padding-right: 20px; }
.cv2-sec { padding-top: 48px; display: flex; flex-direction: column; gap: 16px; }
.cv2-head { display: flex; flex-direction: column; gap: 6px; }

/* ---- 1 Hero ---- */
.cv2-hero { padding-top: 26px; padding-bottom: 8px; display: flex; flex-direction: column; gap: 16px; }
.cv2-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; gap: 8px; font-size: 13.5px; font-weight: 600; color: #4B5A53; }
.cv2-crumbs li { display: inline-flex; gap: 8px; align-items: center; }
.cv2 .cv2-crumbs a { color: #4B5A53; text-decoration: none; min-height: 24px; display: inline-flex; align-items: center; }
.cv2-crumbs [aria-current] { color: #13201B; }
.cv2-hero__row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; }
.cv2-hero__text { display: flex; flex-direction: column; gap: 12px; max-width: 760px; }
.cv2-hero h1 { margin: 0; font-family: 'Fraunces', serif; font-weight: 700; font-size: clamp(34px, 4.8vw, 60px); line-height: 1.04; letter-spacing: -.6px; color: #13201B; }
.cv2-hero p { margin: 0; font-size: 17px; line-height: 1.6; color: #3A4A42; }
.cv2-status { display: inline-flex; align-items: center; gap: 10px; border-radius: 999px; padding: 10px 16px; font-weight: 800; font-size: 14.5px; }
.cv2-status--open { background: #EEF4EF; border: 1px solid #CFE0D6; color: #1F5E43; }
.cv2-status--closed { background: #FDF4E4; border: 1px solid #F1D9AE; color: #7A4A0E; }
.cv2-dot { width: 9px; height: 9px; border-radius: 50%; background: #34C759; flex: none; animation: cv2pulse 1.8s infinite; }
.cv2-dot--off { background: #C98A12; animation: none; }
@keyframes cv2pulse { 0% { box-shadow: 0 0 0 0 rgba(52, 199, 89, .55) } 70% { box-shadow: 0 0 0 10px rgba(52, 199, 89, 0) } 100% { box-shadow: 0 0 0 0 rgba(52, 199, 89, 0) } }

/* ---- 2 Three ways ---- */
.cv2-ways { padding-top: 18px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.cv2-way { background: #fff; border: 1px solid #E6E8E2; border-radius: 22px; padding: 22px; display: flex; flex-direction: column; gap: 10px; position: relative; transition: transform .25s ease, box-shadow .25s ease; }
.cv2-way:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(14, 59, 46, .14); }
.cv2-way--wa { background: #0E3B2E; color: #fff; border-color: #0E3B2E; }
.cv2-way__flag { position: absolute; top: 16px; right: 16px; background: #F2A93B; color: #0E3B2E; font-size: 11.5px; font-weight: 800; padding: 4px 10px; border-radius: 999px; text-transform: uppercase; }
.cv2-way__ico { width: 50px; height: 50px; border-radius: 14px; background: #EEF4EF; display: flex; align-items: center; justify-content: center; }
.cv2-way--wa .cv2-way__ico { background: #1F7A4D; }
.cv2-way h2 { margin: 0; font-size: 20px; font-weight: 800; font-family: 'Manrope', sans-serif; color: inherit; }
.cv2-way p { margin: 0; font-size: 14.5px; color: #3A4A42; line-height: 1.5; }
.cv2-way--wa p { color: rgba(255, 255, 255, .85); }
.cv2-way > b { font-size: 15px; overflow-wrap: anywhere; }
.cv2 .cv2-way__btn { margin-top: auto; min-height: 50px; width: 100%; }

/* ---- 3–4 Form + office ---- */
.cv2-main { padding-top: 32px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.cv2-formcard { background: #fff; border: 1px solid #E6E8E2; border-radius: 24px; padding: 26px; box-shadow: 0 18px 40px rgba(14, 59, 46, .08); scroll-margin-top: 96px; }
.cv2-form { display: flex; flex-direction: column; gap: 16px; margin: 0; }
.cv2-form[hidden], .cv2-done[hidden], [data-cv2-trip][hidden], [data-cv2-support][hidden] { display: none; }
.cv2-form__head { display: flex; flex-direction: column; gap: 6px; }
.cv2-form__head > span { font-size: 14.5px; color: #4B5A53; }
.cv2-topics { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cv2-topics legend { padding: 0; margin-bottom: 8px; font-size: 12.5px; font-weight: 800; color: #4B5A53; }
.cv2-topic { position: relative; cursor: pointer; }
.cv2-topic input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.cv2-topic span { min-height: 44px; padding: 0 16px; border-radius: 999px; font-weight: 700; font-size: 14.5px; background: #fff; color: #13201B; border: 1.5px solid #D9DDD6; display: inline-flex; align-items: center; }
.cv2-topic input:checked + span { background: #0E3B2E; color: #fff; border-color: #0E3B2E; }
.cv2-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cv2-two--tight { gap: 8px; }
.cv2 .v2-field textarea { border: 1.5px solid #D9DDD6; border-radius: 12px; padding: 12px; font: inherit; font-size: 15px; font-weight: 500; color: #13201B; resize: vertical; min-height: 92px; width: 100%; }
.cv2 .v2-field textarea:focus-visible { outline: 3px solid #F2A93B; outline-offset: 2px; }
.cv2 .v2-field select, .cv2 .v2-field > input, .cv2 .v2-phone { height: 48px; }
.cv2-form__note { font-size: 12.5px; color: #4B5A53; text-align: center; }
.cv2-done { display: flex; flex-direction: column; gap: 12px; padding: 6px 0; }
.cv2-done:focus { outline: none; }
.cv2-done__h { font-family: 'Fraunces', serif; font-size: 26px; line-height: 1.2; }
.cv2-done > span { font-size: 15.5px; color: #3A4A42; line-height: 1.6; }
.cv2-side { display: flex; flex-direction: column; gap: 16px; }
.cv2-office { background: #fff; border: 1px solid #E6E8E2; border-radius: 24px; overflow: hidden; }
.cv2-map { display: block; height: 210px; position: relative; background: #E4ECE6; text-decoration: none; }
.cv2-map iframe { display: block; width: 100%; height: 100%; border: 0; }
.cv2-office__body { padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.cv2-office__body h2 { margin: 0; font-size: 18px; font-weight: 800; font-family: 'Manrope', sans-serif; }
.cv2-office__addr { margin: 0; display: flex; gap: 10px; font-size: 15px; line-height: 1.5; color: #3A4A42; }
.cv2-office__addr svg { flex: none; margin-top: 2px; }
.cv2-hours { margin: 0; border-top: 1px solid #EEF0EB; padding-top: 12px; display: flex; flex-direction: column; gap: 8px; font-size: 14.5px; }
.cv2-hours div { display: flex; justify-content: space-between; gap: 12px; }
.cv2-hours dt { color: #4B5A53; }
.cv2-hours dd { margin: 0; font-weight: 800; text-align: right; }
.cv2-office__note { margin: 0; font-size: 13.5px; color: #4B5A53; line-height: 1.5; }
.cv2-office__body .v2-btn { align-self: flex-start; }
.cv2-trust { list-style: none; margin: 0; background: #FDF4E4; border-radius: 20px; padding: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; font-size: 13px; color: #4A3412; }
.cv2-trust li { display: flex; flex-direction: column; gap: 2px; }
.cv2-trust b { font-size: 14px; color: #3B2A0E; }

/* ---- 5 Steps, 6 FAQ ---- */
.cv2-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.cv2-steps li { background: #fff; border: 1px solid #E6E8E2; border-radius: 20px; padding: 20px; display: flex; flex-direction: column; gap: 8px; }
.cv2-steps li > span { font-family: 'Fraunces', serif; font-size: 34px; font-weight: 700; color: #F2A93B; line-height: 1; }
.cv2-steps b { font-size: 17px; }
.cv2-steps p { margin: 0; font-size: 14.5px; color: #3A4A42; line-height: 1.55; }
.cv2-faq { max-width: 880px; padding-top: 52px; display: flex; flex-direction: column; gap: 12px; }
.cv2-faq > h2 { text-align: center; }

/* ---- 7 Mobile bar ---- */
.cv2-bar { display: none; }

@media (max-width: 980px) {
    .cv2-main { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
    .cv2-wrap { padding-left: 16px; padding-right: 16px; }
    .cv2-ways, .cv2-steps { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .cv2-two { grid-template-columns: minmax(0, 1fr); }
    .cv2-two--tight { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cv2-formcard { padding: 20px 16px; border-radius: 20px; }
    .cv2-sec { padding-top: 40px; }
    .cv2 { padding-bottom: 96px; }
    .cv2-bar { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 1030; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; background: #0E3B2E; border-radius: 18px; padding: 8px; box-shadow: 0 14px 34px rgba(0, 0, 0, .28); transition: transform .25s ease, opacity .25s ease; }
    .cv2-bar.is-tucked { transform: translateY(140%); opacity: 0; pointer-events: none; }
    .cv2 .cv2-bar a, .cv2 .cv2-bar button { text-decoration: none; font: inherit; font-weight: 800; font-size: 14px; border-radius: 12px; min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 6px; border: 0; cursor: pointer; }
    .cv2 .cv2-bar__wa { background: #1F7A4D; color: #fff; }
    .cv2 .cv2-bar__go { background: #F2A93B; color: #0E3B2E; }
    .cv2 .cv2-bar__call { background: rgba(255, 255, 255, .12); color: #fff; }
    /* The bar carries WhatsApp on phones, so the round site-wide button steps aside here. */
    body:has(.cv2-bar) .nd-global-wa-float { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
    .cv2-way, .cv2-bar { transition: none; }
    .cv2-dot { animation: none; }
}
