/* Spacing, layout, shape, elevation, motion.
   The brand guide defines no spacing scale; values below are measured from the
   guideline pages (1920×1080) and the tenable.com mega-menu screenshot (1440×900). */
:root{
--space-0:0;
--space-1:2px;
--space-2:4px;
--space-3:5px;     /* CTA gap: "Find out more" ↔ arrow square */
--space-4:8px;
--space-5:12px;
--space-6:16px;
--space-7:20px;
--space-8:24px;    /* nav item gap, header side padding */
--space-9:32px;
--space-10:40px;
--space-11:48px;
--space-12:58px;   /* brand margin: page edges, panel insets */
--space-13:64px;
--space-14:96px;
--space-15:128px;

--layout-margin:58px;           /* slides & web panels */
--layout-column:33.333%; /* @kind other */        /* left column = one third; content starts at 1/3 + margin */
--layout-slide-width:1920px;
--layout-slide-height:1080px;
--layout-header-utility:36px;   /* tenable.com utility row */
--layout-header-nav:74px;       /* tenable.com main nav row */
--layout-max-width:1440px;

/* Shape: everything is square. Hexagons are the only "rounded" idea. */
--radius-0:0;
--radius-none:0;
--hex-point:0.2887; /* @kind other */             /* tan(30°): hexagonal point depth as a ratio of height */

--border-width-hairline:1px;
--border-width-strong:2px;

/* Elevation: the brand is flat. Overlays use a scrim, not shadows. */
--shadow-none:none;
--shadow-overlay:0 0 0 1px rgba(30,36,38,.12);

/* Motion — not specified by the brand; proposal: quick, linear-feeling, no bounce */
--ease-standard:cubic-bezier(.2,0,0,1); /* @kind other */
--ease-exit:cubic-bezier(.4,0,1,1); /* @kind other */
--duration-fast:120ms; /* @kind other */
--duration-base:200ms; /* @kind other */
--duration-slow:320ms; /* @kind other */

--z-header:100; /* @kind other */
--z-menu:200; /* @kind other */
--z-overlay:300; /* @kind other */
--z-toast:400; /* @kind other */
}