:root { --ink:#1c1c1e; --paper:#fff; --lime:#0a84ff; --green:#0874dc; --line:#e5e7eb; --muted:#62666d; }
* { box-sizing:border-box; }
html { scroll-padding-top:90px; }
body.i24-template { background:var(--paper); color:var(--ink); font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif; }
.i24-template .container { max-width:1440px; padding-right:32px; padding-left:32px; }
.i24-template-header { position:sticky; top:0; z-index:1030; width:100%; background:rgb(255 255 255 / 95%); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.i24-template-header .navbar { min-height:64px; max-width:1440px; margin:auto; padding:12px 32px; }
.i24-template .brand { display:inline-flex; align-items:center; gap:10px; color:var(--ink); font-size:22px; font-weight:700; line-height:1; letter-spacing:-.035em; text-decoration:none; }
.i24-template .brand-mark { display:grid; place-items:center; width:36px; height:36px; overflow:hidden; border-radius:9px; }
.i24-template .brand-mark img { width:100%; height:100%; object-fit:contain; }
.i24-template .nav-link { color:var(--ink)!important; font-size:16px; font-weight:500; }
.i24-template .nav-link:hover { opacity:.65; }
.i24-template .button-dark,.i24-template .button-light { display:inline-block; padding:13px 26px; color:#fff; font-size:14px; font-weight:600; white-space:nowrap; text-decoration:none; background:var(--ink); border:1px solid var(--ink); border-radius:100px; }
.i24-template .button-dark:hover,.i24-template .button-light:hover { color:#fff; background:var(--green); border-color:var(--green); }
.i24-template .navbar .button-dark { padding:9px 18px; font-size:12px; }
.i24-template .language-selector { display:flex; gap:6px; align-items:center; margin:1rem; color:var(--muted); font-size:12px; font-weight:600; }
.i24-template .language-selector a { color:var(--muted); text-decoration:none; }.i24-template .language-selector a:hover,.i24-template .language-selector .is-active { color:var(--ink); }.i24-template .language-selector .is-active { text-decoration:underline; text-underline-offset:3px; }
.i24-template .eyebrow { display:flex; align-items:center; gap:.5rem; color:var(--muted); font-size:14px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }.i24-template .eyebrow::before { display:inline-block; width:7px; height:7px; content:""; background:var(--lime); border-radius:50%; }
.i24-template .hero { padding-top:100px; padding-bottom:100px; }.i24-template .display-title { max-width:780px; font-size:clamp(42px,5.5vw,72px); font-weight:600; line-height:1.08; letter-spacing:-.035em; }.i24-template .display-title em { color:var(--lime); font:inherit; letter-spacing:inherit; }.i24-template .hero-copy { max-width:620px; color:var(--muted); font-size:18px; line-height:1.7; }.i24-template .hero-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }.i24-template .hero-tags span { padding:6px 12px; font-size:12px; border:1px solid var(--line); border-radius:50px; }.i24-template .text-link { color:var(--ink); font-size:14px; font-weight:600; text-decoration:none; }.i24-template .text-link:hover { color:var(--green); }
.i24-template .hero .d-flex { align-items:center; }
.i24-template .app-scene { position:relative; padding:18px; background:radial-gradient(ellipse at 60% 35%,#f7fbff,#edf1f5); border:1px solid var(--line); border-radius:28px; }.i24-template .app-scene img { display:block; width:100%; min-height:400px; object-fit:cover; object-position:left top; border:1px solid #d8e0e8; border-radius:18px; box-shadow:0 28px 36px -20px #23384b45; }.i24-template .app-caption { display:block; margin-top:14px; color:#7b8794; font-size:11px; text-align:center; letter-spacing:.03em; }
.i24-template .app-scene .hero-video { display:block; width:100%; aspect-ratio:16 / 9; object-fit:contain; background:#111; border:1px solid #d8e0e8; border-radius:18px; box-shadow:0 28px 36px -20px #23384b45; }.i24-template .hero-video-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:16px 0 4px; color:var(--muted); font-size:12px; font-weight:600; }.i24-template .hero-video-controls select { max-width:68%; padding:8px 30px 8px 10px; color:var(--ink); font:inherit; background:#fff; border:1px solid var(--line); border-radius:8px; }
.i24-template .word-band { padding:1.15rem 0; color:var(--muted); line-height:2.2; text-align:center; background:#f7f8fa; border-block:1px solid var(--line); }.i24-template .word-band span { margin:0 16px; color:var(--muted); font-size:14px; font-weight:500; letter-spacing:.08em; }
.i24-template .section { padding-top:96px; padding-bottom:96px; }.i24-template .section-title { font-size:clamp(32px,4vw,48px); font-weight:600; line-height:1.15; letter-spacing:-.025em; }.i24-template .section-copy { color:var(--muted); font-size:17px; line-height:1.75; }.i24-template .step-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.i24-template .step { padding:20px; background:#f8f9fb; border:1px solid var(--line); border-radius:16px; }.i24-template .step-number { color:var(--green); font-size:.78rem; font-weight:800; letter-spacing:.1em; }.i24-template .step h3 { font-size:19px; font-weight:600; letter-spacing:-.015em; }.i24-template .step .section-copy { font-size:15px; }
.i24-template .photo-tile { width:100%; height:100%; min-height:500px; object-fit:cover; border-radius:24px; }.i24-template .feature-card { height:100%; padding:30px; background:#fff; border:1px solid var(--line); border-radius:24px; }.i24-template .feature-icon { display:flex; align-items:center; justify-content:center; width:40px; height:40px; color:var(--green); font-size:1.2rem; background:#eef6ff; border-radius:50%; }.i24-template .feature-card h3 { margin-top:24px; font-size:20px; font-weight:600; letter-spacing:-.02em; }.i24-template .feature-card p { margin-bottom:0; color:var(--muted); font-size:15px; line-height:1.6; }
.i24-template .numbers { padding:2.25rem; background:#f7f8fa; border:1px solid var(--line); border-radius:24px; }.i24-template .numbers-title { font-size:34px; font-weight:600; line-height:1.2; letter-spacing:-.025em; }.i24-template .number { padding-top:1.1rem; border-top:1px solid var(--line); }.i24-template .number strong { display:block; color:var(--lime); font-size:30px; font-weight:600; letter-spacing:-.025em; }.i24-template .number span { color:var(--muted); font-size:.9rem; }
.i24-template .demo-card { height:100%; padding:20px; background:#fff; border:1px solid var(--line); border-radius:24px; }.i24-template .demo-card video { display:block; width:100%; aspect-ratio:16 / 9; object-fit:cover; background:#111; border-radius:14px; }.i24-template .demo-card h2 { margin:20px 0 8px; font-size:20px; font-weight:600; letter-spacing:-.02em; }.i24-template .demo-card p { margin-bottom:0; color:var(--muted); font-size:15px; line-height:1.6; }.i24-template .demo-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; color:var(--muted); font-size:12px; font-weight:600; }.i24-template .demo-controls select { max-width:70%; padding:8px 30px 8px 10px; color:var(--ink); font:inherit; background:#f8f9fb; border:1px solid var(--line); border-radius:8px; }
.i24-template .pricing-card { display:flex; flex-direction:column; height:100%; padding:32px; background:#fff; border:1px solid var(--line); border-radius:24px; }.i24-template .pricing-card-featured { border-color:#b8d7f3; background:#f5faff; box-shadow:0 20px 50px -35px #17394b; }.i24-template .pricing-plan { margin-bottom:14px; color:var(--ink); font-size:22px; font-weight:700; letter-spacing:-.025em; }.i24-template .pricing-plan span { display:inline-block; margin-left:8px; padding:4px 8px; color:var(--green); font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; vertical-align:middle; background:#e8f5ff; border-radius:50px; }.i24-template .pricing-price { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; margin-bottom:12px; }.i24-template .pricing-price strong { color:var(--ink); font-size:34px; line-height:1; letter-spacing:-.05em; }.i24-template .pricing-price span { color:var(--muted); font-size:14px; }.i24-template .best-for { margin:0 0 18px; padding-top:12px; color:var(--muted); font-size:14px; border-top:1px solid var(--line); }.i24-template .best-for strong { color:var(--ink); }.i24-template .pricing-features { display:grid; gap:12px; padding:0; margin:28px 0 32px; color:var(--muted); font-size:15px; line-height:1.45; list-style:none; }.i24-template .pricing-features li { position:relative; padding-left:24px; }.i24-template .pricing-features li::before { position:absolute; left:0; color:var(--green); content:"✓"; font-weight:700; }.i24-template .pricing-card .button-dark { margin-top:auto; align-self:flex-start; }
.i24-template .calculator-link { display:inline-block; margin-top:auto; margin-bottom:16px; background:none; border:0; padding:0; cursor:pointer; }.i24-template .calculator-modal .modal-content { border:1px solid var(--line); border-radius:24px; }.i24-template .calculator-modal .modal-header { border-bottom:1px solid var(--line); padding:24px 28px; }.i24-template .calculator-modal .modal-body { padding:26px 28px 30px; }.i24-template .calculator-modal .modal-title { font-size:24px; font-weight:600; letter-spacing:-.025em; }.i24-template .calculator-service { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:20px 0; }.i24-template .calculator-service button,.i24-template .calculator-stepper button { border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font:inherit; font-weight:600; cursor:pointer; }.i24-template .calculator-service button { min-height:42px; padding:8px; }.i24-template .calculator-service button[aria-pressed="true"] { color:var(--green); border-color:#b8d7f3; background:#f5faff; }.i24-template .calculator-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 0; border-top:1px solid var(--line); font-size:14px; font-weight:600; }.i24-template .calculator-stepper { display:flex; align-items:center; gap:6px; }.i24-template .calculator-stepper button { width:30px; height:30px; font-size:18px; line-height:1; }.i24-template .calculator-stepper input { width:52px; height:30px; color:var(--ink); text-align:center; border:1px solid var(--line); border-radius:7px; }.i24-template .calculator-result { margin-top:18px; padding:18px; color:#fff; background:var(--ink); border-radius:14px; }.i24-template .calculator-result span,.i24-template .calculator-result small { display:block; opacity:.7; font-size:12px; }.i24-template .calculator-result output { display:block; font-size:32px; font-weight:600; letter-spacing:-.035em; }.i24-template .calculator-note { margin:14px 0 0; color:var(--muted); font-size:13px; }
.i24-template .contact-modal .modal-content { border:1px solid var(--line); border-radius:24px; }.i24-template .contact-modal .modal-header { padding:24px 28px; border-bottom:1px solid var(--line); }.i24-template .contact-modal .modal-body { padding:26px 28px 30px; color:var(--muted); font-size:16px; line-height:1.65; }.i24-template .contact-modal .modal-title { font-size:24px; font-weight:600; letter-spacing:-.025em; }.i24-template .contact-modal a { color:var(--green); font-weight:600; }
.i24-template .final { max-width:none; padding:80px max(32px,calc((100vw - 1376px)/2)); margin-bottom:0; background:#f5f7fa; border-block:1px solid var(--line); }.i24-template .final h2 { max-width:800px; font-size:clamp(32px,4vw,48px); font-weight:600; line-height:1.15; letter-spacing:-.025em; }.i24-template .final-copy { max-width:680px; }.i24-template footer { padding-top:32px; padding-bottom:32px; color:var(--muted); font-size:12px; }.i24-template .legal-footer { display:flex; flex-wrap:wrap; gap:12px 20px; justify-content:space-between; }.i24-template .legal-links { display:inline-flex; flex-wrap:wrap; gap:12px; }.i24-template .legal-footer a { color:inherit; text-decoration:none; }.i24-template .legal-footer a:hover { color:var(--ink); text-decoration:underline; text-underline-offset:3px; }.i24-template a:focus-visible { outline:3px solid var(--lime); outline-offset:4px; }
@media(min-width:992px) { .i24-template main#top > .hero > .row > .col-lg-7 { flex:0 0 auto; width:54.16666667%; }.i24-template main#top > .hero > .row > .col-lg-5 { flex:0 0 auto; width:45.83333333%; } }
@media(max-width:991px) { .i24-template .hero,.i24-template .section { padding-top:64px; padding-bottom:64px; }.i24-template .app-scene { max-width:520px; margin:auto; }.i24-template .photo-tile { height:460px; min-height:0; } }
@media(max-width:575px) { .i24-template .hero,.i24-template .section { padding-top:48px; padding-bottom:48px; }.i24-template .step-cards { grid-template-columns:1fr; }.i24-template .photo-tile { height:320px; }.i24-template .pricing-card { padding:28px; }.i24-template .final { padding-top:48px; padding-bottom:48px; }.i24-template .language-selector { margin:1rem 0; } }