/* ===========================================================
   ocd.app v2 - Internal Pages CSS
   Matches Pencil design node wj1FJ
   =========================================================== */

/* ===========================================================
   1. PAGE HERO - blue bg, centered white text
   =========================================================== */
.int-hero {
  background: var(--primary);
  padding: 80px 0;
  text-align: center;
}
.int-breadcrumb {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.73);
  margin-bottom: 16px;
}
.int-hero h1 {
  font-size: 48px;
  font-weight: 700;
  color: var(--white);
}
.int-hero-desc {
  max-width: 600px;
  margin: 16px auto 0;
  font-size: 17px;
  line-height: 1.6;
  color: rgba(255,255,255,0.8);
}

/* ===========================================================
   Shared - section label
   =========================================================== */
.int-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-text);
}

/* ===========================================================
   2. FEATURES - light gray bg, 3 cards
   =========================================================== */
.int-features {
  background: var(--light-bg);
  padding: 80px 0;
}
.int-feat-header {
  text-align: center;
  max-width: 600px;
  margin: 0 auto 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.int-feat-header h2 {
  font-size: 36px;
  font-weight: 700;
  color: var(--dark-text);
  line-height: 1.2;
}
.int-feat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.int-feat-card {
  background: var(--white);
  border-radius: 16px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.int-feat-icon {
  width: 48px;
  height: 48px;
  background: var(--accent);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
}
.int-feat-icon i,
.int-feat-icon svg {
  width: 24px;
  height: 24px;
}
.int-feat-card h3 {
  font-size: 18px;
  font-weight: 700;
  color: var(--dark-text);
}
.int-feat-card p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--gray-text);
}

/* ===========================================================
   3. SPLIT SECTION - image + content side by side
   =========================================================== */
.int-split {
  padding: 80px 0;
}
.int-split-inner {
  display: flex;
  align-items: center;
  gap: 48px;
}
.int-split-img {
  flex: 1;
  min-width: 0;
}
.int-split-img img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  border-radius: 20px;
}
.int-split-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.int-split-content h2 {
  font-size: 28px;
  font-weight: 700;
  color: var(--dark-text);
  line-height: 1.3;
}
.int-split-prose p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--gray-text);
  margin-bottom: 12px;
}
.int-split-prose p:last-child { margin-bottom: 0; }

/* Checklist */
.int-checks {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.int-checks li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 500;
  color: var(--dark-text);
}
.int-checks i,
.int-checks svg {
  width: 20px;
  height: 20px;
  color: var(--accent);
  flex-shrink: 0;
}

/* Primary button (blue) */
.int-btn-primary {
  display: inline-block;
  align-self: flex-start;
  padding: 14px 28px;
  background: var(--primary);
  color: var(--white);
  font-size: 15px;
  font-weight: 600;
  border-radius: 24px;
  text-decoration: none;
  transition: background 200ms ease;
}
.int-btn-primary:hover { background: #005bb5; }

/* ===========================================================
   4. STATS BAR - blue bg, 4 stats
   =========================================================== */
.int-stats {
  background: var(--primary);
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 40px 80px;
}
.int-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.int-stat strong {
  font-size: 36px;
  font-weight: 700;
  color: var(--white);
}
.int-stat span {
  font-size: 14px;
  color: rgba(255,255,255,0.73);
}
.int-stat-divider {
  width: 1px;
  height: 60px;
  background: rgba(255,255,255,0.19);
}

/* ===========================================================
   5. REVERSE SPLIT - text left + blue steps card right
   =========================================================== */
.int-reverse {
  padding: 80px 0;
}
.int-reverse-inner {
  display: flex;
  align-items: center;
  gap: 48px;
}
.int-reverse-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.int-reverse-text h2 {
  font-size: 28px;
  font-weight: 700;
  color: var(--dark-text);
  line-height: 1.3;
}
.int-reverse-text p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--gray-text);
}

/* Steps card */
.int-steps-card {
  flex: 1;
  background: var(--primary);
  border-radius: 20px;
  padding: 36px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.int-steps-card h3 {
  font-size: 22px;
  font-weight: 700;
  color: var(--white);
}
.int-steps {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.int-steps li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: rgba(255,255,255,0.8);
}
.int-steps .int-step-active {
  font-weight: 600;
  color: var(--white);
}
.int-step-num {
  width: 32px;
  height: 32px;
  border-radius: 16px;
  background: rgba(255,255,255,0.13);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--white);
  flex-shrink: 0;
}
.int-step-num-green {
  background: var(--accent);
}

/* ===========================================================
   6. CTA BANNER BUTTON
   =========================================================== */
.cta-banner-btn {
  display: inline-block;
  align-self: flex-start;
  padding: 14px 28px;
  background: var(--accent);
  color: var(--dark-text);
  font-size: 15px;
  font-weight: 600;
  border-radius: 24px;
  text-decoration: none;
  transition: background 200ms ease;
}
.cta-banner-btn:hover { background: #45d4a8; }

/* ===========================================================
   RESEARCH PAGE - /ocd-research/
   =========================================================== */

/* Hero */
.rh-hero {
  background: var(--primary);
  padding: 80px 0;
  text-align: center;
}
.rh-breadcrumb {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.73);
  margin-bottom: 16px;
}
.rh-hero h1 {
  font-size: 48px;
  font-weight: 700;
  color: var(--white);
  max-width: 700px;
  margin: 0 auto;
}
.rh-hero-desc {
  max-width: 640px;
  margin: 16px auto 0;
  font-size: 17px;
  line-height: 1.6;
  color: rgba(255,255,255,0.8);
}

/* Stats bar */
.rh-stats {
  background: var(--dark-text);
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 40px 80px;
}
.rh-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.rh-stat strong {
  font-size: 36px;
  font-weight: 700;
  color: var(--white);
}
.rh-stat span {
  font-size: 14px;
  color: rgba(255,255,255,0.6);
}
.rh-stat-divider {
  width: 1px;
  height: 60px;
  background: rgba(255,255,255,0.15);
}

/* Quote card */
.rh-quote { padding: 80px 0; }
.rh-quote-card {
  display: flex;
  align-items: center;
  gap: 48px;
  background: var(--light-bg);
  border-radius: 20px;
  padding: 48px;
}
.rh-quote-img {
  flex-shrink: 0;
}
.rh-quote-img img {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  object-fit: cover;
}
.rh-quote-body blockquote {
  font-size: 18px;
  line-height: 1.7;
  color: var(--dark-text);
  font-style: italic;
  margin: 0 0 20px;
}
.rh-quote-attr strong {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: var(--dark-text);
}
.rh-quote-attr span {
  font-size: 14px;
  color: var(--gray-text);
}

/* Section header - shared */
.rh-section-header {
  text-align: center;
  margin-bottom: 48px;
}
.rh-section-header .int-label {
  margin-bottom: 12px;
}
.rh-section-header .int-label i {
  margin-right: 6px;
}
.rh-section-header h2 {
  font-size: 36px;
  font-weight: 700;
  color: var(--dark-text);
  line-height: 1.2;
}
.rh-section-desc {
  max-width: 560px;
  margin: 12px auto 0;
  font-size: 15px;
  line-height: 1.6;
  color: var(--gray-text);
}

/* Institutions grid */
.rh-institutions {
  padding: 80px 0;
  background: var(--light-bg);
}
.rh-inst-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.rh-inst-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: var(--white);
  border-radius: 12px;
  padding: 20px;
  transition: transform 280ms cubic-bezier(0.16,1,0.3,1), box-shadow 280ms ease;
}
.rh-inst-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}
.rh-inst-card i {
  color: var(--primary);
  font-size: 20px;
  flex-shrink: 0;
  margin-top: 2px;
}
.rh-inst-card span {
  font-size: 14px;
  line-height: 1.5;
  color: var(--dark-text);
  font-weight: 500;
}

/* Publications grid */
.rh-publications { padding: 80px 0; }
.rh-pub-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.rh-pub-card {
  background: var(--white);
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none;
  border: 1px solid var(--border, #E5E5E5);
  transition: transform 280ms cubic-bezier(0.16,1,0.3,1), box-shadow 280ms ease;
}
.rh-pub-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.08);
}
.rh-pub-img {
  position: relative;
  height: 180px;
  overflow: hidden;
}
.rh-pub-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 400ms cubic-bezier(0.16,1,0.3,1);
}
.rh-pub-card:hover .rh-pub-img img {
  transform: scale(1.05);
}
.rh-pub-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  color: var(--white);
}
.rh-pub-body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.rh-pub-pop {
  font-size: 12px;
  font-weight: 600;
  color: var(--gray-text);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.rh-pub-body h3 {
  font-size: 16px;
  font-weight: 700;
  color: var(--dark-text);
  line-height: 1.4;
}
.rh-pub-journal {
  font-size: 13px;
  color: var(--gray-text);
  line-height: 1.4;
}

/* ===========================================================
   CONDITION LANDING PAGE - /anxiety/, /depression/, /ocd-exercises/
   =========================================================== */

/* Intro - two-column: prose left, image right */
/* Condition intro - single column, constrained width */
.cond-intro {
  padding: 64px 0;
}
.cond-intro-inner {
  max-width: 760px;
  margin: 0 auto;
}
.cond-intro-img {
  margin-bottom: 40px;
  border-radius: 20px;
  overflow: hidden;
}
.cond-intro-img img {
  width: 100%;
  max-height: 400px;
  object-fit: cover;
  display: block;
}

/* Condition prose - full article styling */
.cond-prose {
  font-size: 16px;
  line-height: 1.8;
  color: #444;
}
.cond-prose p {
  margin-bottom: 20px;
}
.cond-prose p:last-child { margin-bottom: 0; }
.cond-prose h2 {
  font-size: 24px;
  font-weight: 700;
  color: #1A1A2E;
  margin: 40px 0 16px;
  padding-top: 24px;
  border-top: 1px solid #F0F0F5;
}
.cond-prose h2:first-child { margin-top: 0; border-top: none; padding-top: 0; }
.cond-prose h3 {
  font-size: 20px;
  font-weight: 700;
  color: #1A1A2E;
  margin: 32px 0 12px;
}
.cond-prose h4 {
  font-size: 17px;
  font-weight: 600;
  color: #1A1A2E;
  margin: 24px 0 8px;
}
.cond-prose img {
  max-width: 360px;
  height: auto;
  border-radius: 16px;
  margin: 24px 0;
  display: block;
  box-shadow: 0 4px 24px rgba(0,0,0,0.08);
}
.cond-prose ul,
.cond-prose ol {
  margin: 16px 0 24px;
  padding-left: 24px;
}
.cond-prose ul { list-style: disc; }
.cond-prose ol { list-style: decimal; }
.cond-prose li {
  margin-bottom: 8px;
  line-height: 1.7;
  color: #444;
}
.cond-prose li::marker {
  color: #558CEE;
}
.cond-prose a {
  color: #558CEE;
  text-decoration: underline;
  text-decoration-color: rgba(85,140,238,0.3);
  text-underline-offset: 2px;
  transition: text-decoration-color 200ms ease;
}
.cond-prose a:hover {
  text-decoration-color: #558CEE;
}
.cond-prose strong {
  font-weight: 600;
  color: #1A1A2E;
}
.cond-prose blockquote {
  margin: 24px 0;
  padding: 16px 24px;
  border-left: 3px solid #558CEE;
  background: #F5F7FA;
  border-radius: 0 12px 12px 0;
  font-style: italic;
  color: #555;
}
.cond-prose hr {
  border: none;
  border-top: 1px solid #E5E7EB;
  margin: 32px 0;
}

/* How It Works - 4-step grid */
.cond-hiw {
  padding: 80px 0;
}
.cond-hiw-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.cond-hiw-card {
  background: var(--white);
  border-radius: 16px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 12px;
  border: 1px solid var(--border, #E5E5E5);
  transition: transform 280ms cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 280ms ease;
}
.cond-hiw-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08);
}
.cond-hiw-num {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--primary);
  color: var(--white);
  font-size: 16px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cond-hiw-icon {
  width: 48px;
  height: 48px;
  background: var(--accent);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
}
.cond-hiw-icon i,
.cond-hiw-icon svg {
  width: 24px;
  height: 24px;
}
.cond-hiw-card h3 {
  font-size: 17px;
  font-weight: 700;
  color: var(--dark-text);
}
.cond-hiw-card p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--gray-text);
}

/* ===========================================================
   CONTACT PAGE - /contact/
   =========================================================== */

/* Two-column layout */
.ct-section { padding: 80px 0; }
.ct-grid {
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 48px;
  align-items: start;
}

/* Form */
.ct-form-title {
  font-size: 24px;
  font-weight: 700;
  color: var(--dark-text);
  margin-bottom: 28px;
}
.ct-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.ct-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ct-field label {
  font-size: 14px;
  font-weight: 600;
  color: var(--dark-text);
}
.ct-field input,
.ct-field textarea {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid #E5E5E5;
  border-radius: 12px;
  font-family: 'Urbanist', sans-serif;
  font-size: 15px;
  color: var(--dark-text);
  background: var(--white);
  transition: border-color 200ms ease;
  outline: none;
  box-sizing: border-box;
}
.ct-field input::placeholder,
.ct-field textarea::placeholder {
  color: #999;
}
.ct-field input:focus,
.ct-field textarea:focus {
  border-color: var(--primary);
}
.ct-field textarea {
  height: 160px;
  padding: 14px 16px;
  resize: vertical;
}
.ct-submit {
  display: inline-block;
  width: 100%;
  height: 48px;
  background: var(--accent);
  color: var(--white);
  font-family: 'Urbanist', sans-serif;
  font-size: 15px;
  font-weight: 600;
  border: none;
  border-radius: 24px;
  cursor: pointer;
  transition: background 200ms ease;
}
.ct-submit:hover { background: #45b88a; }

/* Info cards */
.ct-info {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ct-info-card {
  display: flex;
  align-items: center;
  gap: 16px;
  background: var(--light-bg);
  padding: 20px;
  border-radius: 12px;
}
.ct-info-icon {
  width: 44px;
  height: 44px;
  background: var(--primary);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  flex-shrink: 0;
}
.ct-info-icon i {
  font-size: 20px;
}
.ct-info-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ct-info-text strong {
  font-size: 15px;
  font-weight: 700;
  color: var(--dark-text);
}
.ct-info-text span {
  font-size: 14px;
  color: var(--gray-text);
}

/* Support section */
.ct-support {
  background: var(--light-bg);
  padding: 80px 0;
}
.ct-support-inner {
  text-align: center;
  max-width: 560px;
  margin: 0 auto;
}
.ct-support-inner h2 {
  font-size: 32px;
  font-weight: 700;
  color: var(--dark-text);
  margin-bottom: 12px;
}
.ct-support-inner p {
  font-size: 15px;
  line-height: 1.6;
  color: var(--gray-text);
  margin-bottom: 28px;
}
.ct-support-links {
  display: flex;
  justify-content: center;
  gap: 16px;
}
.ct-support-btn {
  display: inline-block;
  padding: 14px 28px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 24px;
  text-decoration: none;
  transition: background 200ms ease, color 200ms ease;
}
.ct-support-btn--primary {
  background: var(--primary);
  color: var(--white);
}
.ct-support-btn--primary:hover { background: #005bb5; }
.ct-support-btn--outline {
  background: transparent;
  color: var(--primary);
  border: 1.5px solid var(--primary);
}
.ct-support-btn--outline:hover {
  background: var(--primary);
  color: var(--white);
}

/* ===========================================================
   SOS / EMERGENCY HELP PAGE - /sos/
   =========================================================== */

/* Hero - red emergency bg */
.sos-hero {
  background: #DC2626;
  padding: 80px 0;
  text-align: center;
}
.sos-breadcrumb {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.73);
  margin-bottom: 16px;
}
.sos-hero h1 {
  font-size: 48px;
  font-weight: 700;
  color: var(--white);
}
.sos-hero-desc {
  max-width: 640px;
  margin: 16px auto 0;
  font-size: 17px;
  line-height: 1.6;
  color: rgba(255,255,255,0.85);
}
.sos-hero-numbers {
  margin-top: 24px;
  font-size: 24px;
  font-weight: 700;
  color: var(--white);
  letter-spacing: 0.5px;
}
.sos-hero-numbers a {
  color: var(--white);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.sos-hero-numbers a:hover {
  text-decoration-thickness: 3px;
}

/* Emergency banner - dark bg */
.sos-banner {
  background: var(--dark-text);
  padding: 32px 0;
}
.sos-banner-box {
  display: flex;
  align-items: center;
  gap: 16px;
  background: rgba(220,38,38,0.12);
  border: 1px solid rgba(220,38,38,0.3);
  border-radius: 12px;
  padding: 24px;
}
.sos-banner-box i {
  font-size: 28px;
  color: #FCA5A5;
  flex-shrink: 0;
}
.sos-banner-box p {
  font-size: 16px;
  line-height: 1.6;
  color: rgba(255,255,255,0.9);
  margin: 0;
}
.sos-banner-box a {
  color: #FCA5A5;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sos-banner-box a:hover {
  color: var(--white);
}

/* Section header - shared for sos */
.sos-section-header {
  text-align: center;
  margin-bottom: 48px;
}
.sos-section-header h2 {
  font-size: 36px;
  font-weight: 700;
  color: var(--dark-text);
  line-height: 1.2;
}
.sos-section-desc {
  max-width: 500px;
  margin: 12px auto 0;
  font-size: 15px;
  line-height: 1.6;
  color: var(--gray-text);
}

/* Crisis resources - 2x2 grid */
.sos-resources {
  padding: 80px 0;
}
.sos-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.sos-card {
  background: var(--white);
  border: 1px solid #E5E5E5;
  border-radius: 16px;
  padding: 24px;
}
.sos-card h3 {
  font-size: 20px;
  font-weight: 700;
  color: var(--dark-text);
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #E5E5E5;
}
.sos-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.sos-list li {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sos-list li strong {
  font-size: 15px;
  font-weight: 600;
  color: var(--dark-text);
}
.sos-phone {
  display: block;
}
.sos-phone a {
  font-size: 22px;
  font-weight: 700;
  color: #DC2626;
  text-decoration: none;
  letter-spacing: 0.5px;
}
.sos-phone a:hover {
  text-decoration: underline;
}
.sos-detail {
  font-size: 13px;
  color: var(--gray-text);
  line-height: 1.5;
}
.sos-detail a {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sos-detail a:hover {
  color: #005bb5;
}

/* Additional resources - light gray bg */
.sos-additional {
  padding: 80px 0;
  background: var(--light-bg);
}
.sos-add-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.sos-add-card {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  background: var(--white);
  border-radius: 12px;
  padding: 24px;
  border: 1px solid #E5E5E5;
}
.sos-add-card i {
  font-size: 22px;
  color: #DC2626;
  flex-shrink: 0;
  margin-top: 2px;
}
.sos-add-card strong {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: var(--dark-text);
  margin-bottom: 4px;
}
.sos-add-card .sos-phone {
  margin-bottom: 2px;
}
.sos-add-card .sos-phone a {
  font-size: 18px;
}

/* Reassurance - white bg, centered */
.sos-reassurance {
  padding: 80px 0;
}
.sos-reassurance-inner {
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}
.sos-reassurance h2 {
  font-size: 36px;
  font-weight: 700;
  color: var(--dark-text);
  margin-bottom: 32px;
}
.sos-remember-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-align: left;
}
.sos-remember-list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--dark-text);
  font-weight: 500;
}
.sos-remember-list i {
  width: 22px;
  height: 22px;
  color: var(--accent);
  flex-shrink: 0;
}

/* ===========================================================
   BLOG ARCHIVE - /resources/
   =========================================================== */

/* Filter bar */
.blg-filters {
  background: var(--white);
  padding: 20px 0;
}
.blg-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.blg-pill {
  display: inline-block;
  padding: 8px 20px;
  font-size: 13px;
  font-weight: 500;
  color: #1A1A2E;
  background: #F5F7FA;
  border-radius: 20px;
  text-decoration: none;
  transition: background 200ms ease, color 200ms ease;
}
.blg-pill:hover {
  background: #E8EBF0;
}
.blg-pill--active {
  background: var(--primary);
  color: var(--white);
  font-weight: 600;
}
.blg-pill--active:hover {
  background: #005bb5;
  color: var(--white);
}

/* Grid */
.blg-archive {
  padding: 40px 0;
}
.blg-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.blg-card {
  background: #F5F7FA;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  transition: transform 280ms cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 280ms ease;
}
.blg-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.08);
}
.blg-card-img {
  height: 180px;
  overflow: hidden;
}
.blg-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 400ms cubic-bezier(0.16, 1, 0.3, 1);
}
.blg-card:hover .blg-card-img img {
  transform: scale(1.05);
}
.blg-card-img-placeholder {
  width: 100%;
  height: 100%;
  background: #E5E5E5;
}
.blg-card-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
}
.blg-card-cat {
  font-size: 12px;
  font-weight: 600;
  color: var(--primary);
  text-transform: uppercase;
}
.blg-card-body h3 {
  font-size: 17px;
  font-weight: 700;
  color: #1A1A2E;
  line-height: 1.4;
}
.blg-card-excerpt {
  font-size: 13px;
  line-height: 1.5;
  color: #555;
  flex: 1;
}
.blg-card-more {
  font-size: 13px;
  font-weight: 600;
  color: #1A1A2E;
  margin-top: auto;
}

/* Pagination */
.blg-pagination {
  margin-top: 48px;
  display: flex;
  justify-content: center;
}
.blg-pagination h2 { display: none; }
.blg-pagination .nav-links {
  display: flex;
  align-items: center;
  gap: 8px;
}
.blg-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: #F5F7FA;
  font-size: 14px;
  font-weight: 600;
  color: #1A1A2E;
  text-decoration: none;
  transition: background 200ms ease, color 200ms ease;
}
.blg-pagination .page-numbers:hover {
  background: #E8EBF0;
}
.blg-pagination .page-numbers.current {
  background: var(--primary);
  color: var(--white);
}
.blg-pagination .page-numbers.prev,
.blg-pagination .page-numbers.next {
  width: auto;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 600;
}
.blg-pagination .page-numbers.dots {
  background: transparent;
  pointer-events: none;
}

/* Mid CTA */
.blg-mid-cta {
  background: #F5F7FA;
  padding: 48px 0;
}
.blg-mid-cta-inner {
  display: flex;
  align-items: center;
  gap: 40px;
}
.blg-mid-cta-text {
  flex: 1;
  min-width: 0;
}
.blg-mid-cta-text h2 {
  font-size: 32px;
  font-weight: 700;
  color: var(--dark-text);
  line-height: 1.2;
  margin-bottom: 12px;
}
.blg-mid-cta-text p {
  font-size: 15px;
  line-height: 1.6;
  color: var(--gray-text);
  margin-bottom: 24px;
}
.blg-mid-cta-btn {
  display: inline-block;
  padding: 14px 28px;
  background: var(--primary);
  color: var(--white);
  font-size: 15px;
  font-weight: 600;
  border-radius: 24px;
  text-decoration: none;
  transition: background 200ms ease;
}
.blg-mid-cta-btn:hover {
  background: #005bb5;
}
.blg-mid-cta-img {
  flex-shrink: 0;
}
.blg-mid-cta-img img {
  width: 300px;
  height: 220px;
  object-fit: cover;
  border-radius: 16px;
}

/* ===========================================================
   SINGLE POST - .sgl- prefix
   Pencil design node 4vMb2
   =========================================================== */

/* Hero */
.sgl-hero {
  background: var(--primary);
  padding: 60px 0;
}
.sgl-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.73);
  margin-bottom: 16px;
}
.sgl-breadcrumb a {
  color: rgba(255,255,255,0.73);
  text-decoration: none;
}
.sgl-breadcrumb a:hover {
  color: var(--white);
}
.sgl-bc-sep {
  color: rgba(255,255,255,0.53);
}
.sgl-cat-badge {
  display: inline-block;
  background: #54C79B;
  color: #1A1A2E;
  font-size: 12px;
  font-weight: 600;
  border-radius: 20px;
  padding: 6px 16px;
  margin-bottom: 16px;
}
.sgl-title {
  font-size: 44px;
  font-weight: 700;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 20px;
}
.sgl-meta {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.8);
}
.sgl-meta-dot {
  color: rgba(255,255,255,0.53);
  margin: 0 -8px;
}

/* Body Row */
.sgl-body {
  background: var(--white);
  padding: 60px 0;
}
.sgl-row {
  display: flex;
  gap: 48px;
}
.sgl-article {
  flex: 1;
  min-width: 0;
}
.sgl-sidebar {
  width: 360px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

/* Featured Image */
.sgl-featured {
  margin-bottom: 28px;
}
.sgl-featured img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
}

/* Article Prose */
.sgl-prose {
  font-size: 16px;
  line-height: 1.8;
  color: #555;
}
.sgl-prose h2 {
  font-size: 24px;
  font-weight: 700;
  color: #1A1A2E;
  margin: 28px 0 16px;
}
.sgl-prose h3 {
  font-size: 20px;
  font-weight: 700;
  color: #1A1A2E;
  margin: 24px 0 12px;
}
.sgl-prose h4 {
  font-size: 17px;
  font-weight: 600;
  color: #1A1A2E;
  margin: 20px 0 8px;
}
.sgl-prose p {
  margin-bottom: 20px;
  color: #555;
  line-height: 1.8;
}
.sgl-prose ul,
.sgl-prose ol {
  padding-left: 24px;
  margin-bottom: 20px;
}
.sgl-prose li {
  margin-bottom: 8px;
  line-height: 1.8;
}
.sgl-prose a {
  color: var(--primary);
  text-decoration: underline;
}
.sgl-prose img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin: 20px 0;
}
.sgl-prose blockquote {
  border-left: 4px solid var(--primary);
  padding: 16px 24px;
  margin: 24px 0;
  background: var(--light-bg);
  border-radius: 0 12px 12px 0;
  font-style: italic;
  color: #444;
}

/* Sidebar CTA Widget */
.sgl-widget-cta {
  background: var(--primary);
  border-radius: 20px;
  padding: 32px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.sgl-widget-icon {
  font-size: 40px;
  color: var(--white);
}
.sgl-widget-cta h3 {
  font-size: 22px;
  font-weight: 700;
  color: var(--white);
}
.sgl-widget-cta p {
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.8);
}
.sgl-widget-btn {
  display: block;
  width: 100%;
  background: #54C79B;
  color: #1A1A2E;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  padding: 14px;
  border-radius: 24px;
  transition: opacity 0.2s ease;
}
.sgl-widget-btn:hover {
  opacity: 0.9;
}
.sgl-widget-note {
  font-size: 12px;
  color: rgba(255,255,255,0.53);
}

/* Sidebar Related Posts Widget */
.sgl-widget-related {
  background: #F5F7FA;
  border-radius: 20px;
  padding: 24px;
}
.sgl-widget-related h3 {
  font-size: 18px;
  font-weight: 700;
  color: var(--dark-text);
  margin-bottom: 20px;
}
.sgl-rel-divider {
  border: none;
  border-top: 1px solid #E0E0E0;
  margin: 16px 0;
}
.sgl-rel-item {
  display: flex;
  gap: 14px;
  align-items: center;
  text-decoration: none;
}
.sgl-rel-item:hover .sgl-rel-title {
  color: var(--primary);
}
.sgl-rel-thumb {
  width: 64px;
  height: 64px;
  flex-shrink: 0;
  border-radius: 10px;
  overflow: hidden;
}
.sgl-rel-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.sgl-rel-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.sgl-rel-title {
  font-size: 14px;
  font-weight: 600;
  color: #1A1A2E;
  transition: color 0.2s ease;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sgl-rel-date {
  font-size: 12px;
  color: #555;
}

/* ===========================================================
   RESPONSIVE - Tablet (<=1200px)
   =========================================================== */
@media (max-width: 1200px) {
  .int-hero { padding: 60px 0; }
  .int-hero h1 { font-size: 36px; }
  .int-features { padding: 60px 0; }
  .int-feat-header h2 { font-size: 28px; }
  .int-split,
  .int-reverse { padding: 60px 0; }
  .int-stats { padding: 32px 40px; }
  .int-stat strong { font-size: 28px; }

  /* Condition tablet */
  .cond-intro { padding: 60px 0; }
  .cond-hiw { padding: 60px 0; }
  .cond-hiw-grid { grid-template-columns: repeat(2, 1fr); }

  /* Contact tablet */
  .ct-section { padding: 60px 0; }
  .ct-grid { grid-template-columns: 1fr 360px; gap: 36px; }
  .ct-support { padding: 60px 0; }
  .ct-support-inner h2 { font-size: 28px; }

  /* Research tablet */
  .rh-hero h1 { font-size: 36px; }
  .rh-stats { padding: 32px 40px; }
  .rh-stat strong { font-size: 28px; }
  .rh-quote-card { padding: 36px; gap: 32px; }
  .rh-inst-grid { grid-template-columns: repeat(2, 1fr); }
  .rh-pub-grid { grid-template-columns: repeat(2, 1fr); }
  .rh-section-header h2 { font-size: 28px; }

  /* SOS tablet */
  .sos-hero { padding: 60px 0; }
  .sos-hero h1 { font-size: 36px; }
  .sos-hero-numbers { font-size: 20px; }
  .sos-resources { padding: 60px 0; }
  .sos-section-header h2 { font-size: 28px; }
  .sos-additional { padding: 60px 0; }
  .sos-reassurance { padding: 60px 0; }
  .sos-reassurance h2 { font-size: 28px; }

  /* Blog tablet */
  .blg-grid { grid-template-columns: repeat(2, 1fr); }
  .blg-mid-cta-text h2 { font-size: 28px; }
  .blg-mid-cta-img img { width: 240px; height: 180px; }

  /* Single post tablet */
  .sgl-title { font-size: 36px; }
  .sgl-row { gap: 36px; }
  .sgl-sidebar { width: 300px; }
  .sgl-featured img { height: 300px; }
}

/* ===========================================================
   RESPONSIVE - Mobile (<=840px)
   =========================================================== */
@media (max-width: 840px) {
  .int-hero { padding: 48px 0; }
  .int-hero h1 { font-size: 30px; }
  .int-hero-desc { font-size: 15px; }

  .int-features { padding: 48px 0; }
  .int-feat-header h2 { font-size: 24px; }
  .int-feat-grid { grid-template-columns: 1fr; }

  .int-split-inner { flex-direction: column; }
  .int-split-img img { height: 260px; }

  .int-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding: 40px 20px;
  }
  .int-stat-divider { display: none; }
  .int-stat strong { font-size: 28px; }

  .int-reverse-inner { flex-direction: column; }

  .int-split,
  .int-reverse { padding: 40px 0; }

  /* Condition mobile */
  .cond-intro { padding: 40px 0; }
  .cond-prose img { max-width: 100%; }
  .cond-intro-img img { max-height: 280px; }
  .cond-hiw { padding: 40px 0; }
  .cond-hiw-grid { grid-template-columns: 1fr; }

  /* Contact mobile */
  .ct-section { padding: 48px 0; }
  .ct-grid { grid-template-columns: 1fr; }
  .ct-form-title { font-size: 22px; }
  .ct-support { padding: 48px 0; }
  .ct-support-inner h2 { font-size: 24px; }
  .ct-support-links { flex-direction: column; align-items: center; }

  /* Research mobile */
  .rh-hero { padding: 48px 0; }
  .rh-hero h1 { font-size: 28px; }
  .rh-hero-desc { font-size: 15px; }
  .rh-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 40px 20px; }
  .rh-stat-divider { display: none; }
  .rh-stat strong { font-size: 28px; }
  .rh-quote-card { flex-direction: column; text-align: center; padding: 32px; }
  .rh-quote-body blockquote { font-size: 16px; }
  .rh-inst-grid { grid-template-columns: 1fr; }
  .rh-pub-grid { grid-template-columns: 1fr; }
  .rh-quote, .rh-institutions, .rh-publications { padding: 48px 0; }

  /* SOS mobile */
  .sos-hero { padding: 48px 0; }
  .sos-hero h1 { font-size: 30px; }
  .sos-hero-desc { font-size: 15px; }
  .sos-hero-numbers { font-size: 18px; }
  .sos-banner-box { flex-direction: column; text-align: center; gap: 12px; }
  .sos-grid { grid-template-columns: 1fr; }
  .sos-resources { padding: 48px 0; }
  .sos-section-header h2 { font-size: 24px; }
  .sos-phone a { font-size: 18px; word-break: break-word; }
  .sos-card { padding: 20px; }
  .sos-add-grid { grid-template-columns: 1fr; }
  .sos-additional { padding: 48px 0; }
  .sos-reassurance { padding: 48px 0; }
  .sos-reassurance h2 { font-size: 24px; }

  /* Blog mobile */
  .blg-filters { padding: 16px 0; }
  .blg-pills { gap: 8px; }
  .blg-archive { padding: 24px 0; }
  .blg-grid { grid-template-columns: 1fr; }
  .blg-mid-cta { padding: 32px 0; }
  .blg-mid-cta-inner { flex-direction: column; text-align: center; }
  .blg-mid-cta-text h2 { font-size: 24px; }
  .blg-mid-cta-btn { align-self: center; }
  .blg-mid-cta-img img { width: 100%; height: auto; max-width: 300px; }
  .blg-pagination { margin-top: 32px; }

  /* Single post mobile */
  .sgl-hero { padding: 40px 0; }
  .sgl-title { font-size: 28px; }
  .sgl-meta { flex-wrap: wrap; gap: 8px; font-size: 13px; }
  .sgl-meta-dot { margin: 0; }
  .sgl-body { padding: 40px 0; }
  .sgl-row { flex-direction: column; }
  .sgl-sidebar { width: 100%; }
  .sgl-featured img { height: 240px; }
  .sgl-prose h2 { font-size: 20px; }
}

/* ===========================================================
   For Therapists - Module Cards
   =========================================================== */
.th-modules { padding: 64px 0; }
.th-modules-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 32px;
}
.th-module-card {
  padding: 28px;
  border-radius: 16px;
  border: 1px solid #E5E7EB;
  background: #fff;
  transition: transform 320ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 320ms ease;
}
.th-module-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.06);
}
.th-module-card h3 { font-size: 18px; margin: 12px 0 6px; }
.th-module-card p { font-size: 14px; color: #555; line-height: 1.6; }

@media (max-width: 768px) {
  .th-modules-grid { grid-template-columns: 1fr; }
}

/* ===========================================================
   Ambassador - Checkbox Grid
   =========================================================== */
.amb-platforms {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px 16px;
  padding: 8px 0;
}
.amb-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #333;
  cursor: pointer;
}
.amb-check input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: #558CEE;
  cursor: pointer;
}
.ct-form select {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  font-size: 15px;
  font-family: inherit;
  color: #1A1A2E;
  background: #fff;
  appearance: auto;
  transition: border-color 200ms ease;
}
.ct-form select:focus {
  outline: none;
  border-color: #558CEE;
}
.ct-form-desc {
  font-size: 15px;
  color: #555;
  line-height: 1.6;
  margin-bottom: 24px;
}

@media (max-width: 768px) {
  .amb-platforms { grid-template-columns: repeat(2, 1fr); }
}

/* ===========================================================
   Exercises Portal - Track Cards
   =========================================================== */
.portal-section { padding: 48px 0 80px; }

.portal-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.portal-card {
  background: #fff;
  border-radius: 16px;
  padding: 32px;
  border: 1px solid #E5E7EB;
  transition: transform 320ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 320ms ease;
}
.portal-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08);
}
.portal-icon {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  margin-bottom: 20px;
}
.portal-card h3 { font-size: 20px; margin-bottom: 8px; }
.portal-card p { font-size: 14px; color: #555; line-height: 1.6; margin-bottom: 16px; }

.portal-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.portal-tag {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 20px;
  background: #F5F7FA;
  font-size: 12px;
  font-weight: 600;
  color: #555;
}
.portal-link {
  font-size: 14px;
  font-weight: 600;
  color: #54C79B;
}
.portal-link:hover { text-decoration: underline; }

@media (max-width: 1024px) { .portal-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .portal-grid { grid-template-columns: 1fr; } }

/* ===========================================================
   Quiz Hub - Assessment Cards
   =========================================================== */
.quiz-hub-section { padding: 48px 0 64px; }

.quiz-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 32px;
}
.quiz-hub-card {
  display: block;
  background: #fff;
  border-radius: 16px;
  padding: 28px;
  border: 1px solid #E5E7EB;
  text-decoration: none;
  color: inherit;
  transition: transform 320ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 320ms ease;
}
.quiz-hub-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08);
}
.quiz-hub-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  margin-bottom: 16px;
}
.quiz-hub-card h3 { font-size: 18px; margin-bottom: 8px; color: #1A1A2E; }
.quiz-hub-card p { font-size: 14px; color: #555; line-height: 1.6; margin-bottom: 12px; }
.quiz-hub-meta {
  display: flex;
  gap: 16px;
  font-size: 13px;
  color: #888;
  margin-bottom: 12px;
}
.quiz-hub-meta i { margin-right: 4px; }
.quiz-hub-link {
  font-size: 14px;
  font-weight: 600;
  color: #54C79B;
}

@media (max-width: 1024px) { .quiz-hub-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .quiz-hub-grid { grid-template-columns: 1fr; } }

/* ===========================================================
   Subscriptions - Cancel Cards + Steps
   =========================================================== */
.sub-cancel { padding: 64px 0; background: #F5F7FA; }

.sub-cancel-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}
.sub-cancel-card {
  background: #fff;
  border-radius: 16px;
  padding: 32px;
  border: 1px solid #E5E7EB;
}
.sub-cancel-card h3 { font-size: 20px; margin: 12px 0 16px; }

.sub-steps {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
  counter-reset: substep;
}
.sub-steps li {
  counter-increment: substep;
  padding: 10px 0 10px 36px;
  position: relative;
  font-size: 15px;
  line-height: 1.5;
  border-bottom: 1px solid #F0F0F5;
}
.sub-steps li::before {
  content: counter(substep);
  position: absolute;
  left: 0;
  top: 10px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #558CEE;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sub-steps li:last-child { border-bottom: none; }

.sub-note {
  font-size: 13px;
  color: #888;
  font-style: italic;
}

@media (max-width: 768px) {
  .sub-cancel-grid { grid-template-columns: 1fr; }
}

/* --- Contact Form 7 Integration --- */
.ct-form-wrap .wpcf7 { width: 100%; }
.ct-form-wrap .wpcf7-form .ct-field { margin-bottom: 20px; }
.ct-form-wrap .wpcf7-form .ct-field label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: #1A1A2E;
  margin-bottom: 6px;
}
.ct-form-wrap .wpcf7-form input[type="text"],
.ct-form-wrap .wpcf7-form input[type="email"],
.ct-form-wrap .wpcf7-form select,
.ct-form-wrap .wpcf7-form textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid #E5E7EB;
  border-radius: 10px;
  font-size: 15px;
  color: #333;
  background: #FAFAFA;
  font-family: inherit;
  transition: border-color 200ms ease;
}
.ct-form-wrap .wpcf7-form input:focus,
.ct-form-wrap .wpcf7-form select:focus,
.ct-form-wrap .wpcf7-form textarea:focus {
  outline: none;
  border-color: #558CEE;
  background: #fff;
}
.ct-form-wrap .wpcf7-form textarea { min-height: 140px; resize: vertical; }
.ct-form-wrap .wpcf7-form select { appearance: auto; cursor: pointer; }
.ct-form-wrap .wpcf7-form .ct-submit,
.ct-form-wrap .wpcf7-form input[type="submit"] {
  display: inline-block;
  padding: 14px 32px;
  background: #558CEE;
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  transition: background 200ms ease;
}
.ct-form-wrap .wpcf7-form .ct-submit:hover,
.ct-form-wrap .wpcf7-form input[type="submit"]:hover { background: #005bb5; }
.ct-form-wrap .wpcf7-form .amb-platforms {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.ct-form-wrap .wpcf7-form .amb-platforms .wpcf7-list-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  transition: border-color 200ms ease;
}
.ct-form-wrap .wpcf7-form .amb-platforms .wpcf7-list-item:hover { border-color: #558CEE; }
.ct-form-wrap .wpcf7-form .wpcf7-acceptance label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #555;
  cursor: pointer;
}
.ct-form-wrap .wpcf7-form .wpcf7-response-output {
  margin: 16px 0 0;
  padding: 12px 16px;
  border-radius: 10px;
  font-size: 14px;
}
.ct-form-wrap .wpcf7-form .wpcf7-not-valid-tip {
  color: #DC2626;
  font-size: 13px;
  margin-top: 4px;
}

/* Footer CF7 newsletter */
.ftr-subscribe.wpcf7-form {
  display: flex;
  gap: 0;
  max-width: 420px;
}
.ftr-subscribe.wpcf7-form p { margin: 0; display: contents; }
.ftr-subscribe.wpcf7-form input[type="email"] {
  flex: 1;
  padding: 12px 16px;
  border: none;
  border-radius: 8px 0 0 8px;
  font-size: 14px;
  color: #333;
}
.ftr-subscribe.wpcf7-form input[type="submit"],
.ftr-subscribe.wpcf7-form .ftr-sub-btn {
  padding: 12px 20px;
  background: #54C79B;
  color: #fff;
  border: none;
  border-radius: 0 8px 8px 0;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: background 200ms ease;
}
.ftr-subscribe.wpcf7-form input[type="submit"]:hover { background: #45b88a; }
.ftr-subscribe.wpcf7-form .wpcf7-response-output { display: none; }
