/* ===== AllVillage — фирменный стиль внутренних страниц (блог, Ключи) =====
   В едином стиле лендинга: зелёно-кремовая палитра, антиква в заголовках. */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
:root{
  --primary:#1B5E3F; --primary-light:#2E8B57; --accent:#C2410C;
  --honey:#D4A017; --cream:#FAF6F0; --bg:#F5F1EA;
  --ink:#1A2B22; --muted:#5C6B62; --line:rgba(27,94,63,.14);
  --radius:18px; --radius-sm:12px;
  --shadow:0 6px 24px rgba(27,94,63,.10);
  --shadow-lg:0 18px 48px rgba(27,94,63,.18);
  --serif:Georgia,"Times New Roman",serif;
  --sans:"Segoe UI",Roboto,"Helvetica Neue",system-ui,sans-serif;
}
body { margin:0; font-family:var(--sans); font-size:16px; line-height:1.6; color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; }
a { color:var(--primary); text-decoration:none; }
a:hover { text-decoration:underline; }
.container { width:100%; max-width:1180px; margin:0 auto; padding:0 24px; }
.muted { color:var(--muted); }
.text-center { text-align:center; }
.mt-4 { margin-top:24px; }
.lead { font-size:1.1rem; color:var(--muted); }

/* ===== Header ===== */
.site-header { position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(250,246,240,.92); backdrop-filter:blur(12px); box-shadow:0 2px 16px rgba(27,94,63,.08); }
.site-header .container { display:flex; align-items:center; justify-content:space-between; height:64px; }
.logo { display:flex; align-items:center; gap:10px; font-weight:800; font-size:1.3rem; color:var(--primary); min-height:44px; }
.logo:hover { text-decoration:none; }
.logo-icon { width:38px; height:38px; border-radius:10px; background:var(--primary); display:flex; align-items:center; justify-content:center; font-size:1.3rem; line-height:1; flex-shrink:0; }
.logo-text { font-family:var(--serif); letter-spacing:-.5px; }
.logo-text .accent { color:var(--accent); }
.main-nav { display:flex; gap:26px; align-items:center; }
.main-nav a { font-weight:600; font-size:.95rem; color:var(--ink); display:inline-flex; align-items:center; min-height:44px; }
.main-nav a:hover { color:var(--accent); text-decoration:none; }
.main-nav .nav-cta { background:var(--primary); color:#fff; padding:10px 20px; border-radius:50px; font-weight:700; }
.main-nav .nav-cta:hover { background:var(--primary-light); color:#fff; }

/* ===== Buttons ===== */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 26px; border-radius:50px; font-weight:700; font-size:1rem; border:2px solid transparent; cursor:pointer; transition:transform .2s,background .2s; }
.btn:hover { transform:translateY(-2px); text-decoration:none; }
.btn-primary { background:var(--primary); color:#fff; }
.btn-primary:hover { background:var(--primary-light); color:#fff; }
.btn-secondary { background:transparent; border-color:var(--primary); color:var(--primary); }
.btn-secondary:hover { background:var(--primary); color:#fff; }
.btn-outline { background:#fff; border-color:var(--line); color:var(--ink); }
.btn-outline:hover { border-color:var(--primary); color:var(--primary); }
.btn-large { padding:16px 30px; }

/* ===== Article / blog ===== */
.article-wrap { padding:104px 0 64px; }
.article { max-width:760px; margin:0 auto; }
.back-link { display:inline-block; margin-bottom:18px; color:var(--accent); font-weight:600; font-size:15px; }
.chip-row { margin-bottom:18px; }
.chip { display:inline-flex; align-items:center; padding:6px 14px; border-radius:999px; background:rgba(27,94,63,.10); color:var(--primary); font-size:13px; font-weight:700; }
.article h1 { font-family:var(--serif); font-size:clamp(28px,4.2vw,44px); line-height:1.15; letter-spacing:-.02em; margin:0 0 18px; color:var(--primary); }
.article-index-lead { font-size:19px; color:var(--muted); line-height:1.65; margin-bottom:16px; }
.article-meta { color:var(--muted); font-size:14px; margin-bottom:32px; }
.article p { font-size:18px; line-height:1.75; color:var(--ink); margin-bottom:20px; }
.article h2 { font-family:var(--serif); font-size:clamp(22px,3vw,30px); line-height:1.25; color:var(--primary); margin:42px 0 14px; letter-spacing:-.01em; }
.article ul { margin:0 0 20px; padding-left:22px; }
.article li { font-size:18px; line-height:1.7; color:var(--ink); margin-bottom:10px; }
.article strong { color:var(--primary); }
.article-figure { margin:26px 0; }
.article-figure img { border-radius:var(--radius); width:100%; height:auto; }
.article-figure figcaption { margin-top:8px; font-size:13px; color:var(--muted); }
.note { background:var(--cream); border:1px solid var(--line); border-left:4px solid var(--honey); border-radius:var(--radius-sm); padding:20px 22px; margin:26px 0; }
.note p { margin:0; font-size:16px; color:var(--ink); }
.faq { margin-top:44px; }
.faq-item { border:1px solid var(--line); border-radius:var(--radius-sm); padding:18px 22px; margin-bottom:12px; background:#fff; box-shadow:var(--shadow); }
.faq-item h3 { margin:0 0 8px; font-size:18px; color:var(--primary); font-family:var(--serif); }
.faq-item p { margin:0; font-size:16px; color:var(--muted); }
.cta-box { margin:48px 0 8px; padding:40px; border-radius:var(--radius); text-align:center; background:var(--primary); color:#fff; }
.cta-box h2 { margin:0 0 12px; color:#fff; font-family:var(--serif); }
.cta-box p { max-width:520px; margin:0 auto 22px; color:rgba(255,255,255,.9); }
.cta-box .btn { background:var(--honey); color:var(--ink); }
.cta-box .btn:hover { background:#e0ad2a; }
.related { margin-top:48px; }
.related h2 { font-family:var(--serif); font-size:22px; margin-bottom:16px; color:var(--primary); }
.related a { display:block; padding:14px 18px; border:1px solid var(--line); border-radius:var(--radius-sm); margin-bottom:10px; color:var(--ink); font-weight:600; font-size:16px; background:#fff; }
.related a span { display:block; color:var(--muted); font-weight:400; font-size:14px; margin-top:4px; }
.related a:hover { border-color:var(--primary); text-decoration:none; }
.blog-list { display:grid; gap:16px; max-width:760px; margin:8px auto 0; }
.blog-card { display:block; padding:22px 24px; border:1px solid var(--line); border-radius:var(--radius); color:var(--ink); background:#fff; box-shadow:var(--shadow); transition:transform .2s,box-shadow .2s; }
.blog-card:hover { border-color:var(--primary); text-decoration:none; transform:translateY(-3px); box-shadow:var(--shadow-lg); }
.blog-card h3 { margin:0 0 6px; font-size:20px; font-family:var(--serif); color:var(--primary); }
.blog-card p { margin:0; color:var(--muted); font-size:15px; }

/* ===== Hero (страница Ключи) ===== */
.hero { position:relative; min-height:62vh; display:flex; align-items:center; overflow:hidden; padding:120px 0 72px; }
.hero-bg { position:absolute; inset:0; background:url('/images/hero-800.webp') center/cover no-repeat; z-index:0; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(135deg,rgba(27,94,63,.82),rgba(27,94,63,.55) 45%,rgba(194,65,12,.45)); z-index:1; }
.hero .container { position:relative; z-index:2; }
.hero-content { max-width:640px; color:#fff; }
.hero-title { font-family:var(--serif); font-size:clamp(2.2rem,5vw,3.6rem); line-height:1.08; margin:14px 0 14px; color:#fff; letter-spacing:-1px; }
.hero-subtitle { font-size:clamp(1.05rem,2.2vw,1.3rem); font-weight:500; margin-bottom:12px; color:#fff; }
.hero-tagline { font-size:1rem; opacity:.9; margin-bottom:28px; max-width:520px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }
.hero .chip { background:rgba(212,160,23,.92); color:var(--ink); }

/* ===== Sections (Ключи) ===== */
.categories, .solution, .download { padding:72px 0; }
.solution { background:var(--cream); }
.section-title { font-family:var(--serif); font-size:clamp(1.7rem,4vw,2.5rem); line-height:1.15; color:var(--primary); text-align:center; margin:0 0 44px; letter-spacing:-.5px; }
.cat-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.cat-card { display:flex; align-items:center; gap:12px; padding:16px 18px; border:1px solid var(--line); border-radius:var(--radius-sm); background:#fff; box-shadow:var(--shadow); }
.cat-icon { font-size:22px; line-height:1; }
.cat-name { font-weight:600; flex:1; }
.cat-type { font-size:12px; padding:3px 10px; border-radius:999px; background:rgba(27,94,63,.10); color:var(--primary); font-weight:700; white-space:nowrap; }
.cards-grid { display:grid; gap:24px; }
.cards-grid.three { grid-template-columns:repeat(3,1fr); }
.card { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px 24px; box-shadow:var(--shadow); }
.card h3 { font-family:var(--serif); font-size:1.15rem; color:var(--primary); margin:0 0 10px; }
.card-text { color:var(--muted); font-size:.95rem; margin:0; }
.download { text-align:center; }
.download-options { display:flex; justify-content:center; flex-wrap:wrap; gap:16px; margin-top:24px; }
.download-btn-group { display:flex; flex-direction:column; gap:12px; align-items:center; }

/* ===== Footer ===== */
.site-footer { background:#16291F; color:rgba(255,255,255,.78); padding:56px 0 28px; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:36px; margin-bottom:36px; }
.footer-col h4 { color:#fff; font-size:.95rem; margin:0 0 14px; }
.footer-col ul { list-style:none; padding:0; margin:0; display:grid; gap:9px; }
.footer-col li { font-size:.9rem; }
.site-footer a { color:rgba(255,255,255,.78); display:inline-flex; align-items:center; min-height:44px; }
.site-footer a:hover { color:var(--honey); text-decoration:none; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); padding-top:20px; font-size:.82rem; color:rgba(255,255,255,.6); }

/* ===== Responsive ===== */
@media(max-width:900px){
  .cards-grid.three { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:768px){
  .article-wrap { padding:92px 0 48px; }
}
@media(max-width:640px){
  .main-nav { gap:14px; }
  .main-nav a { font-size:.85rem; }
  .main-nav .nav-cta { display:none; }
  .cta-box { padding:28px 20px; }
  .categories, .solution, .download { padding:52px 0; }
  .footer-grid { grid-template-columns:1fr; }
  .hero-actions .btn { flex:1; }
}
