:root {
  --os-text: #2F3F52;
  --os-accent: #84BC2A;
  --os-accent-hover: #6FBA11;
  --os-blue: #3FAFE8;
  --os-blue-deep: #277CC6;
  --os-road: #394C60;
  --os-bg: #F4F6F8;
  --os-white: #FFFFFF;
  --os-light-green: #A7D42D;
  --os-dark-green: #6FBA11;
  --os-border: #D7DEE5;
  --os-shadow: 0 14px 40px rgba(47, 63, 82, 0.08);
  --os-shadow-soft: 0 20px 60px rgba(47, 63, 82, 0.12);
  --os-radius: 28px;
  --os-max: 1280px;
}
html { scroll-behavior: smooth; }
body { margin:0; color:var(--os-text); background:#fff; font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.os-page, .os-page * { box-sizing:border-box; }
.os-page img { max-width:100%; display:block; }
.os-wrap { max-width:var(--os-max); margin:0 auto; padding:0 24px; }
.os-card { background:#fff; border:1px solid #E3E8EE; border-radius:var(--os-radius); box-shadow:var(--os-shadow); }
.os-badge { display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px; background:#fff; border:1px solid #E3E8EE; box-shadow:var(--os-shadow); font-size:14px; }
.os-dot { width:10px; height:10px; border-radius:999px; background:var(--os-accent); }
.os-btn { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; border-radius:999px; padding:14px 22px; font-weight:700; transition:.2s ease; }
.os-btn--primary { background:var(--os-accent); color:#fff; }
.os-btn--primary:hover { background:var(--os-accent-hover); color:#fff; }
.os-btn--secondary { background:#fff; color:var(--os-text); border:1px solid var(--os-border); }
.os-header { position:sticky; top:0; z-index:50; background:rgba(255,255,255,.92); backdrop-filter:blur(10px); border-bottom:1px solid rgba(215,222,229,.8); }
.os-header__inner { max-width:var(--os-max); margin:0 auto; padding:14px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.os-logo img { height:48px; width:auto; }
.os-nav { display:flex; align-items:center; gap:28px; font-size:14px; }
.os-nav a, .os-header-actions a { text-decoration:none; }
.os-nav a { color:var(--os-text); }
.os-header-actions { display:flex; align-items:center; gap:12px; }
.os-header-link { display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--os-border); border-radius:999px; padding:10px 16px; font-size:14px; font-weight:600; color:var(--os-text); text-decoration:none; background:#fff; }
.os-hero { position:relative; overflow:hidden; background-image:linear-gradient(rgba(47,63,82,.05) 1px, transparent 1px),linear-gradient(90deg, rgba(47,63,82,.05) 1px, transparent 1px); background-size:36px 36px; }
.os-hero::before { content:""; position:absolute; inset:0 0 auto 0; height:520px; background:radial-gradient(circle at 20% 20%, rgba(63,175,232,.18), transparent 28%),radial-gradient(circle at 80% 0%, rgba(132,188,42,.16), transparent 25%),linear-gradient(180deg, var(--os-bg) 0%, rgba(244,246,248,0) 100%); }
.os-hero__grid { position:relative; display:grid; grid-template-columns:1.08fr .92fr; gap:48px; padding:64px 24px 96px; max-width:var(--os-max); margin:0 auto; }
.os-hero h1 { font-size:clamp(40px,5vw,68px); line-height:1.05; margin:0; font-weight:700; }
.os-hero h1 span { color:var(--os-blue-deep); }
.os-hero__text { max-width:680px; font-size:20px; line-height:1.7; color:#5F6B77; margin-top:24px; }
.os-hero__actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:28px; }
.os-stats { margin-top:40px; display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:20px; max-width:960px; }
.os-stat { aspect-ratio:1/1; min-height:150px; border-radius:24px; border:1px solid #E3E8EE; background:#fff; padding:16px; box-shadow:var(--os-shadow); display:flex; flex-direction:column; }
.os-stat__title { font-size:14px; color:#7B8794; font-weight:700; line-height:1.4; }
.os-stat__text { margin-top:12px; font-size:15px; line-height:1.6; color:#4D5A67; font-weight:600; }
.os-hero-visual { position:relative; border-radius:34px; border:1px solid rgba(255,255,255,.7); background:#fff; box-shadow:var(--os-shadow-soft); padding:16px; }
.os-hero-visual__inner { border-radius:28px; background:linear-gradient(180deg, #F8FBFD 0%, #EEF3F6 100%); padding:16px; }
.os-toolbar { margin-bottom:16px; border-radius:18px; background:#fff; box-shadow:var(--os-shadow); padding:14px 16px; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.os-toolbar__label { font-size:14px; font-weight:700; }
.os-toolbar__sub { font-size:14px; color:#7B8794; margin-top:2px; }
.os-pill { display:inline-flex; align-items:center; justify-content:center; border-radius:999px; padding:6px 12px; font-size:12px; font-weight:700; color:#fff; background:var(--os-accent); }
.os-hero-visual__grid { display:grid; grid-template-columns:.72fr 1.28fr; gap:16px; }
.os-panel { background:#fff; border-radius:24px; box-shadow:var(--os-shadow); padding:16px; }
.os-panel__eyebrow { font-size:14px; font-weight:700; color:#7B8794; margin-bottom:16px; }
.os-list { display:grid; gap:12px; }
.os-list-item { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; border-radius:18px; background:var(--os-bg); }
.os-list-item__left { display:flex; align-items:center; gap:12px; }
.os-list-item__swatch { width:14px; height:14px; border-radius:999px; }
.os-image-stack, .os-mini-grid { display:grid; gap:16px; }
.os-image-card { background:#fff; border-radius:24px; padding:20px; box-shadow:var(--os-shadow); display:flex; flex-direction:column; gap:16px; }
.os-image-card__head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; min-height:72px; }
.os-image-card__title { font-size:18px; font-weight:700; line-height:1.3; }
.os-image-card__sub { font-size:14px; line-height:1.6; color:#6E7A86; margin-top:4px; }
.os-image-card__figure { position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:20px; border:1px solid #E3E8EE; background:#fff; }
.os-image-card__figure img { width:100%; height:100%; }
.os-section { padding:80px 0; }
.os-grid-main { display:grid; gap:24px; grid-template-columns:1.28fr .72fr; }
.os-section-eyebrow { font-size:13px; letter-spacing:.18em; text-transform:uppercase; font-weight:700; color:#98A2AD; }
.os-section-title { margin:10px 0 0; font-size:clamp(30px,3.6vw,46px); line-height:1.15; font-weight:700; }
.os-section-text { margin-top:16px; font-size:19px; line-height:1.75; color:#66727E; }
.os-profile-card { padding:28px; }
.os-profile-grid { display:grid; grid-template-columns:.72fr 1.28fr; gap:16px; margin-top:18px; }
.os-subpanel { background:var(--os-bg); border-radius:24px; padding:20px; }
.os-subpanel__head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; }
.os-side-grid { display:grid; gap:16px; grid-template-columns:1fr; }
.os-info-card { background:#fff; border-radius:24px; border:1px solid #E3E8EE; padding:20px; box-shadow:var(--os-shadow); }
.os-info-card__icon { width:48px; height:48px; border-radius:18px; background:rgba(63,175,232,.12); color:var(--os-blue-deep); display:flex; align-items:center; justify-content:center; margin-bottom:16px; }
.os-info-card__title { font-size:20px; font-weight:700; }
.os-info-card__text { margin-top:8px; font-size:16px; line-height:1.75; color:#66727E; }
.os-features { background:rgba(244,246,248,.7); }
.os-feature-grid { margin-top:48px; display:grid; gap:24px; grid-template-columns:repeat(4,1fr); }
.os-feature-card { background:#fff; border:1px solid #E3E8EE; border-radius:26px; padding:24px; box-shadow:var(--os-shadow); }
.os-feature-card h3 { margin:0; font-size:24px; line-height:1.25; }
.os-feature-card p { margin:12px 0 0; font-size:16px; line-height:1.75; color:#66727E; }
.os-feature-icon { width:56px; height:56px; border-radius:18px; background:rgba(132,188,42,.12); color:var(--os-accent); display:flex; align-items:center; justify-content:center; margin-bottom:20px; }
.os-process { display:grid; gap:40px; grid-template-columns:1.12fr .88fr; }
.os-process-top { display:grid; gap:16px; grid-template-columns:repeat(3,1fr); margin-bottom:20px; }
.os-process-mini { border-radius:24px; padding:20px; background:#F8FAFC; }
.os-process-mini--muted { background:#EDF1F5; }
.os-process-mini__nr { width:40px; height:40px; border-radius:16px; color:#fff; display:inline-flex; align-items:center; justify-content:center; font-weight:700; margin-bottom:12px; }
.os-process-mini h4 { margin:0; font-size:16px; }
.os-process-mini p { margin:8px 0 0; font-size:14px; line-height:1.65; color:#66727E; }
.os-process-gallery { background:var(--os-bg); border-radius:26px; padding:16px; }
.os-process-gallery__grid { display:grid; gap:16px; grid-template-columns:repeat(3,1fr); }
.os-step-card { background:#fff; border-radius:24px; padding:20px; box-shadow:var(--os-shadow); height:100%; display:flex; flex-direction:column; }
.os-step-card__top { height:152px; margin-bottom:16px; }
.os-step-card__badge { display:inline-flex; border-radius:999px; padding:6px 12px; font-size:12px; font-weight:700; background:var(--os-blue-deep); color:#fff; margin-bottom:12px; }
.os-step-card__title { font-size:20px; font-weight:700; line-height:1.3; }
.os-step-card__sub { font-size:14px; line-height:1.7; color:#66727E; margin-top:8px; max-width:16rem; }
.os-step-card__figure { aspect-ratio:16/9; border-radius:20px; overflow:hidden; border:1px solid #E3E8EE; background:#fff; margin-top:auto; }
.os-steps-list { display:grid; gap:20px; }
.os-step-text { background:#fff; border-radius:26px; border:1px solid #E3E8EE; padding:24px; box-shadow:var(--os-shadow); }
.os-step-text__inner { display:flex; align-items:flex-start; gap:16px; }
.os-step-text__nr { width:56px; height:56px; border-radius:18px; background:var(--os-blue-deep); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:20px; font-weight:700; flex:0 0 auto; }
.os-step-text h3 { margin:0; font-size:24px; }
.os-step-text p { margin:8px 0 0; font-size:16px; line-height:1.75; color:#66727E; }
.os-dark { background:var(--os-text); color:#fff; }
.os-dark-grid { display:grid; gap:48px; grid-template-columns:1fr 1fr; align-items:center; }
.os-dark .os-section-eyebrow, .os-dark .os-section-text { color:rgba(255,255,255,.78); }
.os-dark-features { margin-top:32px; display:grid; gap:16px; grid-template-columns:repeat(3,1fr); }
.os-dark-feature { border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); border-radius:24px; padding:20px; backdrop-filter:blur(6px); }
.os-dark-feature h4 { margin:0; font-size:20px; }
.os-dark-feature p { margin:8px 0 0; font-size:14px; line-height:1.65; color:rgba(255,255,255,.76); }
.os-overlay { border-radius:32px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); box-shadow:0 22px 60px rgba(0,0,0,.2); backdrop-filter:blur(8px); padding:16px; }
.os-overlay__inner { background:#F8FBFD; border-radius:26px; padding:16px; }
.os-overlay__topbar { margin-bottom:16px; border-radius:18px; background:rgba(255,255,255,.9); padding:14px 16px; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.os-overlay-grid { display:grid; gap:16px; grid-template-columns:1.1fr .9fr; }
.os-application-grid { display:grid; gap:40px; grid-template-columns:.9fr 1.1fr; }
.os-checks, .os-demo-points { margin-top:32px; display:grid; gap:16px; }
.os-check { display:flex; align-items:flex-start; gap:12px; border-radius:20px; border:1px solid #E3E8EE; background:#fff; padding:16px 18px; box-shadow:var(--os-shadow); font-size:16px; line-height:1.7; }
.os-check__icon { width:24px; height:24px; flex:0 0 auto; border-radius:999px; background:var(--os-accent); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; margin-top:2px; }
.os-gradient-card { border-radius:30px; padding:24px; background:linear-gradient(135deg, var(--os-bg) 0%, #fff 100%); box-shadow:var(--os-shadow-soft); }
.os-outcomes { margin-top:32px; display:grid; gap:16px; grid-template-columns:repeat(2,1fr); }
.os-outcome { border-radius:24px; background:#fff; padding:20px; box-shadow:var(--os-shadow); }
.os-outcome__title { font-size:28px; font-weight:700; color:var(--os-blue-deep); }
.os-outcome__sub { margin-top:8px; color:#66727E; line-height:1.6; }
.os-cta { padding-bottom:80px; }
.os-cta-box { position:relative; overflow:hidden; border-radius:34px; padding:48px 56px; background:linear-gradient(135deg, var(--os-blue-deep) 0%, var(--os-blue) 55%, var(--os-accent) 150%); }
.os-cta-box::before, .os-cta-box::after { content:""; position:absolute; border-radius:999px; background:rgba(255,255,255,.1); }
.os-cta-box::before { width:176px; height:176px; right:-40px; top:-40px; }
.os-cta-box::after { width:160px; height:160px; left:0; bottom:0; }
.os-cta-grid { position:relative; display:grid; gap:32px; align-items:center; grid-template-columns:1.1fr .9fr; }
.os-cta-box .os-section-eyebrow, .os-cta-box .os-section-title, .os-cta-box .os-section-text { color:#fff; }
.os-cta-box .os-section-text { opacity:.88; }
.os-cta-panel { border-radius:28px; background:rgba(255,255,255,.95); padding:24px; box-shadow:var(--os-shadow-soft); }
.os-cta-panel h3 { margin:0; font-size:24px; }
.os-cta-panel p { margin:8px 0 0; color:#66727E; line-height:1.75; }
.os-cta-actions { margin-top:20px; display:flex; flex-wrap:wrap; gap:12px; }
.os-page-generic { min-height:60vh; background:linear-gradient(180deg, #F8FBFD 0%, #FFFFFF 100%); }
.os-page-card { padding:32px; }
.os-page-content { margin-top:24px; font-size:18px; line-height:1.8; color:#66727E; }
.os-form-card { margin-top:28px; padding:28px; border:1px solid #E3E8EE; border-radius:24px; background:#fff; box-shadow:var(--os-shadow); }
.os-form-card h2 { margin:0; font-size:28px; }
.os-form-card p { color:#66727E; line-height:1.75; }
.os-form-fallback { margin-top:18px; padding:18px; border-radius:18px; background:var(--os-bg); }
.os-footer { border-top:1px solid #E3E8EE; background:#fff; }
.os-footer__inner { max-width:var(--os-max); margin:0 auto; padding:32px 24px; color:#7B8794; font-size:14px; line-height:1.8; }
.os-footer a { color:var(--os-blue-deep); font-weight:600; text-decoration:none; }
@media (max-width:1200px){ .os-feature-grid,.os-dark-features{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:1024px){ .os-nav,.os-header-link{display:none;} .os-hero__grid,.os-grid-main,.os-process,.os-dark-grid,.os-application-grid,.os-cta-grid,.os-profile-grid,.os-overlay-grid,.os-hero-visual__grid{grid-template-columns:1fr;} .os-side-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:768px){ .os-wrap,.os-header__inner,.os-hero__grid,.os-footer__inner{padding-left:18px;padding-right:18px;} .os-hero__grid{gap:32px;padding-top:42px;padding-bottom:64px;} .os-stats,.os-feature-grid,.os-process-top,.os-process-gallery__grid,.os-dark-features,.os-outcomes,.os-side-grid{grid-template-columns:1fr;} .os-stat{aspect-ratio:auto;min-height:120px;} .os-cta-box,.os-page-card{padding:24px 18px;} }