/* Scoped additions: same palette, fonts, cards and buttons as the existing site. */
.saas-home #intro .intro-info, .saas-page #intro .intro-info { width: 100%; max-width: 850px; float: none; }
.saas-home #intro h1, .saas-page #intro h1 { color: var(--text-main); font-size: clamp(2rem, 3vw, 2.5rem); font-weight: 600; line-height: 1.2; margin-bottom: 30px; }
.saas-home #intro h1 span, .saas-page #intro h1 span { color: var(--secondary-color); }
.saas-home #intro .mt-4 { display: flex; flex-wrap: wrap; gap: 16px; }
.saas-section .section-header h2 { text-align: center; font-size: 36px; }
.saas-card { align-items: flex-start; overflow-wrap: anywhere; }
.saas-card h3 { font-size: 25px; margin-top: 20px; }
.saas-card p { color: var(--text-muted); }
.saas-icon { color: var(--secondary-color); font-size: 36px; margin-bottom: 20px; }
.saas-status { display: inline-block; border: 1px solid var(--text-light); border-radius: 30px; padding: 5px 14px; color: var(--text-main); font-size: 14px; }
.saas-available { background: var(--secondary-color); color: var(--bg-dark); border-color: var(--secondary-color); font-weight: 600; }
.saas-featured { border: 1px solid var(--secondary-color) !important; }
.saas-card .saas-sector { color: var(--tertiary-color); font-size: 14px; }
.saas-card .saas-proof { color: var(--secondary-color); }
.saas-model { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 0; list-style: none; counter-reset: model; }
.saas-model li { counter-increment: model; padding: 20px; background: var(--bg-soft); border-radius: 12px; }
.saas-model li::before { content: counter(model) " → "; color: var(--secondary-color); font-weight: 700; }
.saas-tech { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }
.saas-section [id] { scroll-margin-top: 100px; }
.saas-home a:focus-visible, .saas-page a:focus-visible { outline: 2px solid var(--secondary-color); outline-offset: 4px; }
@media (min-width: 992px) and (max-width: 1199px) { .saas-home .main-nav a, .saas-page .main-nav a { padding-left: 9px; padding-right: 9px; } }
@media (max-width: 767px) {
 .saas-home #intro .intro-info, .saas-page #intro .intro-info { padding: 24px !important; }
 .saas-model, .saas-tech { grid-template-columns: 1fr; }
 .saas-section .section-header h2 { font-size: 30px; }
 .saas-home #intro .mt-4 a { width: 100%; text-align: center; }
}
