/* TranslateOS cookie consent. Banner and preferences panel.
   Self-contained for the move to Webflow: load after site.css (reuses .tos-btn, .btn-secondary,
   .wrap, .sr, :focus-visible and the site tokens in :root). No new colors, radii, or shadows. */

/* ---------- Banner: a slim bar along the bottom edge ---------- */
.cc-banner{position:fixed;left:0;right:0;bottom:0;z-index:260;background:var(--surface);color:var(--ink);
  border-top:1px solid var(--line);box-shadow:var(--sh-3);padding:18px 0 calc(18px + env(safe-area-inset-bottom,0px));
  transform:translateY(12px);opacity:0;transition:opacity .3s var(--ease),transform .3s var(--ease)}
.cc-banner.cc-on{transform:none;opacity:1}
.cc-banner[hidden]{display:none}
.cc-banner .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 40px;align-items:center}
.cc-banner-copy{display:grid;gap:4px}
.cc-banner-copy h2{font-size:1.05rem;line-height:1.3;font-weight:500;letter-spacing:-.012em}
.cc-banner-copy p{font-size:.95rem;line-height:1.5;color:var(--muted);max-width:62ch}
.cc-banner-copy a{color:var(--link)}
.cc-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.cc-actions .tos-btn{min-height:44px;padding:0 18px;font-size:15px;width:100%;white-space:nowrap}
@media (max-width:1060px){
  .cc-banner .wrap{grid-template-columns:1fr}
  .cc-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:560px){
  .cc-banner{padding-top:14px;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
  .cc-banner .wrap{gap:12px}
  .cc-banner-copy h2{font-size:1rem}
  .cc-banner-copy p{font-size:.9rem;line-height:1.45}
  .cc-actions{grid-template-columns:1fr 1fr;gap:8px}
  .cc-actions [data-cc="manage"]{grid-column:1/-1}
}

/* ---------- Preferences panel: a dialog, centered on desktop, a sheet on phones ---------- */
.cc-dialog{position:fixed;inset:0;z-index:270;display:grid;place-items:center;padding:var(--gutter);
  background:rgba(0,27,43,.48);opacity:0;transition:opacity .25s var(--ease)}
.cc-dialog.cc-on{opacity:1}
.cc-dialog[hidden]{display:none}
.cc-panel{width:min(600px,100%);max-height:calc(100vh - 2*var(--gutter));max-height:calc(100dvh - 2*var(--gutter));overflow:auto;
  background:var(--surface);color:var(--ink);border-radius:var(--r-md);box-shadow:var(--sh-3);
  padding:clamp(22px,3vw,32px);display:grid;gap:20px;transform:translateY(10px);transition:transform .25s var(--ease)}
.cc-dialog.cc-on .cc-panel{transform:none}
.cc-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:start}
.cc-head h2{font-size:clamp(1.35rem,2vw,1.6rem);line-height:1.15}
.cc-head p{margin-top:8px;font-size:.98rem;line-height:1.5;color:var(--muted)}
.cc-head a{color:var(--link)}
.cc-close{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--pill);
  background:var(--surface);color:var(--ink);cursor:pointer;padding:0}
.cc-close:hover{background:var(--sunken)}
.cc-close svg{width:16px;height:16px}

.cc-note{font-size:.92rem;line-height:1.45;color:var(--ink);background:var(--sunken);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:10px 14px}
.cc-note[hidden]{display:none}

.cc-cats{display:grid;border-top:1px solid var(--line)}
.cc-cat{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 20px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.cc-cat-name{font-size:1.02rem;font-weight:500;line-height:1.3}
.cc-cat-desc{grid-column:1;font-size:.92rem;line-height:1.45;color:var(--muted)}
.cc-cat-state{grid-column:2;grid-row:1/3;display:inline-flex;align-items:center;gap:10px;font-size:.85rem;font-weight:500;color:var(--muted)}

/* Switch: a button with role="switch". Navy when on, matching the primary button. */
.cc-switch{position:relative;width:46px;height:26px;flex:0 0 auto;border:0;border-radius:var(--pill);cursor:pointer;padding:0;
  background:var(--line);transition:background-color .2s}
.cc-switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;
  box-shadow:var(--sh-1);transition:transform .2s var(--ease)}
.cc-switch[aria-checked="true"]{background:var(--navy)}
.cc-switch[aria-checked="true"]::after{transform:translateX(20px)}
.cc-switch:disabled{cursor:default;opacity:.55}

.cc-foot{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding-top:4px}
.cc-foot .tos-btn{min-height:46px;padding:0 18px;font-size:15px;width:100%;white-space:nowrap}
@media (max-width:560px){
  .cc-dialog{padding:0;align-items:end}
  .cc-panel{width:100%;max-height:92vh;max-height:92dvh;border-radius:var(--r-lg) var(--r-lg) 0 0;
    padding-bottom:calc(22px + env(safe-area-inset-bottom,0px))}
  .cc-foot{grid-template-columns:1fr}
}

/* Keep the page behind the dialog from scrolling */
.cc-lock{overflow:hidden}

@media (prefers-reduced-motion:reduce){
  .cc-banner,.cc-dialog,.cc-panel,.cc-switch,.cc-switch::after{transition:none}
}
