/* ============================================================================
   Ginkgo Events — CMS display-variant components (ADDITIVE).
   These styles are only ever applied to opt-in `.gk-*` classes that appear when
   an editor flips a display toggle (carousel / accordion). The core design
   system in ginkgo.css is never modified.
   ========================================================================== */

/* ---- Carousel (clients + testimonials, spec §6b) -------------------------- */
.gk-carousel{
  display:flex;
  flex-wrap:nowrap;
  gap:clamp(1rem,3vw,1.3rem);
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-padding-inline:2px;
  -webkit-overflow-scrolling:touch;
  padding-bottom:.7rem;
  scrollbar-width:thin;
  scrollbar-color:var(--blue) var(--paper-2);
}
.gk-carousel::-webkit-scrollbar{height:8px;}
.gk-carousel::-webkit-scrollbar-track{background:var(--paper-2);border-radius:99px;}
.gk-carousel::-webkit-scrollbar-thumb{background:var(--blue);border-radius:99px;}
.gk-carousel > *{scroll-snap-align:start;}
.gk-carousel:focus-visible{outline:3px solid var(--blue);outline-offset:6px;border-radius:6px;}
/* testimonial cards get a fixed, snappable width; client logos stay natural */
.quotes.gk-carousel > .quote{flex:0 0 clamp(280px,82%,400px);}
.trustbar__logos.gk-carousel > span{flex:0 0 auto;}

/* Optional JS-injected nav arrows */
.gk-carousel-wrap{position:relative;}
.gk-carousel__nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:42px;height:42px;border-radius:50%;border:1px solid var(--line);
  background:#fff;color:var(--ink);display:grid;place-items:center;cursor:pointer;
  box-shadow:var(--shadow-sm);z-index:2;
}
.gk-carousel__nav:hover{border-color:var(--blue);color:var(--blue);}
.gk-carousel__nav[disabled]{opacity:.35;cursor:default;}
.gk-carousel__nav--prev{left:-6px;}
.gk-carousel__nav--next{right:-6px;}
.gk-carousel__nav svg{width:20px;height:20px;}

/* ---- Accordion (FAQ, spec §6b) -------------------------------------------- */
.gk-accordion{display:flex;flex-direction:column;gap:.8rem;}
.gk-accordion__item{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);
  box-shadow:var(--shadow-sm);overflow:hidden;
}
.gk-accordion__q{
  cursor:pointer;list-style:none;display:flex;justify-content:space-between;
  align-items:center;gap:1rem;padding:1.15rem 1.35rem;font-weight:700;
  color:var(--ink);font-size:1.08rem;
}
.gk-accordion__q::-webkit-details-marker{display:none;}
.gk-accordion__q:focus-visible{outline:3px solid var(--blue);outline-offset:-3px;}
.gk-accordion__chev{width:22px;height:22px;flex:0 0 auto;color:var(--blue);transition:transform .25s ease;}
.gk-accordion__item[open] .gk-accordion__chev{transform:rotate(180deg);}
.gk-accordion__a{padding:0 1.35rem 1.25rem;color:var(--ink-soft);}
.gk-accordion__a > :first-child{margin-top:0;}
.gk-accordion__a > :last-child{margin-bottom:0;}

@media (prefers-reduced-motion:reduce){
  .gk-accordion__chev{transition:none;}
  .gk-carousel{scroll-behavior:auto;}
}
