/* Visual review: readable text, a tighter rhythm, and real marketplace previews. */
.hero-payment-reassurance { margin-top: 18px; padding: 12px 15px; border-left: 3px solid var(--green); border-radius: 0 10px 10px 0; background: #edf5e9; max-width: 590px; }
.hero-payment-reassurance strong { display: block; color: var(--navy); font-size: 16px; line-height: 1.3; }
.hero-payment-reassurance p { margin: 5px 0; color: #52657d; font-size: 13px; line-height: 1.45; }
.hero-payment-reassurance > span { color: #237b32; font-size: 12px; font-weight: 600; line-height: 1.45; display:block; }
.hero-tagline { margin: 14px 0 0; color: var(--navy); font-size: 18px; font-weight: 700; line-height: 1.4; }
.hero-actions { gap: 14px 20px; }
.hero-actions .button { min-height: 50px; }
.contact-methods { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.contact-method-hint { margin-top:-7px; }
.contact-form > label > span { color:#63758c; font-weight:400; }
.contact-form [aria-invalid="true"] { border-color:#b42318; }
.hero-proof { margin-top:24px; }
.starter-inclusions { margin: 0; padding-left: 22px; color: #fff; font-size: 15px; line-height: 1.55; }
.starter-inclusions li + li { margin-top: 10px; }
.starter-inclusions li::marker { color: var(--lime); }
.pricing-details h3 { margin: 0; font-size: 22px; }
.pricing-card .pricing-note { font-size: 14px; line-height: 1.6; color: #c4d6e9; }
.starter-extras { max-width: 850px; margin: 24px auto 0; color: var(--muted); font-size: 15px; line-height: 1.65; text-align: center; }
:root { --green: #237b32; --muted: #52657d; }
:focus-visible { outline: 3px solid #1257a6; outline-offset: 5px; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 50; background: white; padding: 12px 20px; border-radius: 6px; }
.skip-link:focus { top: 12px; }
section[id], main[id] { scroll-margin-top: 104px; }
body > .site-header { position: sticky; top: 0; z-index: 30; width: 100%; padding-inline: max(24px, calc((100% - 1240px) / 2)); background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 3px 14px rgba(8,43,87,.05); }
.menu-toggle { min-height: 44px; min-width: 64px; border-radius: 6px; }
.brand { flex-shrink: 0; }
.stc-brand-mark { display: block; width: 76px; height: 44px; object-fit: cover; border-radius: 7px; flex-shrink: 0; }
.brand > span:last-child { min-width: 0; }
.brand small { font-size: 10px; letter-spacing: .5px; text-transform: none; margin-top: 7px; }
@media (min-width: 651px) and (max-width: 1100px) {
  .menu-toggle { display: block; }
  #main-nav { display: none; position: absolute; top: 80px; left: 24px; right: 24px; padding: 18px; background: white; box-shadow: var(--shadow); flex-direction: column; align-items: stretch; max-height: calc(100dvh - 96px); overflow-y: auto; }
  #main-nav.open { display: flex; }
  #main-nav a { display: flex; align-items: center; min-height: 44px; font-size: 14px; }
}
.back-to-top { position: fixed; left: 24px; bottom: 23px; z-index: 10; padding: 11px 16px; min-height: 44px; border: 1px solid var(--line); border-radius: 24px; background: white; color: var(--navy); box-shadow: 0 4px 18px rgba(8,43,87,.12); font-weight: 600; }
@media (max-width: 650px) {
  body > .site-header { padding-inline: 16px; }
  .brand { min-width: 0; flex-shrink: 1; }
  .brand strong { font-size: 15px; white-space: normal; line-height: 1.15; }
  .menu-toggle { flex-shrink: 0; }
  .stc-brand-mark { width: 52px; height: 38px; }
  .brand { gap: 8px; }
  section[id], main[id] { scroll-margin-top: 88px; }
  .main-nav { max-height: calc(100dvh - 84px); overflow-y: auto; }
  .main-nav a { display: flex; align-items: center; min-height: 44px; }
  .back-to-top { left: 16px; bottom: 16px; }
  .hero { min-height:0; padding:24px 0 34px; gap:18px; }
  .hero h1 { font-size:clamp(36px, 9.8vw, 46px); line-height:1.04; letter-spacing:-1.6px; }
  .hero-tagline { margin-top:10px; font-size:16px; }
  .hero-lede { margin:10px 0 15px; font-size:16px; line-height:1.45; }
  .hero-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .hero-actions .button { grid-column:1/-1; width:100%; min-height:50px; }
  .hero-actions .text-link { display:flex; align-items:center; justify-content:center; min-height:44px; padding:8px 4px; }
  .hero-payment-reassurance { margin-top:12px; padding:10px 12px; }
  .hero-payment-reassurance strong { font-size:15px; }
  .hero-payment-reassurance p { font-size:12px; }
  .hero-payment-reassurance > span { font-size:11px; }
  .hero-proof { margin-top:17px; gap:8px; }
  .hero-proof div { padding-left:7px; }
  .hero-proof strong { font-size:13px; }
  .hero-proof span { font-size:10px; }
  .contact-methods { grid-template-columns:1fr; gap:10px; }
  .contact-form { padding:22px 18px; }
  .contact-form > button { width:100%; min-height:50px; }
}
.hero { gap: 38px; padding: 48px 0 62px; }
.hero h1 { font-size: clamp(42px, 4.5vw, 64px); letter-spacing: -2.5px; line-height: 1.09; }
.hero-lede { font-size: 18px; }
.hero-proof { margin-top: 38px; gap: 22px; }
.hero-proof span { font-size: 12px; }
.hero-proof strong { font-size: 18px; }
.hero-visual { min-height: 450px; }
.float-card-top { top: 0; right: 0; }
.float-card-bottom { bottom: 0; left: 0; }
.float-card small { color: #52657d; font-size: 12px; }
.float-card strong { font-size: 13px; }
.mini-icon { flex-shrink: 0; }
.content-section, .process-section, .contact-section, .about-section { padding-top: 78px; padding-bottom: 78px; }
.examples-section { padding-top: 28px; }
.section-heading h2, .about-copy h2, .contact-section h2 { font-size: clamp(32px, 3.5vw, 44px); letter-spacing: -1.5px; line-height: 1.15; }
.service-grid { margin-top: 32px; gap: 18px; }
.service-card { border-radius: 10px; min-height: 330px; padding: 25px 22px; }
.service-card p, .section-intro, .process-grid p, .contact-lede, .portal-status, .chat-panel-note { color: #52657d; }
.service-card p, .process-grid p { font-size: 15px; }
.service-card a { padding-top: 12px; font-size: 14px; }
.service-number { color: #5f7289; }
.service-icon { display: flex; margin: 23px 0 20px; }
.service-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.example-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.example-card { padding: 0; border-radius: 12px; overflow: hidden; }
.example-image { aspect-ratio: 16 / 10; background: #eef3f7; overflow: hidden; display: grid; place-items: center; }
.example-image img { width: 100%; height: 100%; display: block; object-fit: contain; transition: transform .2s; }
.example-card:hover img { transform: scale(1.025); }
.example-meta { padding: 22px; gap: 9px; }
.example-meta span { font-size: 11px; font-weight: 700; }
.example-meta strong { font-size: 20px; line-height: 1.25; }
.example-meta p { font-size: 14px; line-height: 1.55; color: #52657d; margin: 0; }
.example-meta small { font-size: 12px; color: #52657d; margin-top: 8px; }
.split-heading > .text-link { flex-shrink: 0; }
.about-layout { grid-template-columns: .65fr 1.35fr; gap: 60px; }
.about-badge { margin-top: 30px; width: 128px; height: 128px; box-shadow: 10px 10px 0 #cde3bf; }
.about-name { font: 600 22px 'Space Grotesk', sans-serif; color: var(--navy); margin-top: 28px; }
.about-name span { display: block; margin-top: 8px; font: 14px/1.6 'DM Sans', sans-serif; color: #45634d; }
.about-copy p { color: #45634d; font-size: 16px; }
.pricing-card { border-radius: 14px; overflow: hidden; }
.pricing-main .eyebrow { color: var(--lime); }
.pricing-main, .pricing-details { padding: 40px; }
.pricing-main h2 { font-size: 36px; }
.price-line { gap: 12px; }
.price-line strong { letter-spacing: -2px; }
.process-grid { gap: 24px; margin-top: 34px; }
.contact-layout { gap: 64px; align-items: start; }
.contact-form { border-radius: 12px; }
.contact-form input, .contact-form textarea { font-size: 16px; border-radius: 5px; border-color: #a9bacc; }
.contact-form label { font-size: 14px; }
.contact-form small { color: #52657d; font-size: 13px; }
.contact-form button:disabled { opacity: .65; cursor: wait; }
.portal-section { padding: 64px 0; }
.portal-section h2 { font-size: 36px; line-height: 1.15; }
.portal-preview { border-radius: 12px; }
.portal-preview-row small { font-size: 10px; color: #52657d; }
.portal-preview-row strong { font-size: 14px; }
.portal-preview-row em, .portal-lock { font-size: 12px; color: #52657d; }
.chat-panel { border-radius: 12px; overflow: hidden; }
.chat-panel .button { margin-bottom: 12px; }
.chat-client-link { display: block; text-align: center; margin: 0 18px 20px; font-size: 13px; color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.site-footer { padding-bottom: 85px; }
@media (max-width: 1000px) {
  .main-nav { gap: 18px; }
  .hero-proof { flex-wrap: wrap; }
  .example-meta { padding: 17px; }
  .example-meta strong { font-size: 18px; }
  .split-heading { align-items: start; flex-direction: column; }
}
@media (min-width: 651px) and (max-width: 900px) {
  .hero { grid-template-columns: 1.1fr .9fr; gap: 26px; }
  .hero h1 { font-size: 43px; }
  .hero-visual { min-height: 390px; }
  .terminal-body { padding: 32px 18px; font-size: 14px; }
  .terminal-body i { margin-right: 8px; }
  .float-card { max-width: 210px; }
  .main-nav { gap: 12px; font-size: 12px; }
  .nav-cta { padding: 9px 12px; }
  .portal-layout { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 650px) {
  .hero { padding: 34px 0 44px; gap: 30px; }
  .hero h1 { font-size: clamp(37px, 10.5vw, 50px); letter-spacing: -1.8px; }
  .eyebrow { font-size: 11px; letter-spacing: 1.3px; }
  .hero-actions { gap: 18px; }
  .hero-proof { gap: 10px; margin-top: 30px; }
  .hero-proof strong { font-size: 15px; }
  .hero-proof span { font-size: 11px; }
  .hero-proof div { padding-left: 8px; min-width: 0; }
  .hero-visual { min-height: 315px; margin: 0 8px; }
  .float-card { transform: none; padding: 10px 12px; max-width: 200px; }
  .float-card small { font-size: 10px; }
  .float-card strong { font-size: 11px; }
  .orb-one { width: 230px; height: 230px; }
  .terminal-card { transform: rotate(1deg); }
  .terminal-body { font-size: 14px; padding: 27px 20px; }
  .terminal-line { margin-top: 18px; padding-top: 15px; }
  .content-section, .process-section, .contact-section, .about-section { padding-top: 52px; padding-bottom: 52px; }
  .examples-section { padding-top: 4px; }
  .service-grid { gap: 14px; margin-top: 26px; }
  .service-card { min-height: 0; }
  .service-icon { margin: 17px 0; }
  .example-grid { grid-template-columns: 1fr; }
  .example-meta { padding: 22px; }
  .example-meta strong { font-size: 21px; }
  .about-layout { grid-template-columns: 1fr; gap: 28px; }
  .about-label { display: grid; grid-template-columns: 88px 1fr; gap: 0 24px; align-items: center; }
  .about-label .eyebrow { grid-column: 1 / -1; }
  .about-badge { width: 82px; height: 82px; font-size: 30px; margin: 8px 0 0; box-shadow: 6px 6px 0 #cde3bf; }
  .about-name { margin: 12px 0 0; }
  .pricing-main, .pricing-details { padding: 28px 24px; }
  .pricing-main h2, .portal-section h2 { font-size: 32px; }
  .process-grid { gap: 24px; }
  .contact-layout { gap: 28px; }
  .contact-form { padding: 24px 20px; }
  .portal-section { padding: 52px 0; }
  .portal-preview-row { grid-template-columns: 34px 1fr auto; }
  .portal-preview-row em { grid-column: 2 / -1; text-align: left; }
  .chat-launcher { font-size: 14px; }
}
.capabilities-section { padding: 68px 0; background: #edf4f0; border-block: 1px solid #dce7df; }
.capabilities-section + .examples-section { padding-top: 78px; }
.capabilities-section .section-intro { margin-bottom: 30px; max-width: 720px; }
.capability-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.capability-phone-app { grid-column: 1 / -1; }
.capability-card { padding: 25px; border: 1px solid #d5e1da; border-radius: 10px; background: #fff; display: flex; flex-direction: column; }
.capability-label { color: var(--green); font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.capability-card h3 { font: 600 22px/1.25 'Space Grotesk', sans-serif; color: var(--navy); margin: 12px 0 10px; }
.capability-card p { color: #52657d; font-size: 15px; margin: 0 0 20px; }
.capability-card small { margin-top: auto; padding-top: 15px; border-top: 1px solid #e2e9e5; color: #52657d; font-size: 12px; line-height: 1.5; }
.hero-contact-note { margin:12px 0; font-size:14px; color:var(--muted); }
.capability-details { margin-top: 24px; border-bottom: 1px solid #cbdad0; padding-bottom: 20px; }
.capability-details summary { cursor: pointer; color: var(--navy); font-weight: 700; padding: 8px 0; }
.capability-details p { color: #52657d; max-width: 850px; font-size: 15px; margin: 8px 0; }
.capability-next { display: flex; align-items: center; gap: 35px; justify-content: space-between; margin-top: 24px; }
.capability-next p { color: #52657d; max-width: 650px; font-size: 14px; margin: 0; }
.capability-next .button { flex-shrink: 0; }
@media (max-width: 900px) { .capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .capability-next { align-items: start; flex-direction: column; gap: 20px; } }
@media (max-width: 650px) { .capabilities-section { padding: 52px 0; } .capabilities-section + .examples-section { padding-top: 52px; } .capability-grid { grid-template-columns: 1fr; gap: 14px; } .capability-card { padding: 23px; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}