:root{
/* Handel & Mack keeps corners tight: images, fields and bands sit at 0,
   buttons and hero tiles at 5px, the floating header at 15px, the mega-menu
   panel at 20px, the counter card at 16px, the menu button round. */
--radius-none:0;
--radius-chip:3px;   /* colour chips in the style guide (2.909px) */
--radius-button:5px; /* buttons and hero service tiles */
--radius-sm:8px;     /* counter icon tile */
--radius-header:15px; /* floating header card */
--radius-lg:16px;    /* floating white cards (style guide: 15.999px) */
--radius-mega:20px;  /* mega-menu panel (Figma sheet) */
--radius-pill:999px; /* round hamburger button */

--border-width:1px; /* @kind other */
--border-width-thick:2px; /* @kind other */

--shadow-none:none;
--shadow-card:0 10px 30px rgba(4,48,84,.10);
--shadow-float:0 18px 48px rgba(4,48,84,.14);
--shadow-header:0 2px 12px rgba(4,48,84,.08);

/* Chevron / arrow motif — the brand cuts a right-pointing notch out of
   imagery and repeats the shape as a solid navy arrow beside it. */
--clip-chevron-notch:polygon(0 0,100% 0,100% 58%,72% 100%,0 100%); /* @kind other */
--motif-angle:34deg; /* @kind other */

--duration-fast:120ms; /* @kind other */
--duration:220ms; /* @kind other */
--duration-slow:420ms; /* @kind other */
--ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */
--ease-out:cubic-bezier(0,0,.2,1); /* @kind other */
}