﻿    /* --- HEADER --- */
    header.site {
      position: sticky; top: 0; z-index: 100; backdrop-filter: blur(18px);
      background: linear-gradient(180deg, rgba(8,11,18,0.92), rgba(8,11,18,0.78));
      border-bottom: 1px solid rgba(148,163,184,0.14);
    }
    .brand { display:flex; align-items:center; gap: 10px; cursor: pointer; min-width: 0; }
    .brand-badge {
      width:40px; height:40px; display:grid; place-items:center; color:#fff; font-weight:900;
      filter: drop-shadow(0 10px 20px rgba(91,140,255,0.16));
    }
    .brand .h3 { letter-spacing: -0.03em; }
    .row { display:flex; align-items:center; justify-content:space-between; height:72px; }
    
    .burger, .toggle-lang {
      border: 1px solid rgba(148,163,184,0.18);
      background:
        linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.025)),
        rgba(15,20,32,0.86);
      border-radius: 16px !important;
      cursor:pointer;
      display:grid; place-items:center; color: var(--text);
      height: 44px; padding: 0 14px;
      box-shadow: 0 12px 28px rgba(0,0,0,0.24), inset 0 1px 0 rgba(255,255,255,0.05);
      transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
    }
    .burger:hover,
    .toggle-lang:hover,
    .custom-select-trigger:hover {
      transform: translateY(-1px);
      border-color: rgba(148,163,184,0.34);
      background:
        linear-gradient(180deg, rgba(255,255,255,0.1), rgba(255,255,255,0.035)),
        rgba(18,24,38,0.92);
    }
    .burger { width: 44px; padding: 0; display: none; }
    .burger svg { width: 20px; height: 20px; }
    .burger path { stroke-width: 2.4; }
    .toggle-lang { 
      font-weight: 700; 
      font-size: 14px;
      min-width: 52px;
      text-transform: uppercase;
    }
    .header-actions { display:flex; gap:10px; align-items:center; min-width: 0; }

    @media (max-width: 1023px) {
      .burger { display: grid; }
    }

    @media (max-width: 768px) {
      #langToggle { display: none !important; }
      header.site .container { padding: 0 14px; }
      .row { gap: 10px; height: 64px; }
      .brand { gap: 8px; flex-shrink: 0; }
      .header-actions { margin-left: auto; gap: 10px; min-width: 0; }
      #headerCitySelect { min-width: 0; max-width: 168px; }
      #headerCitySelect .custom-select-trigger { min-width: 0 !important; padding: 0 12px 0 14px; }
      #headerCitySelect .custom-select-trigger span { max-width: 104px; }
      .form-input, .custom-select-trigger, .custom-option, input, select, textarea {
        font-size: 16px !important; 
      }
    }

    @media (max-width: 420px) {
      .brand .h3 { display: block; font-size: 18px; }
      .brand-badge { width: 36px; height: 36px; }
      .row { height: 62px; }
      #headerCitySelect { max-width: 150px; }
      .burger { width: 42px; height: 42px; border-radius: 14px !important; }
    }

    @media (max-width: 374px) {
      .brand .h3 { font-size: 16px; }
      #headerCitySelect { max-width: 150px; }
    }

    .custom-select-container { position: relative; user-select: none; min-width: 100px; }
    
    .custom-select-trigger {
      display: flex; align-items: center; justify-content: space-between; padding: 0 15px 0 16px; height: 44px;
      background:
        linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.025)),
        rgba(15,20,32,0.86);
      border: 1px solid rgba(148,163,184,0.18);
      border-radius: 16px !important;
      cursor: pointer; font-size: 14px; font-weight: 700; color: var(--text); transition: all 0.2s; gap: 8px;
      box-shadow: 0 12px 28px rgba(0,0,0,0.24), inset 0 1px 0 rgba(255,255,255,0.05);
    }
    .custom-select-trigger span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .custom-select-arrow { width: 16px; height: 16px; transition: transform 0.3s ease; color: var(--text-dim); }
    .custom-select-container.open .custom-select-arrow { transform: rotate(180deg); }

    .custom-options {
      position: absolute; top: calc(100% + 8px); left: 0; right: 0; background: var(--surface-2);
      border: 1px solid rgba(148,163,184,0.2); border-radius: 16px !important; box-shadow: var(--shadow);
      opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.2s ease; z-index: 200; overflow: hidden;
    }
    .custom-select-container.open .custom-options { opacity: 1; visibility: visible; transform: translateY(0); }

    .custom-option {
      padding: 12px 14px; font-size: 14px; font-weight: 600; color: var(--text-dim);
      cursor: pointer; transition: all 0.2s; border-bottom: 1px solid rgba(255,255,255,0.04);
    }
    .custom-option:last-child { border-bottom: none; }
    .custom-option:hover { background: rgba(91,140,255,0.12); color: var(--text); }
    .custom-option.selected { background: rgba(139,92,246,0.2); color: #fff; }
    
    #headerCitySelect .custom-select-trigger { min-width: 150px; }
    #headerCitySelect .custom-options { min-width: 160px; left: auto; right: 0; }

    .form-group .custom-select-container { width: 100%; }
    .form-group .custom-select-trigger { width: 100%; justify-content: space-between; font-weight: 400; font-size: 15px; }
    

