/* Local preview safety and accessibility; the saved design lives in saved-snapshot.css. */
body.website-preview { margin: 0; background: #f8f1e5; }
.website-preview *, .website-preview *::before, .website-preview *::after { box-sizing: border-box; }
.website-preview .cl-preview-banner { background: #351722; color: #f8f1e5; padding: 12px 20px; text-align: center; font: 13px/1.5 'Trebuchet MS', sans-serif; letter-spacing: .035em; text-transform: none; }
.website-preview .cl-coming-soon { color: #551f32; font: bold 12px/1.6 'Trebuchet MS', sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.website-preview .cl-course-card .cl-button { align-self: flex-start; }
.website-preview[data-page="home"] #cl-classes {
  background: radial-gradient(ellipse at 18% 35%, #dfc1b940, transparent 60%);
}
.website-preview[data-page="home"] .cl-catalog { align-items: start; }
.website-preview[data-page="home"] .cl-catalog .cl-course-card {
  position: relative; justify-content: flex-start; border-radius: 20px; border: 1px solid #ffffff;
  background: linear-gradient(145deg, #fffdf7df, #ffffff8c);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow: inset 0 1px 0 #ffffff, 0 8px 22px #4619230d, 0 1px 3px #46192312;
  transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}
.website-preview .cl-course-card .cl-catalog-art { display: block; width: 100%; height: 230px; object-fit: contain; border-radius: 12px; background: #461923; margin-bottom: 22px; }
.website-preview .cl-enrollment-lock { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; margin-bottom: 16px; border-radius: 999px; border: 1px solid #b18a4070; background: #fffaf1db; color: #461923; font: bold 11px/1.4 'Trebuchet MS', sans-serif; }
.website-preview .cl-lock-icon { display: inline-block; width: 10px; height: 9px; border: 1px solid currentColor; border-radius: 1px; position: relative; }
.website-preview .cl-lock-icon::before { content: ''; position: absolute; left: 1px; top: -6px; width: 6px; height: 6px; border: 1px solid currentColor; border-bottom: 0; border-radius: 5px 5px 0 0; }
.website-preview[data-page="home"] .cl-course-card:focus-within { outline: 2px solid #ad823b; outline-offset: 4px; }
@media (hover: hover) and (pointer: fine) {
  .website-preview[data-page="home"] .cl-catalog .cl-course-card:hover { transform: translateY(-8px); border-color: #b18a4099; box-shadow: inset 0 1px 0 #ffffff, 0 24px 44px #46192324; }
}
.website-preview .cl-policy-links { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px 24px; margin: 16px auto 0; width: min(1120px, calc(100% - 56px)); }
.website-preview a:focus-visible, .website-preview summary:focus-visible { outline: 3px solid #b58b3c; outline-offset: 4px; }
.website-preview .cl-contact .cl-eyebrow { color: #e7ce9d; }
.website-preview .cl-brand { display: flex; align-items: center; gap: 14px; }
.website-preview .cl-header .cl-brand img.cl-brand-logo { display: block; width: 72px; height: 72px; flex: 0 0 72px; object-fit: contain; }
@media (max-width: 600px) { .website-preview .cl-header .cl-brand img.cl-brand-logo { width: 56px; height: 56px; flex-basis: 56px; } .website-preview .cl-brand { gap: 10px; } }
@media (max-width: 800px) {
  .website-preview .cl-price-panel { grid-template-columns: 1fr; padding: 24px; }
  .website-preview .cl-policy-links { width: calc(100% - 36px); justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .website-preview *, .website-preview *::before, .website-preview *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}