/* ═══════════════════════════════════════════════════════
  Contact Form — Scoped styles
   Tailwind utility classes are applied via @apply or
   written directly here so they work without a build step.
   All rules are scoped to #scf-root to avoid theme leakage.
═══════════════════════════════════════════════════════ */

/* ── Google Font ── */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

/* ── CSS custom properties ── */
#scf-root {
  --scf-primary:     #7a9c59;
  --scf-primary-h:   #678649;
  --scf-bg:          #f0f5ea;
  --scf-card-bg:     #ffffff;
  --scf-border:      #edf5e4;
  --scf-text:        #1e1b4b;
  --scf-muted:       #6b7280;
  --scf-radius:      16px;
  --scf-shadow:      0 8px 40px rgba(99,102,241,.12), 0 2px 8px rgba(0,0,0,.06);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* ── Wrapper ── */
.scf-wrapper {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 2.5rem 1rem;
  background: var(--scf-bg);
  min-height: 100%;
}

/* ── Card ── */
.scf-card {
  width: 100%;
  max-width: 680px;
  background: var(--scf-card-bg);
  border-radius: var(--scf-radius);
  box-shadow: var(--scf-shadow);
  border: 1px solid var(--scf-border);
  padding: 2.5rem;
  position: relative;
  overflow: hidden;
}

/* decorative gradient blob top-right */
.scf-card::before {
  content: '';
  position: absolute;
  top: -80px; right: -80px;
  width: 260px; height: 260px;
  background: radial-gradient(circle, rgba(151, 241, 99, 0.15) 0%, transparent 70%);
  pointer-events: none;
}

/* ── Header ── */
.scf-header {
  text-align: center;
  margin-bottom: 1.75rem;
}

.scf-header-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: 14px;
  background: linear-gradient(135deg, #7a9c59, #678649);
  font-size: 1.5rem;
  margin-bottom: .75rem;
  box-shadow: 0 4px 18px rgba(161, 241, 99, 0.35);
}

.scf-title {
  font-size: 1.65rem !important;
  font-weight: 700 !important;
  color: var(--scf-text) !important;
  margin: 0 0 .3rem !important;
  line-height: 1.2 !important;
}

.scf-subtitle {
  color: var(--scf-muted);
  font-size: .9rem;
  margin: 0;
}

/* ── Alert ── */
.scf-alert {
  margin-bottom: 1.25rem !important;
  border-radius: 10px !important;
}

/* ── Form ── */
.scf-form .ant-form-item-label > label {
  font-weight: 500 !important;
  color: var(--scf-text) !important;
  font-size: .875rem !important;
}

.scf-form .ant-input,
.scf-form .ant-input-affix-wrapper,
.scf-form textarea.ant-input,
.scf-form .ant-select-selector {
  border-radius: 10px !important;
  border-color: var(--scf-border) !important;
  background: #fdfffc !important;
  font-family: inherit !important;
  transition: border-color .2s, box-shadow .2s !important;
}

.scf-form .ant-input:hover,
.scf-form .ant-select-selector:hover,
.scf-form textarea.ant-input:hover {
  border-color: var(--scf-primary) !important;
}

.scf-form .ant-input:focus,
.scf-form .ant-select-focused .ant-select-selector,
.scf-form textarea.ant-input:focus {
  border-color: var(--scf-primary) !important;
  box-shadow: 0 0 0 3px rgba(165, 241, 99, 0.15) !important;
}

/* ── Two-column row ── */
.scf-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 1rem;
}

@media (max-width: 520px) {
  .scf-row-2 { grid-template-columns: 1fr; }
  .scf-card   { padding: 1.5rem; }
}

/* ── Submit row ── */
.scf-submit-row {
  margin-top: .5rem !important;
  margin-bottom: .5rem !important;
}

.scf-btn.ant-btn-primary {
  background: linear-gradient(135deg, #678649, #7a9c59) !important;
  border: none !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  height: 48px !important;
  letter-spacing: .01em !important;
  box-shadow: 0 4px 18px rgba(165, 241, 99, 0.3) !important;
  transition: opacity .2s, transform .1s !important;
}

.scf-btn.ant-btn-primary:hover {
  opacity: .9 !important;
  transform: translateY(-1px) !important;
}

.scf-btn.ant-btn-primary:active {
  transform: translateY(0) !important;
}