/* =========================================================================
   Classical Arts — Cookie Consent (modern popup)
   No external resource loads until the user makes a choice.
   ========================================================================= */

.cc-root { position: fixed; inset: 0; z-index: 9999; display: none; }
.cc-root[data-open="true"] { display: block; }

.cc-overlay {
  position: absolute; inset: 0;
  background: oklch(0.185 0.012 50 / 0.5);
  backdrop-filter: blur(3px);
  opacity: 0; transition: opacity var(--dur) var(--ease-out);
}
.cc-root[data-open="true"] .cc-overlay { opacity: 1; }

.cc-panel {
  position: absolute;
  left: clamp(1rem, 4vw, 2.5rem);
  bottom: clamp(1rem, 4vw, 2.5rem);
  width: min(30rem, calc(100vw - 2rem));
  background: var(--paper);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: clamp(1.25rem, 3vw, 1.75rem);
  transform: translateY(14px) scale(0.985);
  opacity: 0;
  transition: transform var(--dur-slow) var(--ease-out), opacity var(--dur-slow) var(--ease-out);
}
.cc-root[data-open="true"] .cc-panel { transform: none; opacity: 1; }

.cc-panel__head { display: flex; align-items: center; gap: var(--space-sm); margin-bottom: var(--space-sm); }
.cc-panel__head .eyebrow { margin: 0; }
.cc-panel h2 { font-size: var(--step-2); margin-bottom: var(--space-xs); }
.cc-panel p { font-size: var(--step--1); color: var(--ink-2); line-height: 1.55; }
.cc-panel p a { color: var(--brass-deep); }

.cc-actions { display: grid; gap: var(--space-xs); margin-top: var(--space-lg); }
@media (min-width: 28rem) { .cc-actions { grid-template-columns: 1fr 1fr; } }
.cc-actions .btn { justify-content: center; width: 100%; }
.cc-actions .cc-accept { grid-column: 1 / -1; }
.cc-link {
  background: none; border: 0; color: var(--ink-3);
  font-size: var(--step--1); text-decoration: underline; text-underline-offset: 0.2em;
  justify-self: start; padding: 0;
}
.cc-link:hover { color: var(--ink); }

/* Detailed preferences */
.cc-prefs { display: none; margin-top: var(--space-md); border-top: 1px solid var(--line); padding-top: var(--space-md); }
.cc-panel[data-view="prefs"] .cc-prefs { display: block; }
.cc-panel[data-view="prefs"] .cc-intro { display: none; }
.cc-option { display: flex; gap: var(--space-sm); padding: var(--space-sm) 0; align-items: flex-start; }
.cc-option + .cc-option { border-top: 1px solid var(--line); }
.cc-option__text strong { display: block; font-size: var(--step-0); }
.cc-option__text span { font-size: var(--step--1); color: var(--ink-2); }
.cc-switch { position: relative; flex-shrink: 0; width: 2.6rem; height: 1.5rem; }
.cc-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.cc-switch__track { position: absolute; inset: 0; background: var(--paper-3); border: 1px solid var(--line-strong); border-radius: 999px; transition: background-color var(--dur); }
.cc-switch__track::after { content: ""; position: absolute; top: 2px; left: 2px; width: calc(1.5rem - 6px); height: calc(1.5rem - 6px); background: var(--paper); border-radius: 50%; box-shadow: var(--shadow-sm); transition: transform var(--dur) var(--ease-out); }
.cc-switch input:checked + .cc-switch__track { background: var(--brass-deep); border-color: var(--brass-deep); }
.cc-switch input:checked + .cc-switch__track::after { transform: translateX(1.1rem); }
.cc-switch input:disabled + .cc-switch__track { opacity: 0.6; }
.cc-switch input:focus-visible + .cc-switch__track { outline: 2px solid var(--focus); outline-offset: 2px; }

/* Floating re-open button (after consent) */
.cc-fab {
  position: fixed; left: 1rem; bottom: 1rem; z-index: 90;
  width: 2.75rem; height: 2.75rem; border-radius: 50%;
  background: var(--paper); color: var(--ink-2);
  border: 1px solid var(--line); box-shadow: var(--shadow-md);
  display: none; place-items: center;
  transition: transform var(--dur) var(--ease-out), color var(--dur);
}
.cc-fab[data-show="true"] { display: grid; }
.cc-fab:hover { transform: translateY(-2px); color: var(--brass-deep); }

/* Placeholder shown where a blocked embed (e.g. Google Maps) would render */
.embed-block {
  display: grid; place-items: center; text-align: center; gap: var(--space-sm);
  min-height: 18rem; padding: var(--space-xl);
  background: var(--paper-2); border: 1px dashed var(--line-strong); border-radius: var(--radius-lg);
  color: var(--ink-2);
}
.embed-block p { font-size: var(--step--1); max-width: 36ch; }