/* ---------- cookie consent ----------
   Banner on first visit, a side panel for the per-category choice, and a small persistent button bottom-left.
   Accept and reject carry the same visual weight on purpose. */
.cookie-banner{position:fixed;z-index:45;left:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);width:min(27rem,calc(100vw - 32px));
  padding:1.25rem 1.25rem 1.1rem;background:#fff;color:var(--l-ink);border:1px solid var(--hair-l);border-radius:14px;
  box-shadow:0 14px 34px -20px rgba(2,26,63,.45);font-size:.95rem;line-height:1.55;color-scheme:light}
.cookie-banner h2{margin:0 0 .45rem;font:650 1.05rem/1.25 var(--f-display);font-stretch:104%;color:var(--l-ink)}
.cookie-banner p{margin:0;color:#3B485C}
.cookie-banner a,.cookie-prefs a{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.cookie-actions{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:1rem}
.cookie-actions .btn{justify-content:center;min-height:44px;padding:0 1em;font-size:.92rem;white-space:normal;text-align:center;line-height:1.15}
.cookie-actions .cookie-more{grid-column:1/-1}
.cookie-banner :focus-visible,.cookie-prefs :focus-visible{outline-color:var(--navy)}

/* preferences: native modal dialog, slides in from the right on wide screens, full screen on phones */
.cookie-prefs{position:fixed;inset:0 0 0 auto;margin:0;width:min(31rem,100vw);max-width:100vw;height:100%;max-height:100%;padding:0;border:0;
  background:#fff;color:var(--l-ink);box-shadow:-18px 0 40px -28px rgba(2,26,63,.55);color-scheme:light}
.cookie-prefs::backdrop{background:rgba(1,10,28,.5)}
.cookie-prefs[open]{display:flex;flex-direction:column}
@media (prefers-reduced-motion:no-preference){
  .cookie-prefs[open]{animation:prefsIn .24s cubic-bezier(.3,.7,.2,1)}
  .cookie-prefs[open]::backdrop{animation:fadeBg .24s ease}
}
@keyframes prefsIn{from{transform:translateX(24px);opacity:0}}
@keyframes fadeBg{from{opacity:0}}
.prefs-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem 1rem 1.5rem;border-bottom:1px solid var(--hair-l)}
.prefs-head h2{margin:0;font:650 1.25rem/1.2 var(--f-display);font-stretch:104%}
.prefs-close{display:grid;place-items:center;width:44px;height:44px;margin-right:-6px;border:0;border-radius:10px;background:none;color:var(--l-ink);cursor:pointer}
.prefs-close:hover{background:var(--mineral)}
.prefs-close svg{width:22px;height:22px}
.prefs-body{flex:1;overflow-y:auto;padding:1.25rem 1.5rem 1.5rem;overscroll-behavior:contain}
.prefs-intro{margin:0 0 1.25rem;color:#3B485C;line-height:1.6}
.prefs-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair-l)}
.pref{padding:1.1rem 0;border-bottom:1px solid var(--hair-l)}
.pref-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.pref-title{margin:0;font:600 1.02rem/1.3 var(--f-display);font-stretch:102%}
.pref p{margin:.45rem 0 0;color:#3B485C;font-size:.93rem;line-height:1.55}
.pref .pref-use{color:var(--graphite);font-size:.86rem}

/* switch: a real checkbox with role="switch", plus a visible state word so the state never relies on colour */
.switch{display:inline-flex;align-items:center;gap:.6rem;flex:none;cursor:pointer;min-height:44px}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.switch-track{position:relative;width:46px;height:26px;border-radius:999px;background:#C9D1DC;transition:background-color .18s}
.switch-track::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(2,26,63,.3);transition:transform .18s}
.switch input:checked+.switch-track{background:var(--navy)}
.switch input:checked+.switch-track::after{transform:translateX(20px)}
.switch input:focus-visible+.switch-track{outline:2px solid var(--navy);outline-offset:3px}
.switch input:disabled+.switch-track{background:#7D8AA0}
.switch-state{min-width:5.2em;font-size:.86rem;color:var(--graphite)}
.switch input:disabled~.switch-state{color:var(--l-ink)}
@media (prefers-reduced-motion:reduce){.switch-track,.switch-track::after{transition:none}}

.prefs-foot{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;padding:1rem 1.5rem calc(env(safe-area-inset-bottom,0px) + 1rem);border-top:1px solid var(--hair-l);background:#fff}
.prefs-foot .btn{justify-content:center;min-height:44px;padding:0 1em;font-size:.92rem;white-space:normal;text-align:center;line-height:1.15}
.prefs-foot .prefs-save{grid-column:1/-1}

/* persistent settings button */
.cookie-fab{position:fixed;z-index:25;left:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);display:inline-flex;align-items:center;gap:.5rem;
  min-height:40px;padding:0 .95rem 0 .8rem;border:1px solid rgba(232,236,241,.22);border-radius:999px;background:var(--navy-2);color:var(--frost);
  font:500 .86rem/1 var(--f-body);box-shadow:0 6px 18px -12px rgba(1,10,28,.6);cursor:pointer;transition:border-color .2s,background-color .2s}
.cookie-fab:hover{border-color:rgba(232,236,241,.5);background:#1a3560}
.cookie-fab svg{width:18px;height:18px;flex:none;color:var(--gold)}
html.sc-boot .cookie-fab,html.sc-boot .cookie-banner{visibility:hidden}

/* phones on the homepage: a compact round button bottom left (the WhatsApp button sits bottom right),
   and the banner sits just above both */
@media (max-width:819px){
  .page-home .cookie-fab{bottom:calc(env(safe-area-inset-bottom,0px) + 14px);left:var(--gut-l);width:44px;height:44px;min-height:44px;padding:0;justify-content:center;z-index:21}
  .page-home .cookie-fab span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .page-home .cookie-banner{bottom:calc(env(safe-area-inset-bottom,0px) + 80px)}
  .cookie-banner{left:12px;width:calc(100vw - 24px);padding:1rem 1rem .9rem}
  .cookie-prefs{width:100vw}
}
@media print{.cookie-banner,.cookie-fab,.cookie-prefs{display:none!important}}
