/* Home page service finder — the typography follows the About page. */
.home-solution-finder { scroll-margin-top: 110px; }
.home-solution-finder .sf-launch { align-self: flex-start; margin-top: 2rem; }
.sf-launch-note { margin: 1rem 0 0; color: rgba(255, 255, 255, .62); font-size: 14px; line-height: 1.6; }
#ajanlatkeres .package-selector { scroll-margin-top: 120px; }
html.sf-dialog-open { overflow: hidden !important; }

.sf-modal { --bs-modal-margin: 24px; color: #172a3a; }
.sf-modal [hidden] { display: none !important; }
.sf-modal .modal-dialog { max-width: 820px; margin: 24px auto; }
.sf-modal .modal-content { border: 1px solid #d5dce1; border-radius: 28px; overflow: hidden; }
.sf-modal .modal-body { padding: 44px; overscroll-behavior: contain; scroll-padding-top: 44px; }
.sf-close { position: absolute; top: 18px; right: 18px; z-index: 2; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; color: #172a3a; border: 1px solid #a8b5be; border-radius: 50%; background: #fff; }
.sf-close:hover { color: #fff; background: #172a3a; }
.sf-modal :focus-visible { outline: 3px solid #607e94; outline-offset: 4px; }
.sf-kicker { margin: 0 52px 20px 0; color: #5f6e79; font-size: 12px; font-weight: 800; letter-spacing: .12em; }
.sf-progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-bottom: 12px; }
.sf-progress span { height: 3px; background: #e1e5e8; transition: background .2s; }
.sf-progress span.is-complete { background: #172a3a; }
.sf-step { margin: 0 0 18px; color: #5f6e79; font-size: 13px; font-weight: 600; }
.sf-title { margin: 0 0 12px; font-size: clamp(28px, 3.5vw, 42px); font-weight: 800; line-height: 1.15; letter-spacing: -.01em; }
.sf-description { margin: 0 0 26px; color: #5f6e79; font-size: 16px; line-height: 1.6; }
.sf-modal fieldset { min-width: 0; padding: 0; margin: 0; border: 0; }
.sf-options { display: grid; gap: 12px; }
.sf-option { position: relative; display: block; cursor: pointer; }
.sf-option input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; clip-path: inset(50%); }
.sf-option-surface { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 16px; align-items: center; min-height: 88px; padding: 18px 20px; border: 1px solid #ccd4da; border-radius: 14px; background: #fff; transition: border-color .2s, background .2s; }
.sf-option-surface > span:last-child { display: grid; gap: 4px; }
.sf-option strong { font-size: 17px; font-weight: 700; line-height: 1.4; }
.sf-option small { color: #5f6e79; font-size: 14px; line-height: 1.5; }
.sf-option-marker { display: block; width: 28px; height: 28px; border: 1px solid #8c9ca8; border-radius: 50%; }
.sf-option:hover .sf-option-surface { border-color: #172a3a; }
.sf-option input:checked + .sf-option-surface { border-color: #172a3a; background: #f1f2f3; }
.sf-option input:checked + .sf-option-surface .sf-option-marker { border-color: #000; background: #000 var(--movento-checkmark) center / 80% no-repeat; }
.sf-option input:focus-visible + .sf-option-surface { outline: 3px solid #607e94; outline-offset: 4px; }
.sf-error { margin: 16px 0 0; color: #a3252c; font-size: 14px; }
.sf-actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 26px; }
.sf-modal .btn-movento { min-height: 58px; padding: 16px 28px; font-size: 17px; line-height: 1.4; }
.sf-next { margin-left: auto; min-width: 190px; }
.sf-back, .sf-restart { padding: 10px 0; color: #172a3a; background: transparent; border: 0; font-size: 15px; font-weight: 600; text-decoration: underline; text-underline-offset: 5px; }
.sf-result-card { padding: 28px; border: 1px solid #d5dce1; border-radius: 18px; background: #f1f2f3; }
.sf-result-label { margin: 0 0 12px; color: #5f6e79; font-size: 13px; }
.sf-result-card h3 { margin: 0 0 16px; font-size: 27px; line-height: 1.25; font-weight: 800; }
.sf-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; padding-top: 18px; margin-top: 22px; border-top: 1px solid #d5dce1; }
.sf-price strong { font-size: 25px; font-weight: 800; }
.sf-price span { color: #5f6e79; font-size: 14px; }
.sf-result-card > p:not(.sf-result-label) { margin-bottom: 0; color: #5f6e79; font-size: 16px; line-height: 1.6; }
.sf-result-note { margin: 18px 0 0; color: #5f6e79; font-size: 14px; line-height: 1.6; }
@media (max-width: 991.98px) {
  .home-solution-finder .about-hero-copy { min-height: 0; }
  .home-solution-finder .about-portrait { min-height: 0; }
  .home-solution-finder .about-portrait-image { height: auto; aspect-ratio: 4 / 3; }
}
@media (max-width: 867.98px) {
  .sf-modal { --bs-modal-margin: 16px; }
  .sf-modal .modal-dialog { margin: 16px; }
}
@media (max-width: 575.98px) {
  .home-solution-finder .sf-launch { width: 100%; max-width: none; }
  .sf-modal { --bs-modal-margin: 12px; }
  .sf-modal .modal-dialog { margin: 12px; }
  .sf-modal .modal-content { border-radius: 22px; }
  .sf-modal .modal-body { padding: 60px 22px 26px; scroll-padding-top: 24px; }
  .sf-close { top: 12px; right: 12px; width: 38px; height: 38px; }
  .sf-kicker { margin: 0 0 16px; font-size: 11px; }
  .sf-title { font-size: 28px; }
  .sf-description { font-size: 15px; margin-bottom: 20px; }
  .sf-option-surface { padding: 14px; gap: 12px; }
  .sf-option strong { font-size: 16px; }
  .sf-option small { font-size: 13px; }
  .sf-actions { gap: 14px; flex-wrap: wrap; }
  .sf-next { min-width: 0; }
  .sf-result-card { padding: 20px; }
  .sf-result-card h3 { font-size: 24px; }
  .sf-price strong { font-size: 23px; }
  .sf-result-actions .btn-movento { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .sf-modal *, .sf-modal *::before { transition: none !important; } }
