@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,700&family=Raleway:wght@300;400;500;600&family=Tangerine:wght@400;700&display=swap");
.cal {
  --cal-bg: #FAF8F3;
  --cal-bg-secondary: #F4F0E8;
  --cal-surface: #FFFFFF;
  --cal-text: #1A1208;
  --cal-text-secondary: #6B5C4E;
  --cal-text-muted: #9B8E80;
  --cal-accent-rose: #C4616A;
  --cal-accent-rose-light: #F2DDD5;
  --cal-accent-sage: #7A9B7A;
  --cal-accent-sage-light: #E4EDE4;
  --cal-accent-gold: #C9A84C;
  --cal-accent-gold-light: #F5EDD4;
  --cal-accent-teal: #5B8F8F;
  --cal-border: #E4DDD2;
  --cal-border-subtle: #EEE9E0;
  --cal-font-display: 'Playfair Display', Georgia, serif;
  --cal-font-body: 'Raleway', 'Helvetica Neue', sans-serif;
  --cal-font-accent: 'Tangerine', cursive;
  --cal-text-hero: clamp(2rem, 5vw, 3.5rem);
  --cal-text-section: clamp(1.5rem, 3vw, 2.25rem);
  --cal-text-title: clamp(1.125rem, 2vw, 1.375rem);
  --cal-text-body: clamp(0.9375rem, 1.5vw, 1.0625rem);
  --cal-text-sm: 0.8125rem;
  --cal-text-xs: 0.6875rem;
  --cal-leading-body: 1.7;
  --cal-leading-heading: 1.2;
  --cal-tracking-heading: -0.02em;
  --cal-tracking-label: 0.08em;
  --cal-tracking-body: 0.02em;
  --cal-radius: 8px;
  --cal-radius-card: 24px;
  --cal-radius-pill: 9999px;
  --cal-shadow-sm: 0 2px 8px rgba(61, 46, 30, 0.06);
  --cal-shadow: 0 4px 20px rgba(61, 46, 30, 0.08);
  --cal-shadow-lg: 0 8px 40px rgba(61, 46, 30, 0.12);
  --cal-shadow-glow-rose: 0 0 20px rgba(196, 97, 106, 0.15);
  --cal-shadow-glow-gold: 0 0 20px rgba(201, 168, 76, 0.15);
  --cal-transition: 300ms cubic-bezier(0.4, 0, 0.2, 1);
  --cal-transition-slow: 500ms cubic-bezier(0.4, 0, 0.2, 1);
  --cal-space-xs: 4px;
  --cal-space-sm: 8px;
  --cal-space-md: 16px;
  --cal-space-lg: 24px;
  --cal-space-xl: 32px;
  --cal-space-2xl: 48px;
  --cal-space-3xl: 64px;
  --cal-space-4xl: 80px;
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-body);
  font-weight: 500;
  line-height: var(--cal-leading-body);
  letter-spacing: var(--cal-tracking-body);
  color: var(--cal-text);
  background-color: var(--cal-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.cal *, .cal *::before, .cal *::after {
  box-sizing: border-box;
}

.cal.dark, .dark .cal,
.cal[data-theme=dark], [data-theme=dark] .cal {
  --cal-bg: #1C1612;
  --cal-bg-secondary: #241D17;
  --cal-surface: #2A221B;
  --cal-text: #EDE6DC;
  --cal-text-secondary: #A89B8B;
  --cal-text-muted: #6B5F53;
  --cal-accent-rose: #D4757D;
  --cal-accent-rose-light: #3D2628;
  --cal-accent-sage: #8FB08F;
  --cal-accent-sage-light: #1E2E1E;
  --cal-accent-gold: #D4B85C;
  --cal-accent-gold-light: #332D1A;
  --cal-accent-teal: #6FA3A3;
  --cal-border: #3D342B;
  --cal-border-subtle: #332B23;
  --cal-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2);
  --cal-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  --cal-shadow-lg: 0 8px 40px rgba(0, 0, 0, 0.4);
  --cal-shadow-glow-rose: 0 0 20px rgba(212, 117, 125, 0.2);
  --cal-shadow-glow-gold: 0 0 20px rgba(212, 184, 92, 0.2);
}

.cal-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 36px;
  font-family: var(--cal-font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  line-height: 1;
  letter-spacing: var(--cal-tracking-heading);
  color: var(--cal-surface);
  background-color: var(--cal-accent-rose);
  border: 2px solid transparent;
  border-radius: var(--cal-radius-pill);
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color var(--cal-transition), color var(--cal-transition), border-color var(--cal-transition), box-shadow var(--cal-transition), transform var(--cal-transition);
}
.cal-btn:hover {
  background-color: #B3545D;
  box-shadow: var(--cal-shadow), var(--cal-shadow-glow-rose);
}
.cal-btn:focus-visible {
  outline: 2px solid var(--cal-accent-rose);
  outline-offset: 3px;
}
.cal-btn:active {
  transform: scale(0.97);
  box-shadow: var(--cal-shadow-sm);
}
.cal-btn:disabled, .cal-btn[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}
.cal-btn--outlined {
  background-color: transparent;
  color: var(--cal-accent-rose);
  border-color: var(--cal-accent-rose);
}
.cal-btn--outlined:hover {
  background-color: var(--cal-accent-rose-light);
  box-shadow: var(--cal-shadow-glow-rose);
}
.cal-btn--text {
  background-color: transparent;
  color: var(--cal-accent-rose);
  border-color: transparent;
  padding-left: 16px;
  padding-right: 16px;
}
.cal-btn--text:hover {
  background-color: var(--cal-accent-rose-light);
  box-shadow: none;
}
.cal-btn--sage {
  background-color: var(--cal-accent-sage);
}
.cal-btn--sage:hover {
  background-color: #6B8C6B;
  box-shadow: var(--cal-shadow), 0 0 20px rgba(122, 155, 122, 0.15);
}
.cal-btn--gold {
  background-color: var(--cal-accent-gold);
  color: var(--cal-text);
}
.cal-btn--gold:hover {
  background-color: #B89840;
  box-shadow: var(--cal-shadow), var(--cal-shadow-glow-gold);
}
.cal-btn--teal {
  background-color: var(--cal-accent-teal);
}
.cal-btn--teal:hover {
  background-color: #4E7F7F;
  box-shadow: var(--cal-shadow), 0 0 20px rgba(91, 143, 143, 0.15);
}
.cal-btn--ghost {
  background-color: transparent;
  color: var(--cal-surface);
  border-color: var(--cal-surface);
}
.cal-btn--ghost:hover {
  background-color: rgba(251, 248, 242, 0.1);
  box-shadow: 0 0 20px rgba(251, 248, 242, 0.08);
}
.cal-btn--sm {
  padding: 10px 24px;
  font-size: 0.875rem;
}
.cal-btn--lg {
  padding: 18px 48px;
  font-size: 1.125rem;
}

.cal.dark .cal-btn:hover, .dark .cal .cal-btn:hover,
.cal[data-theme=dark] .cal-btn:hover, [data-theme=dark] .cal .cal-btn:hover {
  background-color: #D4757D;
  box-shadow: var(--cal-shadow), 0 0 16px rgba(196, 97, 106, 0.2);
}
.cal.dark .cal-btn--sage:hover, .dark .cal .cal-btn--sage:hover,
.cal[data-theme=dark] .cal-btn--sage:hover, [data-theme=dark] .cal .cal-btn--sage:hover {
  background-color: #7BA67B;
  box-shadow: var(--cal-shadow), 0 0 20px rgba(143, 176, 143, 0.2);
}
.cal.dark .cal-btn--gold:hover, .dark .cal .cal-btn--gold:hover,
.cal[data-theme=dark] .cal-btn--gold:hover, [data-theme=dark] .cal .cal-btn--gold:hover {
  background-color: #C9A84C;
  box-shadow: var(--cal-shadow), var(--cal-shadow-glow-gold);
}
.cal.dark .cal-btn--teal:hover, .dark .cal .cal-btn--teal:hover,
.cal[data-theme=dark] .cal-btn--teal:hover, [data-theme=dark] .cal .cal-btn--teal:hover {
  background-color: #5E9999;
  box-shadow: var(--cal-shadow), 0 0 20px rgba(111, 163, 163, 0.2);
}
.cal.dark .cal-btn--ghost:hover, .dark .cal .cal-btn--ghost:hover,
.cal[data-theme=dark] .cal-btn--ghost:hover, [data-theme=dark] .cal .cal-btn--ghost:hover {
  background-color: rgba(237, 230, 220, 0.08);
  box-shadow: 0 0 20px rgba(237, 230, 220, 0.06);
}

.cal-card {
  background-color: var(--cal-surface);
  border: 1px solid var(--cal-border-subtle);
  border-radius: var(--cal-radius-card);
  padding: 28px;
  transition: box-shadow var(--cal-transition), border-color var(--cal-transition);
}
.cal-card__media {
  margin: -28px -28px 24px -28px;
  aspect-ratio: 16/10;
  overflow: hidden;
  border-radius: var(--cal-radius-card) var(--cal-radius-card) 0 0;
}
.cal-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--cal-transition-slow);
}
.cal-card__media:hover img {
  transform: scale(1.03);
}
.cal-card__title {
  font-family: var(--cal-font-display);
  font-size: var(--cal-text-title);
  font-weight: 700;
  line-height: var(--cal-leading-heading);
  letter-spacing: var(--cal-tracking-heading);
  color: var(--cal-text);
  margin: 0 0 4px 0;
}
.cal-card__subtitle {
  font-family: var(--cal-font-accent);
  font-size: 1.25rem;
  font-weight: 400;
  color: var(--cal-accent-rose);
  margin: 0 0 16px 0;
  line-height: 1.3;
}
.cal-card__body {
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-body);
  font-weight: 400;
  line-height: var(--cal-leading-body);
  color: var(--cal-text-secondary);
  margin: 0 0 20px 0;
}
.cal-card__body:last-child {
  margin-bottom: 0;
}
.cal-card__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
}
.cal-card__footer {
  margin: 24px -28px -28px -28px;
  padding: 16px 28px;
  border-top: 1px solid var(--cal-border-subtle);
  border-radius: 0 0 var(--cal-radius-card) var(--cal-radius-card);
  background-color: var(--cal-bg);
  font-size: var(--cal-text-sm);
  color: var(--cal-text-muted);
}
.cal-card--elevated {
  border-color: transparent;
  box-shadow: var(--cal-shadow);
}
.cal-card--elevated:hover {
  box-shadow: var(--cal-shadow-lg);
}
.cal-card--framed {
  border: 2px solid var(--cal-accent-gold);
  box-shadow: inset 0 0 0 4px var(--cal-surface), inset 0 0 0 5px var(--cal-border);
  padding: 32px;
}
.cal-card--framed .cal-card__media {
  margin: -32px -32px 24px -32px;
  border-radius: calc(var(--cal-radius-card) - 2px) calc(var(--cal-radius-card) - 2px) 0 0;
}
.cal-card--framed .cal-card__footer {
  margin: 24px -32px -32px -32px;
  padding: 16px 32px;
  border-radius: 0 0 calc(var(--cal-radius-card) - 2px) calc(var(--cal-radius-card) - 2px);
}
.cal-card--rose {
  background-color: var(--cal-accent-rose-light);
  border-color: rgba(196, 97, 106, 0.15);
}
.cal-card--rose .cal-card__footer {
  background-color: rgba(196, 97, 106, 0.06);
}
.cal-card--sage {
  background-color: var(--cal-accent-sage-light);
  border-color: rgba(122, 155, 122, 0.15);
}
.cal-card--sage .cal-card__footer {
  background-color: rgba(122, 155, 122, 0.06);
}

.cal.dark .cal-card--framed, .dark .cal .cal-card--framed,
.cal[data-theme=dark] .cal-card--framed, [data-theme=dark] .cal .cal-card--framed {
  box-shadow: inset 0 0 0 4px var(--cal-surface), inset 0 0 0 5px var(--cal-border), 0 0 20px rgba(201, 168, 76, 0.1);
}
.cal.dark .cal-card--rose, .dark .cal .cal-card--rose,
.cal[data-theme=dark] .cal-card--rose, [data-theme=dark] .cal .cal-card--rose {
  border-color: rgba(212, 117, 125, 0.2);
}
.cal.dark .cal-card--rose .cal-card__footer, .dark .cal .cal-card--rose .cal-card__footer,
.cal[data-theme=dark] .cal-card--rose .cal-card__footer, [data-theme=dark] .cal .cal-card--rose .cal-card__footer {
  background-color: rgba(212, 117, 125, 0.08);
}
.cal.dark .cal-card--sage, .dark .cal .cal-card--sage,
.cal[data-theme=dark] .cal-card--sage, [data-theme=dark] .cal .cal-card--sage {
  border-color: rgba(143, 176, 143, 0.2);
}
.cal.dark .cal-card--sage .cal-card__footer, .dark .cal .cal-card--sage .cal-card__footer,
.cal[data-theme=dark] .cal-card--sage .cal-card__footer, [data-theme=dark] .cal .cal-card--sage .cal-card__footer {
  background-color: rgba(143, 176, 143, 0.08);
}

.cal-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cal-field__label {
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--cal-tracking-label);
  color: var(--cal-text-secondary);
}
.cal-field__hint {
  font-size: var(--cal-text-xs);
  color: var(--cal-text-muted);
  line-height: 1.4;
}
.cal-field__error {
  font-size: var(--cal-text-xs);
  color: var(--cal-accent-rose);
  line-height: 1.4;
}

.cal-input {
  width: 100%;
  padding: 12px 16px;
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-body);
  font-weight: 400;
  line-height: 1.5;
  color: var(--cal-text);
  background-color: var(--cal-surface);
  border: 1px solid var(--cal-border);
  border-radius: var(--cal-radius);
  transition: border-color var(--cal-transition), box-shadow var(--cal-transition);
  appearance: none;
}
.cal-input::placeholder {
  color: var(--cal-text-muted);
}
.cal-input:hover {
  border-color: var(--cal-text-muted);
}
.cal-input:focus {
  outline: none;
  border-color: var(--cal-accent-rose);
  box-shadow: 0 0 0 3px rgba(196, 97, 106, 0.12);
}
.cal-input:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: var(--cal-bg-secondary);
}
.cal-input--error {
  border-color: var(--cal-accent-rose);
}
.cal-input--error:focus {
  box-shadow: 0 0 0 3px rgba(196, 97, 106, 0.18);
}
.cal-input--success {
  border-color: var(--cal-accent-sage);
}
.cal-input--success:focus {
  box-shadow: 0 0 0 3px rgba(122, 155, 122, 0.18);
}

.cal-select {
  width: 100%;
  padding: 12px 40px 12px 16px;
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-body);
  font-weight: 400;
  line-height: 1.5;
  color: var(--cal-text);
  background-color: var(--cal-surface);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%238C7B6B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 12px 8px;
  border: 1px solid var(--cal-border);
  border-radius: var(--cal-radius);
  cursor: pointer;
  appearance: none;
  transition: border-color var(--cal-transition), box-shadow var(--cal-transition);
}
.cal-select:hover {
  border-color: var(--cal-text-muted);
}
.cal-select:focus {
  outline: none;
  border-color: var(--cal-accent-rose);
  box-shadow: 0 0 0 3px rgba(196, 97, 106, 0.12);
}
.cal-select:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: var(--cal-bg-secondary);
}

.cal-textarea {
  width: 100%;
  min-height: 120px;
  padding: 12px 16px;
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-body);
  font-weight: 400;
  line-height: var(--cal-leading-body);
  color: var(--cal-text);
  background-color: var(--cal-surface);
  border: 1px solid var(--cal-border);
  border-radius: var(--cal-radius);
  resize: vertical;
  appearance: none;
  transition: border-color var(--cal-transition), box-shadow var(--cal-transition);
}
.cal-textarea::placeholder {
  color: var(--cal-text-muted);
}
.cal-textarea:hover {
  border-color: var(--cal-text-muted);
}
.cal-textarea:focus {
  outline: none;
  border-color: var(--cal-accent-rose);
  box-shadow: 0 0 0 3px rgba(196, 97, 106, 0.12);
}
.cal-textarea:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: var(--cal-bg-secondary);
}

.cal-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 12px;
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--cal-tracking-label);
  line-height: 1.4;
  color: var(--cal-text-secondary);
  background-color: var(--cal-bg-secondary);
  border: 1px solid transparent;
  border-radius: var(--cal-radius-pill);
  white-space: nowrap;
  transition: background-color var(--cal-transition), color var(--cal-transition);
}
.cal-badge--rose {
  color: var(--cal-accent-rose);
  background-color: var(--cal-accent-rose-light);
}
.cal-badge--sage {
  color: var(--cal-accent-sage);
  background-color: var(--cal-accent-sage-light);
}
.cal-badge--gold {
  color: #9E8338;
  background-color: var(--cal-accent-gold-light);
}
.cal-badge--teal {
  color: var(--cal-accent-teal);
  background-color: rgba(91, 143, 143, 0.12);
}
.cal-badge--outline {
  background-color: transparent;
  border-color: var(--cal-border);
  color: var(--cal-text-secondary);
}
.cal-badge--sm {
  padding: 2px 8px;
  font-size: 0.625rem;
}
.cal-badge--lg {
  padding: 6px 16px;
  font-size: var(--cal-text-sm);
}
.cal-badge__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: currentColor;
  flex-shrink: 0;
}

.cal-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 2px solid var(--cal-border);
  background-color: var(--cal-bg-secondary);
  color: var(--cal-text-secondary);
  font-family: var(--cal-font-body);
  font-size: 0.875rem;
  font-weight: 600;
  font-style: normal;
  line-height: 1;
  overflow: hidden;
  flex-shrink: 0;
  transition: border-color var(--cal-transition), box-shadow var(--cal-transition);
}
.cal-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cal-avatar:hover {
  border-color: var(--cal-accent-rose);
  box-shadow: var(--cal-shadow-glow-rose);
}
.cal-avatar--sm {
  width: 32px;
  height: 32px;
  font-size: 0.8125rem;
  border-width: 1.5px;
}
.cal-avatar--lg {
  width: 64px;
  height: 64px;
  font-size: 1.5rem;
  border-width: 2px;
}
.cal-avatar--xl {
  width: 96px;
  height: 96px;
  font-size: 2.25rem;
  border-width: 3px;
}
.cal-avatar--rose {
  background-color: var(--cal-accent-rose-light);
  color: var(--cal-accent-rose);
  border-color: rgba(196, 97, 106, 0.25);
}
.cal-avatar--sage {
  background-color: var(--cal-accent-sage-light);
  color: var(--cal-accent-sage);
  border-color: rgba(122, 155, 122, 0.25);
}
.cal-avatar--gold {
  background-color: var(--cal-accent-gold-light);
  color: var(--cal-accent-gold);
  border-color: rgba(201, 168, 76, 0.25);
}
.cal-avatar-group {
  display: flex;
  align-items: center;
}
.cal-avatar-group .cal-avatar {
  margin-left: -12px;
  border-color: var(--cal-surface);
  border-width: 2px;
}
.cal-avatar-group .cal-avatar:first-child {
  margin-left: 0;
}
.cal-avatar-group .cal-avatar:hover {
  z-index: 1;
  transform: translateY(-2px);
}

.cal-alert {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px 24px;
  background-color: var(--cal-surface);
  border: 1px solid var(--cal-border-subtle);
  border-left: 4px solid var(--cal-accent-teal);
  border-radius: var(--cal-radius-card);
  border-top-left-radius: var(--cal-radius);
  border-bottom-left-radius: var(--cal-radius);
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-body);
  line-height: var(--cal-leading-body);
  color: var(--cal-text);
  transition: box-shadow var(--cal-transition);
}
.cal-alert__icon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-top: 2px;
}
.cal-alert__content {
  flex: 1;
  min-width: 0;
}
.cal-alert__title {
  font-family: var(--cal-font-body);
  font-weight: 600;
  font-size: var(--cal-text-body);
  margin: 0 0 4px 0;
  color: var(--cal-text);
}
.cal-alert__message {
  color: var(--cal-text-secondary);
  margin: 0;
}
.cal-alert__dismiss {
  flex-shrink: 0;
  padding: 4px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--cal-text-muted);
  border-radius: var(--cal-radius);
  transition: color var(--cal-transition), background-color var(--cal-transition);
}
.cal-alert__dismiss:hover {
  color: var(--cal-text);
  background-color: var(--cal-bg-secondary);
}
.cal-alert--info {
  border-left-color: var(--cal-accent-teal);
  background-color: rgba(91, 143, 143, 0.06);
}
.cal-alert--warning {
  border-left-color: var(--cal-accent-gold);
  background-color: var(--cal-accent-gold-light);
}
.cal-alert--warning .cal-alert__title {
  color: #9E8338;
}
.cal-alert--error {
  border-left-color: var(--cal-accent-rose);
  background-color: var(--cal-accent-rose-light);
}
.cal-alert--error .cal-alert__title {
  color: var(--cal-accent-rose);
}
.cal-alert--success {
  border-left-color: var(--cal-accent-sage);
  background-color: var(--cal-accent-sage-light);
}
.cal-alert--success .cal-alert__title {
  color: var(--cal-accent-sage);
}

.cal-hero {
  display: grid;
  grid-template-columns: 45% 55%;
  align-items: center;
  gap: var(--cal-space-3xl);
  padding: var(--cal-space-4xl) var(--cal-space-2xl);
  min-height: 560px;
}
.cal-hero__content {
  display: flex;
  flex-direction: column;
  gap: var(--cal-space-md);
}
.cal-hero__eyebrow {
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--cal-accent-rose);
}
.cal-hero__title {
  font-family: var(--cal-font-display);
  font-size: var(--cal-text-hero);
  font-weight: 700;
  font-style: italic;
  line-height: var(--cal-leading-heading);
  letter-spacing: var(--cal-tracking-heading);
  color: var(--cal-text);
  margin: 0;
}
.cal-hero__subtitle {
  font-family: var(--cal-font-accent);
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  font-weight: 400;
  color: var(--cal-accent-rose);
  line-height: 1.2;
  margin: 0;
}
.cal-hero__body {
  font-family: var(--cal-font-body);
  font-size: var(--cal-text-body);
  font-weight: 400;
  line-height: var(--cal-leading-body);
  color: var(--cal-text-secondary);
  margin: 0;
  max-width: 480px;
}
.cal-hero__actions {
  display: flex;
  align-items: center;
  gap: var(--cal-space-md);
  margin-top: var(--cal-space-sm);
  flex-wrap: wrap;
}
.cal-hero__media {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.cal-hero__frame {
  position: relative;
  width: 380px;
  height: 380px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--cal-accent-gold);
  box-shadow: 0 0 0 8px var(--cal-surface), 0 0 0 10px var(--cal-accent-rose), 0 0 0 18px var(--cal-surface), 0 0 0 19px var(--cal-border), var(--cal-shadow-glow-gold);
  transition: box-shadow var(--cal-transition-slow);
}
.cal-hero__frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cal-hero__frame::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1px solid rgba(201, 168, 76, 0.2);
  z-index: 1;
  pointer-events: none;
}
.cal-hero__frame:hover {
  box-shadow: 0 0 0 8px var(--cal-surface), 0 0 0 10px var(--cal-accent-rose), 0 0 0 18px var(--cal-surface), 0 0 0 19px var(--cal-border), 0 0 40px rgba(201, 168, 76, 0.2);
}
.cal-hero--centered {
  grid-template-columns: 1fr;
  text-align: center;
  justify-items: center;
}
.cal-hero--centered .cal-hero__content {
  align-items: center;
}
.cal-hero--centered .cal-hero__body {
  max-width: 600px;
}
.cal-hero--centered .cal-hero__actions {
  justify-content: center;
}
.cal-hero--reversed {
  grid-template-columns: 55% 45%;
  direction: rtl;
}
.cal-hero--reversed .cal-hero__content,
.cal-hero--reversed .cal-hero__media {
  direction: ltr;
}
@media (max-width: 1024px) {
  .cal-hero {
    grid-template-columns: 1fr 1fr;
    gap: var(--cal-space-xl);
    padding: var(--cal-space-3xl) var(--cal-space-lg);
    min-height: auto;
  }
  .cal-hero__frame {
    width: 300px;
    height: 300px;
  }
  .cal-hero--reversed {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 768px) {
  .cal-hero {
    grid-template-columns: 1fr;
    gap: var(--cal-space-xl);
    padding: var(--cal-space-xl) var(--cal-space-md);
    text-align: center;
  }
  .cal-hero__content {
    order: 2;
    align-items: center;
  }
  .cal-hero__media {
    order: 1;
  }
  .cal-hero__body {
    max-width: 100%;
  }
  .cal-hero__actions {
    justify-content: center;
  }
  .cal-hero__frame {
    width: 260px;
    height: 260px;
  }
  .cal-hero--reversed {
    grid-template-columns: 1fr;
    direction: ltr;
  }
}

.cal.dark .cal-hero__frame, .dark .cal .cal-hero__frame,
.cal[data-theme=dark] .cal-hero__frame, [data-theme=dark] .cal .cal-hero__frame {
  box-shadow: 0 0 0 8px var(--cal-surface), 0 0 0 10px var(--cal-accent-rose), 0 0 0 18px var(--cal-surface), 0 0 0 19px var(--cal-border), 0 0 30px rgba(212, 184, 92, 0.2), 0 0 60px rgba(212, 117, 125, 0.1);
}
.cal.dark .cal-hero__frame::before, .dark .cal .cal-hero__frame::before,
.cal[data-theme=dark] .cal-hero__frame::before, [data-theme=dark] .cal .cal-hero__frame::before {
  border-color: rgba(212, 184, 92, 0.3);
}
.cal.dark .cal-hero__frame:hover, .dark .cal .cal-hero__frame:hover,
.cal[data-theme=dark] .cal-hero__frame:hover, [data-theme=dark] .cal .cal-hero__frame:hover {
  box-shadow: 0 0 0 8px var(--cal-surface), 0 0 0 10px var(--cal-accent-rose), 0 0 0 18px var(--cal-surface), 0 0 0 19px var(--cal-border), 0 0 50px rgba(212, 184, 92, 0.3), 0 0 80px rgba(212, 117, 125, 0.15);
}

.cal-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 24px;
  margin: var(--cal-space-xl) 0;
  position: relative;
}
.cal-divider::before, .cal-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cal-accent-gold), var(--cal-accent-gold));
}
.cal-divider::after {
  background: linear-gradient(90deg, var(--cal-accent-gold), var(--cal-accent-gold), transparent);
}
.cal-divider__ornament {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  margin: 0 16px;
  background-color: var(--cal-accent-gold);
  transform: rotate(45deg);
  border-radius: 2px;
  position: relative;
}
.cal-divider__ornament::before {
  content: "";
  position: absolute;
  inset: -4px;
  border: 1px solid var(--cal-accent-gold);
  border-radius: 2px;
  opacity: 0.4;
}
.cal-divider--vine {
  margin: var(--cal-space-2xl) 0;
}
.cal-divider--vine::before {
  background: linear-gradient(90deg, transparent, var(--cal-accent-sage) 30%, var(--cal-accent-gold) 50%);
}
.cal-divider--vine::after {
  background: linear-gradient(90deg, var(--cal-accent-gold) 50%, var(--cal-accent-sage) 70%, transparent);
}
.cal-divider--rose::before {
  background: linear-gradient(90deg, transparent, var(--cal-accent-rose), var(--cal-accent-rose));
}
.cal-divider--rose::after {
  background: linear-gradient(90deg, var(--cal-accent-rose), var(--cal-accent-rose), transparent);
}
.cal-divider--rose .cal-divider__ornament {
  background-color: var(--cal-accent-rose);
}
.cal-divider--rose .cal-divider__ornament::before {
  border-color: var(--cal-accent-rose);
}

.cal-corner {
  position: absolute;
  width: 40px;
  height: 40px;
  pointer-events: none;
  z-index: 1;
}
.cal-corner::before, .cal-corner::after {
  content: "";
  position: absolute;
}
.cal-corner::before {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, var(--cal-accent-gold), transparent);
  top: 0;
  left: 0;
}
.cal-corner::after {
  width: 2px;
  height: 100%;
  background: linear-gradient(180deg, var(--cal-accent-gold), transparent);
  top: 0;
  left: 0;
}
.cal-corner__dot {
  position: absolute;
  top: -2px;
  left: -2px;
  width: 6px;
  height: 6px;
  background-color: var(--cal-accent-gold);
  border-radius: 50%;
}
.cal-corner--top-left {
  top: 0;
  left: 0;
}
.cal-corner--top-right {
  top: 0;
  right: 0;
  left: auto;
  transform: scaleX(-1);
}
.cal-corner--bottom-left {
  bottom: 0;
  left: 0;
  top: auto;
  transform: scaleY(-1);
}
.cal-corner--bottom-right {
  bottom: 0;
  right: 0;
  top: auto;
  left: auto;
  transform: scale(-1);
}
.cal-corner--lg {
  width: 60px;
  height: 60px;
}
.cal-corner--lg .cal-corner__dot {
  width: 8px;
  height: 8px;
  top: -3px;
  left: -3px;
}

.cal-frame {
  position: relative;
  padding: var(--cal-space-xl);
  border: 1px solid var(--cal-border);
  border-radius: var(--cal-radius-card);
  box-shadow: inset 0 0 0 6px var(--cal-surface), inset 0 0 0 7px var(--cal-accent-gold);
  background-color: var(--cal-surface);
  transition: box-shadow var(--cal-transition);
}
.cal-frame:hover {
  box-shadow: inset 0 0 0 6px var(--cal-surface), inset 0 0 0 7px var(--cal-accent-gold), var(--cal-shadow-glow-gold);
}
.cal-frame--circle {
  border-radius: 50%;
  padding: var(--cal-space-2xl);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 0 0 6px var(--cal-surface), inset 0 0 0 7px var(--cal-accent-gold), 0 0 0 4px var(--cal-surface), 0 0 0 5px var(--cal-accent-rose);
}
.cal-frame--rose {
  border-color: rgba(196, 97, 106, 0.3);
  box-shadow: inset 0 0 0 6px var(--cal-surface), inset 0 0 0 7px var(--cal-accent-rose);
}
.cal-frame--rose:hover {
  box-shadow: inset 0 0 0 6px var(--cal-surface), inset 0 0 0 7px var(--cal-accent-rose), var(--cal-shadow-glow-rose);
}

.cal-ornament__flourish {
  display: inline-block;
  width: 24px;
  height: 24px;
  position: relative;
}
.cal-ornament__flourish::before {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  top: 4px;
  left: 4px;
  border: 2px solid var(--cal-accent-gold);
  border-radius: 50% 0;
  transform: rotate(-45deg);
}
.cal-ornament__flourish::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 12px;
  top: 10px;
  left: 12px;
  background-color: var(--cal-accent-gold);
  transform: rotate(-45deg);
  transform-origin: top center;
}
.cal-ornament__flourish--rose::before {
  border-color: var(--cal-accent-rose);
}
.cal-ornament__flourish--rose::after {
  background-color: var(--cal-accent-rose);
}
.cal-ornament__flourish--sage::before {
  border-color: var(--cal-accent-sage);
}
.cal-ornament__flourish--sage::after {
  background-color: var(--cal-accent-sage);
}
.cal-ornament__flourish--sm {
  width: 16px;
  height: 16px;
}
.cal-ornament__flourish--sm::before {
  width: 10px;
  height: 10px;
  top: 3px;
  left: 3px;
}
.cal-ornament__flourish--sm::after {
  height: 8px;
  top: 7px;
  left: 8px;
}
.cal-ornament__flourish--lg {
  width: 36px;
  height: 36px;
}
.cal-ornament__flourish--lg::before {
  width: 24px;
  height: 24px;
  top: 6px;
  left: 6px;
  border-width: 3px;
}
.cal-ornament__flourish--lg::after {
  width: 2px;
  height: 18px;
  top: 14px;
  left: 18px;
}

.cal.dark .cal-frame--rose, .dark .cal .cal-frame--rose,
.cal[data-theme=dark] .cal-frame--rose, [data-theme=dark] .cal .cal-frame--rose {
  border-color: rgba(212, 117, 125, 0.3);
}

.cal-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-position: center;
  mask-position: center;
  vertical-align: middle;
  flex-shrink: 0;
}
.cal-icon--flower {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22c0-4-2-6-2-10S12 2 12 2s2 6 2 10-2 6-2 10'/%3E%3Cpath d='M12 12c-4-2-6-4-9-3 2 3 5 4 9 3z'/%3E%3Cpath d='M12 12c4-2 6-4 9-3-2 3-5 4-9 3z'/%3E%3Cpath d='M12 16c-3-1-5-3-8-2 2 3 5 3 8 2z'/%3E%3Cpath d='M12 16c3-1 5-3 8-2-2 3-5 3-8 2z'/%3E%3Ccircle cx='12' cy='7' r='1.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22c0-4-2-6-2-10S12 2 12 2s2 6 2 10-2 6-2 10'/%3E%3Cpath d='M12 12c-4-2-6-4-9-3 2 3 5 4 9 3z'/%3E%3Cpath d='M12 12c4-2 6-4 9-3-2 3-5 4-9 3z'/%3E%3Cpath d='M12 16c-3-1-5-3-8-2 2 3 5 3 8 2z'/%3E%3Cpath d='M12 16c3-1 5-3 8-2-2 3-5 3-8 2z'/%3E%3Ccircle cx='12' cy='7' r='1.5'/%3E%3C/svg%3E");
}
.cal-icon--vine {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20C4 20 6 14 10 12c4-2 6-4 7-8'/%3E%3Cpath d='M17 4c0 0-1 3-4 4'/%3E%3Cpath d='M14 8c2 0 4-1 5-3'/%3E%3Cpath d='M10 12c-2 0-4 1-6 0'/%3E%3Cpath d='M10 12c0 2-2 4-3 5'/%3E%3Cpath d='M8 15c0 0 2-1 4-1s3 1 3 1'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20C4 20 6 14 10 12c4-2 6-4 7-8'/%3E%3Cpath d='M17 4c0 0-1 3-4 4'/%3E%3Cpath d='M14 8c2 0 4-1 5-3'/%3E%3Cpath d='M10 12c-2 0-4 1-6 0'/%3E%3Cpath d='M10 12c0 2-2 4-3 5'/%3E%3Cpath d='M8 15c0 0 2-1 4-1s3 1 3 1'/%3E%3C/svg%3E");
}
.cal-icon--feather {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21C5 21 8 15 12 10c4-5 7-8 7-8'/%3E%3Cellipse cx='14' cy='7' rx='4' ry='5.5' transform='rotate(-15 14 7)'/%3E%3Cellipse cx='14' cy='7' rx='2' ry='3.5' transform='rotate(-15 14 7)'/%3E%3Ccircle cx='14' cy='6' r='1'/%3E%3Cpath d='M10 13c-1 2-3 4-5 5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21C5 21 8 15 12 10c4-5 7-8 7-8'/%3E%3Cellipse cx='14' cy='7' rx='4' ry='5.5' transform='rotate(-15 14 7)'/%3E%3Cellipse cx='14' cy='7' rx='2' ry='3.5' transform='rotate(-15 14 7)'/%3E%3Ccircle cx='14' cy='6' r='1'/%3E%3Cpath d='M10 13c-1 2-3 4-5 5'/%3E%3C/svg%3E");
}
.cal-icon--dragonfly {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 8v12'/%3E%3Ccircle cx='12' cy='6' r='2'/%3E%3Cpath d='M12 10C8 8 3 5 2 6s3 5 5 6c2 1 5 0 5-2z'/%3E%3Cpath d='M12 10c4-2 9-5 10-4s-3 5-5 6c-2 1-5 0-5-2z'/%3E%3Cpath d='M12 14c-3-1-7-3-8-2s2 4 4 4c2 1 4 0 4-2z'/%3E%3Cpath d='M12 14c3-1 7-3 8-2s-2 4-4 4c-2 1-4 0-4-2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 8v12'/%3E%3Ccircle cx='12' cy='6' r='2'/%3E%3Cpath d='M12 10C8 8 3 5 2 6s3 5 5 6c2 1 5 0 5-2z'/%3E%3Cpath d='M12 10c4-2 9-5 10-4s-3 5-5 6c-2 1-5 0-5-2z'/%3E%3Cpath d='M12 14c-3-1-7-3-8-2s2 4 4 4c2 1 4 0 4-2z'/%3E%3Cpath d='M12 14c3-1 7-3 8-2s-2 4-4 4c-2 1-4 0-4-2z'/%3E%3C/svg%3E");
}
.cal-icon--butterfly {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v16'/%3E%3Cpath d='M12 7C8 4 3 3 2 5s2 6 5 7c3 1 5-1 5-5z'/%3E%3Cpath d='M12 7c4-3 9-4 10-2s-2 6-5 7c-3 1-5-1-5-5z'/%3E%3Cpath d='M12 14c-3-1-6-1-7 1s1 5 3 5c3 1 4-2 4-6z'/%3E%3Cpath d='M12 14c3-1 6-1 7 1s-1 5-3 5c-3 1-4-2-4-6z'/%3E%3Ccircle cx='11' cy='4' r='0.5'/%3E%3Ccircle cx='13' cy='4' r='0.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v16'/%3E%3Cpath d='M12 7C8 4 3 3 2 5s2 6 5 7c3 1 5-1 5-5z'/%3E%3Cpath d='M12 7c4-3 9-4 10-2s-2 6-5 7c-3 1-5-1-5-5z'/%3E%3Cpath d='M12 14c-3-1-6-1-7 1s1 5 3 5c3 1 4-2 4-6z'/%3E%3Cpath d='M12 14c3-1 6-1 7 1s-1 5-3 5c-3 1-4-2-4-6z'/%3E%3Ccircle cx='11' cy='4' r='0.5'/%3E%3Ccircle cx='13' cy='4' r='0.5'/%3E%3C/svg%3E");
}
.cal-icon--leaf {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20C4 20 8 10 17 4c0 0-3 8-6 11S4 20 4 20z'/%3E%3Cpath d='M4 20C8 16 12 11 17 4'/%3E%3Cpath d='M9 14c2-2 4-3 6-5'/%3E%3Cpath d='M7 17c1-2 3-3 5-5'/%3E%3Cpath d='M11 11c2-1 3-3 4-5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20C4 20 8 10 17 4c0 0-3 8-6 11S4 20 4 20z'/%3E%3Cpath d='M4 20C8 16 12 11 17 4'/%3E%3Cpath d='M9 14c2-2 4-3 6-5'/%3E%3Cpath d='M7 17c1-2 3-3 5-5'/%3E%3Cpath d='M11 11c2-1 3-3 4-5'/%3E%3C/svg%3E");
}
.cal-icon--sun {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2c0 2-1 4 0 6'/%3E%3Cpath d='M19 5c-2 1-3 3-3 5'/%3E%3Cpath d='M22 12c-2 0-4-1-6 0'/%3E%3Cpath d='M19 19c-1-2-3-3-5-3'/%3E%3Cpath d='M12 22c0-2 1-4 0-6'/%3E%3Cpath d='M5 19c2-1 3-3 3-5'/%3E%3Cpath d='M2 12c2 0 4 1 6 0'/%3E%3Cpath d='M5 5c1 2 3 3 5 3'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2c0 2-1 4 0 6'/%3E%3Cpath d='M19 5c-2 1-3 3-3 5'/%3E%3Cpath d='M22 12c-2 0-4-1-6 0'/%3E%3Cpath d='M19 19c-1-2-3-3-5-3'/%3E%3Cpath d='M12 22c0-2 1-4 0-6'/%3E%3Cpath d='M5 19c2-1 3-3 3-5'/%3E%3Cpath d='M2 12c2 0 4 1 6 0'/%3E%3Cpath d='M5 5c1 2 3 3 5 3'/%3E%3C/svg%3E");
}
.cal-icon--moon {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 14c-1.5 3-5 5.5-9 5.5C6 19.5 2 15.5 2 10.5 2 6.5 4.5 3 8 1.5c-1 3-.5 6.5 1.5 9s5.5 4 9 3.5z'/%3E%3Cpath d='M16 6c0 0 1 1 0 2s-2 1-2 1'/%3E%3Ccircle cx='18' cy='4' r='0.5'/%3E%3Ccircle cx='20' cy='8' r='0.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 14c-1.5 3-5 5.5-9 5.5C6 19.5 2 15.5 2 10.5 2 6.5 4.5 3 8 1.5c-1 3-.5 6.5 1.5 9s5.5 4 9 3.5z'/%3E%3Cpath d='M16 6c0 0 1 1 0 2s-2 1-2 1'/%3E%3Ccircle cx='18' cy='4' r='0.5'/%3E%3Ccircle cx='20' cy='8' r='0.5'/%3E%3C/svg%3E");
}
.cal-icon--lyre {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 22h8'/%3E%3Cpath d='M12 22v-4'/%3E%3Cpath d='M7 18c-3-3-4-8-2-13'/%3E%3Cpath d='M17 18c3-3 4-8 2-13'/%3E%3Cpath d='M5 5c1-2 3-3 5-3'/%3E%3Cpath d='M19 5c-1-2-3-3-5-3'/%3E%3Cpath d='M14 2c0 1-1 2-2 2S10 3 10 2'/%3E%3Cpath d='M9 7v11'/%3E%3Cpath d='M12 6v12'/%3E%3Cpath d='M15 7v11'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 22h8'/%3E%3Cpath d='M12 22v-4'/%3E%3Cpath d='M7 18c-3-3-4-8-2-13'/%3E%3Cpath d='M17 18c3-3 4-8 2-13'/%3E%3Cpath d='M5 5c1-2 3-3 5-3'/%3E%3Cpath d='M19 5c-1-2-3-3-5-3'/%3E%3Cpath d='M14 2c0 1-1 2-2 2S10 3 10 2'/%3E%3Cpath d='M9 7v11'/%3E%3Cpath d='M12 6v12'/%3E%3Cpath d='M15 7v11'/%3E%3C/svg%3E");
}
.cal-icon--scroll {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3c-2 0-3 1-3 3v10c0 2 1 3 3 3'/%3E%3Cpath d='M6 19c2 0 3-1 3-3V6'/%3E%3Cpath d='M9 6c0-2 1-3 3-3h6c2 0 3 1 3 3'/%3E%3Cpath d='M21 6c0 2-1 3-3 3H9'/%3E%3Cpath d='M9 9v10c0 2-1 3-3 3'/%3E%3Cpath d='M18 19c2 0 3 1 3 3'/%3E%3Cpath d='M15 9c0 2 1 3 3 3h0c2 0 3 1 3 3v4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3c-2 0-3 1-3 3v10c0 2 1 3 3 3'/%3E%3Cpath d='M6 19c2 0 3-1 3-3V6'/%3E%3Cpath d='M9 6c0-2 1-3 3-3h6c2 0 3 1 3 3'/%3E%3Cpath d='M21 6c0 2-1 3-3 3H9'/%3E%3Cpath d='M9 9v10c0 2-1 3-3 3'/%3E%3Cpath d='M18 19c2 0 3 1 3 3'/%3E%3Cpath d='M15 9c0 2 1 3 3 3h0c2 0 3 1 3 3v4'/%3E%3C/svg%3E");
}
.cal-icon--heart {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21C12 21 3 15 3 9c0-3 2-5 5-5 2 0 3 1 4 3 1-2 2-3 4-3 3 0 5 2 5 5 0 6-9 12-9 12z'/%3E%3Cpath d='M12 21c0 0-2-3-2-6'/%3E%3Cpath d='M8 10c1 1 2 3 2 5'/%3E%3Cpath d='M16 10c-1 1-2 3-2 5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21C12 21 3 15 3 9c0-3 2-5 5-5 2 0 3 1 4 3 1-2 2-3 4-3 3 0 5 2 5 5 0 6-9 12-9 12z'/%3E%3Cpath d='M12 21c0 0-2-3-2-6'/%3E%3Cpath d='M8 10c1 1 2 3 2 5'/%3E%3Cpath d='M16 10c-1 1-2 3-2 5'/%3E%3C/svg%3E");
}
.cal-icon--star {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2c0 3-1 5 0 8'/%3E%3Cpath d='M12 10c1-3 3-5 6-7'/%3E%3Cpath d='M12 10c3 1 5 1 8 0'/%3E%3Cpath d='M12 10c2 2 4 4 7 5'/%3E%3Cpath d='M12 10c0 3 1 6 2 9'/%3E%3Cpath d='M12 10c-1 3-3 6-5 8'/%3E%3Cpath d='M12 10c-3 1-5 2-8 2'/%3E%3Cpath d='M12 10c-3-1-5-2-7-4'/%3E%3Ccircle cx='12' cy='10' r='1.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2c0 3-1 5 0 8'/%3E%3Cpath d='M12 10c1-3 3-5 6-7'/%3E%3Cpath d='M12 10c3 1 5 1 8 0'/%3E%3Cpath d='M12 10c2 2 4 4 7 5'/%3E%3Cpath d='M12 10c0 3 1 6 2 9'/%3E%3Cpath d='M12 10c-1 3-3 6-5 8'/%3E%3Cpath d='M12 10c-3 1-5 2-8 2'/%3E%3Cpath d='M12 10c-3-1-5-2-7-4'/%3E%3Ccircle cx='12' cy='10' r='1.5'/%3E%3C/svg%3E");
}
.cal-icon--sm {
  width: 16px;
  height: 16px;
}
.cal-icon--lg {
  width: 32px;
  height: 32px;
}
.cal-icon--xl {
  width: 48px;
  height: 48px;
}
.cal-icon--sway {
  animation: cal-sway 3s ease-in-out infinite;
}
.cal-icon--pulse {
  animation: cal-pulse 2s ease-in-out infinite;
}
.cal-icon--spin {
  animation: cal-spin 8s linear infinite;
}

@keyframes cal-sway {
  0%, 100% {
    transform: rotate(-3deg);
  }
  50% {
    transform: rotate(3deg);
  }
}
@keyframes cal-pulse {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.15);
    opacity: 0.8;
  }
}
@keyframes cal-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.cal-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--cal-space-xl);
}
.cal-gallery__item {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--cal-space-sm);
}
.cal-gallery__image {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  background-color: var(--cal-bg-secondary);
}
.cal-gallery__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  object-fit: cover;
  transition: transform var(--cal-transition-slow);
}
.cal-gallery__image:hover img {
  transform: scale(1.04);
}
.cal-gallery__corners {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
}
.cal-gallery__corners::before, .cal-gallery__corners::after {
  content: "";
  position: absolute;
  width: 28px;
  height: 28px;
  opacity: 0;
  transition: opacity var(--cal-transition);
}
.cal-gallery__corners::before {
  top: 8px;
  left: 8px;
  border-top: 2px solid var(--cal-accent-gold);
  border-left: 2px solid var(--cal-accent-gold);
  border-top-left-radius: 4px;
}
.cal-gallery__corners::after {
  top: 8px;
  right: 8px;
  border-top: 2px solid var(--cal-accent-gold);
  border-right: 2px solid var(--cal-accent-gold);
  border-top-right-radius: 4px;
}
.cal-gallery__image::before, .cal-gallery__image::after {
  content: "";
  position: absolute;
  width: 28px;
  height: 28px;
  z-index: 2;
  opacity: 0;
  transition: opacity var(--cal-transition);
}
.cal-gallery__image::before {
  bottom: 8px;
  left: 8px;
  border-bottom: 2px solid var(--cal-accent-gold);
  border-left: 2px solid var(--cal-accent-gold);
  border-bottom-left-radius: 4px;
}
.cal-gallery__image::after {
  bottom: 8px;
  right: 8px;
  border-bottom: 2px solid var(--cal-accent-gold);
  border-right: 2px solid var(--cal-accent-gold);
  border-bottom-right-radius: 4px;
}
.cal-gallery__item:hover .cal-gallery__corners::before, .cal-gallery__item:hover .cal-gallery__corners::after, .cal-gallery__item:hover .cal-gallery__image::before, .cal-gallery__item:hover .cal-gallery__image::after {
  opacity: 1;
}
.cal-gallery__caption {
  font-family: var(--cal-font-display);
  font-size: var(--cal-text-sm);
  font-style: italic;
  color: var(--cal-text-secondary);
  padding: 4px 4px 0;
  line-height: 1.4;
}
.cal-gallery--masonry {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
.cal-gallery--masonry .cal-gallery__image img {
  aspect-ratio: unset;
}
.cal-gallery--compact {
  gap: var(--cal-space-md);
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}
.cal-gallery--compact .cal-gallery__image {
  border-radius: var(--cal-radius);
}
@media (max-width: 768px) {
  .cal-gallery {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: var(--cal-space-md);
  }
}

.cal.dark .cal-gallery__item:hover .cal-gallery__corners::before,
.cal.dark .cal-gallery__item:hover .cal-gallery__corners::after,
.cal.dark .cal-gallery__item:hover .cal-gallery__image::before,
.cal.dark .cal-gallery__item:hover .cal-gallery__image::after, .dark .cal .cal-gallery__item:hover .cal-gallery__corners::before,
.dark .cal .cal-gallery__item:hover .cal-gallery__corners::after,
.dark .cal .cal-gallery__item:hover .cal-gallery__image::before,
.dark .cal .cal-gallery__item:hover .cal-gallery__image::after,
.cal[data-theme=dark] .cal-gallery__item:hover .cal-gallery__corners::before,
.cal[data-theme=dark] .cal-gallery__item:hover .cal-gallery__corners::after,
.cal[data-theme=dark] .cal-gallery__item:hover .cal-gallery__image::before,
.cal[data-theme=dark] .cal-gallery__item:hover .cal-gallery__image::after, [data-theme=dark] .cal .cal-gallery__item:hover .cal-gallery__corners::before,
[data-theme=dark] .cal .cal-gallery__item:hover .cal-gallery__corners::after,
[data-theme=dark] .cal .cal-gallery__item:hover .cal-gallery__image::before,
[data-theme=dark] .cal .cal-gallery__item:hover .cal-gallery__image::after {
  filter: drop-shadow(0 0 4px rgba(212, 184, 92, 0.4));
}

.cal-illustration--circle-frame {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--cal-surface);
  border: 3px solid var(--cal-accent-gold);
  box-shadow: inset 0 0 30px rgba(196, 97, 106, 0.12), 0 0 0 6px var(--cal-surface), 0 0 0 8px var(--cal-accent-teal), 0 0 0 14px var(--cal-surface), 0 0 0 16px var(--cal-accent-gold), 0 0 0 22px var(--cal-bg), 0 0 0 23px var(--cal-border-subtle), 0 0 40px rgba(201, 168, 76, 0.1);
}
.cal-illustration--circle-frame::before {
  content: "";
  position: absolute;
  width: 75%;
  height: 75%;
  border-radius: 50%;
  border: 1px solid var(--cal-accent-gold);
  opacity: 0.4;
}
.cal-illustration--circle-frame::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--cal-accent-gold), var(--cal-accent-rose));
}
.cal-illustration--circle-frame.cal-illustration--sm {
  width: 120px;
  height: 120px;
}
.cal-illustration--circle-frame.cal-illustration--lg {
  width: 300px;
  height: 300px;
}

.cal-illustration--vine-border {
  width: 100%;
  height: 40px;
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.cal-illustration--vine-border::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  top: 50%;
  transform: translateY(-50%);
  background: linear-gradient(90deg, transparent 0%, var(--cal-accent-sage) 15%, var(--cal-accent-gold) 35%, var(--cal-accent-rose) 50%, var(--cal-accent-gold) 65%, var(--cal-accent-sage) 85%, transparent 100%);
}
.cal-illustration--vine-border::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(ellipse 20px 12px at 50% 30%, transparent 60%, var(--cal-accent-sage) 60%, var(--cal-accent-sage) 63%, transparent 63%), radial-gradient(ellipse 20px 12px at 50% 70%, transparent 60%, var(--cal-accent-gold) 60%, var(--cal-accent-gold) 63%, transparent 63%);
  background-size: 60px 40px;
  background-repeat: repeat-x;
  background-position: 0 0, 30px 0;
  opacity: 0.5;
}
.cal-illustration--vine-border.cal-illustration--narrow {
  height: 20px;
}

.cal-illustration--corner-piece {
  width: 60px;
  height: 60px;
  position: relative;
}
.cal-illustration--corner-piece::before {
  content: "";
  position: absolute;
  width: 50px;
  height: 50px;
  top: 0;
  left: 0;
  border: 2px solid transparent;
  border-top-color: var(--cal-accent-gold);
  border-left-color: var(--cal-accent-gold);
  border-top-left-radius: 24px;
}
.cal-illustration--corner-piece::after {
  content: "";
  position: absolute;
  width: 24px;
  height: 24px;
  top: 8px;
  left: 8px;
  border: 2px solid transparent;
  border-top-color: var(--cal-accent-rose);
  border-left-color: var(--cal-accent-rose);
  border-top-left-radius: 16px;
  opacity: 0.7;
}
.cal-illustration--corner-piece > .cal-illustration__leaf {
  position: absolute;
  width: 12px;
  height: 12px;
  bottom: 10px;
  right: 10px;
  border: 1.5px solid var(--cal-accent-sage);
  border-radius: 50% 0;
  transform: rotate(-45deg);
  opacity: 0.6;
}
.cal-illustration--corner-piece.cal-illustration--top-right {
  transform: scaleX(-1);
}
.cal-illustration--corner-piece.cal-illustration--bottom-left {
  transform: scaleY(-1);
}
.cal-illustration--corner-piece.cal-illustration--bottom-right {
  transform: scale(-1);
}
.cal-illustration--corner-piece.cal-illustration--sm {
  width: 40px;
  height: 40px;
}
.cal-illustration--corner-piece.cal-illustration--sm::before {
  width: 32px;
  height: 32px;
  border-top-left-radius: 16px;
}
.cal-illustration--corner-piece.cal-illustration--sm::after {
  width: 16px;
  height: 16px;
  top: 6px;
  left: 6px;
  border-top-left-radius: 10px;
}
.cal-illustration--corner-piece.cal-illustration--lg {
  width: 90px;
  height: 90px;
}
.cal-illustration--corner-piece.cal-illustration--lg::before {
  width: 74px;
  height: 74px;
  border-width: 3px;
  border-top-left-radius: 36px;
}
.cal-illustration--corner-piece.cal-illustration--lg::after {
  width: 36px;
  height: 36px;
  top: 12px;
  left: 12px;
  border-top-left-radius: 24px;
}

.cal.dark .cal-illustration--circle-frame, .dark .cal .cal-illustration--circle-frame,
.cal[data-theme=dark] .cal-illustration--circle-frame, [data-theme=dark] .cal .cal-illustration--circle-frame {
  box-shadow: inset 0 0 30px rgba(212, 117, 125, 0.15), 0 0 0 6px var(--cal-surface), 0 0 0 8px var(--cal-accent-teal), 0 0 0 14px var(--cal-surface), 0 0 0 16px var(--cal-accent-gold), 0 0 0 22px var(--cal-bg), 0 0 0 23px var(--cal-border-subtle), 0 0 50px rgba(212, 184, 92, 0.15);
}
.cal.dark .cal-illustration--vine-border::after, .dark .cal .cal-illustration--vine-border::after,
.cal[data-theme=dark] .cal-illustration--vine-border::after, [data-theme=dark] .cal .cal-illustration--vine-border::after {
  opacity: 0.65;
}