:root {
  --green: #4f46e5;
  --green-dark: #4338ca;
  --blue: #1e1b4b;
  --sun: #f7b500;
  --soft: #f5f7ff;
  --text: #25313f;
  --radius: 16px;
  --shadow: 0 6px 24px rgba(30, 27, 75, .08);
}
html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, sans-serif; color: var(--text); font-size: 1.0625rem; line-height: 1.65; background: #fff; }
h1, h2, h3, h4, h5, h6, .brand-text { font-family: 'Poppins', system-ui, sans-serif; color: var(--blue); line-height: 1.25; }
a { color: var(--green-dark); }
:focus-visible { outline: 3px solid var(--sun); outline-offset: 2px; }
.skip-link { position: absolute; left: 8px; top: 8px; z-index: 2000; background: #fff; padding: .5rem 1rem; border-radius: 8px; }
.text-brand-blue { color: var(--blue) !important; }

/* buttons */
.btn { border-radius: 999px; font-weight: 600; padding: .6rem 1.3rem; }
.btn-lg { padding: .8rem 1.8rem; font-size: 1.1rem; }
.btn-brand { background: var(--green); border-color: var(--green); color: #fff; }
.btn-brand:hover, .btn-brand:focus { background: var(--green-dark); border-color: var(--green-dark); color: #fff; }
.btn-outline-brand { border: 2px solid var(--green); color: var(--green-dark); background: #fff; }
.btn-outline-brand:hover, .btn-outline-brand:focus { background: var(--green); color: #fff; }
.btn-whatsapp { background: #128c4a; border-color: #128c4a; color: #fff; }
.btn-whatsapp:hover { background: #0e7239; color: #fff; }
.badge-sun { background: #fff3cc; color: #6b4b00; font-size: .9rem; padding: .5rem .9rem; border-radius: 999px; }

/* top bar + nav */
.topbar { background: var(--blue); color: #fff; font-size: .9rem; }
.topbar a { color: #fff; text-decoration: none; }
.site-nav { box-shadow: 0 2px 12px rgba(0, 0, 0, .06); }
.site-nav .brand-text { font-weight: 700; font-size: 1rem; max-width: 190px; line-height: 1.15; }
.site-nav .nav-link { color: var(--blue); font-weight: 500; padding: .75rem .8rem; }
.site-nav .nav-link:hover { color: var(--green); }
.breadcrumb-bar { background: var(--soft); padding: .6rem 0; font-size: .95rem; }

/* hero */
.hero { background: linear-gradient(180deg, #fffbea 0%, #fff 100%); padding: 3rem 0; }
.hero h1 { font-size: clamp(1.9rem, 4.5vw, 3rem); font-weight: 700; }
.hero .lead { color: #44505e; }
.hero-img { width: 100%; height: auto; border-radius: var(--radius); box-shadow: var(--shadow); }
.page-banner { background: var(--blue); color: #fff; padding: 2.5rem 0; }
.page-banner h1 { color: #fff; font-size: clamp(1.7rem, 4vw, 2.4rem); }
.page-banner .lead { color: #dbe6f5; font-size: 1.1rem; margin-top: .5rem; }

/* sections */
.section { padding: 3.5rem 0; }
.bg-soft { background: var(--soft); }
.section-head { text-align: center; max-width: 720px; margin: 0 auto 2.2rem; }
.section-head h2 { font-size: clamp(1.5rem, 3.4vw, 2rem); }
.card { border-radius: var(--radius); }
.service-card, .system-card { border: 1px solid #e0e7ff; box-shadow: var(--shadow); transition: transform .15s; }
.service-card:hover { transform: translateY(-3px); }
.icon-circle { width: 56px; height: 56px; border-radius: 50%; background: #eef2ff; color: var(--green); display: grid; place-items: center; font-size: 1.4rem; margin-bottom: 1rem; }
.why-item { display: flex; gap: .8rem; align-items: flex-start; }
.why-item > i { color: var(--green); font-size: 1.4rem; margin-top: .2rem; }
.check-list li { display: flex; gap: .6rem; margin-bottom: .5rem; }
.check-list i { color: var(--green); margin-top: .35rem; }

/* process */
.process-list { list-style: none; padding: 0; margin: 0 0 1.5rem; display: grid; gap: 1rem; }
.process-list li { display: flex; gap: 1rem; align-items: flex-start; background: #fff; border: 1px solid #e0e7ff; border-radius: var(--radius); padding: 1rem 1.2rem; }
.step-no { flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--sun); color: var(--blue); font-weight: 700; display: grid; place-items: center; }

/* tables / calc */
.compare-table th, .compare-table td { min-width: 150px; }
.compare-table thead th { background: var(--blue); color: #fff; }
.compare-table tbody th { background: var(--soft); }
.calc-stat { display: flex; gap: .8rem; align-items: center; background: var(--soft); padding: .8rem 1rem; border-radius: 12px; height: 100%; }
.calc-stat i { color: var(--green); font-size: 1.4rem; width: 1.6rem; text-align: center; }

/* gallery */
.gallery-card { border-radius: var(--radius); overflow: hidden; background: #fff; box-shadow: var(--shadow); }
.gallery-open { display: block; width: 100%; border: 0; padding: 0; background: none; cursor: zoom-in; }
.gallery-open img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.gallery-card figcaption { padding: .8rem 1rem; }

/* faq */
.accordion-button { font-weight: 600; color: var(--blue); }
.accordion-button:not(.collapsed) { background: #eef2ff; color: var(--blue); }

/* contact */
.contact-list li { display: flex; gap: 1rem; margin-bottom: 1.2rem; }
.contact-list > li > i { color: var(--green); font-size: 1.3rem; margin-top: .3rem; width: 1.5rem; text-align: center; }
.form-control, .form-select { padding: .65rem .85rem; border-radius: 10px; }
.form-label { font-weight: 600; }
.content-body h3 { color: var(--blue); }

/* footer + floating buttons */
.site-footer { background: var(--blue); color: #e8eef7; }
.site-footer h2 { color: #fff; }
.site-footer a { color: #cfe0f7; }
.footer-links li { margin-bottom: .4rem; }
.social-link { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .12); margin-right: .4rem; text-decoration: none; }
.float-actions { position: fixed; right: 14px; bottom: 14px; display: flex; flex-direction: column; gap: 10px; z-index: 1040; }
.float-btn { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: 1.5rem; box-shadow: 0 4px 14px rgba(0, 0, 0, .3); text-decoration: none; }
.float-call { background: var(--blue); }
.float-wa { background: #128c4a; }
.float-btn:hover { color: #fff; filter: brightness(1.1); }

@media (max-width: 575.98px) {
  body { font-size: 1.0625rem; }
  .section { padding: 2.5rem 0; }
  .site-nav .brand-text { font-size: .9rem; max-width: 150px; }
  .hero { padding: 1.5rem 0 2.5rem; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }


/* ===== ithubseva brand + responsive layer ===== */
:root{--ith-brand:#4f46e5;--ith-brand-dark:#4338ca;--ith-accent:#06b6d4;--ith-soft:#eef2ff;--ith-grad:linear-gradient(135deg,#4f46e5 0%,#7c3aed 55%,#06b6d4 100%)}
html{-webkit-text-size-adjust:100%}
body{font-family:Inter,"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg,canvas,iframe{max-width:100%}
img,video{height:auto}
::selection{background:#c7d2fe;color:#1e1b4b}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(79,70,229,.35);outline-offset:2px}
@media(max-width:768px){
  input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px!important}
  table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  pre,code{white-space:pre-wrap;word-break:break-word}
}