*,*::before,*::after{box-sizing:border-box}

html,body{
  margin:0;padding:0;overflow:auto;height:auto;
  font-family:"Outfit",system-ui,-apple-system,sans-serif;
  font-size:15px;color:#f4f0ff;background:#06040f;
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;
  color-scheme:dark
}

.osago-page{
  min-height:100dvh;
  background:
    radial-gradient(ellipse 80% 50% at 50% -10%,rgba(191,0,255,.12),transparent 55%),
    radial-gradient(ellipse 60% 40% at 100% 20%,rgba(0,240,255,.08),transparent 50%),
    linear-gradient(180deg,#06040f 0%,#0a0520 100%);
  padding:calc(12px + env(safe-area-inset-top)) 14px calc(28px + env(safe-area-inset-bottom))
}

.osago-shell{max-width:640px;margin:0 auto}

.osago-page .site-page-header{margin-bottom:28px}

/* ── Hero ── */
.osago-hero{margin-bottom:24px}
.osago-badge{
  display:inline-block;margin-bottom:14px;padding:6px 12px;border-radius:999px;
  font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  color:#00f0ff;background:rgba(0,240,255,.08);border:1px solid rgba(0,240,255,.22);
  box-shadow:0 0 12px rgba(0,240,255,.15)
}
.osago-hero h1{
  margin:0 0 14px;font-size:clamp(28px,7vw,36px);font-weight:800;line-height:1.1;
  letter-spacing:-.03em
}
.osago-hero-accent{
  background:linear-gradient(135deg,#ff7a00,#ffe600,#39ff14);
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.osago-hero-lead{
  margin:0 0 20px;font-size:15px;line-height:1.55;color:#c4b8e8;max-width:38ch
}
.osago-hero-actions{display:flex;flex-direction:column;gap:10px}
.osago-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:12px 20px;border-radius:14px;
  font-size:14px;font-weight:800;text-decoration:none;text-align:center;
  transition:transform .12s ease,box-shadow .15s ease
}
.osago-btn:active{transform:scale(.98)}
.osago-btn-primary{
  color:#06040f;background:linear-gradient(135deg,#00f0ff,#39ff14);
  box-shadow:0 0 20px rgba(0,240,255,.25),0 0 32px rgba(57,255,20,.12)
}
.osago-btn-ghost{
  color:#c4b8e8;background:rgba(12,8,28,.65);
  border:1px solid rgba(180,120,255,.22)
}

.osago-hero-visual{
  position:relative;display:none;justify-content:center;align-items:center;
  min-height:220px;margin-top:8px
}
.osago-ring-chart{position:relative;width:200px;height:200px}
.osago-ring-svg{width:100%;height:100%;transform:rotate(-90deg)}
.osago-ring-track{fill:none;stroke:rgba(180,120,255,.15);stroke-width:10}
.osago-ring-progress{
  fill:none;stroke:url(#osagoRingGrad);stroke-width:10;stroke-linecap:round;
  stroke-dasharray:578;stroke-dashoffset:115;animation:osagoRingSpin 8s linear infinite
}
@keyframes osagoRingSpin{
  0%{stroke-dashoffset:578}
  50%{stroke-dashoffset:80}
  100%{stroke-dashoffset:578}
}
.osago-ring-center{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:0
}
.osago-ring-value{font-size:42px;font-weight:800;line-height:1;color:#00f0ff;text-shadow:0 0 16px rgba(0,240,255,.45)}
.osago-ring-label{font-size:13px;font-weight:700;color:#9d94b8;text-transform:uppercase;letter-spacing:.08em}
.osago-orbit{
  position:absolute;display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;
  background:rgba(14,10,32,.92);border:1px solid rgba(0,240,255,.25);
  color:#00f0ff;box-shadow:0 0 14px rgba(0,240,255,.2)
}
.osago-orbit-1{top:8%;right:12%;animation:osagoFloat 4s ease-in-out infinite}
.osago-orbit-2{bottom:18%;left:4%;color:#ff7a00;border-color:rgba(255,122,0,.35);animation:osagoFloat 4.5s ease-in-out infinite .5s}
.osago-orbit-3{bottom:8%;right:18%;color:#39ff14;border-color:rgba(57,255,20,.35);animation:osagoFloat 5s ease-in-out infinite 1s}
@keyframes osagoFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}

/* SVG gradient for ring — injected via pseudo in page; use stroke color fallback */
.osago-ring-progress{stroke:#00f0ff}

/* ── Metrics ── */
.osago-metrics{
  display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:32px
}
.osago-metric{
  display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;
  background:rgba(12,8,28,.72);border:1px solid rgba(180,120,255,.12)
}
.osago-metric-icon{
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  width:48px;height:48px;border-radius:14px
}
.osago-metric-icon-cyan{color:#00f0ff;background:rgba(0,240,255,.1);box-shadow:0 0 12px rgba(0,240,255,.15)}
.osago-metric-icon-orange{color:#ff7a00;background:rgba(255,122,0,.1);box-shadow:0 0 12px rgba(255,122,0,.12)}
.osago-metric-icon-green{color:#39ff14;background:rgba(57,255,20,.1);box-shadow:0 0 12px rgba(57,255,20,.12)}
.osago-metric-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.osago-metric-body strong{font-size:18px;font-weight:800;line-height:1.2}
.osago-metric-body span{font-size:12px;color:#9d94b8;line-height:1.35}

/* ── Vehicle types ── */
.osago-vehicle-types{display:grid;grid-template-columns:1fr;gap:10px}
.osago-vehicle-type{
  display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;
  text-decoration:none;color:inherit;
  background:rgba(12,8,28,.72);border:1px solid rgba(180,120,255,.12);
  transition:transform .12s ease,border-color .15s ease,box-shadow .15s ease
}
.osago-vehicle-type:active{transform:scale(.99)}
.osago-vehicle-type:hover{
  border-color:rgba(0,240,255,.28);box-shadow:0 0 16px rgba(0,240,255,.08)
}
.osago-vehicle-type-icon{
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  width:48px;height:48px;border-radius:14px
}
.osago-vehicle-type-car .osago-vehicle-type-icon{
  color:#00f0ff;background:rgba(0,240,255,.1);box-shadow:0 0 12px rgba(0,240,255,.15)
}
.osago-vehicle-type-truck .osago-vehicle-type-icon{
  color:#ff7a00;background:rgba(255,122,0,.1);box-shadow:0 0 12px rgba(255,122,0,.12)
}
.osago-vehicle-type-body{display:flex;flex-direction:column;gap:3px;min-width:0}
.osago-vehicle-type-body strong{font-size:15px;font-weight:800;line-height:1.25}
.osago-vehicle-type-body span{font-size:12px;color:#9d94b8;line-height:1.35}

/* ── Sections ── */
.osago-section{margin-bottom:36px}
.osago-section-head{text-align:center;margin-bottom:20px}
.osago-section-head-left{text-align:left}
.osago-section-head-left .osago-section-lead{margin-left:0;margin-right:0}
.osago-eyebrow{
  margin:0 0 8px;font-size:10px;font-weight:800;text-transform:uppercase;
  letter-spacing:.12em;color:#bf00ff;text-shadow:0 0 8px rgba(191,0,255,.35)
}
.osago-section h2{
  margin:0;font-size:22px;font-weight:800;line-height:1.2;letter-spacing:-.02em
}
.osago-section-lead{
  margin:10px auto 0;max-width:42ch;font-size:14px;line-height:1.5;color:#9d94b8
}

/* ── Steps infographic ── */
.osago-steps{
  list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;position:relative
}
.osago-step{
  position:relative;display:grid;grid-template-columns:48px 1fr;gap:12px 14px;
  padding:18px 16px;border-radius:18px;
  background:rgba(12,8,28,.55);border:1px solid rgba(180,120,255,.1)
}
.osago-step + .osago-step{margin-top:-1px;border-top-color:rgba(180,120,255,.06)}
.osago-step-num{
  grid-row:1/span 2;align-self:start;
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  font-size:14px;font-weight:800;color:#06040f;
  background:linear-gradient(135deg,#00f0ff,#39ff14);
  box-shadow:0 0 12px rgba(0,240,255,.3)
}
.osago-step-icon{
  grid-column:2;color:#00f0ff;opacity:.85;line-height:0
}
.osago-step h3{
  grid-column:2;margin:0;font-size:15px;font-weight:800;line-height:1.3
}
.osago-step p{
  grid-column:2;margin:0;font-size:13px;line-height:1.45;color:#9d94b8
}

/* ── Benefits ── */
.osago-benefits-grid{display:grid;grid-template-columns:1fr;gap:12px}
.osago-benefit{
  padding:18px 16px;border-radius:18px;text-align:center;
  background:rgba(12,8,28,.72);border:1px solid rgba(180,120,255,.12)
}
.osago-benefit-chart{
  position:relative;width:80px;height:80px;margin:0 auto 14px
}
.osago-benefit-chart svg{width:100%;height:100%;transform:rotate(-90deg)}
.osago-benefit-track{fill:none;stroke:rgba(180,120,255,.12);stroke-width:6}
.osago-benefit-fill{
  fill:none;stroke-width:6;stroke-linecap:round;
  stroke-dasharray:213.6;
  stroke-dashoffset:calc(213.6 - (213.6 * var(--pct, 75) / 100))
}
.osago-benefit-fill-cyan{stroke:#00f0ff;filter:drop-shadow(0 0 4px rgba(0,240,255,.5))}
.osago-benefit-fill-orange{stroke:#ff7a00;filter:drop-shadow(0 0 4px rgba(255,122,0,.45))}
.osago-benefit-fill-green{stroke:#39ff14;filter:drop-shadow(0 0 4px rgba(57,255,20,.45))}
.osago-benefit-chart > span{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:800;color:#f4f0ff
}
.osago-benefit-chart-value-green{color:#39ff14;text-shadow:0 0 8px rgba(57,255,20,.4)}
.osago-benefit h3{margin:0 0 8px;font-size:15px;font-weight:800}
.osago-benefit p{margin:0;font-size:13px;line-height:1.45;color:#9d94b8}

/* ── Docs ── */
.osago-docs-section{
  padding:20px 16px;border-radius:20px;
  background:rgba(12,8,28,.45);border:1px solid rgba(0,240,255,.12);
  box-shadow:0 0 24px rgba(0,240,255,.06)
}
.osago-docs-layout{display:flex;flex-direction:column;gap:18px}
.osago-docs-list{
  list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px
}
.osago-docs-list li{
  display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:14px;
  background:rgba(6,4,15,.55);border:1px solid rgba(180,120,255,.08)
}
.osago-doc-check{
  flex-shrink:0;width:22px;height:22px;margin-top:1px;border-radius:50%;
  background:rgba(57,255,20,.12);border:1px solid rgba(57,255,20,.4);
  position:relative
}
.osago-doc-check::after{
  content:'';position:absolute;left:7px;top:4px;width:5px;height:9px;
  border:solid #39ff14;border-width:0 2px 2px 0;transform:rotate(45deg)
}
.osago-docs-list strong{display:block;font-size:14px;font-weight:800;margin-bottom:3px}
.osago-docs-list span{font-size:12px;color:#9d94b8;line-height:1.4}

/* ── Widget ── */
.osago-widget-section-wrap .osago-section-head{margin-bottom:16px}
.osago-widget-section{margin-bottom:0}
.osago-widget-backdrop{
  border-radius:18px;overflow:hidden;
  border:1px solid rgba(180,120,255,.18);
  background:#0c0820;color:#f4f0ff;
  box-shadow:0 12px 40px rgba(0,0,0,.55),0 0 28px rgba(0,240,255,.08);
  min-height:420px
}
.osago-widget-backdrop :where(button,input[type='button'],input[type='submit'],input[type='reset']),
eosago-b2c-module-root :where(button,input[type='button'],input[type='submit'],input[type='reset']){
  font-family:"Outfit",system-ui,-apple-system,sans-serif!important
}

/* AgentApp ui-field: рамка на [data-ui-field-container], input внутри без border */
.osago-widget-backdrop eosago-b2c-module-root [data-ui-field-container]{
  background:rgba(20,14,42,.92)!important;
  border:1px solid rgba(0,240,255,.35)!important;
  border-radius:14px!important;
  box-shadow:none!important
}
.osago-widget-backdrop eosago-b2c-module-root .field-focused [data-ui-field-container],
.osago-widget-backdrop eosago-b2c-module-root [data-ui-field-container]:focus-within{
  background:rgba(20,14,42,.98)!important;
  border-color:rgba(0,240,255,.6)!important;
  box-shadow:0 0 0 2px rgba(0,240,255,.14)!important
}
.osago-widget-backdrop eosago-b2c-module-root [data-ui-field-container] :where(input,textarea,select,.input){
  background:transparent!important;
  color:#f4f0ff!important;
  border:none!important;
  box-shadow:none!important;
  outline:none!important;
  caret-color:#00f0ff!important
}
.osago-widget-backdrop eosago-b2c-module-root [data-ui-field-container] :where(input,textarea)::placeholder{
  color:#9d94b8!important;opacity:1
}

.osago-widget-backdrop eosago-b2c-module-root label[data-ui-field-container]{
  background:rgba(20,14,42,.92)!important;
  border-bottom-color:rgba(0,240,255,.35)!important;
  color:#f4f0ff!important
}
.osago-widget-backdrop eosago-b2c-module-root label[data-ui-field-container] :where(input,textarea,select,.input){
  background:transparent!important;
  color:#f4f0ff!important;
  -webkit-text-fill-color:#f4f0ff!important;
  caret-color:#00f0ff!important
}

/* Остальные поля формы */
.osago-widget-backdrop eosago-b2c-module-root :where(
  input:not([type='button']):not([type='submit']):not([type='reset']):not([type='checkbox']):not([type='radio']):not([type='hidden']),
  textarea,
  select
){
  background:rgba(20,14,42,.92)!important;
  color:#f4f0ff!important;
  border:1px solid rgba(0,240,255,.35)!important;
  border-radius:14px!important;
  box-shadow:none!important;
  caret-color:#00f0ff!important
}
.osago-widget-backdrop eosago-b2c-module-root :where(
  input:not([type='button']):not([type='submit']):not([type='reset']):not([type='checkbox']):not([type='radio']):not([type='hidden']):focus,
  textarea:focus,
  select:focus
){
  background:rgba(20,14,42,.98)!important;
  border-color:rgba(0,240,255,.6)!important;
  outline:none!important;
  box-shadow:0 0 0 2px rgba(0,240,255,.14)!important
}
.osago-widget-backdrop eosago-b2c-module-root :where(input,textarea)::placeholder{
  color:#9d94b8!important;opacity:1
}

/* ── FAQ ── */
.osago-faq-list{display:flex;flex-direction:column;gap:8px}
.osago-faq-item{
  border-radius:14px;background:rgba(12,8,28,.72);
  border:1px solid rgba(180,120,255,.12);overflow:hidden
}
.osago-faq-item summary{
  padding:14px 16px;font-size:14px;font-weight:800;cursor:pointer;list-style:none;
  display:flex;align-items:center;justify-content:space-between;gap:10px
}
.osago-faq-item summary::-webkit-details-marker{display:none}
.osago-faq-item summary::after{
  content:'+';flex-shrink:0;width:24px;height:24px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:700;color:#00f0ff;
  background:rgba(0,240,255,.08);border:1px solid rgba(0,240,255,.18)
}
.osago-faq-item[open] summary::after{content:'−'}
.osago-faq-item p{
  margin:0;padding:0 16px 14px;font-size:13px;line-height:1.5;color:#9d94b8
}

/* ── Contacts ── */
.osago-contacts{margin-bottom:28px}
.osago-contact-card{
  display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:18px;
  text-decoration:none;color:inherit;
  background:linear-gradient(135deg,rgba(0,240,255,.08),rgba(191,0,255,.06));
  border:1px solid rgba(0,240,255,.22);
  box-shadow:0 0 24px rgba(0,240,255,.08);
  transition:transform .12s ease,border-color .15s ease,box-shadow .15s ease
}
.osago-contact-card:active{transform:scale(.99)}
.osago-contact-card:hover{
  border-color:rgba(0,240,255,.4);
  box-shadow:0 0 28px rgba(0,240,255,.14)
}
.osago-contact-icon{
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  width:52px;height:52px;border-radius:14px;color:#00f0ff;
  background:rgba(0,240,255,.1);border:1px solid rgba(0,240,255,.22)
}
.osago-contact-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.osago-contact-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#9d94b8}
.osago-contact-email{font-size:16px;font-weight:800;color:#f4f0ff;word-break:break-all}
.osago-contact-action{
  flex-shrink:0;padding:8px 12px;border-radius:10px;
  font-size:12px;font-weight:800;color:#06040f;
  background:linear-gradient(135deg,#00f0ff,#39ff14)
}

/* ── Footer ── */
.osago-footer{
  padding:16px;border-radius:16px;text-align:center;
  background:rgba(0,240,255,.05);border:1px solid rgba(0,240,255,.14)
}
.osago-footer p{margin:0 0 12px;font-size:13px;line-height:1.5;color:#9d94b8}
.osago-footer-link{
  font-size:13px;font-weight:800;color:#00f0ff;text-decoration:none
}
.osago-footer-link:hover{text-decoration:underline}

/* ── Tablet ── */
@media (min-width:560px){
  .osago-page{padding-left:20px;padding-right:20px}
  .osago-hero-actions{flex-direction:row;flex-wrap:wrap}
  .osago-btn{min-width:180px}
  .osago-metrics{grid-template-columns:repeat(3,1fr);gap:12px}
  .osago-vehicle-types{grid-template-columns:repeat(2,1fr);gap:12px}
  .osago-metric{flex-direction:column;text-align:center;padding:16px 12px}
  .osago-metric-body{align-items:center}
  .osago-benefits-grid{grid-template-columns:repeat(3,1fr)}
  .osago-steps{
    display:grid;grid-template-columns:repeat(2,1fr);gap:12px
  }
  .osago-step + .osago-step{margin-top:0;border-top-color:rgba(180,120,255,.1)}
}

/* ── Desktop ── */
@media (min-width:720px){
  .osago-shell{max-width:1040px}
  .osago-page .site-page-header{margin-bottom:36px}
  .osago-hero{
    display:grid;grid-template-columns:1fr minmax(240px,340px);
    gap:32px;align-items:center;margin-bottom:32px
  }
  .osago-hero-visual{display:flex;margin-top:0}
  .osago-hero h1{font-size:40px}
  .osago-hero-lead{font-size:16px;max-width:44ch}
  .osago-section h2{font-size:26px}
  .osago-steps{grid-template-columns:repeat(4,1fr)}
  .osago-step{
    grid-template-columns:1fr;grid-template-rows:auto auto auto auto;
    text-align:center;padding:20px 14px
  }
  .osago-step-num{grid-row:auto;justify-self:center;margin-bottom:4px}
  .osago-step-icon{grid-column:1;justify-self:center;margin-bottom:4px}
  .osago-step h3,.osago-step p{grid-column:1}
  .osago-docs-layout{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
    gap:28px;align-items:start
  }
  .osago-widget-backdrop{min-height:480px;border-radius:20px}
  .osago-contact-card{padding:18px 22px}
}

@media (min-width:960px){
  .osago-page{padding-left:28px;padding-right:28px}
  .osago-hero h1{font-size:44px}
}

/* ── Light theme (if nav toggles body class) ── */
body.light-theme .osago-page{
  color:#0f172a;
  background:linear-gradient(180deg,#eef2f8 0%,#e6ecf5 100%)
}
body.light-theme .osago-hero-lead,
body.light-theme .osago-section-lead,
body.light-theme .osago-metric-body span,
body.light-theme .osago-vehicle-type-body span,
body.light-theme .osago-step p,
body.light-theme .osago-benefit p,
body.light-theme .osago-docs-list span,
body.light-theme .osago-faq-item p,
body.light-theme .osago-footer p{color:#475569}
body.light-theme .osago-metric,
body.light-theme .osago-vehicle-type,
body.light-theme .osago-step,
body.light-theme .osago-benefit,
body.light-theme .osago-faq-item{background:#fff;border-color:rgba(15,23,42,.1)}
body.light-theme .osago-btn-ghost{background:#fff;border-color:rgba(15,23,42,.12);color:#334155}
body.light-theme .osago-docs-section{background:rgba(255,255,255,.85);border-color:rgba(14,116,144,.15)}
body.light-theme .osago-docs-list li{background:#f8fafc}
body.light-theme .osago-footer{background:rgba(14,116,144,.08);border-color:rgba(14,116,144,.18)}
body.light-theme .osago-contact-card{background:linear-gradient(135deg,rgba(14,116,144,.08),#fff);border-color:rgba(14,116,144,.22)}
body.light-theme .osago-contact-email{color:#0f172a}
body.light-theme .osago-contact-icon{color:#0e7490;background:rgba(14,116,144,.08);border-color:rgba(14,116,144,.18)}
body.light-theme .osago-widget-backdrop{background:#fff;color:#0f172a;border-color:rgba(15,23,42,.1)}