/* ВЫКОРМЫШ.РФ — шапка, подвал, знак и кнопки.
   Один файл на все страницы: у страниц видов свой самодостаточный CSS,
   и без общего слоя каркас пришлось бы править в четырёх местах.
   Подключается последним, после страничных стилей.
   Правится только по решению владельца. Утверждено 06.10.2026. */

/* ═══ 1. ШАПКА ═══════════════════════════════════════════════════════
   Чёрная, плотная. Прозрачность и размытие подмешивали зелень фотографии
   и давали грязный серо-болотный тон, поэтому заливка сплошная. */
.capsule-header-holder{
  background:#000 !important;
  backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
  border-bottom:1px solid rgba(255,255,255,.1);
  box-shadow:0 6px 26px rgba(0,0,0,.55);
}

/* знак лежит прямо на шапке: в исходнике настоящая прозрачность */
.vk-logo{border-radius:0 !important;box-shadow:none !important}

/* надпись была залита светлым градиентом под белую шапку — на чёрной тонет */
.capsule-logo-text{
  background-image:linear-gradient(178deg,#FFFFFF 0%,#CFEAF4 26%,#FFFFFF 48%,#A9D6E8 70%,#FFFFFF 100%) !important;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.45)) !important;
}
.capsule-logo-text span{-webkit-text-fill-color:#A9D6E8 !important;color:#A9D6E8 !important}

.capsule-link{color:rgba(255,255,255,.88)}
.capsule-link:hover{background:rgba(255,255,255,.14);color:#fff}
.capsule-link.seo-highlight{
  background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.28);
}
.capsule-link.seo-highlight:hover{background:#A9D6E8;color:#123C2E;border-color:#A9D6E8}
.seo-badge-dot{background:#A9D6E8}
.capsule-phone-chip{
  background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);color:#fff;
}
.capsule-phone-chip:hover{background:#A9D6E8;color:#123C2E;border-color:#A9D6E8}
.capsule-burger{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.28);color:#fff}
.capsule-burger svg{stroke:#fff}
.vk-msg{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.28);color:#fff}
.vk-msg svg{fill:#fff}
.vk-msg:hover{background:#A9D6E8;color:#123C2E}
.vk-msg:hover svg{fill:#123C2E}

/* Размер шапки: на 1440 полная величина не помещалась — иконки уезжали
   за край, поэтому величины плавают от ширины экрана. */
@media (min-width:901px){
  :root{--vk-head-h:clamp(104px,7.4vw,132px)}
  .capsule-navbar{max-width:1640px !important;gap:clamp(16px,2vw,34px)}
  .vk-logo{width:clamp(80px,6vw,108px);height:clamp(80px,6vw,108px)}
  .capsule-brand{gap:clamp(12px,1.2vw,20px)}
  .capsule-logo-text{font-size:clamp(1.7rem,1.95vw,2.4rem)}
  .capsule-logo-text span{font-size:clamp(1.05rem,1.2vw,1.52rem)}
  .capsule-menu{gap:clamp(10px,1.3vw,20px)}
  .capsule-link{font-size:clamp(.98rem,1.05vw,1.26rem);padding:11px clamp(10px,1vw,18px)}
  .seo-badge-dot{width:9px;height:9px}
  .capsule-phone-chip{font-size:clamp(.98rem,1.05vw,1.28rem);padding:12px clamp(14px,1.4vw,22px);gap:10px}
  .pulse-status-dot{width:11px;height:11px}
  .vk-msg{width:clamp(42px,3.4vw,52px);height:clamp(42px,3.4vw,52px)}
  .vk-msg svg{width:54%;height:54%}
  .vk-msg-max span{font-size:clamp(.72rem,.72vw,.92rem)}
  :target,section[id],.anchor-target{scroll-margin-top:calc(var(--vk-head-h) + 16px)}
}

/* ═══ 2. КНОПКИ: стекло в хромированной рамке ═════════════════════════
   Кант нарисован градиентом на псевдоэлементе с вырезанной серединой:
   обычная рамка одним цветом отражения не даёт. */
.btn,.btn-lux,.tech-cta,.cookie-btn{position:relative;isolation:isolate}
.btn::after,.btn-lux::after,.tech-cta::after,.cookie-btn::after{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.6px;
  background:linear-gradient(180deg,#FFFFFF 0%,#9FB4BC 42%,#6E858E 52%,#DCE8ED 72%,#FFFFFF 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;z-index:1;
}
.btn--solid,.band--dark .btn-lux-gold,.tech-cta,.request .btn,.cookie-btn{
  background:linear-gradient(180deg,rgba(169,214,232,.44),rgba(255,255,255,.12));
  backdrop-filter:blur(18px) saturate(1.7);
  -webkit-backdrop-filter:blur(18px) saturate(1.7);
  border:0;color:#fff;font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 14px 32px -14px rgba(0,0,0,.72);
}
.btn--ghost{
  background:rgba(255,255,255,.04);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:0;color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
}
.btn--ghost::after{
  background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(159,180,188,.5) 48%,rgba(220,232,237,.75));
}
/* на светлом фоне стекло бледнеет — там тёмная капсула того же вида */
.band--white .btn,.band--light .btn,.band--white .btn-lux-gold{
  background:rgba(12,42,31,.86);
  backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  border:0;color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3), 0 12px 26px -12px rgba(12,42,31,.5);
}
.cookie-btn-ghost{background:rgba(255,255,255,.08) !important;color:#fff}
.request .btn,.cookie-btn{color:#fff;border:0}
 /* Вторичная кнопка встречается и на светлых секциях страниц видов,
   и в тёмном подвале. По умолчанию делаем её тёмным стеклом — белый текст
   на светлом фоне не читался. В подвале возвращаем светлый вариант. */
.btn-lux-outline{
  background:rgba(12,42,31,.88);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:0 !important;color:#fff !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.26), 0 10px 24px -12px rgba(12,42,31,.5);
}
.btn-lux-outline:hover{background:rgba(12,42,31,.96)}
footer .btn-lux-outline{
  background:rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.26);
}
footer .btn-lux-outline:hover{background:rgba(255,255,255,.16)}
.btn:hover,.btn-lux:hover,.tech-cta:hover,.cookie-btn:hover{transform:translateY(-2px)}
.btn--solid:hover,.tech-cta:hover,.request .btn:hover,.cookie-btn:hover{
  background:linear-gradient(180deg,rgba(169,214,232,.46),rgba(255,255,255,.18))}
.btn--ghost:hover{background:rgba(255,255,255,.12)}
.band--white .btn:hover,.band--light .btn:hover{background:rgba(12,42,31,.95)}
.btn:hover::after,.btn-lux:hover::after,.tech-cta:hover::after,.cookie-btn:hover::after{
  background:linear-gradient(180deg,#FFFFFF 0%,#C6D6DC 40%,#8CA3AC 52%,#EAF2F5 70%,#FFFFFF 100%);
}
.btn:active,.btn-lux:active,.tech-cta:active,.cookie-btn:active{transform:translateY(0)}
.btn > *,.btn-lux > *,.tech-cta > *,.cookie-btn > *{position:relative;z-index:2}

/* ═══ 3. ПОДВАЛ ══════════════════════════════════════════════════════
   Знак слева, имя справа крупно, под чертой три колонки ссылок. */
footer{padding-top:18px !important}
.footer-head{
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2.1fr);
  gap:clamp(20px,2.4vw,40px);align-items:center;
  padding-bottom:6px;margin-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.14);
}
.footer-mark{display:flex;justify-content:center;align-self:center}
/* у знака внутри файла прозрачное поле 6% — запас на круглую обрезку
   в соцсетях; на странице оно читается как лишний воздух */
.footer-logo{width:100%;max-width:300px;height:auto;display:block;margin:-6%}
.footer-ident{min-width:0}
.footer-name{
  display:block;text-decoration:none;color:#fff;
  font-family:'Literata',Georgia,serif;font-weight:700;
  font-size:clamp(2.4rem,5.4vw,4.6rem);line-height:1;letter-spacing:.01em;
}
.footer-name span{color:#A9D6E8;font-family:'Golos Text',system-ui,sans-serif;font-size:.42em;font-weight:600}
.footer-about{
  margin:clamp(10px,1vw,14px) 0 0;max-width:62ch;
  font-size:.95rem;line-height:1.65;color:rgba(255,255,255,.68);
}
.footer-grid--3{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  margin-bottom:clamp(20px,2vw,30px) !important;
}

@media (max-width:900px){
  .footer-head{grid-template-columns:1fr;gap:18px;text-align:center;justify-items:center}
  .footer-logo{max-width:190px}
  .footer-name{font-size:clamp(2rem,9vw,2.8rem)}
  .footer-about{margin-inline:auto;text-align:center}
  .footer-grid--3{grid-template-columns:1fr !important}
}

/* ==========================================================================
   ФОН СТРАНИЦЫ ВМЕСТО СТАРОЙ ФОТОСЦЕНЫ            (добавлено 07.10.2026)
   Слои .vk-layer — фиксированная фотосцена сине-белой версии сайта:
   .vk-photo (кадр «молуккский какаду и гиацинтовый ара на фоне неба»)
   и .vk-light (световой градиент). У body стоял background:transparent,
   поэтому старый кадр просвечивал вокруг подвала и под ним на всех страницах.
   В зелёной теме сцена не нужна: первые экраны имеют собственные фотографии.
   ========================================================================== */
.vk-layer{display:none !important}
body{background:#F1EBDD !important}
/* «О нас» светлее остальных страниц — поле вокруг подвала держим в её тоне */
body:has(main.about){background:#FBF8F1 !important}