/* Навігатор на SYNTONIA: токени й базові класи у стилі сайту (кремовий, navy/teal, Lora).
   Підключається ПЕРЕД navigator.css; кінець файлу — перевизначення після нього (через :root.syn). */
:root{
  --maxw:1140px;
  --txt:#1F2933;--txt2:#3F4A56;--txt3:#5F5B52;
  --line:#E4E0D6;--line2:#D6D0C3;--line-ui:#CFC8B8;
  --deep:#16395B;--pulse:#2E7D8A;--heat:#5CB4A8;--cold:#2E7D8A;
  --head:'Lora',Georgia,serif;--label:'Inter Tight',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --field:linear-gradient(135deg,#16395B 0%,#2E7D8A 55%,#5CB4A8 100%);
  --shadow:0 1px 2px rgba(22,57,91,.05),0 10px 28px rgba(22,57,91,.08);
  --bg2:#FBFAF6;--cream:#F2F0E9;--navy:#16395B;--teal:#5CB4A8;--teal-dk:#256974
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--cream);color:var(--txt);font-family:var(--label);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--teal-dk)}
:focus-visible{outline:3px solid #C98B3E;outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
h1,h2,h3{text-wrap:balance}p,li{text-wrap:pretty}
.crumbs{font-size:.875rem;color:var(--txt3);padding:22px 0 0;display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:var(--txt3)}.crumbs span[aria-current]{color:var(--txt2)}
.page-head{position:relative;padding:26px 0 30px}
.page-head h1{font-family:var(--head);font-weight:500;color:var(--navy);font-size:clamp(2rem,4.6vw,3.25rem);line-height:1.1;letter-spacing:-.015em;margin-top:12px;max-width:22ch}
.page-head .lead{font-size:clamp(1.0625rem,1.9vw,1.1875rem);color:var(--txt2);margin-top:14px;max-width:62ch;line-height:1.6}
.sect{padding:56px 0;border-top:1px solid var(--line)}
.callout{background:#fff;border:1px solid var(--line);border-left:4px solid #C2463B;border-radius:0 14px 14px 0;padding:16px 20px;margin:20px 0}
.callout p{margin:0}
.tel{font-family:var(--label);font-weight:700;color:var(--navy);white-space:nowrap}
.eyebrow{font-family:var(--label);font-weight:700;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--teal-dk)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 .9375rem/1 var(--label);border-radius:100px;padding:14px 22px;text-decoration:none;border:1.5px solid transparent;transition:transform .2s,box-shadow .2s,background .2s}
.btn-p{background:var(--navy);color:#fff}.btn-p:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(22,57,91,.25)}
.btn-s{background:transparent;color:var(--navy);border-color:var(--line2)}.btn-s:hover{border-color:var(--navy)}
.nv-sub{color:var(--txt2)}
.nv-note{font-size:.875rem;color:var(--txt3);margin-top:22px;max-width:72ch}
.nv-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:6px}
.nv-tile{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px 20px 18px;text-decoration:none;color:var(--txt);transition:transform .2s,box-shadow .2s,border-color .2s}
.nv-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--line2)}
.nv-tile .ic{width:42px;height:42px;border-radius:12px;background:#E5F1EE;color:var(--teal-dk);display:inline-flex;align-items:center;justify-content:center;margin-bottom:8px}
.nv-tile .ic svg{width:22px;height:22px}
.nv-tile b{font-family:var(--head);font-weight:500;font-size:1.1875rem;color:var(--navy);line-height:1.25}
.nv-tile>span:not(.ic){font-size:.875rem;color:var(--txt2)}
.nv-pick h2{font-family:var(--head);font-weight:500;color:var(--navy);font-size:clamp(1.5rem,3vw,2.125rem);margin-bottom:18px}
footer{background:var(--navy);color:#aebccb;padding:34px 0;font-size:.8125rem}
footer .wrap{display:flex;gap:10px 24px;flex-wrap:wrap;justify-content:space-between}
footer a{color:var(--teal);text-decoration:none}
@media (max-width:640px){.wrap{padding:0 18px}.sect{padding:40px 0}}