/* wg:design-vars:start */
:root{--wg-surface:#09090c;--wg-surface-alt:#1a1a1e;--wg-surface-inverse:#f8f8f9;--wg-ink:#f8f8f9;--wg-ink-muted:#d3d3da;--wg-ink-inverse:#1a1a1e;--wg-primary:#c09d37;--wg-primary-hover:#ead295;--wg-primary-soft:#231900;--wg-accent:#bd9a7c;--wg-accent-soft:#281606;--wg-link:#ead295;--wg-link-inverse:#534000;--wg-line:#2d2d33;--wg-line-inverse:#e4e4e8;--wg-primary-on:#09090c;--wg-accent-on:#09090c;--wg-font-display:'Yeseva One', Georgia, 'Times New Roman', serif;--wg-font-body:'Mulish', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;--wg-radius-ui:0px;--wg-radius-card:0px;--wg-shadow-card:none;--wg-section:8rem}
/* wg:design-vars:end */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes lineGrow {
  from { width: 0; }
  to { width: 100%; }
}

@keyframes gentlePulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}

body {
  animation: fadeIn 0.4s ease-out;
}

.section > .container-site {
  animation: fadeInUp 0.6s ease-out both;
}

/* Header sticky + scrolled state */
#site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  transition: background-color 0.35s ease, border-color 0.35s ease, padding 0.35s ease, box-shadow 0.35s ease;
}

#site-header.is-scrolled {
  box-shadow: 0 1px 0 0 var(--wg-line);
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

/* Decorative small-caps labels and accent lines */
.eyebrow::after {
  content: "";
  display: block;
  margin-top: 0.5rem;
  width: 2.5rem;
  height: 1px;
  background-color: var(--wg-accent);
  animation: lineGrow 0.8s ease-out both;
}

hr.accent-line {
  border: none;
  height: 1px;
  background-color: var(--wg-accent);
  width: 3rem;
}

/* Cookie banner fade transition — opacity/visibility only */
#cookie-banner {
  transition: opacity 0.4s ease, visibility 0.4s ease;
  opacity: 0;
  visibility: hidden;
}

#cookie-banner:not(.hidden) {
  opacity: 1;
  visibility: visible;
}

/* Back to top button */
#back-to-top {
  transition: opacity 0.3s ease, transform 0.3s ease;
}

#back-to-top:hover {
  transform: translateY(-3px);
}

/* Form focus and error states */
input, textarea, select {
  transition: border-color 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--wg-primary);
  box-shadow: 0 0 0 2px var(--wg-primary-soft);
}

input.error, textarea.error, select.error {
  border-color: var(--wg-accent);
  box-shadow: 0 0 0 2px var(--wg-accent-soft);
}

.error-message {
  color: #fca5a5;
  font-size: 0.875rem;
  letter-spacing: 0.02em;
  margin-top: 0.25rem;
  animation: fadeIn 0.3s ease-out;
}

.success-message {
  color: #86efac;
  font-size: 0.875rem;
  letter-spacing: 0.02em;
  margin-top: 0.25rem;
  animation: fadeIn 0.3s ease-out;
}

/* Accordion transitions */
.accordion-header {
  transition: color 0.25s ease, border-color 0.25s ease;
}

.accordion-content {
  transition: opacity 0.3s ease;
}

.accordion-content:not(.hidden) {
  animation: fadeIn 0.35s ease-out;
}

.accordion-header i {
  transition: transform 0.3s ease;
}

.accordion-header.is-open i {
  transform: rotate(180deg);
}

/* Links */
.link-inline {
  transition: color 0.25s ease, border-color 0.25s ease;
}

/* Card photo frame subtle motion */
.img-frame {
  transition: transform 0.4s ease;
}

.img-frame img {
  transition: opacity 0.5s ease, transform 0.5s ease;
}

/* Mobile menu panel transitions (visibility handled by Tailwind hidden class) */
#mobile-menu {
  transition: opacity 0.3s ease;
}

/* Small-caps letter-spaced labels used decoratively */
.label-caps {
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

/* Print rules */
@media print {
  #site-header,
  #mobile-menu-toggle,
  #cookie-banner,
  #back-to-top,
  footer #cookie-banner {
    display: none !important;
  }

  body {
    background: #fff;
    color: #000;
  }

  a {
    text-decoration: underline;
  }

  .section {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}