/* Home hero: how a call is handled — a real sequence */
.flow { list-style: none; margin: 0; padding: 22px 24px; background: var(--panel); border: 1px solid var(--rule); border-radius: 10px; counter-reset: flow; }
.flow li { counter-increment: flow; position: relative; padding: 0 0 18px 44px; }
.flow li:last-child { padding-bottom: 0; }
.flow li::before { content: counter(flow); position: absolute; left: 0; top: 0; width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--rule); display: grid; place-items: center; font-weight: 800; font-size: 0.85rem; color: var(--muted); background: var(--panel); }
.flow li:not(:last-child)::after { content: ""; position: absolute; left: 13px; top: 30px; bottom: 2px; width: 2px; background: var(--rule); }
.flow li.ai::before { border-color: var(--signal); background: var(--signal); color: #fff; }
.flow strong { display: block; }
.flow span { color: var(--muted); font-size: 0.95rem; }
.flow li.ai strong { color: var(--signal-dark); }

/* Home colour: deep teal hero, tinted bands */
:root { --deep: #0b4a44; --deep-2: #083a35; --mint: #e3f1ee; --mint-line: #bfded7; --copper-tint: #f8ece2; --copper-line: #ebcfb9; }

.site-head { background: var(--deep); border-bottom-color: var(--deep-2); }
.site-head .brand { color: #fff; }
.site-head .nav a { color: #d7ebe7; }
.site-head .nav a:hover, .site-head .nav a[aria-current="page"] { color: #fff; border-bottom-color: #f0b98f; }
.site-head .nav .call { color: #fff; }
.site-head :focus-visible { outline-color: #f0b98f; }

.hero { background: linear-gradient(180deg, var(--deep) 0%, var(--deep-2) 100%); color: #fff; padding-bottom: 64px; }
.hero h1 { color: #fff; }
.hero .lede { color: #cfe5e0; }
.hero .btn { background: #fff; border-color: #fff; color: var(--deep); }
.hero .btn:hover { background: #f0b98f; border-color: #f0b98f; color: var(--ink); }
.hero .btn.ghost { background: transparent; border-color: #9cc9c0; color: #fff; }
.hero .btn.ghost:hover { background: #fff; border-color: #fff; color: var(--deep); }
.hero :focus-visible { outline-color: #f0b98f; }
.hero .flow { border: 0; box-shadow: 0 18px 40px rgba(3, 30, 27, 0.35); color: var(--ink); }
.hero .flow li.ai { background: var(--mint); margin: 0 -12px 18px; padding: 10px 12px 10px 56px; border-radius: 8px; }
.hero .flow li.ai::before { left: 12px; top: 10px; }
.hero .flow li.ai::after { left: 25px; top: 40px; bottom: -16px; }

main > section.band:nth-of-type(2) { background: var(--mint); border-color: var(--mint-line); }
main > section.band:nth-of-type(2) .facts { border-top-color: var(--deep); }
main > section.band:nth-of-type(2) .facts div { border-color: var(--mint-line); }
main > section.band:nth-of-type(2) .facts b { color: var(--deep); font-size: 2rem; }

.services li h3 { padding-left: 16px; border-left: 4px solid var(--signal); }
.services li:nth-child(3) h3 { border-left-color: var(--copper); }

main > section.band:last-of-type { background: var(--copper-tint); border-color: var(--copper-line); }
main > section.band:last-of-type h2 { color: #8a4a1e; }
main > section.band:last-of-type .countdown { color: #8a4a1e; }
main > section.band:last-of-type .btn.ghost { border-color: var(--copper); color: #8a4a1e; }
main > section.band:last-of-type .btn.ghost:hover { background: var(--copper); color: #fff; }