:root { --paper:#f6f4ec; --ink:#173b34; --line:#c8cec1; --muted:#465e55; --accent:#c8ec87; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:20px; }
body { margin:0; background:var(--paper); color:var(--ink); font:17px/1.55 "Inter","Segoe UI",Arial,sans-serif; }
.wrap { width:min(1220px,90%); margin-inline:auto; }
a { color:inherit; text-decoration:none; }
a:hover { text-decoration:underline; text-underline-offset:4px; }
a:focus-visible, button:focus-visible { outline:3px solid #ce7534; outline-offset:4px; }
h1,h2,h3,p,figure { margin:0; }
.mast,nav,.actions,footer,.controls { display:flex; align-items:center; }
.mast { padding-block:20px; gap:32px; border-bottom:1px solid var(--line); }
.logo { display:inline-flex; align-items:center; gap:8px; margin-right:auto; font-size:23px; font-weight:750; letter-spacing:-1px; white-space:nowrap; }
.logo img { display:block; flex:none; }
nav,.actions { gap:12px; }
nav a { padding:10px; }
.outline,.solid,button { display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--ink); border-radius:8px; min-height:46px; padding:10px 17px; line-height:1.35; font-family:inherit; font-size:16px; font-weight:650; }
.solid { color:white; background:var(--ink); }
.hero { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:6%; padding-block:clamp(42px,6vw,90px); }
.kicker,article small,.lab figcaption { font:700 13px/1.5 Consolas,monospace; letter-spacing:.045em; }
.kicker { text-transform:uppercase; }
h1,h2,h3 { font-family:Georgia,"Times New Roman",serif; font-weight:500; }
h1 { font-size:clamp(48px,5.6vw,88px); line-height:1.02; letter-spacing:-.06em; margin:22px 0; }
h1 em { color:#386b52; }
h2 { font-size:clamp(34px,3.7vw,58px); line-height:1.1; letter-spacing:-.045em; }
.intro { font-size:clamp(17px,1.4vw,21px); max-width:34em; color:var(--muted); }
.actions { margin-top:26px; flex-wrap:wrap; }
.lab { padding:clamp(20px,3vw,40px); background:#193b35; color:#f3f6e8; border-radius:20px; min-width:0; }
.lab figcaption { color:#cae3be; display:flex; align-items:center; gap:9px; }
.lamp { width:8px; height:8px; background:var(--accent); border-radius:50%; }
.lab h2 { font-size:clamp(27px,2.6vw,40px); margin:20px 0 9px; }
.lab p { color:#c4d7ca; max-width:36ch; }
.plot { margin:24px 0 16px; height:148px; display:flex; align-items:end; justify-content:space-around; gap:6%; border-bottom:1px solid #769185; background:repeating-linear-gradient(to top,transparent 0 36px,#65827555 36px 37px); padding-inline:4%; }
.plot span { flex:1; height:calc(var(--v)*10%); text-align:center; background:#96c7a5; color:#153c32; border-radius:4px 4px 0 0; font:700 15px/1.8 Consolas,monospace; transition:height .22s; }
.plot .done { background:#daef91; }
.controls { justify-content:space-between; gap:8px; }
.controls[hidden] { display:none; }
button { cursor:pointer; background:var(--accent); color:var(--ink); border:0; }
output { font:13px Consolas,monospace; }
.services,.process { border-top:1px solid var(--line); padding-block:clamp(32px,4.6vw,68px); }
.catalog { margin-top:28px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
article { border:1px solid var(--line); border-radius:12px; padding:clamp(20px,2vw,32px); background:#fbfaf4; }
article small { color:#356447; }
.service-directory {
  margin-top:clamp(28px,4vw,52px);
  padding:clamp(20px,3.6vw,52px);
  background:#183b33;
  color:#f6f4ec;
  border-radius:20px;
}
.service-directory h3 { margin:0 0 22px; font-size:clamp(30px,3.3vw,48px); }
.directory-row {
  display:grid;
  grid-template-columns:minmax(160px,1fr) 2.6fr;
  align-items:baseline;
  gap:24px;
  padding-block:18px;
  border-top:1px solid #496659;
}
.directory-row:last-child { padding-bottom:0; }
.directory-row h4 { margin:0; color:#cfeba5; font-size:17px; line-height:1.4; }
.directory-row ul { display:flex; flex-wrap:wrap; gap:6px 0; list-style:none; margin:0; padding:0; }
.directory-row li { margin:0; padding:0 14px 0 0; line-height:1.55; }
.directory-row li::before { content:""; display:inline-block; width:4px; height:4px; margin:0 8px 3px 0; background:#93ad98; border-radius:50%; }
.service-group { background:#edf0e5; border:1px solid var(--line); border-radius:12px; }
.service-group summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 20px; cursor:pointer; font-weight:650; list-style:none; }
.service-group summary::-webkit-details-marker { display:none; }
.service-group summary::after { content:""; flex:0 0 8px; height:8px; border:solid #436650; border-width:0 2px 2px 0; transform:rotate(45deg); }
.service-group[open] summary::after { transform:rotate(225deg); }
.service-group summary:focus-visible { outline:3px solid #ce7534; outline-offset:3px; border-radius:12px; }
.service-group summary:hover { color:#396643; }
h3 { font-size:clamp(25px,2.25vw,36px); line-height:1.12; margin:18px 0 12px; letter-spacing:-.035em; }
article p,.process p,.contact p { color:var(--muted); }
.process,.contact { display:grid; grid-template-columns:1fr 1fr; gap:7%; }
.process h2 { margin:12px 0; }
.process>div>p { max-width:34ch; }
ol { margin:0; padding-left:28px; }
li { padding-left:8px; margin:0 0 18px; }
li::marker { color:#42694a; font:700 17px Consolas,monospace; }
.contact { background:#e3ebd6; padding:clamp(22px,3.5vw,52px); border-radius:16px; align-items:center; }
.contact h2 { margin-bottom:10px; }
.questions { display:grid; gap:10px; }
.questions p { padding:0 20px 18px; }
.contact .hours { margin-top:12px; color:var(--ink); font-weight:650; }
.channels a { display:flex; gap:8px; flex-wrap:wrap; justify-content:space-between; padding:12px 0; }
.channels a+a { border-top:1px solid #a5b59f; }
.site-footer { margin-top:clamp(36px,5vw,72px); padding-block:clamp(32px,4vw,56px); background:var(--ink); color:var(--paper); }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1.2fr; gap:32px; }
.site-footer p { margin-top:10px; max-width:31ch; color:#c7d6ca; }
.site-footer nav,.footer-links { display:flex; flex-direction:column; align-items:flex-start; gap:0; }
.site-footer strong { margin-bottom:8px; color:var(--accent); }
.site-footer nav a,.footer-links a { padding:5px 0; }
@media(max-width:700px) {
  .footer-grid { grid-template-columns:1fr; gap:22px; }
  .site-footer nav,.footer-links { border-top:1px solid #577069; padding-top:16px; }
}
@media(max-width:820px) {
  .hero { grid-template-columns:1fr; gap:30px; }
  .catalog { grid-template-columns:1fr; }
  h1 { font-size:clamp(47px,8.5vw,68px); }
  .plot { height:120px; }
}
@media(max-width:610px) {
  .directory-row { grid-template-columns:1fr; gap:10px; }
  nav { display:none; }
  .mast { gap:8px; padding-block:12px; }
  .mast .outline { font-size:14px; }
  .wrap { width:calc(100% - 32px); }
  .hero { padding-block:30px; }
  .actions { gap:8px; }
  .actions a { flex:auto; }
  .process,.contact { grid-template-columns:1fr; gap:22px; }
  .catalog { gap:12px; }
}
@media(max-width:365px) {
  .actions a { width:100%; }
  .controls { align-items:start; flex-direction:column; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .plot span { transition:none; } }

.offer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; background:#e2edcc; border:1px solid #bdcda4; border-radius:18px; padding:clamp(22px,3vw,38px); margin-bottom:32px; }
.offer[hidden] { display:none; }
.offer h2 { margin-bottom:8px; }
.offer-clock { display:grid; gap:3px; }
.offer-clock b { font:700 clamp(22px,3vw,32px) Consolas,monospace; font-variant-numeric:tabular-nums; }
.offer-clock time { font-size:14px; }
#viber-help { width:min(420px,92%); padding:24px; border:1px solid var(--line); border-radius:16px; color:var(--ink); background:var(--paper); }
#viber-help::backdrop { background:#10282099; }
#viber-help h2 { font-size:30px; }
#viber-help p { margin:14px 0; }
#viber-help input { width:100%; padding:10px; font:inherit; }
.viber-trigger { background:transparent; color:inherit; }
.viber-row { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.channels .viber-row { justify-content:space-between; border-top:1px solid #a5b59f; padding:6px 0; }
.viber-row button { padding:4px 0; text-decoration:underline; text-underline-offset:4px; }
.contact-number { width:15ch; max-width:100%; font:inherit; color:inherit; background:transparent; border:0; padding:4px; }
.contact-number:focus-visible { outline:2px solid currentColor; }
