/* a7-102: home.css — лише головна, вантажиться ПІСЛЯ main.css; ⚠️ контракт каскаду — docs/CSS-NOTES.md */
header .hero-in{ z-index:1; }

.header-cta-btn .cta-icon{ width:18px; height:18px; fill:currentColor; flex-shrink:0; }

.hero-cta-sms{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.45); }
.hero-cta-sms:hover{ border-color:#fff; background:rgba(255,255,255,.06); }

/* the live status now leads the hero on its own line */
.hero-status{ display:inline-flex; align-items:center; gap:0; margin:0 0 14px; font-size:15px; font-weight:600; color:#fff; }

/* a7-094: docs/CSS-NOTES.md */
.acc-h{ margin:0; font:inherit; font-weight:inherit; }

/* === Seasonal banner (quiet strip) === */
.gk-season-off .gk-banner{ display:none; }  /* ux4-36: set in <head>, before first paint */
.gk-banner{ background:#fff; border-bottom:1px solid var(--line); color:var(--body); text-align:center; padding:10px 56px 10px 16px; font-size:14px; line-height:1.45; position:relative; }
.gk-banner b{ color:var(--ink); font-weight:600; }
.gk-banner a{ font-weight:600; white-space:nowrap; }
/* vis-17: docs/CSS-NOTES.md */
.gk-banner a.gk-bn-head{ color:var(--ink); white-space:normal; }
/* vis-17: docs/CSS-NOTES.md */
.gk-banner .cta-open-only-i{ white-space:nowrap; }
/* vis-17, vis-105: docs/CSS-NOTES.md */
.gk-banner .gk-bn-pair, .gk-banner .gk-bn-tail{ white-space:nowrap; }
.gk-banner-x{ position:absolute; right:6px; top:50%; transform:translateY(-50%); background:none; border:none; color:var(--muted); font-size:1.25rem; line-height:1; cursor:pointer; padding:0; min-width:44px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; }

/* === Services === */
.services-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; text-align:left; }
.service-card{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:30px 28px; display:flex; flex-direction:column; align-items:flex-start; text-align:left; }
.service-card{ border-color:var(--band-line, var(--line)); }
/* картки послуг: центр (рішення власника 2026-08-15): docs/CSS-NOTES.md */
.service-card{ align-items:stretch; }
.service-card .svc-ico, .gk-fobbox .fob-ico{ display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(22,86,167,.09); color:var(--accent); flex-shrink:0; }
.service-card .svc-ico{ display:flex; width:64px; height:64px; margin:0 auto 18px; }
.gk-fobbox .fob-ico{ width:42px; height:42px; }
.service-card h3{ text-align:center; }
.service-card h3{ font-size:19px; color:var(--ink); margin:0 0 8px; font-weight:600; }
.service-card p{ font-size:15px; color:var(--body); margin:0 0 14px; }

.service-card .service-price{ margin-top:auto; padding-top:14px; border-top:1px solid var(--line); width:100%; display:flex; align-items:baseline; justify-content:center; gap:8px; }
.service-price strong{ font-size:24px; color:var(--ink); font-weight:700; }
.service-price .from{ font-size:14px; color:var(--muted); font-weight:400; }
/* vis-21, vis-32: docs/CSS-NOTES.md */
.service-cta, .gk-morebtn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px;
  padding:10px 22px; margin:0; border:1px solid var(--field-line); border-radius:var(--r-ctl); background:#fff;
  color:var(--accent); font-family:inherit; font-weight:600; font-size:15px; line-height:1.3; text-decoration:none;
  text-align:center; vertical-align:middle; transition:border-color .2s ease; }
.service-cta:hover, .gk-morebtn:hover{ border-color:var(--accent); text-decoration:none; }
.service-cta:focus-visible, .gk-morebtn:focus-visible{ border-radius:var(--r-ctl); } /* спільне a:focus-visible ставить 4px — кути стрибали б */
.service-card .service-cta{ align-self:center; margin-top:4px; } /* над нею ціна з 14px знизу */
.gk-fobbox{ margin-top:26px; padding:20px 26px; border:1px solid var(--line); border-radius:12px; background:#fff; display:flex; flex-wrap:wrap; gap:8px 20px; align-items:center; justify-content:center; text-align:center; font-size:15px; }
.gk-fobbox h3{ font-size:15px; font-weight:600; color:var(--ink); margin:0; display:inline; }

/* === Reviews === */
.rev-line{ margin:0 0 6px; font-size:16px; color:var(--body); }
.rev-line .s{ color:var(--star); letter-spacing:2px; margin-right:8px; }
.gkv-wrap{ margin-top:8px; position:relative; }
.gkv-sub{ max-width:66ch; text-align:center; font-size:16px; color:var(--muted); margin:0 auto 44px; }
.gkv-row{ display:flex; gap:14px; overflow-x:auto; padding:4px 2px 4px; scrollbar-width:none; -ms-overflow-style:none; }
.gkv-row::-webkit-scrollbar{ display:none; } /* the arrows are the control; the bar was a second one */
.gkv-card{ flex:0 0 auto; width:170px; margin:0; }
.gkv-card.gkv-photo{ width:226px; }
.gkv-media{ position:relative; border-radius:var(--r-card); overflow:hidden; background:var(--wash); aspect-ratio:9/16; }
.gkv-photo .gkv-media{ aspect-ratio:3/4; }
.gkv-card.gkv-tall{ width:170px; }
.gkv-tall .gkv-media{ aspect-ratio:9/16; }
.gkv-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.gkv-media iframe{ width:100%; height:100%; border:0; display:block; }
.gkv-play{ display:block; width:100%; height:100%; padding:0; border:0; background:none; cursor:pointer; position:relative; }
.gkv-btn{ position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center; color:var(--ink); font-size:0; line-height:1; text-indent:0; }
.gkv-btn::before{ content:''; position:absolute; inset:0; background:rgba(10,16,30,.22); }
.gkv-play .gkv-btn{ pointer-events:none; }
.gkv-play:hover .gkv-btn::before{ background:rgba(10,16,30,.32); }
/* vis-49: docs/CSS-NOTES.md */
.gkv-btn svg{ position:relative; z-index:1; width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.92); padding:11px; box-sizing:border-box; color:var(--ink); display:block; }
/* vis-51: docs/CSS-NOTES.md */
.gkv-view{ position:relative; --gkv-fade:#fff; }
main > section.section:nth-of-type(odd) .gkv-view{ --gkv-fade:var(--wash); }
.gkv-view::before, .gkv-view::after{ content:''; position:absolute; top:0; bottom:0; width:56px; z-index:2; pointer-events:none; opacity:0; transition:opacity .2s; }
.gkv-view::before{ left:0; background:linear-gradient(to right, var(--gkv-fade), transparent); }
.gkv-view::after{ right:0; background:linear-gradient(to left, var(--gkv-fade), transparent); }
.gkv-view.fade-l::before, .gkv-view.fade-r::after{ opacity:1; }
.gkv-view:has(:focus-visible)::before, .gkv-view:has(:focus-visible)::after{ opacity:0; }
/* на телефоні край наступної картки і є підказка «гортай» — згас лише 24px, щоб її не сховати */
@media (max-width:767px){ .gkv-view::before, .gkv-view::after{ width:24px; } }
@media (prefers-reduced-motion:reduce){ .gkv-view::before, .gkv-view::after{ transition:none; } }
.gkv-cap{ font-size:14px; color:var(--muted); margin:6px 0 0; text-align:left; } /* a7-189: було 12px */
.gk-reviews{ margin-top:40px; text-align:left; }
.gk-rev-col{ flex:1; display:flex; flex-direction:column; gap:18px; min-width:0; }
.gk-rev{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:20px 22px; text-align:left; }
.gk-rev-top{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.gk-rev-ava{ width:38px; height:38px; border-radius:50%; flex-shrink:0; }
.gk-rev-ltr{ display:flex; align-items:center; justify-content:center; color:#fff; font-weight:600; font-size:16px; }
.gk-rev-meta{ display:flex; flex-direction:column; min-width:0; }
.gk-rev-name{ font-weight:600; color:var(--ink); font-size:15px; }
.gk-rev-when{ font-size:14px; color:var(--muted); } /* a7-189: було 12px; не flex-властивість — інваріант виміру висот цілий */
.gk-rev-g{ width:18px; height:18px; margin-left:auto; flex-shrink:0; }
.gk-rev-stars{ color:var(--star); font-size:14px; letter-spacing:1.5px; margin-bottom:8px; }
.gk-rev-text{ margin:0; font-size:15px; color:var(--body); }
/* ux4-51: docs/CSS-NOTES.md */
/* vis-48: docs/CSS-NOTES.md */
.gk-rev-photo{ margin:12px auto 0; border-radius:8px; height:200px; width:100%; max-width:280px; padding:8px; background:var(--wash); object-fit:contain; object-position:center; display:block; }
.gk-morebtn{ cursor:pointer; } /* вигляд — у спільному правилі вторинної кнопки (vis-21) */

/* === Key types === */
/* ux4-06: docs/CSS-NOTES.md */
.kt-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:16px; }
.kt-card{ flex:0 1 calc((100% - 3*16px)/4); box-sizing:border-box; }
.kt-card{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 14px 16px; text-align:center; text-decoration:none; }

.kt-card img{ border-radius:8px; background:var(--wash); width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; padding:8px; }
.kt-name{ display:block; margin:10px 0 2px; color:var(--ink); font-weight:600; font-size:15px; }
.kt-sub{ font-size:14px; color:var(--muted); display:block; text-wrap:balance; }

/* === Makes === */
.mk-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px; }
.mk-grid .mk{ flex:0 1 calc((100% - 5*14px)/6); }
.mk-group{ display:flex; align-items:center; gap:18px; margin:46px 0 18px; font-size:15px; font-weight:700; letter-spacing:.10em; text-transform:uppercase; color:var(--ink); }
.mk-group::before,.mk-group::after{ content:""; flex:1 1 0; height:2px; border-radius:2px; background:#b8c2d1; }
.mk-group span{ display:inline-flex; align-items:center; gap:9px; }
.mk-flag{ width:23px; height:15px; flex:0 0 auto; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.10); }
.lead + .mk-group{ margin-top:26px; }
/* vis-07: docs/CSS-NOTES.md */
.mk-pair{ display:flex; flex-wrap:wrap; justify-content:center; column-gap:28px; align-items:flex-start; }
.mk-pair-col{ flex:1 1 100%; min-width:0; }
@media (min-width:1024px){
  .mk-pair-col.mk-pair-3{ flex:0 0 calc(3*(100% - 5*14px)/6 + 2*14px); }
  .mk-pair-col.mk-pair-2{ flex:0 0 calc(2*(100% - 5*14px)/6 + 14px); }
  .mk-pair-3 .mk-grid .mk{ flex:0 1 calc((100% - 2*14px)/3); }
  .mk-pair-2 .mk-grid .mk{ flex:0 1 calc((100% - 14px)/2); }
}

/* ux4-52, vis-32: docs/CSS-NOTES.md */
#makes .mk{ border-color:var(--band-line, var(--line)); }
#makes .mk:hover, .mk:hover{ border-color:var(--accent); }
.mk img{ width:100%; height:auto; aspect-ratio:1; max-width:106px; object-fit:contain; }
.mk-browse{ margin:24px auto 0; font-weight:600; }

/* === Area === */
.area-intro{ max-width:58ch; margin:0 auto 40px; color:var(--muted); font-size:16px; }
.area-links{ display:grid; grid-template-columns:1fr 1fr; gap:40px; max-width:860px; margin:0 auto; text-align:left; }
.area-block h3{ font-size:17px; font-weight:600; color:var(--ink); text-align:center; margin:0 0 14px; }
.area-linklist{ list-style:none; margin:0; padding:0; columns:2; }
.area-linklist li{ padding:0; break-inside:avoid; font-size:15px; }

.area-linklist a:hover{ text-decoration:underline; }
.area-linklist li::before{ content:none; }
.ar-more{ display:none; }
.area-more{ font-size:14px; color:var(--muted); margin-top:12px; }
.area-note{ font-size:15px; color:var(--muted); max-width:640px; margin:26px auto 0; }
.area-note strong{ color:var(--ink); }

/* === How it works === */
/* vis-42: docs/CSS-NOTES.md */
.how-it-works-grid{ --how-gap:46px; display:grid; grid-template-columns:repeat(3,1fr); gap:var(--how-gap); max-width:1060px; margin:44px auto 0; text-align:left; }

/* a7-068: цитата над формою — компактніша й ближча до полів, щоб не відсувати форму */
.gk-pullquote-form{ margin:18px auto 22px; padding-top:18px; }
.gk-pullquote-form p{ font-size:16px; }
.how-it-works-item{ position:relative; background:#fff; border:1px solid var(--band-line, var(--line)); border-radius:var(--r-card); padding:22px 22px 24px; box-shadow:none; }
/* a chevron in the gap makes the three boxes read as one sequence, not three separate cards */
.how-it-works-item + .how-it-works-item::before{ content:""; position:absolute; left:calc(var(--how-gap) / -2 - 10.5px); top:50%; width:11px; height:11px; border-right:2px solid #c3ccda; border-top:2px solid #c3ccda; transform:translateY(-50%) rotate(45deg); }
.how-it-works-item .step-n{ font-size:14px; font-weight:600; color:var(--accent); letter-spacing:.1em; display:block; margin-bottom:8px; }
.how-it-works-item h3{ margin:0 0 8px; font-size:19px; font-weight:600; color:var(--ink); text-wrap:balance; }
.how-it-works-item p{ margin:0; font-size:15px; }

/* === About === */
/* About: колонка портрета 320px (visual audit #6): docs/CSS-NOTES.md */
.about-flex{ display:grid; grid-template-columns:320px 1fr; gap:52px; align-items:center; max-width:900px; margin:0 auto; text-align:left; }
.about-image-wrapper{ background:var(--wash); border-radius:12px; max-width:none; margin:0; }
/* ux4-01: aspect-ratio явний, НЕ auto — docs/CSS-NOTES.md */
.about-image-wrapper img{ border-radius:var(--r-card); width:100%; aspect-ratio:4/5; object-fit:cover; display:block; }
.about-cap{ font-size:14px; color:var(--muted); margin:8px 0 0; padding:0; text-align:center; }
.about-text-content{ max-width:none; padding:0; }
.about-text-content h2{ text-align:left; }
.about-text-content p{ text-align:left; margin:0 0 16px; line-height:1.65; font-size:16px; max-width:58ch; }
.about-sign{ font-weight:600; color:var(--ink); }
.trust-list{ list-style:none; display:flex; flex-wrap:wrap; gap:18px; justify-content:center; max-width:1040px; margin:44px auto 0; padding:0; text-align:left; }
.trust-list li{ flex:0 1 calc((100% - 2*18px)/3); box-sizing:border-box; margin:0; padding:20px 22px; background:#fff; border:1px solid var(--band-line, var(--line)); border-radius:var(--r-card); }
.trust-list li::before{ content:none; }
.trust-list .tl-tick{ display:none; }
.trust-list h3{ margin:0 0 8px; font-size:16px; font-weight:600; color:var(--ink); }
.trust-list p{ margin:0; font-size:15px; color:var(--body); }
@media (max-width:900px){ .trust-list li{ flex:1 1 100%; } }
.gk-b2b{ max-width:1040px; margin:20px auto 0; font-size:15px; color:var(--body); text-align:center; }
/* к7 (критик візуального аудиту): docs/CSS-NOTES.md */
.gk-b2b + .gk-b2b{ margin-top:6px; }
/* vis-41: у стовпчик картки довіри й рядки під ними — ширина листа About (640), той самий лівий край */
@media (max-width:900px){ .trust-list, .gk-b2b{ max-width:640px; } }
/* vis-41: docs/CSS-NOTES.md */
@media (max-width:640px){ .about-flex .about-image-wrapper{ max-width:none; } }

/* === FAQ (divider style on the existing accordion markup) === */
.accordion{ max-width:760px; margin:40px auto 0; border-top:1px solid var(--line); text-align:left; }
.accordion-item{ border-bottom:1px solid var(--line); background:none; }
.accordion-header{ width:100%; background:none; border:0; font:inherit; font-weight:600; font-size:16px; color:var(--ink); text-align:left; padding:18px 40px 18px 2px; cursor:pointer; position:relative; display:flex; align-items:center; justify-content:space-between; }
.accordion-header strong{ font-weight:600; }
.accordion-header .acc-chev{ color:var(--accent); transition:transform .25s ease; position:absolute; right:8px; top:50%; transform:translateY(-50%); }
.accordion-header.active .acc-chev{ transform:translateY(-50%) rotate(180deg); }
.accordion-content{ display:grid; grid-template-rows:0fr; overflow:hidden; opacity:0; visibility:hidden; transition:grid-template-rows .3s ease, opacity .25s ease, visibility .3s; padding:0 2px; }
.acc-in{ min-height:0; overflow:hidden; }
.accordion-content.active{ grid-template-rows:1fr; opacity:1; visibility:visible; padding-bottom:20px; }
.accordion-content p{ margin:0 0 10px; max-width:66ch; text-align:left; color:var(--body); font-size:15px; }

/* vis-2: docs/CSS-NOTES.md */
.contact .lead{ margin-bottom:22px; }
.c-chat{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:0 auto 18px; }
.c-chat a.btn{ min-height:44px; padding:0 16px; font-size:15px; color:var(--accent); background:#fff; border:1px solid var(--accent); }
.c-chat a.btn:hover{ background:var(--accent); color:#fff; }
.c-chat a.btn:focus-visible:not(:hover){ background:rgba(22,86,167,.08); }
.c-chat a.btn svg{ width:18px; height:18px; flex-shrink:0; }
@media (max-width:1023px){ .c-chat .gk-sms-only{ display:flex; } }
@media (max-width:767px){
  .c-chat{ display:grid; grid-template-columns:1fr 1fr; }
  .c-chat .gk-sms-only{ grid-column:1 / -1; }
  .c-chat a.btn{ width:100%; justify-content:center; padding:0 12px; }
}
.contact-phone-line{ font-size:24px; font-weight:700; margin:0 auto 2px; }
.contact-phone-link{ color:var(--ink); text-decoration:none; }
.contact-phone-link:hover{ color:var(--accent); }
.c-save{ font-size:15px; margin:0 auto 6px; }
.c-closed{ margin:0 auto; font-size:15px; font-weight:600; color:var(--ink); }
html[data-gk-open="0"] .c-closed{ margin-bottom:8px; }
.c-closed svg{ vertical-align:-2px; margin-right:6px; color:var(--accent); }
.c-owner{ font-size:14px; color:var(--muted); margin:0 auto 8px; }

form#contactForm{ max-width:640px; margin:26px auto 0; text-align:left; }
form#contactForm label{ display:block; font-weight:600; font-size:14px; color:var(--ink); margin:0 0 6px; }
form#contactForm label span{ font-weight:400; color:var(--muted); }
form#contactForm label .req{ color:var(--danger); }
form#contactForm input, form#contactForm select, form#contactForm textarea{ width:100%; font:inherit; font-size:16px; padding:12px 14px; border:1px solid var(--field-line); border-radius:8px; background:#fff; color:var(--body); margin-bottom:4px; }
/* фокус-кільце полів форми: docs/CSS-NOTES.md */
form#contactForm input:focus-visible, form#contactForm select:focus-visible, form#contactForm textarea:focus-visible{ border-color:var(--accent); outline:2px solid transparent; outline-offset:2px; box-shadow:0 0 0 3px #fff, 0 0 0 6px var(--accent); }
form#contactForm input:focus, form#contactForm select:focus, form#contactForm textarea:focus{ border-color:var(--accent); }
form#contactForm input[aria-invalid="true"], form#contactForm select[aria-invalid="true"]{ border-color:var(--danger); }
/* B4: the asterisks are hidden from AT, so sighted users need the key spelled out once */
.form-legend{ margin:0 0 14px; font-size:14px; color:var(--muted); }
.form-legend .req{ color:var(--danger); }

.field-help{ display:none; color:var(--danger); font-size:14px; margin:0 0 8px; min-height:0; }
form#contactForm .honeypot{ position:absolute; left:-9999px; height:1px; width:1px; opacity:0; }
form#contactForm input:not(.honeypot), form#contactForm select, form#contactForm textarea{ margin-bottom:14px; }
/* form controls do not inherit the page font by default — that was the Arial leak */
form#contactForm input, form#contactForm select, form#contactForm textarea{ font-family:inherit; font-size:16px; }
.submit-btn{ width:100%; background:var(--night); color:#fff; font:inherit; font-weight:600; font-size:16px; padding:14px; border:1px solid transparent; border-radius:8px; cursor:pointer; }
.submit-btn:hover{ background:var(--ink); } /* vis-34: було #0c1526 — від --night оком не відрізнити */
.submit-btn:disabled{ opacity:.65; cursor:progress; }
.ssl-note{ font-size:14px; color:var(--muted); margin:8px 0 0; text-align:center; }
.form-message{ display:none; margin:16px auto 0; padding:13px 16px; border-radius:8px; font-size:15px; text-align:left; max-width:640px; }
.form-success{ background:var(--good-wash); color:var(--good-ink); border:1px solid var(--good-line); }
.form-error{ background:var(--danger-wash); color:var(--danger-ink); border:1px solid var(--danger-line); }
.form-message:focus-visible{ border-radius:8px; } /* a8-form-focus: фокус переходить на повідомлення; спільне кільце ставить радіус 4px */

/* === Carousels: jobs strip + reviews (owner, 2026-08-01) === */
.gk-car{ position:relative; }
.gk-car-nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:44px; height:44px;
  border-radius:50%; border:1px solid var(--field-line); background:#fff; color:var(--ink); cursor:pointer;
  display:none; align-items:center; justify-content:center; }
/* vis-58: docs/CSS-NOTES.md */
.gk-car.on .gk-car-nav{ display:flex; }
.gk-car-nav:hover{ border-color:var(--accent); color:var(--accent); }
.gk-car-nav svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
/* стрілки каруселі не лежать на тексті (2026-08-15): docs/CSS-NOTES.md */
@media (min-width:1220px){
  .gk-car-prev{ left:-56px; } .gk-car-next{ right:-56px; }
}
@media (max-width:1219px){
  .gk-car{ padding:0 52px; }
  .gk-car-prev{ left:4px; } .gk-car-next{ right:4px; }
}
/* a7-041: стрілки на телефоні; ⚠️ край наступної картки не робимо (інваріант висот) — docs/CSS-NOTES.md */
@media (max-width:767px){
  .gk-car{ padding:0; }
  .gk-car.on .gk-car-nav, .gk-car-nav{ display:none; }
  /* край наступної картки НЕ чіпаємо — .gk-rev без flex-властивостей (docs/CSS-NOTES.md) */
  #gkRevCar{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px; }
  /* margin-top 34, не 40: у flex відступи не схлопуються — docs/CSS-NOTES.md */
  #gkRevCar .gk-reviews{ order:0; flex:0 0 100%; width:100%; min-width:0; margin-top:34px; }
  #gkRevCar.on .gk-car-nav{ display:flex; position:static; transform:none; order:1; }
  .gk-car-dots{ display:none !important; }
}
/* vis-40: docs/CSS-NOTES.md */
@media (min-width:768px) and (max-width:1219px){
  #gkJobsCar{ padding:0; }
  #gkJobsCar .gk-car-prev{ left:8px; }
  #gkJobsCar .gk-car-next{ right:8px; }
  #gkRevCar{ padding:0; }
  #gkRevCar .gk-car-nav{ top:auto; bottom:0; transform:none; }
  #gkRevCar .gk-car-prev{ left:auto; right:52px; }
  #gkRevCar .gk-car-next{ right:0; }
  #gkRevCar .gk-car-dots{ padding:0 96px; }
}

/* review columns built by JS: a long review fills a column, two short ones stack */
.gk-reviews.cols{ display:flex; align-items:flex-start; gap:18px; overflow-x:auto; scrollbar-width:none; }
/* NB: без scroll-behavior — корекція петлі миттєва; docs/CSS-NOTES.md */
.gk-reviews.cols::-webkit-scrollbar{ display:none; }
.gk-rev-col{ flex:0 0 auto; display:flex; flex-direction:column; gap:18px; }
/* крапки-сторінки каруселі відгуків (п. 1б): docs/CSS-NOTES.md */
.gk-car-dots{ display:none; justify-content:center; flex-wrap:wrap; margin:6px 0 0; padding:0; }
.gk-car.on .gk-car-dots{ display:flex; }
.gk-car-dot{ width:44px; height:44px; margin:0; padding:0; border:0; background:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; border-radius:var(--r-pill); }
.gk-car-dot::before{ content:''; width:8px; height:8px; border-radius:50%; background:var(--field-line); transition:background .15s; }
.gk-car-dot:hover::before{ background:var(--muted); }
.gk-car-dot[aria-current="true"]::before{ background:var(--accent); }
@media print{ .gk-car-dots{ display:none !important; } }

@media (prefers-reduced-motion:reduce){ .gk-reviews.cols, .gkv-row{ scroll-behavior:auto; } }

/* === Prices: the single home for money on the homepage (2026-08-01) === */
/* one list, one terms strip — the old seven centred layers had no focal point */
/* vis-43: docs/CSS-NOTES.md */
.price-card{ max-width:820px; margin:34px auto 0; border:1px solid var(--band-line, var(--line)); border-radius:14px; background:#fff; overflow:hidden; text-align:left; }
.price-card .pr-line{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px 22px; border-bottom:1px solid var(--line); color:var(--ink); font-size:16px; }
.price-card .pr-line b{ font-weight:700; white-space:nowrap; text-align:right; }
/* vis-57: docs/CSS-NOTES.md */
.price-card .pr-line > span{ color:var(--accent); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.price-card .pr-line:hover > span{ text-decoration-thickness:2px; }
.price-card .pr-line:hover{ background:var(--wash); text-decoration:none; }
.price-pay{ margin:0; padding:14px 22px; font-size:14px; color:var(--muted); background:var(--wash); text-align:center; }
.price-note{ max-width:640px; margin:14px auto 0; font-size:14px; color:var(--muted); text-wrap:pretty; }
.price-terms{ display:flex; flex-wrap:wrap; gap:24px 0; max-width:820px; margin:30px auto 0; text-align:left; }
.price-terms > div{ flex:1 1 260px; padding:0 24px; border-left:1px solid var(--band-line, var(--line)); }
.price-terms > div:first-child{ border-left:0; padding-left:0; }
.price-terms > div:last-child{ padding-right:0; }
.price-terms h3{ font-size:15px; color:var(--ink); margin:0 0 6px; font-weight:600; }
.price-terms p{ font-size:15px; color:var(--body); margin:0; text-wrap:pretty; }
.price-more{ text-align:center; margin:26px 0 0; font-weight:600; }
/* vis-59: секція цін без дії «написати» — підводка + той самий ряд кнопок, що після відгуків */
.gk-pricechat{ max-width:640px; margin:22px auto 0; font-size:15px; color:var(--body); text-align:center; text-wrap:pretty; }
/* друк: кнопки чатів не друкуємо; :has — окремим правилом (docs/CSS-NOTES.md) */
@media print{ .gk-pricechat, .gk-chatrow a.gk-chatbtn, .gk-chatrow .gk-sms-only{ display:none !important; } }
@media print{ .gk-chatrow:not(:has(.service-cta)){ display:none !important; } }
/* vis-38: docs/CSS-NOTES.md */
@media (max-width:880px){ .price-terms > div{ flex:1 1 100%; padding:0; border-left:0; } }

/* === content-visibility (perf) === */
.section.cv{ content-visibility:auto; contain-intrinsic-size:auto 700px; }
/* ux4-53: docs/CSS-NOTES.md */
/* a8-cv-intrinsic-size: висота ВМІСТУ (без падінгу), виміряна 2026-09-30; кожен медіа-блок нижче задає всі сім ID */
#prices.cv{ contain-intrinsic-size:auto 740px; }
#key-types.cv{ contain-intrinsic-size:auto 800px; }
#how.cv{ contain-intrinsic-size:auto 460px; }
#about.cv{ contain-intrinsic-size:auto 730px; }
#makes.cv{ contain-intrinsic-size:auto 1410px; }
#area.cv{ contain-intrinsic-size:auto 690px; }
#faq.cv{ contain-intrinsic-size:auto 650px; }

@media (max-width:1023px){
  /* ux4-50: docs/CSS-NOTES.md */
  .services-grid{ grid-template-columns:repeat(3,1fr); gap:14px; }
  .service-card{ padding:22px 18px; }
  .kt-grid{ grid-template-columns:repeat(3,1fr); }
  /* vis-08: docs/CSS-NOTES.md */
  .mk-grid .mk{ flex:0 1 calc((100% - 3*14px)/4); }
  .how-it-works-grid{ grid-template-columns:repeat(3,1fr); --how-gap:34px; }
  /* vis-41: docs/CSS-NOTES.md */
  .about-flex{ grid-template-columns:1fr; gap:30px; max-width:640px; }
  .about-image-wrapper{ max-width:320px; margin:0; }
  .area-links{ grid-template-columns:1fr; gap:30px; }
  .gk-reviews{ flex-direction:row; }
  /* a8-cv-intrinsic-size: 769–1023, виміряно на 1000/900/800/769 */
  #prices.cv{ contain-intrinsic-size:auto 800px; }
  #key-types.cv{ contain-intrinsic-size:auto 760px; }
  #how.cv{ contain-intrinsic-size:auto 490px; }
  #about.cv{ contain-intrinsic-size:auto 1210px; }
  #makes.cv{ contain-intrinsic-size:auto 1950px; }
  #area.cv{ contain-intrinsic-size:auto 920px; }
  #faq.cv{ contain-intrinsic-size:auto 650px; }
}

@media (max-width:880px){
  .services-grid{ grid-template-columns:1fr; gap:14px; }
  .service-card{ padding:26px 22px; }
  /* vis-45: docs/CSS-NOTES.md */
  .service-card{ padding:18px 20px 20px; }
  .service-card .svc-ico{ width:48px; height:48px; margin-bottom:10px; }
  .service-card .svc-ico svg{ width:26px; height:26px; }
  .service-card h3{ margin-bottom:6px; }
  .service-card p{ margin-bottom:10px; }
  .service-card .service-price{ padding-top:10px; margin-bottom:0; }
  .service-card .service-cta{ margin-top:12px; }
  /* брелок-блок: одна розкладка на телефонах: docs/CSS-NOTES.md */
  .gk-fobbox{ margin-top:14px; padding:16px 20px; flex-direction:column; gap:8px; }
  .how-it-works-grid{ grid-template-columns:1fr; --how-gap:34px; }
  /* vis-42: той самий розрахунок по вертикалі (після 135° «v» лежить нижче центру бокса на ~4.2px) */
  .how-it-works-item + .how-it-works-item::before{ left:50%; top:calc(var(--how-gap) / -2 - 10.5px); transform:translateX(-50%) rotate(135deg); }
  /* a8-cv-intrinsic-size: кроки й обіцянки під цінами стають стовпчиком (769–880: 758–782 і 864) */
  #prices.cv{ contain-intrinsic-size:auto 860px; }
  #how.cv{ contain-intrinsic-size:auto 770px; }
}

@media (max-width:768px){
  /* a7-193: docs/CSS-NOTES.md */
  .hero-sub{ font-size:17px; text-shadow:0 1px 3px rgba(10,20,40,.75); }
  /* a7-193: docs/CSS-NOTES.md */
  header .hero-pic{ top:-10px; }
  /* ux4-08: 25 logos in 2 columns made the makes section the longest block on the page. */
  .mk-grid{ gap:10px; }
  .mk-grid .mk{ flex:0 1 calc((100% - 3*10px)/4); }
  .mk-group{ margin:32px 0 14px; gap:12px; font-size:14px; }
  .mk-flag{ width:20px; height:13px; }
  .mk{ padding:10px; }
  .mk img{ max-width:77px; }
  .kt-grid{ grid-template-columns:repeat(2,1fr); }
  .gkv-row .gkv-card{ width:150px; }
  .gkv-row .gkv-card.gkv-photo{ width:200px; }
  .gkv-row .gkv-card.gkv-tall{ width:150px; }
  .section.cv{ contain-intrinsic-size:auto 1200px; }
  /* a8-cv-intrinsic-size: ≤768, виміряно на 768/700/600/481 (вужче — блоки ≤640 і ≤480 нижче) */
  #prices.cv{ contain-intrinsic-size:auto 900px; }
  #key-types.cv{ contain-intrinsic-size:auto 1100px; }
  #how.cv{ contain-intrinsic-size:auto 840px; }
  #about.cv{ contain-intrinsic-size:auto 1150px; }
  #makes.cv{ contain-intrinsic-size:auto 1530px; }
  #area.cv{ contain-intrinsic-size:auto 1140px; } /* a7-188 + a8: 1068-1209px після двох колонок */
  #faq.cv{ contain-intrinsic-size:auto 660px; }
}

/* a7-090: docs/CSS-NOTES.md */
@media (max-width:480px){
  .mk-grid{ gap:8px; }
  /* vis-37: docs/CSS-NOTES.md */
  .mk-grid .mk{ flex:0 1 calc((100% - 3*8px)/4); padding:4px; }
  .mk img{ max-width:76px; }
  .mk-group{ margin:24px 0 10px; }
  /* a8-cv-intrinsic-size: виміряно на 480/430/390/360 */
  #makes.cv{ contain-intrinsic-size:auto 1410px; }
  #prices.cv{ contain-intrinsic-size:auto 1140px; }
  #faq.cv{ contain-intrinsic-size:auto 750px; }
}
/* Service Area на телефоні — по центру (2026-08-15): docs/CSS-NOTES.md */
/* a7-188: docs/CSS-NOTES.md */
@media (max-width:640px){
    #about.cv{ contain-intrinsic-size:auto 1440px; } /* a8-cv-intrinsic-size: портрет на всю ширину колонки (1404-1479) */
    .area-linklist{ columns:2; column-gap:14px; text-align:center; }
    .area-linklist li{ text-align:center; }
    .area-more{ text-align:center; }
}
@media (max-width:480px){
  /* ux4-58: without this the seasonal banner runs 4-5 lines directly under the hero. */
  .gk-bn-lead{ display:none; }
}

@media (max-width:768px){
  .hero-txt .hero-status{ padding-right:100px; }
}
/* vis-55: docs/CSS-NOTES.md */
@media (max-width:768px){
  /* trust-list: margin-left з !important (перебиває .section > *) — docs/CSS-NOTES.md */
  .trust-list{ display:block; max-width:58ch; margin:30px 0 0; margin-left:0 !important; }
  .trust-list li{ display:grid; grid-template-columns:20px 1fr; column-gap:12px; padding:0; margin:0 0 18px;
    background:none; border:0; border-radius:0; }
  .trust-list li:last-child{ margin-bottom:0; }
  .trust-list .tl-tick{ display:block; grid-column:1; grid-row:1; margin-top:1px; color:var(--accent); }
  .trust-list h3{ grid-column:2; margin:0 0 4px; }
  .trust-list p{ grid-column:2; }
}

/* on a phone the seven key types read as a list, not a grid: photo left, text right */
@media (max-width:768px){
  .kt-card{ flex:1 1 100%; display:grid; grid-template-columns:104px 1fr; column-gap:14px;
    align-content:center; text-align:left; padding:12px 14px; }
  .kt-card img{ grid-column:1; grid-row:1 / 3; align-self:center; width:100%; padding:6px; }
  .kt-name{ grid-column:2; grid-row:1; align-self:end; margin:0 0 3px; }
  .kt-sub{ grid-column:2; grid-row:2; align-self:start; }
}

/* the 50%-off line already lives in the Spare Key card; on a phone the banner only pushed the page down */
@media (max-width:768px){ .gk-banner{ display:none; } }

/* три кольори обіцянок героя (2026-08-15): docs/CSS-NOTES.md */
.hero-trust .tico-pay{ color:#7ab5ff; }

/* === «Напиши мені» в тілі сторінки: a.gk-chatbtn лише для WhatsApp і Messenger (docs/CSS-NOTES.md) === */
a.gk-chatbtn{ display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 16px; margin:2px 2px;
  border:1px solid var(--accent); border-radius:var(--r-ctl); background:#fff; color:var(--accent);
  font-weight:600; font-size:15px; line-height:1.2; text-decoration:none; vertical-align:middle; white-space:nowrap;
  transition:background-color .2s ease, color .2s ease; }
a.gk-chatbtn svg{ width:18px; height:18px; flex-shrink:0; }
a.gk-chatbtn:hover{ background:var(--accent); color:#fff; text-decoration:none; }
a.gk-chatbtn:focus-visible{ border-radius:var(--r-ctl); } /* спільне a:focus-visible ставить radius 4px — кути кнопки стрибали б */
/* варіант для ПК замість sms: — обидва стани з вищою специфічністю (docs/CSS-NOTES.md) */
a.gk-chatbtn.gk-sms-only-off{ display:none; }
@media (min-width:1024px){ a.gk-chatbtn.gk-sms-only-off{ display:inline-flex; margin-left:6px; } }
/* ряд кнопок після відгуків */
.gk-chatrow{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:10px 12px; margin:14px auto 0; font-size:15px; }
.gk-nowrap{ white-space:nowrap; }
/* герой на ПК: WhatsApp замість мертвого sms-посилання: docs/CSS-NOTES.md */
.hero-reach a.gk-sms-only-off{ color:#fff; padding:12px 0; margin:-12px 0;
  text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.hero-reach a.gk-sms-only-off:hover{ text-decoration-thickness:2px; }

/* vis-30: docs/CSS-NOTES.md */
.price-pay, .price-note{ font-size:15px; color:var(--body); }
.area-more.area-fee{ font-size:15px; color:var(--body); }

/* vis-32: docs/CSS-NOTES.md */
main > section.section{ --band-line:#d5dce6; }
.gk-fobbox, .gk-rev, .kt-card{ border-color:var(--band-line, var(--line)); }
/* «Show all» — рамка --field-line; акцентний контур = чати (docs/CSS-NOTES.md) */
.gk-morebtn{ border-color:var(--field-line); } /* наведення (--accent) — правило вище, :hover сильніше */

/* vis-56: docs/CSS-NOTES.md */
@media (min-width:1024px){
  .nav-links a.active{ background-color:rgba(255,255,255,.16);
    background-image:linear-gradient(#fff, #fff); background-repeat:no-repeat;
    background-size:calc(100% - 24px) 2px; background-position:50% calc(100% - 3px); }
}

/* vis-60: docs/CSS-NOTES.md */
a.btn:active, .service-cta:active, a.gk-chatbtn:active{ transform:translateY(1px); filter:brightness(.94); }
.gk-car-nav:active{ transform:translateY(calc(-50% + 1px)); filter:brightness(.94); }
@media (max-width:767px){ #gkRevCar.on .gk-car-nav:active{ transform:translateY(1px); } }

/* vis-65: docs/CSS-NOTES.md */
@media (max-width:768px){
  /* колонка шеврона в типах ключів: docs/CSS-NOTES.md */
  .kt-card{ grid-template-columns:104px 1fr 10px; padding-right:12px; }
  .kt-card::after{ content:''; grid-column:3; grid-row:1 / 3; align-self:center;
    width:10px; height:18px; background:var(--accent);
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='8 4 9 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='8 4 9 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat; }
}

/* vis-98: docs/CSS-NOTES.md */
.gk-msgchat{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; margin-top:12px; }
.gk-msgchat-lead{ flex:1 1 100%; font-weight:600; }
.gk-msgchat a.gk-chatbtn{ margin:0; }
/* vis-98: docs/CSS-NOTES.md */
@media (max-width:380px){
  .gk-msgchat a.gk-chatbtn{ flex:1 1 0; justify-content:center; padding:0 10px; }
}
/* vis-98: docs/CSS-NOTES.md */
@supports selector(:has(a)){
  .gkv-play:focus-visible{ box-shadow:none; }
  .gkv-media:has(.gkv-play:focus-visible)::after{ content:''; position:absolute; inset:0; z-index:2;
    border-radius:inherit; pointer-events:none; box-shadow:inset 0 0 0 3px var(--accent), inset 0 0 0 5px #fff; }
}
/* vis-98: docs/CSS-NOTES.md */
.gk-bar{ background:var(--night,#0f1728); }
/* vis-98: docs/CSS-NOTES.md */
@media (max-width:767px){
  .gk-cookie{ transform:translateY(calc(-66px - env(safe-area-inset-bottom,0px))); }
}
@media (max-width:430px){
  .gk-cookie{ transform:translateY(calc(-64px - env(safe-area-inset-bottom,0px))); }
}
@media (max-height:450px) and (orientation:landscape) and (max-width:767px){
  html #gkCookie.gk-cookie{ bottom:calc(48px + env(safe-area-inset-bottom,0px)) !important; }
}

/* vis-12, a7-189: docs/CSS-NOTES.md */
@media (max-width:768px){
  header .hero-pic figcaption{ font-size:14px; font-weight:400; padding:3px 7px; bottom:-1px; }
}
@media (max-width:359px){
  header .hero-pic figcaption .cap-role{ display:none; }
}

/* vis-14, a7-042, a7-167: docs/CSS-NOTES.md */
@media (min-width:481px) and (max-width:768px){
  .hero-cta-row{ grid-template-columns:1fr 1fr; }
  .hero-cta-row .btn-gold, .hero-cta-row .hero-cta-sms{ grid-column:1 / -1; }
}

/* vis-19, a7-166: docs/CSS-NOTES.md */
.nav-wa{ border-radius:var(--r-ctl); font-weight:600; }

/* vis-20..28 (хвиля В, типографіка): блок у кінці файлу свідомо — docs/CSS-NOTES.md */

/* vis-20: docs/CSS-NOTES.md */
.gk-revchat{ text-align:center; margin:26px auto 0; max-width:640px; font-size:15px; }

/* vis-24, vis-25: docs/CSS-NOTES.md */
.service-card h3, .how-it-works-item h3, .trust-list h3{ font-size:19px; line-height:1.3; }
.trust-list h3{ text-wrap:balance; }
.gk-fobbox h3, .area-block h3, .kt-name, .price-terms h3{ font-size:16px; line-height:1.3; }

/* vis-28: у таблиці цін «from» — тихе слово, як на картках послуг; число жирне. */
.price-card .pr-line b .pr-from{ font-size:14px; font-weight:400; color:var(--muted); }

/* vis-27, a7-190: docs/CSS-NOTES.md */
.gk-brk{ white-space:nowrap; }
@media (max-width:560px){
  .gk-brk{ display:block; }
  .gk-brk > .gk-sep{ display:none; }
  .rev-line .gk-brk, #faq .gk-brk{ margin-top:4px; }
  .gk-brk a:not(.gk-tap){ display:inline-block; padding:12px 0; margin:-12px 0; }
}

/* vis-27: docs/CSS-NOTES.md */
.pp-list > span:not(.gk-sep){ white-space:nowrap; }
@media (max-width:680px){
  .price-pay .pp-list{ display:flex; flex-wrap:wrap; gap:4px 12px; margin-bottom:4px; }
  .price-pay .pp-list > .gk-sep{ display:none; }
}

/* критик №4: docs/CSS-NOTES.md */
@media (min-width:769px){ .area-intro{ text-wrap:balance; } }
@media (max-width:768px){ .area-intro{ text-wrap:pretty; } }

/* критик №5, vis-105: docs/CSS-NOTES.md */
@media (min-width:901px) and (max-width:1099px){ .trust-list h3{ min-height:2.6em; } }

/* vis-20: docs/CSS-NOTES.md */
@media (max-width:768px){
  .price-note, .price-pay, .area-note, .gk-revchat, .gkv-sub, .kt-note{ text-align:left; }
  /* критик №8: docs/CSS-NOTES.md */
  .price-note{ max-width:820px; }
  /* кнопки чату під абзацом після відгуків — від того самого краю, що й абзац */
  .gk-chatrow{ justify-content:flex-start; max-width:640px; }
}

/* vis-100 (фінальний огляд хвилі В) */
@media (max-width:768px){
  /* ряди кнопок чату починаються від того ж краю, що таблиця й примітки */
  .gk-chatrow{ margin-left:0; margin-right:0; }
  .gk-pricechat{ text-align:left; }
  /* About: фото, лист, список і рядки .gk-b2b — одна колонка 640px */
  .trust-list{ margin:30px auto 0 !important; max-width:640px; }
  .gk-b2b{ text-align:left; }
}

/* vis-103 (перевірка «чи все зроблено», 2026-09-23) */
@media (max-width:768px){
  /* ряди чату від краю таблиці/акордеона: main.css .section > * центрує з !important */
  .section > .gk-chatrow, .section > .gk-pricechat{ margin-left:0 !important; margin-right:0 !important; }
}
/* стан натискання — і для головних кнопок героя, шапки, нижньої смуги та форми */
.header-cta-btn:active, .nav-call:active, .nav-chat:active, .gk-bar a:active,
form#contactForm .submit-btn:active{ transform:translateY(1px); filter:brightness(.94); }

/* vis-104 (огляд повносторінкового скріншота власника, 2026-09-24) */
/* вміст героя — на тому ж лівому краї, що й секції (1060 + 2×24 падінгу) */
header .hero-in{ max-width:1108px; }
/* About на ПК: фото, лист, картки й рядки під ними — одна ширина з рештою сіток */
@media (min-width:1024px){ .about-flex, .trust-list, .gk-b2b{ max-width:1060px; } }
/* заголовки колонок районів — з того ж краю, що й посилання під ними */
@media (min-width:769px){ .area-block h3{ text-align:left; } }
/* короткі абзаци на два рядки — рівними рядками, без «8 AM.» чи трьох слів окремим рядком */
html[data-gk-open="0"] header .hero-reach{ text-wrap:balance; }
@media (min-width:769px){ .kt-note, .area-note, .gk-revchat, .gkv-sub{ text-wrap:balance; } }
/* vis-103: docs/CSS-NOTES.md */
.gk-chatrow-note{ max-width:640px; }
@media (max-width:768px){ .section > .gk-chatrow.gk-chatrow-note{ margin-left:auto !important; margin-right:auto !important; } }
/* випадний список форми: свій шеврон stroke 1.6, текст на тому ж відступі, що в полях */
form#contactForm select{ appearance:none; -webkit-appearance:none; padding-right:42px;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f6a75' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 16px 16px; }
@media (forced-colors:active){ form#contactForm select{ appearance:auto; -webkit-appearance:auto; background-image:none; padding-right:12px; } }

/* vis-105 (другий знімок власника, 2026-09-24) */
/* стрілки стрічки робіт — знову по центру фото після вищого вступу .gkv-sub */
@media (min-width:768px){ #gkJobsCar .gk-car-nav{ top:calc(50% + 15px); } }
/* назви районів — на одному краї із заголовком колонки (у посилань свій внутрішній відступ 4px) */
@media (min-width:769px){ .area-block .area-linklist a{ margin-left:-4px; } }
/* уночі денний шматок «Call or» порожній — не займає місця, кнопка «WhatsApp me» рівно по центру */
html[data-gk-open="0"] .gk-chatrow > span.gk-sms-only-off{ display:none; }
@media (min-width:1024px){ html[data-gk-open="0"] .gk-chatrow-note > a.gk-chatbtn.gk-sms-only-off{ margin-left:2px; } }
/* підказки в полях і порожній список — одним приглушеним кольором сайту; вибрана послуга — звичайним */
form#contactForm ::placeholder{ color:var(--muted); opacity:1; }
form#contactForm select:invalid{ color:var(--muted); }
form#contactForm select option{ color:var(--body); }
/* vis-105b, vis-105c, a7-190: docs/CSS-NOTES.md */
.how-it-works-item .gk-tap, .c-save .gk-tap, .gk-b2b .gk-tap{ padding-top:10px; padding-bottom:10px; margin-top:-10px; margin-bottom:-10px; }
.how-it-works-item .gk-tap:not([href^="tel:"]){ position:relative; z-index:1; }
/* стрічка: посилання більше не роздувають рядок — повертаємо 4px у падінг, щоб зона 44px лишалась усередині */
.gk-banner{ padding-top:12px; padding-bottom:12px; }
/* заклик під відгуками на телефоні й планшеті: без «the price:» окремим рядком над кнопками */
@media (max-width:768px){ .gk-revchat{ text-wrap:balance; } }