:root { --plum: #49315f; --plum-light: #a995bb; --paper: #fffdfd; --swiggy: #fc8019; --zomato: #e23744; }
* { box-sizing: border-box; }
html, body { height: 100%; overflow: hidden; }
body { margin: 0; background: var(--plum); color: var(--paper); font-family: 'DM Sans', sans-serif; }
a { color: inherit; text-decoration: none; }
.hero { min-height: 100vh; min-height: 100dvh; overflow: hidden; position: relative; }
.hero:before, .hero:after { border: 1px solid rgba(213, 194, 222, .18); border-radius: 50%; content: ''; height: 68vw; max-height: 720px; max-width: 720px; position: absolute; width: 68vw; }
.hero:before { left: -48vw; top: 55%; }
.hero:after { bottom: -48vw; right: -42vw; }
.hero-inner { align-items: center; display: flex; flex-direction: column; height: 100dvh; justify-content: space-between; padding: clamp(42px, 8vh, 76px) 24px clamp(27px, 6vh, 58px); position: relative; z-index: 1; }
.brand { display: block; filter: brightness(0) invert(1); height: auto; max-width: 215px; opacity: .96; width: min(49vw, 215px); }
.order-content { left: 50%; position: absolute; text-align: center; top: 50%; transform: translate(-50%, -50%); }
.order-prompt { color: #fff; font-family: 'Playfair Display', Georgia, serif; font-size: clamp(23px, 3vw, 31px); line-height: 1.25; margin: 0 0 clamp(19px, 3vh, 28px); }
.delivery-links { display: grid; gap: 12px; width: min(410px, 82vw); }
.delivery-link { align-items: center; background: var(--paper); border-radius: 3px; box-shadow: 0 10px 28px rgba(24, 11, 34, .1); display: flex; height: clamp(53px, 8vh, 62px); justify-content: center; transition: box-shadow .2s, transform .2s; }
.delivery-link:hover, .delivery-link:focus-visible { box-shadow: 0 14px 34px rgba(24, 11, 34, .28); outline: none; transform: translateY(-2px); }
.delivery-logo { display: block; height: auto; max-height: 45px; object-fit: contain; width: min(47vw, 180px); }
.zomato .delivery-logo { transform: scale(1.35); width: min(47vw, 172px); }
.whatsapp { bottom: 40px; display: block; height:70px; position: absolute; right: 20px; width: clamp(77px, 12vw, 112px); }
.whatsapp img { display: block; height: 100%; object-fit: contain; width: 100%; }
@media (max-width: 420px) { .hero-inner { padding-top: 34px; padding-bottom: 22px; }.brand { width: 171px; }.delivery-links { width: min(296px, 82vw); } }
@media (min-width: 800px) { .hero-inner { padding-left: 7vw; padding-right: 7vw; } }
@media (prefers-reduced-motion: reduce) { .delivery-link { transition: none; } }
