html, body { margin:0; padding:0; background: #f8fafc; font-family: 'Montserrat', 'Arial', sans-serif;}
.cso-root { min-height: 100vh; display: flex; flex-direction: column; }
.cso-topnav {
  background: linear-gradient(90deg, #24355b 80%, #ffd23f 120%);
  color: #fffbe5;
  box-shadow: 0 4px 24px #24355b33;
  position: sticky; top: 0; z-index: 99;
}
.cso-flexbar { display: flex; align-items: center; justify-content: space-between; max-width: 1240px; margin: 0 auto; padding: 22px 36px;}
.cso-logo { font-size: 2rem; font-weight: 900; letter-spacing: 2px; color: #ffd23f; display:flex; align-items:center; gap:12px;}
.cso-menu-btn { display: none; background: none; border: none; cursor: pointer;}
.cso-menu-btn svg rect { fill: #ffd23f; }
.cso-navpanel { display: flex; gap: 32px; align-items:center;}
.cso-navpanel a { color: #fffbe5; font-weight:700; font-size:1.08rem; text-decoration: none; display: flex; align-items:center; gap:6px;}
.cso-navpanel a:hover { color: #ffd23f;}
/* Моб меню */
@media (max-width:900px){
  .cso-menu-btn { display: flex;}
  .cso-navpanel {
    position: fixed; top: 0; right: -105vw;
    background: #24355b;
    flex-direction: column; gap:22px;
    width: 80vw; max-width:340px; height: 100vh;
    padding: 90px 24px 24px;
    z-index:110;
    transition:right 0.24s cubic-bezier(.7,.2,.3,1);
  }
  .cso-navpanel.active { right:0;}
  .cso-flexbar { padding: 12px 10px;}
}

/* HERO */
.cso-mainbg { background: #f6f7fb; flex:1; display:flex; flex-direction:column; }
.cso-hero { position:relative; background:#fff; padding:0 0 48px 0; min-height:320px; }
.cso-hero-bg { position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden; z-index:0;}
.cso-stars-bg { position:absolute; right:-8vw; top:16px; width:220px; opacity:0.22; pointer-events:none;}
.cso-hero-content { position:relative; z-index:2; max-width:1200px; margin:0 auto; display:flex; align-items:center; gap:52px; padding-top:46px;}
.cso-hero-imgwrap { position:relative;}
.cso-hero-img { max-width:340px; border-radius:24px; box-shadow:0 8px 44px #ffd23f13;}
.cso-badge-new { position:absolute; top:18px; left:-20px; background:#24355b; color:#ffd23f; padding:6px 16px; border-radius:20px 4px 16px 4px; display:flex; align-items:center; gap:6px; font-size:1rem; font-weight:700;}
.cso-hero-desc { flex:1; padding-top:12px;}
.cso-hero-desc h1 { font-size:2.4rem; color:#24355b; margin:0 0 11px;}
.cso-hero-desc p { font-size:1.15rem; color:#746e5d;}
.cso-emoji {font-size:1.3em;}
.cso-featurelist { list-style:none; padding:0; margin: 23px 0 18px 0;}
.cso-featurelist li { display:flex; align-items:center; gap:9px; margin-bottom:8px; color:#233564; font-size:1.12rem;}
.cso-buyblock { display: flex; align-items:center; gap:24px; margin-top:14px;}
.cso-pricetag { font-size:2.1rem; color:#ffd23f; font-weight:900; background:#24355b; border-radius:18px 8px 12px 8px; padding:8px 25px;}
.cso-buybtn { background: linear-gradient(90deg, #ffd23f 80%, #24355b 120%); color:#24355b; border:none; border-radius:21px; padding:13px 42px; font-size:1.2rem; font-weight:900; cursor:pointer; text-decoration:none; box-shadow:0 1px 8px #ffd23f49; display:inline-flex; align-items:center; gap:7px; transition:box-shadow .16s;}
.cso-buybtn:hover { box-shadow:0 6px 18px #ffd23f80;}
/* Cards */
.cso-highlight { background: #f1ecda; padding: 48px 0 38px;}
.cso-cards { max-width:1100px; margin:0 auto; display:flex; gap:44px; justify-content:center; }
.cso-card {
  background: #fff;
  border-radius: 19px 35px 16px 32px;
  box-shadow: 0 2px 30px #24355b15;
  padding: 32px 32px 26px;
  flex:1 1 0;
  display:flex; flex-direction:column; align-items:center; gap:12px;
  min-width: 220px;
  max-width: 320px;
  transition: box-shadow .17s, transform .19s;
}
.cso-card:hover { box-shadow: 0 6px 38px #ffd23f38; transform:translateY(-8px) scale(1.025);}
.cso-card svg { margin-bottom: 7px; }
.cso-card h3 { font-size:1.3rem; color:#24355b; margin:0; font-weight:800;}
.cso-card p { font-size:1rem; color:#746e5d; margin:0;}
/* Модалка заказа */
.cso-modal-overlay { display:none; position:fixed; left:0; top:0; width:100vw; height:100vh; background:rgba(36,53,91,0.92); z-index:1001; justify-content:center; align-items:center; }
.cso-modal-overlay.active { display:flex; animation: csoFadeIn .3s;}
.cso-modal { background:#fff; border-radius:22px; box-shadow:0 10px 40px #ffd23f25; padding:38px 30px 32px; min-width:280px; max-width:370px; width:100%; position:relative; }
.cso-modal-close { position:absolute; top:14px; right:12px; width:28px; height:28px; background:none; border:none; cursor:pointer;}
.cso-modal-close:before, .cso-modal-close:after { content:""; position:absolute; left:13px; top:3px; width:2px; height:22px; background:#ffd23f;}
.cso-modal-close:before { transform:rotate(45deg);}
.cso-modal-close:after { transform:rotate(-45deg);}
.cso-form { display:flex; flex-direction:column; gap:16px; position:relative;}
.cso-form h2 { display:flex; align-items:center; gap:9px; font-size:1.4rem; color:#24355b; font-weight:900;}
.cso-form-row { display:flex; flex-direction:column; gap:11px; }
.cso-form label { font-weight:700; color:#24355b; display:flex; flex-direction:column; gap:3px; }
.cso-form input { padding:9px 15px; border:1px solid #f2dd82; border-radius:7px; font-size:1rem;}
.cso-send-btn {
  background:linear-gradient(90deg, #24355b 60%, #ffd23f 120%);
  color:#ffd23f; border:none; border-radius:16px; padding:10px 0;
  font-size:1.14rem; font-weight:900; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px;
  margin-top:4px; transition:background .18s, color .18s;
}
.cso-send-btn:hover { background:#ffd23f; color:#24355b;}
/* Успех */
.cso-success-message {
  display:none; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  background:#41e19933; border-radius:14px; padding:30px 10px;
  font-size:1.18rem; color:#246d49; font-weight:800; text-align:center;
  position:absolute; left:0; top:0; width:100%; height:100%; z-index:20; animation: csoFadeInUp .34s;
}
.cso-form.success input,
.cso-form.success .cso-send-btn { opacity:0.15; pointer-events:none;}
.cso-form.success .cso-success-message { display:flex; }
/* Cookie popup */
#cso-cookie-popup { position:fixed; left:0; bottom:0; width:100vw; background:#24355b; color:#ffd23f; z-index:2100; display:none; flex-direction:column; align-items:center; padding:25px 14px; box-shadow:0 -4px 30px #ffd23f18; }
#cso-cookie-popup[style*="flex"] { display:flex!important;}
#cso-cookie-msg { max-width:660px; margin:0 auto 12px; font-size:1.09rem;}
#cso-cookie-msg a { color: #fffbe5; text-decoration:underline;}
#cso-cookie-settings { display:none; flex-direction:column; gap:7px; width:100%; max-width:340px; margin:0 auto 10px;}
.cso-cookie-switch { display:flex; align-items:center; gap:8px;}
.cso-cookie-switch span { flex:1; font-size:0.98rem;}
.cso-cookie-btns { display:flex; gap:12px; justify-content:center; margin-top:8px;}
.cso-cb-btn { background:#ffd23f; color:#24355b; border:none; border-radius:9px; padding:9px 19px; font-weight:800; cursor:pointer; margin:2px 3px; transition:background .18s, color .16s;}
.cso-cb-btn:hover { background:#24355b; color:#ffd23f; border:1px solid #ffd23f;}
/* Анимации */
@keyframes csoFadeIn { from{opacity:0;} to{opacity:1;} }
@keyframes csoFadeInUp { from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:translateY(0);} }
.cso-fadein { animation: csoFadeIn .7s;}
.cso-fadein-delay { animation: csoFadeInUp 1s .3s both;}
/* Scrollbar */
::-webkit-scrollbar { width:10px; background:#ffd23f33; }
::-webkit-scrollbar-thumb { background:#ffd23f99; border-radius:6px;}
/* Адаптив */
@media (max-width:900px){
  .cso-hero-content { flex-direction:column; gap:28px; padding-top:20px;}
  .cso-cards { flex-direction:column; gap:24px;}
  .cso-hero-img { max-width:95vw;}
}
@media (max-width:500px){
  .cso-hero-desc h1, .cso-card h3, .cso-pricetag, .cso-buybtn, .cso-footer-wrap, #cso-cookie-msg { font-size:1rem;}
  .cso-modal { padding:12px 2vw;}
}