/* kemalbrown.com: cookie consent banner + settings (branch kbnote1, DRAFT for legal review; not live).
   Pairs with /assets/js/kbnote.js, which builds the markup. Everything is scoped to .kbc-*.
   Palette from full.css: ink, cream, gold. No orange, no navy, no crest. */
.kbc,.kbc *,.kbc-dlg,.kbc-dlg *{box-sizing:border-box}
.kbc{--k-ink:var(--c-ink,#111);--k-cream:var(--c-cream,#F6EFE2);--k-gold:var(--c-gold,#C9A45C);
  position:fixed;left:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,28px);z-index:80;width:min(372px,calc(100vw - 28px));
  background:var(--k-ink);color:var(--k-cream);font-family:var(--sans,"Inter",Arial,sans-serif);
  padding:20px 20px 16px;border-top:2px solid transparent;box-shadow:0 18px 50px -18px rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.18);
  opacity:0;visibility:hidden}
.kbc[hidden]{display:none}
/* gold rule that draws across the top as the card lands */
.kbc::before{content:"";position:absolute;left:0;top:-2px;height:2px;width:100%;background:var(--k-gold);transform:scaleX(0);transform-origin:0 50%}
.kbc-top{display:flex;align-items:center;gap:12px;margin:0 30px 10px 0}
.kbc-h{margin:0;font-family:var(--display,"Anton",Impact,sans-serif);font-weight:400;font-size:17px;line-height:1.05;letter-spacing:.035em;text-transform:uppercase;color:var(--k-cream)}
.kbc-b{margin:0 0 14px;font-size:13.5px;line-height:1.55;color:rgba(246,239,226,.84)}
.kbc-b strong{font-weight:600;color:var(--k-cream)}
.kbc-gpc{margin:-6px 0 12px;font-size:12px;line-height:1.45;color:var(--k-gold)}
.kbc-row{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:stretch}
.kbc-btn{appearance:none;border:1px solid var(--k-cream);background:var(--k-cream);color:var(--k-ink);font:600 11px/1 var(--sans,"Inter",Arial,sans-serif);letter-spacing:.14em;text-transform:uppercase;padding:12px 10px 11px;cursor:pointer;transition:background .2s,color .2s,transform .2s}
.kbc-btn:hover{background:var(--k-gold);border-color:var(--k-gold)}
.kbc-btn:active{transform:translateY(1px)}
.kbc-btn.is-ghost{background:transparent;color:var(--k-cream);border-color:rgba(246,239,226,.4)}
.kbc-btn.is-ghost:hover{border-color:var(--k-gold);color:var(--k-gold);background:transparent}
.kbc-btn:focus-visible,.kbc-x:focus-visible,.kbc a:focus-visible{outline:2px solid var(--k-gold);outline-offset:3px}
.kbc-fine{margin:12px 0 0;font-size:11.5px;line-height:1.5;color:rgba(246,239,226,.6)}
.kbc-fine a{color:var(--k-cream);text-decoration:underline;text-decoration-color:var(--k-gold);text-underline-offset:3px}
.kbc-fine a:hover{color:var(--k-gold)}
.kbc-x{position:absolute;top:10px;right:10px;width:32px;height:32px;display:grid;place-items:center;border:0;background:transparent;color:rgba(246,239,226,.7);cursor:pointer;font-size:20px;line-height:1}
.kbc-x:hover{color:var(--k-gold)}
.kbc-sr{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* the cookie: idles with a slow wobble, takes bites on Accept, crumbles on Reject */
.kbc-ck{position:relative;flex:0 0 auto;width:38px;height:38px}
.kbc-ck svg{display:block;width:100%;height:100%;overflow:visible}
.kbc-ck .ck-body{transform-origin:50% 50%;animation:kbc-wob 5.5s ease-in-out 1.2s infinite}
.kbc-ck .bite{transform:scale(0);transform-box:fill-box;transform-origin:center;transition:transform .22s cubic-bezier(.3,1.6,.5,1)}
.kbc.is-bite1 .bite.b1{transform:scale(1)}
.kbc.is-bite2 .bite.b2{transform:scale(1)}
.kbc.is-bite3 .bite.b3{transform:scale(1)}
.kbc.is-crumble .ck-body{animation:kbc-crack .5s cubic-bezier(.5,0,.75,0) forwards}
.kbc-crumb{position:absolute;left:50%;top:50%;width:var(--s,4px);height:var(--s,4px);margin:-2px;border-radius:40% 55% 45% 60%;background:var(--k-gold);opacity:0;pointer-events:none}
.kbc-crumb.dk{background:#6b5228}
.kbc.is-crumbs .kbc-crumb{animation:kbc-crumb var(--t,.7s) cubic-bezier(.2,.6,.4,1) var(--dl,0s) forwards}
@keyframes kbc-wob{0%,86%,100%{transform:rotate(0)}89%{transform:rotate(-9deg)}92%{transform:rotate(7deg)}95%{transform:rotate(-3deg)}}
@keyframes kbc-crack{0%{transform:rotate(0) scale(1)}30%{transform:rotate(-8deg) scale(1.04)}55%{transform:rotate(6deg) scale(1)}100%{transform:rotate(18deg) scale(0);opacity:0}}
@keyframes kbc-crumb{0%{opacity:1;transform:translate(0,0) rotate(0)}70%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r))}}

/* settings dialog (opened from Manage or the footer "Cookie settings" link) */
.kbc-dlg{--k-ink:var(--c-ink,#111);--k-cream:var(--c-cream,#F6EFE2);--k-gold:var(--c-gold,#C9A45C);
  width:min(520px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;padding:28px 26px 22px;border:0;border-top:2px solid var(--k-gold);
  background:var(--k-cream);color:var(--k-ink);font-family:var(--sans,"Inter",Arial,sans-serif);box-shadow:0 30px 80px -20px rgba(0,0,0,.5)}
.kbc-dlg::backdrop{background:rgba(17,17,17,.55);backdrop-filter:blur(2px)}
.kbc-dlg[open]{animation:kbc-dlg .45s cubic-bezier(.16,1,.3,1)}
@keyframes kbc-dlg{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.kbc-dlg h2{margin:0 36px 8px 0;font-family:var(--display,"Anton",Impact,sans-serif);font-weight:400;font-size:26px;line-height:1.05;letter-spacing:.02em;text-transform:uppercase}
.kbc-dlg .kbc-intro{margin:0 0 16px;font-size:14px;line-height:1.55;color:var(--c-mute-l,#5a554e)}
.kbc-cat{display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding:14px 0;border-top:1px solid var(--c-line-l,rgba(17,17,17,.16))}
.kbc-cat h3{margin:0;font:600 12px/1.3 var(--sans,"Inter",Arial,sans-serif);letter-spacing:.14em;text-transform:uppercase}
.kbc-cat p{grid-column:1/-1;margin:0;font-size:13px;line-height:1.5;color:var(--c-mute-l,#5a554e)}
.kbc-cat .kbc-on{font:600 10.5px/1 var(--sans,"Inter",Arial,sans-serif);letter-spacing:.14em;text-transform:uppercase;color:#7A5A1E;align-self:center}
.kbc-sw{position:relative;width:46px;height:26px;align-self:center}
.kbc-sw input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:1}
.kbc-sw input:disabled{cursor:not-allowed}
.kbc-sw span{position:absolute;inset:0;border-radius:26px;background:rgba(17,17,17,.2);transition:background .25s}
.kbc-sw span::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .3s cubic-bezier(.3,1.4,.5,1)}
.kbc-sw input:checked+span{background:var(--k-ink)}
.kbc-sw input:checked+span::after{transform:translateX(20px);background:var(--k-gold)}
.kbc-sw input:disabled+span{opacity:.45}
.kbc-sw input:focus-visible+span{outline:2px solid var(--k-gold);outline-offset:3px}
.kbc-dlg .kbc-row{grid-template-columns:1fr 1fr 1fr;margin-top:18px}
.kbc-dlg .kbc-btn{background:var(--k-ink);color:var(--k-cream);border-color:var(--k-ink)}
.kbc-dlg .kbc-btn:hover{background:var(--k-gold);border-color:var(--k-gold);color:var(--k-ink)}
.kbc-dlg .kbc-btn.is-ghost{background:transparent;color:var(--k-ink);border-color:rgba(17,17,17,.4)}
.kbc-dlg .kbc-x{color:var(--k-ink);top:14px;right:14px}
.kbc-dlg .kbc-fine{color:var(--c-mute-l,#5a554e)}
.kbc-dlg .kbc-fine a{color:var(--k-ink)}

/* mobile: a bottom sheet */
@media (max-width:640px){
  .kbc{left:0;right:0;bottom:0;width:100%;padding:18px 18px calc(14px + env(safe-area-inset-bottom))}
  .kbc-row{grid-template-columns:1fr 1fr}
  .kbc-row .kbc-btn.is-ghost{grid-column:1/-1}
  .kbc-dlg{width:100vw;max-width:100vw;max-height:88vh;margin:auto 0 0;padding:24px 18px calc(18px + env(safe-area-inset-bottom))}
  .kbc-dlg .kbc-row{grid-template-columns:1fr 1fr}
  .kbc-dlg .kbc-row .kbc-btn:first-child{grid-column:1/-1}
}
@media print{.kbc{display:none!important}}

/* desktop + tablet: a wide, short bar floating along the bottom ("longer, not taller") */
.kbc-mid{min-width:0}
.kbc-mid .kbc-fine{margin-top:6px}
@media (min-width:641px){
  .kbc{left:0;right:0;margin:0 auto;bottom:clamp(12px,1.6vw,22px);width:min(90vw,1100px);
    display:grid;grid-template-columns:minmax(140px,172px) minmax(0,1fr) auto;align-items:center;column-gap:clamp(16px,2vw,26px);
    padding:14px 52px 14px 22px}
  .kbc-top{margin:0;gap:12px}
  .kbc-h{font-size:16px;line-height:1.08}
  .kbc-b{margin:0;font-size:13px;line-height:1.5}
  .kbc-gpc{margin:4px 0 0}
  .kbc-mid .kbc-fine{margin:5px 0 0;font-size:10.5px;line-height:1.4}
  .kbc>.kbc-row{grid-template-columns:auto auto auto;gap:8px}
  .kbc>.kbc-row .kbc-btn{padding:12px 16px 11px;white-space:nowrap}
  .kbc-x{top:50%;right:10px;margin-top:-16px}
}
/* tablet: headline + buttons on one line, the copy runs full width under them */
@media (min-width:641px) and (max-width:1023px){
  .kbc{grid-template-columns:minmax(0,1fr) auto;row-gap:8px;padding:12px 48px 12px 18px}
  .kbc-top{grid-column:1;grid-row:1}
  .kbc-row{grid-column:2;grid-row:1}
  .kbc-mid{grid-column:1/-1;grid-row:2}
  .kbc-x{top:10px;margin-top:0}
  .kbc-h br{display:none}
}
/* mobile sheet: as short as it can be */
@media (max-width:640px){
  .kbc{padding:14px 16px calc(12px + env(safe-area-inset-bottom))}
  .kbc-top{margin:0 30px 8px 0;gap:10px}
  .kbc-ck{width:30px;height:30px}
  .kbc-h{font-size:15px}
  .kbc-b{margin:0;font-size:13px;line-height:1.45}
  .kbc-mid{margin-bottom:10px}
  .kbc-mid .kbc-fine{margin-top:6px;font-size:11px;line-height:1.4}
  .kbc>.kbc-row{grid-template-columns:1fr 1fr auto;gap:6px}
  .kbc>.kbc-row .kbc-btn.is-ghost{grid-column:auto}
  .kbc>.kbc-row .kbc-btn{padding:11px 8px 10px;font-size:10.5px;letter-spacing:.1em}
}

/* ---- MOTION ---------------------------------------------------------------------------------------------
   Entrance: the bar springs up with a slight 3D tilt and a small overshoot, the gold rule draws across, the
   cookie rolls in from the left and settles with a bounce, the headline reveals word by word, then the copy and
   the buttons stagger in. Exit: bites (Accept) or crumble (Reject), then the bar tips away. Reduced motion: fade. */
.kbc{transform-origin:50% 100%}
.kbc.is-in{visibility:visible;opacity:1;animation:kbc-spring 1s cubic-bezier(.25,.8,.35,1) both}
.kbc.is-in.is-out{animation:kbc-drop .6s cubic-bezier(.7,0,.84,0) .5s both}
@keyframes kbc-spring{
  0%{opacity:0;transform:perspective(1000px) translate3d(0,115%,0) rotateX(32deg) scale(.96)}
  40%{opacity:1}
  62%{transform:perspective(1000px) translate3d(0,-9px,0) rotateX(-5deg) scale(1.006)}
  80%{transform:perspective(1000px) translate3d(0,3px,0) rotateX(1.5deg)}
  100%{opacity:1;transform:none}}
@keyframes kbc-drop{0%{opacity:1;transform:none}100%{opacity:0;transform:perspective(1000px) translate3d(0,120%,0) rotateX(18deg)}}
.kbc.is-in::before{animation:kbc-rule .9s cubic-bezier(.65,0,.35,1) .3s both}
@keyframes kbc-rule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.kbc-ck{opacity:0}
.kbc.is-in .kbc-ck{animation:kbc-roll .95s cubic-bezier(.3,.7,.3,1) .28s both}
@keyframes kbc-roll{
  0%{opacity:0;transform:translate3d(-72px,0,0) rotate(-330deg)}
  52%{opacity:1;transform:translate3d(5px,0,0) rotate(14deg)}
  68%{transform:translate3d(0,-7px,0) rotate(4deg)}
  81%{transform:translate3d(-1px,0,0) rotate(-3deg)}
  91%{transform:translate3d(0,-2px,0) rotate(1deg)}
  100%{opacity:1;transform:none}}
.kbc-h{overflow:hidden;padding:1px 0}
.kbc-w{display:inline-block;opacity:0;transform-origin:0 100%}
.kbc.is-in .kbc-w{animation:kbc-word .55s cubic-bezier(.2,.9,.25,1.12) calc(.45s + var(--i,0) * .09s) both}
@keyframes kbc-word{from{opacity:0;transform:translate3d(0,105%,0) rotate(5deg)}to{opacity:1;transform:none}}
.kbc-mid{opacity:0}
.kbc.is-in .kbc-mid{animation:kbc-up .6s cubic-bezier(.16,1,.3,1) .66s both}
@keyframes kbc-up{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
.kbc>.kbc-row .kbc-btn,.kbc>.kbc-x{opacity:0}
.kbc.is-in>.kbc-row .kbc-btn{animation:kbc-pop .5s cubic-bezier(.3,1.45,.5,1) .76s both}
.kbc.is-in>.kbc-row .kbc-btn:nth-child(2){animation-delay:.84s}
.kbc.is-in>.kbc-row .kbc-btn:nth-child(3){animation-delay:.92s}
.kbc.is-in>.kbc-x{animation:kbc-up .4s ease 1s both}
@keyframes kbc-pop{from{opacity:0;transform:translate3d(0,14px,0) scale(.88)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .kbc.is-in,.kbc.is-in.is-out,.kbc.is-in::before,.kbc.is-in .kbc-ck,.kbc.is-in .kbc-w,.kbc.is-in .kbc-mid,
  .kbc.is-in>.kbc-row .kbc-btn,.kbc.is-in>.kbc-x,.kbc-ck .ck-body,.kbc.is-crumble .ck-body,.kbc.is-crumbs .kbc-crumb,.kbc-dlg[open]{animation:none!important}
  .kbc{transition:opacity .25s linear,visibility 0s linear .25s}
  .kbc.is-in{transition-delay:0s}
  .kbc::before{transform:scaleX(1)}
  .kbc-ck,.kbc-w,.kbc-mid,.kbc>.kbc-row .kbc-btn,.kbc>.kbc-x{opacity:1!important;transform:none!important}
  .kbc-ck .bite{transition:none}
}