:root{
  --ink:#0b0e12; --ink-2:#0f141a; --panel:#161d25; --panel-2:#1c242e;
  --line:#2a3138; --olive:#6b7753; --olive-2:#93a46d; --olive-deep:#515f45;
  --paper:#eef1ea; --muted:#98a08c; --gold:#d3a94a; --pulse:#d0472f;
  --radius:18px;
  --font-display:'Oswald',sans-serif; --font-body:'Manrope',sans-serif; --font-mono:'JetBrains Mono',monospace;
}
*{scroll-behavior:smooth}
body{background:var(--ink); color:var(--paper); font-family:var(--font-body); -webkit-font-smoothing:antialiased; overflow-x:hidden;}
::selection{background:var(--olive); color:#0b0e12;}
a{color:inherit; text-decoration:none;}
a:hover,a:focus,a:active{text-decoration:none;}
img{max-width:100%}

/* ---------- typography ---------- */
.display-1,.display-2,.display-3,.h-disp{font-family:var(--font-display); font-weight:600; line-height:.98; letter-spacing:-.01em; text-transform:uppercase;}
.h-disp{font-size:clamp(2.1rem,5.2vw,4.4rem);}
.eyebrow{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.32em; text-transform:uppercase; color:var(--olive-2);}
.lead-txt{font-size:clamp(1rem,1.4vw,1.18rem); color:var(--muted); line-height:1.65; max-width:60ch;}
.mono{font-family:var(--font-mono);}

/* ---------- layout ---------- */
.sec{padding:clamp(66px,9vw,118px) 0; position:relative;}
.sec-head{max-width:760px; margin-bottom:clamp(34px,5vw,60px);}
.kicker{display:inline-flex; align-items:center; gap:.6rem; margin-bottom:1.1rem;}
.kicker::before{content:""; width:26px; height:2px; background:var(--olive-2); display:inline-block;}
.card-soft{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);}

/* ---------- header ---------- */
.nav-wrap{position:sticky; top:0; z-index:1030; background:rgba(11,14,18,.72); backdrop-filter:blur(14px); border-bottom:1px solid transparent; transition:border-color .3s, background .3s;}
.nav-wrap.scrolled{border-bottom-color:var(--line); background:rgba(11,14,18,.92);}
.brand{display:flex; align-items:center; gap:.65rem; font-family:var(--font-display); font-weight:600; letter-spacing:.06em; font-size:1.15rem;}
.brand small{font-family:var(--font-mono); font-weight:400; font-size:.6rem; letter-spacing:.24em; color:var(--muted); text-transform:uppercase; display:block; margin-top:1px;}
.brand-mark{width:38px; height:38px; border-radius:11px; background:var(--olive); display:grid; place-items:center; flex:0 0 auto;}
.navlink{font-size:.92rem; color:var(--muted); font-weight:600; padding:.4rem .1rem; position:relative; transition:color .2s;}
.navlink:hover,.navlink:focus{color:var(--paper);}
.navlink::after{content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0; background:var(--olive-2); transition:width .25s;}
.navlink:hover::after{width:100%;}

/* ---------- buttons ---------- */
.btn-olive{display:inline-flex; align-items:center; justify-content:center; gap:.5rem; text-align:center; line-height:1.1; background:var(--olive); color:#0b0e12; font-weight:700; border:0; border-radius:999px; padding:.78rem 1.6rem; letter-spacing:.01em; transition:transform .18s, background .2s, box-shadow .2s;}
.btn-olive:hover{background:var(--olive-2); color:#0b0e12; transform:translateY(-2px); box-shadow:0 12px 30px -12px rgba(147,164,109,.6);}
.btn-ghost{display:inline-flex; align-items:center; justify-content:center; gap:.5rem; text-align:center; line-height:1.1; background:transparent; color:var(--paper); border:1px solid var(--line); border-radius:999px; padding:.78rem 1.5rem; font-weight:600; transition:border-color .2s, background .2s, color .2s;}
.btn-ghost:hover{border-color:var(--olive-2); background:rgba(147,164,109,.08); color:var(--paper);}
.btn-arrow svg{transition:transform .25s;} .btn-arrow:hover svg{transform:translateY(3px);}

/* ---------- hero ---------- */
.hero{position:relative; padding-top:clamp(46px,7vw,86px); padding-bottom:0; overflow:hidden;}
.hero::before{content:""; position:absolute; inset:0; background:
  radial-gradient(70% 55% at 78% 12%, rgba(107,119,83,.20), transparent 60%),
  radial-gradient(60% 50% at 8% 90%, rgba(81,95,69,.16), transparent 55%);
  pointer-events:none;}
.hero-h1{font-size:clamp(2.6rem,7.4vw,6.1rem);}
.type-line{font-family:var(--font-display); font-weight:500; text-transform:uppercase; color:var(--olive-2); font-size:clamp(1.4rem,3.8vw,2.6rem); min-height:1.2em;}
.ti-cursor{color:var(--olive-2);}
.stat-strip{border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.stat{padding:1.1rem 0;}
.stat b{font-family:var(--font-display); font-weight:600; font-size:clamp(1.6rem,3vw,2.2rem); display:block; line-height:1;}
.stat span{font-family:var(--font-mono); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted);}
.ecg{display:block; width:100%; height:70px; margin-top:2.4rem;}
.ecg path{fill:none; stroke:var(--pulse); stroke-width:2.4; stroke-linejoin:round; stroke-linecap:round;
  stroke-dasharray:1400; stroke-dashoffset:1400; animation:draw 5.5s linear infinite;}
@keyframes draw{to{stroke-dashoffset:-1400;}}

/* ---------- skills ---------- */
.skill{padding:1.7rem 1.5rem; height:100%; transition:transform .22s, border-color .22s, background .22s;}
.skill:hover{transform:translateY(-4px); border-color:var(--olive-deep); background:var(--panel-2);}
.skill-ico{width:52px; height:52px; border-radius:14px; background:rgba(107,119,83,.16); border:1px solid var(--olive-deep); display:grid; place-items:center; color:var(--olive-2); margin-bottom:1.1rem;}
.skill h3{font-family:var(--font-display); font-weight:500; text-transform:uppercase; font-size:1.18rem; letter-spacing:.01em; margin-bottom:.5rem;}
.skill p{color:var(--muted); font-size:.94rem; margin:0; line-height:1.55;}
.skill .num{font-family:var(--font-mono); font-size:.7rem; color:var(--olive-deep); float:right;}

/* ---------- formats ---------- */
.fmt{padding:1.9rem 1.6rem; height:100%; position:relative; overflow:hidden;}
.fmt .tag{font-family:var(--font-mono); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--olive-2);}
.fmt h3{font-family:var(--font-display); font-weight:600; text-transform:uppercase; font-size:1.7rem; margin:.5rem 0 .7rem;}
.fmt ul{list-style:none; padding:0; margin:1rem 0 0; color:var(--muted); font-size:.94rem;}
.fmt li{padding:.42rem 0 .42rem 1.6rem; position:relative; border-top:1px solid var(--line);}
.fmt li::before{content:""; position:absolute; left:0; top:.95rem; width:8px; height:8px; border-radius:50%; background:var(--olive-2);}
.fmt.hi{background:linear-gradient(180deg,rgba(107,119,83,.14),var(--panel)); border-color:var(--olive-deep);}

/* ---------- testimonials ---------- */
.tsec{background:var(--ink-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.rev{padding:2rem 1.9rem; height:100%; display:flex; flex-direction:column;}
.rev p{font-size:1.06rem; line-height:1.6; margin:0 0 1.4rem;}
.rev .who{display:flex; align-items:center; gap:.85rem; margin-top:auto;}
.rev .av{flex:0 0 44px; width:44px; height:44px; border-radius:50%; background:var(--olive-deep); color:#0b0e12; display:flex; align-items:center; justify-content:center; line-height:1; text-align:center; font-family:var(--font-display); font-weight:600; font-size:.95rem;}
.rev .who>div{display:flex; flex-direction:column; line-height:1.25;}
.rev .who b{font-weight:700; font-size:.95rem;}
.rev .who span{display:block; margin-top:3px; color:var(--muted); font-size:.82rem;}
.stars{color:var(--gold); letter-spacing:.15em; font-size:.85rem; margin-bottom:1rem;}
.swiper{padding-bottom:3.4rem;}
.swiper-pagination-bullet{background:var(--olive-deep) !important; opacity:.5 !important; width:9px; height:9px; border-radius:5px; transition:opacity .2s, width .2s;}
.swiper-pagination-bullet-active{background:var(--olive-2) !important; opacity:1 !important; width:26px !important; border-radius:6px;}

/* ---------- b2b parallax ---------- */
.b2b{position:relative; background-size:cover; background-position:center;}
.b2b{overflow:hidden;}
.b2b .jarallax-img,.b2b>picture{position:absolute; inset:0; width:100%; height:100%; z-index:0;}
.b2b>picture img,.b2b .jarallax-img{width:100%; height:100%; object-fit:cover; display:block;}
.b2b::before{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(11,14,18,.90) 0%,rgba(11,14,18,.72) 42%,rgba(11,14,18,.40) 100%);}
.b2b .container{position:relative; z-index:2;}
.b2b .b-list{display:flex; flex-wrap:wrap; gap:.6rem; margin:1.4rem 0 1.9rem;}
.chip{font-family:var(--font-mono); font-size:.74rem; letter-spacing:.06em; padding:.42rem .85rem; border:1px solid var(--olive-deep); border-radius:999px; color:var(--olive-2); background:rgba(107,119,83,.08);}

/* ---------- women ---------- */
.women{background:var(--ink-2);}
.wpanel{background:linear-gradient(155deg,var(--panel-2),var(--panel)); border:1px solid var(--line); border-radius:26px; padding:clamp(28px,4vw,52px); position:relative; overflow:hidden;}
.wpanel::after{content:""; position:absolute; right:-60px; top:-60px; width:260px; height:260px; border-radius:50%; background:radial-gradient(circle,rgba(211,169,74,.14),transparent 70%);}
.wfeat{display:flex; gap:.8rem; align-items:flex-start; margin-top:1.2rem;}
.wfeat .ck{flex:0 0 auto; width:26px; height:26px; border-radius:8px; background:rgba(211,169,74,.16); border:1px solid var(--gold); display:grid; place-items:center; color:var(--gold);}
.wfeat p{margin:0; color:var(--muted); font-size:.95rem;} .wfeat b{display:block; color:var(--paper); font-family:var(--font-display); font-weight:500; text-transform:uppercase; letter-spacing:.02em; font-size:1.02rem; margin-bottom:.15rem;}

/* ---------- pricing ---------- */
.price{padding:2rem 1.7rem; height:100%; display:flex; flex-direction:column; transition:transform .22s, border-color .22s;}
.price:hover{transform:translateY(-4px); border-color:var(--olive-deep);}
.price.feat{background:linear-gradient(180deg,rgba(107,119,83,.16),var(--panel)); border-color:var(--olive-2);}
.price .plan{font-family:var(--font-display); font-weight:600; text-transform:uppercase; font-size:1.35rem;}
.price .amt{font-family:var(--font-display); font-weight:700; font-size:2.8rem; line-height:1; margin:.6rem 0 .2rem;}
.price .amt small{font-family:var(--font-mono); font-size:.8rem; font-weight:400; color:var(--muted); letter-spacing:.04em;}
.price ul{list-style:none; padding:0; margin:1.4rem 0 1.8rem; flex:1;}
.price li{padding:.5rem 0 .5rem 1.7rem; position:relative; color:var(--muted); font-size:.93rem; border-bottom:1px solid var(--line);}
.price li::before{content:"✓"; position:absolute; left:0; color:var(--olive-2); font-weight:700;}
.badge-feat{position:absolute; top:1.2rem; right:1.2rem; font-family:var(--font-mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; background:var(--olive-2); color:#0b0e12; padding:.25rem .6rem; border-radius:6px;}
.cert{display:flex; gap:1rem; align-items:center; margin-top:2rem; padding:1.3rem 1.5rem; border:1px dashed var(--olive-deep); border-radius:16px; background:rgba(107,119,83,.06);}
.cert .cico{flex:0 0 auto; width:46px; height:46px; border-radius:12px; background:rgba(211,169,74,.14); border:1px solid var(--gold); display:grid; place-items:center; color:var(--gold);}

/* ---------- footer / form ---------- */
.foot{background:var(--ink-2); border-top:1px solid var(--line);}
.form-box{background:var(--panel); border:1px solid var(--line); border-radius:22px; padding:clamp(26px,3.5vw,42px);}
.form-control,.form-select{background:var(--ink); border:1px solid var(--line); color:var(--paper); border-radius:12px; padding:.8rem 1rem;}
.form-control:focus,.form-select:focus{background:var(--ink); color:var(--paper); border-color:var(--olive-2); box-shadow:0 0 0 .2rem rgba(147,164,109,.18);}
.form-control::placeholder{color:#5f6a5a;}
.foot-links a{color:var(--muted); font-size:.92rem; display:block; padding:.28rem 0;} .foot-links a:hover{color:var(--paper);}
.soc{width:40px; height:40px; border-radius:11px; border:1px solid var(--line); display:grid; place-items:center; color:var(--muted); transition:.2s;}
.soc:hover{color:var(--paper); border-color:var(--olive-2);}

/* ---------- reveal ---------- */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1; transform:none;}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important; transition:none!important; scroll-behavior:auto!important;}
  .reveal{opacity:1; transform:none;}
}
/* ---------- FAB (кнопки збоку) ---------- */
.fab-stack{position:fixed; right:18px; bottom:22px; z-index:1045; display:flex; flex-direction:column; gap:.6rem;}
.fab{width:50px; height:50px; border-radius:15px; border:1px solid var(--olive-deep); background:var(--panel); color:var(--olive-2);
  display:grid; place-items:center; cursor:pointer; box-shadow:0 10px 26px -12px rgba(0,0,0,.7); transition:transform .18s, background .2s, color .2s, border-color .2s;}
.fab:hover{transform:translateY(-3px); background:var(--olive); color:#0b0e12; border-color:var(--olive);}
.fab:focus-visible{outline:2px solid var(--olive-2); outline-offset:2px;}
.fab-top{opacity:0; pointer-events:none; transform:translateY(10px);}
.fab-top.show{opacity:1; pointer-events:auto; transform:none;}
@media (max-width:575.98px){ .fab-stack{right:12px; bottom:14px;} .fab{width:46px; height:46px; border-radius:13px;} }

/* ---------- Модалка ---------- */
.modal-content{background:var(--panel-2); border:1px solid var(--line); border-radius:22px; color:var(--paper);}
.modal-header{border-bottom:1px solid var(--line);}
.modal-backdrop.show{opacity:.7;}
.modal textarea.form-control{resize:vertical;}

/* ---------- Статус форми ---------- */
.form-status{font-weight:600; font-size:.92rem;}
.form-status.is-ok{color:var(--olive-2);}
.form-status.is-err{color:#e0836f;}

/* ---------- Логотип / зображення ---------- */
.brand-logo{height:34px; width:auto; display:block;}
.blk-img{width:100%; height:auto; border-radius:18px; border:1px solid var(--line); display:block;}
.blk-figure{margin:0;}
.gallery-item{overflow:hidden; border-radius:16px; border:1px solid var(--line);}
.gallery-item img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s;}
.gallery-item:hover img{transform:scale(1.05);}

/* ---------- FAQ акордеон (темна тема) ---------- */
#faq .accordion{--bs-accordion-bg:transparent; --bs-accordion-border-color:var(--line);
  --bs-accordion-btn-color:var(--paper); --bs-accordion-active-color:var(--paper);
  --bs-accordion-color:var(--muted); --bs-accordion-border-radius:16px;}
.faq-item{background:var(--panel); border:1px solid var(--line); border-radius:16px !important; margin-bottom:.8rem; overflow:hidden;}
.faq-item .accordion-button{background:transparent; color:var(--paper); font-family:var(--font-display); font-weight:500;
  text-transform:uppercase; letter-spacing:.01em; font-size:1.05rem; padding:1.15rem 1.4rem; box-shadow:none;}
.faq-item .accordion-button:not(.collapsed){background:rgba(107,119,83,.10); color:var(--paper);}
.faq-item .accordion-button:focus{box-shadow:0 0 0 .18rem rgba(147,164,109,.18);}
.faq-item .accordion-button::after{filter:invert(72%) sepia(12%) saturate(500%) hue-rotate(40deg);}
.faq-item .accordion-body{color:var(--muted); font-size:.97rem; line-height:1.65; padding:.35rem 1.4rem 1.4rem;}
.faq-item .accordion-body p{margin:0 0 .7rem;}
.faq-item .accordion-body p:last-child{margin-bottom:0;}

/* ---------- FAB чат ---------- */
.fab-chat{background:var(--olive); color:#0b0e12; border-color:var(--olive);}
.fab-chat:hover{background:var(--olive-2); color:#0b0e12;}
.fab-dot{position:absolute; top:-3px; right:-3px; width:12px; height:12px; border-radius:50%; background:var(--pulse); border:2px solid var(--ink);}

/* ---------- Віджет чату ---------- */
.chat-panel{position:fixed; right:18px; bottom:88px; width:340px; max-width:calc(100vw - 24px); height:460px; max-height:calc(100vh - 120px);
  background:var(--panel-2); border:1px solid var(--line); border-radius:20px; z-index:1046; display:none; flex-direction:column;
  overflow:hidden; box-shadow:0 24px 60px -20px rgba(0,0,0,.75);}
.chat-panel.open{display:flex; animation:chatIn .22s ease;}
@keyframes chatIn{from{opacity:0; transform:translateY(12px);}to{opacity:1; transform:none;}}
.chat-head{display:flex; align-items:center; gap:.7rem; padding:.9rem 1rem; border-bottom:1px solid var(--line); background:var(--panel);}
.chat-head .dot{width:9px; height:9px; border-radius:50%; background:var(--olive-2); box-shadow:0 0 0 3px rgba(147,164,109,.2);}
.chat-head b{font-family:var(--font-display); font-weight:600; text-transform:uppercase; letter-spacing:.02em; font-size:1rem;}
.chat-head span{font-family:var(--font-mono); font-size:.62rem; letter-spacing:.12em; color:var(--muted); text-transform:uppercase;}
.chat-close{margin-left:auto; background:transparent; border:0; color:var(--muted); cursor:pointer; padding:4px; line-height:0;}
.chat-close:hover{color:var(--paper);}
.chat-log{flex:1; overflow-y:auto; padding:1rem; display:flex; flex-direction:column; gap:.6rem;}
.chat-msg{max-width:82%; padding:.6rem .85rem; border-radius:14px; font-size:.92rem; line-height:1.4; word-wrap:break-word;}
.chat-msg.me{align-self:flex-end; background:var(--olive); color:#0b0e12; border-bottom-right-radius:4px;}
.chat-msg.op{align-self:flex-start; background:var(--panel); border:1px solid var(--line); color:var(--paper); border-bottom-left-radius:4px;}
.chat-msg.sys{align-self:center; background:transparent; color:var(--muted); font-family:var(--font-mono); font-size:.72rem; text-align:center;}
.chat-form{display:flex; gap:.5rem; padding:.8rem; border-top:1px solid var(--line); background:var(--panel);}
.chat-form input{flex:1; background:var(--ink); border:1px solid var(--line); color:var(--paper); border-radius:12px; padding:.6rem .8rem; font-size:.92rem;}
.chat-form input:focus{outline:none; border-color:var(--olive-2);}
.chat-form button{flex:0 0 auto; width:42px; border:0; border-radius:12px; background:var(--olive); color:#0b0e12; cursor:pointer; display:grid; place-items:center;}
.chat-form button:hover{background:var(--olive-2);}
.chat-gate{padding:1.1rem; display:flex; flex-direction:column; gap:.6rem;}
.chat-gate input{background:var(--ink); border:1px solid var(--line); color:var(--paper); border-radius:12px; padding:.7rem .9rem; font-size:.92rem;}
.chat-gate input:focus{outline:none; border-color:var(--olive-2);}
@media (max-width:575.98px){ .chat-panel{right:12px; bottom:78px;} }

/* ---------- Правки заголовків/жіночого блоку ---------- */
.wfeat-txt h3{margin:0 0 .15rem; font-family:var(--font-display); font-weight:500; text-transform:uppercase; letter-spacing:.02em; font-size:1.02rem; color:var(--paper);}
.wfeat-txt p{margin:0; color:var(--muted); font-size:.95rem;}
.price .plan{margin:0;}

/* ---------- Глобальні змінні перекриття (Swiper / Bootstrap) ---------- */
:root{
  --bs-link-decoration:none;
  --swiper-theme-color:var(--olive-2);
  --swiper-pagination-color:var(--olive-2);
  --swiper-pagination-bullet-inactive-color:var(--olive-deep);
  --swiper-pagination-bullet-inactive-opacity:.5;
  --swiper-pagination-bullet-size:9px;
}
a{text-decoration:none;}
a:hover,a:focus,a:active{text-decoration:none;}

/* Немає стрибка при відкритті модалки (кнопки збоку не зʼїжджають) */
html{scrollbar-gutter:stable;}

/* Карточки відгуків — однакова висота */
#reviews .swiper-wrapper{align-items:stretch;}
#reviews .swiper-slide{height:auto; display:flex;}
#reviews .rev{width:100%;}
