Обновление по мобилкам

services/burka_wed/index.html

@@ -356,7 +356,7 @@
   <section id="rsvp" class="section">
     <div class="container">
       <h2 class="section-title">Анкета гостя</h2>
-      <p class="section-sub">Пожалуйста, ответьте до <strong>1 августа 2026</strong></p>
+      <p class="section-sub">Пожалуйста, ответьте до <strong>20 июля 2026</strong></p>
       <!--
         ИНСТРУКЦИЯ: Создайте форму на forms.google.com
         Нажмите «Отправить» → значок «<>» (встроить) → скопируйте ссылку из атрибута src
@@ -388,20 +388,22 @@
             <span class="faq-arrow">▾</span>
           </button>
           <div class="faq-answer">
+            <div class="faq-answer-inner">
               <p>Велком секция (фуршет) начинается в <strong>16:00</strong>.</p>
               <p>Основная секция (банкет) начинается в <strong>17:00</strong>.</p>
             </div>
           </div>
+        </div>
         <div class="faq-item">
           <button class="faq-question" aria-expanded="false">
             Какой дресс-код мероприятия?
             <span class="faq-arrow">▾</span>
           </button>
           <div class="faq-answer">
-            <p>Для нас важно, чтобы гости выглядели нарядно.</p>
+            <div class="faq-answer-inner">
-              <p><strong>Мужчинам</strong> — классический костюм. Брюки, рубашка и туфли — вполне достаточно.</p>
+              <p>Для нас важно, чтобы гости выглядели нарядно так, чтобы вам самим было приятно находиться на свадьбе.</p>
-            <p><strong>Женщинам</strong> — платье или элегантный наряд.</p>
+              <p>Возможно, у вас есть очень крутое платье или костюм, которое вы мечтали надеть, но не было повода. Поверьте, это тот самый случай.</p>
-            <p>По цвету — мы не ограничиваем вас в выборе цвета наряда на свадьбу. Если вам тяжело выбрать цвет, ниже представлены примеры цветов, которые будет максимально уместно надеть.</p>
+              <p>Если вам все же тяжело выбрать, в чем пойти, всегда уместно отдать предпочтение классике. Ниже представлены примеры оттенков, которые будут максимально уместны.</p>
               <div class="dresscode-colors">
                 <span class="dresscode-chip"><span class="dresscode-dot" style="background:#1c2d5e"></span>Тёмно-синий</span>
                 <span class="dresscode-chip"><span class="dresscode-dot" style="background:#4a4a4a"></span>Графит</span>
@@ -413,45 +415,54 @@
               </div>
             </div>
           </div>
+        </div>
         <div class="faq-item">
           <button class="faq-question" aria-expanded="false">
             Есть ли парковка на месте?
             <span class="faq-arrow">▾</span>
           </button>
           <div class="faq-answer">
+            <div class="faq-answer-inner">
               <p>Да, рядом с местом проведения есть бесплатная парковка. Подробности — на карте.</p>
             </div>
           </div>
+        </div>
         <div class="faq-item">
           <button class="faq-question" aria-expanded="false">
             До какого числа нужно подтвердить участие?
             <span class="faq-arrow">▾</span>
           </button>
           <div class="faq-answer">
+            <div class="faq-answer-inner">
               <p>Пожалуйста, заполните анкету гостя до <strong>20 июля 2026</strong>. Это поможет нам правильно рассадить гостей и подготовить меню.</p>
             </div>
           </div>
+        </div>
         <div class="faq-item">
           <button class="faq-question" aria-expanded="false">
             Дарить деньги - это OK?
             <span class="faq-arrow">▾</span>
           </button>
           <div class="faq-answer">
+            <div class="faq-answer-inner">
               <p>Да, конечно. Мы будем рады любому подарку. Ведь единственный пункт в нашем вишлисте - это отлично проведенный праздник</p>
             </div>
           </div>
+        </div>
         <div class="faq-item">
           <button class="faq-question" aria-expanded="false">
             Уместно ли дарить цветы?
             <span class="faq-arrow">▾</span>
           </button>
           <div class="faq-answer">
+            <div class="faq-answer-inner">
               <p>Мы бы попросили вас воздержаться от дарения цветов.</p>
               <p>Потому что живем мы в небольшой квартире, и складывать такое потенциальное количество цветов нам банально будет некуда.</p>
             </div>
           </div>
         </div>
       </div>
+    </div>
   </section>
 
   <!-- ========== КООРДИНАТОР ========== -->

services/burka_wed/script.js

@@ -599,16 +599,6 @@ window.addEventListener('scroll', () => {
 
 
 // ---- FAQ: аккордеон ----
-function setFaqAnswerHeight(answer, open) {
-  if (open) {
-    answer.classList.add('open');
-    answer.style.maxHeight = answer.scrollHeight + 'px';
-  } else {
-    answer.classList.remove('open');
-    answer.style.maxHeight = '0px';
-  }
-}
-
 document.querySelectorAll('.faq-question').forEach(btn => {
   btn.addEventListener('click', () => {
     const expanded = btn.getAttribute('aria-expanded') === 'true';
@@ -616,21 +606,12 @@ document.querySelectorAll('.faq-question').forEach(btn => {
 
     document.querySelectorAll('.faq-question').forEach(b => {
       b.setAttribute('aria-expanded', 'false');
-      setFaqAnswerHeight(b.nextElementSibling, false);
+      b.nextElementSibling.classList.remove('open');
     });
 
     if (!expanded) {
       btn.setAttribute('aria-expanded', 'true');
-      setFaqAnswerHeight(answer, true);
+      answer.classList.add('open');
-    }
-  });
-});
-
-window.addEventListener('resize', () => {
-  document.querySelectorAll('.faq-question[aria-expanded="true"]').forEach(btn => {
-    const answer = btn.nextElementSibling;
-    if (answer.classList.contains('open')) {
-      answer.style.maxHeight = answer.scrollHeight + 'px';
     }
   });
 });

services/burka_wed/style.css

@@ -970,11 +970,18 @@ ul { list-style: none; }
 }
 .faq-question[aria-expanded="true"] .faq-arrow { transform: rotate(180deg); }
 .faq-answer {
-  max-height: 0;
+  display: grid;
-  overflow: hidden;
+  grid-template-rows: 0fr;
-  transition: max-height 0.35s ease, padding 0.35s ease;
+  transition: grid-template-rows 0.35s ease;
 }
 .faq-answer.open {
+  grid-template-rows: 1fr;
+}
+.faq-answer-inner {
+  overflow: hidden;
+  min-height: 0;
+}
+.faq-answer.open .faq-answer-inner {
   padding: 0 1.5rem 1.2rem;
 }
 .faq-answer p { color: var(--gray); line-height: 1.7; margin: 0 0 0.75rem; }