/* ═══════════════════════════════════════════════════════
   SHARP CORNERS — marketing chrome only
   The simulated product (POS terminal hardware + UI, and the
   full interactive demo environment) keeps its native rounded
   design because it IS the product. Everything else — page
   chrome, buttons, cards, modals — goes square.
═══════════════════════════════════════════════════════ */

/* Match everything that is NOT inside a depicted product surface.
   Carved-out surfaces:
     .pos-device   — the shared POS / iPhone hardware shell (used by
                     the home hero, waiter-terminal page AND the
                     Alfredo AI chatbot demo)
     #demoEnv      — the interactive POS demo environment
   The Alfredo phone now reuses .pos-device, so it picks up the
   carve-out automatically. */
*:not(.pos-device):not(.pos-device *):not(#demoEnv):not(#demoEnv *) {
  border-radius: 0 !important;
}
*:not(.pos-device):not(.pos-device *):not(#demoEnv):not(#demoEnv *)::before,
*:not(.pos-device):not(.pos-device *):not(#demoEnv):not(#demoEnv *)::after {
  border-radius: 0 !important;
}

/* Carve-outs for marketing-side elements that NEED to stay round
   (status LEDs, pulse dots, etc.) */
.hero-eyebrow-dot,
.cc-dot                             { border-radius: 50% !important; }

/* (No further per-element carve-outs needed for .alf-phone — adding
   it to the universal `:not()` chain above means every descendant
   keeps whatever border-radius is set in landing-sections.css.) */

/* Email-form success badge needs to stay a perfect circle even though
   it lives OUTSIDE .alf-phone (it's a sibling of the phone, in the
   left copy column). Same for the demo-request tick badges. */
.dr-success-icon,
.dr-btn-tick,
.alf-btn-tick,
.alf-success-tick                   { border-radius: 50% !important; }

/* Scroll-pin hero tiles use clip-path for rounding (independent of
   border-radius) — no exemption needed for the tiles themselves, but
   we don't want their inner <img> to render with the inset square. */
