/* Милан-Текстиль — общие стили для всех страниц (шрифты, переменные, шапка, кнопки, футер) */
/* Шрифты: Onest (заголовки), PT Sans (текст), PT Mono (метки) — Google Fonts, <link> в <head> каждой страницы. */

:root{
  --cream:#F2EDE2;
  --cream-2:#EAE2D2;
  --ink:#232A22;
  --navy:#26314A;
  --terracotta:#C1622E;
  --terracotta-deep:#9C4B22;
  --olive:#5C6A45;
  --olive-2:#8A9770;
  --line:rgba(35,42,34,0.14);
  --paper:#FBF8F1;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'PT Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:'Onest',Arial,sans-serif;font-weight:600;margin:0;letter-spacing:-0.01em;text-wrap:balance;}
h1{font-weight:800;}
.mono{font-family:'PT Mono','Courier New',monospace;letter-spacing:0.02em;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;color:inherit;-webkit-appearance:none;appearance:none;}

/* Header */
.nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:20px 48px;background:rgba(242,237,226,0.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);}
.brand{display:flex;align-items:center;font-family:'Onest',Arial,sans-serif;font-size:20px;font-weight:600;}
/* Высота фиксирована, ширина — по пропорции файла (атрибуты width/height на <img>
   задают aspect-ratio, поэтому место резервируется до загрузки, без дёрганья) */
.brand-logo{display:block;height:44px;width:auto;}
.nav-links{display:flex;gap:32px;align-items:center;font-size:14.5px;}

/* Десктоп: меню всегда строго по центру шапки и не зависит от ширины логотипа/кнопок.
   .nav уже position:sticky — этого достаточно как контейнера для абсолютного .nav-links,
   отдельный position:relative ломал бы липкость шапки. */
@media(min-width:901px){
  .nav > .brand{margin-right:auto;}
  .nav > .nav-links{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);white-space:nowrap;}
}
.nav-links a{opacity:0.75;}
.nav-links a.active{opacity:1;color:var(--terracotta-deep);}
.nav-links a:hover{opacity:1;}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:3px;font-size:14px;font-weight:700;cursor:pointer;border:none;}
.btn-primary{background:#25D366;color:#fff;}
.btn-outline{border:1.5px solid var(--ink);color:var(--ink);background:transparent;}

/* Компактная кнопка в шапке */
.nav .btn{padding:8px 15px;font-size:13px;gap:6px;}
.nav .btn svg{width:15px;height:15px;}

/* Footer */
footer{padding:28px 48px;text-align:center;font-size:12.5px;color:rgba(35,42,34,0.45);line-height:1.65;}
footer a{text-decoration:underline;text-underline-offset:2px;}
.footer-legal{color:rgba(35,42,34,0.6);margin-bottom:6px;}
.footer-meta{color:rgba(35,42,34,0.42);}
.cookie-reopen{background:none;border:none;padding:0;font:inherit;color:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:2px;}

/* Cookie-баннер (js/consent.js) */
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:200;max-width:720px;margin:0 auto;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 22px;
  background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px 20px;
  box-shadow:0 10px 34px rgba(35,42,34,0.18);
  opacity:0;transform:translateY(12px);transition:opacity .28s ease,transform .28s ease;}
/* .cookie-banner{display:flex} перебивает браузерное [hidden]{display:none} — возвращаем */
.cookie-banner[hidden]{display:none;}
/* пока баннер не показан (или уходит) — не перехватывать клики по футеру под ним */
.cookie-banner:not(.is-visible){pointer-events:none;}
.cookie-banner.is-visible{opacity:1;transform:none;pointer-events:auto;}
.cookie-text{margin:0;flex:1 1 320px;font-size:13px;line-height:1.5;color:rgba(35,42,34,0.8);}
.cookie-text a{color:var(--terracotta-deep);text-decoration:underline;text-underline-offset:2px;}
.cookie-actions{display:flex;flex-wrap:wrap;gap:10px;flex:0 0 auto;}
.cookie-banner .btn{padding:9px 16px;font-size:13px;}
.cookie-accept{background:var(--ink);color:var(--cream);}
@media(max-width:560px){
  .cookie-banner{padding:14px 16px;gap:12px;left:10px;right:10px;bottom:10px;}
  .cookie-actions{width:100%;}
  .cookie-actions .btn{flex:1 1 auto;justify-content:center;}
}

/* Mobile menu toggle (hidden on desktop) */
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;padding:9px 6px;margin-right:-6px;border:none;background:none;cursor:pointer;flex-shrink:0;}
.nav-toggle span{display:block;width:100%;height:2px;border-radius:2px;background:var(--ink);transition:transform .22s ease,opacity .22s ease;}
.nav.open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav.open .nav-toggle span:nth-child(2){opacity:0;}
.nav.open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

@media(max-width:900px){
  .nav{padding:16px 20px;flex-wrap:wrap;}
  .nav .btn{padding:7px 13px;font-size:12.5px;}
  .brand-logo{height:34px;}
  .nav-toggle{display:flex;}
  .nav-links{order:3;flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;max-height:0;overflow:hidden;transition:max-height .25s ease;}
  .nav.open .nav-links{max-height:360px;}
  .nav-links a{padding:14px 2px;border-top:1px solid var(--line);opacity:1;font-size:15px;}
  .nav-links a:first-child{margin-top:6px;}
}