/* ═══ PROFI · дизайн-система «креслення + монтажний скотч» ═══ */
:root{
  --ink:#0b2036; --ink2:#123054; --paper:#f1f4f6; --card:#ffffff;
  --orange:#ff6a1f; --orange-d:#e5550d; --yellow:#ffc82e; --teal:#0e9e8f;
  --line:#d8dfe7; --mut:#5b6b7c;
  --disp:'Unbounded',sans-serif; --body:'Golos Text',sans-serif; --mono:'JetBrains Mono',monospace;
  --hard:5px 5px 0 rgba(11,32,54,.9);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{
  font-family:var(--body);color:var(--ink);background-color:var(--paper);
  background-image:linear-gradient(rgba(11,32,54,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,32,54,.05) 1px,transparent 1px);
  background-size:28px 28px;line-height:1.55;overflow-x:hidden;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}
.wrap-narrow{max-width:820px}
.mono{font-family:var(--mono)}
h1,h2,h3{font-family:var(--disp);line-height:1.15;letter-spacing:-.01em}
img,svg{display:block}
a{color:inherit}
::selection{background:var(--yellow)}

/* ── кнопки: монтажний стиль із жорсткою тінню ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;
  font:700 .95rem var(--body);color:#fff;background:var(--orange);
  border:2px solid var(--ink);border-radius:10px;padding:.85rem 1.5rem;
  box-shadow:4px 4px 0 var(--ink);text-decoration:none;
  transition:transform .18s,box-shadow .18s,background .18s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink);background:var(--orange-d)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.btn-ghost{background:var(--card);color:var(--ink)}
.btn-ghost:hover{background:#fff}
.btn-sm{padding:.55rem 1rem;font-size:.85rem}
.btn-block{width:100%}
.btn:disabled{opacity:.6;pointer-events:none}

/* ── «монтажний скотч» ── */
.tape{display:inline-block;background:var(--yellow);color:var(--ink);
  font:800 .72rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;
  padding:.5rem .8rem;transform:rotate(-1.6deg);box-shadow:2px 2px 0 rgba(11,32,54,.85)}
.tape-sm{font-size:.62rem;padding:.4rem .6rem}
mark{background:linear-gradient(transparent 58%,var(--yellow) 58%);color:inherit;padding:0 .1em}

/* ── верхня смуга + шапка ── */
.topbar{background:var(--ink);color:#cfe0f2;font-size:.8rem}
.topbar-in{display:flex;justify-content:space-between;padding:.45rem 22px}
.topbar a{text-decoration:none}
.hdr{position:sticky;top:0;z-index:60;background:var(--card);border-bottom:2px solid var(--ink);transition:box-shadow .3s}
.hdr.sc{box-shadow:0 10px 28px rgba(11,32,54,.14)}
.hdr-in{display:flex;align-items:center;gap:1.6rem;padding:.7rem 22px}
.logo{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.logo-mark{display:grid;place-items:center;width:42px;height:42px;background:var(--orange);
  border:2px solid var(--ink);border-radius:10px;font:900 1.3rem var(--disp);color:#fff;
  box-shadow:3px 3px 0 var(--ink);transition:transform .25s}
.logo:hover .logo-mark{transform:rotate(-8deg)}
.logo-tx{font:700 1.05rem var(--disp);letter-spacing:.02em;display:flex;flex-direction:column;line-height:1.1}
.logo-tx small{font:600 .62rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--mut)}
.logo-light{color:#fff}.logo-light .logo-tx small{color:#9db4cc}
.nav{display:flex;gap:1.4rem;margin-left:auto;align-items:center}
.nav a{font-weight:600;font-size:.92rem;text-decoration:none;position:relative;padding:.3rem 0}
.nav a::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--orange);transition:width .25s}
.nav a:hover::after{width:100%}

/* ── Випадаюче меню Послуги ── */
.nav-item-drop { position: relative; display: inline-flex; align-items: center; }
.nav-drop-btn {
  font-weight: 800; font-size: 0.95rem; background: transparent; border: 0;
  cursor: pointer; padding: 8px 12px; border-radius: 8px; color: inherit; 
  display: flex; align-items: center; gap: 6px; font-family: inherit;
  transition: background 0.2s, color 0.2s;
}
.nav-drop-btn span { font-size: 0.75rem; transition: transform 0.25s; }
.nav-drop-btn:hover, .nav-item-drop:hover .nav-drop-btn, .nav-item-drop.active .nav-drop-btn {
  background: rgba(0, 0, 0, 0.06); color: var(--orange, #ff6b00);
}
.nav-item-drop:hover .nav-drop-btn span, .nav-item-drop.active .nav-drop-btn span { transform: rotate(180deg); }

.nav-drop-menu {
  position: absolute; top: 100%; left: 0; width: 340px;
  background: #ffffff; color: #071524; border: 2px solid #071524;
  border-radius: 12px; box-shadow: 4px 6px 0px #071524, 0 10px 30px rgba(0,0,0,0.15);
  padding: 8px; margin-top: 4px; opacity: 0; visibility: hidden;
  transform: translateY(10px); transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
  z-index: 10000; display: flex; flex-direction: column; gap: 2px;
}
.nav-item-drop:hover .nav-drop-menu,
.nav-item-drop:focus-within .nav-drop-menu,
.nav-item-drop.active .nav-drop-menu,
.nav-drop-menu.show {
  opacity: 1; visibility: visible; transform: translateY(0);
}

.nav-drop-menu a {
  display: flex !important; align-items: center; gap: 10px;
  padding: 10px 14px !important; color: #071524 !important;
  font-weight: 700; font-size: 0.95rem; text-decoration: none; 
  border-radius: 8px; transition: background 0.15s ease, color 0.15s ease;
  border: 0 !important;
}
.nav-drop-menu a::after { display: none !important; }
.nav-drop-menu a:hover { background: #f1f5f9; color: var(--orange) !important; }
.nav-drop-menu a .ic { font-size: 1.3rem; min-width: 24px; text-align: center; line-height: 1; }

/* ── Адаптивність заголовка H1 ── */
h1.dynamic-h1 {
  font-size: clamp(1.8rem, 4.5vw, var(--title-font-size, 2.5rem)) !important;
  line-height: 1.2 !important;
}
.aspect-hero { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; border-radius: 12px; }

.hdr-cta{display:flex;gap:.6rem}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.burger span{width:26px;height:3px;background:var(--ink);border-radius:2px;transition:.3s}

/* ── герой ── */
.hero{position:relative;padding:3.6rem 0 4.2rem;overflow:hidden}
.hero::after{content:"КОШТОРИС";position:absolute;right:-2%;bottom:-4%;z-index:0;
  font:900 clamp(90px,16vw,220px)/1 var(--disp);color:transparent;
  -webkit-text-stroke:1.5px rgba(11,32,54,.08);pointer-events:none}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:start}
.hero h1{font-size:clamp(1.9rem,4.4vw,3.3rem);font-weight:900;margin:1.1rem 0 1rem}
.hero-sub{font-size:1.08rem;color:var(--mut);max-width:34rem}
.trust{display:flex;gap:2rem;list-style:none;margin:1.5rem 0}
.trust b{display:block;font:700 1.25rem var(--disp)}
.trust span{font-size:.8rem;color:var(--mut)}
.hero-cta{display:flex;gap:.9rem;flex-wrap:wrap}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.chip{font:600 .78rem var(--mono);background:var(--card);border:1.5px solid var(--line);
  border-radius:999px;padding:.4rem .8rem;transition:.2s}
.chip:hover{border-color:var(--orange);transform:translateY(-2px)}

/* ── картки ── */
.card{background:var(--card);border:2px solid var(--ink);border-radius:14px;box-shadow:var(--hard)}

/* ── калькулятор ── */
.calc{padding:1.5rem 1.5rem 1.3rem;position:sticky;top:110px}
.calc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.1rem}
.calc-num{font-size:.8rem;color:var(--mut)}
.f{display:block;margin-bottom:.85rem}
.f>span,legend{display:block;font:700 .74rem var(--body);letter-spacing:.08em;
  text-transform:uppercase;color:var(--mut);margin-bottom:.35rem}
.f input,.f select,.f textarea{width:100%;font:500 1rem var(--body);color:var(--ink);
  background:#fbfcfd;border:1.5px solid var(--line);border-radius:9px;padding:.7rem .85rem;
  transition:border-color .2s,box-shadow .2s}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--orange);
  box-shadow:0 0 0 3px rgba(255,106,31,.18)}
.checks{border:0;margin-bottom:.85rem}
.chk{display:flex;align-items:center;gap:.55rem;font-size:.9rem;padding:.32rem 0;cursor:pointer}
.chk input{width:17px;height:17px;accent-color:var(--orange);cursor:pointer}
.calc-lines{border-top:2px dashed var(--line);padding-top:.7rem;margin-bottom:.4rem}
.cl{display:flex;justify-content:space-between;gap:1rem;font-size:.86rem;padding:.22rem 0;color:var(--mut)}
.cl b{color:var(--ink);font-weight:600;white-space:nowrap}
.cl-note{color:var(--teal);font-weight:600}
.calc-sum{display:flex;justify-content:space-between;align-items:baseline;margin:.5rem 0 1rem;
  padding:.7rem .9rem;background:var(--ink);color:#fff;border-radius:10px}
.calc-sum span{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}
.calc-sum strong{font-size:1.5rem;color:var(--yellow)}
.calc-note{font-size:.75rem;color:var(--mut);margin-top:.7rem}

/* ── стрічка цін ── */
.ticker{overflow:hidden;background:var(--ink);border-block:3px solid var(--orange)}
.ticker-in{display:flex;gap:2.6rem;width:max-content;padding:.75rem 0;white-space:nowrap;
  animation:tick 30s linear infinite;font:700 .85rem var(--disp);color:var(--yellow)}
.ticker-in i{color:var(--orange);font-style:normal}
@keyframes tick{to{transform:translateX(-50%)}}
.ticker:hover .ticker-in{animation-play-state:paused}

/* ── секції ── */
.sec{padding:4.5rem 0}
.sec-head{margin-bottom:2.4rem;max-width:44rem}
.sec-no{font:700 .8rem var(--mono);color:var(--orange);letter-spacing:.2em}
.sec-no::before{content:"— "}
.sec h2{font-size:clamp(1.55rem,3vw,2.3rem);font-weight:900;margin:.4rem 0 .5rem}
.sec-head p{color:var(--mut)}
.sec-dark{background:var(--ink);color:#eef3f8;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:28px 28px}
.sec-dark .sec-head p{color:#9db4cc}

/* ── послуги: вкладки ── */
.svc{display:grid;grid-template-columns:300px 1fr;gap:1.6rem;align-items:start}
.svc-tabs{display:flex;flex-direction:column;gap:.6rem}
.svc-tab{display:flex;align-items:center;gap:.8rem;text-align:left;cursor:pointer;
  background:var(--card);border:2px solid var(--line);border-radius:12px;padding:.85rem 1rem;
  font-family:var(--body);transition:.2s}
.svc-tab:hover{border-color:var(--ink);transform:translateX(4px)}
.svc-tab.active{border-color:var(--ink);box-shadow:var(--hard);background:var(--yellow)}
.svc-ic{display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:9px;
  background:var(--ink);color:var(--yellow)}
.svc-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.svc-tx{display:flex;flex-direction:column}
.svc-tx strong{font-size:.9rem}
.svc-tx em{font:600 .74rem var(--mono);font-style:normal;color:var(--orange-d)}
.svc-tab.active .svc-tx em{color:var(--ink)}
.svc-panel{border:2px solid var(--ink);border-radius:14px;background:var(--card);
  box-shadow:var(--hard);padding:2rem;opacity:0;transform:translateY(10px);transition:.35s}
.svc-panel.show{opacity:1;transform:none}
.svc-panel h3{font-size:1.5rem;margin-bottom:.4rem}
.svc-tag{color:var(--mut);margin-bottom:1.3rem;max-width:36rem}
.svc-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem}
.svc-inc{list-style:none}
.svc-inc li{padding:.42rem 0 .42rem 1.7rem;position:relative;font-size:.93rem;border-bottom:1px dashed var(--line)}
.svc-inc li::before{content:"✓";position:absolute;left:0;top:.42rem;width:1.15rem;height:1.15rem;
  display:grid;place-items:center;background:var(--teal);color:#fff;border-radius:4px;font-size:.7rem;font-weight:800}
.svc-prices{border:1.5px solid var(--line);border-radius:10px;overflow:hidden}
.svc-prices div{display:flex;justify-content:space-between;padding:.6rem .9rem;font-size:.88rem}
.svc-prices div:nth-child(odd){background:#f7f9fa}
.svc-prices b{font-family:var(--mono);white-space:nowrap}
.svc-acts{display:flex;gap:.8rem;margin-top:1.6rem;flex-wrap:wrap}

/* ── кроки ── */
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;counter-reset:st}
.steps li{position:relative;background:var(--card);border:2px solid var(--ink);border-radius:12px;
  padding:1.6rem 1.3rem 1.3rem;transition:transform .25s,box-shadow .25s}
.steps li:hover{transform:translateY(-6px);box-shadow:var(--hard)}
.steps li:not(:last-child)::after{content:"→";position:absolute;right:-1.25rem;top:1.4rem;
  font:700 1.2rem var(--mono);color:var(--orange);z-index:2}
.step-no{font:900 2.4rem var(--disp);color:transparent;-webkit-text-stroke:1.6px var(--orange)}
.steps h3{font-size:1.05rem;margin:.5rem 0 .35rem}
.steps p{font-size:.86rem;color:var(--mut)}

/* ── цифри ── */
.stats{background:var(--yellow);border-block:3px solid var(--ink)}
.stats-in{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:2.2rem 22px;text-align:center}
.stat b{font:900 clamp(1.8rem,3.4vw,2.6rem) var(--disp);display:block}
.stat span{font:600 .8rem var(--body);letter-spacing:.06em;text-transform:uppercase}

/* ── до/після ── */
.ba{position:relative;height:420px;border:3px solid var(--yellow);border-radius:14px;
  overflow:hidden;cursor:ew-resize;touch-action:none;user-select:none;box-shadow:8px 8px 0 rgba(0,0,0,.35)}
.ba-img{position:absolute;inset:0}
.ba-after { background: url(/assets/img/after.jpg) center/cover; }
.ba-after::before { display: none; }
.ba-before { width: var(--pos); overflow: hidden; background: url(/assets/img/before.jpg) center/cover; border-right: 4px solid rgba(0,0,0,0.25); }
.ba-before::before { display: none; }
.ba-tag{position:absolute;top:16px;font:800 .72rem var(--body);letter-spacing:.14em;
  text-transform:uppercase;padding:.4rem .7rem;border-radius:6px}
.tag-before{left:16px;background:#7a5e30;color:#f3e6c8}
.tag-after{right:16px;background:var(--teal);color:#fff}
.ba-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:4px;background:var(--yellow);
  transform:translateX(-50%)}
.ba-handle span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  display:grid;place-items:center;width:46px;height:46px;background:var(--yellow);
  border:3px solid var(--ink);border-radius:50%;font-weight:800;box-shadow:3px 3px 0 rgba(0,0,0,.3)}
.ba-cap{margin-top:1rem;color:#9db4cc;font-size:.8rem}

/* ── відгуки ── */
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.rev{padding:2rem 1.6rem 1.5rem;position:relative;transition:transform .25s}
.rev:hover{transform:translateY(-6px) rotate(0deg)!important}
.rev-2{transform:rotate(1.2deg)}.rev-3{transform:rotate(-1deg)}.rev{transform:rotate(-.6deg)}
.rev-tape{position:absolute;top:-10px;left:50%;transform:translateX(-50%) rotate(-2deg);
  width:90px;height:22px;background:rgba(255,200,46,.85);box-shadow:1px 2px 3px rgba(0,0,0,.12)}
.rev-stars{color:var(--orange);letter-spacing:.15em;margin-bottom:.6rem}
.rev blockquote{font-size:.92rem;margin-bottom:1rem}
.rev figcaption{font-size:.8rem;color:var(--mut)}
.rev figcaption b{color:var(--ink)}

/* ── FAQ ── */
.faq-item{border:2px solid var(--ink);border-radius:11px;background:var(--card);margin-bottom:.7rem;overflow:hidden;transition:box-shadow .2s}
.faq-item:hover{box-shadow:4px 4px 0 rgba(11,32,54,.15)}
.faq-q{display:flex;justify-content:space-between;align-items:center;width:100%;cursor:pointer;
  background:none;border:0;font:700 1rem var(--body);color:var(--ink);padding:1rem 1.2rem;text-align:left}
.faq-q span{font:400 1.5rem/1 var(--mono);color:var(--orange);transition:transform .3s}
.faq-item.open .faq-q span{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq-item.open .faq-a{max-height:280px}
.faq-a p{padding:0 1.2rem 1.1rem;font-size:.92rem;color:var(--mut)}

/* ── форма ── */
.lead-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}
.lead-copy h2{font-size:clamp(1.6rem,3vw,2.3rem);margin:1rem 0 .8rem}
.lead-copy h2 em{font-style:normal;color:var(--yellow)}
.lead-copy>p{color:#9db4cc}
.lead-points{list-style:none;margin:1.3rem 0}
.lead-points li{padding:.35rem 0;font-weight:600}
.lead-tg{font-size:.9rem;color:#9db4cc}
.lead-tg a{color:var(--yellow);font-weight:700}
.lead-form{padding:1.8rem}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
.lead-form .f>span{color:var(--mut)}
.chk-solo{margin:.4rem 0 1rem}
.form-ok{margin-top:1rem;padding:1rem;border:2px solid var(--teal);border-radius:10px;background:#eafaf7}
.form-ok b{color:var(--teal)}
.form-ok p{font-size:.85rem;color:var(--mut);margin-top:.3rem}
.lead-form.sent .f,.lead-form.sent .chk-solo,.lead-form.sent .btn{display:none}

/* ── футер ── */
.ftr{background:var(--ink);color:#c6d6e6;border-top:3px solid var(--orange);padding:3rem 0 1.4rem}
.ftr-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr .8fr;gap:2rem;padding-bottom:2rem}
.ftr h4{font:700 .78rem var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);margin-bottom:.8rem}
.ftr a{display:block;text-decoration:none;font-size:.9rem;padding:.22rem 0;transition:.2s}
.ftr a:hover{color:var(--yellow);transform:translateX(4px)}
.ftr p{font-size:.85rem}
.ftr-bot{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.12);
  padding-top:1.2rem;font-size:.78rem;color:#7e93aa}

/* ── кабінет ── */
.cab{position:fixed;inset:0;z-index:100;background:rgba(11,32,54,.6);display:grid;
  place-items:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .3s}
.cab.open{opacity:1;pointer-events:auto}
.cab-panel{width:min(640px,100%);max-height:88vh;overflow:auto;background:var(--paper);
  border:2px solid var(--ink);border-radius:16px;box-shadow:10px 10px 0 rgba(0,0,0,.35);
  transform:translateY(24px);transition:transform .35s}
.cab.open .cab-panel{transform:none}
.cab-head{position:sticky;top:0;display:flex;align-items:center;gap:.8rem;background:var(--ink);
  color:#fff;padding:1rem 1.4rem;border-radius:14px 14px 0 0}
.cab-head span{font-size:.7rem;color:var(--yellow);border:1px solid var(--yellow);border-radius:4px;padding:.15rem .4rem}
.cab-x{margin-left:auto;background:none;border:0;color:#fff;font-size:1.1rem;cursor:pointer;opacity:.7}
.cab-x:hover{opacity:1}
.cab-body{padding:1.5rem 1.4rem}
.cab-top{display:flex;justify-content:space-between;align-items:center}
.cab-top strong{font-size:1.05rem}
.status{font:700 .72rem var(--body);letter-spacing:.08em;text-transform:uppercase;
  padding:.35rem .7rem;border-radius:999px}
.st-progress{background:#fff3e8;color:var(--orange-d);border:1.5px solid var(--orange)}
.cab-desc{color:var(--mut);font-size:.9rem;margin:.4rem 0 1.2rem}
.stepper{display:flex;list-style:none;margin-bottom:1.4rem}
.stepper li{flex:1;text-align:center;font:600 .72rem var(--body);color:var(--mut);position:relative;padding-top:1.6rem}
.stepper li::before{content:"";position:absolute;top:.4rem;left:50%;transform:translateX(-50%);
  width:14px;height:14px;border-radius:50%;background:#fff;border:2.5px solid var(--line)}
.stepper li::after{content:"";position:absolute;top:.85rem;left:-50%;width:100%;height:2.5px;background:var(--line)}
.stepper li:first-child::after{display:none}
.stepper li.done::before{background:var(--teal);border-color:var(--teal)}
.stepper li.done::after{background:var(--teal)}
.stepper li.active::before{background:var(--orange);border-color:var(--orange);box-shadow:0 0 0 5px rgba(255,106,31,.2)}
.stepper li.active::after{background:var(--orange)}
.stepper li.done,.stepper li.active{color:var(--ink)}
.cab-master{display:flex;align-items:center;gap:.9rem;background:var(--card);
  border:2px solid var(--ink);border-radius:12px;padding:.9rem 1rem;margin-bottom:1.3rem}
.ava{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;
  background:var(--ink);color:var(--yellow);font:700 .95rem var(--disp)}
.cab-master div{flex:1;line-height:1.35}
.cab-master div span{font-size:.78rem;color:var(--mut)}
.verif{color:var(--teal);font-style:normal;font-weight:700}
.cab-h{font:700 .78rem var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin-bottom:.7rem}
.cab-photos{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin-bottom:1.3rem}
.ph{position:relative;aspect-ratio:3/4;border-radius:9px;border:2px solid var(--ink);overflow:hidden}
.ph i{position:absolute;left:0;right:0;bottom:0;font:600 .58rem var(--mono);font-style:normal;
  background:rgba(11,32,54,.85);color:#fff;padding:.3rem .4rem}
.ph1{background:linear-gradient(160deg,#c9b8a3,#a89078)}.ph2{background:linear-gradient(160deg,#b7c4b1,#8fa387)}
.ph3{background:linear-gradient(160deg,#aebcc9,#7f95a8)}.ph4{background:linear-gradient(160deg,#d3c2a8,#b39a76)}
.cab-actions{display:flex;gap:.8rem;flex-wrap:wrap}
.cab-rate{margin-top:1.2rem;background:var(--card);border:2px dashed var(--orange);border-radius:12px;padding:1rem}
.stars{display:flex;gap:.2rem;margin-bottom:.6rem}
.star{background:none;border:0;font-size:1.7rem;color:#cfd7df;cursor:pointer;transition:transform .15s,color .15s}
.star:hover{transform:scale(1.25)}
.star.on{color:var(--orange)}
.cab-rate textarea{width:100%;font:500 .9rem var(--body);border:1.5px solid var(--line);
  border-radius:8px;padding:.6rem;margin-bottom:.6rem}

/* ── toast + мобільна панель ── */
.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,80px);z-index:120;
  background:var(--ink);color:#fff;font-weight:600;font-size:.9rem;padding:.9rem 1.4rem;
  border-radius:10px;border:2px solid var(--yellow);box-shadow:6px 6px 0 rgba(0,0,0,.3);
  transition:transform .4s cubic-bezier(.2,.9,.3,1.3);max-width:90vw}
.toast.show{transform:translate(-50%,0)}
.mbar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:90;gap:.7rem;
  padding:.7rem 14px calc(.7rem + env(safe-area-inset-bottom));background:var(--card);border-top:2px solid var(--ink)}
.mbar .btn{flex:1}

/* ── scroll-reveal ── */
.rv{opacity:0;transform:translateY(28px);transition:opacity .7s,transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.on{opacity:1;transform:none}
.rv[data-d="1"]{transition-delay:.12s}.rv[data-d="2"]{transition-delay:.24s}.rv[data-d="3"]{transition-delay:.36s}

/* ── адаптив ── */
@media(max-width:1024px){
  .hero-grid{grid-template-columns:1fr;gap:2.4rem}
  .calc{position:static;max-width:560px}
  .svc{grid-template-columns:1fr}
  .svc-tabs{flex-direction:row;overflow-x:auto;padding-bottom:6px}
  .svc-tab{min-width:230px}
  .steps{grid-template-columns:1fr 1fr}
  .steps li::after{display:none}
  .ftr-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .nav{position:absolute;top:100%;left:0;right:0;background:var(--card);flex-direction:column;
    gap:0;border-bottom:2px solid var(--ink);display:none}
  .nav.open{display:flex}
  .nav a{padding:.9rem 22px;border-top:1px solid var(--line)}
  .burger{display:flex}
  .hdr-cta .btn-ghost{display:none}
  .lead-grid{grid-template-columns:1fr}
  .rev-grid{grid-template-columns:1fr}
  .rev,.rev-2,.rev-3{transform:none}
  .stats-in{grid-template-columns:1fr 1fr;gap:1.6rem}
  .svc-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .topbar-in span:first-child{display:none}
  .steps{grid-template-columns:1fr}
  .frow{grid-template-columns:1fr}
  .cab-photos{grid-template-columns:1fr 1fr}
  .mbar{display:flex}
  .ba{height:300px}
  .hero{padding-top:2.4rem}
  body{padding-bottom:70px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
}
/* Mobile Optimization Fixes */
@media (max-width: 860px) {
  input, select, textarea { font-size: 16px !important; }
  table { display: block !important; overflow-x: auto !important; }
  
  .mobile-cab-link { display: block !important; font-weight: 800 !important; color: var(--orange) !important; }
  
  /* Dropdown accordion mobile */
  .nav-item-drop { width: 100%; display: flex; flex-direction: column; align-items: stretch; }
  .nav-drop-btn { display: none !important; }
  .nav-drop-menu {
    position: static !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    transform: none !important;
    display: flex !important;
    background: transparent !important;
  }
  .nav-drop-menu a {
    border-top: 1px solid var(--line) !important;
    padding: 0.9rem 22px !important;
  }
}
.mobile-cab-link { display: none; }


/* ── Floating Contact Button ── */
.fab-contact { position: fixed; bottom: 20px; right: 20px; z-index: 100; display: flex; flex-direction: column-reverse; align-items: flex-end; gap: 10px; }
.fab-main { width: 60px; height: 60px; border-radius: 50%; background: #25D366; color: white; border: none; font-size: 1.8rem; cursor: pointer; box-shadow: 0 4px 15px rgba(37,211,102,0.4); animation: pulse-green 2s infinite; transition: transform 0.2s; display: flex; align-items: center; justify-content: center; padding:0; }
.fab-main:hover, .fab-main:active { transform: scale(1.05); }
.fab-menu { display: flex; flex-direction: column; gap: 8px; opacity: 0; visibility: hidden; transform: translateY(10px); transition: 0.3s; margin-bottom: 5px; }
.fab-contact:hover .fab-menu, .fab-contact.active .fab-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.fab-item { display: flex; align-items: center; gap: 8px; background: white; padding: 12px 18px; border-radius: 20px; color: var(--ink); text-decoration: none; font-weight: 800; font-size: 1rem; box-shadow: 0 4px 15px rgba(0,0,0,0.15); white-space: nowrap; transition: 0.2s; border: 1px solid var(--line); }
.fab-item.fab-viber { color: #7360f2; }
.fab-item.fab-phone { color: #25D366; }
.fab-item:active { transform: scale(0.95); }
@keyframes pulse-green {
  0% { box-shadow: 0 0 0 0 rgba(37,211,102, 0.7); }
  70% { box-shadow: 0 0 0 15px rgba(37,211,102, 0); }
  100% { box-shadow: 0 0 0 0 rgba(37,211,102, 0); }
}
@media(min-width: 861px) {
  .fab-contact { display: none !important; }
}