/* Fort Kovant — Contact page. Interactive, custom-styled. Loaded on /contact/ only.
   Scoped to .fk-contact-* classes so it never overrides global styles. */

/* ---- Reach-us method cards ---- */
.fk-methods { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
.fk-method { display: flex; flex-direction: column; gap: .5rem; background: #fff; border: 1px solid var(--fk-line);
  border-radius: 14px; padding: 1.6rem 1.4rem; text-decoration: none; color: var(--fk-navy);
  transition: transform .2s var(--fk-ease), box-shadow .2s var(--fk-ease), border-color .2s var(--fk-ease); }
.fk-method:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(20,30,50,.13); border-color: var(--fk-peach); }
.fk-method .fk-m-icon { width: 48px; height: 48px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--fk-navy); color: #fff; margin-bottom: .5rem; transition: background .2s var(--fk-ease); }
.fk-method:hover .fk-m-icon { background: var(--fk-peach); color: var(--fk-navy); }
.fk-method .fk-m-icon svg { width: 24px; height: 24px; stroke: currentColor; fill: none; }
.fk-method h3 { font-family: var(--fk-font-display); font-weight: 700; font-size: 1.05rem; margin: 0; color: var(--fk-navy); }
.fk-method p { margin: 0; color: var(--fk-fog); font-size: .92rem; }
.fk-method .fk-m-val { color: var(--fk-blue); font-weight: 600; font-size: .92rem; }
@media (max-width: 900px) { .fk-methods { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .fk-methods { grid-template-columns: 1fr; } }

/* ---- Split: form + info ---- */
.fk-contact-split { display: grid; grid-template-columns: 1.15fr .85fr; gap: 2.5rem; align-items: start; }
@media (max-width: 900px) { .fk-contact-split { grid-template-columns: 1fr; } }

.fk-formcard { background: #fff; border: 1px solid var(--fk-line); border-radius: 18px; padding: clamp(1.6rem, 3vw, 2.6rem);
  box-shadow: 0 20px 50px rgba(20,30,50,.06); }
.fk-infocard { background: var(--fk-navy); color: #E6ECF5; border-radius: 18px; padding: clamp(1.6rem,3vw,2.4rem); }
.fk-infocard h3 { color: #fff; font-family: var(--fk-font-display); }
.fk-infocard .fk-eyebrow { color: var(--fk-peach); }
.fk-infocard a { color: var(--fk-peach); text-decoration: none; }
.fk-infocard .fk-info-row { display: flex; gap: .8rem; padding: 1rem 0; border-top: 1px solid var(--fk-line-dark); }
.fk-infocard .fk-info-row:first-of-type { border-top: 0; }
.fk-infocard .fk-info-row svg { width: 20px; height: 20px; stroke: var(--fk-peach); fill: none; flex: none; margin-top: 2px; }
.fk-infocard .fk-info-row b { color: #fff; display: block; font-size: .9rem; }
.fk-infocard .fk-info-row span { color: #C6D0E2; font-size: .9rem; }

/* ---- Style the Elementor Pro form ---- */
.fk-form .elementor-field-group > label,
.fk-formcard label { font-family: var(--fk-font-display); font-weight: 600; font-size: .82rem; color: var(--fk-navy);
  letter-spacing: .01em; margin-bottom: .4rem; }
.fk-form .elementor-field-textual,
.fk-formcard input[type=text], .fk-formcard input[type=email], .fk-formcard input[type=tel],
.fk-formcard textarea, .fk-formcard select {
  width: 100%; background: var(--fk-paper); border: 1px solid var(--fk-line); border-radius: 10px !important;
  padding: .85rem 1rem !important; font-size: 1rem; color: var(--fk-ink); transition: border-color .18s var(--fk-ease), box-shadow .18s var(--fk-ease); }
.fk-form .elementor-field-textual:focus,
.fk-formcard input:focus, .fk-formcard textarea:focus, .fk-formcard select:focus {
  outline: none; border-color: var(--fk-blue); box-shadow: 0 0 0 3px rgba(52,111,220,.15); background: #fff; }
.fk-form .elementor-button, .fk-formcard button[type=submit] {
  background: var(--fk-peach) !important; color: var(--fk-navy) !important; border: 0 !important; border-radius: 10px !important;
  font-family: var(--fk-font-display) !important; font-weight: 700 !important; padding: .95rem 1.8rem !important;
  transition: transform .18s var(--fk-ease), background .18s var(--fk-ease) !important; }
.fk-form .elementor-button:hover, .fk-formcard button[type=submit]:hover { background: var(--fk-peach-deep) !important; color: #fff !important; transform: translateY(-2px); }
.fk-form .elementor-field-group { margin-bottom: 1.1rem; }

/* ---- Selects: fix clipped text + add a chevron ---- */
.fk-formcard select, .fk-form select, .fk-bookform select {
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  line-height: 1.5; min-height: 52px; height: auto;
  padding: .85rem 2.6rem .85rem 1rem !important;
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2714%27%20height%3D%279%27%20viewBox%3D%270%200%2014%209%27%3E%3Cpath%20fill%3D%27none%27%20stroke%3D%27%235A6472%27%20stroke-width%3D%272%27%20d%3D%27M1%201l6%206%206-6%27/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 1rem center; background-size: 14px;
}

/* ---- Booking form ---- */
.fk-bookform { max-width: 720px; margin: 0 auto; }
.fk-book-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 600px) { .fk-book-row { grid-template-columns: 1fr; } }
.fk-bookform label { display: block; margin-bottom: 1rem; }
.fk-bookform input, .fk-bookform select, .fk-bookform textarea { width: 100%; margin-top: .35rem; }
.fk-bookform .fk-btn { width: 100%; justify-content: center; margin-top: .5rem; }
.fk-book-note { font-size: .82rem; color: var(--fk-fog); margin-top: 1rem; text-align: center; }
.fk-book-err { background: #F6E7E4; border-left: 3px solid var(--fk-oxblood); color: #5A1F1B; padding: .8rem 1rem; border-radius: 8px; margin-bottom: 1rem; }
.fk-book-success { max-width: 640px; margin: 0 auto; text-align: center; background: #fff; border: 1px solid var(--fk-line); border-radius: 18px; padding: 2.5rem; }
.fk-book-success h3 { font-family: var(--fk-font-display); color: var(--fk-navy); font-size: 1.6rem; }
.fk-book-success p { color: var(--fk-fog); margin: .8rem 0 1.4rem; }

/* ---- Reassurance note ---- */
.fk-reassure { display: flex; gap: .7rem; align-items: flex-start; background: rgba(253,176,116,.14); border: 1px solid rgba(253,176,116,.4);
  border-radius: 12px; padding: 1rem 1.2rem; margin-top: 1.2rem; }
.fk-reassure svg { width: 20px; height: 20px; stroke: var(--fk-peach-deep); fill: none; flex: none; margin-top: 2px; }
.fk-reassure p { margin: 0; color: var(--fk-fog); font-size: .88rem; }