/* =============================================================================
   OPP — Cookie consent banner + preference panel (shared, site-wide).
   Loaded by the main site host and by every legal page.
   ========================================================================== */
.occ, .occ *{box-sizing:border-box}
.occ-banner{position:fixed;left:0;right:0;bottom:0;z-index:2147483000;
  background:#12161c;color:#f4f1ea;border-top:3px solid #F57251;
  padding:18px clamp(16px,4vw,34px) calc(18px + env(safe-area-inset-bottom));
  box-shadow:0 -14px 40px -20px rgba(0,0,0,.7);
  transform:translateY(0);transition:transform .3s ease}
.occ-banner[hidden]{display:none}
.occ-banner.out{transform:translateY(110%)}
.occ-in{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between}
.occ-copy{flex:1 1 440px;min-width:280px}
.occ-copy h2{font-family:'Archivo','Segoe UI',system-ui,sans-serif;font-weight:800;font-size:17px;margin:0 0 6px}
.occ-copy p{font-family:'Inter','Segoe UI',system-ui,sans-serif;font-size:13.8px;line-height:1.55;margin:0;color:#cfd3d9}
.occ-copy a{color:#87C5C2;font-weight:600}
.occ-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.occ-btn{font-family:'Archivo','Segoe UI',system-ui,sans-serif;font-weight:800;font-size:14px;
  border:0;border-radius:100px;padding:12px 20px;cursor:pointer;min-height:44px;line-height:1}
.occ-btn.primary{background:#87C5C2;color:#08302e}
.occ-btn.secondary{background:#2b3038;color:#f4f1ea}
.occ-btn.ghost{background:transparent;color:#f4f1ea;border:1.5px solid #4a505a}
.occ-btn:hover{filter:brightness(1.08)}
.occ-btn:focus-visible{outline:3px solid #87C5C2;outline-offset:2px}

/* preference modal */
.occ-overlay{position:fixed;inset:0;z-index:2147483001;background:rgba(6,8,11,.62);
  display:none;align-items:center;justify-content:center;padding:16px;
  padding-bottom:calc(16px + env(safe-area-inset-bottom))}
.occ-overlay.on{display:flex}
.occ-modal{background:#fff;color:#12161c;width:100%;max-width:600px;max-height:88vh;overflow-y:auto;
  -webkit-overflow-scrolling:touch;border-radius:22px;padding:clamp(22px,3vw,34px);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.6)}
.occ-modal h2{font-family:'Archivo','Segoe UI',system-ui,sans-serif;font-weight:900;font-size:clamp(22px,3vw,28px);margin:0 0 6px}
.occ-modal .sub{font-family:'Inter','Segoe UI',system-ui,sans-serif;font-size:14.5px;color:#5c554c;line-height:1.55;margin:0 0 18px}
.occ-modal a{color:#0274BD;font-weight:600}
.occ-cat{border:1px solid #e2ded5;border-radius:14px;padding:16px 18px;margin-bottom:14px}
.occ-cat .top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.occ-cat h3{font-family:'Archivo','Segoe UI',system-ui,sans-serif;font-weight:800;font-size:16px;margin:0}
.occ-cat p{font-family:'Inter','Segoe UI',system-ui,sans-serif;font-size:13.5px;line-height:1.5;color:#4a443c;margin:8px 0 0}
.occ-cat .tag{font-size:11.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:#08302e;background:#87C5C2;padding:3px 9px;border-radius:100px;white-space:nowrap}
/* toggle */
.occ-switch{position:relative;flex:none;width:48px;height:28px}
.occ-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.occ-track{position:absolute;inset:0;background:#cfc9bd;border-radius:100px;transition:background .18s}
.occ-track::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;background:#fff;border-radius:50%;transition:transform .18s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.occ-switch input:checked + .occ-track{background:#0274BD}
.occ-switch input:checked + .occ-track::after{transform:translateX(20px)}
.occ-switch input:disabled + .occ-track{background:#87C5C2;opacity:.9}
.occ-switch input:focus-visible + .occ-track{outline:3px solid #0274BD;outline-offset:2px}
.occ-modal .foot{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.occ-modal .foot .occ-btn.primary{background:#0274BD;color:#fff}
.occ-modal .foot .occ-btn.secondary{background:#eceae3;color:#12161c}
.occ-x{position:absolute;top:14px;right:16px;background:none;border:0;font-size:22px;line-height:1;cursor:pointer;color:#5c554c}
.occ-modal-head{position:relative}
@media(max-width:520px){
  .occ-actions{width:100%}
  .occ-actions .occ-btn{flex:1 1 auto;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  .occ-banner,.occ-track,.occ-track::after{transition:none}
}