[data-theme="dark"]{--bg:#0f172a;--bg2:#1e293b;--bg3:#334155;--text:#f1f5f9;--text2:#94a3b8;--border:#334155;--card-bg:#1e293b;--nav-bg:rgba(15,23,42,.95);--input-bg:#1e293b}[data-theme="dark"] body{background:var(--bg);color:var(--text)}[data-theme="dark"] .header{background:var(--nav-bg);border-bottom-color:var(--border)}[data-theme="dark"] .nav-link{color:var(--text2)}[data-theme="dark"] .nav-link:hover,[data-theme="dark"] .nav-link.active{color:#10B981}[data-theme="dark"] .svc-card,[data-theme="dark"] .price-card,[data-theme="dark"] .adv-card,[data-theme="dark"] .proc-box,[data-theme="dark"] .sb-card,[data-theme="dark"] .faq-item,[data-theme="dark"] .step-form-wrap,[data-theme="dark"] .grant-card,[data-theme="dark"] .rev-card{background:var(--card-bg);border-color:var(--border);color:var(--text)}[data-theme="dark"] .faq-q{color:var(--text);background:var(--card-bg)}[data-theme="dark"] .faq-ans{background:var(--bg2)}[data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3,[data-theme="dark"] h4{color:var(--text)}[data-theme="dark"] p{color:var(--text2)}[data-theme="dark"] input,[data-theme="dark"] select,[data-theme="dark"] textarea{background:var(--input-bg);border-color:var(--border);color:var(--text)}[data-theme="dark"] .calc-section,[data-theme="dark"] section[style*="background:#F9FAFB"],[data-theme="dark"] section[style*="background:#F0FDF4"]{background:var(--bg2) !important}[data-theme="dark"] .calc-check{background:var(--card-bg);border-color:var(--border);color:var(--text)}[data-theme="dark"] .calc-check:has(input:checked){background:#052e16;border-color:#10B981}[data-theme="dark"] .footer{background:#020617}[data-theme="dark"] .seo-block{background:#020617}[data-theme="dark"] .mobile-nav{background:var(--bg)}[data-theme="dark"] #calcResult{background:var(--card-bg);border-color:var(--border)}[data-theme="dark"] .step-dot{background:var(--bg3);border-color:var(--border);color:var(--text2)}[data-theme="dark"] .step-connector{background:var(--border)}[data-theme="dark"] .hours-row{border-bottom-color:var(--border)}[data-theme="dark"] .contact-method{background:var(--card-bg);border-color:var(--border);color:var(--text)}[data-theme="dark"] #cookieBanner{background:var(--card-bg);border-color:var(--border)}[data-theme="dark"] #cookieBanner p{color:var(--text2)}[data-theme="dark"] #chatBox{background:var(--card-bg);border-color:var(--border)}[data-theme="dark"] .chat-msgs{background:var(--bg2)}[data-theme="dark"] .chat-msg-bot .chat-bubble{background:var(--bg3);border-color:var(--border);color:var(--text)}[data-theme="dark"] .chat-input-wrap{background:var(--card-bg);border-top-color:var(--border)}[data-theme="dark"] #chatInput{background:var(--bg2);border-color:var(--border);color:var(--text)}[data-theme="dark"] #chatInput::placeholder{color:var(--text2)}[data-theme="dark"] .chat-quick-replies{background:var(--bg2)}[data-theme="dark"] .chat-qr{background:var(--bg3);border-color:var(--border);color:var(--text)}[data-theme="dark"] .grant-meta-label{color:var(--text2)}[data-theme="dark"] .msg-btn-ph{background:var(--bg3)}[data-theme="dark"] #exitBox{background:var(--card-bg)}[data-theme="dark"] #exitBox h3,[data-theme="dark"] #exitBox p{color:var(--text)}[data-theme="dark"] #exitPhone{background:var(--input-bg);border-color:var(--border);color:var(--text)}#darkToggle{background:none;border:1.5px solid rgba(255,255,255,.15);border-radius:8px;padding:.3rem .5rem;font-size:1rem;cursor:pointer;line-height:1;transition:border-color .2s,background .2s;color:inherit}#darkToggle:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.3)}#langToggle{background:none;border:1.5px solid rgba(255,255,255,.15);border-radius:8px;padding:.3rem .6rem;font-size:.8rem;font-weight:700;cursor:pointer;color:inherit;transition:border-color .2s;white-space:nowrap}#langToggle:hover{border-color:#10B981}@keyframes confettiFall{0%{transform:translateY(0) rotate(0deg) scaleX(1);opacity:1}80%{opacity:1}100%{transform:translateY(100vh) rotate(720deg) scaleX(.3);opacity:0}}.price-toggle-wrap{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:2.5rem}.price-toggle-label-month,.price-toggle-label-year{font-size:.925rem;font-weight:600;color:#9ca3af;transition:color .2s}.price-toggle-label-month.active,.price-toggle-label-year.active{color:var(--navy)}[data-theme="dark"] .price-toggle-label-month.active,[data-theme="dark"] .price-toggle-label-year.active{color:#f1f5f9}.toggle-switch{position:relative;width:48px;height:26px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;inset:0;background:#e5e7eb;border-radius:999px;cursor:pointer;transition:background .3s}.toggle-slider::before{content:'';position:absolute;width:20px;height:20px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform .3s;box-shadow:0 1px 4px rgba(0,0,0,.15)}.toggle-switch input:checked + .toggle-slider{background:#10B981}.toggle-switch input:checked + .toggle-slider::before{transform:translateX(22px)}.price-badge-save{display:inline-block;background:#FEF3C7;color:#92400E;font-size:.7rem;font-weight:700;padding:.15rem .5rem;border-radius:999px;margin-left:.5rem}.price-badge-save.hidden{display:none}.faq-search-wrap{position:relative;margin-bottom:1.5rem}.faq-search-wrap::before{content:'🔍';position:absolute;left:1rem;top:50%;transform:translateY(-50%);font-size:.9rem;pointer-events:none}#faqSearch{width:100%;padding:.7rem 1rem .7rem 2.75rem;border:1.5px solid #e5e7eb;border-radius:12px;font-size:.9rem;font-family:inherit;outline:none;transition:border-color .2s;background:#fff}[data-theme="dark"] #faqSearch{background:var(--input-bg);border-color:var(--border);color:var(--text)}#faqSearch:focus{border-color:#10B981}#faqNoResult{display:none;text-align:center;padding:2rem;color:#9ca3af;font-size:.9rem}.wa-wrap{position:relative;display:inline-block}.msg-btn-wa{background:#25D366}#whatsappQr{position:absolute;bottom:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(8px);background:#fff;border-radius:16px;padding:1rem;box-shadow:0 8px 32px rgba(10,22,40,.18);border:1px solid #e5e7eb;text-align:center;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;white-space:nowrap;z-index:100}#whatsappQr.qr-visible{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0)}#whatsappQr canvas,#whatsappQr svg{display:block;margin:0 auto}#whatsappQr p{font-size:.75rem;color:#6b7280;margin:.5rem 0 0}.qr-svg{width:120px;height:120px}@media print{.header,.footer,.mob-cta,#chatWidget,#messengerWidget,#stickyCta,#discountBanner,#splash,#pagePreloader,#backTop,#cookieBanner,#socialProof,#leadMagnet,.cta-banner,.lead-section,.calc-section,#darkToggle,#langToggle,.burger{display:none !important}body{font-size:11pt;color:#000;background:#fff}a{color:#000;text-decoration:none}h1,h2,h3{page-break-after:avoid}.svc-card,.price-card{border:1px solid #ccc;break-inside:avoid}.price-card.pop{border:2px solid #10B981}.page-header-print{display:block !important;text-align:center;border-bottom:2px solid #10B981;padding-bottom:1rem;margin-bottom:2rem}.page-header-print h1{font-size:18pt}.page-header-print p{font-size:10pt;color:#555}}.page-header-print{display:none}#heroVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.18;pointer-events:none;z-index:0}
/* ═══════════════════════════════════════════════════════════
   FINSMILE — REDESIGNED BLOCKS (FAQ + SERVICE CARDS)
   Підключається до всіх сторінок через extra.css
   ═══════════════════════════════════════════════════════════ */

/* ── FAQ — обидва варіанти (.faq-item і .svc-faq-item) ─── */

.faq-item,
.svc-faq-item {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rl);
  margin-bottom: .625rem;
  overflow: hidden;
  transition: border-color .25s, box-shadow .25s, transform .2s;
  position: relative;
}
.faq-item::before,
.svc-faq-item::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--g);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .3s ease;
  border-radius: 0 2px 2px 0;
}
.faq-item:hover,
.svc-faq-item:hover {
  border-color: rgba(46,189,106,.3);
  box-shadow: 0 4px 20px rgba(46,189,106,.08);
  transform: translateX(3px);
}
.faq-item.open,
.svc-faq-item.open {
  border-color: var(--g);
  box-shadow: 0 0 0 3px rgba(46,189,106,.1), 0 8px 32px rgba(46,189,106,.08);
  transform: translateX(3px);
}
.faq-item.open::before,
.svc-faq-item.open::before {
  transform: scaleY(1);
}

/* Кнопка питання */
.faq-q,
.svc-faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  padding: 1.125rem 1.5rem 1.125rem 1.75rem;
  background: none;
  border: none;
  text-align: left;
  font-family: var(--fb);
  font-size: .95rem;
  font-weight: 700;
  color: var(--navy);
  cursor: pointer;
  transition: color .2s, background .2s;
  line-height: 1.45;
}
.faq-q:hover,
.svc-faq-q:hover {
  color: var(--g);
  background: rgba(46,189,106,.03);
}
.faq-item.open .faq-q,
.svc-faq-item.open .svc-faq-q {
  color: var(--g);
}

/* Іконка +/× */
.faq-ico,
.svc-faq-icon {
  width: 32px;
  height: 32px;
  min-width: 32px;
  border-radius: 50%;
  border: 2px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  font-weight: 400;
  color: var(--sub);
  flex-shrink: 0;
  transition: all .25s;
  line-height: 1;
  background: var(--gray);
}
.faq-item.open .faq-ico,
.svc-faq-item.open .svc-faq-icon {
  background: var(--g);
  border-color: var(--g);
  color: #fff;
  transform: rotate(45deg);
  box-shadow: 0 4px 12px rgba(46,189,106,.35);
}

/* Відповідь */
.faq-ans,
.faq-a,
.svc-faq-a {
  display: none;
  padding: 0 1.75rem 1.25rem 1.75rem;
  font-size: .9rem;
  color: var(--sub);
  line-height: 1.85;
  border-top: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(46,189,106,.02) 0%, transparent 100%);
  animation: faqSlideIn .25s ease;
}
.faq-a-inner {
  padding: .875rem 0 0;
}
.faq-item.open .faq-ans,
.faq-item.open .faq-a,
.svc-faq-item.open .svc-faq-a {
  display: block;
}
@keyframes faqSlideIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: none; }
}

/* ── SVC-CARD — блоки "що входить" ──────────────────────── */
.svc-card {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rx);
  padding: 1.75rem 1.5rem;
  transition: all .3s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
}
.svc-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--g), #5eead4);
  transform: scaleX(0);
  transition: transform .35s ease;
  transform-origin: left;
}
.svc-card:hover {
  border-color: rgba(46,189,106,.35);
  box-shadow: 0 12px 40px rgba(46,189,106,.1);
  transform: translateY(-5px);
}
.svc-card:hover::after {
  transform: scaleX(1);
}
.svc-card-ico {
  font-size: 2rem;
  margin-bottom: 1rem;
  display: block;
  transition: transform .3s;
}
.svc-card:hover .svc-card-ico {
  transform: scale(1.15) rotate(-5deg);
}
.svc-card h3 {
  font-family: var(--fh);
  font-size: .875rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: .5rem;
  line-height: 1.35;
}
.svc-card p {
  font-size: .875rem;
  color: var(--sub);
  line-height: 1.7;
  margin: 0;
}

/* ── WHY-CARD — блоки "чому обирають" ───────────────────── */
.why-card {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rl);
  padding: 1.5rem;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  transition: all .28s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
}
.why-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(46,189,106,.04) 0%, transparent 70%);
  opacity: 0;
  transition: opacity .3s;
}
.why-card:hover {
  border-color: rgba(46,189,106,.35);
  box-shadow: 0 8px 32px rgba(46,189,106,.1);
  transform: translateY(-3px);
}
.why-card:hover::before {
  opacity: 1;
}
.why-ico {
  width: 48px;
  height: 48px;
  min-width: 48px;
  border-radius: 12px;
  background: var(--gl);
  border: 1.5px solid rgba(46,189,106,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  transition: all .28s;
  flex-shrink: 0;
}
.why-card:hover .why-ico {
  background: var(--g);
  border-color: var(--g);
  transform: scale(1.08) rotate(-5deg);
}

/* ── BENEFIT-CARD — покращення (вже є, але підсилюємо) ─── */
.benefit-card {
  transition: all .3s cubic-bezier(.4,0,.2,1) !important;
}
.benefit-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 16px 48px rgba(46,189,106,.12) !important;
  border-color: rgba(46,189,106,.3) !important;
}
.benefit-card:hover .benefit-card-ico {
  transform: scale(1.1) rotate(-5deg) !important;
}

/* ── SECTION-TAG — бейдж над заголовком секції ──────────── */
.section-tag {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  background: var(--gl);
  color: var(--gd);
  border: 1px solid rgba(46,189,106,.25);
  border-radius: 999px;
  padding: .32rem .875rem;
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: .875rem;
}
.section-tag::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--g);
  animation: dot 2s infinite;
}
.section-title {
  font-family: var(--fh);
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  font-weight: 800;
  color: var(--navy);
  line-height: 1.2;
  letter-spacing: -.025em;
  margin-bottom: .875rem;
}
.section-header {
  margin-bottom: 2.5rem;
}

/* ── REVIEW-CARD (старий стиль) ─────────────────────────── */
.review-card {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rx);
  padding: 1.75rem;
  transition: all .3s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
}
.review-card::before {
  content: '\201C';
  position: absolute;
  top: -.5rem; right: 1.25rem;
  font-size: 6rem;
  font-family: Georgia, serif;
  line-height: 1;
  color: var(--gl);
  pointer-events: none;
  transition: color .3s;
}
.review-card:hover {
  box-shadow: 0 16px 48px rgba(17,34,64,.1);
  transform: translateY(-5px);
  border-color: rgba(46,189,106,.25);
}
.review-card:hover::before {
  color: rgba(46,189,106,.12);
}
.review-stars {
  color: #f59e0b;
  font-size: 1rem;
  letter-spacing: .1rem;
  margin-bottom: .875rem;
}
.review-text {
  font-size: .9rem;
  color: var(--text);
  line-height: 1.8;
  font-style: italic;
  margin-bottom: 1rem;
}
.review-author {
  font-weight: 800;
  font-size: .875rem;
  color: var(--navy);
}
.review-meta {
  font-size: .75rem;
  color: var(--sub);
  margin-top: .2rem;
}

/* ── МОБІЛЬНА АДАПТАЦІЯ ─────────────────────────────────── */
@media (max-width: 640px) {
  .faq-q, .svc-faq-q {
    padding: .9rem 1rem .9rem 1.25rem;
    font-size: .875rem;
  }
  .faq-ans, .faq-a, .svc-faq-a {
    padding: 0 1.25rem 1rem 1.25rem;
    font-size: .85rem;
  }
  .faq-item:hover, .svc-faq-item:hover,
  .faq-item.open, .svc-faq-item.open {
    transform: none;
  }
  .svc-card { padding: 1.25rem 1rem; }
  .why-card { padding: 1.25rem 1rem; }
  .why-ico { width: 42px; height: 42px; min-width: 42px; font-size: 1.2rem; }
}

/* ── Старий стиль faq-q::after (vedennya, konsultatsiia) ─ */
.faq-q::after {
  content: '+';
  font-size: 1.4rem;
  font-weight: 300;
  color: var(--g);
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  min-width: 32px;
  border-radius: 50%;
  border: 2px solid rgba(46,189,106,.3);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gl);
  transition: all .25s;
  line-height: 0;
  padding-bottom: 2px;
}
.faq-item.open .faq-q::after {
  content: '+';
  background: var(--g);
  border-color: var(--g);
  color: #fff;
  transform: rotate(45deg);
  box-shadow: 0 4px 12px rgba(46,189,106,.35);
}

/* ═══════════════════════════════════════════════════════════
   УНІФІКОВАНІ БЛОКИ — єдиний стиль по всьому сайту
   (як на зразку: іконка + заголовок + текст)
   ═══════════════════════════════════════════════════════════ */

/* ── FEATURE-CARD (головна — блоки послуг) ───────────────── */
.feature-card {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rx);
  padding: 2rem 1.75rem;
  transition: all .3s cubic-bezier(.4,0,.2,1);
  text-decoration: none;
  display: block;
  color: inherit;
  position: relative;
  overflow: hidden;
}
.feature-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(46,189,106,.05) 0%, transparent 60%);
  opacity: 0;
  transition: opacity .3s;
}
.feature-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--g), #5eead4);
  transform: scaleX(0);
  transition: transform .35s ease;
  transform-origin: left;
}
.feature-card:hover {
  box-shadow: 0 20px 60px rgba(17,34,64,.12);
  transform: translateY(-6px);
  border-color: rgba(46,189,106,.35);
}
.feature-card:hover::before { opacity: 1; }
.feature-card:hover::after  { transform: scaleX(1); }
.feature-ico {
  font-size: 2.25rem;
  margin-bottom: 1.125rem;
  display: block;
  transition: transform .3s;
  line-height: 1;
}
.feature-card:hover .feature-ico {
  transform: scale(1.15) rotate(-5deg);
}
.feature-title {
  font-family: var(--fh);
  font-size: .875rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: .625rem;
  line-height: 1.4;
}
.feature-desc {
  font-size: .875rem;
  color: var(--sub);
  line-height: 1.75;
  margin-bottom: 1.125rem;
}
.feature-price {
  font-size: .82rem;
  font-weight: 800;
  color: var(--g);
  display: flex;
  align-items: center;
  gap: .25rem;
}
.feature-price::after {
  content: '→';
  transition: transform .2s;
}
.feature-card:hover .feature-price::after {
  transform: translateX(4px);
}

/* ── BENEFIT-CARD (сервісні сторінки) ───────────────────── */
.benefit-card {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rx);
  padding: 1.75rem;
  position: relative;
  overflow: hidden;
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
  transition: all .3s cubic-bezier(.4,0,.2,1);
}
.benefit-card::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: linear-gradient(to bottom, var(--g), #5eead4);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .3s ease;
  border-radius: 0 2px 2px 0;
}
.benefit-card:hover {
  box-shadow: 0 16px 48px rgba(46,189,106,.12);
  transform: translateY(-5px);
  border-color: rgba(46,189,106,.3);
}
.benefit-card:hover::before {
  transform: scaleY(1);
}
.benefit-card-ico {
  width: 52px;
  height: 52px;
  min-width: 52px;
  border-radius: var(--r);
  background: var(--gl);
  border: 1.5px solid rgba(46,189,106,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  transition: all .3s;
  flex-shrink: 0;
}
.benefit-card:hover .benefit-card-ico {
  background: var(--g);
  border-color: var(--g);
  transform: scale(1.08) rotate(-5deg);
}
.benefit-card-title {
  font-family: var(--fh);
  font-size: .875rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: .5rem;
  line-height: 1.35;
}
.benefit-card-desc {
  font-size: .875rem;
  color: var(--sub);
  line-height: 1.7;
}

/* ── PROCESS CARDS (кроки) ──────────────────────────────── */
.process-card-v2 {
  transition: all .3s cubic-bezier(.4,0,.2,1) !important;
}
.process-card-v2:hover {
  border-color: var(--g) !important;
  box-shadow: 0 16px 48px rgba(46,189,106,.1) !important;
  transform: translateY(-6px) !important;
}

/* ── SVC-CARD (що входить) ──────────────────────────────── */
.svc-card {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rx);
  padding: 1.75rem 1.5rem;
  transition: all .3s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
}
.svc-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(46,189,106,.05) 0%, transparent 60%);
  opacity: 0;
  transition: opacity .3s;
}
.svc-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--g), #5eead4);
  transform: scaleX(0);
  transition: transform .35s ease;
  transform-origin: left;
}
.svc-card:hover {
  border-color: rgba(46,189,106,.35);
  box-shadow: 0 12px 40px rgba(46,189,106,.1);
  transform: translateY(-5px);
}
.svc-card:hover::before { opacity: 1; }
.svc-card:hover::after  { transform: scaleX(1); }
.svc-card-ico {
  font-size: 2rem;
  margin-bottom: 1rem;
  display: block;
  transition: transform .3s;
  line-height: 1;
}
.svc-card:hover .svc-card-ico {
  transform: scale(1.15) rotate(-5deg);
}
.svc-card h3 {
  font-family: var(--fh);
  font-size: .875rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: .5rem;
  line-height: 1.35;
}
.svc-card p {
  font-size: .875rem;
  color: var(--sub);
  line-height: 1.7;
  margin: 0;
}

/* ── WHY-CARD (переваги) ────────────────────────────────── */
.why-card {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rl);
  padding: 1.375rem 1.25rem;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  transition: all .28s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
}
.why-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--g), #5eead4);
  transform: scaleX(0);
  transition: transform .3s ease;
  transform-origin: left;
}
.why-card:hover {
  border-color: rgba(46,189,106,.35);
  box-shadow: 0 8px 32px rgba(46,189,106,.1);
  transform: translateY(-3px);
}
.why-card:hover::after { transform: scaleX(1); }
.why-ico {
  width: 46px;
  height: 46px;
  min-width: 46px;
  border-radius: 12px;
  background: var(--gl);
  border: 1.5px solid rgba(46,189,106,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.375rem;
  transition: all .28s;
  flex-shrink: 0;
}
.why-card:hover .why-ico {
  background: var(--g);
  border-color: var(--g);
  transform: scale(1.08) rotate(-5deg);
}

/* ── REVIEW-CARD ────────────────────────────────────────── */
.review-card {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rx);
  padding: 1.75rem;
  transition: all .3s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
}
.review-card::before {
  content: '\201C';
  position: absolute;
  top: -.5rem; right: 1.25rem;
  font-size: 6rem;
  font-family: Georgia, serif;
  line-height: 1;
  color: rgba(46,189,106,.08);
  pointer-events: none;
  transition: color .3s;
}
.review-card:hover {
  box-shadow: 0 16px 48px rgba(17,34,64,.1);
  transform: translateY(-5px);
  border-color: rgba(46,189,106,.25);
}
.review-card:hover::before { color: rgba(46,189,106,.15); }
.review-stars { color: #f59e0b; font-size: 1rem; letter-spacing:.1rem; margin-bottom:.875rem; }
.review-text  { font-size:.9rem; color:var(--text); line-height:1.8; font-style:italic; margin-bottom:1rem; }
.review-author{ font-weight:800; font-size:.875rem; color:var(--navy); }
.review-meta  { font-size:.75rem; color:var(--sub); margin-top:.2rem; }

/* ── МОБІЛЬНА АДАПТАЦІЯ ─────────────────────────────────── */
@media (max-width: 640px) {
  .feature-card { padding: 1.5rem 1.25rem; }
  .feature-card:hover { transform: translateY(-3px); }
  .benefit-card { padding: 1.25rem 1rem; gap: .875rem; }
  .benefit-card:hover { transform: translateY(-3px); }
  .benefit-card-ico { width: 44px; height: 44px; min-width: 44px; font-size: 1.25rem; }
  .svc-card { padding: 1.25rem 1rem; }
  .why-card { padding: 1.125rem 1rem; }
  .why-ico { width: 40px; height: 40px; min-width: 40px; font-size: 1.2rem; }
}

/* ═══════════════════════════════════════════════════════════
   ABOUT-SVC BLOCK — красивий блок "про послугу" з фото
   ═══════════════════════════════════════════════════════════ */
.about-svc-wrap {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 4rem;
  align-items: start;
}
.about-svc-photo {
  position: sticky;
  top: calc(var(--hh) + 1.5rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.about-svc-photo-frame {
  position: relative;
  border-radius: var(--rx);
  overflow: hidden;
  aspect-ratio: 3/4;
  box-shadow: 0 24px 80px rgba(11,23,38,.25);
  border: 2px solid rgba(46,189,106,.2);
}
.about-svc-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 15%;
  display: block;
  transition: transform .6s ease;
}
.about-svc-photo-frame:hover .about-svc-img {
  transform: scale(1.04);
}
.about-svc-photo-overlay {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 45%;
  background: linear-gradient(to top, rgba(11,23,38,.85) 0%, transparent 100%);
}
.about-svc-badge {
  position: absolute;
  bottom: 1rem; left: 1rem; right: 1rem;
  background: rgba(46,189,106,.9);
  backdrop-filter: blur(8px);
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
  padding: .5rem 1rem;
  border-radius: 999px;
  text-align: center;
  box-shadow: 0 4px 16px rgba(46,189,106,.4);
}
.about-svc-trust {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .5rem;
}
.about-svc-trust-item {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rl);
  padding: .875rem .5rem;
  text-align: center;
  transition: all .25s;
}
.about-svc-trust-item:hover {
  border-color: rgba(46,189,106,.35);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(46,189,106,.1);
}
.about-svc-trust-n {
  display: block;
  font-family: var(--fh);
  font-size: 1.4rem;
  font-weight: 900;
  color: var(--g);
  line-height: 1;
  margin-bottom: .25rem;
}
.about-svc-trust-l {
  display: block;
  font-size: .68rem;
  color: var(--sub);
  font-weight: 600;
  line-height: 1.3;
}

/* Текстова частина */
.about-svc-text {
  padding-top: .5rem;
}
.about-svc-text .section-title {
  margin-bottom: 1.5rem;
}
.about-svc-body {
  font-size: .975rem;
  line-height: 1.9;
  color: var(--text);
}
.about-svc-body p {
  margin-bottom: 1.125rem;
}
.about-svc-body p:last-child { margin-bottom: 0; }
.about-svc-body strong { color: var(--navy); }
.about-svc-highlights {
  display: flex;
  flex-direction: column;
  gap: .625rem;
  margin-top: 1.75rem;
}
.about-svc-hl-item {
  display: flex;
  align-items: flex-start;
  gap: .875rem;
  padding: 1rem 1.25rem;
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rl);
  transition: all .25s;
}
.about-svc-hl-item:hover {
  border-color: rgba(46,189,106,.35);
  box-shadow: 0 4px 20px rgba(46,189,106,.08);
  transform: translateX(4px);
}
.about-svc-hl-ico {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 10px;
  background: var(--gl);
  border: 1px solid rgba(46,189,106,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  transition: all .25s;
}
.about-svc-hl-item:hover .about-svc-hl-ico {
  background: var(--g);
}
.about-svc-hl-text strong {
  display: block;
  font-size: .875rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: .2rem;
}
.about-svc-hl-text span {
  font-size: .82rem;
  color: var(--sub);
  line-height: 1.5;
}
.about-svc-cta {
  margin-top: 2rem;
  display: flex;
  gap: .875rem;
  flex-wrap: wrap;
}

/* Мобільна адаптація */
@media (max-width: 900px) {
  .about-svc-wrap {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .about-svc-photo {
    position: static;
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 1rem;
    align-items: start;
  }
  .about-svc-photo-frame {
    aspect-ratio: 3/4;
  }
  .about-svc-trust {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .about-svc-photo {
    grid-template-columns: 1fr;
  }
  .about-svc-photo-frame {
    max-width: 280px;
    margin: 0 auto;
  }
  .about-svc-trust {
    grid-template-columns: repeat(3, 1fr);
  }
  .about-svc-hl-item:hover {
    transform: none;
  }
}

/* ═══════════════════════════════════════════════════════════
   МОБІЛЬНЕ ЦЕНТРУВАННЯ — виправлення блоків
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
  /* Грід блоків — завжди 1 колонка і повна ширина */
  .benefits-grid,
  .feature-grid,
  [style*="repeat(auto-fill"],
  [style*="repeat(auto-fit"] {
    grid-template-columns: 1fr !important;
  }
  /* Картки — повна ширина */
  .benefit-card,
  .feature-card,
  .svc-card,
  .why-card,
  .review-card {
    width: 100%;
    box-sizing: border-box;
  }
  /* Центрування тексту секцій */
  .section-header,
  .text-center {
    text-align: center;
  }
  .section-header .section-tag {
    margin: 0 auto .875rem;
  }
  /* Кнопки — повна ширина */
  .about-svc-cta {
    flex-direction: column;
  }
  .about-svc-cta .btn {
    width: 100%;
    justify-content: center;
  }
}

/* ═══════════════════════════════════════════════════════════
   RICH-ABOUT — красивий блок "про послугу" з сіткою
   ═══════════════════════════════════════════════════════════ */

.rich-about-wrap {
  max-width: 900px;
  margin: 0 auto;
}
.rich-about-header {
  text-align: center;
  margin-bottom: 2.5rem;
}
.rich-about-lead {
  font-size: 1.05rem;
  color: var(--sub);
  line-height: 1.8;
  max-width: 680px;
  margin: 0 auto;
}

/* Сітка карток */
.rich-items-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-bottom: 1.75rem;
}
@media (max-width: 900px) {
  .rich-items-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .rich-items-grid { grid-template-columns: 1fr; }
}

/* Картка пункту */
.rich-item {
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: var(--rl);
  padding: 1.375rem 1.25rem;
  display: flex;
  gap: .875rem;
  align-items: flex-start;
  transition: all .28s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
}
.rich-item::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(to bottom, var(--g), #5eead4);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .3s ease;
  border-radius: 0 2px 2px 0;
}
.rich-item:hover {
  border-color: rgba(46,189,106,.3);
  box-shadow: 0 8px 28px rgba(46,189,106,.1);
  transform: translateY(-4px);
}
.rich-item:hover::before {
  transform: scaleY(1);
}
.rich-item-ico {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 10px;
  background: var(--gl);
  border: 1.5px solid rgba(46,189,106,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  flex-shrink: 0;
  transition: all .25s;
}
.rich-item:hover .rich-item-ico {
  background: var(--g);
  border-color: var(--g);
  transform: scale(1.08) rotate(-5deg);
}
.rich-item-title {
  font-family: var(--fh);
  font-size: .82rem;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: .3rem;
  line-height: 1.3;
}
.rich-item-desc {
  font-size: .82rem;
  color: var(--sub);
  line-height: 1.6;
}

/* Нотатка внизу */
.rich-about-note {
  background: linear-gradient(135deg, var(--gl) 0%, rgba(94,234,212,.08) 100%);
  border: 1.5px solid rgba(46,189,106,.25);
  border-radius: var(--rl);
  padding: 1.125rem 1.5rem;
  font-size: .9rem;
  font-weight: 600;
  color: var(--navy);
  text-align: center;
  position: relative;
  overflow: hidden;
}
.rich-about-note::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--g);
  border-radius: 2px 0 0 2px;
}

@media (max-width: 640px) {
  .rich-about-header { text-align: left; }
  .rich-about-lead { font-size: .95rem; }
  .rich-item { padding: 1.125rem 1rem; }
  .rich-item-ico { width: 38px; height: 38px; min-width: 38px; font-size: 1.1rem; }
  .rich-item:hover { transform: none; }
}

/* ══════════════════════════════════════════════
   FinSmile — Responsive Section & Heading Spacing
   Desktop → Tablet (≤1024px) → Mobile (≤768px) → XS (≤480px)
══════════════════════════════════════════════ */

/* ── Section padding ── */
.section      { padding: 5.5rem 0; }
.section-sm   { padding: 3.5rem 0; }
.section-xs   { padding: 2rem 0; }

/* ── Block/section headings ── */
.s-title {
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  margin-bottom: 1rem;
  line-height: 1.15;
  letter-spacing: -.025em;
}
.s-sub {
  font-size: 1.05rem;
  margin-bottom: 2.5rem;
  line-height: 1.8;
}
.s-badge {
  margin-bottom: 1.125rem;
}

/* ── Hero headings ── */
.page-hero { padding: calc(var(--hh) + 3.5rem) 0 3.5rem; }
.page-hero h1 { font-size: clamp(1.75rem, 4vw, 2.75rem); margin-bottom: .875rem; }
.page-hero p  { font-size: 1.05rem; margin-bottom: 2rem; }

/* ── Tablet (≤1024px) ── */
@media (max-width: 1024px) {
  .section    { padding: 4.5rem 0; }
  .section-sm { padding: 3rem 0; }
  .s-title    { font-size: clamp(1.65rem, 3vw, 2.25rem); margin-bottom: .9rem; }
  .s-sub      { font-size: 1rem; margin-bottom: 2.25rem; }
  .page-hero  { padding: calc(var(--hh) + 3rem) 0 3rem; }
  .page-hero h1 { font-size: clamp(1.65rem, 3.5vw, 2.4rem); }
}

/* ── Mobile (≤768px) ── */
@media (max-width: 768px) {
  .section    { padding: 3.25rem 0; }
  .section-sm { padding: 2.25rem 0; }
  .section-xs { padding: 1.5rem 0; }
  .s-title    { font-size: clamp(1.5rem, 5.5vw, 2rem) !important; margin-bottom: .75rem; letter-spacing: -.015em; }
  .s-sub      { font-size: .95rem; margin-bottom: 1.75rem; }
  .s-badge    { margin-bottom: .875rem; font-size: .68rem; }
  .page-hero  { padding: calc(var(--hh) + 2rem) 0 2.25rem; }
  .page-hero h1 { font-size: clamp(1.5rem, 6vw, 2rem) !important; }
  .page-hero p  { font-size: .9rem; margin-bottom: 1.5rem; }
  /* Card padding */
  .card, .card-glass { padding: 1.25rem; }
  /* Feature grid */
  .feature-card { padding: 1.5rem 1.25rem; }
  /* Sections with inline padding */
  .svc-cta { padding: 2.75rem 1.5rem !important; }
}

/* ── Mobile XS (≤480px) ── */
@media (max-width: 480px) {
  .section    { padding: 2.75rem 0; }
  .section-sm { padding: 1.875rem 0; }
  .s-title    { font-size: clamp(1.375rem, 7vw, 1.75rem) !important; margin-bottom: .625rem; }
  .s-sub      { font-size: .88rem; margin-bottom: 1.5rem; }
  .page-hero  { padding: calc(var(--hh) + 1.5rem) 0 1.75rem; }
  .page-hero h1 { font-size: clamp(1.25rem, 7vw, 1.75rem) !important; }
  .page-hero p  { font-size: .85rem; }
  .feature-card { padding: 1.25rem 1rem; }
  .svc-cta { padding: 2rem 1rem !important; }
  .hero-btns .btn { width: 100%; justify-content: center; }
}
