/* 0nCore v1.0.0 — Frontend Styles */
/* Designed to blend with any theme while maintaining brand consistency */

/* ── Form ── */
.oncore-form-wrap { max-width: 560px; margin: 0 auto; }
.oncore-form-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 16px; overflow: hidden; box-shadow: 0 4px 16px rgba(0,0,0,0.04); }
.oncore-form-header { background: #1a2c27; padding: 24px 28px; text-align: center; color: #fff; }
.oncore-form-header h3 { font-size: 24px; font-weight: 400; font-family: Georgia, serif; margin: 0 0 4px; }
.oncore-form-header p { font-size: 13px; color: rgba(255,255,255,0.7); margin: 0; }
.oncore-form { padding: 24px 28px; }
.oncore-field { margin-bottom: 14px; }
.oncore-field label { display: block; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: #6b7280; margin-bottom: 5px; }
.oncore-field input, .oncore-field select, .oncore-field textarea {
  width: 100%; padding: 11px 14px;
  border: 1px solid #e5e7eb; border-radius: 10px;
  font-size: 14px; font-family: inherit;
  background: #fafaf8; color: #1a1a1a;
  outline: none; transition: border-color 0.2s;
}
.oncore-field input:focus, .oncore-field select:focus, .oncore-field textarea:focus {
  border-color: #2c4b43; box-shadow: 0 0 0 3px rgba(26,44,39,0.08);
}
.oncore-field textarea { resize: vertical; min-height: 80px; }
.oncore-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .oncore-field-row { grid-template-columns: 1fr; } }
.oncore-submit {
  width: 100%; padding: 13px;
  background: #1a2c27; color: #fff;
  border: none; border-radius: 100px;
  font-size: 15px; font-weight: 600; font-family: inherit;
  cursor: pointer; transition: background 0.2s;
}
.oncore-submit:hover { background: #2c4b43; }
.oncore-submit:disabled { opacity: 0.5; cursor: not-allowed; }
.oncore-privacy { text-align: center; font-size: 10px; color: #9ca3af; margin-top: 10px; }
.oncore-form-success { padding: 48px 28px; text-align: center; }
.oncore-check { font-size: 48px; color: #2c4b43; margin-bottom: 12px; }
.oncore-form-success h3 { font-size: 22px; color: #1a2c27; margin-bottom: 8px; }
.oncore-form-success p { font-size: 14px; color: #6b7280; }

/* ── Booking Button ── */
.oncore-booking-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: #1a2c27; color: #fff;
  padding: 12px 28px; border-radius: 100px;
  font-size: 14px; font-weight: 600;
  text-decoration: none; transition: all 0.2s;
}
.oncore-booking-btn:hover { background: #2c4b43; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(26,44,39,0.2); color: #fff; }

/* ── Booking Grid ── */
.oncore-booking-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.oncore-service-card {
  background: #fff; border: 1px solid #e5e7eb; border-radius: 14px; padding: 22px;
  position: relative; transition: all 0.3s;
}
.oncore-service-card:hover { border-color: #4a7a6c; box-shadow: 0 6px 20px rgba(26,44,39,0.06); }
.oncore-popular { border: 2px solid #c56a57; }
.oncore-popular-badge {
  position: absolute; top: 10px; right: 10px;
  background: #c56a57; color: #fff;
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;
  padding: 3px 10px; border-radius: 100px;
}
.oncore-service-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; }
.oncore-service-name { font-family: Georgia, serif; font-size: 16px; font-weight: 600; color: #1a2c27; }
.oncore-service-price { text-align: right; font-family: Georgia, serif; font-size: 18px; font-weight: 600; color: #1a2c27; }
.oncore-service-price small { font-size: 11px; color: #9ca3af; font-family: inherit; }
.oncore-service-desc { font-size: 13px; color: #6b7280; line-height: 1.6; margin-bottom: 14px; }
.oncore-service-book {
  display: inline-block;
  border: 1px solid #1a2c27; color: #1a2c27;
  padding: 7px 18px; border-radius: 100px;
  font-size: 12px; font-weight: 600;
  text-decoration: none; transition: all 0.2s;
}
.oncore-service-book:hover { background: #1a2c27; color: #fff; }

/* ── Phone ── */
.oncore-phone {
  display: inline-flex; align-items: center; gap: 6px;
  color: #1a2c27; font-weight: 600; text-decoration: none;
  transition: color 0.2s;
}
.oncore-phone:hover { color: #2c4b43; }

/* ── CTA ── */
.oncore-cta {
  border-radius: 16px; padding: 48px 32px;
  text-align: center; margin: 32px 0;
}
.oncore-cta-dark { background: linear-gradient(135deg, #1a2c27, #2c4b43); color: #fff; }
.oncore-cta-light { background: #f7f2ea; color: #1a2c27; border: 1px solid #e6dccf; }
.oncore-cta h2 { font-family: Georgia, serif; font-size: 32px; font-weight: 400; margin-bottom: 12px; }
.oncore-cta p { font-size: 14px; opacity: 0.8; max-width: 480px; margin: 0 auto 24px; }
.oncore-cta-btn {
  display: inline-flex; padding: 14px 32px;
  border-radius: 100px; font-size: 14px; font-weight: 600;
  text-decoration: none; transition: all 0.2s;
}
.oncore-cta-dark .oncore-cta-btn { background: #fff; color: #1a2c27; }
.oncore-cta-dark .oncore-cta-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.15); }
.oncore-cta-light .oncore-cta-btn { background: #1a2c27; color: #fff; }
.oncore-cta-light .oncore-cta-btn:hover { background: #2c4b43; }

/* ── Map ── */
.oncore-map { margin: 24px 0; border-radius: 12px; overflow: hidden; }
.oncore-map iframe { display: block; }