:root {
  --purple-deep: #4a1c6b;
  --purple-mid: #7b3fa0;
  --purple-soft: #b07cc6;
  --purple-pale: #eadcf3;
  --blush: #f5ede8;
  --cream: #faf7f4;
  --warm-white: #fffcf9;
  --gold: #c9a96e;
  --text-dark: #2a1a35;
  --text-mid: #5a4a65;
  --text-light: #8b7897;
  --line: rgba(123,63,160,0.14);
  --success: #25D366;
  --success-dark: #1da851;
  --container: 1200px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: 'Jost', sans-serif;
  color: var(--text-dark);
  background: var(--warm-white);
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.container { width: min(var(--container), calc(100% - 32px)); margin: 0 auto; }
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,252,249,.92); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.header-inner { display:flex; align-items:center; justify-content:space-between; min-height:72px; gap:18px; }
.brand { display:flex; flex-direction:column; }
.brand-main { font-family:'Cormorant Garamond',serif; font-size:1.8rem; color:var(--purple-deep); line-height:1; }
.brand-sub { color:var(--purple-soft); font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; }
.main-nav { display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
.main-nav a { font-size:.92rem; color:var(--text-mid); }
.nav-pill { background:var(--purple-deep); color:#fff !important; padding:10px 14px; border-radius:999px; }
.mobile-toggle, .mobile-panel { display:none; }
.hero {
  padding: 88px 0 64px;
  background: radial-gradient(circle at top right, rgba(176,124,198,.14), transparent 30%), radial-gradient(circle at bottom left, rgba(201,169,110,.1), transparent 25%);
}
.hero-grid { display:grid; grid-template-columns: 1.1fr .9fr; gap:48px; align-items:center; }
.eyebrow { text-transform: uppercase; letter-spacing: .18em; color: var(--gold); font-size: .78rem; margin-bottom: 18px; }
.hero h1, .section-title, .page-title, .product-title { font-family:'Cormorant Garamond',serif; color:var(--purple-deep); font-weight:500; }
.hero h1 { font-size: clamp(2.8rem, 5vw, 4.6rem); line-height: 1.05; margin: 0 0 18px; }
.hero p { color: var(--text-mid); font-size: 1.02rem; line-height: 1.8; max-width: 640px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin-top:28px; }
.btn, .btn-outline, .btn-mini, button {
  border: 0; cursor:pointer; border-radius: 999px; padding: 14px 22px; font-family: inherit; font-size:.95rem; transition:.22s ease;
}
.btn { background: var(--success); color:#fff; }
.btn:hover { background: var(--success-dark); transform: translateY(-1px); }
.btn-outline { background: transparent; color: var(--purple-deep); border:1px solid var(--purple-soft); }
.btn-mini { padding: 10px 16px; background: var(--purple-deep); color:#fff; }
.hero-card {
  background: linear-gradient(145deg, #fff, var(--blush));
  border: 1px solid var(--line);
  border-radius: 28px;
  min-height: 420px;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  box-shadow: 0 24px 60px rgba(74,28,107,.08);
  padding: 28px;
}
.hero-card .big-icon { font-size: 6rem; }
.hero-card p { text-align:center; max-width: 320px; }
.section { padding: 72px 0; }
.section-header { text-align:center; max-width: 820px; margin:0 auto 34px; }
.section-title { font-size: clamp(2rem, 4vw, 3.2rem); margin:0 0 14px; }
.section-subtitle { color: var(--text-mid); line-height:1.8; }
.categories-grid, .products-grid, .info-grid, .admin-cards {
  display:grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
}
.category-card, .product-card, .info-card, .admin-card {
  background: #fff; border:1px solid var(--line); border-radius:22px; overflow:hidden; box-shadow: 0 14px 42px rgba(74,28,107,.05);
}
.category-card:hover, .product-card:hover { transform: translateY(-3px); }
.category-visual, .product-visual {
  min-height: 180px; display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--purple-pale), var(--blush)); font-size: 4rem;
}
.category-body, .product-body, .info-card { padding: 20px; }
.category-card h3, .product-card h3, .product-title { margin: 0 0 8px; font-size: 1.45rem; }
.category-card p, .product-card p, .info-card p, .page-content, .product-copy p { color: var(--text-mid); line-height: 1.7; }
.tag, .badge { display:inline-flex; padding:6px 10px; background: var(--purple-pale); color:var(--purple-deep); border-radius:999px; font-size:.75rem; margin-bottom:12px; }
.price { font-family:'Cormorant Garamond',serif; font-size: 1.9rem; color:var(--purple-mid); margin: 14px 0; }
.notice-bar { background: var(--purple-deep); color:#fff; padding: 16px 0; }
.notice-bar-inner { display:flex; gap:24px; flex-wrap:wrap; justify-content:center; font-size:.9rem; }
.split { display:grid; grid-template-columns: 1fr 1fr; gap: 26px; align-items:start; }
.product-grid { display:grid; grid-template-columns: .8fr 1.2fr; gap: 28px; }
.product-gallery {
  background: linear-gradient(135deg, var(--purple-pale), var(--blush)); border-radius:28px; min-height: 420px; display:flex; align-items:center; justify-content:center; font-size:6rem;
}
.product-copy { background:#fff; border:1px solid var(--line); border-radius:28px; padding:26px; }
.meta-list { display:grid; gap:10px; margin:18px 0; }
.meta-item { padding:12px 14px; background:var(--cream); border-radius:16px; }
.cta-row { display:flex; gap:12px; flex-wrap:wrap; margin-top:20px; }
.filters {
  display:flex; gap:12px; flex-wrap:wrap; margin-bottom:22px; align-items:center;
}
.filters input, .filters select, .quote-form input, .quote-form textarea, .admin-form input, .admin-form select, .admin-form textarea {
  width:100%; padding:13px 14px; border-radius:14px; border:1px solid var(--line); font: inherit; background:#fff;
}
.filters .field, .quote-form .field, .admin-form .field { flex:1 1 180px; }
.quote-layout { display:grid; grid-template-columns: 1.15fr .85fr; gap: 26px; }
.quote-box, .quote-summary, .admin-box {
  background:#fff; border:1px solid var(--line); border-radius:24px; padding:22px;
}
.selection-item {
  display:grid; grid-template-columns: 1fr auto; gap: 12px; padding:16px 0; border-bottom:1px dashed var(--line);
}
.selection-item:last-child { border-bottom:0; }
.qty-control { display:flex; align-items:center; gap:8px; }
.qty-control button { padding:8px 10px; border-radius:10px; background:var(--purple-pale); color:var(--purple-deep); }
.total-line { display:flex; justify-content:space-between; gap:16px; padding:10px 0; color:var(--text-mid); }
.total-line strong { color:var(--purple-deep); }
.page-hero { padding: 56px 0 22px; }
.page-title { font-size: clamp(2.4rem, 4vw, 3.6rem); margin:0 0 10px; }
.page-content { max-width: 860px; }
.site-footer { background: var(--text-dark); color: rgba(255,255,255,.8); margin-top: 72px; padding: 46px 0 24px; }
.footer-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:24px; }
.site-footer h3, .site-footer h4 { margin-top:0; color:#fff; }
.footer-bottom { padding-top: 18px; margin-top: 18px; border-top: 1px solid rgba(255,255,255,.12); font-size: .9rem; }
.floating-wa {
  position: fixed; right: 18px; bottom: 18px; width: 58px; height:58px; border-radius:50%; background:var(--success); color:#fff; display:flex; align-items:center; justify-content:center; font-size: 1.5rem; box-shadow: 0 14px 40px rgba(37,211,102,.35); z-index: 60;
}
.search-box { display:flex; gap:10px; margin-top: 18px; }
.search-box input { flex:1; }
.center { text-align:center; }
.small { font-size: .88rem; color: var(--text-light); }
.admin-header { background: var(--purple-deep); color:#fff; padding: 16px 0; margin-bottom: 22px; }
.admin-header .container { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.admin-nav { display:flex; gap:12px; flex-wrap:wrap; }
.admin-nav a { padding: 8px 12px; border-radius: 999px; background: rgba(255,255,255,.12); }
.admin-table { width:100%; border-collapse: collapse; font-size: .94rem; }
.admin-table th, .admin-table td { padding: 12px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align: top; }
.actions { display:flex; gap:8px; flex-wrap:wrap; }
.empty { padding: 18px; background: var(--cream); border-radius: 16px; color: var(--text-mid); }
.flash { padding: 12px 14px; border-radius: 14px; background: #edf8ef; color: #1d6b31; margin-bottom: 14px; }
@media (max-width: 1024px) {
  .categories-grid, .products-grid, .info-grid, .admin-cards { grid-template-columns: repeat(2, 1fr); }
  .hero-grid, .split, .product-grid, .quote-layout, .footer-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .main-nav { display:none; }
  .mobile-toggle { display:block; background:var(--purple-deep); color:#fff; }
  .mobile-panel { display:none; padding:0 16px 16px; border-top:1px solid var(--line); }
  .mobile-panel.is-open { display:grid; gap:10px; }
}
@media (max-width: 640px) {
  .categories-grid, .products-grid, .info-grid, .admin-cards { grid-template-columns: 1fr; }
  .hero { padding-top: 52px; }
  .hero h1 { font-size: 2.45rem; }
  .section { padding: 56px 0; }
}