/* ─── Cookie consent: banner + modal (shared across all pages) ─── */
#cc-banner {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
  background: #1c1c1c; color: #f4f4f4;
  padding: 22px clamp(20px, 4vw, 48px);
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px;
  font-family: 'Inter', -apple-system, sans-serif;
  border-top: 1px solid rgba(244,244,244,0.15);
  transform: translateY(100%);
  transition: transform 0.4s ease;
}
#cc-banner.show { transform: translateY(0); }
#cc-banner .cc-text { font-size: 13.5px; line-height: 1.55; letter-spacing: -0.01em; max-width: 560px; opacity: 0.9; }
#cc-banner .cc-text a { color: #f4f4f4; text-decoration: underline; text-underline-offset: 2px; }
#cc-banner .cc-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.cc-btn {
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 13px 20px; cursor: pointer; border: 1px solid rgba(244,244,244,0.35);
  background: transparent; color: #f4f4f4; transition: opacity 0.2s, background 0.2s;
  white-space: nowrap;
}
.cc-btn:hover { opacity: 0.75; }
.cc-btn.cc-primary { background: #f4f4f4; color: #1c1c1c; border-color: #f4f4f4; }

#cc-modal-overlay {
  position: fixed; inset: 0; z-index: 950;
  background: rgba(28,28,28,0.55);
  display: none; align-items: center; justify-content: center;
  padding: 24px;
}
#cc-modal-overlay.show { display: flex; }
#cc-modal {
  background: #f4f4f4; color: #1c1c1c; width: 100%; max-width: 480px;
  padding: clamp(28px, 4vw, 40px); font-family: 'Inter', -apple-system, sans-serif;
}
#cc-modal h3 {
  font-size: 20px; font-weight: 600; letter-spacing: -0.02em; text-transform: uppercase; margin-bottom: 8px;
}
#cc-modal .cc-modal-sub { font-size: 13px; line-height: 1.5; opacity: 0.6; margin-bottom: 24px; }
.cc-toggle-row {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 16px 0; border-top: 1px solid rgba(28,28,28,0.15);
}
.cc-toggle-row:last-of-type { border-bottom: 1px solid rgba(28,28,28,0.15); }
.cc-toggle-label { font-size: 14px; font-weight: 600; letter-spacing: -0.01em; }
.cc-toggle-desc { font-size: 12px; opacity: 0.55; margin-top: 2px; }
.cc-switch { position: relative; width: 40px; height: 22px; flex-shrink: 0; }
.cc-switch input { opacity: 0; width: 0; height: 0; }
.cc-switch .cc-slider {
  position: absolute; inset: 0; background: rgba(28,28,28,0.2); cursor: pointer; transition: background 0.2s;
}
.cc-switch .cc-slider::before {
  content: ''; position: absolute; width: 16px; height: 16px; left: 3px; top: 3px;
  background: #f4f4f4; transition: transform 0.2s;
}
.cc-switch input:checked + .cc-slider { background: #3d4a7a; }
.cc-switch input:checked + .cc-slider::before { transform: translateX(18px); }
.cc-switch input:disabled + .cc-slider { opacity: 0.6; cursor: not-allowed; }
#cc-modal .cc-save {
  width: 100%; margin-top: 24px; background: #1c1c1c; color: #f4f4f4; border: none;
  font-family: 'Inter', -apple-system, sans-serif; font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 16px; cursor: pointer; transition: opacity 0.2s;
}
#cc-modal .cc-save:hover { opacity: 0.85; }
#cc-modal .cc-close { position: absolute; top: 16px; right: 16px; background: none; border: none; font-size: 22px; cursor: pointer; color: #1c1c1c; }
#cc-modal { position: relative; }

/* footer legal row (below the main footer content) */
.footer-legal-row {
  border-top: 1px solid rgba(244,244,244,0.1);
  margin-top: clamp(24px, 3vw, 36px);
  padding-top: 18px;
  text-align: center;
  font-size: 13px;
  letter-spacing: -0.01em;
  color: rgba(244,244,244,0.6);
}
.footer-legal-row a, .footer-legal-row button.cc-open-settings {
  color: rgba(244,244,244,0.6);
  text-decoration: none;
  background: none; border: none; cursor: pointer;
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 13px; letter-spacing: -0.01em;
  padding: 0; transition: opacity 0.2s;
}
.footer-legal-row a:hover, .footer-legal-row button.cc-open-settings:hover { opacity: 0.75; text-decoration: underline; }
.footer-legal-row .sep { margin: 0 10px; opacity: 0.4; }

@media (max-width: 640px) {
  #cc-banner { flex-direction: column; align-items: stretch; }
  #cc-banner .cc-actions { justify-content: stretch; }
  .cc-btn { flex: 1; }
  .footer-legal-row .sep { display: inline-block; margin: 4px 6px; }
}