/* =====================================================================
   Spottune Colombia · consent banner (Consent Mode v2)
   Markup: src/partials/consent.html · Logic: /assets/js/consent.js
   Client decision (round 5): a discreet strip along the bottom edge — it must not get in the way of
   someone who neither accepts nor declines. Full width, one line of copy, small buttons, no dimming.
   z-index --z-consent (54, tokens.css): above content, below the FAB (56), the drawer (59), the header (60).
   The strip stops short of the FAB column on the right so the two never overlap.
   ===================================================================== */
.st-consent{
  position:fixed;left:0;right:0;bottom:0;z-index:var(--z-consent,54);
  opacity:0;transform:translateY(100%);pointer-events:none;
  transition:opacity .35s var(--ease),transform .35s var(--ease);
  will-change:opacity,transform;
}
.st-consent[hidden]{display:none}
.st-consent.is-open{opacity:1;transform:none}
.st-consent-card{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 24px;
  padding:12px var(--gutter);
  padding-right:calc(var(--gutter) + 96px);   /* clear of the WhatsApp FAB */
  background:var(--st-white-a86);color:var(--st-black);
  -webkit-backdrop-filter:saturate(160%) blur(14px);backdrop-filter:saturate(160%) blur(14px);
  border-top:1px solid var(--st-line);
  pointer-events:none;
}
.st-consent.is-open .st-consent-card{pointer-events:auto}
.st-consent-copy{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 10px;min-width:0;flex:1 1 380px}
.st-consent-title{
  margin:0;font-size:var(--fs-caption);font-weight:var(--w-medium);line-height:1.4;
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--st-black);white-space:nowrap;
}
.st-consent-text{
  margin:0;font-size:var(--fs-caption);font-weight:var(--w-light);line-height:1.5;color:var(--st-gray-text);
}
.st-consent-actions{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;flex:none}
.st-consent-actions .btn{flex:0 0 auto;height:34px;padding:0 16px;font-size:13px;white-space:nowrap}
.st-consent-actions .btn-secondary{background:transparent}
.st-consent-link{
  font-size:var(--fs-caption);font-weight:var(--w-regular);color:var(--st-gray-text);text-decoration:none;
}
.st-consent-link:hover{color:var(--st-black);text-decoration:underline}
.st-consent :focus-visible{outline:2px solid var(--st-teal);outline-offset:3px}

@media (pointer:coarse){.st-consent-actions .btn{height:40px}}

@media (max-width:900px){
  .st-consent-card{padding-right:calc(var(--gutter) + 88px)}
}
@media (max-width:600px){
  .st-consent-card{
    flex-direction:column;align-items:flex-start;gap:10px;
    padding:12px var(--gutter) 14px;padding-right:var(--gutter);
  }
  .st-consent-copy{flex:1 1 auto}
  .st-consent-title{display:none}                    /* the sentence already says what this is */
  .st-consent-actions{width:100%;padding-right:72px} /* clear of the FAB */
  .st-consent-actions .btn{flex:1 1 auto}
  .st-consent-link{flex:1 1 100%}
}

@media (prefers-reduced-motion:reduce){
  .st-consent{transition:none;transform:none}
}
@media print{.st-consent{display:none!important}}