/* Shared storefront and admin theme. Keep semantic status colors intact. */
:root { --babe-ink: #542b44; --babe-rose: #a74459; --babe-paper: #fbf7f3; --babe-line: #eadedb; }
body.bg-gray-50, body.bg-gray-100 { background: var(--babe-paper); color: #382b34; }
h1, h2, h3 { letter-spacing: -.025em; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid var(--babe-rose); outline-offset: 4px; }
.btn-primary, .btn-secondary { border-radius: 999px; font-weight: 600; padding: .75rem 1.5rem; }
.btn-primary:hover, .btn-secondary:hover { transform: translateY(-1px); box-shadow: 0 6px 18px #542b441a; }
.btn-primary:disabled, .btn-secondary:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.input-field { border-color: #d7c5cd; border-radius: 12px; background: #fff; min-height: 44px; }
.input-field:focus { border-color: var(--babe-rose); box-shadow: 0 0 0 3px #a744591c; }
.card { border: 1px solid var(--babe-line); border-radius: 18px; box-shadow: none; }
.card:hover { border-color: #cdaab8; box-shadow: 0 12px 28px #542b4410; }
.card .aspect-square { background: #f3ede9; }
.card .p-4 { padding: 1.25rem; }
.bg-white.rounded-xl { border: 1px solid var(--babe-line); border-radius: 18px; box-shadow: 0 4px 18px #542b4406; }
body > header { border-bottom: 1px solid var(--babe-line); box-shadow: none !important; }
.brand-wordmark { letter-spacing: -.065em; font-weight: 700; font-size: 1.65rem; }
.brand-wordmark::after { content: '.'; color: var(--babe-rose); }
.mobile-store-nav { display: none; gap: 1.5rem; padding: .65rem 1rem; border-top: 1px solid var(--babe-line); font-size: .85rem; color: var(--babe-ink); }
.group:focus-within > .group-hover\:block { display: block; }
body > footer { background: #382433; border-top: 5px solid #deb3b5; }
.babe-hero { background: #f0e2e2; border-bottom: 1px solid var(--babe-line); overflow: hidden; }
.babe-hero-inner { max-width: 1280px; margin: auto; padding: 5rem 1.5rem; display: grid; grid-template-columns: 1.15fr 1fr; gap: 4rem; align-items: center; }
.babe-eyebrow { font-size: .75rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: var(--babe-rose); margin-bottom: 1.25rem; }
.babe-hero h1 { color: var(--babe-ink); font-size: clamp(2.5rem, 5vw, 4.5rem); line-height: 1.06; font-weight: 600; max-width: 650px; }
.babe-hero-copy { color: #695561; line-height: 1.8; margin: 1.5rem 0 2rem; max-width: 470px; }
.babe-hero-actions { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; }
.babe-text-link { color: var(--babe-ink); font-size: .9rem; text-decoration: underline; text-underline-offset: 5px; }
.babe-editorial { background: #fbf7f3; padding: 2rem; border-radius: 140px 140px 20px 20px; min-height: 330px; display: flex; flex-direction: column; justify-content: center; text-align: center; border: 1px solid #e0c5cc; }
.babe-editorial-name { font-family: Georgia, serif; font-style: italic; color: var(--babe-ink); font-size: clamp(3rem, 5vw, 4.75rem); line-height: 1.1; }
.babe-editorial-line { width: 48px; height: 2px; background: var(--babe-rose); margin: 1.5rem auto; }
.babe-editorial-label { color: #765761; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; }
.babe-benefits > div.bg-white { background: transparent; box-shadow: none; border: 0; border-right: 1px solid var(--babe-line); border-radius: 0; padding: 1rem; }
.babe-benefits > div:last-child { border-right: 0; }
.sidebar-link.active { background: #ffffff20; box-shadow: inset 3px 0 #ebbfca; }
.sidebar-link { border-radius: 12px; }
.admin-login-shell { background: #f0e2e2; padding: 1.5rem; }
@media (max-width: 767px) {
    .babe-hero-inner { grid-template-columns: 1fr; padding: 2.75rem 1.25rem; gap: 2rem; }
    .babe-editorial { min-height: 210px; border-radius: 100px 100px 18px 18px; }
    .babe-benefits { gap: .5rem; }
    .babe-benefits > div:nth-child(2) { border-right: 0; }
    .mobile-store-nav { display: flex; }
    .brand-wordmark { font-size: 1.35rem; }
    body > header .btn-primary { padding: .55rem .85rem; }
    main > .min-h-\[70vh\] { padding-left: 1rem; padding-right: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
    .btn-primary:hover, .btn-secondary:hover, .card:hover img { transform: none; }
}
