:root {
  --sapl-primary: #0aa684;
  --sapl-primary-dark: #063b57;
  --sapl-accent: #14b88f;
  --sapl-bg: #f5f8f8;
  --sapl-ink: #08263a;
  --sapl-muted: #5f7280;
  --sapl-line: rgba(8, 38, 58, .12);
  --sapl-white: #fff;
  --sapl-radius-sm: 14px;
  --sapl-radius: 24px;
  --sapl-radius-lg: 36px;
  --sapl-shadow: 0 22px 70px rgba(8, 38, 58, .12);
  --sapl-shadow-soft: 0 14px 40px rgba(8, 38, 58, .08);
  --sapl-container: 1180px;
  --sapl-header-offset: 14px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--sapl-ink);
  background: #fff;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.sapl-menu-open { overflow: hidden; }
body.admin-bar { --sapl-header-offset: 46px; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button, input, textarea { font: inherit; }
button { color: inherit; }
.sapl-icon { width: 24px; height: 24px; flex: 0 0 auto; }
.sapl-container { width: min(calc(100% - 40px), var(--sapl-container)); margin-inline: auto; }
.sapl-main { overflow: clip; }
.sapl-section { position: relative; padding: 112px 0; }
.sapl-skip-link { position: fixed; top: -100px; left: 18px; z-index: 9999; padding: 10px 16px; color: #fff; background: var(--sapl-primary-dark); border-radius: 10px; }
.sapl-skip-link:focus { top: 12px; }

.sapl-header {
  position: fixed;
  top: var(--sapl-header-offset);
  right: 0;
  left: 0;
  z-index: 1000;
  border-bottom: 1px solid transparent;
  transition: background .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.sapl-header.is-scrolled { background: rgba(255,255,255,.92); backdrop-filter: blur(18px); border-color: var(--sapl-line); box-shadow: 0 10px 35px rgba(8,38,58,.06); }
.sapl-header__inner { display: flex; align-items: center; min-height: 84px; gap: 28px; }
.sapl-brand { display: inline-flex; align-items: center; gap: 12px; min-width: 250px; }
.sapl-brand img { width: 48px; height: 52px; object-fit: contain; }
.sapl-brand span { display: flex; flex-direction: column; line-height: 1.08; }
.sapl-brand strong { font-size: 18px; letter-spacing: .06em; color: var(--sapl-primary-dark); }
.sapl-brand small { max-width: 220px; margin-top: 5px; color: var(--sapl-muted); font-size: 10px; line-height: 1.25; text-transform: uppercase; letter-spacing: .04em; }
.sapl-nav { display: flex; align-items: center; justify-content: center; gap: 26px; margin-left: auto; }
.sapl-nav > a { position: relative; font-size: 14px; font-weight: 700; color: #294758; }
.sapl-nav > a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 2px; background: var(--sapl-primary); transition: right .2s ease; }
.sapl-nav > a:hover::after, .sapl-nav > a:focus-visible::after { right: 0; }
.sapl-header__actions { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.sapl-header__login { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 9px 14px; color: var(--sapl-primary-dark); background: rgba(255,255,255,.86); border: 1px solid rgba(6,59,87,.17); border-radius: 999px; font-size: 13px; font-weight: 850; white-space: nowrap; box-shadow: 0 8px 22px rgba(8,38,58,.07); transition: transform .2s ease, color .2s ease, border-color .2s ease, background .2s ease; }
.sapl-header__login .sapl-icon { width: 18px; height: 18px; color: var(--sapl-primary); }
.sapl-header__login:hover { transform: translateY(-2px); color: var(--sapl-primary); background: #fff; border-color: rgba(10,166,132,.35); }
.sapl-header__cta { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; flex: 0 0 auto; padding: 10px 17px; color: #fff; background: var(--sapl-primary-dark); border-radius: 999px; font-size: 13px; font-weight: 800; white-space: nowrap; box-shadow: 0 10px 24px rgba(6,59,87,.18); transition: transform .2s ease, background .2s ease; }
.sapl-header__cta:hover { transform: translateY(-2px); background: var(--sapl-primary); }
.sapl-nav__actions { display: none; }
.sapl-menu-toggle { display: none; align-items: center; justify-content: center; width: 46px; height: 46px; margin-left: auto; padding: 0; background: #fff; border: 1px solid var(--sapl-line); border-radius: 14px; cursor: pointer; }
.sapl-menu-toggle__close { display: none; }
.sapl-menu-open .sapl-menu-toggle__open { display: none; }
.sapl-menu-open .sapl-menu-toggle__close { display: inline-flex; }

.sapl-hero { position: relative; min-height: 840px; padding: 158px 0 92px; background: linear-gradient(125deg, #f9fcfc 0%, #fff 43%, #edf9f6 100%); }
.sapl-hero::before { content: ""; position: absolute; inset: auto -120px -360px 38%; height: 620px; background: radial-gradient(circle, rgba(20,184,143,.14), transparent 64%); pointer-events: none; }
.sapl-hero__grid { display: grid; grid-template-columns: 1.03fr .97fr; align-items: center; gap: 68px; }
.sapl-hero__content { position: relative; z-index: 2; max-width: 660px; }
.sapl-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 19px; color: var(--sapl-primary); font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: .11em; }
.sapl-eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; border-radius: 99px; }
.sapl-eyebrow--light { color: #92f0d6; }
h1, h2, h3 { margin: 0; color: var(--sapl-ink); line-height: 1.06; letter-spacing: -.035em; }
.sapl-hero h1 { max-width: 690px; font-size: clamp(48px, 5.25vw, 78px); }
.sapl-hero__lead { max-width: 650px; margin: 28px 0 0; color: #405b6a; font-size: clamp(19px, 1.8vw, 23px); line-height: 1.52; }
.sapl-hero__actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 34px; }
.sapl-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 14px 22px; border: 1px solid transparent; border-radius: 16px; font-size: 14px; font-weight: 900; line-height: 1.25; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease; }
.sapl-button:hover { transform: translateY(-2px); }
.sapl-button--primary { color: #fff; background: linear-gradient(135deg, var(--sapl-primary), var(--sapl-accent)); box-shadow: 0 16px 35px rgba(10,166,132,.26); }
.sapl-button--primary:hover { box-shadow: 0 20px 45px rgba(10,166,132,.34); }
.sapl-button--ghost { color: var(--sapl-primary-dark); background: rgba(255,255,255,.75); border-color: rgba(6,59,87,.14); box-shadow: 0 8px 28px rgba(8,38,58,.07); }
.sapl-button--outline { width: 100%; color: var(--sapl-primary-dark); background: #fff; border-color: var(--sapl-line); }
.sapl-button--wide { width: 100%; }
.sapl-hero__note { display: flex; align-items: center; gap: 8px; margin: 16px 0 0; color: #6e808b; font-size: 12px; }
.sapl-hero__note .sapl-icon { width: 17px; height: 17px; color: var(--sapl-primary); }
.sapl-hero__badges { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 34px; }
.sapl-mini-proof { display: flex; align-items: flex-start; gap: 10px; min-width: 0; padding: 13px 12px; background: rgba(255,255,255,.75); border: 1px solid rgba(8,38,58,.08); border-radius: 15px; box-shadow: 0 8px 25px rgba(8,38,58,.04); }
.sapl-mini-proof .sapl-icon { width: 21px; height: 21px; margin-top: 1px; color: var(--sapl-primary); }
.sapl-mini-proof div { min-width: 0; }
.sapl-mini-proof strong, .sapl-mini-proof span { display: block; }
.sapl-mini-proof strong { font-size: 12px; line-height: 1.25; }
.sapl-mini-proof span { margin-top: 3px; color: var(--sapl-muted); font-size: 10px; line-height: 1.3; }

.sapl-hero__visual { position: relative; min-height: 600px; display: flex; align-items: center; justify-content: center; }
.sapl-device-orbit { position: absolute; width: 545px; height: 545px; border: 1px solid rgba(10,166,132,.15); border-radius: 50%; }
.sapl-device-orbit::before, .sapl-device-orbit::after { content: ""; position: absolute; inset: 44px; border: 1px dashed rgba(10,166,132,.17); border-radius: 50%; }
.sapl-device-orbit::after { inset: 108px; border-style: solid; opacity: .6; }
.sapl-orbit-dot { position: absolute; width: 13px; height: 13px; background: var(--sapl-accent); border: 4px solid #fff; border-radius: 50%; box-shadow: 0 8px 18px rgba(10,166,132,.32); }
.sapl-orbit-dot--one { top: 72px; left: 77px; }
.sapl-orbit-dot--two { right: 58px; bottom: 110px; }
.sapl-phone { position: relative; z-index: 2; width: 306px; padding: 10px; background: linear-gradient(145deg,#1d2c34,#02080b); border-radius: 48px; box-shadow: 0 45px 90px rgba(3,26,38,.32), inset 0 0 0 1px rgba(255,255,255,.2); transform: rotate(3deg); }
.sapl-phone__notch { position: absolute; z-index: 4; top: 18px; left: 50%; width: 92px; height: 24px; transform: translateX(-50%); background: #071014; border-radius: 0 0 16px 16px; }
.sapl-phone__screen { min-height: 580px; padding: 42px 15px 18px; overflow: hidden; background: #f6f8f8; border-radius: 39px; }
.sapl-appbar { display: flex; align-items: center; gap: 9px; padding: 2px 5px 14px; border-bottom: 1px solid #e5ebeb; }
.sapl-appbar img { width: 30px; height: 33px; object-fit: contain; }
.sapl-appbar div { display: flex; flex-direction: column; }
.sapl-appbar strong { font-size: 13px; }
.sapl-appbar span { color: #7e8d94; font-size: 9px; }
.sapl-app-status { display: flex; flex-direction: column; align-items: center; margin: 16px 0; padding: 17px 12px; background: linear-gradient(135deg,#e8fbf5,#fff); border: 1px solid rgba(10,166,132,.15); border-radius: 21px; text-align: center; }
.sapl-app-status__check { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 8px; color: #fff; background: var(--sapl-primary); border-radius: 50%; box-shadow: 0 10px 22px rgba(10,166,132,.28); }
.sapl-app-status__check .sapl-icon { width: 25px; height: 25px; }
.sapl-app-status strong { font-size: 12px; }
.sapl-app-status span { margin-top: 3px; color: #708189; font-size: 9px; }
.sapl-app-card { display: flex; align-items: center; gap: 10px; margin-top: 9px; padding: 12px; background: #fff; border: 1px solid #edf0f0; border-radius: 14px; box-shadow: 0 7px 16px rgba(8,38,58,.05); }
.sapl-app-card__icon { display: grid; place-items: center; width: 34px; height: 34px; color: var(--sapl-primary); background: #eafaf6; border-radius: 10px; }
.sapl-app-card__icon .sapl-icon { width: 18px; height: 18px; }
.sapl-app-card div { display: flex; flex: 1; flex-direction: column; }
.sapl-app-card strong { font-size: 10px; }
.sapl-app-card small { color: #859399; font-size: 8px; }
.sapl-app-card em { display: grid; place-items: center; color: var(--sapl-primary); }
.sapl-app-card em .sapl-icon { width: 18px; height: 18px; }
.sapl-app-button { width: 100%; margin-top: 17px; padding: 13px; color: #fff; background: var(--sapl-primary); border: 0; border-radius: 13px; font-size: 11px; font-weight: 900; }
.sapl-floating-card { position: absolute; z-index: 4; display: flex; align-items: center; gap: 11px; min-width: 218px; padding: 13px 15px; background: rgba(255,255,255,.94); border: 1px solid rgba(8,38,58,.1); border-radius: 17px; box-shadow: 0 18px 40px rgba(8,38,58,.13); backdrop-filter: blur(14px); }
.sapl-floating-card > span { display: grid; place-items: center; width: 38px; height: 38px; color: #fff; background: var(--sapl-primary); border-radius: 12px; }
.sapl-floating-card > span .sapl-icon { width: 20px; height: 20px; }
.sapl-floating-card div { display: flex; flex-direction: column; }
.sapl-floating-card strong { font-size: 12px; }
.sapl-floating-card small { margin-top: 2px; color: #7b8d96; font-size: 9px; }
.sapl-floating-card--accepted { top: 86px; right: -6px; animation: sapl-float 4.6s ease-in-out infinite; }
.sapl-floating-card--offline { left: -18px; bottom: 94px; animation: sapl-float 5.2s ease-in-out infinite reverse; }
.sapl-floating-card--offline > span { color: var(--sapl-primary-dark); background: #e7f2f5; }
.sapl-hero__glow { position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; }
.sapl-hero__glow--one { top: 130px; right: 9%; width: 300px; height: 300px; background: rgba(20,184,143,.16); }
.sapl-hero__glow--two { left: -80px; bottom: 40px; width: 260px; height: 260px; background: rgba(6,59,87,.08); }
@keyframes sapl-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

.sapl-section-heading { max-width: 720px; margin-bottom: 48px; }
.sapl-section-heading--center { margin-inline: auto; text-align: center; }
.sapl-section-heading--center .sapl-eyebrow { justify-content: center; }
.sapl-section-heading h2 { font-size: clamp(36px, 4vw, 56px); }
.sapl-section-heading p { margin: 20px 0 0; color: var(--sapl-muted); font-size: 18px; line-height: 1.65; }

.sapl-section--problem { background: var(--sapl-bg); }
.sapl-problem-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.sapl-story-card { overflow: hidden; background: #fff; border: 1px solid rgba(8,38,58,.08); border-radius: 24px; box-shadow: var(--sapl-shadow-soft); transition: transform .25s ease, box-shadow .25s ease; }
.sapl-story-card:hover { transform: translateY(-7px); box-shadow: var(--sapl-shadow); }
.sapl-story-card__media { aspect-ratio: 16/9; overflow: hidden; background: #dce4e4; }
.sapl-story-card__media picture, .sapl-story-card__media img { width: 100%; height: 100%; }
.sapl-story-card__media img { object-fit: cover; transition: transform .5s ease; }
.sapl-story-card:hover .sapl-story-card__media img { transform: scale(1.035); }
.sapl-story-card__body { position: relative; padding: 24px 24px 27px; }
.sapl-story-card__number { display: inline-flex; margin-bottom: 15px; color: var(--sapl-primary); font-size: 12px; font-weight: 900; letter-spacing: .12em; }
.sapl-story-card h3 { font-size: 25px; line-height: 1.18; }
.sapl-story-card p { margin: 14px 0 0; color: var(--sapl-muted); font-size: 14px; line-height: 1.65; }

.sapl-section--about { background: #fff; }
.sapl-about-grid { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 86px; }
.sapl-about-visual { position: relative; min-height: 510px; display: flex; align-items: center; justify-content: center; }
.sapl-about-visual::before { content: ""; position: absolute; width: 470px; height: 470px; background: linear-gradient(145deg,#e5fbf5,#d8edf2); border-radius: 42% 58% 61% 39% / 43% 38% 62% 57%; transform: rotate(-7deg); }
.sapl-about-visual__card { position: relative; z-index: 2; width: min(410px,90%); padding: 25px; background: rgba(255,255,255,.95); border: 1px solid rgba(8,38,58,.08); border-radius: 28px; box-shadow: 0 30px 70px rgba(8,38,58,.15); transform: rotate(-2deg); }
.sapl-about-visual__top { display: flex; align-items: center; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--sapl-line); }
.sapl-about-visual__top img { width: 45px; height: 49px; object-fit: contain; }
.sapl-about-visual__top span { padding: 7px 10px; color: var(--sapl-primary); background: #e9faf5; border-radius: 999px; font-size: 10px; font-weight: 900; }
.sapl-about-message { display: flex; align-items: center; gap: 14px; margin-top: 22px; padding: 17px; color: #fff; background: linear-gradient(135deg,var(--sapl-primary-dark),#08775f); border-radius: 18px; }
.sapl-waveform { display: flex; flex: 1; align-items: center; gap: 4px; height: 30px; }
.sapl-waveform i { width: 3px; height: 10px; background: #a9f6df; border-radius: 99px; }
.sapl-waveform i:nth-child(2), .sapl-waveform i:nth-child(6) { height: 20px; }
.sapl-waveform i:nth-child(3), .sapl-waveform i:nth-child(5) { height: 27px; }
.sapl-waveform i:nth-child(4) { height: 15px; }
.sapl-about-message strong { font-size: 11px; }
.sapl-about-attachment { display: flex; align-items: center; gap: 13px; margin-top: 13px; padding: 15px; background: #f3f8f8; border-radius: 16px; }
.sapl-about-attachment > .sapl-icon { color: var(--sapl-primary); }
.sapl-about-attachment div { display: flex; flex-direction: column; }
.sapl-about-attachment strong { font-size: 12px; }
.sapl-about-attachment span { color: #788b94; font-size: 10px; }
.sapl-about-checklist { display: grid; gap: 10px; margin-top: 19px; }
.sapl-about-checklist span { display: flex; align-items: center; gap: 9px; color: #536c78; font-size: 12px; }
.sapl-about-checklist .sapl-icon { width: 18px; height: 18px; color: var(--sapl-primary); }
.sapl-about-content blockquote { margin: 28px 0 0; padding: 22px 24px; color: var(--sapl-primary-dark); background: linear-gradient(135deg,#eefbf7,#f8fcfc); border-left: 4px solid var(--sapl-primary); border-radius: 0 18px 18px 0; font-size: 18px; font-weight: 800; }

.sapl-section--how { background: linear-gradient(180deg,#fff,#f5f9f9); }
.sapl-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; counter-reset: steps; }
.sapl-step { position: relative; padding: 29px 24px 27px; background: #fff; border: 1px solid var(--sapl-line); border-radius: 22px; box-shadow: 0 12px 30px rgba(8,38,58,.06); }
.sapl-step::after { content: ""; position: absolute; top: 44px; right: -19px; width: 20px; height: 1px; background: rgba(10,166,132,.35); }
.sapl-step:last-child::after { display: none; }
.sapl-step__number { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 23px; color: #fff; background: linear-gradient(135deg,var(--sapl-primary),var(--sapl-primary-dark)); border-radius: 14px; font-size: 16px; font-weight: 900; box-shadow: 0 10px 24px rgba(10,166,132,.22); }
.sapl-step h3 { font-size: 21px; line-height: 1.25; }
.sapl-step p { margin: 13px 0 0; color: var(--sapl-muted); font-size: 14px; }

.sapl-section--demo { background: var(--sapl-primary-dark); }
.sapl-demo-grid { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 80px; }
.sapl-demo-copy .sapl-section-heading h2, .sapl-demo-copy .sapl-section-heading p { color: #fff; }
.sapl-demo-copy .sapl-section-heading p { color: #bfd0d7; }
.sapl-demo-play { display: flex; align-items: center; gap: 14px; width: 100%; max-width: 410px; padding: 15px 18px; color: #fff; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); border-radius: 20px; cursor: pointer; text-align: left; transition: background .2s ease, transform .2s ease; }
.sapl-demo-play:hover { background: rgba(255,255,255,.13); transform: translateY(-2px); }
.sapl-demo-play__icon { display: grid; place-items: center; width: 48px; height: 48px; color: var(--sapl-primary-dark); background: #a6f4dc; border-radius: 50%; }
.sapl-demo-play__icon .sapl-icon { width: 27px; height: 27px; }
.sapl-demo-play span:last-child { display: flex; flex-direction: column; }
.sapl-demo-play strong { font-size: 14px; }
.sapl-demo-play small { margin-top: 3px; color: #bdd0d8; font-size: 11px; }
.sapl-demo-transcript { max-width: 500px; margin-top: 24px; padding: 18px 20px; color: #d8e6ea; background: rgba(255,255,255,.06); border-left: 3px solid var(--sapl-primary); border-radius: 0 16px 16px 0; opacity: .72; transition: opacity .3s ease, transform .3s ease; }
.sapl-demo-transcript.is-active { opacity: 1; transform: translateX(6px); }
.sapl-demo-transcript span { color: #8ddfc7; font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .09em; }
.sapl-demo-transcript p { margin: 8px 0 0; font-size: 13px; line-height: 1.7; }
.sapl-demo-report { overflow: hidden; padding: 20px; background: #fff; border: 1px solid rgba(255,255,255,.3); border-radius: 28px; box-shadow: 0 38px 90px rgba(0,0,0,.28); transform: rotate(1.4deg); }
.sapl-demo-report__header { display: flex; align-items: center; gap: 11px; padding-bottom: 16px; border-bottom: 1px solid var(--sapl-line); }
.sapl-demo-report__header img { width: 36px; height: 39px; object-fit: contain; }
.sapl-demo-report__header div { display: flex; flex: 1; flex-direction: column; }
.sapl-demo-report__header strong { font-size: 14px; }
.sapl-demo-report__header span { color: #7a8c94; font-size: 10px; }
.sapl-demo-report__header em { padding: 6px 9px; color: #7b8d95; background: #f1f4f4; border-radius: 99px; font-size: 9px; font-style: normal; font-weight: 900; }
.sapl-demo-progress { height: 5px; margin: 16px 0 18px; overflow: hidden; background: #ecf1f1; border-radius: 99px; }
.sapl-demo-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg,var(--sapl-primary),#5be0bc); border-radius: 99px; transition: width 2.3s ease; }
.sapl-demo-report.is-running .sapl-demo-progress span { width: 100%; }
.sapl-demo-report__items { display: grid; gap: 10px; }
.sapl-report-item { display: flex; align-items: center; gap: 12px; padding: 13px; background: #f6f9f9; border: 1px solid #edf1f1; border-radius: 15px; opacity: .6; transform: translateY(5px); transition: opacity .3s ease, transform .3s ease; }
.sapl-demo-report.is-running .sapl-report-item { opacity: 1; transform: none; }
.sapl-demo-report.is-running .sapl-report-item:nth-child(2) { transition-delay: .35s; }
.sapl-demo-report.is-running .sapl-report-item:nth-child(3) { transition-delay: .7s; }
.sapl-report-item > span { display: grid; place-items: center; width: 32px; height: 32px; color: var(--sapl-primary); background: #e5f8f2; border-radius: 10px; }
.sapl-report-item > span .sapl-icon { width: 18px; height: 18px; }
.sapl-report-item div { display: flex; flex-direction: column; }
.sapl-report-item strong { font-size: 11px; }
.sapl-report-item small { color: #72858d; font-size: 9px; }
.sapl-demo-report__footer { display: flex; align-items: center; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--sapl-line); }
.sapl-demo-report__footer span { display: inline-flex; align-items: center; gap: 5px; color: #667b85; font-size: 9px; }
.sapl-demo-report__footer .sapl-icon { width: 15px; height: 15px; color: var(--sapl-primary); }
.sapl-demo-report__footer button { margin-left: auto; padding: 9px 14px; color: #fff; background: var(--sapl-primary); border: 0; border-radius: 10px; font-size: 9px; font-weight: 900; }

.sapl-card-grid { display: grid; gap: 20px; }
.sapl-card-grid--three { grid-template-columns: repeat(3,1fr); }
.sapl-card-grid--four { grid-template-columns: repeat(4,1fr); }
.sapl-info-card { padding: 31px 28px; background: #fff; border: 1px solid var(--sapl-line); border-radius: 24px; box-shadow: 0 12px 35px rgba(8,38,58,.06); transition: transform .25s ease, border-color .25s ease; }
.sapl-info-card:hover { transform: translateY(-6px); border-color: rgba(10,166,132,.3); }
.sapl-info-card__icon { display: grid; place-items: center; width: 58px; height: 58px; margin-bottom: 25px; color: var(--sapl-primary); background: linear-gradient(135deg,#e8faf5,#eaf3f6); border-radius: 18px; }
.sapl-info-card__icon .sapl-icon { width: 29px; height: 29px; }
.sapl-info-card h3 { font-size: 24px; line-height: 1.22; }
.sapl-info-card p { margin: 15px 0 0; color: var(--sapl-muted); font-size: 14px; }

.sapl-section--dark { color: #fff; background: linear-gradient(145deg,#052e43,#074b5d); }
.sapl-section--dark::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 80% 10%,rgba(20,184,143,.2),transparent 34%), radial-gradient(circle at 15% 90%,rgba(10,166,132,.12),transparent 30%); pointer-events: none; }
.sapl-section--dark .sapl-section-heading { position: relative; }
.sapl-section--dark .sapl-section-heading h2 { color: #fff; }
.sapl-benefit-card { position: relative; padding: 28px 25px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 23px; backdrop-filter: blur(8px); }
.sapl-benefit-card__icon { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: 22px; color: #b3f5df; background: rgba(255,255,255,.09); border-radius: 16px; }
.sapl-benefit-card h3 { color: #fff; font-size: 21px; line-height: 1.25; }
.sapl-benefit-card p { margin: 14px 0 0; color: #bdd0d8; font-size: 13px; }

.sapl-section--offline { background: #f5f9f9; }
.sapl-offline-grid { display: grid; grid-template-columns: 1.04fr .96fr; align-items: center; gap: 86px; }
.sapl-check-list { display: grid; gap: 14px; margin: 28px 0 0; padding: 0; list-style: none; }
.sapl-check-list li { display: flex; align-items: flex-start; gap: 12px; color: #47616e; }
.sapl-check-list .sapl-icon { width: 22px; height: 22px; margin-top: 2px; color: var(--sapl-primary); }
.sapl-queue-card { padding: 25px; background: #fff; border: 1px solid var(--sapl-line); border-radius: 28px; box-shadow: var(--sapl-shadow); }
.sapl-queue-card__header { display: flex; align-items: center; gap: 13px; padding: 6px 5px 21px; border-bottom: 1px solid var(--sapl-line); }
.sapl-queue-card__header > span { display: grid; place-items: center; width: 48px; height: 48px; color: #fff; background: var(--sapl-primary-dark); border-radius: 15px; }
.sapl-queue-card__header div { display: flex; flex-direction: column; }
.sapl-queue-card__header strong { font-size: 14px; }
.sapl-queue-card__header small { color: var(--sapl-muted); font-size: 10px; }
.sapl-queue-item { display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 14px; background: #f5f8f8; border-radius: 15px; }
.sapl-queue-dot { width: 12px; height: 12px; background: #b9c6cb; border: 3px solid #e4ebed; border-radius: 50%; }
.sapl-queue-dot--ready { background: var(--sapl-primary); border-color: #c8f2e5; }
.sapl-queue-dot--loading { background: #e1a82a; border-color: #f6e8bf; }
.sapl-queue-item div { display: flex; flex: 1; flex-direction: column; }
.sapl-queue-item strong { font-size: 12px; }
.sapl-queue-item small { color: #7a8d95; font-size: 9px; }
.sapl-queue-item em { color: #67808c; font-size: 9px; font-style: normal; font-weight: 900; }
.sapl-queue-card__footer { margin-top: 15px; padding: 12px; color: var(--sapl-primary); background: #eafaf5; border-radius: 13px; font-size: 10px; font-weight: 900; text-align: center; }

.sapl-pricing-grid { display: grid; grid-template-columns: repeat(2,minmax(0,460px)); justify-content: center; gap: 24px; }
.sapl-price-card { position: relative; padding: 34px; background: #fff; border: 1px solid var(--sapl-line); border-radius: 26px; box-shadow: 0 16px 45px rgba(8,38,58,.07); }
.sapl-price-card--featured { border-color: rgba(10,166,132,.42); box-shadow: 0 24px 65px rgba(10,166,132,.15); }
.sapl-price-card__badge { display: inline-flex; margin-bottom: 18px; padding: 7px 10px; color: var(--sapl-primary); background: #e8faf5; border-radius: 99px; font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .06em; }
.sapl-price-card h3 { font-size: 28px; }
.sapl-price { display: flex; align-items: flex-end; gap: 8px; margin-top: 16px; }
.sapl-price strong { font-size: 38px; line-height: 1; letter-spacing: -.04em; }
.sapl-price span { color: #758992; font-size: 13px; }
.sapl-price-card > p { min-height: 50px; margin: 18px 0 0; color: var(--sapl-muted); font-size: 14px; }
.sapl-price-card ul { display: grid; gap: 11px; margin: 25px 0 28px; padding: 23px 0 0; border-top: 1px solid var(--sapl-line); list-style: none; }
.sapl-price-card li { display: flex; align-items: flex-start; gap: 9px; color: #405c69; font-size: 13px; }
.sapl-price-card li .sapl-icon { width: 18px; height: 18px; color: var(--sapl-primary); }
.sapl-trial-note { display: flex; justify-content: center; align-items: center; gap: 9px; margin-top: 25px; color: var(--sapl-primary-dark); font-size: 14px; font-weight: 900; }
.sapl-trial-note .sapl-icon { width: 20px; height: 20px; color: var(--sapl-primary); }

.sapl-section--soft { background: var(--sapl-bg); }
.sapl-quote-card { position: relative; padding: 28px; background: #fff; border: 1px solid var(--sapl-line); border-radius: 24px; box-shadow: var(--sapl-shadow-soft); }
.sapl-quote-card__mark { color: var(--sapl-primary); font-family: Georgia,serif; font-size: 52px; line-height: .8; }
.sapl-quote-card blockquote { margin: 12px 0 24px; color: #334f5d; font-size: 15px; }
.sapl-quote-card__author { display: flex; flex-direction: column; padding-top: 17px; border-top: 1px solid var(--sapl-line); }
.sapl-quote-card__author strong { font-size: 13px; }
.sapl-quote-card__author span { color: var(--sapl-muted); font-size: 11px; }

.sapl-testimonials-empty { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px; max-width: 920px; margin: 0 auto; padding: 28px 30px; background: #fff; border: 1px solid var(--sapl-line); border-radius: 24px; box-shadow: var(--sapl-shadow-soft); }
.sapl-testimonials-empty__icon { display: grid; place-items: center; width: 58px; height: 58px; color: #fff; background: linear-gradient(135deg,var(--sapl-primary),var(--sapl-accent)); border-radius: 18px; box-shadow: 0 14px 30px rgba(10,166,132,.22); }
.sapl-testimonials-empty__icon .sapl-icon { width: 29px; height: 29px; }
.sapl-testimonials-empty h3 { margin: 0; color: var(--sapl-primary-dark); font-size: 21px; }
.sapl-testimonials-empty p { max-width: 650px; margin: 7px 0 0; color: var(--sapl-muted); font-size: 14px; }
.sapl-testimonials-empty .sapl-button { white-space: nowrap; }

.sapl-faq-layout { display: grid; grid-template-columns: .8fr 1.2fr; align-items: start; gap: 80px; }
.sapl-faq-heading { position: sticky; top: 120px; }
.sapl-faq-list { border-top: 1px solid var(--sapl-line); }
.sapl-faq-item { border-bottom: 1px solid var(--sapl-line); }
.sapl-faq-item button { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 24px 0; background: transparent; border: 0; cursor: pointer; text-align: left; }
.sapl-faq-item button span { padding-right: 20px; font-size: 18px; font-weight: 800; }
.sapl-faq-item button i { position: relative; width: 24px; height: 24px; flex: 0 0 auto; border: 1px solid var(--sapl-line); border-radius: 50%; }
.sapl-faq-item button i::before, .sapl-faq-item button i::after { content: ""; position: absolute; top: 50%; left: 50%; width: 10px; height: 1px; background: var(--sapl-primary-dark); transform: translate(-50%,-50%); transition: transform .2s ease; }
.sapl-faq-item button i::after { transform: translate(-50%,-50%) rotate(90deg); }
.sapl-faq-item.is-open button i::after { transform: translate(-50%,-50%) rotate(0); }
.sapl-faq-answer { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.sapl-faq-answer p { margin: -4px 0 24px; color: var(--sapl-muted); font-size: 15px; }
.sapl-faq-item.is-open .sapl-faq-answer { max-height: 300px; }

.sapl-section--final { padding: 96px 0; color: #fff; background: linear-gradient(135deg,#052f45 0%,#075f65 55%,#0aa684 100%); }
.sapl-section--final::before { content: ""; position: absolute; inset: 0; opacity: .2; background-image: radial-gradient(circle at 20% 20%,#fff 0 1px,transparent 1px); background-size: 26px 26px; }
.sapl-final-grid { position: relative; display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; gap: 80px; }
.sapl-final-copy h2 { max-width: 620px; color: #fff; font-size: clamp(38px,4.3vw,60px); }
.sapl-final-copy > p { max-width: 560px; margin: 22px 0 0; color: #c8dde2; font-size: 18px; }
.sapl-final-proof { display: flex; align-items: center; gap: 15px; margin-top: 35px; }
.sapl-final-proof img { width: 62px; height: 67px; object-fit: contain; filter: drop-shadow(0 12px 20px rgba(0,0,0,.16)); }
.sapl-final-proof span { display: flex; flex-direction: column; }
.sapl-final-proof strong { font-size: 16px; letter-spacing: .06em; }
.sapl-final-proof small { color: #bcd4da; font-size: 11px; }
.sapl-form-card { padding: 29px; color: var(--sapl-ink); background: rgba(255,255,255,.97); border: 1px solid rgba(255,255,255,.48); border-radius: 28px; box-shadow: 0 35px 80px rgba(0,0,0,.22); }
.sapl-lead-form { display: grid; gap: 15px; }
.sapl-form-row label { display: flex; flex-direction: column; gap: 7px; }
.sapl-form-row label > span { color: #405b69; font-size: 11px; font-weight: 900; }
.sapl-form-row--two { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.sapl-form-row input, .sapl-form-row textarea { width: 100%; padding: 13px 14px; color: var(--sapl-ink); background: #f5f8f8; border: 1px solid #dfe8e8; border-radius: 13px; outline: none; transition: border-color .2s ease, box-shadow .2s ease, background .2s ease; }
.sapl-form-row input:focus, .sapl-form-row textarea:focus { background: #fff; border-color: var(--sapl-primary); box-shadow: 0 0 0 4px rgba(10,166,132,.1); }
.sapl-form-row input.is-invalid, .sapl-form-row textarea.is-invalid { border-color: #c83939; }
.sapl-consent { display: flex; align-items: flex-start; gap: 9px; color: #61757f; font-size: 10px; line-height: 1.45; cursor: pointer; }
.sapl-consent input { width: 15px; height: 15px; margin: 2px 0 0; accent-color: var(--sapl-primary); }
.sapl-consent a { color: var(--sapl-primary); text-decoration: underline; }
.sapl-hp-field { position: absolute !important; left: -9999px !important; opacity: 0 !important; }
.sapl-form-status { min-height: 18px; color: #52707d; font-size: 11px; text-align: center; }
.sapl-form-status.is-success { color: #08795f; }
.sapl-form-status.is-error { color: #b82c2c; }
.sapl-lead-form.is-loading .sapl-button { opacity: .65; pointer-events: none; }

.sapl-footer { padding: 62px 0 24px; color: #d5e2e6; background: #031f2e; }
.sapl-footer__top { display: grid; grid-template-columns: 1.2fr .8fr; gap: 70px; padding-bottom: 42px; }
.sapl-brand--footer strong { color: #fff; }
.sapl-brand--footer small { color: #9fb3bc; }
.sapl-footer__brand > p { max-width: 430px; margin: 18px 0 0; color: #9fb3bc; font-size: 13px; }
.sapl-footer__social { margin-top: 25px; }
.sapl-footer__social-title { display: block; margin-bottom: 11px; color: #d5e2e6; font-size: 12px; letter-spacing: .02em; }
.sapl-footer__social-list { display: flex; flex-wrap: wrap; gap: 10px; }
.sapl-footer__social-link { display: inline-flex; align-items: center; justify-content: center; width: 45px; height: 45px; overflow: hidden; background: rgba(255,255,255,.075); border: 1px solid rgba(255,255,255,.13); border-radius: 14px; box-shadow: 0 10px 28px rgba(0,0,0,.16); transition: transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease; }
.sapl-footer__social-link img { width: 28px; height: 28px; object-fit: contain; }
.sapl-footer__social-link:hover { color: inherit; background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.28); box-shadow: 0 15px 34px rgba(0,0,0,.23); transform: translateY(-3px); }
.sapl-footer__social-link:focus-visible { outline: 3px solid rgba(20,184,143,.55); outline-offset: 3px; }
.sapl-footer__social-link--inactive { cursor: default; opacity: .72; filter: saturate(.78); }
.sapl-footer__social-link--inactive:hover { background: rgba(255,255,255,.075); border-color: rgba(255,255,255,.13); box-shadow: 0 10px 28px rgba(0,0,0,.16); transform: none; }
.sapl-footer__social-link--active img { transition: transform .2s ease; }
.sapl-footer__social-link--active:hover img { transform: scale(1.06); }
.sapl-footer__links { display: grid; grid-template-columns: repeat(2,1fr); gap: 35px; }
.sapl-footer__links > div { display: flex; flex-direction: column; gap: 8px; }
.sapl-footer__links strong { margin-bottom: 6px; color: #fff; font-size: 13px; }
.sapl-footer__links a { color: #9fb3bc; font-size: 12px; transition: color .2s ease; }
.sapl-footer__links a:hover { color: #fff; }
.sapl-footer__bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 21px; color: #7f98a2; border-top: 1px solid rgba(255,255,255,.1); font-size: 11px; }

.sapl-content-page { min-height: 70vh; padding: 140px 0 80px; }
.sapl-cabinet-page .sapl-content-page { min-height: 100vh; padding-top: 0; padding-bottom: 0; }
.sapl-article { max-width: 780px; margin: 0 auto; }
.sapl-article h1 { font-size: 48px; }
.sapl-entry-content { margin-top: 30px; }

.sapl-reveal { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; transition-delay: var(--sapl-delay,0ms); }
.sapl-reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 1180px) {
  .sapl-header__cta:not(.sapl-header__cta--mobile) { display: none; }
  .sapl-nav { gap: 18px; }
}

@media (max-width: 1100px) {
  .sapl-hero__grid { gap: 28px; }
  .sapl-hero__visual { transform: scale(.9); }
  .sapl-steps { grid-template-columns: repeat(2,1fr); }
  .sapl-step::after { display: none; }
  .sapl-card-grid--four { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 782px) {
  body.admin-bar { --sapl-header-offset: 60px; }
}

@media (max-width: 900px) {
  .sapl-section { padding: 88px 0; }
  .sapl-header__inner { min-height: 74px; }
  .sapl-brand { min-width: 0; }
  .sapl-brand small { display: none; }
  .sapl-header__actions { display: none; }
  .sapl-nav { position: fixed; top: calc(var(--sapl-header-offset) + 74px); right: 0; left: 0; display: grid; gap: 0; max-height: calc(100vh - var(--sapl-header-offset) - 74px); overflow-y: auto; padding: 18px 20px 25px; background: #fff; border-top: 1px solid var(--sapl-line); box-shadow: 0 20px 50px rgba(8,38,58,.12); transform: translateY(-130%); transition: transform .25s ease; }
  .sapl-nav > a { padding: 14px 8px; border-bottom: 1px solid var(--sapl-line); }
  .sapl-nav__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-top: 18px; }
  .sapl-nav__actions a { min-height: 48px; padding: 11px 14px; border-bottom: 0; }
  .sapl-header__login--mobile, .sapl-header__cta--mobile { display: inline-flex; width: 100%; }
  .sapl-menu-open .sapl-nav { transform: none; }
  .sapl-menu-toggle { display: inline-flex; }
  .sapl-hero { min-height: auto; padding: 130px 0 72px; }
  .sapl-hero__grid { grid-template-columns: 1fr; }
  .sapl-hero__content { max-width: 760px; text-align: center; }
  .sapl-hero__content .sapl-eyebrow { justify-content: center; }
  .sapl-hero h1, .sapl-hero__lead { margin-inline: auto; }
  .sapl-hero__actions, .sapl-hero__note { justify-content: center; }
  .sapl-hero__badges { max-width: 650px; margin-inline: auto; }
  .sapl-hero__visual { min-height: 580px; transform: scale(.95); }
  .sapl-problem-grid { grid-template-columns: 1fr; }
  .sapl-story-card { display: grid; grid-template-columns: 1fr 1fr; }
  .sapl-story-card__media { aspect-ratio: auto; min-height: 270px; }
  .sapl-about-grid, .sapl-demo-grid, .sapl-offline-grid, .sapl-final-grid { grid-template-columns: 1fr; gap: 54px; }
  .sapl-about-visual { order: 2; }
  .sapl-demo-report { max-width: 650px; margin: 0 auto; }
  .sapl-card-grid--three { grid-template-columns: 1fr; }
  .sapl-testimonials-empty { grid-template-columns: auto 1fr; }
  .sapl-testimonials-empty .sapl-button { grid-column: 1 / -1; width: 100%; }
  .sapl-info-card { display: grid; grid-template-columns: 65px 1fr; gap: 0 18px; }
  .sapl-info-card__icon { grid-row: 1 / span 2; margin-bottom: 0; }
  .sapl-info-card p { margin-top: 9px; }
  .sapl-faq-layout { grid-template-columns: 1fr; gap: 22px; }
  .sapl-faq-heading { position: static; }
  .sapl-footer__top { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .sapl-container { width: min(calc(100% - 28px), var(--sapl-container)); }
  .sapl-section { padding: 72px 0; }
  .sapl-brand strong { font-size: 15px; }
  .sapl-brand img { width: 39px; height: 43px; }
  .sapl-header__inner { min-height: 68px; }
  .sapl-nav { top: calc(var(--sapl-header-offset) + 68px); }
  .sapl-hero { padding-top: 108px; }
  .sapl-hero h1 { font-size: 44px; }
  .sapl-hero__lead { font-size: 18px; }
  .sapl-nav__actions { grid-template-columns: 1fr; }
  .sapl-hero__actions { flex-direction: column; }
  .sapl-button { width: 100%; }
  .sapl-hero__badges { grid-template-columns: 1fr; }
  .sapl-mini-proof { align-items: center; }
  .sapl-hero__visual { min-height: 510px; transform: scale(.78); margin: -45px -30px -58px; }
  .sapl-section-heading { margin-bottom: 34px; }
  .sapl-section-heading h2 { font-size: 36px; }
  .sapl-section-heading p { font-size: 16px; }
  .sapl-story-card { display: block; }
  .sapl-story-card__media { aspect-ratio: 16/9; min-height: 0; }
  .sapl-about-visual { min-height: 410px; }
  .sapl-about-visual::before { width: 350px; height: 350px; }
  .sapl-about-visual__card { padding: 19px; }
  .sapl-steps, .sapl-card-grid--four, .sapl-pricing-grid { grid-template-columns: 1fr; }
  .sapl-demo-grid { gap: 44px; }
  .sapl-demo-report { padding: 15px; border-radius: 21px; }
  .sapl-info-card { display: block; }
  .sapl-info-card__icon { margin-bottom: 20px; }
  .sapl-price-card { padding: 27px 23px; }
  .sapl-testimonials-empty { display: flex; flex-direction: column; align-items: flex-start; padding: 24px 21px; }
  .sapl-testimonials-empty__icon { width: 52px; height: 52px; }
  .sapl-faq-item button span { font-size: 16px; }
  .sapl-final-copy h2 { font-size: 38px; }
  .sapl-form-card { padding: 22px 17px; }
  .sapl-form-row--two { grid-template-columns: 1fr; }
  .sapl-footer__social-link { width: 43px; height: 43px; border-radius: 13px; }
  .sapl-footer__links { grid-template-columns: 1fr 1fr; }
  .sapl-footer__bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .sapl-reveal { opacity: 1; transform: none; }
}