:root { --navy:#0C1E33; --citrine:#F4C430; --off:#F9FAFB; }
.font-playfair { font-family: 'Playfair Display', serif; }
.nav-underline::after { content:''; position:absolute; left:0; bottom:-4px; height:2px; width:0; background:var(--citrine); transition:width .2s ease; }
.nav-underline:hover::after { width:100%; }

/* Brand: deep navy background, crisp white text */
.cc-banner {
  position: fixed; bottom: 0; left: 0; width: 100%;
  background: #0b1d39; color: #fff; z-index: 9999;
  display: flex; gap: 1rem; align-items: center; padding: 1rem;
  box-shadow: 0 -6px 16px rgba(0,0,0,.15); flex-wrap: wrap;
  font-size: 0.95rem; line-height: 1.4;
}
.cc-banner a { color: #cfe1ff; text-decoration: underline; }
.cc-text { flex: 1 1 420px; }
.cc-text strong { display: block; font-size: 1rem; margin-bottom: .25rem; }
.cc-actions { display: flex; gap: .5rem; flex: 0 0 auto; }

.cc-btn {
  appearance: none; border: none; cursor: pointer; font-weight: 600;
  padding: .6rem 1rem; border-radius: 6px; background: #ffffff; color: #0b1d39;
}
.cc-outline { background: transparent; color: #fff; outline: 1px solid #9fb4d8; }
.cc-btn:focus-visible { outline: 2px solid #ffffff; outline-offset: 2px; }
.cc-hidden { display: none !important; }

/* Modal */
.cc-modal {
  position: fixed; inset: 0; background: rgba(1,8,20,.6); z-index: 10000;
  display: grid; place-items: center; padding: 1rem;
}
.cc-modal-card {
  background: #0f2345; color: #fff; width: min(720px, 100%);
  border-radius: 12px; padding: 1.25rem; box-shadow: 0 14px 40px rgba(0,0,0,.35);
}
.cc-modal-card h2 { margin: 0 0 .25rem 0; font-size: 1.25rem; }
.cc-note { font-size: .9rem; opacity: .85; }
.cc-group { margin: 1rem 0; display: grid; gap: .75rem; }
.cc-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid rgba(255,255,255,.1); }
.cc-row:last-child { border-bottom: 0; }
.cc-modal-actions { display: flex; justify-content: flex-end; gap: .5rem; }

/* Toggle switch */
.cc-switch { position: relative; display: inline-block; width: 46px; height: 26px; }
.cc-switch input { display:none; }
.cc-slider { position: absolute; cursor: pointer; inset: 0; background: #5b6b86; border-radius: 999px; transition: .2s; }
.cc-slider:before { content: ""; position: absolute; height: 20px; width: 20px; left: 3px; top: 3px; background: #fff; border-radius: 50%; transition: .2s; }
.cc-switch input:checked + .cc-slider { background: #7dc4ff; }
.cc-switch input:checked + .cc-slider:before { transform: translateX(20px); }

/* Footer links */
.cc-linklike { background: none; border: none; color: #0b1d39; text-decoration: underline; cursor: pointer; padding: 0; font: inherit; }

/* ===== Option B: Floating Card (compact) ===== */
:root{
  --cc-bg:#0b1d39; --cc-fg:#fff; --cc-outline:#9fb4d8;
  --cc-font-size:.88rem; --cc-pad-y:.6rem; --cc-pad-x:.8rem; --cc-gap:.6rem;
  --cc-btn-pad:.45rem .8rem; --cc-radius:12px;
}

/* Compact base */
.cc-slim.cc-banner{font-size:var(--cc-font-size);padding:var(--cc-pad-y) var(--cc-pad-x);gap:var(--cc-gap);}
.cc-slim .cc-text strong{font-size:.95rem;margin-bottom:.1rem;}
.cc-slim .cc-text p{margin:0;opacity:.95;}
.cc-slim .cc-actions{gap:.4rem;}
.cc-slim .cc-btn{padding:var(--cc-btn-pad);border-radius:999px;font-weight:600;line-height:1;}
.cc-slim .cc-outline{outline:1px solid var(--cc-outline);}

/* Floating card layout */
.cc-card{
  position:fixed; right:16px; bottom:16px; max-width:520px;
  background:rgba(11,29,57,.96); color:var(--cc-fg); z-index:10000;
  border-radius:var(--cc-radius);
  box-shadow:0 12px 34px rgba(0,0,0,.28);
  display:grid; grid-template-columns:1fr auto; align-items:center;
  gap:var(--cc-gap); padding:calc(var(--cc-pad-y) + 2px) calc(var(--cc-pad-x) + 2px);
  backdrop-filter:saturate(120%) blur(6px);
  border:1px solid rgba(255,255,255,.08);
}
.cc-card .cc-text{margin-right:.25rem;}
.cc-card .cc-actions{display:flex;flex-wrap:nowrap;}
.cc-banner a{color:#cfe1ff;text-decoration:underline;}
.cc-hidden{display:none !important;}

/* Hover + motion */
.cc-slim .cc-btn:hover{filter:brightness(.96);}
.cc-slim .cc-outline:hover{background:rgba(255,255,255,.06);}
@media (prefers-reduced-motion:no-preference){
  .cc-banner:not(.cc-hidden){animation:cc-slide-up .22s ease-out both;}
  @keyframes cc-slide-up{from{transform:translateY(8px);opacity:0;} to{transform:translateY(0);opacity:1;}}
}

/* Modal tightened to match compact look */
.cc-modal-card{width:min(640px,100%);padding:1rem 1rem .9rem;border-radius:12px;}
.cc-modal-card h2{font-size:1.1rem;margin:0 0 .25rem 0;}
.cc-group{gap:.5rem;}
.cc-row{padding:.55rem 0;}
.cc-modal-actions .cc-btn{padding:var(--cc-btn-pad);}
.cc-card .cc-text { font-size: 0.7rem; }

/* Mobile */
@media (max-width:520px){
  .cc-card{right:12px;left:12px;bottom:12px;grid-template-columns:1fr;gap:.55rem;}
  .cc-actions{justify-content:flex-start;}
}

/* === Crux Consult Citrine hover accents (rgb(244,196,48,0.9)) === */
:root {
  --cc-citrine: rgba(244,196,48,0.9);
}

/* Smooth transitions for all buttons */
.cc-slim .cc-btn,
.cc-slim .cc-outline,
.cc-modal-actions .cc-btn {
  transition: background 0.25s ease, color 0.25s ease, outline-color 0.25s ease;
}

/* Outline buttons (Reject & Manage) hover */
.cc-slim .cc-outline:hover {
  background: rgba(255, 255, 255, 0.05);
  color: var(--cc-citrine);
  outline-color: var(--cc-citrine);
}

/* Accept button hover */
.cc-slim .cc-btn:not(.cc-outline):hover {
  background: var(--cc-citrine);
  color: #0b1d39;
  filter: none;
}

/* Modal "Save preferences" hover */
.cc-modal-actions .cc-btn:hover {
  background: var(--cc-citrine);
  color: #0b1d39;
}

/* === Right-align consent card === */
.cc-card {
  right: 32px;
  left: auto;
  bottom: 24px;
  margin-left: auto;
}

@media (max-width: 520px) {
  .cc-card {
    right: 12px;
    left: 12px;
    bottom: 12px;
    margin: 0 auto;
  }
}