.site-nav { position: sticky; top: 0; z-index: 1030; background: #fff; box-shadow: 0 1px 0 rgba(15, 35, 80, .08); } .site-nav-inner { max-width: 1100px; margin: 0 auto; padding: .7rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; } .site-nav-brand { display: flex; align-items: center; gap: .55rem; font-weight: 700; color: #16305f; text-decoration: none; font-size: 1.02rem; } .site-nav-brand:hover { color: var(--brand); } .site-nav-brand img { height: 32px; width: 32px; object-fit: contain; border-radius: .5rem; } .site-nav-brand i { font-size: 1.3rem; color: var(--brand); } .site-nav-links { display: flex; align-items: center; gap: 1.35rem; flex-wrap: wrap; } .site-nav-links a { color: #425066; text-decoration: none; font-size: .86rem; font-weight: 600; display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; } .site-nav-links a:hover { color: var(--brand); } .site-nav-cta { background: var(--brand); color: #ffffff; padding: .5rem 1.05rem; border-radius: 999px; box-shadow: 0 6px 16px rgba(13,110,253,.25); } .site-nav-cta:hover { background: var(--brand-dark); } @media (max-width: 620px) { .site-nav-links { gap: .85rem; } .site-nav-links .site-nav-label { display: none; } .site-nav-cta { padding: .5rem .8rem; } } .app-icon-badge { display: inline-flex; align-items: center; justify-content: center; width: 2.15rem; height: 2.15rem; border-radius: .65rem; background: #eef5ff; color: var(--brand); font-size: 1.02rem; margin-inline-end: .3rem; flex-shrink: 0; } .plan-option:has(input:checked) .app-icon-badge { background: var(--brand); color: #ffffff; } .demo-btn { display: inline-flex; align-items: center; gap: .4rem; margin-top: .65rem; padding: .38rem .95rem; border: 1.5px solid var(--brand); color: var(--brand); border-radius: 999px; font-size: .78rem; font-weight: 700; text-decoration: none; transition: background .15s, color .15s, box-shadow .15s; } .demo-btn:hover { background: var(--brand); color: #ffffff; box-shadow: 0 6px 14px rgba(13,110,253,.25); } .demo-btn i { font-size: .82rem; } .custom-request-perks { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem 1.5rem; margin-top: 1.25rem; font-size: .82rem; color: rgba(255,255,255,.85); } .custom-request-perks span { display: inline-flex; align-items: center; gap: .4rem; } .custom-request-tips { background: #eef5ff; border: 1px dashed rgba(13,110,253,.35); border-radius: .75rem; padding: 1rem 1.15rem; margin-bottom: 1.5rem; } .custom-request-tips h3 { font-size: .85rem; font-weight: 700; color: var(--brand-dark); margin-bottom: .5rem; display: flex; align-items: center; gap: .45rem; } .custom-request-tips ul { margin: 0; padding-inline-start: 1.1rem; font-size: .85rem; color: #425066; } .custom-request-tips li { margin-bottom: .25rem; } .field-label i { color: var(--brand); margin-inline-end: .35rem; width: 1rem; text-align: center; }
.app-option-col { display: flex; flex-direction: column; }
.app-option-col .plan-option { height: auto; flex: 1 1 auto; margin-bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.app-demo-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .4rem .75rem; border: 2px solid rgba(15,35,80,.1); border-top: 1px dashed rgba(15,35,80,.15); border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-left-radius: .75rem; border-bottom-right-radius: .75rem; background: #fbfcfe; padding: .55rem .95rem; }
.app-option-col:has(.plan-option input:checked) .app-demo-row { border-color: var(--brand); background: #eef5ff; }
.app-demo-row .demo-btn { margin-top: 0; }
.demo-creds { font-size: .74rem; color: #8290a8; white-space: nowrap; }

.platform-icons { display: inline-flex; align-items: center; gap: .5rem; color: var(--brand); }
.platform-option .form-check-input:disabled ~ * { opacity: .5; }

.faq-item { border: 1px solid rgba(15,35,80,.1); border-radius: .65rem; padding: .95rem 1.15rem; background: #fff; }
.faq-item + .faq-item { margin-top: .6rem; }
.faq-item summary { cursor: pointer; font-weight: 600; color: #16305f; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; font-size: 1.15rem; font-weight: 700; color: var(--brand); flex-shrink: 0; }
.faq-item[open] summary::after { content: "\2013"; }
.faq-item[open] summary { margin-bottom: .55rem; }
.faq-item p { margin: 0; color: #5b6b88; font-size: .89rem; line-height: 1.65; }

.seo-section h2 { color: #16305f; }
.seo-section p { color: #5b6b88; line-height: 1.8; }

.site-footer { background: linear-gradient(135deg, #0f2350, #16305f); color: rgba(255,255,255,.85); margin-top: 3rem; }
.site-footer-inner { max-width: 1080px; margin: 0 auto; padding: 3rem 1.25rem 2rem; display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 2rem; }
.site-footer-brand { max-width: 300px; }
.site-footer-brand img { height: 34px; width: 34px; object-fit: contain; border-radius: .5rem; vertical-align: middle; background: #fff; padding: 2px; }
.site-footer-brand i { font-size: 1.4rem; color: #fff; vertical-align: middle; }
.site-footer-brand span { display: inline-block; vertical-align: middle; margin-inline-start: .55rem; font-weight: 700; font-size: 1.05rem; color: #fff; }
.site-footer-brand p { margin: .75rem 0 0; color: rgba(255,255,255,.62); font-size: .85rem; line-height: 1.65; }
.site-footer-col h3 { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: rgba(255,255,255,.5); margin: 0 0 .9rem; font-weight: 700; }
.site-footer-col p { margin: 0 0 .6rem; font-size: .88rem; display: flex; align-items: flex-start; gap: .55rem; color: rgba(255,255,255,.8); }
.site-footer-col p i { width: 1rem; margin-top: .2rem; color: rgba(255,255,255,.5); }
.site-footer-col a { color: rgba(255,255,255,.8); text-decoration: none; }
.site-footer-col a:hover { color: #fff; text-decoration: underline; }
.site-footer-bottom { border-top: 1px solid rgba(255,255,255,.12); padding: 1.15rem 1.25rem; text-align: center; font-size: .78rem; color: rgba(255,255,255,.48); }
@media (max-width: 760px) {
  .site-footer-inner { grid-template-columns: 1fr; gap: 1.6rem; }
  .app-demo-row { justify-content: flex-start; }
}
