/* *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } */

    :root {
      --bg: #F5F3EE;
      --surface: #FFFFFF;
      --surface-secondary: #F0EEE9;
      --border: rgba(0,0,0,0.1);
      --border-hover: rgba(0,0,0,0.22);
      --text-primary: #1A1A18;
      --text-secondary: #6B6B65;
      --accent: #367ef6;
      --accent-light: #E8F5EE;
      --accent-border: rgba(45,106,79,0.3);
      --dot: #52B788;
      --highlight: #D4EDDA;
      --radius: 14px;
      --font-display: 'Montserrat', Arial, sans-serif;
      --font-body: 'Montserrat', Arial, sans-serif;
    }

    /* body {
      background: var(--bg);
      font-family: var(--font-body);
      color: var(--text-primary);
      min-height: 100vh;
      padding: 60px 20px;
    } */

    /* .wrapper { max-width: 1100px; margin: 0 auto; } */

    /* .header { margin-bottom: 32px; } */
/*
    h2 {
      font-family: var(--font-display);
      font-size: clamp(22px, 3vw, 32px);
      font-weight: 400;
      letter-spacing: -0.03em;
      line-height: 1.2;
      margin-bottom: 10px;
    } */

    .subtitle { font-size: 15px; color: var(--text-secondary); line-height: 1.6; }

    /* Search */
    .search-wrap {
      position: relative;
      margin-bottom: 24px;
    }

    .search-icon {
      position: absolute;
      left: 16px;
      top: 50%;
      transform: translateY(-50%);
      pointer-events: none;
      color: var(--text-secondary);
    }

    .search-input {
      width: 100%;
      height: 48px;
      padding: 0 44px 0 46px;
      font-family: var(--font-body);
      font-size: 15px;
      color: var(--text-primary);
      background: var(--surface);
      border: 0.5px solid var(--border);
      border-radius: 12px;
      outline: none;
      transition: border-color 0.2s, box-shadow 0.2s;
    }

    .search-input::placeholder { color: var(--text-secondary); }
    .search-input::-webkit-search-cancel-button,
    .search-input::-webkit-search-decoration { -webkit-appearance: none; display: none; }
    .search-input[type=search]::-ms-clear { display: none; }

    .search-input:focus {
      border-color: var(--accent-border);
      box-shadow: 0 0 0 3px rgba(45,106,79,0.08);
    }

    .search-clear {
      position: absolute;
      right: 14px;
      top: 50%;
      transform: translateY(-50%);
      width: 22px;
      height: 22px;
      border-radius: 50%;
      background: var(--surface-secondary);
      border: none;
      cursor: pointer;
      display: none;
      align-items: center;
      justify-content: center;
      color: var(--text-secondary);
      font-size: 14px;
      transition: background 0.15s;
    }

    .search-clear:hover { background: var(--border); }
    .search-clear.visible { display: flex; }

    /* Tabs */
    .tabs {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: 32px;
    }

    .tab {
      padding: 7px 18px;
      font-family: var(--font-body);
      font-size: 13px;
      font-weight: 500;
      border-radius: 20px;
      border: 0.5px solid var(--border);
      background: transparent;
      color: var(--text-secondary);
      cursor: pointer;
      transition: background 0.18s, color 0.18s, border-color 0.18s, opacity 0.18s;
    }

    .tab:hover { border-color: var(--border-hover); color: var(--text-primary); }
    .tab.active { background: var(--text-primary); color: var(--bg); border-color: var(--text-primary); }
    .tab.disabled { opacity: 0.35; pointer-events: none; }

    /* Group */
    .group { margin-bottom: 36px; }
    .group.hidden { display: none; }

    .group-label {
      display: flex;
      align-items: center;
      gap: 20px;
      margin-bottom: 12px;
    }

    .group-label .icon-emoji {
        /* font-size: 17px;
        line-height: 1; */
        width: 26px;
        height: 40px;
        background: url('../images/arrow.png');
    }

    .group-label span {
      font-size: 26px;
      font-weight: 700;
      /* color: var(--text-secondary); */
      font-family: var(--font-display);
      /* letter-spacing: 0.08em;
      text-transform: uppercase; */
    }

    .faq-list { display: flex; flex-direction: column; gap: 8px; padding-left: 70px;}

    /* FAQ item */
    .faq-item {
      /* background: var(--surface); */
      /* border: 0.5px solid var(--border); */
      /* border-radius: var(--radius); */
      overflow: hidden;
      /* transition: border-color 0.2s, box-shadow 0.2s; */

    }

    .faq-item::after{
        content: '';
        position: absolute;
        width: 55%;
        border-bottom: 2px solid #000;
    }

    .faq-item.hidden { display: none; }
    .faq-item:hover { border-color: var(--border-hover); }

    .faq-item.open {
      /* border-color: var(--accent-border);
      box-shadow: 0 0 0 3px rgba(45,106,79,0.06); */
    }

    .faq-btn {
      width: 100%;
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 20px;
      padding: 20px 24px;
      background: transparent;
      border: none;
      cursor: pointer;
      text-align: left;
    }

    .faq-btn:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: -2px;
      border-radius: var(--radius);
    }

    .faq-question {
      font-size: 22px;
      font-weight: 400;
      font-family: var(--font-display);
      /* color: var(--text-primary); */
      line-height: 1.5;
    }

    .faq-icon {
      flex-shrink: 0;
      width: 50px;
      height: 50px;
      /* border-radius: 50%; */
      /* background: var(--bg); */
      /* border: 0.5px solid var(--border); */
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 1px;
      /* transition: background 0.2s, border-color 0.2s, transform 0.3s ease; */
    }

    .faq-item.open .faq-icon {
      /* background: var(--accent-light);
      border-color: var(--accent-border); */
      transform: rotate(180deg);
    }

    .faq-icon svg { stroke: var(--text-secondary); transition: stroke 0.2s; }
    .faq-item.open .faq-icon svg { stroke: var(--accent); }

    .faq-body {
      height: 0;
      overflow: hidden;
      transition: height 0.32s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .faq-content { padding: 0 24px 22px; }

    .divider {
      height: 0.5px;
      background: var(--border);
      margin-bottom: 16px;
    }

    .faq-content p { font-size: 16px;
        font-family: var(--font-display);
         /* color: var(--text-secondary); */
         line-height: 1.75;
        }
    .faq-content p + p { margin-top: 10px; }
    .faq-content strong { color: var(--text-primary); font-weight: 500; }

    /* Highlight */
    mark {
      background: var(--highlight);
      color: var(--accent);
      border-radius: 3px;
      padding: 0 2px;
      font-weight: 500;
    }

    /* Dot list */
    .dot-list { display: flex; flex-direction: column; gap: 9px; margin-top: 12px; }

    .dot-item {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.5;
    }

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

    /* Grid */
    .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }

    @media (max-width: 480px) { .grid-2 { grid-template-columns: 1fr; } }

    .grid-card { padding: 12px 14px; background: var(--surface-secondary); border-radius: 10px; }
    .grid-card-title { font-size: 13px; font-weight: 500; color: var(--text-primary); margin-bottom: 3px; }
    .grid-card-val { font-size: 13px; color: var(--text-secondary); }

    /* Empty state */
    .empty-state {
      display: none;
      flex-direction: column;
      align-items: center;
      gap: 12px;
      padding: 60px 20px;
      text-align: center;
    }

    .empty-state.visible { display: flex; }

    .empty-icon {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      background: var(--surface);
      border: 0.5px solid var(--border);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
    }

    .empty-title { font-size: 15px; font-weight: 500; color: var(--text-primary); }
    .empty-sub { font-size: 14px; color: var(--text-secondary); }

    /* Results count */
    .results-count {
      font-size: 13px;
      color: var(--text-secondary);
      margin-bottom: 20px;
      min-height: 20px;
      transition: opacity 0.2s;
    }