/* Tier identity: one material per level of service, the same sign in the pricing card, the landing hero, the closing and the mobile bar.
   On by default; tiers.js sets html[data-tiers="off"] (DialKit "Connotazione livelli", ~lv-0 in the hash). Buttons stay blue or white, never the tier colour. */
:root {
  --tier-free: #efe8dc;
  --tier-roadmap: #d9806a;
  --tier-roadmap-deep: #0262c2; /* the hero: white 85% secondary text holds 4,74:1 here, the brand blue only 3,76 */
  --tier-premium: #0d3d9c;
  --tier-private: #0c0f14;
  --tier-private-accent: #cfc8ba; /* stone, 11,5:1 on the ink: a sober line, not gold */
  /* the tier materials: free = sand (no hero), Roadmap = dawn, Premium = blue day, Private = ink */
  --tier-free-bg: linear-gradient(180deg, #f3ede3, #e9e0d1);
  --tier-roadmap-bg: radial-gradient(110% 90% at 70% 110%, hsl(33 88% 82%) 0%, hsl(28 72% 66% / 0.85) 35%, rgb(150 220 255 / 0.3) 60%, transparent 82%), linear-gradient(180deg, #071846, #0a2466 55%, #133a8f);
  --tier-premium-bg: radial-gradient(70% 70% at 92% -5%, rgb(98 206 254 / 0.45), transparent 70%), linear-gradient(165deg, #0d3d9c, #08245f);
  --tier-private-bg: radial-gradient(60% 50% at 80% 10%, rgb(207 200 186 / 0.10), transparent 70%), #0c0f14;
}

/* Private landing: hero and closing in ink, a hairline of the accent, a neutral glow instead of the blue one */
:root:not([data-tiers="off"]) .site.pm-tier-private :is(.pm-hero, #chiusura) { --night: var(--tier-private); --bg: var(--tier-private); background: var(--tier-private); }
:root:not([data-tiers="off"]) .site.pm-tier-private .pm-hero { box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--tier-private-accent) 35%, transparent); }
:root:not([data-tiers="off"]) .site.pm-tier-private .pm-hero::before { background: radial-gradient(50% 40% at 80% 20%, rgb(207 200 186 / 0.10), transparent 70%); }
:root:not([data-tiers="off"]) .site.pm-tier-private #chiusura { box-shadow: inset 0 1px 0 color-mix(in srgb, var(--tier-private-accent) 35%, transparent); }
:root:not([data-tiers="off"]) .site.pm-tier-private :is(.pm-hero, #chiusura) .pm-offer b { color: var(--tier-private-accent); }
:root:not([data-tiers="off"]) .site.pm-tier-private .pm-quote { background: rgb(207 200 186 / 0.06); box-shadow: inset 0 0 0 1px rgb(207 200 186 / 0.22); }

/* Roadmap landing (roadmap.html loads this file): the hero in the deep brand blue */
:root:not([data-tiers="off"]) .site.rl .rl-hero { --night: var(--tier-roadmap-deep); --bg: var(--tier-roadmap-deep); background: var(--tier-roadmap-deep); }
:root:not([data-tiers="off"]) .site.rl .rl-hero::before { background: radial-gradient(50% 40% at 82% 16%, rgb(98 206 254 / 0.22), transparent 70%); }
:root:not([data-tiers="off"]) .site.rl .rl-hero :is(.sub, .rl-tp, .rl-tp *) { color: rgb(255 255 255 / 0.85); }

/* Mobile bar: the tier's material whatever scrolls under it, so the bar itself says which level you are buying */
@media (max-width: 860px) {
  :root:not([data-tiers="off"]) .site.pm-tier-premium .pm-mbar,
  :root:not([data-tiers="off"]) .site.pm-tier-private .pm-mbar { box-shadow: 0 -1px 0 rgb(255 255 255 / 0.1); }
  :root:not([data-tiers="off"]) .site.pm-tier-premium .pm-mbar { background: color-mix(in srgb, var(--tier-premium) 96%, transparent); }
  :root:not([data-tiers="off"]) .site.pm-tier-private .pm-mbar { background: color-mix(in srgb, var(--tier-private) 96%, transparent); box-shadow: 0 -1px 0 color-mix(in srgb, var(--tier-private-accent) 35%, transparent); }
  :root:not([data-tiers="off"]) .site:is(.pm-tier-premium, .pm-tier-private) .pm-mbar .pm-mbar-p { color: rgb(255 255 255 / 0.72); }
  :root:not([data-tiers="off"]) .site:is(.pm-tier-premium, .pm-tier-private) .pm-mbar .pm-mbar-p b { color: #ffffff; }
  :root:not([data-tiers="off"]) .site:is(.pm-tier-premium, .pm-tier-private) .pm-mbar .btn { background: #ffffff; color: #02376c; }
}

/* phones: the DialKit switch would sit on the content; it stays reachable in review (#rev) */
@media (max-width: 860px) { :root:not([data-rev]) .dialkit-root { display: none; } }