:root {
    --yk-primary: #C26431;
    --yk-bg: #F6E7D7;
    --yk-text: #2A1B12;
    --yk-border: rgba(194,100,49,.25);
    --yk-shadow: 0 10px 30px rgba(0,0,0,.06);
    --yk-radius: 14px;
  }

  .yk-faq {
    background: var(--yk-bg);
    padding: 60px 20px;
    color: var(--yk-text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  }

  .yk-faq__inner {
    max-width: 980px;
    margin: 0 auto;
  }

  .yk-faq__header {
    margin-bottom: 30px;
  }

  .yk-faq__title {
    margin: 0 0 12px 0;
    font-size: 32px;
    line-height: 1.2;
    color: var(--yk-primary);
    letter-spacing: .2px;
  }

  .yk-faq__subtitle {
    margin: 0;
    font-size: 18px;
    line-height: 1.6;
    opacity: .9;
  }

  /* Switched to block layout to enforce explicit bottom margins */
  .yk-faq__list {
    display: block; 
  }

  .yk-faq__item {
    border: 1px solid var(--yk-border);
    background: #fff;
    border-radius: var(--yk-radius);
    box-shadow: var(--yk-shadow);
    overflow: hidden;
    transition: box-shadow 0.3s ease, border-color 0.3s ease;
    /* Explicitly adding strong space between collapsed items */
    margin-bottom: 24px; 
  }
  
  /* Remove margin from the very last item so it doesn't push the section boundary out */
  .yk-faq__item:last-child {
    margin-bottom: 0;
  }
  
  .yk-faq__item:hover {
    border-color: rgba(194,100,49,.5);
  }

  .yk-faq__q {
    list-style: none;
    cursor: pointer;
    padding: 20px 24px;
    font-size: 18px;
    font-weight: 700;
    color: var(--yk-text);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
  }

  .yk-faq__q::-webkit-details-marker {
    display: none;
  }

  /* Minimalist Icon styling - Removed borders & border-radius */
  .yk-faq__icon {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    position: relative;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  }
  
  .yk-faq__icon:before,
  .yk-faq__icon:after {
    content: "";
    position: absolute;
    background: var(--yk-primary);
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 2px;
    transition: all 0.3s ease; 
  }
  
  /* Slightly thickened the lines (from 2px to 3px) so they stand out without the circle */
  .yk-faq__icon:before {
    width: 14px;
    height: 3px;
  }
  
  .yk-faq__icon:after {
    width: 3px;
    height: 14px;
  }

  .yk-faq__item[open] .yk-faq__icon {
    transform: rotate(90deg); 
  }

  .yk-faq__item[open] .yk-faq__icon:after {
    opacity: 0;
    height: 0px;
  }
  
  .yk-faq__a-wrapper {
    display: block;
    height: 0; 
    overflow: hidden; 
    opacity: 0; 
    transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease, visibility 0.4s;
    visibility: hidden; 
  }

  .yk-faq__item.is-open .yk-faq__a-wrapper {
    visibility: visible;
    opacity: 1;
  }

  .yk-faq__a {
    padding: 0 24px 24px 24px;
    font-size: 16px;
    line-height: 1.8;
    color: rgba(42,27,18,.92);
  }

  .yk-faq__item .yk-faq__q {
    transition: background 0.3s ease, border-bottom 0.3s ease;
  }

  .yk-faq__item[open] .yk-faq__q {
    background: linear-gradient(0deg, rgba(246,231,215,.6), rgba(246,231,215,.6));
    border-bottom: 1px solid var(--yk-border);
    margin-bottom: 10px; 
  }

  @media (max-width: 640px) {
    .yk-faq { padding: 40px 16px; }
    .yk-faq__title { font-size: 26px; }
    .yk-faq__q { padding: 16px 20px; font-size: 16px; }
    .yk-faq__item { margin-bottom: 16px; } /* Slightly smaller gap on mobile */
    .yk-faq__a { padding: 0 20px 20px 20px; font-size: 15px; }
  }