@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/golos-text-400-cyrillic-ext.woff2") format("woff2");
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/golos-text-400-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/golos-text-400-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/golos-text-400-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/golos-text-500-cyrillic-ext.woff2") format("woff2");
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/golos-text-500-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/golos-text-500-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/golos-text-500-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/golos-text-600-cyrillic-ext.woff2") format("woff2");
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/golos-text-600-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/golos-text-600-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/golos-text-600-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/golos-text-700-cyrillic-ext.woff2") format("woff2");
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/golos-text-700-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/golos-text-700-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Golos Text';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/golos-text-700-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Literata';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/literata-400-italic-cyrillic-ext.woff2") format("woff2");
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face{
  font-family:'Literata';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/literata-400-italic-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Literata';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/literata-400-italic-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Literata';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/literata-400-italic-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/literata-400-cyrillic-ext.woff2") format("woff2");
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/literata-400-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/literata-400-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/literata-400-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/literata-600-cyrillic-ext.woff2") format("woff2");
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/literata-600-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/literata-600-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/literata-600-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/literata-700-cyrillic-ext.woff2") format("woff2");
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/literata-700-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/literata-700-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Literata';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/literata-700-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


    :root {
      --bg-ivory: #DCEAF3;
      --bg-surface: #FFFFFF;
      --bg-champagne: #EAF2F9;
      --bg-emerald-mist: #EDF4FA;
      --primary-deep: #14243A;
      --primary-forest: #14336E;
      --primary-sage: #1F4CA0;
      --gold-primary: #1F53E0;
      --gold-light: #7EA8FF;
      --gold-pale: #F2F7FF;
      --gold-border: rgba(31, 83, 224, 0.32);
      --gold-gradient: linear-gradient(135deg, #3B74FF 0%, #1F53E0 100%);
      --text-head: #14243A;
      --text-body: #33465E;
      --text-muted: #55677F;
      --border-soft: #DCE6F0;
      --shadow-subtle: 0 4px 20px -2px rgba(20, 36, 58, 0.06);
      --shadow-luxury: 0 18px 44px -10px rgba(20, 36, 58, 0.16), 0 1px 3px rgba(20, 36, 58, 0.05);
      --shadow-hover: 0 25px 60px -12px rgba(20, 36, 58, 0.22);
      --shadow-capsule: 0 10px 28px -8px rgba(20, 36, 58, 0.16);
      --radius-sm: 8px;
      --radius-md: 16px;
      --radius-lg: 24px;
      --radius-xl: 32px;
      --transition-smooth: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      -webkit-tap-highlight-color: transparent;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: "Golos Text", system-ui, -apple-system, sans-serif;
      background-color: var(--bg-ivory);
      color: var(--text-body);
      line-height: 1.65;
      overflow-x: hidden;
      -webkit-font-smoothing: antialiased;
    }

    h1, h2, h3, .font-serif {
      font-family: "Literata", Georgia, serif;
      font-weight: 700;
      color: var(--primary-deep);
      line-height: 1.15;
      letter-spacing: -0.01em;
    }

    h4, h5, h6, .font-sans {
      font-family: "Golos Text", system-ui, sans-serif;
      font-weight: 600;
      letter-spacing: 0.02em;
    }

    a {
      text-decoration: none;
      color: inherit;
    }

    img {
      max-width: 100%;
      height: auto;
      display: block;
    }

    .container {
      max-width: 1280px;
      margin: 0 auto;
      padding: 0 24px;
    }

    .svg-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 20px;
      height: 20px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
      flex-shrink: 0;
    }

    /* FLOATING GLASS CAPSULE HEADER (FIXED & UNBREAKABLE) */
    .capsule-header-holder {
      position: sticky;
      top: 14px;
      z-index: 1000;
      padding: 0 16px;
      pointer-events: none;
    }

    .capsule-navbar {
      pointer-events: auto;
      max-width: 1260px;
      margin: 0 auto;
      height: 64px;
      background: rgba(255, 255, 255, 0.94);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border: 1.5px solid rgba(31, 83, 224, 0.35);
      border-radius: 999px;
      box-shadow: var(--shadow-capsule);
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 8px 0 18px;
      gap: 12px;
      transition: var(--transition-smooth);
    }

    .capsule-navbar:hover {
      border-color: rgba(31, 83, 224, 0.6);
      box-shadow: 0 20px 45px -8px rgba(20, 36, 58, 0.16);
    }

    /* Brand in Capsule */
    .capsule-brand {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-shrink: 0;
      white-space: nowrap;
    }

    .capsule-crest {
      width: 36px;
      height: 36px;
      background: var(--primary-deep);
      border: 1px solid var(--gold-primary);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 3px 10px rgba(20, 36, 58, 0.2);
      flex-shrink: 0;
    }

    .capsule-crest svg {
      width: 18px;
      height: 18px;
      stroke: var(--gold-light);
    }

    .capsule-logo-text {
      font-family: "Literata", Georgia, serif;
      font-size: 1.5rem;
      font-weight: 700;
      color: var(--primary-deep);
      letter-spacing: 0.5px;
      line-height: 1;
    }

    .capsule-logo-text span {
      color: var(--gold-primary);
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 1rem;
      font-weight: 600;
    }

    /* Capsule Navigation Menu */
    .capsule-menu {
      display: flex;
      align-items: center;
      gap: 4px;
      flex-wrap: nowrap;
    }

    .capsule-link {
      padding: 7px 12px;
      border-radius: 999px;
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.84rem;
      font-weight: 600;
      color: var(--text-head);
      transition: var(--transition-smooth);
      display: flex;
      align-items: center;
      gap: 6px;
      white-space: nowrap;
      flex-shrink: 0;
    }

    .capsule-link:hover {
      background: var(--bg-champagne);
      color: var(--primary-forest);
    }

    .capsule-link.seo-highlight {
      background: var(--bg-emerald-mist);
      color: var(--primary-forest);
      border: 1px solid rgba(45, 106, 83, 0.22);
    }

    .capsule-link.seo-highlight:hover {
      background: var(--primary-deep);
      color: var(--gold-light);
      border-color: var(--primary-deep);
    }

    .seo-badge-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--gold-primary);
      flex-shrink: 0;
    }

    /* Right Action Group */
    .capsule-actions {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-shrink: 0;
      white-space: nowrap;
    }

    .capsule-phone-chip {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 7px 14px;
      border-radius: 999px;
      background: var(--bg-ivory);
      border: 1px solid var(--border-soft);
      font-family: "Golos Text", system-ui, sans-serif;
      font-weight: 700;
      font-size: 0.86rem;
      color: var(--primary-deep);
      transition: var(--transition-smooth);
      white-space: nowrap;
      flex-shrink: 0;
      text-decoration: none;
    }

    .capsule-phone-chip:hover {
      border-color: var(--gold-primary);
      color: var(--gold-primary);
      background: white;
    }

    .pulse-status-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #22C55E;
      box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
      animation: pulseGreen 2s infinite;
      flex-shrink: 0;
    }

    @keyframes pulseGreen {
      0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7); }
      70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
      100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
    }

    .capsule-btn-cta {
      padding: 9px 20px;
      border-radius: 999px;
      background: var(--gold-gradient);
      color: #F4F8FF;
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.82rem;
      font-weight: 700;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      border: none;
      cursor: pointer;
      box-shadow: 0 4px 14px rgba(31, 83, 224, 0.35);
      transition: var(--transition-smooth);
      white-space: nowrap;
      flex-shrink: 0;
    }

    .capsule-btn-cta:hover {
      transform: translateY(-1.5px);
      box-shadow: 0 6px 20px rgba(31, 83, 224, 0.5);
    }

    /* Mobile Menu Button (Clear, Prominent, Luxury Pill) */
    .capsule-burger {
      display: none;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 8px 14px;
      height: 38px;
      border-radius: 999px;
      background: var(--primary-deep);
      border: 1.5px solid var(--gold-primary);
      color: var(--gold-light);
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.8px;
      text-transform: uppercase;
      cursor: pointer;
      flex-shrink: 0;
      box-shadow: 0 2px 8px rgba(20, 36, 58, 0.25);
      transition: var(--transition-smooth);
    }

    .capsule-burger:hover {
      background: var(--primary-forest);
      border-color: var(--gold-light);
      transform: translateY(-1px);
    }

    .capsule-burger svg {
      width: 14px;
      height: 14px;
      stroke: var(--gold-light);
    }

    /* Mobile Overlay Menu */
    .mobile-menu-drawer {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      background: rgba(20, 36, 58, 0.98);
      backdrop-filter: blur(20px);
      z-index: 9999;
      display: none;
      flex-direction: column;
      padding: 30px 24px;
      animation: modalFade 0.3s ease;
    }

    .mobile-menu-drawer.active {
      display: flex;
    }

    .mobile-drawer-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 40px;
      border-bottom: 1px solid rgba(31, 83, 224, 0.2);
      padding-bottom: 20px;
    }

    .mobile-nav-links {
      display: flex;
      flex-direction: column;
      gap: 16px;
      margin-bottom: auto;
    }

    .mobile-nav-item {
      font-family: "Literata", serif;
      font-size: 1.8rem;
      color: white;
      font-weight: 700;
      padding: 10px 0;
      border-bottom: 1px solid rgba(255, 255, 255, 0.08);
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .mobile-nav-item.highlight {
      color: var(--gold-light);
    }

    /* BUTTONS */
    .btn-lux {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 13px 26px;
      border-radius: var(--radius-sm);
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.88rem;
      font-weight: 600;
      letter-spacing: 0.5px;
      cursor: pointer;
      border: none;
      transition: var(--transition-smooth);
      text-transform: uppercase;
      text-align: center;
    }

    .btn-lux-gold {
      background: var(--gold-gradient);
      color: #F4F8FF;
      box-shadow: 0 4px 18px rgba(31, 83, 224, 0.3);
    }

    .btn-lux-gold:hover {
      box-shadow: 0 8px 25px rgba(31, 83, 224, 0.45);
      transform: translateY(-2px);
    }

    .btn-lux-outline {
      background: transparent;
      border: 1.5px solid var(--gold-primary);
      color: var(--primary-deep);
    }

    .btn-lux-outline:hover {
      background: var(--primary-deep);
      color: var(--gold-light);
      border-color: var(--primary-deep);
      transform: translateY(-2px);
    }

    .btn-lux-deep {
      background: var(--primary-deep);
      color: var(--gold-light);
      border: 1px solid rgba(31, 83, 224, 0.4);
    }

    .btn-lux-deep:hover {
      background: var(--primary-forest);
      box-shadow: var(--shadow-luxury);
      transform: translateY(-2px);
    }

    /* HERO SECTION WITH LUXURY PARROT PHOTO BACKGROUNDS */
    .hero-wrap {
      position: relative;
      padding: 60px 0 100px;
      background-image: 
        linear-gradient(180deg, rgba(250, 247, 242, 0.4) 0%, rgba(250, 247, 242, 0.15) 40%, rgba(250, 247, 242, 0.9) 100%),
        image-set(url('../bg/hero-desktop-1280.webp') 1x, url('../bg/hero-desktop.webp') 2x);
      background-size: cover;
      background-position: center 25%;
      background-repeat: no-repeat;
      min-height: 640px;
      display: flex;
      align-items: center;
    }

    .hero-text-col {
      background: rgba(255, 255, 255, 0.88);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border: 1.5px solid rgba(31, 83, 224, 0.35);
      border-radius: var(--radius-xl);
      padding: 44px 38px;
      box-shadow: var(--shadow-luxury);
      max-width: 650px;
      position: relative;
      z-index: 2;
    }

    .hero-grid {
      display: grid;
      grid-template-columns: 1.15fr 0.85fr;
      gap: 40px;
      align-items: center;
      width: 100%;
    }

    .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 6px 16px;
      background: var(--bg-surface);
      border: 1px solid var(--gold-border);
      border-radius: 999px;
      font-size: 0.76rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 1px;
      color: var(--primary-deep);
      box-shadow: var(--shadow-subtle);
      margin-bottom: 20px;
    }

    .hero-badge .crest-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--gold-primary);
    }

    .hero-title {
      font-size: clamp(2.4rem, 4.2vw, 3.8rem);
      margin-bottom: 20px;
      color: var(--primary-deep);
    }

    .hero-title em {
      font-style: italic;
      color: var(--primary-sage);
      position: relative;
    }

    .hero-desc {
      font-size: 1.12rem;
      color: var(--text-body);
      margin-bottom: 32px;
      line-height: 1.7;
      max-width: 580px;
    }

    .hero-ctas {
      display: flex;
      gap: 14px;
      margin-bottom: 40px;
      flex-wrap: wrap;
    }

    .hero-stats-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
      padding-top: 26px;
      border-top: 1px solid var(--border-soft);
    }

    .stat-box {
      display: flex;
      flex-direction: column;
    }

    .stat-val {
      font-family: "Literata", Georgia, serif;
      font-size: 2rem;
      font-weight: 700;
      color: var(--primary-deep);
      line-height: 1;
    }

    .stat-label {
      font-size: 0.78rem;
      color: var(--text-muted);
      margin-top: 4px;
      font-weight: 500;
    }

    /* Hero Visual Card */
    .hero-art-frame {
      position: relative;
    }

    .art-card {
      background: var(--bg-surface);
      border-radius: var(--radius-xl);
      padding: 16px;
      border: 1px solid var(--gold-border);
      box-shadow: var(--shadow-luxury);
      position: relative;
    }

    .art-img-wrapper {
      position: relative;
      height: 440px;
      border-radius: var(--radius-lg);
      overflow: hidden;
      background: #E8E0D2;
    }

    .art-img-wrapper img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 22%;
      transition: transform 0.8s ease;
    }

    .art-card:hover .art-img-wrapper img {
      transform: scale(1.04);
    }

    .art-overlay-ribbon {
      position: absolute;
      top: 20px;
      left: 20px;
      background: rgba(20, 36, 58, 0.9);
      backdrop-filter: blur(10px);
      padding: 7px 16px;
      border-radius: var(--radius-sm);
      border: 1px solid var(--gold-border);
      color: var(--gold-light);
      font-size: 0.8rem;
      font-family: "Golos Text", system-ui, sans-serif;
      font-weight: 600;
      letter-spacing: 0.5px;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .floating-luxury-badge {
      position: absolute;
      bottom: -20px;
      right: -15px;
      background: var(--bg-surface);
      border: 1.5px solid var(--gold-primary);
      border-radius: var(--radius-md);
      padding: 14px 18px;
      box-shadow: var(--shadow-luxury);
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .badge-icon-gold {
      width: 40px;
      height: 40px;
      background: var(--gold-pale);
      border: 1px solid var(--gold-border);
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--gold-primary);
    }

    /* SECTION STYLES */
    .section-wrap {
      padding: 80px 0;
      position: relative;
    }

    .section-head-center {
      text-align: center;
      max-width: 760px;
      margin: 0 auto 50px;
    }

    .sec-kicker {
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.8rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 2px;
      color: var(--gold-primary);
      margin-bottom: 10px;
      display: block;
    }

    .sec-title {
      font-size: clamp(2.1rem, 3.4vw, 3rem);
      margin-bottom: 14px;
      color: var(--primary-deep);
    }

    .sec-intro {
      font-size: 1.05rem;
      color: var(--text-muted);
      line-height: 1.65;
    }

    /* CONCIERGE 5-STEP PROTOCOL */
    .protocol-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 18px;
    }

    .protocol-card {
      background: var(--bg-surface);
      border: 1px solid var(--border-soft);
      border-radius: var(--radius-lg);
      padding: 28px 20px;
      box-shadow: var(--shadow-subtle);
      transition: var(--transition-smooth);
      position: relative;
      display: flex;
      flex-direction: column;
    }

    .protocol-card:hover {
      transform: translateY(-5px);
      box-shadow: var(--shadow-luxury);
      border-color: var(--gold-primary);
    }

    .protocol-step-num {
      font-family: "Literata", Georgia, serif;
      font-size: 2rem;
      font-weight: 700;
      color: var(--gold-primary);
      line-height: 1;
      margin-bottom: 14px;
    }

    .protocol-title {
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 1.02rem;
      color: var(--primary-deep);
      margin-bottom: 8px;
    }

    .protocol-desc {
      font-size: 0.85rem;
      color: var(--text-muted);
      line-height: 1.55;
    }

    /* BRAND MANIFESTO & PHILOSOPHY TRIPTYCH */
    .manifesto-wrap {
      background: linear-gradient(180deg, #0B1E42 0%, var(--primary-deep) 100%);
      color: white;
      border-radius: var(--radius-xl);
      padding: 70px 45px;
      border: 1px solid var(--gold-border);
      position: relative;
      overflow: hidden;
      margin: 40px 0;
      box-shadow: var(--shadow-luxury);
    }

    .manifesto-wrap::before {
      content: '';
      position: absolute;
      top: -120px;
      right: -120px;
      width: 450px;
      height: 450px;
      background: radial-gradient(circle, rgba(31, 83, 224, 0.15) 0%, transparent 70%);
      pointer-events: none;
    }

    .manifesto-triptych-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 30px;
      position: relative;
      z-index: 1;
    }

    .manifesto-card {
      background: rgba(255, 255, 255, 0.04);
      border: 1px solid rgba(31, 83, 224, 0.25);
      border-radius: var(--radius-lg);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      transition: var(--transition-smooth);
    }

    .manifesto-card:hover {
      background: rgba(255, 255, 255, 0.08);
      border-color: var(--gold-primary);
      transform: translateY(-8px);
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
    }

    .manifesto-numeral {
      display: flex;
      align-items: baseline;
      gap: 14px;
      padding: 26px 22px 0;
    }

    .manifesto-numeral .num {
      font-family: "Literata", Georgia, serif;
      font-size: 3.4rem;
      font-weight: 700;
      line-height: 0.85;
      color: var(--gold-primary);
      letter-spacing: 0.02em;
    }

    .manifesto-numeral .num-label {
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(126, 168, 255, 0.75);
    }

    .manifesto-rule {
      height: 1px;
      background: linear-gradient(90deg, var(--gold-primary), rgba(31, 83, 224, 0.05));
      margin: 18px 22px 0;
    }

    .manifesto-body {
      padding: 26px 22px;
      display: flex;
      flex-direction: column;
      flex: 1;
    }

    .manifesto-card-title {
      font-family: "Literata", Georgia, serif;
      font-size: 1.65rem;
      color: var(--gold-light);
      margin-bottom: 12px;
      line-height: 1.2;
    }

    .manifesto-card-text {
      font-size: 0.88rem;
      color: rgba(255, 255, 255, 0.78);
      line-height: 1.65;
    }

    /* ---------- СОСТОЯНИЕ ОТПРАВКИ ФОРМЫ ---------- */
    .form-status {
      margin-top: 12px;
      font-size: 0.85rem;
      line-height: 1.5;
      text-align: center;
      min-height: 1px;
    }

    .form-status-ok { color: var(--primary-sage); font-weight: 600; }
    .form-status-err { color: #B4342A; }
    .form-status a { color: inherit; text-decoration: underline; }

    .hp-field {
      position: absolute;
      left: -9999px;
      width: 1px;
      height: 1px;
      overflow: hidden;
    }

    /* ---------- КНОПКИ-КАРТОЧКИ (бывшие div с onclick) ---------- */
    .quiz-lux-card,
    .forum-topic-card {
      font: inherit;
      color: inherit;
      text-align: left;
      width: 100%;
      appearance: none;
    }

    /* ---------- ФОКУС С КЛАВИАТУРЫ ---------- */
    :focus-visible {
      outline: 2px solid var(--gold-primary);
      outline-offset: 3px;
      border-radius: 4px;
    }

    .manifesto-wrap :focus-visible,
    footer :focus-visible,
    .mobile-menu-drawer :focus-visible {
      outline-color: var(--gold-light);
    }

    /* ---------- ЗОНЫ НАЖАТИЯ ---------- */
    .sq-link-btn {
      min-height: 44px;
      display: inline-flex;
      align-items: center;
    }

    .footer-links a {
      display: inline-block;
      padding: 6px 0;
    }

    .calc-checkbox-item,
    .form-check-label {
      min-height: 44px;
      align-items: center;
    }

    .calc-checkbox-item input[type="checkbox"],
    .form-check-label input[type="checkbox"] {
      width: 20px;
      height: 20px;
      flex-shrink: 0;
      accent-color: var(--gold-primary);
      cursor: pointer;
    }

    /* ---------- COOKIE ---------- */
    .cookie-actions {
      display: flex;
      gap: 10px;
      flex-shrink: 0;
    }

    .cookie-btn-ghost {
      background: transparent;
      color: var(--gold-light);
      border: 1px solid rgba(31, 83, 224, 0.5);
    }

    /* ---------- СНОСКИ ---------- */
    .price-disclaimer {
      margin-top: 14px;
      font-size: 0.74rem;
      line-height: 1.55;
      color: rgba(255, 255, 255, 0.55);
    }

    .vet-note {
      margin-top: 10px;
      font-size: 0.76rem;
      line-height: 1.5;
      color: var(--text-muted);
      border-left: 2px solid var(--gold-border);
      padding-left: 10px;
    }

    /* ---------- БЛОКИРОВКА ПРОКРУТКИ ПОД ОВЕРЛЕЕМ ---------- */
    body.no-scroll {
      overflow: hidden;
    }

    /* ---------- УВАЖЕНИЕ К НАСТРОЙКЕ «МЕНЬШЕ ДВИЖЕНИЯ» ---------- */
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
      }
      .art-card:hover .art-img-wrapper img,
      .bird-lux-item:hover img { transform: none !important; }
    }

    /* ---------- ТАБЛИЦА СРАВНЕНИЯ НА УЗКОМ ЭКРАНЕ ---------- */
    @media (max-width: 760px) {
      .compare-table { min-width: 0; display: block; font-size: 0.95rem; }
      .compare-table thead { display: none; }
      .compare-table tbody { display: block; }

      .compare-table tr {
        display: flex;
        flex-direction: column;
        padding: 18px 18px 20px;
        border-bottom: 1px solid var(--border-soft);
      }
      .compare-table tr:last-child { border-bottom: 0; }

      .compare-table td {
        display: block;
        border: 0;
        padding: 7px 0;
        width: 100%;
      }

      .compare-table td:first-child {
        order: -2;
        font-size: 1.02rem;
        padding-bottom: 12px;
      }

      .compare-table td.col-highlight {
        order: -1;
        background: var(--bg-emerald-mist);
        border-left: 3px solid var(--gold-primary);
        border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
        padding: 10px 12px;
        margin-bottom: 8px;
      }

      .compare-table td:not(:first-child)::before {
        content: attr(data-label);
        display: block;
        font-size: 0.68rem;
        text-transform: uppercase;
        letter-spacing: 0.09em;
        font-weight: 700;
        color: var(--text-muted);
        margin-bottom: 5px;
      }

      .compare-table td.col-highlight::before { color: var(--gold-primary); }
    }

    /* COMPARISON TABLE SECTION (ЧЕСТНОЕ СРАВНЕНИЕ) */
    .compare-table-wrap {
      background: var(--bg-surface);
      border-radius: var(--radius-xl);
      border: 1.5px solid var(--border-soft);
      box-shadow: var(--shadow-luxury);
      overflow: hidden;
      margin: 40px 0;
    }

    .compare-table-responsive {
      width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }

    .compare-table {
      width: 100%;
      border-collapse: collapse;
      text-align: left;
      font-size: 0.92rem;
      min-width: 720px;
    }

    .compare-table th {
      padding: 22px 24px;
      font-family: "Golos Text", system-ui, sans-serif;
      font-weight: 700;
      font-size: 0.95rem;
      letter-spacing: 0.5px;
      border-bottom: 1.5px solid var(--border-soft);
      background: var(--bg-ivory);
      color: var(--primary-deep);
    }

    .compare-table th.col-highlight {
      background: #EAF4EE;
      color: var(--primary-forest);
      border-bottom: 2px solid var(--primary-sage);
      font-size: 1.05rem;
    }

    .compare-table td {
      padding: 20px 24px;
      border-bottom: 1px solid var(--border-soft);
      color: var(--text-body);
      vertical-align: middle;
    }

    .compare-table td.col-highlight {
      background: #F4FAF6;
      font-weight: 600;
      color: var(--primary-deep);
    }

    .compare-table tr:last-child td {
      border-bottom: none;
    }

    .status-bad {
      color: #DC2626;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .status-warn {
      color: #D97706;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .status-good {
      color: #15803D;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    /* INTERACTIVE CALCULATOR (КАЛЬКУЛЯТОР ПЕРВОГО ГОДА) */
    .calc-card-wrap {
      background: var(--bg-surface);
      border-radius: var(--radius-xl);
      border: 1.5px solid var(--gold-border);
      box-shadow: var(--shadow-luxury);
      padding: 44px;
      margin: 40px 0;
    }

    .calc-layout-grid {
      display: grid;
      grid-template-columns: 1.25fr 0.95fr;
      gap: 40px;
      align-items: start;
    }

    .calc-field-group {
      margin-bottom: 26px;
    }

    .calc-label {
      font-family: "Golos Text", system-ui, sans-serif;
      font-weight: 700;
      font-size: 0.95rem;
      color: var(--primary-deep);
      margin-bottom: 10px;
      display: block;
    }

    .calc-select-lux {
      width: 100%;
      padding: 14px 18px;
      border-radius: var(--radius-sm);
      border: 1.5px solid var(--border-soft);
      font-family: inherit;
      font-size: 0.95rem;
      background: var(--bg-ivory);
      color: var(--primary-deep);
      font-weight: 500;
      outline: none;
      transition: var(--transition-smooth);
      cursor: pointer;
    }

    .calc-select-lux:focus {
      border-color: var(--gold-primary);
      box-shadow: 0 0 0 3px rgba(31, 83, 224, 0.15);
      background: white;
    }

    .calc-checkbox-list {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .calc-checkbox-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 12px 16px;
      background: var(--bg-ivory);
      border: 1px solid var(--border-soft);
      border-radius: var(--radius-sm);
      cursor: pointer;
      transition: var(--transition-smooth);
      user-select: none;
    }

    .calc-checkbox-item:hover {
      border-color: var(--gold-primary);
      background: var(--gold-pale);
    }

    .calc-checkbox-item input[type="checkbox"] {
      width: 22px;
      height: 22px;
      accent-color: var(--primary-forest);
      cursor: pointer;
    }

    .calc-checkbox-item span {
      font-size: 0.88rem;
      font-weight: 500;
      color: var(--text-body);
    }

    /* Calculator Summary Card */
    .calc-receipt-card {
      background: #14336E;
      color: white;
      border-radius: var(--radius-lg);
      padding: 34px 28px;
      border: 1px solid var(--gold-border);
      box-shadow: var(--shadow-luxury);
      position: sticky;
      top: 100px;
    }

    .receipt-head-title {
      font-family: "Literata", Georgia, serif;
      font-size: 2rem;
      color: var(--gold-light);
      margin-bottom: 22px;
      padding-bottom: 14px;
      border-bottom: 1px solid rgba(31, 83, 224, 0.25);
    }

    .receipt-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 14px;
      font-size: 0.92rem;
      color: rgba(255, 255, 255, 0.8);
    }

    .receipt-row strong {
      color: white;
      font-family: "Golos Text", system-ui, sans-serif;
    }

    .receipt-total-box {
      margin-top: 24px;
      padding-top: 20px;
      border-top: 1.5px solid rgba(31, 83, 224, 0.35);
      display: flex;
      justify-content: space-between;
      align-items: baseline;
    }

    .total-title-tag {
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.95rem;
      color: var(--gold-light);
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }

    .total-val-tag {
      font-family: "Literata", Georgia, serif;
      font-size: 2.5rem;
      font-weight: 700;
      color: var(--gold-light);
      line-height: 1;
    }

    /* LEGAL SHIELD CARDS (ЮРИДИЧЕСКИЙ ЩИТ) */
    .legal-shield-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 24px;
      margin: 40px 0;
    }

    .legal-card {
      background: var(--bg-surface);
      border: 1px solid var(--border-soft);
      border-radius: var(--radius-lg);
      padding: 30px 24px;
      box-shadow: var(--shadow-subtle);
      display: flex;
      align-items: flex-start;
      gap: 20px;
      transition: var(--transition-smooth);
    }

    .legal-card:hover {
      transform: translateY(-5px);
      box-shadow: var(--shadow-luxury);
      border-color: var(--gold-primary);
    }

    .legal-icon-box {
      width: 52px;
      height: 52px;
      border-radius: 14px;
      background: var(--bg-champagne);
      border: 1px solid var(--gold-border);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--gold-primary);
      flex-shrink: 0;
    }

    .legal-text h4,
    .legal-text h3 {
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 1.15rem;
      color: var(--primary-deep);
      margin-bottom: 6px;
    }

    .legal-text p {
      font-size: 0.88rem;
      color: var(--text-muted);
      line-height: 1.6;
    }

    /* SQUARE GALLERY CARD GRID (ECOSYSTEM SHOWCASE) */
    .square-gallery-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 24px;
    }

    .sq-card {
      background: var(--bg-surface);
      border-radius: var(--radius-lg);
      overflow: hidden;
      border: 1px solid var(--border-soft);
      box-shadow: var(--shadow-subtle);
      display: flex;
      flex-direction: column;
      transition: var(--transition-smooth);
    }

    .sq-card:hover {
      transform: translateY(-8px);
      box-shadow: var(--shadow-hover);
      border-color: var(--gold-primary);
    }

    .sq-card-media {
      width: 100%;
      aspect-ratio: 1 / 1;
      position: relative;
      overflow: hidden;
      background: #14336E;
    }

    .sq-card-media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .sq-card:hover .sq-card-media img {
      transform: scale(1.06);
    }

    .sq-media-placeholder {
      width: 100%;
      height: 100%;
      background: radial-gradient(circle at 50% 40%, #1B3A72 0%, #0B1E42 100%);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 24px;
      text-align: center;
      border-bottom: 1px solid var(--gold-border);
    }

    .sq-media-placeholder svg {
      width: 54px;
      height: 54px;
      stroke: var(--gold-light);
      margin-bottom: 14px;
      filter: drop-shadow(0 4px 10px rgba(31, 83, 224, 0.3));
    }

    .sq-card-caption {
      padding: 22px 20px;
      display: flex;
      flex-direction: column;
      flex: 1;
      background: var(--bg-surface);
    }

    .sq-pill {
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.72rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.8px;
      padding: 4px 10px;
      border-radius: 999px;
      margin-bottom: 10px;
      align-self: flex-start;
    }

    .sq-pill.b2b { background: var(--primary-deep); color: var(--gold-light); border: 1px solid var(--gold-border); }
    .sq-pill.b2c { background: var(--primary-forest); color: white; }
    .sq-pill.edu { background: var(--gold-pale); color: var(--gold-primary); border: 1px solid var(--gold-border); }
    .sq-pill.club { background: var(--primary-forest); color: var(--gold-light); border: 1px solid rgba(31, 83, 224, 0.3); }

    .sq-title {
      font-family: "Literata", Georgia, serif;
      font-size: 1.6rem;
      color: var(--primary-deep);
      margin-bottom: 8px;
      line-height: 1.15;
    }

    .sq-desc {
      font-size: 0.86rem;
      color: var(--text-muted);
      line-height: 1.5;
      margin-bottom: 16px;
      flex: 1;
    }

    .sq-link-btn {
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.82rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      color: var(--primary-deep);
      display: inline-flex;
      align-items: center;
      gap: 6px;
      margin-top: auto;
      transition: var(--transition-smooth);
      border: none;
      background: transparent;
      cursor: pointer;
      padding: 0;
      text-align: left;
    }

    .sq-link-btn:hover {
      color: var(--gold-primary);
      transform: translateX(3px);
    }

    /* INTERACTIVE NAVIGATOR / CONCIERGE QUIZ */
    .quiz-luxury-wrap {
      background: linear-gradient(180deg, var(--bg-champagne) 0%, var(--bg-ivory) 100%);
      border: 1px solid var(--gold-border);
      border-radius: var(--radius-xl);
      padding: 44px;
      box-shadow: var(--shadow-luxury);
      max-width: 960px;
      margin: 0 auto;
    }

    .quiz-progress-track {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 36px;
      position: relative;
    }

    .progress-line-bg {
      position: absolute;
      top: 50%;
      left: 0;
      width: 100%;
      height: 2px;
      background: var(--border-soft);
      z-index: 0;
      transform: translateY(-50%);
    }

    .progress-line-fill {
      position: absolute;
      top: 50%;
      left: 0;
      width: 25%;
      height: 2px;
      background: var(--gold-primary);
      z-index: 1;
      transform: translateY(-50%);
      transition: width 0.4s ease;
    }

    .prog-node {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      background: var(--bg-surface);
      border: 2px solid var(--border-soft);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.82rem;
      font-weight: 700;
      color: var(--text-muted);
      z-index: 2;
      transition: var(--transition-smooth);
    }

    .prog-node.active {
      background: var(--primary-deep);
      border-color: var(--gold-primary);
      color: var(--gold-light);
      box-shadow: 0 0 0 4px rgba(31, 83, 224, 0.2);
    }

    .quiz-lux-card {
      border: 1.5px solid var(--border-soft);
      border-radius: var(--radius-md);
      padding: 22px;
      background: var(--bg-surface);
      cursor: pointer;
      transition: var(--transition-smooth);
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .quiz-lux-card:hover {
      border-color: var(--gold-primary);
      transform: translateY(-3px);
      box-shadow: var(--shadow-subtle);
    }

    .quiz-lux-card.selected {
      border-color: var(--gold-primary);
      background: var(--gold-pale);
      box-shadow: 0 0 0 1px var(--gold-primary);
    }

    .quiz-card-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .quiz-card-title {
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 1.02rem;
      font-weight: 700;
      color: var(--primary-deep);
    }

    .quiz-card-desc {
      font-size: 0.86rem;
      color: var(--text-muted);
      line-height: 1.5;
    }

    /* SPECIES LUXURY COLLECTION */
    .catalog-nav-tabs {
      display: flex;
      justify-content: center;
      gap: 10px;
      margin-bottom: 40px;
      flex-wrap: wrap;
    }

    .tab-pill {
      padding: 9px 22px;
      border-radius: var(--radius-sm);
      background: var(--bg-surface);
      border: 1px solid var(--border-soft);
      font-family: "Golos Text", system-ui, sans-serif;
      font-weight: 600;
      font-size: 0.85rem;
      letter-spacing: 0.5px;
      color: var(--text-muted);
      cursor: pointer;
      transition: var(--transition-smooth);
      text-transform: uppercase;
    }

    .tab-pill:hover, .tab-pill.active {
      background: var(--primary-deep);
      color: var(--gold-light);
      border-color: var(--primary-deep);
      box-shadow: var(--shadow-subtle);
    }

    .birds-lux-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
      gap: 28px;
    }

    .bird-lux-item {
      background: var(--bg-surface);
      border-radius: var(--radius-lg);
      overflow: hidden;
      border: 1px solid var(--border-soft);
      box-shadow: var(--shadow-subtle);
      transition: var(--transition-smooth);
      display: flex;
      flex-direction: column;
    }

    .bird-lux-item:hover {
      transform: translateY(-8px);
      box-shadow: var(--shadow-luxury);
      border-color: var(--gold-border);
    }

    .bird-visual-frame {
      height: 270px;
      position: relative;
      overflow: hidden;
      background: #E5DDD0;
    }

    .bird-visual-frame img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 28%;
      transition: transform 0.8s ease;
    }

    .bird-lux-item:hover .bird-visual-frame img {
      transform: scale(1.05);
    }

    .bird-badge-tier {
      position: absolute;
      top: 14px;
      left: 14px;
      background: rgba(20, 36, 58, 0.9);
      backdrop-filter: blur(8px);
      color: var(--gold-light);
      padding: 5px 12px;
      border-radius: var(--radius-sm);
      border: 1px solid var(--gold-border);
      font-size: 0.72rem;
      font-family: "Golos Text", system-ui, sans-serif;
      font-weight: 700;
      letter-spacing: 0.8px;
      text-transform: uppercase;
    }

    .bird-content-body {
      padding: 24px;
      display: flex;
      flex-direction: column;
      flex: 1;
    }

    .bird-headline-row {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      margin-bottom: 6px;
    }

    .bird-title {
      font-family: "Literata", Georgia, serif;
      font-size: 1.6rem;
      color: var(--primary-deep);
      font-weight: 700;
    }

    .bird-latin {
      font-size: 0.78rem;
      font-style: italic;
      color: var(--text-muted);
    }

    .bird-intro {
      font-size: 0.9rem;
      color: var(--text-body);
      line-height: 1.55;
      margin-bottom: 18px;
    }

    .bird-metrics-matrix {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 8px;
      background: var(--bg-champagne);
      border: 1px solid var(--border-soft);
      border-radius: var(--radius-sm);
      padding: 10px;
      margin-bottom: 20px;
      text-align: center;
    }

    .metric-cell span {
      font-size: 0.7rem;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      color: var(--text-muted);
      display: block;
      margin-bottom: 2px;
    }

    .metric-cell strong {
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.88rem;
      color: var(--primary-deep);
    }

    .bird-card-bottom {
      margin-top: auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-top: 16px;
      border-top: 1px solid var(--border-soft);
    }

    .bird-price-box span {
      font-size: 0.7rem;
      text-transform: uppercase;
      letter-spacing: 0.8px;
      color: var(--text-muted);
      display: block;
    }

    .bird-price-box strong {
      font-family: "Literata", Georgia, serif;
      font-size: 1.4rem;
      font-weight: 700;
      color: var(--primary-deep);
    }

    /* COMMUNITY & FORUM TEASER */
    .forum-section-wrap {
      background: var(--primary-deep);
      color: white;
      border-radius: var(--radius-xl);
      padding: 60px 44px;
      margin: 40px 0;
      border: 1px solid var(--gold-border);
      position: relative;
      overflow: hidden;
    }

    .forum-section-wrap::before {
      content: '';
      position: absolute;
      top: -100px;
      right: -100px;
      width: 400px;
      height: 400px;
      background: radial-gradient(circle, rgba(31, 83, 224, 0.18) 0%, rgba(20, 36, 58, 0) 70%);
      pointer-events: none;
    }

    .forum-layout {
      display: grid;
      grid-template-columns: 1fr 1.2fr;
      gap: 44px;
      align-items: center;
      position: relative;
      z-index: 1;
    }

    .forum-info h3 {
      font-size: 2.6rem;
      color: var(--gold-light);
      margin-bottom: 14px;
    }

    .forum-info p {
      font-size: 1rem;
      color: rgba(255, 255, 255, 0.8);
      line-height: 1.65;
      margin-bottom: 26px;
    }

    .forum-topics-list {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .forum-topic-card {
      background: rgba(255, 255, 255, 0.05);
      border: 1px solid rgba(31, 83, 224, 0.2);
      border-radius: var(--radius-md);
      padding: 15px 18px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      transition: var(--transition-smooth);
      cursor: pointer;
    }

    .forum-topic-card:hover {
      background: rgba(255, 255, 255, 0.1);
      border-color: var(--gold-primary);
      transform: translateX(4px);
    }

    .topic-meta h5 {
      font-size: 0.92rem;
      color: white;
      margin-bottom: 3px;
    }

    .topic-meta span {
      font-size: 0.76rem;
      color: var(--gold-light);
    }

    .topic-badge-count {
      font-size: 0.8rem;
      color: rgba(255, 255, 255, 0.6);
      display: flex;
      align-items: center;
      gap: 6px;
    }

    /* FOOTER */
    footer {
      background: #0B1E42;
      color: rgba(255, 255, 255, 0.75);
      padding: 70px 0 30px;
      border-top: 1px solid rgba(31, 83, 224, 0.2);
    }

    .footer-grid {
      display: grid;
      grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
      gap: 36px;
      margin-bottom: 50px;
    }

    .footer-col h4 {
      color: var(--gold-light);
      font-size: 1rem;
      margin-bottom: 18px;
      text-transform: uppercase;
      letter-spacing: 1px;
    }

    .footer-links {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .footer-links a {
      color: rgba(255, 255, 255, 0.65);
      font-size: 0.88rem;
      transition: var(--transition-smooth);
    }

    .footer-links a:hover {
      color: var(--gold-light);
      padding-left: 4px;
    }

    .footer-bottom a {
      display: inline-block;
      padding: 6px 0;
    }

    .footer-bottom {
      border-top: 1px solid rgba(255, 255, 255, 0.08);
      padding-top: 24px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 0.8rem;
      color: rgba(255, 255, 255, 0.45);
      flex-wrap: wrap;
      gap: 12px;
    }

    /* MODAL */
    .lux-modal-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      background: rgba(20, 36, 58, 0.75);
      backdrop-filter: blur(12px);
      z-index: 9999;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 16px;
    }

    .lux-modal-overlay.active {
      display: flex;
    }

    .lux-modal-card {
      background: var(--bg-surface);
      border: 1.5px solid var(--gold-primary);
      border-radius: var(--radius-xl);
      padding: 38px 32px;
      max-width: 540px;
      width: 100%;
      position: relative;
      box-shadow: var(--shadow-luxury);
      animation: modalFade 0.35s ease;
      max-height: 90vh;
      overflow-y: auto;
    }

    @keyframes modalFade {
      from { opacity: 0; transform: translateY(12px) scale(0.97); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    .lux-modal-close {
      position: absolute;
      top: 20px;
      right: 20px;
      background: var(--bg-champagne);
      border: 1px solid var(--border-soft);
      width: 36px;
      height: 36px;
      border-radius: 50%;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--primary-deep);
    }

    .form-ctrl {
      margin-bottom: 16px;
    }

    .form-ctrl label {
      display: block;
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.8rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      color: var(--primary-deep);
      margin-bottom: 6px;
    }

    .form-input-lux {
      width: 100%;
      padding: 13px 16px;
      border-radius: var(--radius-sm);
      border: 1.5px solid var(--border-soft);
      font-family: inherit;
      font-size: 0.92rem;
      background: var(--bg-ivory);
      outline: none;
      transition: var(--transition-smooth);
    }

    .form-input-lux:focus {
      border-color: var(--gold-primary);
      background: white;
      box-shadow: 0 0 0 3px rgba(31, 83, 224, 0.15);
    }

    .form-legal-block {
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin: 18px 0;
      padding-top: 12px;
      border-top: 1px solid var(--border-soft);
    }

    .form-check-label {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-size: 0.78rem;
      color: var(--text-muted);
      line-height: 1.45;
      cursor: pointer;
    }

    .form-check-label input[type="checkbox"] {
      width: 22px;
      height: 22px;
      accent-color: var(--primary-forest);
      margin-top: 2px;
      flex-shrink: 0;
      cursor: pointer;
    }

    .form-check-label a {
      color: var(--primary-sage);
      text-decoration: underline;
      font-weight: 600;
    }

    /* COOKIE BANNER */
    .cookie-banner {
      position: fixed;
      bottom: 20px;
      left: 50%;
      transform: translateX(-50%);
      width: calc(100% - 40px);
      max-width: 680px;
      background: rgba(20, 36, 58, 0.96);
      backdrop-filter: blur(16px);
      border: 1px solid var(--gold-border);
      border-radius: var(--radius-md);
      padding: 16px 22px;
      color: white;
      z-index: 9998;
      box-shadow: var(--shadow-luxury);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      animation: bannerSlideUp 0.4s ease;
    }

    @keyframes bannerSlideUp {
      from { transform: translate(-50%, 100%); opacity: 0; }
      to { transform: translate(-50%, 0); opacity: 1; }
    }

    .cookie-text {
      font-size: 0.8rem;
      color: rgba(255, 255, 255, 0.85);
      line-height: 1.45;
    }

    .cookie-text a {
      color: var(--gold-light);
      text-decoration: underline;
    }

    .cookie-btn {
      padding: 8px 18px;
      background: var(--gold-gradient);
      color: #F4F8FF;
      font-family: "Golos Text", system-ui, sans-serif;
      font-size: 0.8rem;
      font-weight: 700;
      border: none;
      border-radius: var(--radius-sm);
      cursor: pointer;
      text-transform: uppercase;
      white-space: nowrap;
    }

    /* RESPONSIVE & MOBILE ADAPTATION */
    @media (max-width: 1220px) {
      .capsule-menu { display: none; }
      .capsule-burger { display: flex; }
      .manifesto-triptych-grid { grid-template-columns: repeat(2, 1fr); }
      .legal-shield-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 1024px) {
      .square-gallery-grid { grid-template-columns: repeat(2, 1fr); }
      .protocol-grid { grid-template-columns: repeat(3, 1fr); }
      .calc-layout-grid { grid-template-columns: 1fr; }
      .calc-receipt-card { position: static; }
      .forum-layout { grid-template-columns: 1fr; }
      .hero-grid { grid-template-columns: 1fr; }
      .hero-art-frame { order: -1; }
      .art-img-wrapper { height: 360px; }
      .manifesto-triptych-grid { grid-template-columns: 1fr; }
      .footer-grid { grid-template-columns: 1fr 1fr; }
    }

    @media (max-width: 768px) {
      .hero-wrap {
        padding: 30px 0 60px;
        background-image: 
          linear-gradient(180deg, rgba(250, 247, 242, 0.45) 0%, rgba(250, 247, 242, 0.15) 30%, rgba(250, 247, 242, 0.95) 100%),
          url('../bg/hero-mobile.webp');
        background-size: cover;
        background-position: center top;
        background-repeat: no-repeat;
        min-height: auto;
      }
      .hero-text-col {
        padding: 28px 20px;
        border-radius: var(--radius-lg);
        background: rgba(255, 255, 255, 0.93);
        backdrop-filter: blur(16px);
      }
      .capsule-header-holder { top: 8px; padding: 0 8px; width: 100%; }
      .capsule-navbar { height: 52px; padding: 0 6px 0 10px; gap: 6px; width: 100%; }
      .capsule-logo-text { font-size: 1.15rem; letter-spacing: 0.2px; }
      .capsule-logo-text span { font-size: 0.82rem; }
      .capsule-crest { width: 26px; height: 26px; }
      .capsule-crest svg { width: 13px; height: 13px; }
      .capsule-actions { gap: 6px; }
      .capsule-btn-cta { padding: 7px 12px; font-size: 0.72rem; letter-spacing: 0.2px; }
      .capsule-burger { padding: 6px 10px; height: 32px; font-size: 0.72rem; gap: 4px; }
      .capsule-phone-chip { display: none; }
      .protocol-grid { grid-template-columns: 1fr 1fr; }
      .quiz-luxury-wrap { padding: 28px 18px; }
      .calc-card-wrap { padding: 28px 18px; }
      .manifesto-wrap { padding: 40px 20px; }
      .cookie-banner { flex-direction: column; align-items: flex-start; text-align: left; }
    }

    @media (max-width: 480px) {
      .capsule-header-holder { top: 6px; padding: 0 6px; }
      .capsule-navbar { height: 48px; padding: 0 4px 0 8px; gap: 4px; }
      .capsule-brand { gap: 6px; }
      .capsule-logo-text { font-size: 1.02rem; }
      .capsule-logo-text span { font-size: 0.75rem; }
      .capsule-crest { width: 24px; height: 24px; }
      .capsule-btn-cta { padding: 6px 10px; font-size: 0.68rem; }
      .capsule-burger { padding: 5px 8px; height: 30px; font-size: 0.68rem; }
      .capsule-burger svg { width: 12px; height: 12px; }
    }

    @media (max-width: 360px) {
      .capsule-crest { display: none; }
      .capsule-logo-text { font-size: 0.95rem; }
      .capsule-btn-cta { padding: 5px 8px; font-size: 0.65rem; }
      .capsule-burger { padding: 4px 7px; font-size: 0.65rem; }
    }

    @media (max-width: 600px) {
      .container { padding: 0 16px; }
      .square-gallery-grid { grid-template-columns: 1fr; }
      .protocol-grid { grid-template-columns: 1fr; }
      .birds-lux-grid { grid-template-columns: 1fr; }
      .footer-grid { grid-template-columns: 1fr; }
      .hero-stats-row { grid-template-columns: 1fr; gap: 14px; }
      .hero-ctas { flex-direction: column; width: 100%; }
      .hero-ctas .btn-lux { width: 100%; }
      .art-img-wrapper { height: 280px; }
      .floating-luxury-badge { position: relative; bottom: 0; right: 0; margin-top: 14px; width: 100%; }
      .forum-section-wrap { padding: 40px 20px; }
      .lux-modal-card { padding: 30px 18px; }
    }
  

/* ================================================================
   НОВОЕ ОФОРМЛЕНИЕ — принято 31.08.2026, перенесено 01.09.2026.
   Разметка и скрипты не менялись: только фон, шапка и блоки.
   ================================================================ */

:root{
  --vk-sky-pale:#DCEAF3;
  --vk-chrome:#1F53E0;
  --vk-cobalt-deep:#14336E;
  --vk-salmon:#E39A7C;
  --vk-head-h:66px;
  --vk-pad:clamp(18px,4vw,40px);
}

html{scroll-behavior:smooth;}
body{background:transparent !important;padding-top:var(--vk-head-h);}

/* ---------- неподвижный фон тремя слоями ---------- */
.vk-layer{position:fixed;inset:0;pointer-events:none;}
.vk-photo{
  z-index:-3;
  background-image:url("../bg/hero-desktop.webp");
  background-size:cover;
  background-position:50% 0%;
  transform:scale(1.05);
  animation:vk-settle 2400ms cubic-bezier(.16,.7,.3,1) forwards;
}
@keyframes vk-settle{to{transform:scale(1);}}

.vk-strip{display:none;}
@media (min-width:761px){
  .vk-photo{top:var(--vk-head-h);}
  .vk-strip{
    display:block;position:fixed;top:0;left:0;right:0;height:67px;z-index:-3;
    background:linear-gradient(180deg,#DCEAF5 0%,#CBDDED 100%);pointer-events:none;
  }
}
@media (max-width:760px){
  .vk-photo{
    background-image:url("../bg/hero-mobile.webp");
    background-size:auto 92%;
    background-position:88% 100%;
    background-repeat:no-repeat;
    background-color:#CBDFEF;
    animation:none;transform:none;
  }
}

.vk-light{
  z-index:-2;
  background:
    radial-gradient(80% 60% at 20% 4%, rgba(255,248,236,.38) 0%, rgba(255,248,236,0) 62%),
    radial-gradient(130% 100% at 50% 52%, rgba(10,26,50,0) 46%, rgba(10,26,50,.22) 100%);
}
.vk-grain{
  z-index:-1;opacity:.13;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- шапка: полоса матового стекла вместо капсулы ---------- */
.capsule-header-holder{
  position:fixed !important;top:0;left:0;right:0;z-index:1000;
  padding:0 !important;margin:0 !important;
  background:linear-gradient(180deg,rgba(248,252,255,.9) 0%,rgba(228,241,250,.82) 100%);
  backdrop-filter:blur(18px) saturate(1.2);
  -webkit-backdrop-filter:blur(18px) saturate(1.2);
  border-bottom:1px solid rgba(31,76,160,.24);
  box-shadow:0 6px 22px rgba(20,36,58,.1);
}
.capsule-navbar{
  max-width:1180px !important;margin:0 auto !important;
  height:var(--vk-head-h) !important;
  padding:0 var(--vk-pad) !important;
  background:none !important;border:none !important;border-radius:0 !important;
  box-shadow:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
}

/* логотип — хром-гиацинт с бегущим бликом и мягким ореолом */
.capsule-logo-text{
  background-image:linear-gradient(178deg,#B7D0FF 0%,#4C82FF 24%,#FFFFFF 45%,#2A62F0 58%,#12369E 84%,#5C8BF5 100%);
  background-size:100% 260%;
  -webkit-background-clip:text;background-clip:text;
  color:transparent !important;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.9)) drop-shadow(0 0 9px rgba(47,101,240,.55));
  animation:vk-sheen 7s ease-in-out infinite;
}
@keyframes vk-sheen{
  0%,100%{background-position:50% 22%;}
  50%{background-position:50% 78%;}
}
.capsule-logo-text span{-webkit-text-fill-color:#4C82FF;color:#4C82FF;}
.capsule-crest{filter:hue-rotate(0deg);}

/* ---------- первый экран: фон снят, он теперь общий ---------- */
.hero-wrap{
  background-image:none !important;
  background-color:transparent !important;
  padding:clamp(30px,7vh,70px) 0 clamp(30px,6vw,64px) !important;
}

/* ---------- секции превращаются в блоки поверх фотографии ---------- */
.container{max-width:1080px !important;}

.section-wrap{padding:0 0 clamp(36px,6vw,76px) !important;}

.section-wrap > .container,
section.container,
.hero-wrap > .container{
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-radius:6px;
  padding:clamp(22px,3.6vw,40px) clamp(20px,3.2vw,38px);
  box-shadow:0 18px 44px rgba(20,36,58,.16);
  scroll-margin-top:calc(var(--vk-head-h) + 16px);
}
section.container{margin-bottom:clamp(36px,6vw,76px);}

@media (max-width:760px){
  .section-wrap{padding:0 0 22vh !important;}
  section.container{margin-bottom:22vh;}
}

/* подвал тоже блоком */
body > footer{
  max-width:1080px;margin:0 auto clamp(40px,7vw,80px);
  padding:clamp(22px,3.6vw,38px) clamp(20px,3.2vw,36px) !important;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-radius:6px;
  box-shadow:0 18px 44px rgba(20,36,58,.16);
}

/* тёплый акцент оставляем только точечно */
.seo-badge-dot{background:var(--vk-salmon) !important;}

/* ---------- фирменный знак ---------- */
.vk-logo{
  width:44px;height:44px;border-radius:50%;
  flex-shrink:0;display:block;
  box-shadow:0 2px 10px rgba(20,36,58,.18);
}
.capsule-brand{gap:12px;}
@media (max-width:760px){
  .vk-logo{width:38px;height:38px;}
}

/* в тёмном мобильном меню надпись белая: хром на тёмном не читается */
.mobile-drawer-head .capsule-logo-text{
  background:none !important;
  -webkit-text-fill-color:#FFFFFF !important;
  color:#FFFFFF !important;
  filter:none !important;
  animation:none !important;
}
.mobile-drawer-head .capsule-logo-text span{
  -webkit-text-fill-color:#8FBAFF !important;color:#8FBAFF !important;
}

/* ---------- шапка: структура от 01.09.2026 ---------- */
.capsule-menu{gap:22px;}
.capsule-link{white-space:nowrap;}

/* в мобильном меню девять пунктов — оно должно прокручиваться на низких экранах */
.mobile-menu-drawer{overflow-y:auto;-webkit-overflow-scrolling:touch;}
.mobile-nav-links{gap:2px;}
.mobile-nav-item{padding-top:13px;padding-bottom:13px;}

/* ================= ПРАВКИ ПО ИТОГАМ ПРОВЕРКИ РЕНДЕРОМ ================= */

/* 1. Подвал: ряд юридических ссылок не переносился и вылезал за экран на 30px */
.footer-bottom > div{flex-wrap:wrap;gap:12px 18px;}
@media (max-width:520px){
  body > footer{padding-left:16px !important;padding-right:16px !important;}
  body > footer .container{padding-left:0;padding-right:0;}
}

/* 2. Таблица сравнения на телефоне. Мобильная раскладка карточками в стилях есть,
   но `min-width:720px` из настольного правила стоит ниже и её перебивал: таблица
   уезжала на 720px и обрезалась, а колонка «ВЫКОРМЫШ.РФ» — самая правая — пропадала.
   Поломка досталась в наследство от прежней страницы, здесь исправлена. */
@media (max-width:760px){
  .compare-table{min-width:0 !important;}
}

/* 3. Высота шапки: отступ содержимого должен совпадать с реальной высотой,
   иначе шапка накрывает первый блок */

/* 4. Полоса неба за шапкой следует за её высотой, чтобы не было стыка */
@media (min-width:761px){
  .sky-strip{height:calc(var(--vk-head-h) + 1px);}
}

/* ================= ШАПКА: исправления 01.09.2026 ================= */

/* Компьютер. Меню не сжимается: у пунктов padding 7/12 и рамки у выделенных,
   пяти пунктам с телефоном и логотипом нужно ~1130px. Даём 1280 и уменьшаем зазоры,
   а ниже 1300px переходим на кнопку меню — так номер телефона не может быть срезан. */
.capsule-navbar{max-width:1280px !important;}
.capsule-menu{gap:12px;min-width:0;}
.capsule-link{padding:7px 10px;}

@media (max-width:1300px){
  .capsule-menu{display:none !important;}
  .capsule-burger{display:flex !important;}
}

/* Телефон. Раскладка в два ряда сеткой: она не зависит от порядка и переноса.
   Группу действий распускаем через display:contents, чтобы её дети попали в сетку. */
@media (max-width:900px){
  :root{--vk-head-h:100px;}

  .capsule-navbar{
    display:grid !important;
    grid-template-columns:1fr auto;
    grid-template-areas:"brand phone" "burger burger";
    align-items:center;
    height:auto !important;
    row-gap:8px;column-gap:10px;
    padding:9px var(--vk-pad) !important;
  }
  .capsule-actions{display:contents;}
  .capsule-brand{grid-area:brand;}

  /* старое правило прячет номер с 768px — возвращаем его явно */
  .capsule-phone-chip{
    grid-area:phone;
    display:inline-flex !important;
    justify-self:end;
  }
  /* кнопка меню остаётся компактной, а не во всю строку */
  .capsule-burger{
    grid-area:burger;
    justify-self:start;
    display:flex !important;
    width:auto;flex-basis:auto;
  }
}

/* Узкие телефоны: логотип и номер в одном ряду должны помещаться на 360px */
@media (max-width:430px){
  .capsule-logo-text{font-size:0.92rem;}
  .capsule-logo-text span{font-size:0.7rem;}
  .capsule-phone-chip{font-size:0.76rem;padding:6px 10px;gap:6px;}
  .vk-logo{width:34px;height:34px;}
}

/* Cookie-баннер не должен ложиться на нижнюю панель */
@media (max-width:900px){
  .cookie-banner{bottom:calc(84px + env(safe-area-inset-bottom,0px)) !important;}
}

/* ---------- нижняя стеклянная панель ---------- */
.vk-bottombar{display:none;}
@media (max-width:900px){
  .vk-bottombar{
    display:block;
    position:fixed;left:0;right:0;bottom:0;z-index:900;
    padding:10px var(--vk-pad) calc(10px + env(safe-area-inset-bottom,0px));
    background:linear-gradient(180deg,rgba(248,252,255,.86) 0%,rgba(226,239,250,.92) 100%);
    backdrop-filter:blur(20px) saturate(1.2);
    -webkit-backdrop-filter:blur(20px) saturate(1.2);
    border-top:1px solid rgba(31,76,160,.24);
    box-shadow:0 -8px 26px rgba(20,36,58,.14);
  }
  .vk-bottombar-btn{
    display:block;width:100%;
    font-family:'Golos Text',system-ui,sans-serif;font-size:16px;font-weight:700;
    padding:15px 20px;border:none;border-radius:4px;cursor:pointer;
    background:linear-gradient(180deg,#3B74FF 0%,#1F53E0 52%,#12369E 100%);
    color:#F6FAFF;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 18px rgba(18,54,158,.32);
  }
  .vk-bottombar-btn:active{background:#12369E;}
  .vk-bottombar-btn:focus-visible{outline:2px solid #12369E;outline-offset:3px;}
  /* чтобы панель не накрывала подвал */
  body{padding-bottom:82px;}
}

@media (prefers-reduced-motion:reduce){




  .vk-photo{animation:none;transform:none;}
  .capsule-logo-text{animation:none;background-position:50% 46%;}
  html{scroll-behavior:auto;}
}

/* высота шапки — последнее слово, чтобы отступ содержимого совпадал с реальной высотой */
@media (max-width:900px){:root{--vk-head-h:110px;}}
@media (max-width:520px){:root{--vk-head-h:92px;}}

/* ================= ФОН: привязка к реальной высоте шапки =================
   Шапка на телефоне двухрядная и выше прежней. Полоса неба над фотографией
   должна равняться её высоте, иначе шапка накрывает голову гиацинтового ары. */
.vk-strip{
  display:block !important;
  position:fixed;top:0;left:0;right:0;
  height:calc(var(--vk-head-h) + 1px);
  z-index:-3;
  background:linear-gradient(180deg,#DCEAF5 0%,#CBDDED 100%);
  pointer-events:none;
}
.vk-photo{top:var(--vk-head-h) !important;}

@media (max-width:760px){
  .vk-photo{
    /* высота — вся оставшаяся площадь под шапкой, кадр по-прежнему сдвинут вправо */
    background-size:auto 100% !important;
    background-position:88% 100% !important;
  }
}

/* ================= ШАПКА: запас по ширине =================
   `min-width:0` разрешал меню сжиматься, и вместо выдавливания оно обрезалось —
   «Энциклопедия» превращалась в «Э». Сжатие убрано, шапке дан реальный запас. */
.capsule-menu{min-width:auto;flex-shrink:0;gap:10px;}
.capsule-navbar{max-width:1400px !important;}
.capsule-link{padding:7px 9px;font-size:0.82rem;}
/* уменьшенный логотип — только на компьютере: на телефоне свои размеры,
   иначе он выдавливает номер за край */
@media (min-width:901px){
  .capsule-logo-text{font-size:1.3rem;}
}

/* последний рубеж: если места всё равно мало — уходим в кнопку меню, а не режем текст */
@media (max-width:1300px){
  .capsule-menu{display:none !important;}
  .capsule-burger{display:flex !important;}
}

/* ================= КНОПКИ МЕССЕНДЖЕРОВ ================= */
.vk-msgs{display:flex;align-items:center;gap:6px;flex-shrink:0;}
.vk-msg{
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#3B74FF 0%,#1F53E0 55%,#12369E 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 3px 10px rgba(18,54,158,.3);
  text-decoration:none;flex-shrink:0;
  transition:transform .18s ease,box-shadow .18s ease;
}
.vk-msg svg{width:17px;height:17px;fill:#FFFFFF;}
.vk-msg:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 6px 16px rgba(18,54,158,.42);}
.vk-msg:focus-visible{outline:2px solid #12369E;outline-offset:3px;}

/* на телефоне — второй ряд справа, напротив кнопки МЕНЮ */
@media (max-width:900px){
  .capsule-navbar{grid-template-areas:"brand phone" "burger msgs" !important;}
  .vk-msgs{grid-area:msgs;justify-self:end;}
}
@media (max-width:430px){
  .vk-msg{width:31px;height:31px;}
  .vk-msg svg{width:15px;height:15px;}
}

@media (prefers-reduced-motion:reduce){
  .vk-msg{transition:none;}
}

/* MAX: текстовый знак — рисовать чужой логотип по памяти нельзя, а буквы читаются однозначно */
.vk-msg-max span{
  font-family:'Golos Text',system-ui,sans-serif;
  font-size:9.5px;font-weight:700;letter-spacing:.02em;color:#FFFFFF;
}
@media (max-width:430px){ .vk-msg-max span{font-size:8.5px;} }

/* ================= ПОДВАЛ =================
   Текст подвала светлый — он рассчитан на тёмный фон. Белая подложка из общего
   правила блоков делала его нечитаемым. Возвращаем глубокий синий. */
body > footer{
  background:linear-gradient(180deg,rgba(20,51,110,.94) 0%,rgba(11,30,66,.96) 100%) !important;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 18px 44px rgba(20,36,58,.24);
}
body > footer h4{color:#FFFFFF;}
body > footer .footer-links a{color:rgba(233,240,252,.82);}
body > footer .footer-links a:hover{color:#FFFFFF;}
body > footer .footer-bottom{color:rgba(233,240,252,.7);}
body > footer .footer-bottom a{color:rgba(233,240,252,.85);}
body > footer .footer-bottom a:hover{color:#FFFFFF;}

/* контраст: янтарный в таблице сравнения давал 3.19 при норме 4.5 */
.status-warn{color:#A8480A !important;}

/* ================= ПЕРВЫЙ ЭКРАН =================
   Подложка под первым экраном убрана: фотография должна работать сама.
   На телефоне текст с предложением идёт выше фотографии — у сайта услуги
   первым делом читают оффер, а не картинку. */
.hero-wrap > .container{
  background:none !important;
  backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding-left:0 !important;padding-right:0 !important;
}
@media (max-width:900px){
  .hero-art-frame{order:1 !important;}
  .hero-text-col{order:0 !important;}
}

/* первый экран на телефоне: вместо плотной белой подложки — лёгкое стекло,
   фотография без белой рамки */
@media (max-width:900px){
  .hero-text-col{
    background:rgba(255,255,255,.58) !important;
    backdrop-filter:blur(14px) saturate(1.1);
    -webkit-backdrop-filter:blur(14px) saturate(1.1);
  }
  .art-card{
    background:transparent !important;
    box-shadow:none !important;
    border:none !important;
    padding:0 !important;
  }
}

/* ================= ПЕРВЫЙ ЭКРАН: показатели =================
   Показатель гарантии убран — гарантию мы не даём. Два оставшихся идут
   в одну строку компактными капсулами, а не столбиком во всю высоту. */
.hero-stats-row{
  display:flex !important;
  flex-wrap:nowrap;
  gap:10px !important;
  padding-top:18px !important;
}
.stat-box{
  flex:1 1 0;min-width:0;
  flex-direction:row !important;
  align-items:baseline;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(31,83,224,.07);
  border:1px solid rgba(31,83,224,.16);
}
.stat-val{
  font-size:1.05rem !important;
  color:var(--gold-primary) !important;
  white-space:nowrap;
}
.stat-label{
  margin-top:0 !important;
  font-size:0.78rem;
  line-height:1.25;
  color:var(--text-body);
}

@media (max-width:900px){
  .hero-stats-row{grid-template-columns:none !important;gap:8px !important;}
  .stat-box{padding:9px 12px;}
  .stat-val{font-size:0.98rem !important;}
  .stat-label{font-size:0.72rem;}
}
@media (max-width:380px){
  .stat-box{padding:8px 10px;gap:6px;}
  .stat-label{font-size:0.68rem;}
}

/* ================= ПЕРВЫЙ ЭКРАН НА КОМПЬЮТЕРЕ =================
   Карточка была вытянута в высоту. Даём ей больше ширины, уменьшаем кегль
   заголовка и описания, подложку делаем полупрозрачной, как на телефоне. */
@media (min-width:901px){
  .hero-wrap > .container{max-width:1240px !important;}
  .hero-grid{grid-template-columns:1.55fr 1fr !important;}

  .hero-text-col{
    background:rgba(255,255,255,.62) !important;
    backdrop-filter:blur(16px) saturate(1.1);
    -webkit-backdrop-filter:blur(16px) saturate(1.1);
  }
  .hero-title{font-size:clamp(2rem,3.1vw,2.85rem) !important;}
  .hero-desc{font-size:1rem !important;max-width:62ch;}
}

/* ================= ПЕРВЫЙ ЭКРАН: воздух и кнопки =================
   Между кнопками и капсулами было 40px отступа плюс 18px внутренних — почти 60.
   На компьютере кнопки стояли столбиком, хотя помещаются в строку.
   На телефоне вторая кнопка убрана: её роль выполняет закреплённая нижняя панель. */
.hero-ctas{
  display:flex;flex-wrap:wrap;gap:12px;
  margin-bottom:18px !important;
}
.hero-stats-row{padding-top:14px !important;}

@media (max-width:900px){
  .hero-ctas .btn-lux-outline{display:none !important;}
  .hero-ctas{margin-bottom:16px !important;}
}

/* кнопки первого экрана на компьютере: вместе они были 624px при колонке 572 и падали
   в два ряда. Уменьшаем поля и кегль — встают в строку, карточка ниже на 57px. */
@media (min-width:901px){
  .hero-ctas .btn-lux{
    padding:13px 20px;
    font-size:0.76rem;
    letter-spacing:0.6px;
  }
}

/* пока первый экран в две колонки (от 1025px) — кнопки жёстко в одну строку
   и делят её поровну, переносить их нечему */
@media (min-width:1025px){
  .hero-ctas{flex-wrap:nowrap !important;}
  .hero-ctas .btn-lux{flex:1 1 0;min-width:0;justify-content:center;text-align:center;}
}

/* ================= ЕДИНАЯ СЕТКА =================
   Шапка ограничена 1400px и имеет боковые поля var(--vk-pad).
   Значит её содержимое занимает 1320px. Даём блокам ровно ту же ширину,
   чтобы края карточек совпали с логотипом слева и кнопкой MAX справа
   на любой ширине экрана. */
.container{
  width:min(1320px, calc(100% - 2 * var(--vk-pad))) !important;
  max-width:none !important;
  margin-left:auto !important;margin-right:auto !important;
}
/* у первого экрана подложки нет — там поля не нужны, содержимое идёт по краю сетки */
.hero-wrap > .container{padding-left:0 !important;padding-right:0 !important;}
/* у блоков с подложкой поля внутренние: ширина 1320 считается по внешнему краю */
.section-wrap > .container,
section.container{
  padding-left:clamp(20px,3.2vw,38px) !important;
  padding-right:clamp(20px,3.2vw,38px) !important;
}
.hero-wrap > .container{
  width:min(1320px, calc(100% - 2 * var(--vk-pad))) !important;
  max-width:none !important;
}

/* длина строки: карточка широкая, но абзац не должен растягиваться через весь экран */
.sec-intro,.hero-desc,.legal-text p,.manifesto-card-text{max-width:74ch;}
.sec-head,.section-head{max-width:none;}

/* первый экран: колонки пересчитываем под новую ширину */
@media (min-width:1025px){
  .hero-grid{grid-template-columns:1.45fr 1fr !important;}
  .hero-desc{max-width:66ch;}
}

/* в старых стилях у текстовой колонки первого экрана стоял лимит 650px —
   он не давал ей воспользоваться новой шириной сетки */
@media (min-width:1025px){
  .hero-text-col{max-width:none !important;}
}

/* ================= ОТДЕЛКА КНОПОК: ЧЕТЫРЕ ВАРИАНТА =================
   Переключаются классом на body. После выбора лишние варианты и переключатель убираются. */

/* общее для главных кнопок */
.btn-lux-gold, .vk-bottombar-btn{
  position:relative;
  border:1px solid transparent;
  transition:background .22s ease, box-shadow .22s ease, transform .18s ease, color .22s ease;
}
.btn-lux-gold:hover, .vk-bottombar-btn:hover{transform:translateY(-1px);}

@media (prefers-reduced-motion:reduce){
  .btn-lux-gold,.vk-bottombar-btn{transition:none;}
  .btn-lux-gold:hover,.vk-bottombar-btn:hover{transform:none;}
}

/* ================= ФИРМЕННАЯ КНОПКА «АКВА» =================
   Утверждена владельцем 01.09.2026 по присланному образцу.
   Хромовая окантовка, глянец по верхней трети, глубокий кобальт к низу,
   голубое свечение снизу. Белая надпись с тенью — иначе она теряется на блике.
   Это стандартная кнопка сайта: используется на всех страницах. */
.btn-lux-gold,
.vk-bottombar-btn{
  position:relative;
  background:
    linear-gradient(180deg, rgba(255,255,255,.80) 0%, rgba(255,255,255,.30) 33%, rgba(255,255,255,0) 47%) padding-box,
    radial-gradient(62% 44% at 50% 112%, rgba(90,205,255,.85) 0%, rgba(90,205,255,0) 72%) padding-box,
    linear-gradient(180deg,#BFE0FA 0%,#6FB3EA 26%,#1C74C9 52%,#0B4FA0 80%,#0A3E85 100%) padding-box,
    linear-gradient(180deg,#FFFFFF 0%,#C4CEDA 17%,#8B96A4 47%,#F4F7FA 66%,#98A3B1 100%) border-box !important;
  border:2px solid transparent !important;
  border-radius:12px !important;
  color:#FFFFFF !important;
  text-shadow:0 1px 2px rgba(6,28,60,.65);
  box-shadow:0 8px 20px rgba(10,40,90,.34);
  transition:filter .2s ease, transform .18s ease, box-shadow .2s ease;
}
.btn-lux-gold:hover,
.vk-bottombar-btn:hover{
  filter:brightness(1.07);
  transform:translateY(-1px);
  box-shadow:0 11px 26px rgba(10,40,90,.4);
}
.btn-lux-gold:active,
.vk-bottombar-btn:active{
  transform:translateY(0);
  filter:brightness(.97);
  box-shadow:0 4px 12px rgba(10,40,90,.34);
}
.btn-lux-gold:focus-visible,
.vk-bottombar-btn:focus-visible{outline:2px solid #0B4FA0;outline-offset:3px;}

/* второстепенная кнопка повторяет форму главной, но остаётся тихой */
.btn-lux-outline{border-radius:12px !important;}

@media (prefers-reduced-motion:reduce){
  .btn-lux-gold,.vk-bottombar-btn{transition:none;}
  .btn-lux-gold:hover,.vk-bottombar-btn:hover{transform:none;}
}

/* фотография в карточке первого экрана показывается целиком:
   контейнер получает пропорции снимка 3:4, иначе птицу режет по низу */
.art-img-wrapper{
  aspect-ratio:3 / 4;
  height:auto !important;
  min-height:0 !important;
}
.art-img-wrapper img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center 42%;
}

/* ================= ЗНАК ПРОВЕРКИ НА ФОТОГРАФИИ =================
   Раньше на телефоне он шёл отдельной строкой во всю ширину и съедал высоту.
   Теперь лежит внутри снимка слева внизу — лента с подписью занимает верх, они не спорят. */
.hero-art-frame{position:relative;}
.floating-luxury-badge{
  position:absolute !important;
  left:18px !important;right:auto !important;
  bottom:18px !important;
  top:auto !important;
  width:auto !important;max-width:calc(100% - 36px);
  margin:0 !important;
  display:flex;align-items:center;gap:11px;
  z-index:3;
}
.floating-luxury-badge .badge-icon-gold{
  width:34px !important;height:34px !important;
  flex-shrink:0;
}
.floating-luxury-badge .badge-icon-gold svg{width:19px !important;height:19px !important;}

@media (max-width:900px){
  .floating-luxury-badge{left:14px !important;bottom:14px !important;gap:9px;}
  .floating-luxury-badge .badge-icon-gold{width:30px !important;height:30px !important;}
}

/* ================= ЗНАК ПРОВЕРКИ «ПЕЧАТЬ» =================
   Утверждён владельцем 01.09.2026. Лежит на фотографии слева внизу,
   лента с подписью занимает верх — они не спорят.
   Раньше на телефоне знак шёл отдельной строкой во всю ширину и съедал 89px высоты. */
.floating-luxury-badge{
  background:rgba(10,30,64,.72) !important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:2px solid rgba(226,236,250,.85) !important;
  border-radius:8px !important;
  padding:9px 16px 9px 9px !important;
  box-shadow:
    inset 0 0 0 1px rgba(10,30,64,.9),
    0 8px 20px rgba(6,22,50,.42);
  transform:rotate(-3deg);
}
.floating-luxury-badge .badge-icon-gold{
  background:transparent !important;
  border:1.5px solid rgba(226,236,250,.8) !important;
  border-radius:6px !important;
}
.floating-luxury-badge .badge-icon-gold svg{fill:#E6EEFA;stroke:#E6EEFA;}
.floating-luxury-badge div > div:first-child{
  color:#FFFFFF !important;
  letter-spacing:.04em;text-transform:uppercase;font-size:0.74rem !important;
}
.floating-luxury-badge div > div:last-child{
  color:rgba(226,236,250,.82) !important;
  font-size:0.68rem !important;letter-spacing:.02em;
}

/* ================= КАПСУЛА О БЕСПЛАТНОМ ПОИСКЕ =================
   Слово «бесплатно» вынесено из заголовка сюда: в заголовке оно читалось бы
   как «услуга бесплатная» и попадало под ч. 7 ст. 5 закона о рекламе —
   существенное условие рядом отсутствует. Здесь условие названо прямо. */
.hero-free{
  display:inline-flex;align-items:center;gap:10px;
  margin:0 0 18px !important;
  padding:9px 18px 9px 14px;
  border-radius:999px;
  background:rgba(31,83,224,.09);
  border:1px solid rgba(31,83,224,.24);
  font-size:0.94rem;line-height:1.4;
  color:var(--text-head);
  max-width:100%;
}
.hero-free strong{font-weight:700;color:var(--gold-primary);}
.hero-free-dot{
  width:9px;height:9px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(180deg,#5A8CFF,#12369E);
  box-shadow:0 0 0 3px rgba(31,83,224,.16);
}
@media (max-width:900px){
  .hero-free{
    font-size:0.88rem;
    padding:9px 15px 9px 12px;
    gap:9px;
    align-items:flex-start;
  }
  .hero-free-dot{margin-top:6px;}
}

/* заголовок первого экрана на телефоне: было 38px и четыре строки */
@media (max-width:900px){
  .hero-title{
    font-size:clamp(1.85rem, 7.4vw, 2.1rem) !important;
    line-height:1.14 !important;
  }
}

/* ================= БЛОК 2: КАК РАБОТАЕТ УСЛУГА ПОДБОРА ================= */

/* карточки одной высоты — тексты выровнены, но подстрахуемся */
.protocol-card{display:flex;flex-direction:column;position:relative;}
.protocol-desc{margin-bottom:0;}
.protocol-arrow{display:none;}

/* --- компьютер: компактная шапка в две колонки --- */
@media (min-width:901px){
  #how-it-works .section-head-center{
    max-width:none !important;
    text-align:left !important;
    margin:0 0 28px !important;
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    column-gap:48px;row-gap:6px;
    align-items:end;
  }
  #how-it-works .sec-kicker{grid-column:1;grid-row:1;}
  #how-it-works .sec-title{
    grid-column:1;grid-row:2;
    margin-bottom:0 !important;
    white-space:nowrap;
  }
  #how-it-works .sec-intro{
    grid-column:2;grid-row:2;
    max-width:62ch;padding-bottom:5px;
  }
}

/* --- телефон: карусель --- */
@media (max-width:900px){
  #how-it-works .protocol-grid{
    display:flex !important;
    grid-template-columns:none !important;
    gap:12px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:4px;
    margin-inline:calc(-1 * clamp(20px,3.2vw,38px));
    padding-inline:clamp(20px,3.2vw,38px);
  }
  #how-it-works .protocol-grid::-webkit-scrollbar{display:none;}
  #how-it-works .protocol-card{
    flex:0 0 86%;
    scroll-snap-align:center;
    padding:22px 18px;
  }
  #how-it-works .protocol-card:last-child{margin-right:2px;}

  .protocol-arrow{
    display:flex;align-items:center;justify-content:center;
    position:absolute;top:18px;right:16px;
    width:26px;height:26px;border-radius:50%;
    background:rgba(31,83,224,.1);
    border:1px solid rgba(31,83,224,.24);
  }
  .protocol-arrow svg{
    width:13px;height:13px;fill:none;
    stroke:var(--gold-primary);stroke-width:2.4;
    stroke-linecap:round;stroke-linejoin:round;
  }

  .protocol-dots{
    display:flex;justify-content:center;gap:7px;
    margin-top:16px;
  }
  .protocol-dots span{
    width:7px;height:7px;border-radius:50%;
    background:rgba(31,83,224,.22);
    transition:background .2s ease,width .2s ease;
  }
  .protocol-dots span.on{
    width:20px;border-radius:999px;
    background:var(--gold-primary);
  }
}
@media (min-width:901px){ .protocol-dots{display:none;} }

/* шестая карточка: на компьютере ряд из шести */
@media (min-width:901px){
  #how-it-works .protocol-grid{grid-template-columns:repeat(7, 1fr) !important;gap:12px !important;}
  #how-it-works .protocol-card{padding:22px 14px;}
  #how-it-works .protocol-step-num{font-size:1.5rem;margin-bottom:8px;}
  #how-it-works .protocol-title{font-size:0.85rem;letter-spacing:-.01em;}
  #how-it-works .protocol-desc{font-size:0.76rem;line-height:1.5;}
}

/* ================= БЛОК 3: КАРУСЕЛЬ НА ТЕЛЕФОНЕ ================= */
.manifesto-card{position:relative;}
.manifesto-arrow{display:none;}
.manifesto-dots{display:none;}

@media (max-width:900px){
  #manifesto .manifesto-triptych-grid{
    display:flex !important;
    grid-template-columns:none !important;
    gap:12px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:4px;
    margin-inline:calc(-1 * clamp(20px,3.2vw,38px));
    padding-inline:clamp(20px,3.2vw,38px);
  }
  #manifesto .manifesto-triptych-grid::-webkit-scrollbar{display:none;}
  #manifesto .manifesto-card{
    flex:0 0 86%;
    scroll-snap-align:center;
  }

  .manifesto-arrow{
    display:flex;align-items:center;justify-content:center;
    position:absolute;top:20px;right:18px;
    width:26px;height:26px;border-radius:50%;
    background:rgba(255,255,255,.1);
    border:1px solid rgba(255,255,255,.3);
  }
  .manifesto-arrow svg{
    width:13px;height:13px;fill:none;
    stroke:#9FC0FF;stroke-width:2.4;
    stroke-linecap:round;stroke-linejoin:round;
  }

  .manifesto-dots{
    display:flex;justify-content:center;gap:7px;
    margin-top:18px;
  }
  .manifesto-dots span{
    width:7px;height:7px;border-radius:50%;
    background:rgba(255,255,255,.26);
    transition:background .2s ease,width .2s ease;
  }
  .manifesto-dots span.on{
    width:20px;border-radius:999px;
    background:#7EA8FF;
  }
}

/* заголовок манифеста на телефоне: в разметке задан 2.5rem и уходил в четыре строки */
@media (max-width:900px){
  #manifesto .sec-title{line-height:1.15 !important;}
  #manifesto .sec-intro{font-size:0.95rem !important;}
  #manifesto .section-head-center{margin-bottom:28px !important;}
}

/* ================= БЛОК 3: ОТДЕЛКА =================
   Римские цифры убраны: они занимали 60px высоты в каждой карточке и ничего не сообщали.
   Заголовок теперь ведёт карточку сам. */
.manifesto-body{padding-top:26px;}

@media (max-width:900px){
  /* карточки выравниваются по левому краю, а не по центру:
     иначе последняя вставала посреди экрана, а слева торчал хвост предыдущей */
  #manifesto .manifesto-triptych-grid{
    scroll-snap-type:x mandatory;
    scroll-padding-left:clamp(20px,3.2vw,38px);
  }
  #manifesto .manifesto-card{
    flex:0 0 90% !important;
    scroll-snap-align:start !important;
  }
  /* хвост, чтобы последняя карточка доехала до левого края */
  #manifesto .manifesto-triptych-grid::after{
    content:'';
    flex:0 0 calc(10% - 12px);
  }

  #how-it-works .protocol-grid{
    scroll-padding-left:clamp(20px,3.2vw,38px);
  }
  #how-it-works .protocol-card{
    flex:0 0 90% !important;
    scroll-snap-align:start !important;
  }
  #how-it-works .protocol-grid::after{
    content:'';
    flex:0 0 calc(10% - 12px);
  }

  .manifesto-body{padding-top:22px;}
  #manifesto .manifesto-card-title{font-size:1.45rem;}
}

/* у манифеста своя внутренняя обёртка с полями — на телефоне она делала ленту
   уже, чем в соседнем блоке. Поля снимаем, лента и заголовок идут по одной линии. */
@media (max-width:900px){
  .manifesto-wrap{padding-left:0 !important;padding-right:0 !important;}
  #manifesto .section-head-center{padding-left:4px;padding-right:4px;}
}

/* ================= БЛОК 4: ТОЛЬКО НА КОМПЬЮТЕРЕ =================
   Таблица сравнения на телефоне разворачивается в длинный столбец карточек
   и читается плохо. По решению владельца на узких экранах блок скрыт. */
/* Блок вернулся на телефон 04.09.2026: таблица переписана в две колонки вместо трёх
   и разворачивается вдвое короче, чем прежняя. Ссылки в меню и подвале на него ведут. */

/* ================= КАТАЛОГ ВИДОВ =================
   Подложка светлее и прозрачнее остальных блоков — матовое стекло,
   как у карточки первого экрана, чтобы каталог отличался от соседей. */
#catalog > .container{
  background:rgba(255,255,255,.62) !important;
  backdrop-filter:blur(18px) saturate(1.1);
  -webkit-backdrop-filter:blur(18px) saturate(1.1);
}

/* заголовок каталога — в одну строку: шапка блока была ограничена 760px и переносила его */
#catalog .section-head-center{max-width:none !important;}
@media (min-width:901px){
  #catalog .sec-title{white-space:nowrap;}
}
/* на телефоне nowrap выталкивал заголовок за экран — вместо него подобран размер */
@media (max-width:900px){
  #catalog .sec-title{line-height:1.2 !important;}
}

/* ================= БЛОК ОБЕЩАНИЯ =================
   Стоит на месте калькулятора. Тёмный, чтобы выделяться среди светлых соседей. */
#garantiya > .promise-card{
  background:linear-gradient(160deg,rgba(20,51,110,.93) 0%,rgba(11,30,66,.95) 100%) !important;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  color:#E7EEFA;
  text-align:center;
}
#garantiya .sec-kicker{color:var(--gold-light);}
#garantiya .promise-title{
  color:#FFFFFF !important;
  margin-bottom:14px;
}
#garantiya .promise-lead{
  font-size:1.08rem;line-height:1.6;
  color:rgba(231,238,250,.9);
  max-width:62ch;margin:0 auto;
}
#garantiya .promise-cols{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(18px,3vw,40px);
  margin-top:clamp(28px,4vw,44px);
  text-align:left;
}
#garantiya .promise-col{
  border-top:2px solid var(--gold-light);
  padding-top:16px;
}
#garantiya .promise-col h3{
  font-family:'Golos Text',system-ui,sans-serif;
  font-size:1.02rem;color:#FFFFFF;margin-bottom:8px;
}
#garantiya .promise-col p{
  font-size:0.9rem;line-height:1.6;
  color:rgba(231,238,250,.78);margin:0;
}
#garantiya .promise-actions{
  display:flex;flex-wrap:wrap;gap:12px;justify-content:center;
  margin-top:clamp(26px,4vw,40px);
}
#garantiya .promise-tel{
  color:#FFFFFF !important;
  border-color:rgba(231,238,250,.45) !important;
  text-decoration:none;display:inline-flex;align-items:center;
}
#garantiya .promise-tel:hover{border-color:#FFFFFF !important;}

@media (max-width:900px){
  #garantiya .promise-cols{grid-template-columns:1fr;gap:20px;}
  #garantiya .promise-title{font-size:clamp(1.5rem,6vw,1.9rem) !important;}
  #garantiya .promise-lead{font-size:0.98rem;}
  #garantiya .promise-actions .btn-lux{width:100%;justify-content:center;}
}

#garantiya .promise-price-link{
  display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none;
}

/* ================= СТРАНИЦА ЦЕН И ПАКЕТОВ =================
   Внутренние страницы начинаются сразу с содержимого, без первого экрана,
   поэтому первой секции нужен отступ от шапки. */
.page-inner .section-wrap:first-of-type{padding-top:calc(var(--vk-head-h) + 34px);}
.page-inner #packages > .container{
  background:rgba(255,255,255,.62) !important;
  backdrop-filter:blur(18px) saturate(1.1);
  -webkit-backdrop-filter:blur(18px) saturate(1.1);
}
.page-inner #packages h1.sec-title{margin-bottom:14px;}

.pack-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2vw,24px);
  margin-top:clamp(26px,3.4vw,40px);
}
.pack-card{
  display:flex;flex-direction:column;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(20,51,110,.12);
  border-radius:18px;
  padding:clamp(20px,2.2vw,28px);
  box-shadow:0 10px 26px rgba(10,40,90,.08);
}
.pack-name{
  font-family:'Golos Text',system-ui,sans-serif;
  font-size:1.05rem;font-weight:600;
  color:var(--primary-deep);margin:0 0 10px;
}
.pack-price strong{
  font-family:'Literata',Georgia,serif;
  font-size:clamp(1.9rem,3vw,2.4rem);font-weight:700;
  color:var(--primary-deep);line-height:1.1;
}
.pack-note{
  font-size:0.88rem;color:var(--text-muted);
  margin:10px 0 18px;padding-bottom:16px;
  border-bottom:1px solid rgba(20,51,110,.12);
}
.pack-list{list-style:none;margin:0 0 18px;padding:0;}
.pack-list li{
  position:relative;padding-left:24px;margin-bottom:11px;
  font-size:0.9rem;line-height:1.55;color:var(--text-body);
}
.pack-list li::before{
  content:'';position:absolute;left:0;top:7px;
  width:12px;height:7px;
  border-left:2px solid var(--gold-primary);
  border-bottom:2px solid var(--gold-primary);
  transform:rotate(-45deg);
}
.pack-small{
  font-size:0.8rem;line-height:1.5;color:var(--text-muted);
  margin:0 0 18px;
}
.pack-btn{margin-top:auto;width:100%;justify-content:center;}

.pack-custom{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:clamp(18px,2.6vw,34px);
  margin-top:clamp(18px,2.2vw,26px);
  padding:clamp(22px,2.6vw,32px);
  border-radius:18px;
  background:linear-gradient(160deg,rgba(20,51,110,.93) 0%,rgba(11,30,66,.95) 100%);
  color:#E7EEFA;
}
.pack-custom-text{flex:1 1 420px;}
.pack-custom-text h2{
  font-family:'Golos Text',system-ui,sans-serif;
  font-size:1.05rem;color:#FFFFFF;margin:0 0 8px;
}
.pack-custom-text p{
  font-size:0.9rem;line-height:1.6;
  color:rgba(231,238,250,.82);margin:0;
}
.pack-custom-side{
  display:flex;flex-direction:column;align-items:flex-start;gap:12px;
}
.pack-custom-price{
  font-family:'Literata',Georgia,serif;
  font-size:1.3rem;color:var(--gold-light);
}

/* два аргумента */
.why-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,44px);}
.why-col{border-top:2px solid var(--gold-primary);padding-top:16px;}
.why-col h2{
  font-family:'Golos Text',system-ui,sans-serif;
  font-size:1.05rem;color:var(--primary-deep);margin:0 0 10px;
}
.why-col p{font-size:0.92rem;line-height:1.6;color:var(--text-body);margin:0;}

/* что оплачивается отдельно */
.excl-list{list-style:none;margin:clamp(20px,2.6vw,30px) 0 0;padding:0;}
.excl-list li{
  position:relative;padding-left:22px;margin-bottom:14px;
  font-size:0.92rem;line-height:1.6;color:var(--text-body);
}
.excl-list li::before{
  content:'';position:absolute;left:0;top:9px;
  width:10px;height:2px;background:var(--gold-primary);
}
.excl-list strong{color:var(--primary-deep);}
.excl-foot{
  margin-top:18px;padding-top:18px;
  border-top:1px solid rgba(20,51,110,.12);
  font-size:0.92rem;line-height:1.6;color:var(--text-body);
}
.excl-actions{
  display:flex;flex-wrap:wrap;gap:12px;justify-content:center;
  margin-top:clamp(22px,3vw,32px);
}
.excl-tel{text-decoration:none;display:inline-flex;align-items:center;}

@media (max-width:900px){
  .pack-grid{grid-template-columns:1fr;}
  .why-cols{grid-template-columns:1fr;gap:22px;}
  .pack-custom{flex-direction:column;align-items:stretch;}
  .pack-custom-side{align-items:stretch;}
  .pack-custom-side .btn-lux{width:100%;justify-content:center;}
  .excl-actions .btn-lux{width:100%;justify-content:center;}
}

.page-inner #packages .sec-kicker{display:block;text-align:center;}
.page-inner #packages .sec-intro{max-width:64ch;margin-left:auto;margin-right:auto;}
.page-inner #not-included .sec-title{margin-bottom:0;}

/* наследование пакетов */
.pack-incl{
  display:flex;align-items:center;gap:8px;
  margin:0 0 16px;padding:9px 12px;
  border-radius:10px;
  background:rgba(31,83,224,.08);
  border:1px solid rgba(31,83,224,.18);
  font-size:0.84rem;line-height:1.4;color:var(--primary-forest);
}
.pack-incl::before{
  content:'';flex:0 0 auto;
  width:11px;height:6px;
  border-left:2px solid var(--gold-primary);
  border-bottom:2px solid var(--gold-primary);
  transform:rotate(-45deg) translateY(-2px);
}
.pack-sub{
  display:block;margin-bottom:10px;
  font-family:'Golos Text',system-ui,sans-serif;
  font-size:0.72rem;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;
  color:var(--text-muted);
}

.pack-incl-base{
  background:rgba(20,51,110,.06);
  border-color:rgba(20,51,110,.14);
  color:var(--text-muted);
}
.pack-incl-base::before{
  border-left-color:var(--text-muted);
  border-bottom-color:var(--text-muted);
}

/* ================= ПРАВКИ 02.09.2026 =================

   1. Подвал по ширине сетки.
   Он стоял на max-width:1080px, тогда как контент идёт по 1320px, —
   подвал выглядел уже страницы. */
body > footer{
  width:min(1320px, calc(100% - 2 * var(--vk-pad))) !important;
  max-width:none !important;
}
@media (max-width:900px){
  /* четыре колонки в один столбец делали подвал непомерно высоким */
  .footer-grid{grid-template-columns:1fr 1fr !important;gap:24px !important;margin-bottom:30px !important;}
  body > footer{padding-left:clamp(18px,4vw,26px) !important;padding-right:clamp(18px,4vw,26px) !important;}
}
@media (max-width:520px){
  .footer-grid{gap:20px !important;}
  .footer-col:first-child{grid-column:1 / -1;}
}

/* 2. Прыжок фона при прокрутке на телефоне.
   Слои стояли на inset:0, то есть на высоте видимой области. В мобильных
   браузерах она меняется, когда прячется адресная строка, — фотография
   пересчитывалась и дёргалась. Крепим слои к large viewport height,
   он при сворачивании панели не меняется. */
.vk-layer{
  height:100vh;
  height:100lvh;
  bottom:auto;
}
.vk-photo{height:100vh;height:100lvh;}
@media (min-width:761px){
  .vk-photo{height:calc(100vh - var(--vk-head-h));height:calc(100lvh - var(--vk-head-h));}
}
@media (max-width:760px){
  .vk-photo{height:calc(100vh - var(--vk-head-h));height:calc(100lvh - var(--vk-head-h));}
}

/* 3. Провал между текстом и кнопкой в карточке «Гибкие условия».
   flex:1 1 420px в колоночной раскладке задаёт базовую ВЫСОТУ, а не ширину. */
@media (max-width:900px){
  .pack-custom{gap:16px;}
  .pack-custom-text{flex:0 0 auto;}
  .pack-custom-side{gap:14px;}
  .pack-custom-price{font-size:1.15rem;}
}

/* подвал на телефоне: две узкие колонки ломали каждую ссылку на две строки,
   поэтому один столбец, но с компактными отступами */
@media (max-width:620px){
  .footer-grid{grid-template-columns:1fr !important;gap:22px !important;margin-bottom:26px !important;}
  .footer-col:first-child{grid-column:auto;}
  .footer-links li{margin-bottom:9px !important;}
  .footer-links a{font-size:0.88rem;line-height:1.35;}
  body > footer h4{margin-bottom:10px !important;}
}

/* подвал на телефоне: разделы сворачиваются, шаг ссылок компактнее */
@media (max-width:620px){
  .footer-acc .footer-col.acc h4{
    display:flex;align-items:center;justify-content:space-between;
    cursor:pointer;margin-bottom:0 !important;
    padding:13px 0;
    border-bottom:1px solid rgba(233,240,252,.14);
  }
  .footer-acc .footer-col.acc h4::after{
    content:'';width:8px;height:8px;flex:0 0 auto;margin-left:12px;
    border-right:2px solid rgba(233,240,252,.6);
    border-bottom:2px solid rgba(233,240,252,.6);
    transform:rotate(45deg) translateY(-2px);
    transition:transform .2s ease;
  }
  .footer-acc .footer-col.acc.open h4::after{transform:rotate(-135deg) translateY(2px);}
  .footer-acc .footer-col.acc .footer-links{display:none;padding-top:10px;}
  .footer-acc .footer-col.acc.open .footer-links{display:block;}
  .footer-acc .footer-grid{gap:0 !important;}
  .footer-acc .footer-col:first-child{margin-bottom:18px;}
  .footer-acc .footer-links li{margin-bottom:2px !important;}
  .footer-acc .footer-links a{padding:8px 0;}
}

@media (max-width:620px){
  /* правовые ссылки в строку с переносом, а не столбиком */
  .footer-bottom > div:last-child{flex-wrap:wrap;gap:8px 18px !important;}
  .footer-bottom{font-size:0.82rem;}
  .footer-acc .footer-col:not(.acc){margin-top:16px;}
}

/* ================= КАТАЛОГ: карусель на телефоне =================
   Шесть карточек в столбик давали 4451 px высоты — до конца никто не листал. */
.birds-dots{display:none;}
@media (max-width:900px){
  #catalog .birds-lux-grid{
    display:flex !important;
    grid-template-columns:none !important;
    gap:12px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:4px;
    margin-inline:calc(-1 * clamp(20px,3.2vw,38px));
    padding-inline:clamp(20px,3.2vw,38px);
  }
  #catalog .birds-lux-grid::-webkit-scrollbar{display:none;}
  #catalog .bird-lux-item{
    flex:0 0 86%;
    scroll-snap-align:center;
  }
  #catalog .bird-lux-item:last-child{margin-right:2px;}

  .birds-dots{
    display:flex;justify-content:center;gap:7px;
    margin-top:16px;
  }
  .birds-dots span{
    width:7px;height:7px;border-radius:50%;
    background:rgba(31,83,224,.22);
    transition:background .2s ease,width .2s ease;
  }
  .birds-dots span.on{
    width:20px;border-radius:999px;
    background:var(--gold-primary);
  }
}

/* карточка каталога в узкой ленте: цена и латынь не помещались в строку */
@media (max-width:900px){
  #catalog .bird-headline-row{
    flex-direction:column;align-items:flex-start;gap:2px;
  }
  #catalog .bird-card-bottom{
    flex-direction:column;align-items:stretch;gap:12px;
  }
  #catalog .bird-price-box strong{white-space:nowrap;}
  #catalog .bird-card-bottom .btn-lux{width:100%;justify-content:center;}
}

/* ================= КАТАЛОГ: компактная карточка на телефоне =================
   Карточка занимала 86% ширины — по краям торчали соседние, а высота
   не помещалась в экран. Теперь карточка во всю сетку и сжата по вертикали. */
@media (max-width:900px){
  #catalog .birds-lux-grid{gap:14px;}
  #catalog .bird-lux-item{
    flex:0 0 100% !important;
    scroll-snap-align:start !important;
  }
  #catalog .bird-visual-frame{height:190px !important;}
  #catalog .bird-content-body{padding:16px !important;}
  #catalog .bird-title{font-size:1.15rem !important;}
  #catalog .bird-latin{font-size:0.78rem !important;}
  #catalog .bird-intro{
    font-size:0.85rem !important;
    line-height:1.45 !important;
    margin-bottom:12px !important;
  }
  #catalog .bird-metrics-matrix{
    padding:8px !important;
    gap:6px !important;
    margin-bottom:12px !important;
  }
  #catalog .bird-metrics-matrix .metric-cell span{font-size:0.62rem !important;}
  #catalog .bird-metrics-matrix .metric-cell strong{font-size:0.8rem !important;}
  #catalog .bird-card-bottom{padding-top:12px !important;gap:10px !important;}
  #catalog .bird-price-box span{font-size:0.7rem !important;}
  #catalog .bird-price-box strong{font-size:1.2rem !important;}
  #catalog .bird-card-bottom .btn-lux{padding:12px 18px !important;}
  .birds-dots{margin-top:12px;}
}

/* ================= КВИЗ: низ панели на телефоне =================
   «Назад», «Шаг 1 из 4» и «Продолжить» стояли в одну строку и не помещались:
   кнопка наезжала на счётчик. На узких экранах кнопки идут парой,
   счётчик уходит отдельной строкой под ними. */
@media (max-width:620px){
  #lux-quiz-nav{
    flex-wrap:wrap !important;
    gap:12px;
    margin-top:22px !important;
    padding-top:16px !important;
  }
  #lux-quiz-nav .btn-lux{
    /* базис 140px: при крупном системном шрифте кнопки встают друг под друга,
       а не режут текст */
    flex:1 1 140px;
    min-width:0;
    justify-content:center;
    padding:13px 12px !important;
    font-size:0.8rem !important;
    white-space:normal;
    line-height:1.25;
  }
  #lux-quiz-nav #lux-step-counter{
    order:3;
    width:100%;
    text-align:center;
  }
}

/* ================= ЕДИНАЯ ШКАЛА ЗАГОЛОВКОВ =================
   Заголовки секций стояли на четырёх разных размерах (36, 40, 42, 48 px):
   каждый блок правился отдельно. Теперь размер один на всех, включая телефон. */
.sec-title{
  font-size:clamp(2.1rem, 3.4vw, 3rem) !important;
  line-height:1.12;
}
@media (max-width:900px){
  .sec-title{font-size:clamp(1.65rem, 6.2vw, 2.1rem) !important;}
  /* в узком экране заголовок не может стоять в одну строку */
  #how-it-works .sec-title,
  #catalog .sec-title{white-space:normal !important;}
}

/* заголовки шагов квиза и результата — вместо встроенных размеров */
.quiz-step-title{
  font-size:1.5rem;
  margin-bottom:18px;
  color:var(--primary-deep);
}
.quiz-result-title{
  font-size:2.2rem;
  color:var(--primary-deep);
  margin-bottom:12px;
}
@media (max-width:900px){
  .quiz-step-title{font-size:1.3rem;}
  .quiz-result-title{font-size:1.7rem;}
}

/* мелкие заголовки (Golos Text) — один размер и одно начертание.
   Исключение: карточки шагов в блоке «как работает» стоят семью колонками,
   там 14px оправдан шириной колонки. */
.pack-name,
.pack-custom-text h2,
#garantiya .promise-col h3,
#legal .legal-text h4,
#legal .legal-text h3,
.sq-card h4,
.why-col h2{
  font-size:1.05rem !important;
  font-weight:600 !important;
  font-family:'Golos Text', system-ui, sans-serif !important;
}

/* блок форума тёмный: заголовок секции здесь светлый, а не общий тёмно-синий */
.forum-info .sec-title{color:var(--gold-light) !important;}

/* ================= ТЕЛЕФОН: ПЛОТНЕЕ ПО ВЕРТИКАЛИ =================
   Отступы задавались для широкого экрана и на телефоне читались как пустоты:
   между шапкой блока и его содержимым стояло 50 px, описание первого экрана
   шло кеглем 1.12rem с межстрочным 1.7. Компьютерная раскладка не меняется. */
@media (max-width:900px){

  /* первый экран */
  .hero-desc{
    font-size:0.97rem !important;
    line-height:1.5 !important;
    margin-bottom:18px !important;
  }
  .hero-badge{margin-bottom:14px !important;}
  .hero-title{margin-bottom:14px !important;}
  .hero-free{margin-bottom:14px !important;}
  .hero-ctas{margin-bottom:12px !important;}
  .hero-grid{gap:22px !important;}

  /* шапка блока и его содержимое */
  .section-head-center{margin-bottom:24px !important;}
  #manifesto .section-head-center{margin-bottom:24px !important;}

  /* квиз и форум */
  .quiz-progress-track{margin-bottom:22px !important;}
  .forum-info{margin-bottom:24px !important;}

  /* блок обещания */
  #garantiya .promise-cols{margin-top:22px !important;}
  #garantiya .promise-actions{margin-top:20px !important;}

  /* карточки в столбик: 24 px между ними — многовато */
  #legal .legal-shield-grid{gap:14px !important;}
  #extensions .square-gallery-grid{gap:14px !important;}
}

@media (max-width:900px){
  /* сетка юридического блока несла собственные поля 40px сверху и снизу */
  #legal .legal-shield-grid{margin:0 !important;}
  /* колонки форума в столбик: зазор 44px между текстом и списком тем */
  .forum-layout{gap:20px !important;}
  .forum-info{margin-bottom:0 !important;}
}

/* ================= ЮРИДИЧЕСКИЙ ЩИТ: карусель на телефоне =================
   Четыре карточки с длинным текстом давали блоку 1807 px. */
.legal-dots{display:none;}
@media (max-width:900px){
  #legal .legal-shield-grid{
    display:flex !important;
    grid-template-columns:none !important;
    gap:12px !important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:4px;
    margin-inline:calc(-1 * clamp(20px,3.2vw,38px)) !important;
    padding-inline:clamp(20px,3.2vw,38px);
  }
  #legal .legal-shield-grid::-webkit-scrollbar{display:none;}
  #legal .legal-card{
    flex:0 0 100% !important;
    scroll-snap-align:start !important;
  }

  .legal-dots{
    display:flex;justify-content:center;gap:7px;
    margin-top:14px;
  }
  .legal-dots span{
    width:7px;height:7px;border-radius:50%;
    background:rgba(31,83,224,.22);
    transition:background .2s ease,width .2s ease;
  }
  .legal-dots span.on{
    width:20px;border-radius:999px;
    background:var(--gold-primary);
  }
}

/* ================= ЦИФРОВАЯ ИНФРАСТРУКТУРА: ровные карточки =================
   Карточки в ряду растягиваются по самой высокой, и под коротким текстом
   оставался воздух. Кнопки прижаты к низу — тогда пустота не рвёт карточку,
   а нижняя линия у всех общая. Ветеринарная сноска сделана компактной. */
#extensions .sq-card-caption{
  display:flex;
  flex-direction:column;
  height:100%;
}
#extensions .sq-desc{margin-bottom:14px;}
#extensions .vet-note{
  font-size:0.74rem;
  line-height:1.4;
  margin:0 0 14px;
}
#extensions .sq-link-btn{
  margin-top:auto;
  padding-top:14px;
  border-top:1px solid rgba(20,51,110,.10);
}

/* сноска-уточнение в карточках: тот же вид, что у ветеринарной заметки */
#extensions .sq-note{
  font-size:0.74rem;
  line-height:1.4;
  margin:0 0 14px;
  padding-left:12px;
  border-left:2px solid rgba(31,83,224,.28);
  color:var(--text-muted);
}

/* ================= ЮРИДИЧЕСКИЕ КАРТОЧКИ: скрепка вместо иконки =================
   Иконка стояла слева и сжимала текст в узкий столбик — на телефоне карточка
   превращалась в длинную колонку с пустыми полями. Теперь текст во всю ширину,
   а в левом верхнем углу — скрепка, будто к карточке приколот листок. */
#legal .legal-card{
  position:relative;
  display:block !important;
  padding:34px 24px 26px !important;
}
#legal .legal-card::before{
  content:'';
  position:absolute;
  top:-16px;left:18px;
  width:38px;height:39px;
  background:url("../decor/pin.webp") center/contain no-repeat;
  pointer-events:none;
}
#legal .legal-text{width:100%;}
#legal .legal-text h4,
#legal .legal-text h3{margin-bottom:8px;}

@media (max-width:900px){
  #legal .legal-card{padding:30px 20px 22px !important;}
  #legal .legal-text p{font-size:0.9rem;line-height:1.55;}
}

/* в карусели лента обрезает всё, что выходит за её край, — на телефоне
   кнопка садится внутрь карточки, а не поверх её верхней границы */
@media (max-width:900px){
  #legal .legal-card{padding-top:52px !important;}
  #legal .legal-card::before{top:12px !important;left:16px !important;}
}

/* ================= ЧАСТЫЕ ВОПРОСЫ =================
   Раскрытие на нативном <details>: работает без скриптов, доступно
   с клавиатуры, и поисковик видит ответы в разметке. */
.faq-list{
  max-width:900px;
  margin:0 auto;
}
.faq-item{
  border-bottom:1px solid rgba(20,51,110,.12);
}
.faq-item:first-child{border-top:1px solid rgba(20,51,110,.12);}
.faq-q{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:18px 0;
  font-family:'Golos Text',system-ui,sans-serif;
  font-size:1.02rem;
  font-weight:600;
  color:var(--primary-deep);
  line-height:1.4;
}
.faq-q::-webkit-details-marker{display:none;}
.faq-q::after{
  content:'';
  flex:0 0 auto;
  width:10px;height:10px;
  margin-left:auto;
  margin-top:6px;
  border-right:2px solid var(--gold-primary);
  border-bottom:2px solid var(--gold-primary);
  transform:rotate(45deg);
  transition:transform .2s ease;
}
.faq-item[open] .faq-q::after{transform:rotate(-135deg);margin-top:10px;}
.faq-q:hover{color:var(--gold-primary);}
.faq-a{padding:0 34px 20px 0;}
.faq-a p{
  margin:0;
  font-size:0.94rem;
  line-height:1.65;
  color:var(--text-body);
}
.faq-foot{
  display:flex;flex-wrap:wrap;gap:12px;justify-content:center;
  margin-top:clamp(24px,3vw,34px);
}
.faq-tel{text-decoration:none;display:inline-flex;align-items:center;}

@media (max-width:900px){
  .faq-q{font-size:0.96rem;padding:16px 0;}
  .faq-a{padding-right:24px;padding-bottom:16px;}
  .faq-a p{font-size:0.9rem;}
  .faq-foot .btn-lux{width:100%;justify-content:center;}
}

/* иллюстрация к частым вопросам: на компьютере сбоку от шапки блока,
   на телефоне — над заголовком, чтобы не отнимать ширину у текста */
#faq > .container{position:relative;}
.faq-mascot{
  position:absolute;
  top:clamp(28px,4vw,58px);
  right:clamp(16px,3vw,40px);
  width:clamp(96px,10vw,150px);
  height:auto;
  pointer-events:none;
}
@media (max-width:1100px){
  .faq-mascot{
    position:static;
    display:block;
    width:104px;
    margin:0 auto 10px;
  }
}


/* ================= ПРАВКИ ПРЕДЗАПУСКОВОГО АУДИТА 04.09.2026 ================= */

/* Кнопка «Продолжить» в квизе выглядела активной, пока вариант не выбран:
   правил для :disabled в файле не было вообще. */
.btn-lux:disabled,
.btn-lux[disabled]{
  background:var(--bg-champagne) !important;
  color:var(--text-muted) !important;
  border-color:var(--border-soft) !important;
  box-shadow:none !important;
  cursor:not-allowed;
  transform:none !important;
}
.btn-lux:disabled:hover,
.btn-lux[disabled]:hover{transform:none !important;box-shadow:none !important;}

/* Сноска под каталогом: цена в карточке — это цена птицы у заводчика, не наша услуга. */
.catalog-price-note{
  max-width:760px;
  margin:22px auto 0;
  font-family:'Golos Text', system-ui, sans-serif;
  font-size:0.86rem;
  line-height:1.6;
  color:var(--text-muted);
  text-align:center;
}
.catalog-price-note a{color:var(--gold-primary);text-decoration:underline;}

/* Энциклопедия больше не собирает контакты — на месте кнопки подпись. */
.sq-soon{
  margin:auto 0 0;
  padding-top:12px;
  font-family:'Golos Text', system-ui, sans-serif;
  font-size:0.82rem;
  font-weight:600;
  color:var(--text-muted);
}

/* Низ карточки вида: цена и кнопка стояли в одном ряду без зазора и налезали
   друг на друга, когда подпись цены длиннее обычного. */
.bird-card-bottom{gap:16px;flex-wrap:wrap;}
.bird-card-bottom .btn-lux{flex:0 0 auto;}
.bird-price-box{min-width:0;flex:1 1 auto;}

/* ================= СТРАНИЦЫ ВИДОВ /popugai/<вид>/ =================
   Свои блоки только там, где не хватило существующих: первый экран вида,
   «кому подходит и кому нет» и перелинковка. Остальное — классы главной. */

.breadcrumbs{
  font-family:'Golos Text', system-ui, sans-serif;
  font-size:0.85rem;
  color:var(--text-muted);
  margin-bottom:22px;
}
.breadcrumbs a{color:var(--gold-primary);text-decoration:none;}
.breadcrumbs a:hover{text-decoration:underline;}
.breadcrumbs span[aria-hidden]{margin:0 6px;opacity:.5;}

.species-top{
  display:grid;
  grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr);
  gap:clamp(24px,4vw,48px);
  align-items:start;
}
.species-photo{
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-luxury);
  background:var(--bg-champagne);
}
.species-photo img{display:block;width:100%;height:auto;}

.species-intro .sec-title{margin:6px 0 14px;text-align:left;}
.species-intro .sec-kicker{display:block;font-style:italic;text-transform:none;letter-spacing:0;}
.species-lead{
  font-size:1.02rem;
  line-height:1.7;
  color:var(--text-body);
  margin:0 0 22px;
  max-width:62ch;
}

/* Паспорт вида: отдельные карточки вместо ячеек на общей подложке —
   иначе характеристики читаются как черновой список. */
.species-specs{
  margin-bottom:20px;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px;
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
}
.species-specs .metric-cell{
  background:var(--bg-surface);
  border:1px solid var(--border-soft);
  border-radius:var(--radius-md);
  padding:14px 16px;
  display:flex;
  flex-direction:column;
  gap:4px;
  text-align:left;
}
.species-specs .metric-cell + .metric-cell{border-left:1px solid var(--border-soft);}
.species-specs .metric-cell span{
  font-size:0.72rem;
  text-transform:uppercase;
  letter-spacing:0.05em;
  color:var(--text-muted);
}
.species-specs .metric-cell strong{
  font-family:'Golos Text', system-ui, sans-serif;
  font-size:1rem;
  font-weight:600;
  color:var(--primary-deep);
  line-height:1.3;
}
@media (max-width:600px){
  .species-specs{grid-template-columns:repeat(2,1fr);}
}

/* Цена птицы и цена услуги — рядом, чтобы их не путали */
.species-price{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:8px;
}
.species-price > div{
  flex:1 1 190px;
  background:var(--bg-champagne);
  border:1px solid var(--border-soft);
  border-radius:var(--radius-md);
  padding:14px 18px;
}
.species-price span{
  display:block;
  font-size:0.72rem;
  text-transform:uppercase;
  letter-spacing:0.8px;
  color:var(--text-muted);
  margin-bottom:4px;
}
.species-price strong{
  font-family:"Literata", Georgia, serif;
  font-size:1.35rem;
  color:var(--primary-deep);
}
.species-price-note{
  font-size:0.85rem;
  color:var(--text-muted);
  margin:0 0 22px;
  line-height:1.6;
}
.species-price-note a{color:var(--gold-primary);}

/* «Кому подходит» и «кому нет» — две колонки одинакового веса.
   Красная колонка здесь работает на доверие: честное «не берите» убеждает
   сильнее любого перечисления достоинств. */
.suits-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:22px;
}
.suits-col{
  border-radius:var(--radius-lg);
  padding:26px 28px;
  border:1px solid var(--border-soft);
  background:var(--bg-surface);
}
.suits-col h3{
  font-family:"Literata", Georgia, serif;
  font-size:1.35rem;
  margin:0 0 14px;
}
.suits-col ul{margin:0;padding-left:22px;}
.suits-col li{
  font-size:0.95rem;
  line-height:1.65;
  margin-bottom:10px;
  color:var(--text-body);
}
.suits-yes{border-color:rgba(63,106,75,.35);background:#F2F8F4;}
.suits-yes h3{color:#2F5B3C;}
.suits-no{border-color:rgba(160,48,32,.3);background:#FCF3F1;}
.suits-no h3{color:#8C2E1F;}

.species-care .protocol-card{flex:1 1 240px;}

/* Перелинковка между видами — без неё страницы остаются тупиками */
.species-similar{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:18px;
}
.species-similar-card{
  display:block;
  padding:20px 22px;
  border:1px solid var(--border-soft);
  border-radius:var(--radius-md);
  background:var(--bg-surface);
  text-decoration:none;
  transition:var(--transition-smooth);
}
.species-similar-card:hover{
  border-color:var(--gold-border);
  box-shadow:var(--shadow-subtle);
  transform:translateY(-2px);
}
.species-similar-card strong{
  display:block;
  font-family:"Literata", Georgia, serif;
  font-size:1.2rem;
  color:var(--primary-deep);
  margin-bottom:6px;
}
.species-similar-card span{
  font-size:0.88rem;
  color:var(--text-muted);
  line-height:1.6;
}
.species-similar-note{
  margin-top:22px;
  text-align:center;
  font-size:0.92rem;
  color:var(--text-muted);
}
.species-similar-note a{color:var(--gold-primary);}

@media (prefers-reduced-motion:reduce){
  .species-similar-card{transition:none;}
  .species-similar-card:hover{transform:none;}
}

@media (max-width:900px){
  .species-top{grid-template-columns:1fr;}
  .species-intro .sec-title{font-size:1.7rem;}
  .species-photo{max-height:320px;}
  .species-photo img{height:320px;object-fit:cover;object-position:50% 30%;}
}

/* Блок «Что проверяем у этого вида»: карточек нечётное число, и последняя
   висела в половине ряда с пустотой справа. Растягиваем её на всю ширину. */
#proverka .legal-card:last-child:nth-child(odd){grid-column:1 / -1;}

/* ================= КАЛЬКУЛЯТОР СОДЕРЖАНИЯ =================
   Задача блока — показать не одну сумму, а три: разовые покупки, месяц и первый год.
   Вёрстка компактная: строка на позицию, варианты — лентой. Восемь позиций должны
   умещаться на экран без бесконечной прокрутки, поэтому ни карточек, ни лишнего воздуха. */

.calc-wrap{
  background:linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(242,247,255,.97) 100%);
  border:1px solid var(--border-soft);
  border-radius:var(--radius-lg);
  padding:clamp(14px,2vw,22px);
  box-shadow:var(--shadow-luxury);
}

.calc-disclaimer{font-size:0.78rem;color:var(--text-muted);line-height:1.6;margin:14px 0 0;}

.calc-partner{
  margin-top:14px;padding:16px 18px;
  background:var(--gold-pale);
  border:1px solid var(--gold-border);
  border-radius:var(--radius-md);
}
.calc-partner h3{font-family:"Literata", Georgia, serif;font-size:1.05rem;color:var(--primary-deep);margin:0 0 6px;}
.calc-partner p{font-size:0.86rem;line-height:1.6;color:var(--text-body);margin:0;}

/* На телефоне строка складывается в две: шапка позиции и лента вариантов под ней.
   Лента прокручивается вбок, поэтому высота не растёт от числа вариантов. */
@media (max-width:820px){
  .calc-item{
    grid-template-columns:38px minmax(0,1fr) auto;
    grid-template-areas:"sw title sum" "opts opts opts";
    row-gap:8px;padding:11px 12px;
  }
  .calc-switch{grid-area:sw;}
  .calc-item-title{grid-area:title;}
  .calc-item-sum{grid-area:sum;font-size:0.95rem;}
  /* лента во всю ширину строки и с выносом за padding — видно, что она длиннее экрана */
  .calc-opts{grid-area:opts;margin:0 -12px;padding:2px 12px;}
  .calc-item-name{font-size:0.88rem;gap:6px;}
  .calc-item-note{-webkit-line-clamp:2;font-size:0.74rem;}
  .calc-opt{max-width:170px;}

  /* Итоги: главный крупно, два других парой — не три экрана подряд */
  .calc-totals{grid-template-columns:1fr 1fr;gap:8px;}
  .calc-total--accent{grid-column:1 / -1;}
  .calc-total{padding:12px 10px;}
  .calc-total strong{font-size:1.3rem;}
  .calc-total em{font-size:0.68rem;}
}

@media (prefers-reduced-motion:reduce){
  .calc-item,.calc-opt,.calc-switch-box,.calc-switch-box::after{transition:none;}
}

@media (max-width:820px){
  
/* Вкладки по периодичности. Раньше это были три плашки, похожие на кнопки, но
   без реакции на клик — отсюда и путаница. Теперь это настоящие вкладки:
   каждая показывает свою сумму и раскрывает свой раздел. */
.calc-tabs{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  padding:6px;
  background:var(--bg-champagne);
  border-radius:var(--radius-md);
}

.calc-tab{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  padding:14px 16px;
  border:1.5px solid transparent;
  border-radius:var(--radius-sm);
  background:transparent;
  font-family:'Golos Text', system-ui, sans-serif;
  text-align:left;
  cursor:pointer;
  transition:background .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.calc-tab:hover{background:rgba(255,255,255,.7);}
.calc-tab:focus-visible{outline:2px solid var(--gold-primary);outline-offset:2px;}

.calc-tab-label{
  font-size:0.8rem;font-weight:600;color:var(--text-muted);
  text-transform:uppercase;letter-spacing:.04em;
}
.calc-tab-sum{
  font-family:"Literata", Georgia, serif;
  font-size:clamp(1.25rem,2.2vw,1.6rem);font-weight:700;
  color:var(--primary-deep);font-variant-numeric:tabular-nums;line-height:1.15;
}
.calc-tab-hint{font-size:0.74rem;color:var(--text-muted);}

.calc-tab.is-active{
  background:var(--bg-surface);
  border-color:var(--gold-primary);
  box-shadow:0 8px 22px -14px rgba(31,83,224,.75);
}
.calc-tab.is-active .calc-tab-label{color:var(--gold-primary);}
.calc-tab.is-active .calc-tab-sum{color:var(--gold-primary);}

/* Раздел под вкладками */
.calc-panels{
  margin-top:10px;
  border:1px solid var(--border-soft);
  border-radius:var(--radius-md);
  background:var(--bg-surface);
  overflow:hidden;
}
.calc-panel{display:flex;flex-direction:column;}
.calc-panel.is-active{animation:calcFade .26s cubic-bezier(.16,1,.3,1);}
@keyframes calcFade{from{opacity:0;transform:translateY(-5px);}to{opacity:1;transform:none;}}

/* Итог за год — результат, а не раздел, поэтому отдельной строкой */
.calc-grand{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:12px;
  margin-top:12px;padding:16px 20px;
  background:var(--gold-gradient);
  border-radius:var(--radius-md);
  box-shadow:0 14px 30px -18px rgba(31,83,224,.85);
}
.calc-grand-text{display:flex;flex-direction:column;gap:2px;}
.calc-grand-text span{
  font-family:'Golos Text', system-ui, sans-serif;
  font-size:0.9rem;font-weight:600;color:#fff;
}
.calc-grand-text em{font-style:normal;font-size:0.76rem;color:rgba(255,255,255,.78);}
.calc-grand strong{
  font-family:"Literata", Georgia, serif;
  font-size:clamp(1.5rem,3vw,2rem);color:#fff;
  font-variant-numeric:tabular-nums;line-height:1;
}

@media (max-width:820px){
  .calc-tabs{grid-template-columns:1fr;gap:6px;}
  .calc-tab{
    flex-direction:row;align-items:center;justify-content:space-between;
    padding:12px 14px;flex-wrap:wrap;
  }
  .calc-tab-label{font-size:0.76rem;}
  .calc-tab-sum{font-size:1.15rem;}
  .calc-tab-hint{flex:1 0 100%;}
}

@media (prefers-reduced-motion:reduce){
  .calc-tab{transition:none;}
  .calc-panel.is-active{animation:none;}
}