/* HAYYAK FAQ – clean premium layout */
[section="faq"] {
  display: grid;
  gap: 14px;
}

[section="faq"] .section-core {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: 18px;
  align-items: stretch;
  background: #FFFFFF;
  border: 1px solid #E5E0D8;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(42, 50, 46, 0.06);
}

[section="faq"] .section-core .media {
  position: relative;
  min-height: 320px;
  height: 100%;
  overflow: hidden;
  background: #F0EFEC;
}

[section="faq"] .section-core .media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

[section="faq"] .section-core .content {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 22px 20px 20px;
  background: #FFFFFF;
}

[section="faq"] .section-core .content .head {
  display: grid;
  gap: 8px;
  padding: 0;
  background: transparent;
  border: none;
}

[section="faq"] .section-core .content .head .title {
  margin: 0;
  color: #2A322E;
  font-weight: 800;
  font-size: clamp(18px, 2.2vw, 22px);
  line-height: 1.35;
}

[section="faq"] .section-core .content .head .description {
  margin: 0;
  color: #5A5248;
  font-size: 13.5px;
  line-height: 1.7;
  opacity: 1;
}

[section="faq"] .section-core .content .core {
  display: grid;
  gap: 10px;
}

/* Accordion items – soft, clear, parallel */
[section="faq"] [ui-accordion] {
  gap: 10px !important;
}

[section="faq"] [ui-accordion-item] {
  margin: 0 !important;
  border: none !important;
  background: transparent !important;
}

[section="faq"] [ui-accordion-item] > label {
  background: #F7F7F5 !important;
  border: 1px solid #E8E4DC !important;
  border-radius: 12px !important;
  padding: 14px 16px !important;
  box-shadow: none !important;
  transition: background 180ms ease, border-color 180ms ease !important;
}

[section="faq"] [ui-accordion-item] > label:hover {
  background: #F0EFEC !important;
  border-color: #D9D2C6 !important;
}

[section="faq"] [ui-accordion-item] [ui-accordion-trigger] {
  color: #2A322E !important;
  font-weight: 700 !important;
  font-size: 14px !important;
}

[section="faq"] [ui-accordion-item] [ui-icon] {
  color: #C79442 !important;
  flex-shrink: 0 !important;
}

[section="faq"] [ui-accordion-item] [ui-accordion-portal],
[section="faq"] [ui-accordion-item] [ui-accordion-content] {
  color: #5A5248 !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
}

@media (max-width: 769px) {
  [section="faq"] .section-core {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  [section="faq"] .section-core .media {
    order: 1 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 4 / 5 !important;
  }
  [section="faq"] .section-core .content {
    order: 2 !important;
    padding: 18px 14px 16px !important;
    gap: 12px !important;
  }
  [section="faq"] .section-core .content .head .title {
    font-size: 17px !important;
  }
  [section="faq"] [ui-accordion-item] > label {
    padding: 13px 14px !important;
  }
}