/* ============================================================
   Site-wide overrides — typography, spacing, buttons
   Loaded after style.min.css so all rules take effect
   ============================================================ */

/* ---------------------------------------------------------------
   1. TYPOGRAPHY
--------------------------------------------------------------- */

html {
  font-size: 16px;
}

body {
  font-family: 'Poppins', system-ui, -apple-system, sans-serif;
  font-size: 1rem;
  line-height: 1.7;
  color: #3d4a5c;
  -webkit-font-smoothing: antialiased;
}

/* Heading scale — tighter tracking, stronger weight */
h1, .h1 {
  font-size: clamp(2rem, 5vw, 3.25rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: #1a2540;
}

h2, .h2 {
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: #1a2540;
}

h3, .h3 {
  font-size: clamp(1.15rem, 2.5vw, 1.5rem);
  font-weight: 600;
  line-height: 1.3;
  color: #1a2540;
}

h4, .h4 { font-size: 1.15rem; font-weight: 600; color: #1a2540; }
h5, .h5 { font-size: 1rem;    font-weight: 600; color: #1a2540; }

/* Body copy / disc paragraphs */
p, .disc {
  font-size: 1rem;
  line-height: 1.75;
  color: #5a6478;
  max-width: 68ch;
}

/* Lead / sub-hero text */
p.title {
  font-size: clamp(1rem, 2vw, 1.2rem);
  line-height: 1.6;
  color: #5a6478;
}

/* Center constrained paragraphs inside text-center containers */
.text-center p,
.text-center .disc {
  margin-left: auto;
  margin-right: auto;
}

/* Homepage content section — full width, no 68ch cap */
.content-para p {
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

/* ---------------------------------------------------------------
   2. SPACING — section breathing room
--------------------------------------------------------------- */

.content-sec,
.our-program-section,
.digital-cards-section {
  padding-top: clamp(40px, 6vw, 80px);
  padding-bottom: clamp(40px, 6vw, 80px);
}

/* Hero banners — tight top, no bottom padding before image */
.rts-banner-area.banner-style-one {
  padding-top: clamp(12px, 2vw, 24px);
  padding-bottom: 0;
}

.rts-banner-area.banner-style-one .banner-one-inner {
  margin-bottom: 12px !important;
}

/* Hero image 20% smaller — homepage */
.homepage-main-img picture {
  display: block;
  max-width: 80%;
  margin: 0 auto;
}

/* Inner page hero images (punch card + membership) — 40% smaller total */
.inner-hero-banner .hero-banner-img picture,
.inner-hero-banner .hero-banner-img img {
  display: block;
  max-width: 60%;
  margin: 0 auto;
}

/* Tighten excessive mb on title areas */
.contact-title-area h2,
.rts-section-title h2 {
  margin-bottom: 12px;
}

.contact-title-area p.disc {
  margin-bottom: 32px;
}

/* ---------------------------------------------------------------
   3. BUTTONS — unified, on-brand, tactile
--------------------------------------------------------------- */

/* Base button */
.rts-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 28px;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  letter-spacing: 0.01em;
  transition: background 0.18s ease, color 0.18s ease,
              border-color 0.18s ease, transform 0.12s ease,
              box-shadow 0.18s ease;
  cursor: pointer;
  text-decoration: none;
  border: none;
}

.rts-btn:active {
  transform: scale(0.97) translateY(1px);
}

/* Primary — orange brand accent */
.rts-btn.btn-primary {
  background: #f49917;
  color: #fff;
  border: 2px solid #f49917;
  box-shadow: 0 2px 8px rgba(244, 153, 23, 0.25);
}

.rts-btn.btn-primary:hover {
  background: #d9870e;
  border-color: #d9870e;
  color: #fff;
  box-shadow: 0 4px 16px rgba(244, 153, 23, 0.35);
}

/* Pink — same treatment but use the defined pink */
.rts-btn.btn-pink {
  background: #f49917;
  color: #fff;
  border: 2px solid #f49917;
  box-shadow: 0 2px 8px rgba(244, 153, 23, 0.25);
}

.rts-btn.btn-pink:hover {
  background: #d9870e;
  border-color: #d9870e;
  color: #fff;
  box-shadow: 0 4px 16px rgba(244, 153, 23, 0.35);
}

/* Border / ghost button */
.rts-btn.btn-border {
  background: transparent;
  border: 2px solid #233d63;
  color: #233d63;
}

.rts-btn.btn-border:hover {
  background: #233d63;
  color: #fff;
}

/* Header CTA button (quote-btn) */
.quote-btn,
a.header-one-btn.quote-btn {
  background: #f49917;
  background: none;
  background-color: #f49917;
  color: #fff !important;
  border-radius: 8px;
  padding: 9px 22px;
  font-weight: 600;
  font-size: 0.9rem;
  transition: background 0.18s, box-shadow 0.18s, transform 0.12s;
  border: 2px solid #f49917;
}

.quote-btn:hover,
a.header-one-btn.quote-btn:hover {
  background-color: #d9870e;
  border-color: #d9870e;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(244, 153, 23, 0.3);
}

/* ---------------------------------------------------------------
   4. CARDS — subtle elevation, no harsh borders
--------------------------------------------------------------- */

.rts-single-wized,
.service-one-inner,
.pricing-wrapper-one {
  border-radius: 12px;
  border: 1px solid #eef1f6;
  box-shadow: 0 2px 12px rgba(35, 61, 99, 0.06);
  transition: box-shadow 0.2s, transform 0.2s;
}

.rts-single-wized:hover,
.service-one-inner:hover {
  box-shadow: 0 6px 24px rgba(35, 61, 99, 0.1);
  transform: translateY(-2px);
}

/* ---------------------------------------------------------------
   5. LINKS
--------------------------------------------------------------- */

a {
  transition: color 0.15s;
}

a:hover {
  color: #f49917;
}

/* ---------------------------------------------------------------
   6. FORM INPUTS (global — supplements register.php overrides)
--------------------------------------------------------------- */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="phone"],
select,
textarea {
  font-family: 'Poppins', sans-serif;
  font-size: 1rem;
  color: #233d63;
}

/* ---------------------------------------------------------------
   7. MOBILE TWEAKS
--------------------------------------------------------------- */

@media (max-width: 767px) {
  .rts-btn {
    padding: 11px 20px;
    font-size: 0.9rem;
  }

  h1, .h1 { letter-spacing: -0.01em; }
}

/* ---------------------------------------------------------------
   8. FAQ ACCORDION
--------------------------------------------------------------- */

.faq-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1.5px solid #e8edf4;
  border-radius: 12px;
  overflow: hidden;
}

details.faq-item {
  background: #fff;
  border-bottom: 1.5px solid #e8edf4;
}

details.faq-item:last-child {
  border-bottom: none;
}

details.faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  color: #1a2540;
  line-height: 1.4;
  list-style: none;
  user-select: none;
  gap: 12px;
  transition: background 0.15s;
}

details.faq-item summary::-webkit-details-marker { display: none; }

details.faq-item summary::after {
  content: '';
  display: inline-block;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23f49917' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px;
  transition: transform 0.22s ease;
}

details.faq-item[open] summary::after {
  transform: rotate(180deg);
}

details.faq-item summary:hover {
  background: #fafbfd;
}

details.faq-item[open] summary {
  background: #fffbf5;
  color: #f49917;
  border-bottom: 1.5px solid #f5e8d0;
}

.faq-content {
  padding: 0 22px 18px;
  animation: faqSlideIn 0.18s ease;
}

.faq-content p {
  font-size: 0.95rem;
  line-height: 1.7;
  color: #5a6478;
  margin: 10px 0 0;
  max-width: none;
}

@keyframes faqSlideIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* FAQ section title spacing */
#faq-punch-card h2,
#faq-membership-card h2,
section[id^="faq"] h2 {
  margin-bottom: 28px;
}
