body.page .smo-faq { margin: 0 -15px; background: var(--smoc-paper); color: var(--smoc-navy); }
.smo-faq, .smo-faq * { box-sizing: border-box; }
.smo-faq-shell { width: min(100% - 64px, 1200px); margin-inline: auto; }
.smo-faq h1, .smo-faq h2, .smo-faq h3, .smo-faq p { margin-top: 0; }
.smo-faq h1, .smo-faq h2, .smo-faq h3 { color: var(--smoc-navy); font-weight: 800; text-wrap: balance; }
.smo-faq .smo-contact-eyebrow { margin-bottom: 11px !important; color: var(--smoc-teal); font-size: var(--smo-presentation-eyebrow); font-weight: 700; letter-spacing: .12em; line-height: 1.4; text-transform: uppercase; }
.smo-faq-eyebrow, .smo-faq-eyebrow p { margin-bottom: 11px !important; color: var(--smoc-teal); font-size: var(--smo-presentation-eyebrow); font-weight: 700; letter-spacing: .12em; line-height: 1.4; text-transform: uppercase; }

.smo-faq-hero { display: grid; width: min(100% - 64px, 1200px); grid-template-columns: minmax(0, .9fr) minmax(470px, 1.1fr); align-items: center; gap: 78px; margin-inline: auto; padding: 96px 0 72px; }
.smo-faq-hero__copy { align-self: center; }
.smo-faq-hero__copy h1, .smo-faq-hero__copy .elementor-heading-title { max-width: 690px; margin-bottom: 28px; color: var(--smoc-navy); font-size: var(--smo-presentation-hero); font-weight: 800; letter-spacing: -.045em; line-height: 1.09; text-wrap: balance; }
.smo-faq-hero__highlight { display: block; color: var(--smoc-teal); }
.smo-faq .smo-faq-hero__lead { max-width: 490px; margin-bottom: 0 !important; color: var(--smoc-muted) !important; font-size: var(--smo-presentation-copy) !important; font-weight: 400 !important; letter-spacing: normal !important; line-height: 1.7 !important; text-transform: none !important; }
.smo-faq-hero__visual { display: grid; min-height: 390px; margin: 0; place-items: center; overflow: hidden; border: 1px solid var(--smoc-line); border-radius: 22px; background: var(--smoc-white); }
.smo-faq-hero__visual img { display: block; width: 100%; height: 100%; min-height: 390px; object-fit: contain; }

.smo-faq-list { padding: 12px 0 72px; }
.smo-faq-group { margin-bottom: 14px; overflow: hidden; border: 1px solid var(--smoc-line); border-radius: 14px; background: var(--smoc-white); }
.smo-faq .smo-faq-group__heading { display: grid !important; width: 100%; grid-template-columns: 58px minmax(0, 1fr); gap: 20px; align-items: center; padding: 22px 24px 12px; }
.smo-faq .smo-faq-group__heading > .elementor-element { min-width: 0; }
/* Elementor may drop Advanced > CSS Classes on imported widgets. Position the
   three direct widgets by structure as well, so its width controls cannot
   force the summary back underneath the number. */
.smo-faq .smo-faq-group__heading > :nth-child(1), .smo-faq .smo-faq-group__number-wrap { grid-column: 1 !important; grid-row: 1 / span 2 !important; }
.smo-faq .smo-faq-group__heading > :nth-child(2), .smo-faq .smo-faq-group__title { grid-column: 2 !important; grid-row: 1 !important; }
.smo-faq .smo-faq-group__heading > :nth-child(3), .smo-faq .smo-faq-group__summary { grid-column: 2 !important; grid-row: 2 !important; width: 100% !important; }
.smo-faq-group__number { display: grid; width: 56px; height: 56px; place-items: center; border-radius: 12px; background: var(--smoc-mint); color: var(--smoc-ink); font-size: 1rem; font-weight: 800; }
.smo-faq-group__heading h2, .smo-faq-group__heading .elementor-heading-title { margin: 0 0 4px; color: var(--smoc-navy); font-size: clamp(22px, 2.25vw, 28px); font-weight: 800; letter-spacing: -.035em; line-height: 1.18; }
.smo-faq-group__heading p { margin: 0; color: var(--smoc-muted); font-size: 1rem; line-height: 1.5; }
/* Question cards: target Elementor's native accordion markup. Importing a
   template does not reliably preserve a widget-level custom CSS class. */
.smo-faq-group .elementor-accordion, .smo-faq-accordion { display: grid; gap: 8px; padding: 0 24px 16px; }
.smo-faq-group .elementor-accordion-item, .smo-faq-accordion .elementor-accordion-item { overflow: hidden; border: 1px solid var(--smoc-line) !important; border-radius: 10px; background: var(--smoc-white); transition: border-color .18s ease, background-color .18s ease; }
.smo-faq-group .elementor-accordion-item:hover, .smo-faq-accordion .elementor-accordion-item:hover { border-color: var(--smoc-teal) !important; }
.smo-faq-group .elementor-accordion .elementor-tab-title, .smo-faq-accordion .elementor-tab-title { display: flex !important; min-height: 62px; align-items: center; padding: 15px 18px; border: 0 !important; background: transparent; color: var(--smoc-navy); font-size: 1.05rem; font-weight: 800; line-height: 1.35; }
.smo-faq-group .elementor-accordion .elementor-tab-title .elementor-accordion-title, .smo-faq-accordion .elementor-tab-title .elementor-accordion-title { flex: 1 1 auto; min-width: 0; }
.smo-faq-group .elementor-accordion .elementor-tab-title .elementor-accordion-icon, .smo-faq-accordion .elementor-tab-title .elementor-accordion-icon { display: grid !important; width: 30px; height: 30px; flex: 0 0 30px; order: 2; float: none !important; place-items: center; margin: 0 0 0 18px !important; border: 1px solid var(--smoc-line); border-radius: 8px; background: var(--smoc-mint); color: var(--smoc-teal); font-size: .76rem; line-height: 1; }
.smo-faq-group .elementor-accordion .elementor-tab-title.elementor-active, .smo-faq-accordion .elementor-tab-title.elementor-active { border-bottom: 1px solid var(--smoc-line) !important; background: var(--smoc-mint); }
.smo-faq-group .elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-icon, .smo-faq-accordion .elementor-tab-title.elementor-active .elementor-accordion-icon { border-color: var(--smoc-teal); background: var(--smoc-teal); color: var(--smoc-white); }
.smo-faq-group .elementor-accordion .elementor-tab-title:focus-visible, .smo-faq-accordion .elementor-tab-title:focus-visible { outline: 2px solid var(--smoc-teal); outline-offset: -2px; }
.smo-faq-group .elementor-accordion .elementor-tab-content, .smo-faq-accordion .elementor-tab-content { position: relative; padding: 18px 58px 24px 43px; border: 0 !important; background: var(--smoc-white); color: var(--smoc-muted); font-size: 1rem; line-height: 1.65; }
.smo-faq-group .elementor-accordion .elementor-tab-content::before, .smo-faq-accordion .elementor-tab-content::before { position: absolute; top: 21px; bottom: 27px; left: 20px; width: 3px; border-radius: 3px; background: var(--smoc-teal); content: ""; }
.smo-faq-group .elementor-accordion .elementor-tab-content p, .smo-faq-accordion .elementor-tab-content p { margin-bottom: 14px; }
.smo-faq-group .elementor-accordion .elementor-tab-content p:last-child, .smo-faq-accordion .elementor-tab-content p:last-child { margin-bottom: 0; }

.smo-faq .smo-faq-cta { display: grid !important; width: min(100% - 64px, 1200px); min-height: 0 !important; margin: 0 auto 84px; padding: 34px 42px; border: 1px solid var(--smoc-line); border-radius: 16px; background: var(--smoc-mint); }
/* Elementor adds this inner wrapper around the CTA content. It must occupy
   the whole card; otherwise its inherited max-width squeezes the button. */
.smo-faq .smo-faq-cta > .e-con-inner { display: grid !important; width: 100% !important; max-width: none !important; grid-template-columns: minmax(0, 1fr) minmax(250px, 280px); align-items: center !important; column-gap: 44px; row-gap: 24px; }
.smo-faq .smo-faq-cta > .elementor-element, .smo-faq .smo-faq-cta > .e-con-inner > .elementor-element { width: auto !important; min-width: 0; }
.smo-faq-cta h2, .smo-faq-cta .elementor-heading-title { margin-bottom: 9px; color: var(--smoc-navy); font-size: var(--smo-presentation-section); font-weight: 800; letter-spacing: -.035em; line-height: 1.18; }
.smo-faq-cta p { max-width: 560px; margin-bottom: 0; color: var(--smoc-muted); font-size: 18px; line-height: 1.55; }
.smo-faq .smo-faq-cta .elementor-widget-button { width: 100% !important; align-self: center !important; justify-self: end; }
.smo-faq .smo-faq-cta .elementor-button-wrapper { display: block; width: 100%; margin: 0; }
.smo-faq-cta .elementor-button { width: 100%; min-width: 250px; padding: 16px 24px; border: 1px solid var(--smoc-teal); border-radius: 10px; background: var(--smoc-teal); color: var(--smoc-white); font-weight: 700; white-space: nowrap; }
.smo-faq-cta .elementor-button:hover, .smo-faq-cta .elementor-button:focus { border-color: var(--smoc-ink); background: var(--smoc-ink); color: var(--smoc-white); }

@media (max-width: 1024px) {
  .smo-faq-hero { padding: 68px 0 52px; }
  .smo-faq-hero { grid-template-columns: 1fr; gap: 34px; }
  .smo-faq-hero__visual { max-width: 720px; min-height: 340px; margin-inline: auto; }
  .smo-faq-hero__visual img { min-height: 340px; }
}
@media (max-width: 767px) {
  body.page .smo-faq { margin: 0 -10px; }
  .smo-faq-shell, .smo-faq-hero, .smo-faq-cta { width: min(100% - 32px, 1200px); }
  .smo-faq-hero { padding: 48px 0 38px; }
  .smo-faq-hero__copy h1, .smo-faq-hero__copy .elementor-heading-title { margin-bottom: 18px; font-size: clamp(40px, 11vw, 52px); line-height: 1.09; }
  .smo-faq .smo-faq-hero__lead { font-size: 18px !important; }
  .smo-faq-hero__visual { min-height: 275px; border-radius: 18px; }
  .smo-faq-hero__visual img { min-height: 275px; }
  .smo-faq-list { padding-bottom: 44px; }
  .smo-faq .smo-faq-group__heading { grid-template-columns: 44px minmax(0, 1fr); gap: 14px; padding: 19px 18px 10px; }
  .smo-faq-group__number { width: 44px; height: 44px; border-radius: 10px; font-size: .9rem; }
  .smo-faq-group__heading h2, .smo-faq-group__heading .elementor-heading-title { font-size: 1.25rem; }
  .smo-faq-group__heading p { font-size: .92rem; }
  .smo-faq-group .elementor-accordion, .smo-faq-accordion { gap: 7px; padding: 0 18px 10px; }
  .smo-faq-group .elementor-accordion .elementor-tab-title, .smo-faq-accordion .elementor-tab-title { min-height: 56px; padding: 13px 14px; font-size: 1rem; }
  .smo-faq-group .elementor-accordion .elementor-tab-title .elementor-accordion-icon, .smo-faq-accordion .elementor-tab-title .elementor-accordion-icon { width: 28px; height: 28px; flex-basis: 28px; margin-left: 12px !important; }
  .smo-faq-group .elementor-accordion .elementor-tab-content, .smo-faq-accordion .elementor-tab-content { padding: 15px 16px 20px 35px; font-size: .96rem; }
  .smo-faq-group .elementor-accordion .elementor-tab-content::before, .smo-faq-accordion .elementor-tab-content::before { top: 18px; bottom: 22px; left: 16px; }
  .smo-faq .smo-faq-cta { width: min(100% - 32px, 1200px); margin-bottom: 48px; padding: 27px 22px; }
  .smo-faq .smo-faq-cta > .e-con-inner { grid-template-columns: 1fr; row-gap: 18px; }
  .smo-faq-cta .elementor-button { min-width: 0; }
}
