html { scroll-behavior: smooth; }
body { margin: 0; background: #faf5ef; font-family: 'Jost', system-ui, sans-serif; color: #241b18; overflow-x: hidden; -webkit-font-smoothing: antialiased; text-wrap: pretty; }
* { box-sizing: border-box; }
summary::-webkit-details-marker { display: none; }
nav::-webkit-scrollbar { display: none; }
a { color: #6d2450; text-decoration: none; }
a:hover { color: #4e1839; }
input, textarea, button { font: inherit; color: inherit; }

@keyframes emberDrift { 0% { transform: translate3d(0,0,0) scale(1); opacity: .5; } 50% { transform: translate3d(0,-14px,0) scale(1.04); opacity: .85; } 100% { transform: translate3d(0,0,0) scale(1); opacity: .5; } }
@keyframes hairline { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes sheen { 0% { transform: translateX(-130%) skewX(-18deg); } 55%, 100% { transform: translateX(320%) skewX(-18deg); } }
@keyframes twinkle { 0%, 100% { opacity: .35; transform: scale(.9); } 50% { opacity: 1; transform: scale(1.08); } }

/* breakpoint switches: nav vs. hamburger, wide vs. mobile hero art */
.om-burger { display: none; }
.om-hero-mobile { display: none; }
.om-menu { display: none; }
.om-menu.is-open { display: flex; }

@media (max-width: 860px) {
  .om-nav-desktop { display: none !important; }
  .om-burger { display: flex !important; }
  .om-hero-wide { display: none !important; }
  .om-hero-mobile { display: block !important; }
}

/* hover states (from Claude Design's style-hover) */
.hov1:hover { color:#6d2450 }
.hov2:hover { color:#6d2450 }
.hov3:hover { color:#6d2450 }
.hov4:hover { color:#6d2450 }
.hov5:hover { color:#6d2450 }
.hov6:hover { color:#6d2450 }
.hov7:hover { background:linear-gradient(180deg,#f8e8c6 0%,#eed7a6 52%,#dcbc7e 100%);color:#40142f;transform:translateY(-2px) }
.hov8:hover { transform:translateY(-3px);border-color:rgba(201,163,73,0.6) }
.hov9:hover { transform:translateY(-3px);border-color:rgba(201,163,73,0.6) }
.hov10:hover { transform:translateY(-3px);border-color:rgba(201,163,73,0.6) }
.hov11:hover { transform:translateY(-3px);border-color:rgba(201,163,73,0.6) }
.hov12:hover { transform:translateY(-3px);border-color:rgba(201,163,73,0.6) }
.hov13:hover { transform:translateY(-3px);border-color:rgba(201,163,73,0.6) }
.hov14:hover { background:linear-gradient(180deg,#6d2450 0%,#4e1839 60%,#3e1230 100%);color:#fdf8f2;transform:translateY(-2px) }
.hov15:hover { transform:translateY(-3px);border-color:rgba(201,163,73,0.6);box-shadow:0 38px 72px -40px rgba(74,40,62,0.55), inset 0 1px 0 rgba(255,255,255,0.9) }
.hov16:hover { transform:translateY(-3px);border-color:rgba(201,163,73,0.6);box-shadow:0 38px 72px -40px rgba(74,40,62,0.55), inset 0 1px 0 rgba(255,255,255,0.9) }
.hov17:hover { transform:translateY(-3px);border-color:rgba(201,163,73,0.6);box-shadow:0 38px 72px -40px rgba(74,40,62,0.55), inset 0 1px 0 rgba(255,255,255,0.9) }
.hov18:hover { color:#6d2450 }
.hov19:hover { color:#6d2450 }
.hov20:hover { color:#6d2450 }
.hov21:hover { color:#6d2450 }
.hov22:hover { background:linear-gradient(180deg,#6d2450 0%,#4e1839 60%,#3e1230 100%);color:#fdf8f2;transform:translateY(-2px) }
.hov23:hover { background:linear-gradient(180deg,#6d2450 0%,#4e1839 60%,#3e1230 100%);transform:translateY(-2px);box-shadow:0 24px 46px -16px rgba(109,36,80,0.9) }
.hov24:hover { background:#f4e4ef }
.hov25:hover { color:#e3c98f }
.hov26:hover { color:#e3c98f }
.hov27:hover { color:#e3c98f }
.hov28:hover { color:#e3c98f }
.hov29:hover { color:#e3c98f }
.hov30:hover { color:#e3c98f }
.hov31:hover { color:#e3c98f }
.hov32:hover { color:#e3c98f }
.hov33:hover { background:linear-gradient(180deg,#6d2450 0%,#4e1839 60%,#3e1230 100%);color:#fdf8f2;transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(109,36,80,0.8) }

/* focus states (from Claude Design's style-focus) */
.foc1:focus { border-color:#6d2450;background:#fffaf4 }
.foc2:focus { border-color:#6d2450;background:#fffaf4 }
.foc3:focus { border-color:#6d2450;background:#fffaf4 }
.foc4:focus { border-color:#6d2450;background:#fffaf4 }