/* Palette sampled from the supplied Asmo Cake logo (#9f79b6). */
:root {
  --brand: #9f79b6;
  --cream: #faf7fc;
  --paper: #fff;
  --dark: #32233d;
  --muted: #706576;
  --rose: #79538f;
  --rose-light: #efe5f4;
  --gold: #79538f;
  --line: #e8dfed;
  --serif: 'Outfit', Arial, sans-serif;
}

.site-header {
  background: var(--brand);
  border-bottom-color: rgba(255,255,255,.16);
}
.logo-crop { display: block; width: 190px; height: 48px; overflow: hidden; }
.logo-crop img { display: block; width: 190px; max-width: none; height: auto; transform: translateY(-111px); }
.desktop-nav a { color: #fff; }
.header-order { background: #fff; color: var(--dark); }
.menu-toggle { border-color: rgba(255,255,255,.55); }
.menu-toggle span { background: #fff; }
.mobile-nav { background: var(--brand); border-top-color: rgba(255,255,255,.2); }
.mobile-nav a { color: #fff; border-bottom-color: rgba(255,255,255,.2); }

.hero { background: radial-gradient(circle at 78% 44%, #efe4f5 0, #faf7fc 52%); }
.hero h1, .section-heading h2, .builder h2, .closing h2 { letter-spacing: -.055em; font-weight: 700; }
h1 em, h2 em { font-style: normal; font-weight: 500; color: var(--rose); }
.hero-image-wrap { background: #ded0e7; box-shadow: 0 25px 65px rgba(67,35,83,.15); }
.hero-sticker { width: 158px; height: 158px; padding: 0; overflow: hidden; border-color: var(--cream); border-radius: 24px; background: var(--brand); box-shadow: 0 10px 30px rgba(49,23,63,.22); transform: rotate(-8deg); }
.hero-sticker img { width: 100%; height: 100%; object-fit: cover; }
.hero-sparkle { color: var(--rose); }
.button-outline { border-color: #b49cc3; }

.promise-strip { background: var(--dark); color: #fff; }
.promise-inner span { color: #d4b4e5; }
.products { background: #fff; }
.product-card { border-color: var(--line); box-shadow: 0 9px 30px rgba(67,35,83,.045); }
.product-photo { background: #eee8f1; }
.product-tag { background: rgba(250,247,252,.95); }
.builder { background: #f0e9f4; }
.builder-form { background: #fff; border-color: #e4d8ea; box-shadow: 0 20px 50px rgba(67,35,83,.08); }
.builder-decoration { width: 220px; height: 220px; padding: 0; overflow: hidden; border: 7px solid #fff; border-radius: 27px; box-shadow: 0 18px 40px rgba(67,35,83,.14); transform: rotate(-7deg); }
.builder-decoration img { width: 100%; height: 100%; object-fit: cover; }
.option-card:has(input:checked), .flavor-option:has(input:checked) span { background: #f6eff9; }
.branches { background: var(--cream); }
.branch-card { background: #fff; }
.branch-icon { background: #f0e5f5; }
.closing { background: var(--brand); }
.site-footer { background: var(--brand); }
.footer-main p, .footer-bottom { color: rgba(255,255,255,.82); }
.footer-bottom { border-top-color: rgba(255,255,255,.22); }
.order-dialog { background: #fff; box-shadow: 0 30px 90px rgba(34,19,43,.45); }
.order-dialog::backdrop { background: rgba(34,19,43,.72); }
.dialog-close { background: #f0e9f4; }

@media (hover:hover) and (pointer:fine) {
  .desktop-nav a:hover, .footer-links a:hover, .footer-bottom a:hover { color: #ead8f2; }
  .header-order:hover { background: #f3e9f8; color: var(--dark); }
  .button-dark:hover { background: #4e365c; }
  .button-rose:hover { background: #654478; }
}

@media (max-width:740px) {
  .logo-crop { width: 158px; height: 40px; }
  .logo-crop img { width: 158px; transform: translateY(-93px); }
  .hero-sticker { width: 126px; height: 126px; }
}
@media (max-width:430px) {
  .hero-sticker { width: 108px; height: 108px; border-width: 5px; }
}