/* === VLK Theme v4: hot->cold + visible glass steam/drops + readable sections === */

:root{
  --hot1: rgba(90,33,15,0.98);
  --hot2: rgba(180,83,9,0.72);
  --hot3: rgba(249,115,22,0.28);
  --mid : rgba(14,165,233,0.14);
  --cold: rgba(7,16,40,0.98);

  --ink: #0b1220;
  --muted: rgba(17,24,39,0.62);

  --card-bg: rgba(255,255,255,0.96);
  --card-border: rgba(0,0,0,0.06);
}

/* Background */
html,body{height:100%}
body{
  color: var(--ink);
  background:
    radial-gradient(900px 520px at 15% 0%, rgba(253,230,138,0.18), transparent 64%),
    radial-gradient(820px 460px at 85% 8%, rgba(249,115,22,0.14), transparent 66%),
    radial-gradient(980px 560px at 50% 40%, rgba(14,165,233,0.10), transparent 72%),
    linear-gradient(180deg, var(--hot1) 0%, var(--hot2) 14%, var(--hot3) 30%, var(--mid) 62%, var(--cold) 100%);
  background-attachment: scroll;
}
@media (min-width: 721px){
  body{ background-attachment: fixed; }
}

/* Muted readability */
.muted{ color: var(--muted) !important; }

/* Cards */
.card, .bg-white.card, .card.bg-white{
  background: var(--card-bg) !important;
  border: 1px solid var(--card-border) !important;
  color: var(--ink) !important;
  border-radius: 18px;
  box-shadow: 0 14px 34px rgba(0,0,0,0.14);
}

/* Landing sections: give readable panels so text never “теряется” */
#prices, #gallery, #contacts{
  margin-top: 28px;
  padding: 18px;
  border-radius: 18px;
  background: rgba(255,255,255,0.55);
  border: 1px solid rgba(255,255,255,0.40);
}
@media (min-width: 721px){
  #prices, #gallery, #contacts{
    background: rgba(255,255,255,0.50);
  }
}
#prices .text-leader2, #gallery .text-leader2, #contacts .text-leader2{
  color: var(--ink) !important;
}
#prices .muted, #gallery .muted, #contacts .muted{
  color: rgba(17,24,39,0.60) !important;
}

/* Hero actions wrap on mobile to avoid “наезжают” */
.hero-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
@media (max-width: 720px){
  .landing-hero-row .cell-md-5{ margin-top: 12px; }
}

/* Topbar hot */
.vlk-topbar{
  background: linear-gradient(90deg, rgba(90,33,15,0.92), rgba(249,115,22,0.86)) !important;
  border-bottom: 1px solid rgba(255,255,255,0.14);
}
.vlk-topbar .brand, .vlk-topbar a{ color: rgba(255,255,255,0.95) !important; }

/* Cookie consent always on top */
.cookie-consent{ position:fixed; z-index: 2002; }

/* Buttons */
.button.btn-brand, .button.primary, .btn-brand{
  background: linear-gradient(180deg, rgba(253,230,138,0.95), rgba(249,115,22,0.98)) !important;
  border-color: rgba(0,0,0,0.06) !important;
  color: #111827 !important;
  font-weight: 900;
  border-radius: 14px;
}

/* ===== GLASS overlay (visible, not muddy) ===== */
.vlk-glass-overlay{
  position: fixed;
  inset: 0;
  z-index: 999;
  pointer-events: none;
}

/* Steam: visible but light, mostly top (done by gradient layer) */
.vlk-glass-overlay::before{
  content:"";
  position:absolute;
  inset:-20%;
  background:
    radial-gradient(600px 320px at 18% 10%, rgba(255,255,255,0.20), transparent 72%),
    radial-gradient(760px 420px at 58% 8%,  rgba(255,255,255,0.16), transparent 74%),
    radial-gradient(620px 360px at 86% 16%, rgba(255,255,255,0.18), transparent 76%),
    radial-gradient(980px 520px at 45% 36%, rgba(255,255,255,0.10), transparent 78%),
    linear-gradient(to bottom, rgba(255,255,255,0.18), rgba(255,255,255,0.00) 70%);
  filter: blur(30px);
  opacity: 0.48;
  transform: translate3d(0,0,0);
  animation: vlkSteam 36s ease-in-out infinite;
}

/* Drops: a bit stronger, slow drift (like on glass) */
.vlk-glass-overlay::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='900'%20height='900'%20viewBox='0%200%20900%20900'%3E%3Cg%20fill='white'%20fill-opacity='0.11'%3E%3Cellipse%20cx='120'%20cy='110'%20rx='10'%20ry='14'/%3E%3Cellipse%20cx='220'%20cy='180'%20rx='7'%20ry='10'/%3E%3Cellipse%20cx='380'%20cy='140'%20rx='9'%20ry='13'/%3E%3Cellipse%20cx='680'%20cy='160'%20rx='8'%20ry='12'/%3E%3Cellipse%20cx='560'%20cy='260'%20rx='7'%20ry='10'/%3E%3Cellipse%20cx='160'%20cy='380'%20rx='8'%20ry='12'/%3E%3Cellipse%20cx='320'%20cy='420'%20rx='10'%20ry='14'/%3E%3Cellipse%20cx='640'%20cy='480'%20rx='9'%20ry='13'/%3E%3Cellipse%20cx='780'%20cy='560'%20rx='7'%20ry='10'/%3E%3Cellipse%20cx='240'%20cy='640'%20rx='9'%20ry='13'/%3E%3Cellipse%20cx='520'%20cy='720'%20rx='8'%20ry='12'/%3E%3Cellipse%20cx='760'%20cy='740'%20rx='10'%20ry='14'/%3E%3C/g%3E%3Cg%20fill='white'%20fill-opacity='0.18'%3E%3Ccircle%20cx='116'%20cy='104'%20r='2.4'/%3E%3Ccircle%20cx='216'%20cy='174'%20r='2.0'/%3E%3Ccircle%20cx='374'%20cy='134'%20r='2.2'/%3E%3Ccircle%20cx='674'%20cy='154'%20r='2.1'/%3E%3Ccircle%20cx='316'%20cy='412'%20r='2.6'/%3E%3Ccircle%20cx='756'%20cy='732'%20r='2.8'/%3E%3C/g%3E%3Cg%20fill='none'%20stroke='white'%20stroke-opacity='0.10'%20stroke-width='2'%3E%3Cpath%20d='M170%20210%20C190%20310%20150%20390%20190%20510%20C220%20610%20210%20720%20240%20840'/%3E%3Cpath%20d='M520%20180%20C540%20290%20510%20370%20540%20510%20C570%20630%20560%20740%20590%20860'/%3E%3Cpath%20d='M740%20260%20C760%20360%20720%20440%20760%20570%20C790%20670%20780%20780%20810%20880'/%3E%3C/g%3E%3C/svg%3E"),
    linear-gradient(to bottom, rgba(255,255,255,0.20), rgba(255,255,255,0.00) 78%);
  background-size: 940px 940px, 100% 100%;
  background-repeat: repeat, no-repeat;
  opacity: 0.55;
  filter: blur(0.15px);
  animation: vlkDrops 110s linear infinite;
}

@keyframes vlkSteam{
  0%   { transform: translate3d(-1.0%, -0.6%, 0) scale(1.02); }
  50%  { transform: translate3d( 1.1%, -1.0%, 0) scale(1.04); }
  100% { transform: translate3d(-1.0%, -0.6%, 0) scale(1.02); }
}
@keyframes vlkDrops{
  from { background-position: 0 -220px, 0 0; }
  to   { background-position: 0 260px, 0 0; }
}

/* Mobile tuning: visible but very calm */
@media (max-width: 720px){
  .vlk-glass-overlay::before{ opacity: 0.36; animation-duration: 52s; filter: blur(26px); }
  .vlk-glass-overlay::after { opacity: 0.44; animation-duration: 160s; background-size: 820px 820px, 100% 100%; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .vlk-glass-overlay::before,
  .vlk-glass-overlay::after{ animation: none !important; }
}

/* Background must NOT be fixed (iOS scroll-jank). */
body{ background-attachment: scroll !important; }

/* Overlay: on mobile disable tiling seams and calm it down. */
@media (max-width: 900px){
  .vlk-glass-overlay::before{
    opacity: 0.26 !important;
    animation-duration: 60s !important;
  }
  .vlk-glass-overlay::after{
    opacity: 0.28 !important;
    animation: none !important;
    background-repeat: no-repeat, no-repeat !important;
    background-size: cover, 100% 100% !important;
    background-position: center top, 0 0 !important;
  }
}

/* Desktop: slightly calmer so content stays high-contrast */
@media (min-width: 901px){
  .vlk-glass-overlay::before{ opacity: 0.34 !important; }
  .vlk-glass-overlay::after { opacity: 0.38 !important; }
}

/* Шапка: спокойная тёмная, без просвечивания контента под ней */
.vlk-topbar{
  background: rgba(7,16,40,0.88) !important;
  border-bottom: 1px solid rgba(255,255,255,0.10) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* На мобилке делаем почти непрозрачной, чтобы не было "каши" из текста за шапкой */
@media (max-width: 900px){
  .vlk-topbar{ background: rgba(7,16,40,0.94) !important; }
}

/* overlay ниже шапки по слою */
.vlk-glass-overlay{ z-index: 900 !important; }