/* Contact page. Shares primitives with sections.css. Logical properties for future RTL. */

/* ---------- Hero (deep, compact) ---------- */
.cb-ch { background: var(--deep); color: var(--on-dark); padding-block-start: calc(var(--wp--custom--header-height, 84px) + clamp(2rem, 5vw, 4.5rem)); padding-block-end: clamp(3rem, 5vw, 5rem); }
.cb-ch::before { content: ''; position: absolute; inset: 0; z-index: -2; background: radial-gradient(55% 90% at 85% 50%, rgba(198, 165, 108, 0.14), transparent 70%), radial-gradient(55% 80% at 78% 30%, rgba(39, 64, 106, 0.5), transparent 70%); }
.cb-ch__texture { position: absolute; inset: 0; z-index: -1; opacity: 0.1; mix-blend-mode: screen; filter: saturate(0.5); pointer-events: none; -webkit-mask-image: linear-gradient(100deg, transparent 15%, #000 70%); mask-image: linear-gradient(100deg, transparent 15%, #000 70%); }
.cb-ch__texture img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cb-ch__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 5vw, 6rem); align-items: end; }
.cb-ch__copy { display: grid; gap: 18px; justify-items: start; }
.cb-ch__title { font-size: clamp(2.3rem, 1rem + 4.2vw, 5.4rem); line-height: 1.03; letter-spacing: -0.04em; font-weight: 300; color: rgba(244, 241, 234, 0.86); text-wrap: balance; }
.cb-ch__title strong { font-weight: 650; color: var(--on-dark); }
.cb-ch .cb-lead { color: rgba(244, 241, 234, 0.78); max-width: 34rem; }
.cb-ch :focus-visible { outline-color: var(--gold-light); }
.cb-ch__routes { display: grid; border-block-start: 1px solid rgba(244, 241, 234, 0.2); max-width: 30rem; justify-self: end; width: 100%; }
.cb-ch__routes-title { margin: 0; padding-block: 12px 8px; font-size: 0.875rem; font-weight: 600; color: var(--gold-light); }
.cb-ch__routes a { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 60px; border-block-start: 1px solid rgba(244, 241, 234, 0.14); font-size: clamp(1.2rem, 1rem + 0.8vw, 1.6rem); font-weight: 500; letter-spacing: -0.03em; color: var(--on-dark); transition: color 420ms var(--ease), padding 420ms var(--ease); }
.cb-ch__routes a .cb-ico { color: var(--gold-light); transition: translate 420ms var(--ease); flex: none; }
.cb-ch__routes a:hover { color: var(--gold-light); padding-inline-start: 10px; }
.cb-ch__routes a:hover .cb-ico { translate: 0 3px; }
.cb-ch__routes a:active { scale: 0.98; }

/* ---------- Form (ivory) ---------- */
.cb-cf { background: var(--ivory); }
.cb-cf__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1.25rem, 3vw, 4rem); row-gap: 2rem; align-items: start; }
.cb-cf__head { grid-column: 1 / span 4; display: grid; gap: 18px; position: sticky; inset-block-start: 7rem; }
.cb-cf__title { font-size: clamp(2.1rem, 1.2rem + 2.8vw, 3.8rem); line-height: 1.05; letter-spacing: -0.04em; font-weight: 650; color: var(--navy-900); text-wrap: balance; }
.cb-cf__panel { grid-column: 6 / span 7; background: #fff; border-radius: 28px; padding: clamp(1.5rem, 3.4vw, 3rem); box-shadow: 0 1px 2px rgba(16, 27, 51, 0.05), 0 24px 60px -28px rgba(16, 27, 51, 0.22); }
.cb-cf__form { display: grid; gap: 22px; }
.cb-cf__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.cb-cf__field { display: grid; gap: 8px; }
.cb-cf label, .cb-cf legend { font-size: 0.9375rem; font-weight: 600; color: var(--ink); }
.cb-cf__opt { font-weight: 400; color: var(--ink-3); }
.cb-cf input[type="text"], .cb-cf input[type="email"], .cb-cf textarea { width: 100%; min-height: 52px; padding: 13px 16px; font: inherit; font-size: 1rem; color: var(--ink); background: var(--ivory); border: 1px solid var(--line-2); border-radius: 14px; transition: border-color 300ms var(--ease), box-shadow 300ms var(--ease), background-color 300ms var(--ease); }
.cb-cf textarea { min-height: 160px; resize: vertical; line-height: 1.55; }
.cb-cf input:hover, .cb-cf textarea:hover { border-color: #b3a48c; }
.cb-cf input:focus-visible, .cb-cf textarea:focus-visible { outline: 0; border-color: var(--navy-700); background: #fff; box-shadow: 0 0 0 3px rgba(39, 64, 106, 0.22); }
.cb-cf__field.has-error input, .cb-cf__field.has-error textarea { border-color: #9b2c2c; background: #fff7f6; }
.cb-cf__err { margin: 0; font-size: 0.875rem; font-weight: 500; color: #8a2020; }
.cb-cf__topics { border: 0; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cb-cf__topics legend { padding: 0; margin-block-end: 10px; grid-column: 1 / -1; float: none; }
.cb-cf__topics .cb-cf__err { grid-column: 1 / -1; }
.cb-cf__radio { position: relative; }
.cb-cf__radio input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; width: 100%; height: 100%; }
.cb-cf__radio label { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 16px; border: 1px solid var(--line-2); border-radius: 14px; background: var(--ivory); font-size: 1rem; font-weight: 550; color: var(--ink); cursor: pointer; transition: border-color 300ms var(--ease), background-color 300ms var(--ease), color 300ms var(--ease), scale 160ms var(--ease); }
.cb-cf__radio label::before { content: ''; flex: none; width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--ink-3); transition: border-color 300ms var(--ease), box-shadow 300ms var(--ease), background-color 300ms var(--ease); }
.cb-cf__radio input:hover + label { border-color: #b3a48c; }
.cb-cf__radio input:active + label { scale: 0.98; }
.cb-cf__radio input:checked + label { background: var(--navy-900); border-color: var(--navy-900); color: var(--on-dark); }
.cb-cf__radio input:checked + label::before { border-color: var(--gold); background: var(--gold); box-shadow: 0 0 0 3px var(--navy-900) inset; }
.cb-cf__radio input:focus-visible + label { outline: 2px solid var(--navy-700); outline-offset: 3px; }
.cb-cf__topics.has-error .cb-cf__radio label { border-color: #9b2c2c; }
.cb-cf__trap { position: absolute; inset-inline-start: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cb-cf__alert { padding: 16px 18px; border-radius: 14px; background: #fff1ef; border: 1px solid #e8b9b3; color: #6f1d1d; }
.cb-cf__alert p { margin: 0; font-weight: 600; }
.cb-cf__alert ul { margin: 8px 0 0; padding-inline-start: 1.1rem; list-style: disc; }
.cb-cf__alert a { color: #6f1d1d; text-decoration: underline; }
.cb-cf__alert:focus, .cb-cf__done:focus { outline: 2px solid var(--navy-700); outline-offset: 3px; }
.cb-cf__submit { justify-self: start; }
.cb-cf__submit[disabled] { opacity: 0.6; cursor: progress; }
.cb-cf__done { display: grid; gap: 10px; padding-block: clamp(1rem, 4vw, 3rem); }
.cb-cf__done h3 { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.3rem); font-weight: 600; letter-spacing: -0.03em; color: var(--navy-900); }
.cb-cf__done p { margin: 0; color: var(--ink-2); font-size: 1.0625rem; }
.cb-cf__done--muted h3 { color: var(--ink-2); font-weight: 500; }

/* ---------- Visit (pearl) ---------- */
.cb-cv { background: var(--pearl); }
.cb-cv__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: clamp(1.5rem, 4vw, 5rem); row-gap: 2rem; align-items: stretch; }
.cb-cv__info { display: grid; gap: 18px; align-content: center; justify-items: start; }
.cb-cv address { font-style: normal; font-size: 1.125rem; line-height: 1.6; color: var(--ink); padding-block: 14px; border-block: 1px solid var(--line-2); width: 100%; max-width: 26rem; }
.cb-cv__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; }
.cb-cv__online { display: grid; width: 100%; max-width: 26rem; }
.cb-cv__online li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 16px; padding-block: 4px; border-block-end: 1px solid var(--line-2); font-size: 0.9375rem; color: var(--ink-2); }
.cb-cv__online strong { color: var(--ink); font-weight: 600; margin-inline-end: 6px; }
.cb-cv__map { position: relative; min-height: 380px; border-radius: 28px; overflow: hidden; background: radial-gradient(70% 90% at 70% 40%, #27406a, #101b33 80%); display: grid; place-items: center; box-shadow: 0 30px 60px -36px rgba(16, 27, 51, 0.5); }
.cb-cv__map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cb-cv__load { display: grid; justify-items: center; gap: 6px; padding: 22px 30px; border-radius: 18px; background: rgba(244, 241, 234, 0.08); box-shadow: 0 0 0 1px rgba(244, 241, 234, 0.22) inset; color: var(--on-dark); font-weight: 600; transition: background-color 420ms var(--ease), scale 160ms var(--ease); }
.cb-cv__load:hover { background: rgba(244, 241, 234, 0.14); }
.cb-cv__load:active { scale: 0.96; }
.cb-cv__load small { font-size: 0.75rem; font-weight: 500; color: rgba(244, 241, 234, 0.82); }
.cb-cv :focus-visible { outline-color: var(--navy-700); }
.cb-cv__map :focus-visible { outline-color: var(--gold-light); }

/* ---------- Responsive ---------- */
@media (max-width: 1000px) {
	.cb-sec { --sec-y: clamp(3.5rem, 2rem + 6vw, 6rem); }
	.cb-ch__grid { grid-template-columns: 1fr; row-gap: 2.25rem; }
	.cb-ch__routes { justify-self: start; max-width: 36rem; }
	.cb-cf__head, .cb-cf__panel { grid-column: 1 / -1; position: static; }
	.cb-cv__grid { grid-template-columns: 1fr; }
	.cb-cv__map { min-height: 320px; }
}
@media (max-width: 700px) {
	.cb-sec { --sec-y: 3.25rem; }
	.cb-ch { padding-block-start: calc(var(--wp--custom--header-height, 68px) + 1.25rem); }
	.cb-cf__row, .cb-cf__topics { grid-template-columns: 1fr; }
	.cb-cf__panel { border-radius: 22px; padding: 1.25rem; }
	.cb-cf__submit { justify-self: stretch; justify-content: space-between; }
	.cb-cv__map { border-radius: 22px; min-height: 280px; }
}
@media (prefers-reduced-motion: reduce) {
	.cb-cf *, .cb-ch__routes a { transition-duration: 0.01ms !important; }
}
.cb-cf__notice { margin: 0; font-size: 0.875rem; line-height: 1.5; color: var(--ink-3); }
.cb-cf__check { display: flex; gap: 12px; align-items: flex-start; font-size: 0.9375rem; line-height: 1.5; color: var(--ink-2); cursor: pointer; }
.cb-cf__check input { flex: none; inline-size: 22px; block-size: 22px; margin-block-start: 2px; accent-color: var(--navy-900); }
