/* ==========================================================================
   PINEWORKS · COOKIE CONSENT — overlay/slide-up UX layer on top of
   Finsweet Cookie Consent (@finsweet/cookie-consent, opt-in mode).
   Paired with /assets/cookie-consent.js. Loaded on every page after the
   Finsweet library's own [fs-cc] markup.

   Visibility is driven entirely by JS toggling .cc-show / .cc-visible —
   this file never touches `display`, so it can't fight the library's own
   display/attribute toggling on the [fs-cc="banner"] element.
   Motion policy: only opacity/transform are transitioned, matching the
   site-wide rule in ground.css. Nothing here reserves layout space, so
   there is no layout shift when the banner appears.
   ========================================================================== */

.cc-overlay{
  position:fixed;inset:0;z-index:199;
  background:rgba(0,0,0,.5);
  opacity:0;pointer-events:none;
  transition:opacity .4s ease;
}
.cc-overlay.cc-show{opacity:1;pointer-events:auto}

[fs-cc="banner"].cookie-banner{
  position:fixed;left:20px;right:20px;bottom:20px;z-index:200;
  max-width:520px;margin:0 auto;
  background:rgba(20,21,24,.86);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(242,240,235,.14);border-radius:12px;
  padding:20px 22px;display:flex;flex-direction:column;gap:16px;
  box-shadow:0 16px 48px rgba(0,0,0,.45);
  font-family:'Hanken Grotesk',sans-serif;
  opacity:0;transform:translateY(calc(100% + 40px));
  pointer-events:none;
  transition:opacity .45s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1);
}
[fs-cc="banner"].cookie-banner.cc-visible{
  opacity:1;transform:translateY(0);
  pointer-events:auto;
}

.cookie-banner p{font-weight:300;font-size:13px;line-height:1.6;color:#c9ccd0;margin:0}
.cookie-banner p a{color:#f16852;text-decoration:underline}

.cookie-banner-actions{display:flex;gap:10px}
.cookie-banner-actions button{
  flex:1;min-height:44px;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.15em;text-transform:uppercase;
  padding:13px 20px;border-radius:2px;cursor:pointer;font-weight:500;
  background:rgba(242,240,235,.07);color:#f2f0eb;
  border:1px solid rgba(242,240,235,.28);
  transition:border-color .3s ease,color .3s ease,background .3s ease;
}
.cookie-banner-actions button:focus-visible{
  border-color:#f16852;color:#f16852;background:rgba(241,104,82,.08);
}
/* hover:hover excludes touchscreens - without this gate, iOS Safari
   treats a tap on a :hover-styled element as "enter hover" and needs a
   second tap to actually fire the click, which is exactly the double-tap
   Accept/Reject required on mobile. */
@media(hover:hover){
  .cookie-banner-actions button:hover{
    border-color:#f16852;color:#f16852;background:rgba(241,104,82,.08);
  }
}

@media(max-width:560px){
  [fs-cc="banner"].cookie-banner{left:12px;right:12px;bottom:12px;padding:18px}
}

@media(prefers-reduced-motion:reduce){
  .cc-overlay,
  [fs-cc="banner"].cookie-banner{transition:opacity .25s linear !important;transform:none !important}
}
