:root{
  --bg:#f5f7fb;
  --bg-soft:#eef3f8;
  --surface:#ffffff;
  --surface-strong:#f9fbff;
  --ink:#0b1530;
  --ink-2:#13203b;
  --muted:#536174;
  --line:#d8e0ea;
  --line-strong:#c2cfdd;
  --blue:#1552a3;
  --blue-2:#0f3d7a;
  --green:#10a66a;
  --green-2:#0c7f54;
  --gold:#f3bd2e;
  --red:#d92d20;
  --shadow:0 18px 50px rgba(11,21,48,.10);
  --shadow-soft:0 8px 24px rgba(11,21,48,.07);
  --radius:24px;
  --radius-sm:16px;
  --container:1160px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at 12% -8%, rgba(21,82,163,.13), transparent 30%),
    radial-gradient(circle at 92% 2%, rgba(16,166,106,.10), transparent 26%),
    linear-gradient(180deg,#f7f9fc 0%,#f2f5f9 100%);
  line-height:1.58;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
p,ul,ol{margin-top:0}
h1,h2,h3,h4{margin:0 0 .75rem;line-height:1.08;color:var(--ink)}
h1{font-size:clamp(2.55rem,6.2vw,5.65rem);letter-spacing:-.065em;max-width:11ch}
h2{font-size:clamp(1.95rem,3.5vw,3.65rem);letter-spacing:-.045em;max-width:13ch}
h3{font-size:1.35rem;letter-spacing:-.02em}
h4{font-size:1rem;text-transform:uppercase;letter-spacing:.08em;color:var(--blue)}
strong{font-weight:850;color:var(--ink)}
small{color:var(--muted)}

.container{width:min(calc(100% - 2rem),var(--container));margin-inline:auto}
.section{padding:5.5rem 0}
.section.compact{padding:3.75rem 0}
.section.light{background:rgba(255,255,255,.68);border-block:1px solid rgba(216,224,234,.85)}
.section.dark{background:linear-gradient(135deg,#081020,#102b56 68%,#1552a3);color:#fff}
.section.dark h2,.section.dark h3,.section.dark p,.section.dark strong{color:#fff}
.section.dark .muted{color:#cbd5e1}
.skip-link{position:absolute;left:-9999px;top:auto}
.skip-link:focus{left:1rem;top:1rem;z-index:99;background:#fff;padding:.75rem 1rem;border-radius:12px;box-shadow:var(--shadow)}

.site-header{position:sticky;top:0;z-index:40;background:rgba(247,249,252,.91);backdrop-filter:blur(14px);border-bottom:1px solid rgba(216,224,234,.95)}
.header-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:1.25rem}
.brand{display:inline-flex;align-items:center;gap:.8rem;font-weight:900}
.brand img{height:44px;width:auto}
.site-nav{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;justify-content:flex-end}
.nav-link{display:inline-flex;align-items:center;min-height:40px;padding:.55rem .82rem;border-radius:999px;color:var(--ink-2);font-weight:780;border:1px solid transparent;white-space:nowrap}
.nav-link:hover{background:#fff;border-color:var(--line);box-shadow:var(--shadow-soft)}
.nav-link.active{background:#e8f1ff;color:var(--blue);border-color:#cfe1fb}
.nav-cta{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:.65rem 1rem;border-radius:999px;background:linear-gradient(135deg,var(--green),var(--green-2));color:#fff;font-weight:850;box-shadow:0 12px 30px rgba(16,166,106,.20);white-space:nowrap}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 18px 42px rgba(16,166,106,.25)}

.button{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:52px;padding:.9rem 1.2rem;border-radius:999px;border:1px solid transparent;background:linear-gradient(135deg,var(--green),var(--green-2));color:#fff;font-weight:850;box-shadow:0 14px 34px rgba(16,166,106,.22);transition:transform .18s ease,box-shadow .18s ease}
.button:hover{transform:translateY(-1px);box-shadow:0 20px 44px rgba(16,166,106,.26)}
.button.secondary{background:#fff;color:var(--ink);border-color:var(--line);box-shadow:var(--shadow-soft)}
.button.secondary:hover{box-shadow:var(--shadow)}
.button.blue{background:linear-gradient(135deg,var(--blue),var(--blue-2));box-shadow:0 14px 34px rgba(21,82,163,.20)}
.button.light{background:#fff;color:var(--ink);box-shadow:none}
.button-row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.45rem}

.hero{padding:5.2rem 0 4.8rem;position:relative;overflow:hidden}
.hero.compact{padding:4.4rem 0 3.8rem}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(380px,.9fr);gap:2.2rem;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:.55rem;margin-bottom:1rem;padding:.5rem .85rem;border-radius:999px;background:#e8f1ff;color:var(--blue-2);border:1px solid #cfe1fb;font-weight:850;letter-spacing:.01em}
.eyebrow::before{content:"";width:.65rem;height:.65rem;border-radius:999px;background:var(--green);box-shadow:0 0 0 5px rgba(16,166,106,.13)}
.lead{font-size:clamp(1.12rem,1.8vw,1.35rem);color:var(--ink-2);max-width:66ch}
.hero-copy > p:not(.lead){max-width:68ch;color:var(--muted)}
.hero-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin-top:1.35rem}
.hero-point{background:#fff;border:1px solid var(--line);border-radius:16px;padding:.85rem;box-shadow:var(--shadow-soft)}
.hero-point strong{display:block;font-size:.98rem;margin-bottom:.15rem}.hero-point span{display:block;font-size:.92rem;color:var(--muted);line-height:1.35}

.product-panel{background:linear-gradient(180deg,#fff,#f8fbff);border:1px solid var(--line);border-radius:30px;box-shadow:var(--shadow);padding:1.25rem;position:relative;overflow:hidden}
.product-panel::before{content:"";position:absolute;inset:0 0 auto 0;height:7px;background:linear-gradient(90deg,var(--gold),var(--green),var(--blue))}
.panel-toolbar{display:flex;gap:.45rem;margin-bottom:1rem}.dot{width:.7rem;height:.7rem;border-radius:999px;background:#d7dee8}.dot:nth-child(1){background:#ef4444}.dot:nth-child(2){background:#f59e0b}.dot:nth-child(3){background:#22c55e}
.screen-title{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--line);padding-bottom:.9rem;margin-bottom:1rem}.screen-title strong{font-size:1.1rem}.status-pill{display:inline-flex;align-items:center;border-radius:999px;padding:.36rem .6rem;background:#eaf7ef;color:#0f7b51;font-weight:850;font-size:.82rem}
.workflow-list{display:grid;gap:.78rem}.workflow-item{display:grid;grid-template-columns:2.1rem 1fr;gap:.8rem;align-items:start;background:#fff;border:1px solid var(--line);border-radius:18px;padding:.8rem}.workflow-number{width:2.1rem;height:2.1rem;border-radius:999px;display:grid;place-items:center;background:#e8f1ff;color:var(--blue);font-weight:900}.workflow-item p{margin:0;color:var(--muted);font-size:.94rem}.workflow-item strong{display:block;margin-bottom:.1rem}.mini-output{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem;margin-top:1rem}.mini-output div{background:#f1f5f9;border:1px solid #dbe4ef;border-radius:14px;padding:.75rem;text-align:center;font-weight:850;font-size:.9rem;color:var(--ink-2)}

.section-head{max-width:760px;margin-bottom:2.2rem}.section-head.center{text-align:center;margin-inline:auto}.section-head p{color:var(--muted);font-size:1.05rem}.kicker{font-weight:900;color:var(--blue);text-transform:uppercase;letter-spacing:.08em;font-size:.88rem;margin-bottom:.65rem}
.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.card-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.card-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.35rem;box-shadow:var(--shadow-soft)}.card p{color:var(--muted);margin-bottom:0}.card .icon{width:2.6rem;height:2.6rem;border-radius:14px;display:grid;place-items:center;background:#e8f1ff;color:var(--blue);font-weight:900;margin-bottom:.85rem}.card.green .icon{background:#e8f8ef;color:var(--green-2)}.card.gold .icon{background:#fff6df;color:#9a6a00}.card.red .icon{background:#fff0ee;color:var(--red)}

.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.92fr);gap:1.35rem;align-items:start}.split.reverse{grid-template-columns:minmax(360px,.92fr) minmax(0,1fr)}.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow-soft)}.panel.blue{background:linear-gradient(180deg,#ffffff,#f0f6ff);border-color:#cfe1fb}.panel.green{background:linear-gradient(180deg,#ffffff,#eefaf4);border-color:#ccebdc}.panel.dark-panel{background:#0f1e3a;color:#e9eef7;border-color:#294166}.panel.dark-panel h3,.panel.dark-panel strong{color:#fff}.panel.dark-panel p,.panel.dark-panel li{color:#d8e0ea}

.compare{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.compare-col{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.35rem;box-shadow:var(--shadow-soft)}.compare-col.bad{border-color:#ead3d0;background:#fff8f7}.compare-col.good{border-color:#ccebdc;background:#f7fffa}.compare h3{display:flex;gap:.5rem;align-items:center}.compare ul,.plain-list,.check-list,.numbered-cards,.tag-list{list-style:none;padding:0;margin:0}.compare li{padding:.55rem 0;border-top:1px solid rgba(216,224,234,.7);color:var(--muted)}.compare li:first-child{border-top:0}

.check-list{display:grid;gap:.85rem}.check-list li{position:relative;padding-left:1.65rem;color:var(--muted)}.check-list li::before{content:"";position:absolute;left:0;top:.42rem;width:.8rem;height:.8rem;border-radius:999px;background:linear-gradient(135deg,var(--green),var(--blue))}.plain-list{display:grid;gap:.8rem}.plain-list li{padding:.9rem 1rem;background:#fff;border:1px solid var(--line);border-radius:16px}.plain-list strong{display:block;margin-bottom:.15rem}.plain-list span{color:var(--muted)}

.output-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.output-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:1rem;box-shadow:var(--shadow-soft)}.output-card h3{font-size:1.08rem;margin-bottom:.35rem}.output-card p{color:var(--muted);margin:0;font-size:.96rem}

.process{display:grid;gap:1rem}.process-step{display:grid;grid-template-columns:3rem 1fr;gap:1rem;background:#fff;border:1px solid var(--line);border-radius:20px;padding:1rem;box-shadow:var(--shadow-soft)}.process-step .num{width:3rem;height:3rem;border-radius:999px;background:linear-gradient(135deg,var(--blue),var(--blue-2));color:#fff;display:grid;place-items:center;font-weight:950}.process-step p{margin:0;color:var(--muted)}

.numbered-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.numbered-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow-soft);display:grid;grid-template-columns:3rem 1fr;gap:1rem}.numbered-card .num{width:3rem;height:3rem;border-radius:999px;background:#e8f1ff;color:var(--blue);display:grid;place-items:center;font-weight:950}.numbered-card p{margin:0;color:var(--muted)}

.branch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.branch-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:1.1rem;box-shadow:var(--shadow-soft)}.branch-card p{margin:0;color:var(--muted)}.tag-list{display:flex;flex-wrap:wrap;gap:.6rem}.tag-list li{padding:.55rem .8rem;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:780;color:var(--ink-2)}

.cta-box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.5rem;align-items:center;background:linear-gradient(135deg,#0b1530,#1552a3);border-radius:30px;padding:2rem;color:#fff;box-shadow:var(--shadow)}.cta-box h2{color:#fff;max-width:16ch}.cta-box p{color:#dbeafe;margin-bottom:0;max-width:68ch}.cta-actions{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:flex-end}

.demo-card{background:#fff;border:1px solid var(--line);border-radius:30px;padding:1.6rem;box-shadow:var(--shadow)}.demo-card dl{display:grid;grid-template-columns:9rem 1fr;gap:.8rem 1rem;margin:0}.demo-card dt{font-weight:900;color:var(--ink)}.demo-card dd{margin:0;color:var(--muted)}.contact-box{background:#fff;border:1px solid var(--line);border-radius:24px;padding:1.35rem;box-shadow:var(--shadow-soft)}.contact-box a{color:var(--blue);font-weight:850}

.legal-links{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1rem}.legal-links a{padding:.55rem .8rem;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--blue);font-weight:800;font-size:.92rem}

.site-footer{background:#081020;color:#dbe4ef;padding:2.7rem 0}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:1.5rem}.footer-logo{height:38px;width:auto;margin-bottom:.85rem}.site-footer p{color:#cbd5e1;max-width:42ch}.footer-links{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}.footer-links a{color:#cbd5e1}.footer-links a:hover{color:#fff}.footer-title{font-weight:900;color:#fff;margin-bottom:.7rem}.copyright{border-top:1px solid rgba(255,255,255,.12);margin-top:2rem;padding-top:1rem;color:#94a3b8;font-size:.92rem}

@media (max-width:1040px){
  .hero-grid,.split,.split.reverse,.cta-box,.footer-grid{grid-template-columns:1fr}
  h1{max-width:13ch}.card-grid.four,.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.output-grid,.branch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cta-actions{justify-content:flex-start}
}
@media (max-width:780px){
  .header-inner{align-items:flex-start;flex-direction:column;padding:1rem 0}.site-nav{justify-content:flex-start;width:100%}.nav-link{padding:.5rem .7rem}.nav-cta{width:100%;margin-top:.25rem}.hero{padding-top:3.5rem}.section{padding:4rem 0}.hero-points,.card-grid,.card-grid.two,.card-grid.four,.compare,.output-grid,.numbered-cards,.branch-grid,.mini-output{grid-template-columns:1fr}.demo-card dl{grid-template-columns:1fr}.button-row,.cta-actions{flex-direction:column}.button{width:100%}h1{font-size:clamp(2.4rem,12vw,4rem)}
}