/**
 * STC SEO pages — MOBILE-FIRST design system.
 * Base styles target mobile; min-width queries enhance to tablet (≥768) and
 * desktop (≥1024). Brand tokens extracted from the client's /conditions page.
 * Injected inline into content (ShowIt strips wp_head), so !important is used
 * to win inside ShowIt's .se-wpt region.
 */

.stc-seo-content, .stc-mobile-cta{
  --purple:rgba(141,85,255,1); --purple-dark:rgba(120,72,217,1);
  --green:rgba(142,203,134,1); --green-dark:rgba(120,190,112,1);
  --red:rgba(235,78,89,1); --blue:rgba(39,138,205,1);
  --gray:rgba(244,244,244,1); --ink:#1f2328; --ink-soft:#565a63; --line:#e4dff0;
  --radius:12px; --radius-lg:20px;
  --shadow:0 4px 6px -1px rgba(0,0,0,.08); --shadow-lg:0 14px 34px rgba(30,15,60,.10);
  --f-head:'atmamediumwebfont','Roboto Condensed',sans-serif;
  --f-body:'Verdana',Arial,sans-serif; --f-btn:'Roboto Condensed','Verdana',sans-serif;
}

/* ══ SHOWIT CONTAINER OVERRIDES (bare pages only — designed pages use print_container_css) ══ */
/* Covers both page-content block and full-width-canvas template variants.
   height:auto overrides JS-set inline heights (ShowIt canvas scales on mobile → huge px value). */
.sib-page-content,
.sib-full-width-canvas { height: auto !important; min-height: 0 !important; }
.sib-page-content .ss-bg,
.sib-full-width-canvas .ss-bg { background: transparent !important; }
.sib-page-content .sc,
.sib-full-width-canvas .sc { width: 100% !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; overflow: visible !important; }
.sie-page-content_0,
.sie-full-width-canvas_0 { position: relative !important; left: 0 !important; top: 0 !important; width: 100% !important; height: auto !important; min-height: 0 !important; transform: none !important; }
.sie-page-content_0-text,
.sie-full-width-canvas_0-text { position: relative !important; width: 100% !important; height: auto !important; min-height: 0 !important; transform: none !important; }

/* ══ BASE = MOBILE ══════════════════════════════════════════════════════ */
.stc-seo-content{ font-family:var(--f-body)!important; color:var(--ink); line-height:1.62; max-width:100%; margin:0 auto; padding:8px 18px 108px; }
.stc-seo-content *{ box-sizing:border-box; }

/* Typography */
.stc-seo-content article h1{ font-family:var(--f-head)!important; color:var(--purple)!important; font-weight:400!important; font-size:30px!important; line-height:1.08!important; text-align:left!important; text-transform:none!important; letter-spacing:0!important; margin:0 0 18px!important; }
.stc-seo-content article h2{ font-family:var(--f-head)!important; color:var(--purple)!important; font-weight:400!important; font-size:24px!important; line-height:1.18!important; text-align:left!important; text-transform:none!important; letter-spacing:0!important; margin:2.5rem 0 .9rem!important; padding-top:1.6rem; border-top:2px solid var(--gray); }
.stc-seo-content article > h2:first-of-type{ border-top:0; padding-top:0; margin-top:1.2rem!important; }
.stc-seo-content article h3{ font-family:var(--f-head)!important; color:var(--red)!important; font-weight:400!important; font-size:19px!important; line-height:1.2!important; text-align:left!important; text-transform:none!important; margin:1.5rem 0 .5rem!important; }
.stc-seo-content article p{ margin:0 0 16px!important; font-size:16px; max-width:100%; }
.stc-seo-content article > h1 + p{ font-size:17.5px!important; color:var(--ink-soft); }
.stc-seo-content article a{ color:var(--purple); font-weight:600; }

/* Breadcrumbs */
.stc-seo-content nav[aria-label="Breadcrumb"]{ margin:0 0 1.4rem!important; font-size:13px; }
.stc-seo-content nav[aria-label="Breadcrumb"] ol{ list-style:none!important; display:flex; flex-wrap:wrap; gap:.45rem; margin:0!important; padding:0!important; }
.stc-seo-content nav[aria-label="Breadcrumb"] li{ margin:0!important; padding:0!important; background:none!important; border:0!important; box-shadow:none!important; display:flex; align-items:center; gap:.45rem; color:var(--ink-soft); }
.stc-seo-content nav[aria-label="Breadcrumb"] li+li::before{ content:"›"; color:#c4b5fd; }
.stc-seo-content nav[aria-label="Breadcrumb"] a{ color:var(--purple)!important; text-decoration:none; font-weight:700; }

/* .btn system */
.stc-seo-content .btn, .stc-mobile-cta .btn{ display:inline-flex!important; align-items:center; justify-content:center; gap:8px; padding:14px 26px; font-family:var(--f-btn)!important; font-size:15px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; text-decoration:none!important; border-radius:100px!important; border:0; cursor:pointer; transition:all .2s ease; }
.stc-seo-content .btn-primary, .stc-mobile-cta .btn-primary{ background:var(--purple)!important; color:#fff!important; box-shadow:0 4px 14px rgba(141,85,255,.3); }
.stc-seo-content .btn-primary:hover, .stc-mobile-cta .btn-primary:hover{ background:var(--purple-dark)!important; }
.stc-seo-content .btn-call, .stc-mobile-cta .btn-call{ background:var(--green)!important; color:#123!important; }
.stc-seo-content .btn-call:hover, .stc-mobile-cta .btn-call:hover{ background:var(--green-dark)!important; }

/* Hero action row (under H1) — stacked full-width on mobile */
.stc-seo-content .stc-hero-actions{ display:flex; flex-direction:column; gap:10px; margin:0 0 2rem; }
.stc-seo-content .stc-hero-actions .btn{ width:100%; padding:15px 20px; }

/* Bulleted lists → cards (single column on mobile) */
.stc-seo-content article ul{ display:grid!important; grid-template-columns:1fr; gap:12px; list-style:none!important; padding:0!important; margin:1.1rem 0 1.9rem!important; }
.stc-seo-content article ul > li{ background:#fff; border:1px solid var(--line); border-top:3px solid var(--purple); border-radius:var(--radius); padding:16px 18px; margin:0!important; font-size:15px; line-height:1.5; box-shadow:var(--shadow); }
.stc-seo-content article ul > li a{ text-decoration:none; font-weight:700; }
.stc-seo-content article ol{ margin:1rem 0 1.9rem!important; padding-left:1.3rem; }
.stc-seo-content article ol > li{ margin-bottom:.55rem; }

/* FAQ (h3 question + answer) as cards */
.stc-seo-content article > h3{ background:var(--gray); border-left:5px solid var(--green); border-radius:var(--radius) var(--radius) 0 0; padding:14px 18px!important; margin:1.5rem 0 0!important; color:var(--ink)!important; }
.stc-seo-content article > h3 + p{ border:1px solid var(--line); border-top:0; border-radius:0 0 var(--radius) var(--radius); padding:15px 18px; margin:0 0 1rem!important; background:#fff; }

/* Form — ONE card (slot is transparent) */
.stc-seo-content .stc-form-slot{ background:none!important; border:0!important; box-shadow:none!important; padding:0!important; margin:2.25rem 0; }
.stc-seo-content .stc-form{ background:linear-gradient(180deg,#fbfaff,var(--gray)); border:1px solid var(--line); border-radius:var(--radius-lg); padding:24px 20px; margin:2.25rem 0; box-shadow:var(--shadow-lg); }
.stc-seo-content .stc-form-slot > .stc-form{ margin:0; }
.stc-seo-content .stc-form h2{ color:var(--purple)!important; text-align:left!important; text-transform:none!important; letter-spacing:0!important; font-size:22px!important; margin:0 0 1rem!important; border:0!important; padding:0!important; }
.stc-seo-content .stc-form label{ display:block; font-weight:700; font-size:13.5px; color:#374151; margin-bottom:14px; }
.stc-seo-content .stc-form input, .stc-seo-content .stc-form textarea{ width:100%; margin-top:6px; padding:13px 14px; border:1px solid #d7d0ea; border-radius:9px; font-size:16px; font-family:var(--f-body); background:#fff; }
.stc-seo-content .stc-form input:focus, .stc-seo-content .stc-form textarea:focus{ outline:none; border-color:var(--purple); box-shadow:0 0 0 3px rgba(141,85,255,.16); }
.stc-seo-content .stc-form button{ width:100%; background:var(--purple)!important; color:#fff!important; border:0; border-radius:100px; padding:16px; font-family:var(--f-btn); font-size:15px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; cursor:pointer; }

/* Inline CTA note band */
.stc-seo-content .stc-cta-inline{ background:var(--gray); border-left:5px solid var(--green); padding:18px 20px; border-radius:var(--radius); margin:2.25rem 0!important; font-size:16px; }

/* Closing CTA band */
.stc-seo-content .stc-cta-band{ margin:3rem 0 0; padding:28px 22px; text-align:center; background:var(--purple); border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); }
.stc-seo-content .stc-cta-band__title{ font-family:var(--f-head)!important; font-size:23px!important; line-height:1.2; margin:0 0 18px!important; color:#fff!important; text-align:center!important; }
.stc-seo-content .stc-cta-band .stc-hero-actions{ margin:0; }
.stc-seo-content .stc-cta-band .btn-primary{ background:#fff!important; color:var(--purple)!important; }

/* Mobile sticky CTA bar (visible on mobile only) */
.stc-mobile-cta{ display:flex; gap:10px; position:fixed; left:0; right:0; bottom:0; z-index:99999; padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px)); background:#fff; border-top:1px solid var(--line); box-shadow:0 -3px 16px rgba(0,0,0,.12); }
.stc-mobile-cta .btn{ flex:1; padding:15px 6px; font-size:13.5px; letter-spacing:.03em; }

/* ══ TABLET ≥768px ══════════════════════════════════════════════════════ */
@media (min-width:768px){
  .stc-seo-content{ max-width:760px; padding:14px 24px 56px; line-height:1.66; }
  .stc-seo-content article h1{ font-size:42px!important; margin:0 0 22px!important; }
  .stc-seo-content article h2{ font-size:28px!important; margin:3rem 0 1.1rem!important; padding-top:2rem; }
  .stc-seo-content article h3{ font-size:20px!important; }
  .stc-seo-content article p{ font-size:16.5px; }
  .stc-seo-content article > h1 + p{ font-size:19px!important; }
  .stc-seo-content .stc-hero-actions{ flex-direction:row; flex-wrap:wrap; }
  .stc-seo-content .stc-hero-actions .btn{ width:auto; }
  .stc-seo-content article ul{ grid-template-columns:repeat(2,1fr); gap:15px; }
  .stc-seo-content .stc-form{ padding:30px 32px; }
  .stc-seo-content .stc-form button{ width:auto; }
  .stc-seo-content .stc-cta-band{ padding:36px; }
  .stc-mobile-cta{ display:none; }        /* desktop/tablet use inline CTAs */
}

/* ══ DESKTOP ≥1024px ════════════════════════════════════════════════════ */
@media (min-width:1024px){
  .stc-seo-content{ max-width:1120px; padding:16px 24px 64px; }
  .stc-seo-content article > h1, .stc-seo-content article > p,
  .stc-seo-content article > h2, .stc-seo-content article > h3{ max-width:820px; }
  .stc-seo-content article h1{ font-size:50px!important; }
  .stc-seo-content article h2{ font-size:32px!important; }
  .stc-seo-content article ul{ grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
  .stc-seo-content article ul > li{ transition:transform .15s ease, box-shadow .15s ease; }
  .stc-seo-content article ul > li:hover{ transform:translateY(-2px); box-shadow:var(--shadow-lg); }
  .stc-seo-content .stc-cta-band{ padding:44px; }
  .stc-seo-content .stc-cta-band__title{ font-size:28px!important; }
  .stc-team-grid{ grid-template-columns:repeat(4,1fr); }
  .stc-team-photo{ width:110px; height:110px; }
}

/* ══ TEAM SECTION (bare hub/index pages) ══════════════════════════════════ */
.stc-seo-content .stc-team-section{ margin:3rem 0 2rem; }
.stc-seo-content .stc-section-header{ text-align:center; margin-bottom:1.75rem; }
.stc-seo-content .stc-section-header h2{ font-family:var(--f-head)!important; color:var(--purple)!important; font-size:26px!important; border-top:0!important; padding-top:0!important; margin:0 0 .5rem!important; }
.stc-seo-content .stc-section-header p{ color:var(--ink-soft); font-size:15px; margin:0!important; }
.stc-team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.stc-team-member{ text-align:center; }
.stc-team-photo{ width:90px; height:90px; border-radius:50%; object-fit:cover; border:3px solid var(--line); display:block; margin:0 auto 10px; }
.stc-team-member h4{ font-family:var(--f-head)!important; font-size:15px!important; color:var(--ink)!important; margin:0 0 3px!important; }
.stc-team-member p{ font-size:12.5px; color:var(--ink-soft); margin:0!important; }

@media (min-width:1024px){
  .stc-team-grid{ grid-template-columns:repeat(7,1fr); gap:16px; }
  .stc-team-photo{ width:120px; height:120px; }
}
