/* Sticky consultation bar — the Studio renders the markup and variables; this
   file only handles the compact/expanded states shared by Studio and snapshots. */
[data-sticky-cta][data-sticky-expand="1"] {
  --sticky-motion: 300ms;
  --sticky-ease: cubic-bezier(0.22, 1, 0.36, 1);
  width:fit-content;
  color:#fff;
  transition: width var(--sticky-motion) var(--sticky-ease), border-radius var(--sticky-motion) var(--sticky-ease), padding var(--sticky-motion) var(--sticky-ease);
  will-change: width, border-radius;
}
[data-sticky-cta][data-sticky-expand="1"][data-sticky-state="compact"] { width:var(--sticky-compact-width, fit-content); }
[data-sticky-cta] [data-sticky-intro] {
  display:grid;
  grid-template-rows:0fr;
  visibility:hidden;
  opacity:0;
  transform:translateY(8px);
  pointer-events:none;
  transition:grid-template-rows var(--sticky-motion) var(--sticky-ease), opacity 150ms ease, transform var(--sticky-motion) var(--sticky-ease), margin var(--sticky-motion) var(--sticky-ease), visibility 0s linear;
}
[data-sticky-cta][data-sticky-state="compact"] [data-sticky-intro] { contain:size; }
[data-sticky-cta] [data-sticky-intro-inner] { min-height:0; overflow:hidden; display:grid; grid-template-columns:calc(var(--sticky-image-width, var(--sticky-image-size, 76px)) + 2 * var(--sticky-image-padding, 0px)) minmax(0,1fr); gap:var(--sticky-intro-gap, 12px); align-items:center; }
[data-sticky-cta] [data-sticky-intro][data-sticky-image-on="0"] [data-sticky-intro-inner] { grid-template-columns:minmax(0,1fr); }
[data-sticky-cta][data-sticky-state="expanded"] [data-sticky-intro] {
  contain:none;
  grid-template-rows:1fr;
  visibility:visible;
  margin-bottom:var(--sticky-intro-bottom, 10px);
  opacity:1;
  overflow:visible;
  transform:none;
  pointer-events:auto;
  /* Reveal copy only after the expanding row has reached its final height.  On
     the way back to compact the base rule has no delay, so the copy disappears
     before the row starts collapsing. */
  transition-delay:0s, var(--sticky-motion), 0s, 0s, var(--sticky-motion);
}
[data-sticky-cta] [data-sticky-image-wrap] { padding:var(--sticky-image-padding, 0px); }
[data-sticky-cta] [data-sticky-image] {
  display:block;
  width:var(--sticky-image-width, var(--sticky-image-size, 76px));
  height:var(--sticky-image-size, 76px);
  /* Without an image override, its radius follows the opening card. */
  border-radius:var(--sticky-image-radius, var(--sticky-expanded-radius, 24px));
  object-fit:cover;
  object-position:center;
}
[data-sticky-cta] [data-sticky-intro-copy] { min-width:0; }
[data-sticky-cta] [data-sticky-title] { font-size:var(--sticky-title-size, 16px); line-height:1.22; font-weight:700; color:var(--sticky-intro-ink, #fff); overflow-wrap:anywhere; }
[data-sticky-cta] [data-sticky-actions] { display:flex; align-items:stretch; gap:var(--sticky-action-gap, 6px); transition:gap var(--sticky-motion) var(--sticky-ease); }
/* Equal buttons sized by the WIDER label: in a shrink-to-fit bar `flex:1 1 0`
   splits the summed label widths in half, so the longer label wraps. Equal grid
   tracks resolve to the widest button instead — both match, neither wraps.
   A button with an explicit width knob (`0 1 <px>` flex basis) keeps the flex path. */
[data-sticky-cta] [data-sticky-actions]:not(:has(> [style*="--sticky-button-flex:0 1"])) { display:grid !important; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); }
[data-sticky-cta][data-sticky-expand="1"][data-sticky-state="expanded"] { border-radius:var(--sticky-expanded-radius, 24px) !important; padding:var(--sticky-expanded-padding, 6px) !important; }
[data-sticky-cta][data-sticky-state="expanded"] [data-sticky-actions] { width:100%; }
/* Açık kart metin taşır: zemin içerik üstünde okunur kalmalı (renderer en az %90 opak --sticky-bg-expanded basar). */
[data-sticky-cta][data-sticky-state="expanded"] { --sticky-bg-current:var(--sticky-bg-expanded, var(--sticky-bg)); }
[data-sticky-cta][data-sticky-expand="1"][data-sticky-state="expanded"] { width:min(var(--sticky-max-width, 760px), 100%); }
[data-sticky-cta][data-sticky-state="expanded"] [data-sticky-actions] > * { --sticky-button-state-min-height:max(44px, var(--sticky-button-min-height, 0px)); --sticky-button-current-radius:var(--sticky-button-expanded-radius, var(--sticky-button-radius)); }
/* Image-only intro (title off): the image sits alone, centred. */
[data-sticky-cta] [data-sticky-intro][data-sticky-title-on="0"] [data-sticky-intro-inner] { grid-template-columns:minmax(0,1fr); justify-items:center; }
/* Bare opening state (image + title both off): just two LARGER buttons before the
   first scroll; the compact state is untouched, so they shrink back on scroll. */
[data-sticky-cta][data-sticky-bare="1"][data-sticky-state="expanded"] [data-sticky-actions] > * { --sticky-button-state-min-height:max(60px, var(--sticky-button-min-height, 0px)); font-size:var(--sticky-bare-font, 1.0625rem) !important; transition:min-height var(--sticky-motion) var(--sticky-ease), font-size var(--sticky-motion) var(--sticky-ease); }
[data-sticky-cta][data-sticky-bare="1"][data-sticky-state="expanded"] [data-sticky-actions] > * > i { font-size:1.375rem !important; }

@media (max-width: 520px) {
  [data-sticky-cta][data-sticky-state="expanded"] [data-sticky-actions] { flex-wrap:wrap; }
}

@media (prefers-reduced-motion: reduce) {
  [data-sticky-cta],
  [data-sticky-cta] [data-sticky-intro],
  [data-sticky-cta] [data-sticky-actions] { transition:none !important; }
}
