/* anatomy kit, scoped (generated) */
.am-figbox .iso-fill{fill:var(--anatomy-paper);stroke:none}
.am-figbox .iso-solid[data-lit]>.iso-fill{fill:var(--anatomy-face)}
.am-figbox .iso-shade,.am-figbox .iso-top{stroke:none}
.am-figbox .iso-shade[data-shade="0"]{fill:var(--anatomy-shade-0)}
.am-figbox .iso-shade[data-shade="1"]{fill:var(--anatomy-shade-1)}
.am-figbox .iso-shade[data-shade="2"]{fill:var(--anatomy-shade-2)}
.am-figbox .iso-shade[data-shade="3"]{fill:var(--anatomy-shade-3)}
.am-figbox .iso-top{fill:var(--anatomy-top)}
.am-figbox .iso-solid[data-lit]>.iso-top{fill:var(--anatomy-lit-top)}
.am-figbox .iso-solid[data-lit]>.iso-shade{fill:var(--anatomy-lit-shade)}
.am-figbox .iso-solid[data-seamless]>.iso-shade,.am-figbox .iso-solid[data-seamless]>.iso-top{stroke-width:.4;stroke-linejoin:round}
.am-figbox .iso-solid[data-seamless]>.iso-shade[data-shade="0"]{stroke:var(--anatomy-shade-0)}
.am-figbox .iso-solid[data-seamless]>.iso-shade[data-shade="1"]{stroke:var(--anatomy-shade-1)}
.am-figbox .iso-solid[data-seamless]>.iso-shade[data-shade="2"]{stroke:var(--anatomy-shade-2)}
.am-figbox .iso-solid[data-seamless]>.iso-shade[data-shade="3"]{stroke:var(--anatomy-shade-3)}
.am-figbox .iso-solid[data-seamless]>.iso-top{stroke:var(--anatomy-top)}
.am-figbox .iso-solid[data-seamless][data-lit]>.iso-top{stroke:var(--anatomy-lit-top)}
.am-figbox .iso-solid[data-seamless][data-lit]>.iso-shade{stroke:var(--anatomy-lit-shade)}
.am-figbox .iso-solid[data-lit]>.iso-edge{stroke:var(--anatomy-lit)}
.am-figbox .iso-halo{fill:var(--anatomy-halo);stroke:none;filter:blur(9px);opacity:var(--anatomy-halo-opacity);transform:translateY(3px)}
.am-figbox .iso-line{fill:none;stroke:var(--anatomy-lo);stroke-width:var(--anatomy-weight);stroke-linecap:round;stroke-linejoin:round}
.am-figbox .iso-line[data-tone="hi"]{stroke:var(--anatomy-hi)}
.am-figbox .iso-line[data-tone="mid"]{stroke:var(--anatomy-mid)}
.am-figbox .iso-line[data-tone="lo"]{stroke:var(--anatomy-lo)}
.am-figbox .iso-line[data-tone="faint"]{stroke:var(--anatomy-faint)}
.am-figbox .iso-line[data-tone="lit"]{stroke:var(--anatomy-lit)}
.am-figbox .iso-line[data-tone="red"]{stroke:var(--anatomy-red)}
.am-figbox .iso-line[data-tone="green"]{stroke:var(--anatomy-green)}
.am-figbox .iso-line[data-tone="blue"]{stroke:var(--anatomy-blue)}
.am-figbox .iso-line[data-dotted]{stroke-dasharray:.01 3.5;stroke-width:1}
.am-figbox .iso-line[data-dashed]{stroke-dasharray:3 3}
.am-figbox .iso-line[data-flow]{stroke-dasharray:2 6}
.am-figbox .iso-wire-end{fill:var(--anatomy-paper);stroke:var(--anatomy-lo);stroke-width:var(--anatomy-weight)}
.am-figbox .iso-wire[data-tone="hi"] .iso-wire-end{stroke:var(--anatomy-hi)}
.am-figbox .iso-wire[data-tone="mid"] .iso-wire-end{stroke:var(--anatomy-mid)}
.am-figbox .iso-wire[data-tone="faint"] .iso-wire-end{stroke:var(--anatomy-faint)}
.am-figbox .iso-wire[data-tone="lit"] .iso-wire-end{stroke:var(--anatomy-lit)}
.am-figbox .iso-dots circle{fill:var(--anatomy-dot);stroke:none;opacity:.32}
.am-figbox .iso-dots[data-tone="hi"] circle{opacity:.85}
.am-figbox .iso-dots[data-tone="mid"] circle{opacity:.45}
.am-figbox .iso-dots[data-tone="lo"] circle{opacity:.22}
.am-figbox .iso-dots[data-tone="faint"] circle{opacity:.12}
.am-figbox .iso-face-text{fill:var(--anatomy-mid);font-family:var(--anatomy-mono);letter-spacing:.04em}
.am-figbox .iso-face-text[data-tone="hi"]{fill:var(--anatomy-hi)}
.am-figbox .iso-face-text[data-tone="lo"]{fill:var(--anatomy-lo)}
.am-figbox .iso-face-text[data-tone="faint"]{fill:var(--anatomy-faint)}
.am-figbox .tb-body{fill:var(--anatomy-shade-2);stroke:none}
.am-figbox .tb-shine{fill:var(--anatomy-top);stroke:none}
.am-figbox .tb-shade{fill:var(--anatomy-shade-0);stroke:none}
.am-figbox .tb-ring{fill:none;stroke:var(--anatomy-lo);stroke-width:.45;stroke-linecap:butt;stroke-linejoin:round}
.am-figbox .tb-ring[data-tone="mid"]{stroke:var(--anatomy-mid)}
.am-figbox .tb-ring[data-tone="faint"]{stroke:var(--anatomy-faint)}
.am-figbox .tb-ring[data-tone="hi"]{stroke:var(--anatomy-hi)}
.am-figbox .iso-line[data-flow]{animation:iso-flow 1600ms linear infinite}
.am-figbox .iso-dots circle[data-pulse]{animation:iso-pulse 1600ms steps(1,end) infinite;animation-delay:var(--pulse-at,0ms)}

/* ==========================================================================
   ADIB Marketing — Everything after the //
   Tokens from the logo pack only: ink #0A0A0A, white, signal red #E10600.
   ========================================================================== */

@font-face {
	font-family: "Geist";
	src: url("../fonts/geist.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Geist Mono";
	src: url("../fonts/geist-mono.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

:root {
	--ink: #0A0A0A;
	--ink-2: #141414;
	--ink-3: #262626;
	--ink-4: #3A3A3A;
	--white: #FFFFFF;
	--paper: #F4F4F2;
	--paper-2: #EAEAE7;
	--line: #E3E3E0;
	--graphite: #5E5E5E;
	--fog: #A6A6A6;
	--red: #E10600;

	--sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

	--fs-hero: clamp(3.3rem, 10.4vw, 10.75rem);
	--fs-h1: clamp(2.7rem, 7.4vw, 7.25rem);
	--fs-h2: clamp(2.05rem, 4.7vw, 4.4rem);
	--fs-h3: clamp(1.25rem, 1.7vw, 1.55rem);
	--fs-lede: clamp(1.125rem, 1.45vw, 1.4rem);
	--fs-body: 1.0625rem;
	--fs-small: .9375rem;
	--fs-mono: .8125rem;

	--gut: clamp(20px, 4vw, 56px);
	--max: 1440px;
	--head: 72px;
	--sec: clamp(88px, 12vw, 176px);
	--slant: 22.65deg;
	--ease: cubic-bezier(.16, 1, .3, 1);
	--ease-in: cubic-bezier(.7, 0, .84, 0);
	--shadow: 0 40px 80px -40px rgba(10, 10, 10, .45), 0 2px 6px -2px rgba(10, 10, 10, .08);
}

@media (min-width: 1024px) {
	:root { --head: 80px; }
}

/* ---------- Base ---------- */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--head) + 16px); }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }

body.am-body {
	margin: 0;
	background: var(--white);
	color: var(--ink);
	font-family: var(--sans);
	font-size: var(--fs-body);
	line-height: 1.6;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	font-feature-settings: "ss01", "cv11";
}
body.am-modal { overflow: hidden; }

.am-site { position: relative; overflow-x: clip; min-height: 100vh; }
.am-site *, .am-site *::before, .am-site *::after,
.am-menu *, .am-pv *, .am-pv *::before, .am-pv *::after { box-sizing: border-box; }

:where(.am-site, .am-pv) img { max-width: 100%; height: auto; }
:where(.am-site) a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .2em; }
:where(.am-site) :is(h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote) { margin: 0; }
:where(.am-site) :is(ul, ol)[class] { list-style: none; padding: 0; }
:where(.am-site) button { font: inherit; color: inherit; }

::selection { background: var(--red); color: var(--white); }

:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }
.am-dark :focus-visible { outline-color: var(--white); }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}

.am-skip {
	position: fixed; z-index: 1000; left: 12px; top: -60px; padding: 12px 18px;
	background: var(--ink); color: var(--white); font-weight: 600; text-decoration: none;
	transition: top .2s;
}
.am-skip:focus { top: 12px; }

.am-main { display: block; padding-top: var(--head); outline: none; }

.am-wrap {
	width: 100%;
	max-width: calc(var(--max) + var(--gut) * 2);
	margin-inline: auto;
	padding-inline: var(--gut);
}

.am-dark { background: var(--ink); color: var(--white); }
.am-dark ::selection { background: var(--white); color: var(--ink); }

/* ---------- Type ---------- */
.am-kicker {
	display: inline-flex; align-items: center; gap: .55em;
	font: 500 var(--fs-mono)/1.2 var(--mono);
	letter-spacing: .02em;
	color: var(--graphite);
	margin-bottom: clamp(18px, 2vw, 28px);
	text-transform: lowercase;
}
.am-kicker__sl { color: var(--red); font-weight: 700; letter-spacing: -.12em; }
.am-dark .am-kicker { color: var(--fog); }

.am-h2 {
	font-size: var(--fs-h2);
	line-height: .98;
	letter-spacing: -.042em;
	font-weight: 650;
	text-wrap: balance;
	max-width: 16ch;
}
.am-lede { font-size: var(--fs-lede); line-height: 1.5; letter-spacing: -.012em; max-width: 38ch; }

.am-sechead { margin-bottom: clamp(40px, 6vw, 88px); }
.am-sechead__p { color: var(--graphite); max-width: 44ch; margin-top: 22px; font-size: 1.0625rem; }
.am-dark .am-sechead__p { color: var(--fog); }
.am-sechead--split { display: grid; gap: 24px; align-items: end; }
.am-sechead--split .am-sechead__p { margin-top: 0; }
@media (min-width: 900px) {
	.am-sechead--split { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 48px; }
	.am-sechead--split > :last-child { justify-self: end; }
}

/* Split-text lines are masked so they can rise into place. */
.am-line-mask { display: block; overflow: clip; padding-bottom: .08em; margin-bottom: -.08em; }

/* ---------- Buttons ---------- */
.am-btn {
	--bg: var(--ink); --fg: var(--white); --sweep: var(--red);
	position: relative; isolation: isolate; overflow: hidden;
	display: inline-flex; align-items: center; justify-content: center; gap: 12px;
	min-height: 52px; padding: 0 22px 0 24px;
	background: var(--bg); color: var(--fg);
	border: 1px solid var(--bg);
	font: 550 1rem/1 var(--sans); letter-spacing: -.01em;
	text-decoration: none; white-space: nowrap; cursor: pointer;
	transition: color .35s var(--ease), border-color .35s var(--ease);
	-webkit-tap-highlight-color: transparent;
	user-select: none;
}
.am-btn::before {
	content: ""; position: absolute; inset: -2px; z-index: -1;
	background: var(--sweep);
	clip-path: polygon(0 0, 0 0, -30% 100%, -30% 100%);
	transition: clip-path .55s var(--ease);
}
.am-btn__icon { display: inline-flex; width: 20px; height: 20px; transition: transform .45s var(--ease); }
.am-btn__icon .am-ic { width: 20px; height: 20px; }
@media (hover: hover) {
	.am-btn:hover::before { clip-path: polygon(0 0, 130% 0, 100% 100%, -30% 100%); }
	.am-btn:hover .am-btn__icon { transform: translateX(3px); }
}
.am-btn:active { transform: translateY(1px); }

.am-btn--primary { --bg: var(--ink); --fg: var(--white); --sweep: var(--red); }
.am-btn--primary:hover { border-color: var(--red); }
.am-btn--ghost { --bg: transparent; --fg: var(--ink); --sweep: var(--ink); border-color: var(--ink); }
@media (hover: hover) { .am-btn--ghost:hover { color: var(--white); } }
.am-btn--light { --bg: var(--white); --fg: var(--ink); --sweep: var(--red); }
@media (hover: hover) { .am-btn--light:hover { color: var(--white); border-color: var(--red); } }
.am-btn--text { --bg: transparent; --fg: currentColor; --sweep: transparent; border-color: transparent; padding-inline: 4px; min-height: 44px; }
.am-btn--text .am-btn__label { background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat; padding-bottom: 2px; }
.am-dark .am-btn--ghost { --fg: var(--white); border-color: rgba(255, 255, 255, .5); --sweep: var(--white); }
@media (hover: hover) { .am-dark .am-btn--ghost:hover { color: var(--ink); } }

.am-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(28px, 3vw, 40px); }

/* Chips: lowercase URL fragments */
.am-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.am-chip { position: relative; display: inline-flex; cursor: pointer; }
.am-chip input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.am-chip span,
.am-chip--btn {
	display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px;
	border: 1px solid var(--line); border-radius: 999px; background: var(--white);
	font: 500 .875rem/1 var(--mono); color: var(--ink);
	transition: background .25s, color .25s, border-color .25s;
}
.am-chip--btn { cursor: pointer; }
.am-chip--btn span { all: unset; }
.am-chip input:checked + span,
.am-chip--btn[aria-pressed="true"] { background: var(--ink); color: var(--white); border-color: var(--ink); }
.am-chip input:focus-visible + span { outline: 2px solid var(--red); outline-offset: 2px; }
@media (hover: hover) {
	.am-chip:hover span, .am-chip--btn:hover { border-color: var(--ink); }
}

/* Inline slashes inside headings */
.am-inline-sl { display: inline-flex; align-items: baseline; }
.am-inline-sl__svg { height: .74em; width: auto; overflow: visible; transform: translateY(.02em); }

.am-slashes { display: block; overflow: visible; }
.am-slashes__a { fill: currentColor; }
.am-slashes__b { fill: var(--red); }

.am-ic { display: block; flex: none; }

/* ---------- Header ---------- */
.am-head {
	position: fixed; z-index: 90; top: 0; left: 0; right: 0;
	height: var(--head);
	background: rgba(255, 255, 255, .96);
	border-bottom: 1px solid transparent;
	transition: transform .5s var(--ease), border-color .3s, background .3s;
}
.am-head.is-scrolled { border-bottom-color: var(--line); }
.am-head.is-hidden { transform: translateY(-101%); }
.am-head__in { display: flex; align-items: center; gap: 20px; height: 100%; }
.am-head__logo { display: flex; align-items: center; flex: none; height: 100%; text-decoration: none; }
.am-head__img { display: block; width: auto; height: 34px; max-width: 150px; object-fit: contain; }
@media (min-width: 1024px) { .am-head__img { height: 40px; max-width: 180px; } }

.am-pill {
	display: none;
	align-items: center; gap: 6px;
	height: 34px; padding: 0 14px;
	border: 1px solid var(--line); border-radius: 999px; background: var(--paper);
	font: 500 .8125rem/1 var(--mono); color: var(--graphite);
	min-width: 0; max-width: 340px; overflow: hidden; white-space: nowrap;
	margin-left: 8px;
}
.am-pill .am-ic { width: 13px; height: 13px; color: var(--ink); }
.am-pill__path { color: var(--ink); font-weight: 600; }
.am-pill__caret { width: 1.5px; height: 15px; background: var(--red); animation: am-blink 1.1s steps(1) infinite; }
@keyframes am-blink { 50% { opacity: 0; } }
@media (min-width: 1180px) { .am-pill { display: inline-flex; } }

.am-nav { margin-left: auto; display: none; }
.am-nav__list { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.am-nav__link {
	position: relative; display: inline-flex; align-items: center; height: 44px; padding: 0 14px;
	font-weight: 500; font-size: .98rem; letter-spacing: -.01em; text-decoration: none; color: var(--ink);
}
.am-nav__link::before {
	content: "/"; position: absolute; left: 3px; color: var(--red); font-weight: 700;
	opacity: 0; transform: translateX(-4px); transition: opacity .3s, transform .4s var(--ease);
}
.am-nav__link:hover::before,
.current-menu-item > .am-nav__link::before,
.current-page-ancestor > .am-nav__link::before,
.current_page_parent > .am-nav__link::before { opacity: 1; transform: none; }
.am-head__cta { display: none; min-height: 46px; padding-inline: 18px 16px; font-size: .95rem; }
@media (min-width: 1024px) {
	.am-nav { display: block; }
	.am-head__cta { display: inline-flex; }
}

.am-burger {
	margin-left: auto; display: inline-flex; align-items: center; gap: 10px;
	height: 44px; padding: 0 4px 0 12px; background: none; border: 0; cursor: pointer;
	font: 500 .9375rem/1 var(--sans); color: var(--ink);
	-webkit-tap-highlight-color: transparent;
}
.am-burger__sl { position: relative; width: 24px; height: 22px; display: block; }
.am-burger__sl i {
	position: absolute; top: 2px; width: 4px; height: 18px; background: var(--ink);
	transform: skewX(calc(var(--slant) * -1)); transition: transform .5s var(--ease), background .3s, top .5s var(--ease);
}
.am-burger__sl i:first-child { left: 5px; top: 5px; height: 15px; }
.am-burger__sl i:last-child { left: 13px; top: 0; background: var(--red); height: 15px; }
.am-burger[aria-expanded="true"] .am-burger__sl i:first-child { transform: rotate(45deg); top: 3px; left: 10px; height: 18px; background: var(--ink); }
.am-burger[aria-expanded="true"] .am-burger__sl i:last-child { transform: rotate(-45deg); top: 3px; left: 10px; height: 18px; }
@media (min-width: 1024px) { .am-burger { display: none; } }

body.am-menu-open .am-head { background: var(--white); border-color: var(--line); transform: none; }

.am-menu {
	position: fixed; inset: 0; z-index: 85; background: var(--ink); color: var(--white);
	padding-top: var(--head); overflow-y: auto; overscroll-behavior: contain;
	clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
	transition: clip-path .6s var(--ease), visibility 0s linear .6s;
	visibility: hidden;
}
.am-menu[hidden] { display: block; }
.am-menu.is-open { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); visibility: visible; transition: clip-path .6s var(--ease), visibility 0s; }
.am-menu__in { padding-block: 28px 40px; display: flex; flex-direction: column; min-height: calc(100dvh - var(--head)); }
.am-menu__host { font: 500 .8125rem/1 var(--mono); color: var(--fog); margin-bottom: 12px; }
.am-menu__list { list-style: none; margin: 0; padding: 0; }
.am-menu__list a {
	display: flex; align-items: baseline; gap: 12px; padding: 10px 0;
	font-size: clamp(2.6rem, 12vw, 4.5rem); font-weight: 650; letter-spacing: -.05em; line-height: 1;
	text-decoration: none; color: var(--white); border-bottom: 1px solid var(--ink-3);
}
.am-menu__n { font: 500 .75rem/1 var(--mono); color: var(--fog); letter-spacing: 0; width: 26px; }
.am-menu__sl { color: var(--red); margin-right: -4px; }
.am-menu__svc { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 28px 0 0; padding: 0; }
.am-menu__svc a { display: inline-flex; min-height: 40px; align-items: center; padding: 0 14px; border: 1px solid var(--ink-4); border-radius: 999px; font: 500 .875rem/1 var(--mono); color: var(--white); text-decoration: none; }
.am-menu__foot { margin-top: auto; padding-top: 32px; display: grid; gap: 14px; }
.am-menu__foot a { display: inline-flex; align-items: center; gap: 10px; color: var(--white); text-decoration: none; font-size: 1.0625rem; }
.am-menu__foot .am-ic { width: 20px; height: 20px; color: var(--fog); }
@media (min-width: 1024px) { .am-menu { display: none !important; } }

/* ---------- Page wipe: two slashes sweep across ---------- */
.am-wipe { position: fixed; inset: 0; z-index: 200; pointer-events: none; overflow: hidden; }
.am-wipe span { position: absolute; top: -10%; bottom: -10%; left: -80vw; width: 260vw; will-change: transform; }
.am-wipe .am-wipe__a { background: var(--ink); transform: translateX(-290vw) skewX(-22.65deg); }
.am-wipe .am-wipe__b { background: var(--red); left: 0; width: 26vw; transform: translateX(-90vw) skewX(-22.65deg); }
html.am-wiping .am-wipe .am-wipe__a { transform: translateX(0) skewX(-22.65deg); }
html.am-wiping .am-wipe { pointer-events: auto; }

/* ---------- Browser window ---------- */
.am-win {
	position: relative; display: block; width: 100%;
	background: var(--white); color: var(--ink);
	border: 1px solid var(--line); border-radius: 8px; overflow: hidden;
	box-shadow: var(--shadow);
	text-align: left; padding: 0;
}
button.am-win { cursor: pointer; font: inherit; }
.am-win__bar {
	position: relative; display: flex; align-items: center; gap: 10px;
	height: 40px; padding: 0 12px; background: var(--paper); border-bottom: 1px solid var(--line);
}
.am-win__dots { display: inline-flex; flex: none; color: var(--ink); }
.am-win__sl { width: 17px; height: auto; }
.am-win__url {
	flex: 1; min-width: 0; display: flex; align-items: center; gap: 7px;
	height: 26px; padding: 0 12px; background: var(--white);
	border: 1px solid var(--line); border-radius: 999px;
	font: 500 .75rem/1 var(--mono); color: var(--graphite); white-space: nowrap; overflow: hidden;
}
.am-win__url .am-ic { width: 12px; height: 12px; color: var(--ink); }
.am-win__host { color: var(--ink); overflow: hidden; text-overflow: ellipsis; }
.am-win__path { color: var(--graphite); }
.am-win__reload { display: inline-flex; flex: none; background: none; border: 0; padding: 0; color: var(--graphite); }
.am-win__reload .am-ic { width: 16px; height: 16px; }
.am-win__view { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--paper); }
.am-win__view img { display: block; width: 100%; height: auto; }

.am-win--dark { background: var(--ink-2); border-color: var(--ink-3); color: var(--white); }
.am-win--dark .am-win__bar { background: #111; border-color: var(--ink-3); }
.am-win--dark .am-win__dots { color: var(--white); }
.am-win--dark .am-win__url { background: var(--ink); border-color: var(--ink-3); color: var(--fog); }
.am-win--dark .am-win__url .am-ic, .am-win--dark .am-win__host { color: var(--white); }
.am-win--dark .am-win__reload { color: var(--fog); }
.am-win--dark .am-win__view { background: var(--ink-2); }

/* ---------- Home hero ---------- */
.am-hero { position: relative; padding-block: clamp(36px, 6vw, 84px) clamp(64px, 8vw, 120px); }
.am-hero__meta {
	display: flex; flex-wrap: wrap; gap: 6px 22px; margin-bottom: clamp(22px, 3.2vw, 44px);
	font: 500 var(--fs-mono)/1.3 var(--mono); color: var(--graphite);
}
.am-hero__meta span:first-child { color: var(--ink); }
.am-hero__meta-svc { display: none; }
@media (min-width: 760px) { .am-hero__meta-svc { display: inline; } }

.am-hero__h {
	font-size: var(--fs-hero); line-height: .86; letter-spacing: -.058em; font-weight: 680;
	margin-left: -.04em;
}
.am-hero__line { display: block; overflow: clip; padding-bottom: .06em; }
.am-hero__line + .am-hero__line { margin-top: -.02em; }
.am-hero__word { display: inline-block; }
.am-hero__sl { position: relative; display: inline-block; height: .74em; vertical-align: -.005em; margin-left: .06em; }
.am-hero__slsvg { height: 100%; width: auto; }
.am-hero__cursor {
	position: absolute; right: -.16em; top: -.05em; bottom: -.05em; width: .05em; min-width: 3px;
	background: var(--red); animation: am-blink 1.05s steps(1) infinite;
}

.am-hero__grid { display: grid; gap: 44px; margin-top: clamp(30px, 4vw, 56px); align-items: start; }
.am-hero__note { color: var(--graphite); margin-top: 18px; max-width: 44ch; font-size: 1rem; }
@media (min-width: 1024px) {
	.am-hero__grid { grid-template-columns: minmax(0, 4.4fr) minmax(0, 7.6fr); gap: clamp(40px, 5vw, 88px); }
	.am-hero__copy { padding-top: 12px; }
}

/* ---------- Playground ---------- */
.am-play { position: relative; }
.am-play__win { box-shadow: 0 50px 100px -50px rgba(10, 10, 10, .5), 0 2px 8px -2px rgba(10, 10, 10, .08); }
.am-play__bar { height: 52px; gap: 12px; }
.am-play__addr {
	flex: 1; min-width: 0; display: flex; align-items: center; gap: 2px;
	height: 36px; padding: 0 14px; background: var(--white);
	border: 1.5px solid var(--ink); border-radius: 999px; cursor: text;
	font: 500 .9375rem/1 var(--mono); color: var(--graphite); white-space: nowrap; overflow: hidden;
}
.am-play__addr .am-ic { width: 14px; height: 14px; color: var(--ink); margin-right: 6px; }
.am-play__addr:focus-within { border-color: var(--red); box-shadow: 0 0 0 3px rgba(225, 6, 0, .15); }
.am-play__pre { display: none; }
@media (min-width: 480px) { .am-play__pre { display: inline; } }
.am-play__field { position: relative; display: inline-grid; grid-template-columns: minmax(1ch, auto); min-width: 0; max-width: 100%; }
.am-play__sizer { grid-area: 1 / 1; visibility: hidden; white-space: pre; padding-right: 2px; }
.am-play__input {
	grid-area: 1 / 1; width: 100%; min-width: 0; border: 0; outline: 0; padding: 0; margin: 0; background: none;
	font: inherit; color: var(--ink); font-weight: 600;
}
.am-play__input::placeholder { color: var(--ink); opacity: 1; }
.am-play__suf { color: var(--graphite); flex: none; }
.am-play__suf span { color: var(--ink); }

.am-play__tabs { display: flex; gap: 2px; padding: 8px 10px 0; background: var(--paper); border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.am-play__tabs::-webkit-scrollbar { display: none; }
.am-play__tab {
	position: relative; flex: none; height: 36px; padding: 0 14px; border: 1px solid transparent; border-bottom: 0;
	border-radius: 7px 7px 0 0; background: none; cursor: pointer;
	font: 500 .8125rem/1 var(--mono); color: var(--graphite);
	transition: color .2s, background .2s;
}
.am-play__tab[aria-selected="true"] { background: var(--white); color: var(--ink); border-color: var(--line); margin-bottom: -1px; height: 37px; }
.am-play__tab[aria-selected="true"]::before { content: ""; position: absolute; left: 10px; right: 10px; top: -1px; height: 2px; background: var(--red); }
@media (hover: hover) { .am-play__tab:hover { color: var(--ink); } }

.am-play__view { position: relative; aspect-ratio: 16 / 11; overflow: hidden; background: var(--white); }
@media (max-width: 599px) { .am-play__view { aspect-ratio: 4 / 4.4; } }
.am-play__hint { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 20px; margin-top: 16px; font: 500 .8125rem/1.4 var(--mono); color: var(--graphite); }
.am-play__cta { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); font-weight: 600; text-decoration: none; }
.am-play__cta .am-ic { width: 16px; height: 16px; color: var(--red); transition: transform .4s var(--ease); }
.am-play__cta:hover .am-ic { transform: translateX(4px); }

/* Mock pages (miniature UIs, wireframe greys with real names) */
.am-mock { position: absolute; inset: 0; padding: clamp(14px, 2.2vw, 26px); display: flex; flex-direction: column; gap: clamp(10px, 1.6vw, 18px); font-size: clamp(.68rem, .95vw, .82rem); line-height: 1.35; color: var(--ink); }
.am-mock[hidden] { display: none; }
.am-mock i { display: block; background: var(--paper-2); border-radius: 3px; }
.am-mock__nav { display: flex; align-items: center; gap: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--line); font-size: .92em; color: var(--graphite); }
.am-mock__nav b { color: var(--ink); font-weight: 700; letter-spacing: -.02em; margin-right: auto; font-size: 1.12em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 60%; }
.am-mock__nav em { font-style: normal; background: var(--ink); color: var(--white); padding: 5px 10px; border-radius: 3px; font-weight: 600; }
.am-mock__nav span { display: none; }
@media (min-width: 600px) { .am-mock__nav span { display: inline; } }
.am-mock__hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(10px, 2vw, 22px); flex: 1; min-height: 0; }
.am-mock__eyebrow { font-family: var(--mono); font-size: .85em; color: var(--graphite); display: flex; align-items: center; gap: 6px; }
.am-mock__eyebrow::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ink); }
.am-mock__h { font-size: clamp(1.25rem, 2.7vw, 2.35rem); font-weight: 700; letter-spacing: -.045em; line-height: .95; margin: 8px 0 10px; word-break: break-word; }
.am-mock__p { color: var(--graphite); max-width: 30ch; }
.am-mock__btns { display: flex; gap: 8px; margin-top: 14px; }
.am-mock__btns i { width: 76px; height: 26px; background: var(--ink); }
.am-mock__btns i + i { background: transparent; border: 1px solid var(--ink); }
.am-mock__img {
	position: relative; display: grid; place-items: center; min-height: 100%; border-radius: 4px; overflow: hidden;
	background: var(--paper);
}
.am-mock__img::before { content: ""; position: absolute; inset: 14% 14% auto auto; width: 34%; aspect-ratio: 1; border-radius: 50%; border: 1px solid var(--paper-2); }
.am-mock__img span { position: relative; font-size: clamp(3.4rem, 9vw, 8.5rem); font-weight: 800; letter-spacing: -.07em; line-height: .8; color: var(--ink); }
.am-mock__img span::after { content: ""; position: absolute; left: 6%; right: 6%; bottom: -14%; height: 6px; background: var(--red); transform: skewX(-22.65deg); }
.am-mock__img small { position: absolute; left: 10px; bottom: 8px; font: 500 .68rem/1 var(--mono); color: var(--graphite); }
.am-mock__row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.am-mock__row i { height: clamp(28px, 4vw, 52px); }
.am-mock__wa { position: absolute; right: 14px; bottom: 14px; width: 34px; height: 34px; border-radius: 50%; background: var(--ink); color: var(--white); display: grid; place-items: center; }
.am-mock__wa .am-ic { width: 18px; height: 18px; }

.am-mock__search, .am-mock__cart { display: inline-flex !important; align-items: center; position: relative; }
.am-mock__search .am-ic, .am-mock__cart .am-ic { width: 18px; height: 18px; color: var(--ink); }
.am-mock__cart sup { position: absolute; right: -8px; top: -6px; min-width: 16px; height: 16px; border-radius: 8px; background: var(--red); color: var(--white); font: 600 10px/16px var(--mono); text-align: center; padding: 0 3px; transition: transform .3s var(--ease); }
.am-mock__cart sup.is-bump { transform: scale(1.35); }
.am-mock__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(8px, 1.4vw, 14px); flex: 1; min-height: 0; }
.am-mock__prod { display: flex; flex-direction: column; gap: 6px; min-height: 0; }
.am-mock__pimg { flex: 1; min-height: 40px; border-radius: 4px; background: var(--paper); position: relative; overflow: hidden; }
.am-mock__pimg::after { content: ""; position: absolute; left: 22%; right: 22%; top: 20%; bottom: 14%; border-radius: 40% 40% 6px 6px; background: var(--paper-2); }
.am-mock__pimg--b::after { border-radius: 50%; left: 26%; right: 26%; top: 24%; bottom: 24%; }
.am-mock__pimg--c::after { border-radius: 4px; left: 30%; right: 30%; top: 12%; bottom: 12%; }
.am-mock__prod i { height: 8px; width: 80%; }
.am-mock__prod b { font-family: var(--mono); font-size: .95em; }
.am-mock__prod button { all: unset; text-align: center; padding: 6px 0; font-weight: 600; border: 1px solid var(--ink); border-radius: 3px; font-size: .9em; cursor: pointer; }
.am-mock__toast {
	position: absolute; left: 50%; bottom: 14px; translate: -50% 0;
	display: inline-flex; gap: 6px; align-items: center; white-space: nowrap;
	background: var(--ink); color: var(--white); padding: 8px 14px; border-radius: 999px;
	font: 500 .78rem/1 var(--mono);
	opacity: 0; transform: translateY(12px); transition: opacity .4s, transform .5s var(--ease);
}
.am-mock__toast::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--red); }
.am-mock__toast.is-on { opacity: 1; transform: none; }

.am-mock__q { display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 16px; border: 1px solid var(--line); border-radius: 999px; box-shadow: 0 6px 18px -10px rgba(10, 10, 10, .25); font-size: 1.05em; }
.am-mock__q .am-ic { width: 16px; height: 16px; color: var(--graphite); }
.am-mock__serp { display: grid; gap: 14px; counter-reset: r; }
.am-mock--ai { display: grid; gap: 12px; align-content: start; }
.am-mock__ask { justify-self: end; max-width: 86%; padding: 10px 14px; border-radius: 14px 14px 4px 14px; background: var(--ink); color: var(--white); line-height: 1.35; }
.am-mock__ans { max-width: 92%; padding: 12px 14px; border-radius: 14px 14px 14px 4px; background: var(--paper); box-shadow: inset 3px 0 0 var(--red); line-height: 1.5; }
.am-mock__ans b { color: var(--red); font-weight: 650; }
.am-mock__ask::first-letter { text-transform: uppercase; }
.am-mock__cite { display: flex; flex-wrap: wrap; gap: 6px; }
.am-mock__cite span { padding: 4px 9px; border-radius: 999px; background: var(--paper); font: 500 .75em/1.2 var(--mono); color: var(--graphite); }
.am-mock__cite span:first-child { background: var(--ink); color: var(--white); }
.am-mock__serp li { display: grid; gap: 4px; }
.am-mock__serp small { font-family: var(--mono); color: var(--graphite); font-size: .85em; min-height: 1em; }
.am-mock__serp small:empty { width: 30%; height: 8px; background: var(--paper-2); border-radius: 3px; }
.am-mock__serp b { font-size: 1.2em; letter-spacing: -.02em; }
.am-mock__serp b:empty { width: 65%; height: 12px; background: var(--paper-2); border-radius: 3px; }
.am-mock__serp i { height: 8px; width: 90%; }
.am-mock__you { position: relative; padding: 12px 14px; margin: 0 -14px; border-radius: 6px; background: var(--paper); }
.am-mock__you::before { content: "1"; position: absolute; left: -2px; top: 12px; translate: -100% 0; font: 700 .9em/1 var(--mono); color: var(--red); padding-right: 8px; }
.am-mock__you b { text-decoration: underline; text-decoration-color: var(--red); text-underline-offset: .2em; }
.am-mock__tag { margin-top: auto; font-family: var(--mono); font-size: .85em; color: var(--graphite); }
.am-mock__ad { padding: 14px; border: 1px solid var(--ink); border-radius: 6px; display: grid; gap: 4px; }
.am-mock__ad small { font-family: var(--mono); font-size: .85em; }
.am-mock__ad b { font-size: 1.2em; letter-spacing: -.02em; }
.am-mock__ad p { color: var(--graphite); }
.am-mock__links { display: flex; gap: 14px; margin-top: 4px; }
.am-mock__links span { color: var(--ink) !important; text-decoration: underline; text-underline-offset: .2em; }
.am-mock__serp--dim { opacity: .55; }
.am-mock__prof { display: flex; align-items: center; gap: 12px; }
.am-mock__avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--ink); color: var(--white); display: grid; place-items: center; font-weight: 700; font-size: 1.25em; box-shadow: 0 0 0 2px var(--white), 0 0 0 3.5px var(--red); }
.am-mock__prof div { display: grid; }
.am-mock__prof small { color: var(--graphite); font-family: var(--mono); }
.am-mock__prof em { margin-left: auto; font-style: normal; background: var(--ink); color: var(--white); padding: 6px 12px; border-radius: 4px; font-weight: 600; }
.am-mock__feed { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; flex: 1; min-height: 0; }
.am-mock__post { background: var(--paper); position: relative; overflow: hidden; min-height: 30px; }
.am-mock__post::after { content: ""; position: absolute; inset: 22%; background: var(--paper-2); }
.am-mock__post--0::after { border-radius: 50%; }
.am-mock__post--1 { background: var(--ink); }
.am-mock__post--1::after { background: var(--ink-3); inset: 30% 18%; }
.am-mock__post--2::after { inset: 40% 12% 12% 12%; }
.am-mock__post--3::after { border-radius: 50% 50% 4px 4px; }
.am-mock__post--4 { background: var(--paper-2); }
.am-mock__post--4::after { background: var(--white); inset: 18% 30%; }
.am-mock__post--5::after { inset: 12%; border: 2px solid var(--ink); background: none; }
.am-mock__likes { display: flex; align-items: center; gap: 6px; font-family: var(--mono); color: var(--graphite); }
.am-mock__likes .am-ic { width: 16px; height: 16px; color: var(--red); }
.am-mock__likes b { color: var(--ink); }

/* ---------- Live ticker ---------- */
.am-ticker {
	position: relative; display: flex; align-items: center; gap: 0;
	border-block: 1px solid var(--line); background: var(--white);
	height: 64px; overflow: hidden;
}
.am-ticker__label {
	position: relative; z-index: 2; flex: none; display: inline-flex; align-items: center; gap: 10px;
	height: 100%; padding: 0 var(--gut); background: var(--ink); color: var(--white);
	font: 500 .8125rem/1 var(--mono);
}
.am-ticker__label::after { content: ""; position: absolute; right: -18px; top: 0; bottom: 0; width: 36px; background: var(--ink); transform: skewX(calc(var(--slant) * -1)); z-index: -1; }
.am-ticker__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--red); flex: none; box-shadow: 0 0 0 0 rgba(225, 6, 0, .6); animation: am-pulse 2s infinite; }
@keyframes am-pulse { 70% { box-shadow: 0 0 0 8px rgba(225, 6, 0, 0); } 100% { box-shadow: 0 0 0 0 rgba(225, 6, 0, 0); } }
.am-ticker__track { display: flex; width: max-content; padding-left: 28px; animation: am-marquee var(--dur, 90s) linear infinite; }
.am-ticker__list { display: flex; flex: none; gap: 44px; padding-right: 44px; list-style: none; margin: 0; }
.am-ticker__list li { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; font-weight: 600; letter-spacing: -.02em; font-size: 1.0625rem; }
.am-ticker__list .am-ticker__dot { width: 6px; height: 6px; animation: none; background: var(--ink); box-shadow: none; }
.am-ticker__host { font: 500 .8125rem/1 var(--mono); color: var(--graphite); letter-spacing: 0; }
@keyframes am-marquee { to { transform: translateX(-50%); } }
.am-ticker:hover .am-ticker__track { animation-play-state: paused; }

/* Single-column grids never let wide content stretch the track. */
.am-hero__grid, .am-demo__in, .am-story__in, .am-phero__grid, .am-contact__in, .am-where__in,
.am-faq__in, .am-build, .am-store, .am-serp, .am-ads, .am-aud, .am-show__head, .am-foot__grid,
.am-grid, .am-rel__list, .am-inc__list, .am-steps__list, .am-founders__grid { grid-template-columns: minmax(0, 1fr); }
.am-play, .am-hero__copy { min-width: 0; }

/* Wide screens: headline + copy left, playground right, all above the fold. */
@media (min-width: 1200px) {
	.am-hero { padding-top: clamp(28px, 3.4vw, 56px); }
	.am-hero__in {
		display: grid; grid-template-columns: minmax(0, 6.3fr) minmax(0, 5.7fr); column-gap: clamp(40px, 4.4vw, 80px);
		grid-template-areas: "meta meta" "h play" "copy play"; align-items: start;
	}
	.am-hero__grid { display: contents; }
	.am-hero__meta { grid-area: meta; }
	.am-hero__h { grid-area: h; font-size: clamp(5rem, 7.7vw, 9rem); }
	.am-hero__copy { grid-area: copy; padding-top: clamp(26px, 2.6vw, 40px); }
	.am-hero .am-play { grid-area: play; align-self: center; margin-top: 8px; }
	.am-hero .am-lede { font-size: clamp(1.1rem, 1.3vw, 1.3rem); }
}
@media (max-width: 1199px) { .am-hero__h { font-size: clamp(3.4rem, 15.4vw, 10.75rem); } }

/* ---------- Home showcase: open tabs ---------- */
.am-show { --copy: #CFCFCF; padding-block: var(--sec) clamp(64px, 8vw, 120px); position: relative; }
.am-show__head { display: grid; gap: 22px; margin-bottom: clamp(40px, 5vw, 72px); }
.am-show__intro { color: var(--copy); max-width: 46ch; }
@media (min-width: 900px) {
	.am-show__head { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; }
	.am-show__head .am-kicker { grid-column: 1 / -1; margin-bottom: 0; }
	.am-show__intro { justify-self: end; }
}
.am-show__tabs { display: none; }
.am-show__items {
	display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory;
	margin-inline: calc(var(--gut) * -1); padding: 0 var(--gut) 16px;
	scrollbar-width: none; overscroll-behavior-x: contain;
}
.am-show__items::-webkit-scrollbar { display: none; }
.am-show__item { flex: 0 0 min(86%, 520px); scroll-snap-align: start; display: flex; flex-direction: column; }
.am-show__win { order: -1; }
.am-show__view { aspect-ratio: 16 / 11; }
.am-show__img { will-change: transform; }
.am-show__info { padding-top: 22px; }
.am-show__count { font: 500 var(--fs-mono)/1 var(--mono); color: var(--fog); }
.am-show__count span { color: var(--white); }
.am-show__title { font-size: clamp(1.9rem, 4vw, 3.6rem); line-height: .95; letter-spacing: -.05em; font-weight: 650; margin-top: 14px; }
.am-show__meta { font: 500 var(--fs-mono)/1.3 var(--mono); color: var(--fog); margin-top: 12px; }
.am-show__blurb { color: var(--copy); margin-top: 18px; max-width: 40ch; }
.am-show__acts { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; margin-top: 26px; }
.am-show__foot { margin-top: clamp(36px, 5vw, 64px); }

@media (min-width: 1024px) {
	.am-show__stage { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: clamp(32px, 4vw, 72px); }
	.am-show__tabs {
		grid-column: 2; grid-row: 1; display: flex; align-items: flex-end; gap: 2px;
		padding: 8px 8px 0; background: #050505; border: 1px solid var(--ink-3); border-bottom: 0; border-radius: 10px 10px 0 0;
	}
	.am-show__tab {
		position: relative; display: inline-flex; align-items: center; gap: 8px; min-width: 0; flex: 0 1 180px;
		height: 38px; padding: 0 12px; border: 0; border-radius: 8px 8px 0 0; background: transparent; cursor: pointer;
		color: var(--fog); font: 500 .8125rem/1 var(--sans); text-align: left;
		transition: background .3s, color .3s;
	}
	.am-show__tab + .am-show__tab::before { content: ""; position: absolute; left: -1px; top: 11px; bottom: 11px; width: 1px; background: var(--ink-3); }
	.am-show__tab[aria-selected="true"] { background: #111; color: var(--white); }
	.am-show__tab[aria-selected="true"]::before, .am-show__tab[aria-selected="true"] + .am-show__tab::before { opacity: 0; }
	.am-show__tab[aria-selected="true"]::after { content: ""; position: absolute; left: 12px; right: 12px; top: 0; height: 2px; background: var(--red); }
	.am-show__tab:hover { color: var(--white); }
	.am-show__fav { flex: none; width: 18px; height: 18px; display: grid; place-items: center; background: var(--ink-4); color: var(--white); font: 700 .6875rem/1 var(--sans); border-radius: 3px; }
	.am-show__tab[aria-selected="true"] .am-show__fav { background: var(--white); color: var(--ink); }
	.am-show__tabname { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.am-show__newtab { display: grid; place-items: center; width: 32px; height: 32px; margin: 0 0 3px 6px; color: var(--fog); }
	.am-show__newtab .am-ic { width: 16px; height: 16px; }

	.am-show__items { grid-column: 1 / -1; grid-row: 2; display: grid; overflow: visible; margin: 0; padding: 0; }
	.am-show__item {
		grid-area: 1 / 1; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: clamp(32px, 4vw, 72px);
		align-items: end; opacity: 0; visibility: hidden; transition: opacity .5s var(--ease), visibility 0s .5s;
	}
	.am-show__item.is-active { opacity: 1; visibility: visible; transition: opacity .5s var(--ease), visibility 0s; }
	.am-show__win { order: 0; grid-column: 2; grid-row: 1; border-top-left-radius: 0; border-top-right-radius: 0; }
	.am-show__info { grid-column: 1; grid-row: 1; padding: 0 0 8px; }
	.am-show__view { aspect-ratio: auto; height: clamp(320px, calc(100svh - 330px), 640px); }
	.am-show__count { font-size: .875rem; }
	.am-show__item .am-show__title, .am-show__item .am-show__blurb, .am-show__item .am-show__meta, .am-show__item .am-show__acts { transition: transform .7s var(--ease), opacity .5s; }
	.am-show__item:not(.is-active) .am-show__title { transform: translateY(24px); opacity: 0; }
	.am-show__item:not(.is-active) .am-show__blurb { transform: translateY(24px); opacity: 0; }
	.am-show.is-pinned .am-show__stage { height: auto; }
}

/* ---------- Story ---------- */
.am-story { padding-block: var(--sec); overflow: clip; }
.am-story__in { display: grid; gap: clamp(48px, 6vw, 96px); align-items: center; }
.am-story__fig { position: relative; width: min(78%, 520px); margin-inline: auto; color: var(--ink); }
.am-story__sl { width: 100%; height: auto; }
.am-story__sl .am-slashes__b { transform: translateY(var(--drop, 0%)); }
.am-story__tag { position: absolute; font: 600 .875rem/1 var(--mono); padding: 6px 8px; background: var(--white); border: 1px solid var(--ink); }
.am-story__tag--a { left: -4%; bottom: 8%; }
.am-story__tag--b { right: -2%; top: 46%; border-color: var(--red); color: var(--red); }
.am-story__step { position: absolute; right: 2%; top: -6%; font: 500 .75rem/1 var(--mono); color: var(--graphite); display: flex; align-items: center; gap: 8px; }
.am-story__step::before { content: ""; width: 28px; height: 1px; background: var(--graphite); }
.am-story__copy > p { color: #2B2B2B; max-width: 52ch; margin-top: 18px; }
.am-story__copy > p:first-of-type { margin-top: 28px; }
.am-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--ink); margin: 40px 0 36px; }
.am-facts div { padding: 18px 12px 18px 0; border-bottom: 1px solid var(--line); }
.am-facts dt { font: 500 .75rem/1.3 var(--mono); color: var(--graphite); }
.am-facts dd { font-size: clamp(1.7rem, 3.2vw, 2.75rem); font-weight: 650; letter-spacing: -.045em; line-height: 1.05; margin-top: 8px; }
@media (min-width: 1024px) {
	.am-story__in { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
	.am-story__fig { width: 100%; }
}

/* ---------- Page hero ---------- */
.am-phero { padding-block: clamp(36px, 5vw, 72px) clamp(64px, 8vw, 120px); }
.am-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin-bottom: clamp(32px, 5vw, 72px); font: 500 var(--fs-mono)/1.4 var(--mono); color: var(--graphite); }
.am-crumbs a { text-decoration: none; }
.am-crumbs a:hover { color: var(--ink); text-decoration: underline; }
.am-crumbs__sep { color: var(--red); font-weight: 700; }
.am-crumbs [aria-current] { color: var(--ink); font-weight: 600; }
.am-phero__grid { display: grid; gap: 44px; }
.am-phero__h { font-size: var(--fs-h1); line-height: .9; letter-spacing: -.058em; font-weight: 670; max-width: 13ch; text-wrap: balance; margin-left: -.03em; }
.am-phero__lede { margin-top: clamp(24px, 3vw, 36px); color: #2B2B2B; max-width: 46ch; }
.am-phero--service .am-phero__h { font-size: clamp(2.4rem, 5.6vw, 5.4rem); max-width: 17ch; }
.am-phero--small .am-phero__h { font-size: clamp(2.4rem, 5.4vw, 5rem); }
.am-phero__aside { container-type: inline-size; min-width: 0; }
.am-phero__path {
	font-size: clamp(2.6rem, calc(100cqi / (var(--len, 6) * .6)), 10rem);
	font-weight: 700; letter-spacing: -.06em; line-height: .85; white-space: nowrap;
	color: transparent; -webkit-text-stroke: 1.5px var(--ink);
}
.am-phero__path span { color: var(--red); -webkit-text-stroke: 0; }
.am-phero__analogy { margin: 28px 0 0; padding: 4px 0 4px 22px; border-left: 3px solid var(--red); }
.am-phero__analogy p { font-size: clamp(1.2rem, 1.9vw, 1.65rem); font-weight: 520; letter-spacing: -.025em; line-height: 1.25; max-width: 24ch; }
@media (min-width: 1024px) {
	.am-phero__grid:has(.am-phero__aside) { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; gap: clamp(40px, 5vw, 96px); }
}

/* ---------- Work ---------- */
.am-work { padding-bottom: var(--sec); }
.am-work__bar {
	position: sticky; top: var(--head); z-index: 20;
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
	padding: 14px 0; margin-bottom: clamp(28px, 4vw, 52px);
	background: rgba(255, 255, 255, .97); border-block: 1px solid var(--line);
	transition: top .5s var(--ease);
}
html.am-head-hidden .am-work__bar { top: 0; }
.am-work__filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.am-filter, .am-work__sector select, .am-work__views button {
	display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px;
	border: 1px solid var(--line); border-radius: 999px; background: var(--white); cursor: pointer;
	font: 500 .875rem/1 var(--sans); color: var(--ink); transition: background .25s, color .25s, border-color .25s;
}
.am-filter sup { font: 500 .6875rem/1 var(--mono); color: var(--graphite); }
.am-filter[aria-pressed="true"], .am-work__views [aria-pressed="true"] { background: var(--ink); color: var(--white); border-color: var(--ink); }
.am-filter[aria-pressed="true"] sup { color: var(--fog); }
.am-filter:hover, .am-work__views button:hover, .am-work__sector select:hover { border-color: var(--ink); }
.am-work__sector select {
	appearance: none; padding-right: 34px;
	background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%);
	background-position: calc(100% - 18px) 52%, calc(100% - 13px) 52%; background-size: 5px 5px; background-repeat: no-repeat;
}
.am-work__views { display: inline-flex; gap: 6px; }
.am-work__views .am-ic { width: 16px; height: 16px; }
@media (max-width: 599px) { .am-work__views span { display: none; } .am-work__views button { padding: 0 12px; } }
.am-work__status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

.am-grid { display: grid; gap: clamp(48px, 5vw, 80px) clamp(20px, 3vw, 40px); }
@media (min-width: 700px) { .am-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .am-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.am-card[hidden] { display: none !important; }
.am-card__win { transition: transform .6s var(--ease), box-shadow .6s var(--ease); }
.am-card__view { aspect-ratio: 16 / 10; }
.am-card__img { position: absolute; left: 0; top: 0; width: 100%; will-change: transform; }
.am-card__hover {
	position: absolute; right: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 8px;
	padding: 9px 12px; background: var(--ink); color: var(--white); font: 500 .75rem/1 var(--mono);
	opacity: 0; transform: translateY(8px); transition: opacity .3s, transform .5s var(--ease);
}
.am-card__hover .am-ic { width: 14px; height: 14px; }
@media (hover: hover) {
	.am-card__win:hover { transform: translateY(-6px); box-shadow: 0 60px 90px -50px rgba(10, 10, 10, .55); }
	.am-card__win:hover .am-card__hover, .am-card__win:focus-visible .am-card__hover { opacity: 1; transform: none; }
}
.am-card__meta { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; margin-top: 22px; }
.am-card__meta > :not(.am-card__n) { grid-column: 2; }
.am-card__n { grid-row: 1 / span 4; font: 500 .75rem/1 var(--mono); color: var(--graphite); padding-top: .6em; }
.am-card__title { font-size: clamp(1.35rem, 1.9vw, 1.7rem); letter-spacing: -.035em; font-weight: 640; line-height: 1.1; }
.am-card__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; font: 500 .75rem/1.2 var(--mono); color: var(--graphite); }
.am-card__tags span + span::before { content: "/"; color: var(--red); margin-right: 8px; font-weight: 700; }
.am-card__blurb { color: var(--graphite); font-size: .98rem; margin-top: 12px; max-width: 48ch; }
.am-card__acts { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 14px; }
.am-card__btn {
	display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0; border: 0; background: none; cursor: pointer;
	font: 600 .875rem/1 var(--sans); color: var(--ink); text-decoration: none;
	background-image: linear-gradient(currentColor, currentColor); background-size: 100% 1px; background-position: 0 calc(100% - 6px); background-repeat: no-repeat;
	transition: background-size .4s var(--ease);
}
.am-card__btn:hover { background-size: 0 1px; background-position: 100% calc(100% - 6px); }
.am-card__btn--out { font: 500 .8125rem/1 var(--mono); color: var(--graphite); }
.am-card__btn .am-ic { width: 14px; height: 14px; }

.am-grid[data-layout="list"] { grid-template-columns: 1fr; gap: 0; border-top: 1px solid var(--ink); }
.am-grid[data-layout="list"] .am-card { border-bottom: 1px solid var(--line); }
.am-grid[data-layout="list"] .am-card__win { display: none; }
.am-grid[data-layout="list"] .am-card__meta { margin: 0; padding: 22px 0; align-items: center; }
.am-grid[data-layout="list"] .am-card__n { grid-row: auto; padding: 0; }
.am-grid[data-layout="list"] .am-card__title { font-size: clamp(1.5rem, 3.2vw, 2.6rem); letter-spacing: -.045em; }
.am-grid[data-layout="list"] .am-card__blurb { display: none; }
@media (min-width: 900px) {
	.am-grid[data-layout="list"] .am-card__meta { grid-template-columns: 3.5rem minmax(0, 1.25fr) minmax(0, 1fr) auto; column-gap: 24px; }
	.am-grid[data-layout="list"] .am-card__meta > * { grid-column: auto; margin: 0; }
	.am-grid[data-layout="list"] .am-card__acts { justify-content: flex-end; }
}
.am-float {
	position: fixed; left: 0; top: 0; z-index: 60; width: 360px; pointer-events: none;
	background: var(--white); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; box-shadow: var(--shadow);
	opacity: 0; transform: translate3d(-999px, -999px, 0) scale(.9); transition: opacity .25s;
}
.am-float.is-on { opacity: 1; }
.am-float__bar { display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 10px; background: var(--paper); border-bottom: 1px solid var(--line); font: 500 .6875rem/1 var(--mono); color: var(--ink); }
.am-float__bar .am-win__sl { width: 14px; }
.am-float img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; }
@media (hover: none) { .am-float { display: none; } }
.am-work__empty { padding: 60px 0; color: var(--graphite); font-family: var(--mono); }

/* ---------- Preview overlay ---------- */
.am-pv {
	position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none;
	margin: 0; padding: 0; border: 0; background: var(--ink); color: var(--white);
	display: none; flex-direction: column; overflow: hidden;
	font-family: var(--sans);
}
.am-pv[open] { display: flex; }
.am-pv::backdrop { background: rgba(10, 10, 10, .7); }
.am-pv__top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 12px var(--gut); border-bottom: 1px solid var(--ink-3); }
.am-pv__title { display: flex; align-items: baseline; gap: 12px; min-width: 0; flex: 1 1 220px; }
.am-pv__title strong { font-size: clamp(1.05rem, 1.6vw, 1.35rem); letter-spacing: -.025em; font-weight: 620; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-pv__count, .am-pv__meta { font: 500 .75rem/1 var(--mono); color: var(--fog); white-space: nowrap; }
.am-pv__meta { display: none; }
@media (min-width: 1180px) { .am-pv__meta { display: inline; } }
.am-pv__devices, .am-pv__mode { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--ink-4); border-radius: 999px; }
.am-pv__devices button, .am-pv__mode button {
	display: inline-grid; place-items: center; height: 36px; min-width: 40px; padding: 0 12px; border: 0; border-radius: 999px;
	background: transparent; color: var(--fog); cursor: pointer; font: 500 .8125rem/1 var(--mono);
	transition: background .25s, color .25s;
}
.am-pv__devices .am-ic { width: 18px; height: 18px; }
.am-pv__devices [aria-pressed="true"], .am-pv__mode [aria-pressed="true"] { background: var(--white); color: var(--ink); }
.am-pv__mode button:disabled { opacity: .35; cursor: not-allowed; }
@media (max-width: 759px) { .am-pv__devices { display: none; } }
.am-pv__nav { display: flex; align-items: center; gap: 6px; }
.am-pv__btn { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--ink-4); background: transparent; color: var(--white); cursor: pointer; transition: border-color .25s, background .25s; }
.am-pv__btn:hover { border-color: var(--white); }
.am-pv__btn .am-ic { width: 20px; height: 20px; }
.am-pv__close { background: var(--white); color: var(--ink); border-color: var(--white); }
.am-pv__close:hover { background: var(--red); border-color: var(--red); color: var(--white); }
.am-pv__visit { min-height: 44px; padding-inline: 16px 14px; font-size: .9375rem; --bg: var(--red); border-color: var(--red); --sweep: var(--white); }
@media (hover: hover) { .am-pv__visit:hover { color: var(--ink); } }
@media (max-width: 519px) { .am-pv__visit .am-btn__label { display: none; } .am-pv__visit { padding-inline: 12px; } }
.am-pv__stage { position: relative; flex: 1; min-height: 0; display: flex; justify-content: center; padding: clamp(10px, 2vw, 26px) var(--gut) 0; }
.am-pv__frame {
	display: flex; flex-direction: column; width: 100%; max-width: 1640px; height: 100%;
	background: var(--white); color: var(--ink); border-radius: 10px 10px 0 0; overflow: hidden;
	transition: max-width .6s var(--ease);
}
.am-pv__frame[data-device="tablet"] { max-width: 820px; }
.am-pv__frame[data-device="mobile"] { max-width: 390px; }
.am-pv__frame .am-win__bar { flex: none; }
.am-pv__frame .am-win__reload { cursor: pointer; }
.am-pv__progress { position: absolute; left: 0; bottom: -1px; height: 2px; width: 0; background: var(--red); }
.am-pv__progress.is-run { width: 82%; transition: width 6s cubic-bezier(.1, .6, .2, 1); }
.am-pv__progress.is-done { width: 100%; opacity: 0; transition: width .3s, opacity .4s .3s; }
.am-pv__view { position: relative; flex: 1; min-height: 0; overflow: hidden; background: var(--white); }
.am-pv__scaler { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
.am-pv__iframe { display: block; width: 100%; height: 100%; border: 0; background: var(--white); }
.am-pv__shot { position: absolute; inset: 0; overflow-y: auto; overscroll-behavior: contain; background: var(--white); }
.am-pv__shot img { display: block; width: 100%; height: auto; }
.am-pv__shot[hidden] { display: none; }
.am-pv__loading {
	position: absolute; inset: 0; display: grid; place-content: center; gap: 8px; text-align: center;
	background: var(--white); color: var(--graphite); font: 500 .875rem/1.4 var(--mono); pointer-events: none;
	transition: opacity .4s;
}
.am-pv__loading span:first-child { color: var(--red); font-weight: 700; }
.am-pv__loading.is-done { opacity: 0; }
.am-pv__note { padding: 10px var(--gut) 12px; text-align: center; font: 500 .75rem/1.4 var(--mono); color: var(--fog); border-top: 1px solid var(--ink-3); }

@media (max-width: 699px) {
	.am-work__bar { position: relative; top: auto; flex-wrap: nowrap; align-items: center; }
	.am-work__filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-left: calc(var(--gut) * -1); padding-left: var(--gut); min-width: 0; flex: 1; }
	.am-work__filters::-webkit-scrollbar { display: none; }
	.am-work__filters > * { flex: none; }
	.am-work__views { flex: none; }
}

/* ---------- Service demo band ---------- */
.am-demo { padding-block: var(--sec); background: var(--paper); }
.am-demo__in { display: grid; gap: 44px; align-items: center; }
.am-demo__copy p { color: #2B2B2B; margin-top: 22px; max-width: 40ch; }
.am-demo__stage { min-width: 0; }
@media (min-width: 1024px) { .am-demo__in { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(40px, 5vw, 88px); } }

.am-serp__q { display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 16px; border: 1px solid var(--line); border-radius: 999px; background: var(--white); box-shadow: 0 8px 22px -14px rgba(10, 10, 10, .35); font-size: .98rem; white-space: nowrap; overflow: hidden; }
.am-serp__q .am-ic { width: 18px; height: 18px; color: var(--graphite); }

/* Build (websites) */
.am-build { display: grid; gap: 16px; }
.am-build__toggles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.am-switch {
	display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%;
	padding: 12px; border: 1px solid var(--line); background: var(--white); cursor: pointer; text-align: left; color: var(--ink);
	transition: border-color .25s;
}
.am-switch:hover { border-color: var(--ink); }
.am-switch__n { font: 500 .6875rem/1 var(--mono); color: var(--graphite); }
.am-switch__t { display: grid; gap: 3px; font-weight: 600; font-size: .92rem; letter-spacing: -.01em; line-height: 1.15; }
.am-switch__t small { font: 400 .6875rem/1.25 var(--mono); color: var(--graphite); }
.am-switch__knob { position: relative; width: 38px; height: 22px; border-radius: 999px; background: var(--paper-2); transition: background .3s; }
.am-switch__knob::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--white); box-shadow: 0 1px 3px rgba(10, 10, 10, .25); transition: transform .4s var(--ease), background .3s; }
.am-switch[aria-pressed="true"] { border-color: var(--ink); }
.am-switch[aria-pressed="true"] .am-switch__knob { background: var(--ink); }
.am-switch[aria-pressed="true"] .am-switch__knob::after { transform: translateX(16px); background: var(--red); }
@media (min-width: 760px) {
	.am-build { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); align-items: start; }
	.am-build__toggles { grid-template-columns: 1fr; }
}
.am-build__win .am-win__url { opacity: .5; transition: opacity .4s; }
.am-build__host { color: var(--fog) !important; transition: color .4s; }
.has-plot .am-build__win .am-win__url { opacity: 1; }
.has-plot .am-build__host { color: var(--ink) !important; }
.am-build__view { position: relative; aspect-ratio: 16 / 11; padding: clamp(14px, 2.4vw, 28px); display: flex; flex-direction: column; gap: clamp(12px, 2vw, 22px); overflow: hidden; background: var(--white); }
.am-build__grid {
	position: absolute; inset: 0; opacity: 0; transition: opacity .6s;
	background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
	background-size: 22px 22px;
}
.has-plot .am-build__grid { opacity: .7; }
.has-signage .am-build__grid { opacity: 0; }
.am-build__nav, .am-build__hero, .am-build__cols { position: relative; opacity: 0; transform: translateY(12px); transition: opacity .5s, transform .7s var(--ease); }
.has-structure .am-build__nav, .has-structure .am-build__hero, .has-structure .am-build__cols { opacity: 1; transform: none; }
.has-structure .am-build__hero { transition-delay: .08s; }
.has-structure .am-build__cols { transition-delay: .16s; }
.am-build__nav { display: flex; align-items: center; gap: 12px; padding-bottom: 10px; border-bottom: 1px dashed var(--line); }
.am-build__logo { font-weight: 800; letter-spacing: -.05em; font-size: clamp(.9rem, 1.4vw, 1.15rem); color: transparent; background: var(--paper-2); border-radius: 3px; transition: color .5s, background .5s; }
.am-build__nav i { display: block; width: 42px; height: 8px; background: var(--paper-2); border-radius: 3px; }
.am-build__nav i:first-of-type { margin-left: auto; }
.am-build__nav em { display: block; width: 68px; height: 24px; background: var(--paper-2); border-radius: 3px; transition: background .4s; }
.am-build__hero { display: grid; grid-template-columns: 1.15fr .85fr; gap: 16px; flex: 1; min-height: 0; }
.am-build__txt { display: flex; flex-direction: column; justify-content: center; gap: 8px; align-items: flex-start; min-width: 0; }
.am-build__eyebrow { font: 500 clamp(.55rem, .8vw, .7rem)/1.3 var(--mono); color: transparent; background: var(--paper-2); border-radius: 3px; transition: color .5s, background .5s; }
.am-build__h { font-size: clamp(1rem, 2.5vw, 2.15rem); font-weight: 700; letter-spacing: -.045em; line-height: 1.02; color: transparent; background: var(--paper-2); border-radius: 4px; -webkit-box-decoration-break: clone; box-decoration-break: clone; transition: color .5s, background .5s; }
.am-build__p { display: block; height: 7px; width: 90%; background: var(--paper-2); border-radius: 3px; }
.am-build__p--s { width: 60%; }
.am-build__btns { display: flex; gap: 8px; margin-top: 4px; }
.am-build__call, .am-build__quote { font-size: clamp(.55rem, .85vw, .72rem); font-weight: 600; padding: 7px 11px; border-radius: 3px; color: transparent; background: var(--paper-2); transition: color .4s, background .4s, box-shadow .4s; white-space: nowrap; }
.am-build__img { border-radius: 4px; background: var(--paper-2); transition: background .6s; min-height: 0; }
.am-build__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.am-build__cols i { display: block; height: clamp(22px, 4vw, 44px); background: var(--paper-2); border-radius: 3px; }
.has-signage .am-build__logo, .has-signage .am-build__eyebrow, .has-signage .am-build__h { color: var(--ink); background: transparent; }
.has-signage .am-build__eyebrow { color: var(--graphite); }
.has-signage .am-build__quote { color: var(--ink); background: transparent; box-shadow: inset 0 0 0 1px var(--ink); }
.has-signage .am-build__img {
	background:
		linear-gradient(transparent 56%, var(--ink) 56% 61%, transparent 61%),
		linear-gradient(90deg, transparent 20%, var(--ink) 20% 23%, transparent 23% 77%, var(--ink) 77% 80%, transparent 80%) 0 100% / 100% 39% no-repeat,
		radial-gradient(circle at 74% 26%, var(--white) 0 9%, transparent 9.5%),
		var(--paper-2);
}
.has-door .am-build__call { color: var(--white); background: var(--red); }
.has-door .am-build__nav em { background: var(--ink); }
.am-build__wa { position: absolute; right: 14px; bottom: 14px; width: 38px; height: 38px; border-radius: 50%; background: var(--ink); color: var(--white); display: grid; place-items: center; transform: scale(0); transition: transform .6s var(--ease) .15s; }
.am-build__wa .am-ic { width: 20px; height: 20px; }
.has-door .am-build__wa { transform: scale(1); }

/* Store (e-commerce) */
.am-store { display: grid; gap: 14px; }
@media (min-width: 760px) { .am-store { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } }
.am-store__scene { position: relative; aspect-ratio: 4 / 3.3; overflow: hidden; border-radius: 8px; background: linear-gradient(180deg, #050505, #161616 70%, #1d1d1d); color: var(--white); }
.am-store__sky { position: absolute; inset: 0; }
.am-store__moon { position: absolute; right: 12%; top: 12%; width: 9%; aspect-ratio: 1; border-radius: 50%; background: var(--white); box-shadow: inset -8px -2px 0 0 #d0d0d0; transform: translateY(var(--moon, 0)); }
.am-store__front { position: absolute; left: 10%; right: 10%; bottom: 0; height: 58%; background: #1b1b1b; border: 1px solid var(--ink-4); border-bottom: 0; }
.am-store__awning { position: absolute; left: -4%; right: -4%; top: -9%; height: 16%; background: repeating-linear-gradient(90deg, #2b2b2b 0 22px, #141414 22px 44px); border-bottom: 2px solid var(--ink-4); }
.am-store__window { position: absolute; left: 8%; top: 22%; width: 52%; height: 50%; background: #101010; border: 1px solid var(--ink-4); display: grid; place-items: center; }
.am-store__sign { font: 600 clamp(.6rem, 1vw, .8rem)/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; padding: 6px 9px; border: 1px solid var(--red); color: var(--white); }
.am-store__door { position: absolute; right: 8%; bottom: 0; width: 22%; height: 72%; background: #0e0e0e; border: 1px solid var(--ink-4); border-bottom: 0; }
.am-store__clock { position: absolute; left: 16px; top: 14px; display: grid; gap: 4px; }
.am-store__clock span { font: 600 clamp(1.9rem, 4vw, 3.2rem)/1 var(--mono); letter-spacing: -.04em; }
.am-store__clock small { font: 500 .75rem/1 var(--mono); color: var(--fog); }
.am-store__phone { display: flex; flex-direction: column; padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--white); }
.am-store__app { display: flex; align-items: center; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid var(--line); font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-store__app .am-ic { width: 16px; height: 16px; color: var(--ink); }
.am-store__orders { flex: 1; }
.am-store__order { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: .9rem; opacity: .14; transform: translateX(-6px); transition: opacity .45s, transform .6s var(--ease); }
.am-store__order.is-on { opacity: 1; transform: none; }
.am-store__t { font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-store__item { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-store__order b { font: 600 .8125rem/1 var(--mono); }
.am-store__order.is-new .am-store__t { color: var(--red); }
.am-store__total { display: flex; justify-content: space-between; align-items: baseline; padding-top: 14px; font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-store__total b { font: 700 2rem/1 var(--sans); color: var(--ink); letter-spacing: -.05em; }

/* SERP (SEO) */
.am-serp { display: grid; gap: 16px; }
@media (min-width: 820px) { .am-serp { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); align-items: start; } }
.am-serp__win { padding: 16px; }
.am-serp__list { --rh: 56px; position: relative; height: calc(8 * var(--rh)); margin-top: 14px; }
.am-serp__r { position: absolute; left: 0; right: 0; top: 0; height: var(--rh); display: grid; align-content: center; gap: 5px; padding: 0 12px; transform: translateY(calc(var(--i) * var(--rh))); transition: transform .7s var(--ease); }
.am-serp__r small { font: 500 .6875rem/1 var(--mono); color: var(--graphite); }
.am-serp__r > i { display: block; height: 9px; width: 58%; background: var(--paper-2); border-radius: 3px; }
.am-serp__r > i.am-serp__s { height: 6px; width: 86%; background: var(--paper); }
.am-serp__r--you { z-index: 2; background: var(--white); border: 1px solid var(--ink); border-radius: 6px; }
.am-serp__r--you b { font-size: .92rem; font-weight: 600; letter-spacing: -.015em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-serp__r--you.is-top { border-color: var(--red); box-shadow: 0 16px 30px -18px rgba(225, 6, 0, .45); }
.am-serp__pos { display: flex; align-items: baseline; gap: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--ink); }
.am-serp__pos span { font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-serp__pos b { font-size: clamp(3.6rem, 8vw, 6.5rem); font-weight: 700; letter-spacing: -.06em; line-height: .9; font-variant-numeric: tabular-nums; transition: color .3s; }
.am-serp__pos b.is-top { color: var(--red); }
.am-serp__checks li { display: flex; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--line); color: var(--graphite); font-size: .95rem; transition: color .3s; }
.am-serp__tick { position: relative; width: 18px; height: 18px; flex: none; border: 1px solid var(--fog); transition: background .3s, border-color .3s; }
.am-serp__checks li.is-on { color: var(--ink); }
.am-serp__checks li.is-on .am-serp__tick { background: var(--ink); border-color: var(--ink); }
.am-serp__checks li.is-on .am-serp__tick::after { content: ""; position: absolute; left: 5px; top: 1px; width: 5px; height: 10px; border: solid var(--white); border-width: 0 2px 2px 0; transform: rotate(45deg); }

/* Ads (Google) */
.am-ads { display: grid; gap: 16px; }
.am-ads__label { font: 500 .75rem/1 var(--mono); color: var(--graphite); margin-bottom: 10px; }
.am-ads__win { padding: 16px; }
.am-ads__caret { width: 1.5px; height: 18px; background: var(--red); animation: am-blink 1s steps(1) infinite; margin-left: -6px; }
.am-ads__results { display: grid; gap: 12px; margin-top: 16px; }
.am-ads__ad { display: grid; gap: 4px; padding: 14px; border: 1px solid var(--ink); border-radius: 6px; overflow: hidden; max-height: 220px; transition: opacity .4s, transform .6s var(--ease), max-height .6s var(--ease), padding .6s var(--ease), border-width .3s; }
.am-ads__ad:not(.is-on) { opacity: 0; transform: translateY(-8px); max-height: 0; padding-block: 0; border-width: 0; }
.am-ads__ad small { font: 500 .6875rem/1.2 var(--mono); }
.am-ads__ad b { font-size: 1rem; letter-spacing: -.015em; }
.am-ads__ad p { color: var(--graphite); font-size: .9rem; }
.am-ads__results .am-serp__r { position: static; transform: none; height: auto; padding: 6px 0; }
.am-ads__status { padding: 12px 14px; border-left: 3px solid var(--line); font: 500 .8125rem/1.4 var(--mono); color: var(--graphite); min-height: 46px; transition: border-color .3s, color .3s; }
.am-ads__status.is-hit { border-color: var(--red); color: var(--ink); }

/* Audience (Meta) */
.am-aud { display: grid; gap: 16px; }
.am-aud__top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 14px; }
.am-aud__top .am-chips { max-width: 520px; }
.am-aud__count { text-align: right; }
.am-aud__count b { display: block; font-size: clamp(2.6rem, 6vw, 4.5rem); font-weight: 700; letter-spacing: -.06em; line-height: .9; font-variant-numeric: tabular-nums; }
.am-aud__count span { font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-aud__crowd { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(5px, 1vw, 10px); padding: clamp(14px, 2.4vw, 26px); background: var(--white); border: 1px solid var(--line); border-radius: 8px; }
@media (min-width: 600px) { .am-aud__crowd { grid-template-columns: repeat(14, 1fr); } }
@media (min-width: 1200px) { .am-aud__crowd { grid-template-columns: repeat(21, 1fr); } }
.am-aud__crowd i { display: block; aspect-ratio: 1; border-radius: 50%; background: var(--ink); transition: background .5s, transform .6s var(--ease); }
.am-aud__crowd i.is-out { background: var(--paper-2); transform: scale(.5); }
.am-aud__crowd i.is-hit { background: var(--red); transform: scale(1.12); }
.am-aud__note { font: 500 .8125rem/1.4 var(--mono); color: var(--graphite); }

/* Calendar (social) */
.am-cal { background: var(--white); border: 1px solid var(--line); border-radius: 8px; padding: clamp(14px, 2.4vw, 28px); }
.am-cal__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 16px; }
.am-cal__head b { font-size: 1.35rem; letter-spacing: -.03em; }
.am-cal__head span, .am-cal__count { font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-cal__count b { font-size: 1rem; color: var(--ink); letter-spacing: 0; }
.am-cal__dow, .am-cal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.am-cal__dow { font: 500 .6875rem/1 var(--mono); color: var(--graphite); margin-bottom: 8px; }
.am-cal__dow li { padding-left: 6px; }
.am-cal__grid { border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.am-cal__grid li { position: relative; display: flex; flex-direction: column; gap: 4px; min-height: clamp(44px, 7vw, 82px); padding: 5px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); min-width: 0; }
.am-cal__blank { background: var(--paper); }
.am-cal__d { font: 500 .6875rem/1 var(--mono); color: var(--graphite); }
.am-cal__post { display: block; padding: 5px 6px; border-radius: 2px; font: 600 .6875rem/1 var(--sans); white-space: nowrap; overflow: hidden; opacity: 0; transform: translateY(6px) scale(.94); transition: opacity .35s, transform .5s var(--ease); }
.am-cal__post.is-on, .am-cal__sw { opacity: 1; transform: none; }
.am-cal__post--sell { background: var(--red); color: var(--white); }
.am-cal__post--show { background: var(--ink); color: var(--white); }
.am-cal__post--teach { background: var(--white); color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.am-cal__post--prove { background: repeating-linear-gradient(-45deg, var(--paper-2) 0 4px, var(--white) 4px 8px); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line); }
@media (max-width: 599px) { .am-cal__post { font-size: 0; padding: 0; height: 8px; } }
.am-cal__legend { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 16px; font-size: .875rem; color: var(--graphite); }
.am-cal__legend li { display: inline-flex; align-items: center; gap: 8px; }
.am-cal__sw { display: inline-block; width: 14px; height: 14px; padding: 0; border-radius: 2px; }

/* ---------- Service sections ---------- */
.am-inc { padding-block: var(--sec); }
.am-inc__list { display: grid; border-top: 1px solid var(--ink); }
@media (min-width: 760px) { .am-inc__list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(24px, 4vw, 72px); } }
.am-inc__item { display: grid; grid-template-columns: 3rem minmax(0, 1fr); padding: 28px 0; border-bottom: 1px solid var(--line); }
.am-inc__n { grid-row: span 2; font: 500 .75rem/1 var(--mono); color: var(--graphite); padding-top: .55em; }
.am-inc__t { font-size: var(--fs-h3); letter-spacing: -.03em; font-weight: 620; line-height: 1.15; }
.am-inc__d { color: var(--graphite); margin-top: 8px; max-width: 46ch; }

.am-steps { padding-bottom: var(--sec); }
.am-steps__list { display: grid; gap: 36px 28px; border-top: 1px solid var(--ink); }
@media (min-width: 700px) { .am-steps__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .am-steps__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.am-steps__item { position: relative; padding-top: 38px; }
.am-steps__mark { position: absolute; top: -12px; left: 0; padding-right: 10px; background: var(--white); color: var(--ink); }
.am-steps__sl { width: 24px; height: auto; }
.am-steps__n { font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-steps__t { font-size: var(--fs-h3); letter-spacing: -.03em; font-weight: 620; margin: 10px 0 8px; }
.am-steps__item p { color: var(--graphite); max-width: 34ch; }

.am-rel { padding-block: var(--sec); }
.am-rel .am-sechead--split > :last-child { justify-self: start; }
@media (min-width: 900px) { .am-rel .am-sechead--split > :last-child { justify-self: end; } }
.am-rel__list { display: grid; gap: 44px 24px; }
@media (min-width: 700px) { .am-rel__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1240px) { .am-rel__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.am-rel__win { transition: transform .6s var(--ease); }
@media (hover: hover) { .am-rel__win:hover { transform: translateY(-6px); } }
.am-rel__t { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; margin-top: 16px; }
.am-rel__t strong { font-weight: 620; letter-spacing: -.02em; font-size: 1.1rem; }
.am-rel__t span { font: 500 .75rem/1.6 var(--mono); color: var(--fog); }

.am-faq { padding-block: var(--sec); }
.am-faq__in { display: grid; gap: 40px; }
@media (min-width: 1024px) { .am-faq__in { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(40px, 5vw, 88px); } }
.am-faq__more { margin-top: 22px; color: var(--graphite); }
.am-faq__more a { color: var(--ink); font-weight: 600; text-decoration-color: var(--red); }
.am-faq__list { border-top: 1px solid var(--ink); }
.am-q { border-bottom: 1px solid var(--line); }
.am-q summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 24px 0; cursor: pointer; list-style: none; font-size: clamp(1.08rem, 1.6vw, 1.35rem); font-weight: 580; letter-spacing: -.02em; line-height: 1.3; }
.am-q summary::-webkit-details-marker { display: none; }
.am-q__ic { position: relative; flex: none; width: 22px; height: 22px; }
.am-q__ic::before, .am-q__ic::after { content: ""; position: absolute; left: 50%; top: 50%; width: 16px; height: 2px; margin: -1px 0 0 -8px; background: var(--ink); transition: transform .45s var(--ease), background .3s; }
.am-q__ic::after { transform: rotate(90deg); }
.am-q[open] .am-q__ic::before { transform: rotate(45deg); background: var(--red); }
.am-q[open] .am-q__ic::after { transform: rotate(135deg); background: var(--red); }
.am-q__a { padding: 0 44px 26px 0; color: var(--graphite); max-width: 64ch; }
@supports (interpolate-size: allow-keywords) {
	.am-faq { interpolate-size: allow-keywords; }
	.am-q::details-content { block-size: 0; overflow: hidden; transition: block-size .5s var(--ease), content-visibility .5s allow-discrete; }
	.am-q[open]::details-content { block-size: auto; }
}

/* ---------- About ---------- */
.am-princ { padding-block: var(--sec); }
.am-princ__list { border-top: 1px solid var(--ink-3); }
.am-princ__item { display: grid; grid-template-columns: 3rem minmax(0, 1fr); column-gap: 8px; padding: 30px 0; border-bottom: 1px solid var(--ink-3); }
.am-princ__n { font: 500 .75rem/1 var(--mono); color: var(--fog); padding-top: .6em; }
.am-princ__t { font-size: clamp(1.6rem, 3.5vw, 3.1rem); font-weight: 650; letter-spacing: -.05em; line-height: 1; }
.am-princ__item p { grid-column: 2; margin-top: 12px; color: #CFCFCF; max-width: 52ch; }
@media (min-width: 900px) {
	.am-princ__item { grid-template-columns: 5rem minmax(0, 5fr) minmax(0, 6fr); align-items: baseline; padding: 38px 0; }
	.am-princ__item p { grid-column: 3; margin: 0; }
}

.am-founders { padding-block: var(--sec); }
.am-founders__grid { display: grid; gap: 20px; }
@media (min-width: 800px) { .am-founders__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.am-founder { position: relative; display: flex; flex-direction: column; min-height: clamp(280px, 32vw, 420px); padding: clamp(24px, 3vw, 40px); border: 1px solid var(--ink); overflow: hidden; isolation: isolate; }
.am-founder__mark { position: absolute; z-index: -1; right: -4%; top: -6%; width: 46%; color: var(--paper-2); transition: transform 1s var(--ease); }
.am-founder__mark--a .am-slashes__b { display: none; }
.am-founder__mark--b .am-slashes__a { display: none; }
.am-founder__mark--b { top: -30%; }
.am-founder:hover .am-founder__mark { transform: translateY(-4%); }
.am-founder__code { font: 600 .875rem/1 var(--mono); }
.am-founder__name { margin-top: auto; font-size: clamp(2.2rem, 4.4vw, 3.8rem); font-weight: 650; letter-spacing: -.055em; line-height: .95; }
.am-founder__role { font: 500 .8125rem/1 var(--mono); color: var(--graphite); margin-top: 12px; }
.am-founder__line { margin-top: 18px; font-size: .95rem; }
.am-founder__line a { text-decoration-color: var(--red); }

.am-where { padding-bottom: var(--sec); }
.am-where__in { display: grid; gap: 40px; align-items: center; }
@media (min-width: 1024px) { .am-where__in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 5vw, 88px); } }
.am-where__in > div > p { color: #2B2B2B; margin-top: 22px; max-width: 48ch; }
.am-where__addr { font-style: normal; font-size: 1.25rem; font-weight: 560; letter-spacing: -.02em; line-height: 1.4; margin: 26px 0; }

.am-map { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; }
.am-map__ph { position: absolute; inset: 0; }
.am-map__road { position: absolute; background: var(--white); box-shadow: 0 0 0 1px var(--line); }
.am-map__road--1 { left: -10%; right: -10%; top: 58%; height: 16px; transform: rotate(-8deg); }
.am-map__road--2 { top: -10%; bottom: -10%; left: 38%; width: 12px; transform: rotate(14deg); }
.am-map__road--3 { left: -10%; right: -10%; top: 24%; height: 8px; transform: rotate(5deg); }
.am-map__pin { position: absolute; left: 47%; top: 52%; width: 46px; translate: -50% -100%; color: var(--ink); filter: drop-shadow(0 8px 10px rgba(10, 10, 10, .25)); }
.am-map__pin::after { content: ""; position: absolute; left: 30%; bottom: -10px; width: 10px; height: 10px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 6px rgba(225, 6, 0, .18); }
.am-map__label { position: absolute; left: 14px; bottom: 14px; padding: 10px 14px; background: var(--white); border: 1px solid var(--ink); font-size: .9rem; }
.am-map__load { position: absolute; right: 14px; top: 14px; min-height: 44px; font-size: .9rem; }
.am-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.am-map.is-loaded > :not(iframe) { display: none; }

/* ---------- Contact ---------- */
.am-contact { padding-bottom: var(--sec); }
.am-contact__in { display: grid; gap: 44px; }
@media (min-width: 1024px) {
	.am-contact__in { grid-template-columns: minmax(0, 7.3fr) minmax(0, 4.7fr); gap: clamp(32px, 4vw, 72px); align-items: start; }
	.am-contact__aside { position: sticky; top: calc(var(--head) + 24px); }
}
.am-contact__body { padding: clamp(20px, 3.4vw, 44px); }
.am-contact__aside { display: grid; gap: 28px; }
.am-contact__aside .am-foot__label { color: var(--graphite); margin: 0; }
.am-contact__hours { font-size: .95rem; }
.am-lines { border-top: 1px solid var(--ink); }
.am-lines a { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "k go" "v go"; gap: 6px 12px; padding: 18px 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.am-lines__k { grid-area: k; display: flex; align-items: center; gap: 8px; font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-lines__k .am-ic { width: 16px; height: 16px; color: var(--ink); }
.am-lines__v { grid-area: v; font-size: clamp(1.1rem, 1.6vw, 1.35rem); font-weight: 580; letter-spacing: -.02em; overflow-wrap: anywhere; }
.am-lines__go { grid-area: go; align-self: center; transition: transform .45s var(--ease), color .3s; }
.am-lines__go .am-ic { width: 20px; height: 20px; }
.am-lines a:hover .am-lines__go { transform: translateX(4px); color: var(--red); }

.am-form { position: relative; display: grid; gap: 28px; }
.am-form fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.am-form__legend { padding: 0; margin-bottom: 14px; font-weight: 600; font-size: 1.05rem; letter-spacing: -.01em; }
.am-form__grid { display: grid; gap: 18px 20px; }
@media (min-width: 700px) {
	.am-form__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.am-field--message { grid-column: 1 / -1; }
}
.am-field { display: grid; gap: 8px; margin: 0; min-width: 0; }
.am-field label { font: 500 .8125rem/1.2 var(--mono); color: var(--graphite); }
.am-field label span { color: var(--red); }
.am-field input, .am-field textarea {
	width: 100%; min-height: 54px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 0; background: var(--white);
	font: 400 1rem/1.4 var(--sans); color: var(--ink); transition: border-color .2s, box-shadow .2s; -webkit-appearance: none; appearance: none;
}
.am-field textarea { min-height: 150px; resize: vertical; }
.am-field input:focus, .am-field textarea:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px rgba(10, 10, 10, .08); }
.am-field [aria-invalid="true"] { border-color: var(--red); }
.am-field__url { display: flex; align-items: center; min-height: 54px; border: 1px solid var(--line); background: var(--white); transition: border-color .2s, box-shadow .2s; }
.am-field__url > span { padding-left: 16px; font: 500 .9375rem/1 var(--mono); color: var(--graphite); }
.am-field__url input { border: 0; min-height: 52px; padding-left: 2px; box-shadow: none !important; }
.am-field__url:focus-within { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(10, 10, 10, .08); }
.am-field__err { color: var(--red); font-size: .85rem; }
.am-form__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.am-form__consent { font-size: .875rem; color: var(--graphite); }
.am-form__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.am-form__state { display: grid; gap: 4px; padding: 16px 18px; border-left: 3px solid var(--ink); background: var(--paper); }
.am-form__state:focus { outline: none; }
.am-form__code { font: 700 .8125rem/1 var(--mono); }
.am-form__state--ok .am-form__code { color: var(--red); }
.am-form__state--err { border-color: var(--red); }
.am-form.is-sending button[type="submit"] { opacity: .6; pointer-events: none; }

/* ---------- Legal, posts, 404, editor ---------- */
.am-legal { padding-bottom: var(--sec); }
.am-wrap.am-prose { max-width: calc(820px + var(--gut) * 2); }
.am-prose > * + * { margin-top: 1.1em; }
.am-prose h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); letter-spacing: -.03em; font-weight: 640; margin-top: 2em; line-height: 1.15; }
.am-prose h3 { font-size: 1.3rem; letter-spacing: -.02em; margin-top: 1.6em; }
.am-prose a { color: var(--ink); text-decoration-color: var(--red); }
.am-prose :is(ul, ol):not([class]) { padding-left: 1.2em; }
.am-prose li + li { margin-top: .4em; }
.am-prose blockquote { border-left: 3px solid var(--red); padding-left: 20px; font-size: 1.25rem; }
.am-prose img { border-radius: 6px; }
.am-legal__img { margin-bottom: 32px; }
.am-editor { padding-block: clamp(48px, 6vw, 96px); }
.am-editor--el { padding: 0; }
.am-canvas { min-height: 40vh; }
.am-posts { border-top: 1px solid var(--ink); }
.am-posts__item a { display: grid; gap: 6px; padding: 24px 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.am-posts__date { font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-posts__t { font-size: clamp(1.4rem, 2.4vw, 2rem); font-weight: 640; letter-spacing: -.035em; }
.am-posts__x { color: var(--graphite); }
.am-pager { margin-top: 32px; font-family: var(--mono); }
.am-search { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.am-search input { flex: 1 1 240px; min-height: 52px; padding: 0 16px; border: 1px solid var(--ink); font: inherit; }
.am-404 { padding-block: clamp(48px, 8vw, 120px) var(--sec); }
.am-404__url { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 10px 16px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); font: 500 .875rem/1 var(--mono); white-space: nowrap; overflow: hidden; }
.am-404__url .am-ic { width: 14px; height: 14px; }
.am-404__url b { color: var(--red); font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
.am-404__h { font-size: var(--fs-h1); line-height: .92; letter-spacing: -.055em; font-weight: 670; margin: 32px 0 24px; max-width: 13ch; }
.am-404__h span { display: block; font: 600 .875rem/1 var(--mono); color: var(--red); letter-spacing: 0; margin-bottom: 18px; }
.am-404__links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 36px; }
.am-404__links a { display: inline-flex; align-items: center; min-height: 48px; padding: 0 18px; border: 1px solid var(--ink); font: 600 1.05rem/1 var(--mono); text-decoration: none; transition: background .25s, color .25s; }
.am-404__links a span { color: var(--red); }
.am-404__links a:hover { background: var(--ink); color: var(--white); }
.am-comments { margin-top: 48px; }

/* ---------- Footer ---------- */
.am-addr {
	display: flex; align-items: center; gap: 4px; max-width: 860px; margin-top: clamp(34px, 4vw, 56px);
	height: clamp(62px, 6vw, 78px); padding: 0 7px 0 clamp(14px, 2vw, 24px);
	border: 1.5px solid var(--ink-4); border-radius: 999px; background: var(--ink-2);
	font: 500 clamp(1rem, 1.7vw, 1.4rem)/1 var(--mono); color: var(--fog); cursor: text;
	transition: border-color .3s;
}
.am-addr:focus-within { border-color: var(--white); }
.am-addr__lock { display: inline-flex; margin-right: 6px; color: var(--white); }
.am-addr__lock .am-ic { width: 18px; height: 18px; }
.am-addr__pre { display: none; }
@media (min-width: 520px) { .am-addr__pre { display: inline; } }
.am-addr__field { display: inline-grid; grid-template-columns: minmax(1ch, auto); min-width: 0; max-width: 100%; overflow: hidden; }
.am-addr__sizer { grid-area: 1 / 1; visibility: hidden; white-space: pre; font-weight: 600; padding-right: 2px; }
.am-addr__in { grid-area: 1 / 1; min-width: 0; width: 100%; padding: 0; border: 0; outline: 0; background: none; color: var(--white); font: inherit; font-weight: 600; }
.am-addr__suf { margin-right: auto; }
.am-addr__in::placeholder { color: #8C8C8C; }
.am-addr__suf { flex: none; color: var(--fog); }
.am-addr__go {
	flex: none; display: inline-flex; align-items: center; gap: 10px; height: calc(100% - 14px); padding: 0 clamp(16px, 2vw, 26px); margin-left: 8px;
	border: 0; border-radius: 999px; background: var(--red); color: var(--white); cursor: pointer;
	font: 600 1rem/1 var(--sans); transition: background .3s, color .3s;
}
.am-addr__go kbd { font: 500 1rem/1 var(--mono); }
.am-addr__go:hover { background: var(--white); color: var(--ink); }
@media (max-width: 479px) { .am-addr__suf, .am-addr__go span { display: none; } }
/* ---------- Reveal + motion states ---------- */
.js [data-reveal] { opacity: 0; transform: translate3d(0, 28px, 0); }
.js [data-reveal].is-in { opacity: 1; transform: none; transition: opacity .9s var(--ease) var(--d, 0s), transform 1.1s var(--ease) var(--d, 0s); }
.js [data-split]:not(.is-split) { visibility: hidden; }
.js .am-hero__word, .js .am-hero__sl { transform: translateY(108%); }
.js [data-hero-meta], .js [data-hero-copy], .js .am-hero .am-play { opacity: 0; }
@keyframes am-fallback { to { opacity: 1; transform: none; visibility: visible; } }
.js:not(.am-ready) :is([data-reveal], [data-split], .am-hero__word, .am-hero__sl, [data-hero-meta], [data-hero-copy], .am-hero .am-play) { animation: am-fallback .6s 3.5s forwards; }

@media (prefers-reduced-motion: reduce) {
	.js [data-reveal], .js [data-split], .js .am-hero__word, .js .am-hero__sl, .js [data-hero-meta], .js [data-hero-copy], .js .am-play {
		opacity: 1 !important; transform: none !important; visibility: visible !important; animation: none !important;
	}
	.am-ticker__track { animation-duration: 600s; }
	.am-wipe { display: none; }
	.am-hero__cursor, .am-pill__caret, .am-ads__caret, .am-ticker__dot { animation: none; }
	.am-btn::before, .am-path__row::before { transition: none; }
}

/* AI search demo: one question, the answer before and after the work. */
.am-ask { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 820px) { .am-ask { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); align-items: start; } }
.am-ask__win { display: grid; gap: 14px; padding: 16px; }
.am-ask__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.am-ask__who { display: inline-flex; align-items: center; gap: 8px; font: 600 .75rem/1 var(--mono); color: var(--graphite); }
.am-ask__who i { width: 18px; height: 18px; border-radius: 50%; background: conic-gradient(from 200deg, var(--ink), #6b6b6b, var(--ink)); }
.am-ask__modes { display: inline-flex; padding: 3px; border-radius: 999px; background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
.am-ask__modes button { height: 32px; padding: 0 14px; border: 0; border-radius: 999px; background: none; font: 600 .8125rem/1 var(--sans); color: var(--graphite); cursor: pointer; transition: background .3s, color .3s; }
.am-ask__modes button[aria-pressed="true"] { background: var(--ink); color: var(--white); }
.am-ask.is-after .am-ask__modes button[aria-pressed="true"] { background: var(--red); }
.am-ask__chat { display: grid; gap: 12px; min-height: 230px; align-content: start; padding: 14px; border-radius: 12px; background: var(--paper); }
.am-ask__q { justify-self: end; max-width: 86%; padding: 10px 14px; border-radius: 14px 14px 4px 14px; background: var(--ink); color: var(--white); font-size: .95rem; line-height: 1.35; }
.am-ask__a { max-width: 92%; padding: 12px 14px; border-radius: 14px 14px 14px 4px; background: var(--white); box-shadow: 0 10px 24px -16px rgba(10, 10, 10, .4); font-size: .95rem; line-height: 1.5; transition: box-shadow .4s; }
.am-ask__a.is-you { box-shadow: inset 3px 0 0 var(--red), 0 16px 30px -18px rgba(225, 6, 0, .45); }
.am-ask__a b { font-weight: 650; }
.am-ask__a.is-you b { color: var(--red); }
.am-ask__a.is-typing [data-ask-text]::after { content: ""; display: inline-block; width: 7px; height: 1em; margin-left: 2px; vertical-align: -2px; background: var(--ink); animation: am-blink .8s steps(1) infinite; }
@keyframes am-blink { 50% { opacity: 0; } }
.am-ask__src { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; opacity: 0; transform: translateY(4px); transition: opacity .4s var(--ease), transform .5s var(--ease); }
.am-ask__src.is-on { opacity: 1; transform: none; }
.am-ask__src span { padding: 4px 9px; border-radius: 999px; background: var(--paper); font: 500 .6875rem/1.2 var(--mono); color: var(--graphite); }
.am-ask__a.is-you .am-ask__src span:first-child { background: var(--ink); color: var(--white); }
.am-ask__pick { display: grid; gap: 6px; }
.am-ask__pick button { padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); text-align: left; font: 500 .875rem/1.35 var(--sans); color: var(--graphite); cursor: pointer; transition: border-color .3s, color .3s, background .3s; }
.am-ask__pick button[aria-pressed="true"] { border-color: var(--ink); color: var(--ink); }
@media (hover: hover) { .am-ask__pick button:hover { border-color: var(--ink); color: var(--ink); } }
.am-ask__score { display: grid; gap: 8px; padding-bottom: 14px; border-bottom: 1px solid var(--ink); }
.am-ask__score span { font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-ask__score b { font-size: clamp(3.6rem, 8vw, 6.5rem); font-weight: 700; letter-spacing: -.06em; line-height: .9; font-variant-numeric: tabular-nums; transition: color .3s; }
.am-ask__score small { font-size: .4em; color: var(--fog); letter-spacing: -.02em; }
.am-ask.is-after .am-ask__score b { color: var(--red); }
.am-ask__checks li { display: flex; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--line); color: var(--graphite); font-size: .95rem; transition: color .3s; }
.am-ask__checks li.is-on { color: var(--ink); }
.am-ask__checks li.is-on .am-serp__tick { background: var(--ink); border-color: var(--ink); }
.am-ask__checks li.is-on .am-serp__tick::after { content: ""; position: absolute; left: 5px; top: 1px; width: 5px; height: 10px; border: solid var(--white); border-width: 0 2px 2px 0; transform: rotate(45deg); }
@media (prefers-reduced-motion: reduce) { .am-ask__a.is-typing [data-ask-text]::after { animation: none; } }

/* ==========================================================================
   v2: depth, cinema, the high street
   ========================================================================== */

/* ---------- Grain on every dark chapter ---------- */
.am-dark { position: relative; isolation: isolate; }
.am-dark::after {
	content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none;
	background: url("../img/grain.png") 0 0 / 96px 96px repeat; opacity: .07; mix-blend-mode: overlay;
}

/* ---------- Intro (once per session): type the address, load, go through the // ---------- */
.am-loader { display: none; }
html.am-intro .am-loader {
	position: fixed; inset: 0; z-index: 260; display: grid; place-items: center;
	background: radial-gradient(70% 60% at 50% 45%, #161616 0%, var(--ink) 70%); color: var(--white);
}
html.am-intro body { overflow: hidden; }
.am-loader__bar {
	position: relative; display: flex; align-items: center; gap: 12px; width: min(680px, calc(100vw - 2 * var(--gut))); height: clamp(58px, 6vw, 72px);
	padding: 0 22px; border-radius: 999px; background: #151515; box-shadow: inset 0 0 0 1px #2a2a2a, 0 40px 80px -30px rgba(0, 0, 0, .9);
	font: 500 clamp(1rem, 1.8vw, 1.3rem)/1 var(--mono); overflow: hidden;
}
.am-loader__lock { display: inline-flex; color: var(--fog); }
.am-loader__lock .am-ic { width: 16px; height: 16px; }
.am-loader__url { white-space: nowrap; overflow: hidden; color: var(--white); }
.am-loader__url span { color: var(--fog); }
.am-loader__caret { flex: none; width: 2px; height: 1.2em; background: var(--red); animation: am-blink 1s steps(1) infinite; }
.am-loader__pct { margin-left: auto; font-size: .75em; color: var(--fog); font-variant-numeric: tabular-nums; }
.am-loader__pct b { color: var(--white); font-weight: 600; }
.am-loader__line { position: absolute; left: 22px; right: 22px; bottom: 0; height: 2px; background: #262626; }
.am-loader__line i { position: absolute; inset: 0; background: var(--red); transform-origin: 0 50%; transform: scaleX(0); }
.am-loader__mark { position: absolute; left: 50%; top: 50%; width: clamp(96px, 11vw, 150px); translate: -50% -50%; opacity: 0; }
.am-loader__sl { display: block; width: 100%; height: auto; overflow: visible; }
.am-loader__sl .am-slashes__a { fill: var(--white); }
.am-loader__sl .am-slashes__b { fill: var(--red); }
.am-loader__foot { position: absolute; left: var(--gut); right: var(--gut); bottom: clamp(22px, 4vw, 44px); display: flex; justify-content: space-between; gap: 16px; font: 500 .75rem/1.3 var(--mono); color: var(--fog); }
@media (max-width: 520px) { .am-loader__foot span:last-child { display: none; } }

/* ---------- Custom cursor (fine pointers only) ---------- */
.am-cursor {
	position: fixed; left: 0; top: 0; z-index: 280; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%;
	background: var(--red); pointer-events: none; opacity: 0; display: grid; place-items: center;
	transition: width .45s var(--ease), height .45s var(--ease), margin .45s var(--ease), opacity .3s, background .3s;
}
.am-cursor.is-on { opacity: 1; }
.am-cursor.is-big { width: 92px; height: 92px; margin: -46px 0 0 -46px; }
.am-cursor__label { font: 600 .6875rem/1.1 var(--mono); color: var(--white); text-align: center; opacity: 0; transition: opacity .2s; letter-spacing: .02em; }
.am-cursor.is-big .am-cursor__label { opacity: 1; transition-delay: .12s; }
@media (hover: none), (pointer: coarse) { .am-cursor { display: none; } }

/* ---------- Header over a dark hero ---------- */
.am-head__logo-dark { display: none; }
.am-head__logo-light, .am-head__logo-dark { height: 100%; align-items: center; }
.am-head__logo-light { display: flex; }
body.am-dark-top .am-main { padding-top: 0; }
body.am-dark-top .am-head:not(.is-solid) { background: transparent; border-bottom-color: transparent; }
body.am-dark-top .am-head:not(.is-solid) .am-head__logo-light { display: none; }
body.am-dark-top .am-head:not(.is-solid) .am-head__logo-dark { display: flex; }
body.am-dark-top .am-head:not(.is-solid) .am-nav__link { color: var(--white); }
body.am-dark-top .am-head:not(.is-solid) .am-pill { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .14); color: var(--fog); }
body.am-dark-top .am-head:not(.is-solid) .am-pill .am-ic, body.am-dark-top .am-head:not(.is-solid) .am-pill__path { color: var(--white); }
body.am-dark-top .am-head:not(.is-solid) .am-head__cta { --bg: var(--white); --fg: var(--ink); }
@media (hover: hover) { body.am-dark-top .am-head:not(.is-solid) .am-head__cta:hover { color: var(--white); } }
body.am-dark-top .am-head:not(.is-solid) .am-burger { color: var(--white); }
body.am-dark-top .am-head:not(.is-solid) .am-burger__sl i:first-child { background: var(--white); }
body.am-dark-top.am-menu-open .am-head .am-head__logo-light { display: flex; }
body.am-dark-top.am-menu-open .am-head .am-head__logo-dark { display: none; }

/* ---------- Hero v2: statement over a wall of real sites in depth ---------- */
.am-hero2 {
	position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: center;
	padding: calc(var(--head) + clamp(40px, 6vw, 80px)) 0 clamp(110px, 12vw, 160px); overflow: clip;
}
.am-hero2::before {
	content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background:
		linear-gradient(90deg, var(--ink) 0%, rgba(10, 10, 10, .94) 30%, rgba(10, 10, 10, .55) 56%, rgba(10, 10, 10, .12) 78%, rgba(10, 10, 10, 0) 100%),
		linear-gradient(0deg, var(--ink) 0%, rgba(10, 10, 10, 0) 26%),
		linear-gradient(180deg, rgba(10, 10, 10, .9) 0%, rgba(10, 10, 10, .5) 12%, rgba(10, 10, 10, 0) 26%);
}
.am-hero2__in { position: relative; z-index: 2; width: 100%; }
.am-hero2__meta { display: inline-flex; align-items: center; gap: 10px; font: 500 var(--fs-mono)/1 var(--mono); color: var(--fog); margin-bottom: clamp(22px, 3vw, 36px); }
.am-hero2__live { width: 8px; height: 8px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 0 rgba(225, 6, 0, .6); animation: am-pulse 2s infinite; }
.am-hero2__h { font-size: clamp(3.5rem, 10vw, 10.25rem); line-height: .86; letter-spacing: -.06em; font-weight: 680; margin-left: -.04em; color: var(--white); }
.am-hero2__line { display: block; overflow: clip; padding-bottom: .07em; }
.am-hero2__w { display: inline-block; }
.am-hero2__sl { display: inline-block; height: .74em; vertical-align: -.005em; margin-left: .05em; color: var(--white); }
.am-hero2__slsvg { height: 100%; width: auto; overflow: visible; }
.am-hero2__sub { margin-top: clamp(24px, 3vw, 36px); max-width: 36ch; font-size: var(--fs-lede); line-height: 1.5; color: #D2D2D2; }
.am-hero2 .am-ctas { margin-top: clamp(26px, 3vw, 38px); }
.am-hero2__proof { display: flex; flex-wrap: wrap; gap: 14px clamp(26px, 4vw, 56px); margin-top: clamp(40px, 5vw, 64px); padding-top: 22px; border-top: 1px solid var(--ink-3); max-width: 640px; }
.am-hero2__proof li { display: grid; gap: 6px; }
.am-hero2__proof b { font-size: clamp(1.9rem, 3vw, 2.6rem); font-weight: 650; letter-spacing: -.05em; line-height: 1; color: var(--white); font-variant-numeric: tabular-nums; }
.am-hero2__proof span { font: 500 .75rem/1.2 var(--mono); color: var(--fog); }
.am-hero2__cue {
	position: absolute; z-index: 2; left: 50%; bottom: clamp(20px, 3vw, 34px); translate: -50% 0;
	display: grid; justify-items: center; gap: 10px; color: var(--fog); text-decoration: none; font: 500 .75rem/1 var(--mono);
}
.am-hero2__cue i { position: relative; width: 1px; height: 46px; background: var(--ink-4); overflow: hidden; }
.am-hero2__cue i::after { content: ""; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--red); animation: am-cue 1.8s var(--ease) infinite; }
@keyframes am-cue { to { top: 110%; } }
.am-hero2__cue:hover { color: var(--white); }

.am-wall { position: absolute; inset: 0; z-index: 0; perspective: 2000px; pointer-events: none; }
.am-wall__plane {
	--rx: 0deg; --ry: 0deg;
	position: absolute; top: 46%; left: 70%; display: flex; gap: 26px; width: max-content;
	transform: translate(-50%, -50%) rotateX(calc(50deg + var(--ry))) rotateZ(calc(-34deg + var(--rx)));
	transform-style: preserve-3d; transition: transform .9s var(--ease);
}
.am-wall__col { flex: none; width: clamp(240px, 22vw, 340px); height: 210vh; overflow: hidden; }
.am-wall__col:nth-child(2) { margin-top: -18vh; }
.am-wall__col:nth-child(3) { margin-top: -6vh; }
.am-wall__col:nth-child(4) { margin-top: -26vh; }
.am-wall__track { display: flex; flex-direction: column; gap: 26px; animation: am-wall var(--dur, 70s) linear infinite; will-change: transform; }
.am-wall__col:nth-child(even) .am-wall__track { animation-direction: reverse; }
.am-wall__col:nth-child(1) .am-wall__track { --dur: 82s; }
.am-wall__col:nth-child(2) .am-wall__track { --dur: 64s; }
.am-wall__col:nth-child(3) .am-wall__track { --dur: 90s; }
.am-wall__col:nth-child(4) .am-wall__track { --dur: 72s; }
@keyframes am-wall { to { transform: translateY(calc(-50% - 13px)); } }
.am-wall__win { margin: 0; border-radius: 8px; overflow: hidden; background: #121212; border: 1px solid #282828; box-shadow: 0 40px 70px -30px rgba(0, 0, 0, .9); }
.am-wall__bar { display: flex; align-items: center; gap: 8px; height: 24px; padding: 0 10px; background: #0f0f0f; border-bottom: 1px solid #222; }
.am-wall__bar i { flex: none; width: 14px; height: 8px; background: linear-gradient(115deg, transparent 22%, #8a8a8a 22% 40%, transparent 40% 56%, var(--red) 56% 74%, transparent 74%); }
.am-wall__bar b { flex: 1; min-width: 0; height: 14px; display: flex; align-items: center; padding: 0 8px; border-radius: 999px; background: #1b1b1b; font: 500 .5625rem/1 var(--mono); color: #9a9a9a; white-space: nowrap; overflow: hidden; }
.am-wall__win img { display: block; width: 100%; height: auto; }
@media (max-width: 899px) {
	.am-hero2 { justify-content: flex-end; }
	.am-hero2::before { background: linear-gradient(0deg, var(--ink) 0%, rgba(10, 10, 10, .96) 46%, rgba(10, 10, 10, .4) 74%, rgba(10, 10, 10, .2) 100%); }
	.am-wall__plane { top: 22%; left: 56%; gap: 16px; }
	.am-wall__col { width: 46vw; height: 140vh; }
	.am-wall__col:nth-child(4) { display: none; }
}

/* ---------- Manifesto ---------- */
.am-mani { padding: var(--sec) 0; }
.am-mani__p { font-size: clamp(1.85rem, 4.3vw, 4.25rem); font-weight: 620; letter-spacing: -.045em; line-height: 1.08; max-width: 24ch; text-wrap: pretty; }
.am-mani__p em { font-style: normal; }
.am-w { color: #D4D4D1; transition: color .25s; }
.am-w.is-on { color: var(--ink); }
.am-dark .am-w { color: #3a3a3a; }
.am-dark .am-w.is-on { color: var(--white); }
.am-mani__p em { background: linear-gradient(var(--red), var(--red)) 0 94% / 0 .09em no-repeat; transition: background-size .9s var(--ease); }
.am-mani__p em.is-on { background-size: 100% .09em; }

/* ---------- Reach: the dot map ---------- */
.am-reach { padding: var(--sec) 0; }
.am-reach__in { display: grid; gap: clamp(40px, 5vw, 80px); align-items: center; }
@media (min-width: 1024px) { .am-reach__in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.am-reach__p { color: #2B2B2B; max-width: 46ch; margin-top: 22px; }
.am-reach__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 34px 0 26px; border-top: 1px solid var(--ink); }
.am-reach__stats div { padding: 16px 10px 16px 0; border-bottom: 1px solid var(--line); }
.am-reach__stats dt { font: 500 .6875rem/1.2 var(--mono); color: var(--graphite); }
.am-reach__stats dd { margin-top: 8px; font-size: clamp(1.15rem, 1.7vw, 1.5rem); font-weight: 640; letter-spacing: -.035em; line-height: 1.1; }

.am-reach__towns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 22px; font-size: .8125rem; }
.am-reach__towns li { display: grid; gap: 2px; min-width: 0; }
.am-reach__towns b { font-weight: 620; letter-spacing: -.01em; }
.am-reach__towns span { font: 500 .6875rem/1.35 var(--mono); color: var(--graphite); }
.am-reach__map { position: relative; }
.za-map { display: block; width: 100%; height: auto; overflow: visible; }
.za-outline { fill: none; stroke: var(--line); stroke-width: 1; }
.za-base { stroke: #DCDCD8; stroke-width: 6.4; stroke-linecap: round; }
.za-lit { stroke: var(--ink); stroke-width: 6.4; stroke-linecap: round; }
.za-dot { fill: var(--red); }
.za-pulse { fill: none; stroke: var(--red); stroke-width: 1.2; transform-box: fill-box; transform-origin: center; animation: am-ring 2.6s var(--ease) infinite; animation-delay: calc(var(--i) * .2s); }
@keyframes am-ring { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(3.4); opacity: 0; } }
.za-label { fill: var(--ink); font: 600 21px/1 var(--mono); paint-order: stroke; stroke: var(--white); stroke-width: 5px; stroke-linejoin: round; }
.js .am-reach__map .za-pin { opacity: 0; transform: translateY(-10px); transition: opacity .5s var(--ease), transform .7s var(--ease); transition-delay: calc(var(--i) * .08s + .3s); }
.js .am-reach__map .za-lit { opacity: 0; transition: opacity 1.2s var(--ease) .2s; }
.js .am-reach__map .za-base { opacity: 0; transition: opacity 1s var(--ease); }
.am-reach__map.is-in .za-pin, .am-reach__map.is-in .za-lit, .am-reach__map.is-in .za-base { opacity: 1; transform: none; }

/* ---------- Two people ---------- */
.am-people { padding: var(--sec) 0; border-top: 1px solid var(--line); }
.am-people__in { display: grid; gap: clamp(40px, 5vw, 80px); align-items: center; }
@media (min-width: 1024px) { .am-people__in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.am-people__copy > p { color: #2B2B2B; max-width: 44ch; margin-top: 22px; }
.am-people__cards { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.am-person { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; min-height: clamp(260px, 30vw, 440px); padding: clamp(18px, 2.4vw, 32px); border: 1px solid var(--ink); }
.am-person__bar { position: absolute; z-index: -1; top: -10%; right: 16%; width: 30%; height: 72%; background: var(--paper-2); transform: skewX(-22.65deg); transition: transform 1s var(--ease); }
.am-person--b .am-person__bar { background: var(--red); top: -30%; height: 72%; right: 6%; }
.am-person:hover .am-person__bar { transform: skewX(-22.65deg) translateY(-6%); }
.am-person__code { font: 600 .875rem/1 var(--mono); }
.am-person__name { margin-top: auto; font-size: clamp(1.7rem, 3.6vw, 3.4rem); font-weight: 650; letter-spacing: -.055em; line-height: .95; }
.am-person__role { margin-top: 10px; font: 500 .75rem/1.4 var(--mono); color: var(--graphite); }
.am-person__role a { color: var(--ink); text-decoration-color: var(--red); }
@media (max-width: 479px) { .am-people__cards { grid-template-columns: 1fr; } .am-person { min-height: 200px; } }

/* ---------- Services: try it ---------- */
.am-tryit { padding: var(--sec) 0; background: var(--paper); }
.am-tryit__in { display: grid; gap: clamp(36px, 4vw, 64px); grid-template-columns: minmax(0, 1fr); align-items: center; }
.am-tryit__copy p { color: #2B2B2B; margin-top: 22px; max-width: 40ch; }
@media (min-width: 1024px) { .am-tryit__in { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); } }

/* ---------- Service hero: that corner of the street ---------- */
.am-crop { margin: 0; }
.am-crop__frame { aspect-ratio: 440 / 343; overflow: hidden; border-radius: 10px; border: 1px solid #E2DDD5; background: radial-gradient(95% 80% at 52% 34%, #F7F5F1 0%, #E9E5DE 52%, #D8D2C8 100%); box-shadow: var(--shadow); }
.am-crop__frame img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 1.6s var(--ease); }
.am-crop:hover .am-crop__frame img { transform: scale(1.09); }
.am-crop__cap { display: grid; gap: 6px; margin-top: 18px; }
.am-crop__n { font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-crop__t { font-size: clamp(1.15rem, 1.6vw, 1.4rem); font-weight: 560; letter-spacing: -.02em; line-height: 1.3; max-width: 30ch; }
.am-crop__cap a { display: inline-flex; align-items: center; gap: 6px; width: max-content; margin-top: 6px; font-weight: 600; font-size: .9375rem; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--red); }
.am-crop__cap a .am-ic { width: 16px; height: 16px; }

/* ---------- About ---------- */
.am-ahero { padding: calc(var(--head) + clamp(40px, 5vw, 72px)) 0 clamp(72px, 9vw, 130px); }
.am-crumbs--dark { color: var(--fog); }
.am-crumbs--dark [aria-current] { color: var(--white); }
.am-ahero__h { font-size: clamp(2.8rem, 7.2vw, 7.4rem); line-height: .9; letter-spacing: -.058em; font-weight: 670; max-width: 15ch; color: var(--white); }
.am-ahero__grid { display: grid; gap: 40px; margin-top: clamp(32px, 4vw, 56px); align-items: end; }
.am-ahero .am-lede { color: #D2D2D2; max-width: 44ch; }
.am-ahero__facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--ink-3); }
.am-ahero__facts div { padding: 16px 10px 0 0; }
.am-ahero__facts dt { font: 500 .6875rem/1.2 var(--mono); color: var(--fog); }
.am-ahero__facts dd { margin-top: 8px; font-size: clamp(1.4rem, 2.4vw, 2.2rem); font-weight: 650; letter-spacing: -.05em; color: var(--white); }
@media (min-width: 1024px) { .am-ahero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); } }
@media (max-width: 479px) { .am-ahero__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.am-why { padding: var(--sec) 0; }
.am-why__in { display: grid; gap: 36px; }
@media (min-width: 1024px) { .am-why__in { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(40px, 5vw, 88px); } .am-why__side { position: sticky; top: calc(var(--head) + 40px); align-self: start; } }
.am-why__big { font-size: clamp(1.5rem, 2.8vw, 2.6rem); font-weight: 600; letter-spacing: -.04em; line-height: 1.15; }
.am-why__body > p:not(.am-why__big) { color: #2B2B2B; margin-top: 24px; max-width: 58ch; font-size: 1.0625rem; }

/* ---------- Magnetic buttons settle back smoothly ---------- */
[data-magnetic] { will-change: transform; }

@media (prefers-reduced-motion: reduce) {
	.am-wall__track, .za-pulse, .am-hero2__cue i::after, .am-hero2__live { animation: none !important; }
	.am-w { color: inherit !important; }
	.js .am-reach__map .za-pin, .js .am-reach__map .za-lit, .js .am-reach__map .za-base { opacity: 1; transform: none; }
}
.js .am-hero2__w, .js .am-hero2__sl { transform: translateY(108%); }
.js [data-h2-fade] { opacity: 0; }
.js:not(.am-ready) :is(.am-hero2__w, .am-hero2__sl, [data-h2-fade]) { animation: am-fallback .6s 3.5s forwards; }
@media (prefers-reduced-motion: reduce) { .js .am-hero2__w, .js .am-hero2__sl, .js [data-h2-fade] { transform: none !important; opacity: 1 !important; } }

/* Services hero: the street as an index */
.am-sidx { border-top: 1px solid var(--ink); }
.am-sidx li { border-bottom: 1px solid var(--line); }
.am-sidx a { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr) 1.4rem minmax(0, 1fr) 20px; align-items: center; gap: 8px; padding: 15px 0; text-decoration: none; color: var(--ink); transition: padding .5s var(--ease); }
.am-sidx__n { font: 500 .75rem/1 var(--mono); color: var(--graphite); }
.am-sidx__thing { font-size: 1.15rem; font-weight: 600; letter-spacing: -.02em; }
.am-sidx__eq { font: 500 .875rem/1 var(--mono); color: var(--red); text-align: center; }
.am-sidx__svc { font: 500 .8125rem/1.2 var(--mono); color: var(--graphite); }
.am-sidx .am-ic { width: 18px; height: 18px; transform: rotate(-45deg); transition: transform .45s var(--ease); }
@media (hover: hover) { .am-sidx a:hover { padding-left: 10px; } .am-sidx a:hover .am-ic { transform: none; color: var(--red); } }

/* ==========================================================================
   v3 — the street drawing: a day and a night look, set on .am-figbox by
   data-mode. The street follows the clock in Johannesburg. Shared with the
   standalone service-page crops (_build/figure/street.mjs embeds this file).
   Palette stays inside the brand: ink, white, signal red, its tints, and
   warm neutrals for materials; lamplight is a warm white.
   ========================================================================== */

/* ---------- Night: lamps on, windows lit, red where the walk has reached ---------- */
.am-figbox[data-mode="night"] {
	--anatomy-paper: #141312; --anatomy-face: #1f1d1b; --anatomy-top: #2c2a27;
	--anatomy-shade-0: #121110; --anatomy-shade-1: #171615; --anatomy-shade-2: #1d1b19; --anatomy-shade-3: #242220;
	--anatomy-lit-top: #3b3834; --anatomy-lit-shade: #2c2926;
	--anatomy-hi: #efe8dc; --anatomy-mid: #a29b90; --anatomy-lo: #625d56; --anatomy-faint: #3a3632; --anatomy-lit: #fff;
	--anatomy-halo: #000; --anatomy-halo-opacity: .9; --anatomy-dot: #efe8dc; --anatomy-weight: .7px;
	--st-red-rest: #6e1511; --st-road: #0f0e0d; --st-line: #8f887d; --st-pave: #26231f; --st-plate: #181716;
	--st-roof: #2e2b28; --st-parapet: #393530; --st-floor: #2b2621; --st-win: #0b0a09; --st-win-on: #f7e8cf;
	--st-glass: rgba(255, 238, 214, .14); --st-sign: #f4ede2; --st-white: #ddd6cb; --st-car: #2f2c29; --st-cab: #0f0e0d;
	--st-crown: #25231f; --st-tank: #34312d; --st-zebra: #cfc8bc;
}
/* ---------- Day: a white architectural model under studio light ---------- */
.am-figbox[data-mode="day"] {
	--anatomy-paper: #fbfaf7; --anatomy-face: #fff; --anatomy-top: #fff;
	--anatomy-shade-0: #c4bdb1; --anatomy-shade-1: #d2ccc2; --anatomy-shade-2: #dfdad2; --anatomy-shade-3: #ebe8e1;
	--anatomy-lit-top: #fff; --anatomy-lit-shade: #e9e5de;
	--anatomy-hi: #1f1d1b; --anatomy-mid: #5f5a53; --anatomy-lo: #8a847a; --anatomy-faint: #c9c3b9; --anatomy-lit: #0a0a0a;
	--anatomy-halo: #6f685c; --anatomy-halo-opacity: .3; --anatomy-dot: #2a2725; --anatomy-weight: .7px;
	--st-red-rest: #eeb3ae; --st-road: #3d3a37; --st-line: #f6f3ec; --st-pave: #dcd6cd; --st-plate: #ece8e1;
	--st-roof: #f7f5f1; --st-parapet: #cfc8bd; --st-floor: #e4dacb; --st-win: #8f8a82; --st-win-on: #b3ada4;
	--st-glass: rgba(255, 255, 255, .5); --st-sign: #fff; --st-white: #fff; --st-car: #cdc7bd; --st-cab: #4a4642;
	--st-crown: #e6e1d8; --st-tank: #3a3734; --st-zebra: #fbfaf7;
}
.am-figbox .iso-svg path, .am-figbox .iso-svg circle { vector-effect: non-scaling-stroke; }
.am-figbox .iso-svg { overflow: visible; }

/* Materials */
.am-figbox .it[data-name^="ground.road"] :is(.iso-top, .iso-fill), .am-figbox .it[data-name^="ground.side"] :is(.iso-top, .iso-fill), .am-figbox .it[data-name^="ground.hwy"] :is(.iso-top, .iso-fill) { fill: var(--st-road); }
.am-figbox .it:is([data-name^="ground.road"], [data-name^="ground.side"], [data-name^="ground.hwy"]) .iso-line { stroke: var(--st-line); }
.am-figbox .it:is([data-name^="ground.pave"], [data-name="rank.pad"]) :is(.iso-top, .iso-fill) { fill: var(--st-pave); }
.am-figbox .it[data-name="stand.plate"] :is(.iso-top, .iso-fill) { fill: var(--st-plate); }
.am-figbox .it[data-name="shop.floor"] :is(.iso-top, .iso-fill) { fill: var(--st-floor); }
.am-figbox .it[data-name$=".body"][data-zone="street"]:not([data-drive]) :is(.iso-top) { fill: var(--st-roof); }
.am-figbox .it[data-name$="parapet"] :is(.iso-top, .iso-fill) { fill: var(--st-parapet); }
.am-figbox .it[data-name^="road.zebra"] :is(.iso-top, .iso-fill, .iso-shade) { fill: var(--st-zebra); }
.am-figbox .it[data-win] :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-win); transition: fill .8s; }
.am-figbox .it[data-win][data-on] :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-win-on); }
.am-figbox .it[data-glass] :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-glass); }
.am-figbox .it[data-sign] :is(.iso-shade, .iso-top), .am-figbox .it[data-name="bb.face"] :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-sign); }
.am-figbox .it:is([data-name$=".body"][data-name^="taxi"], [data-name^="bakkie.cab"]) :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-white); }
.am-figbox .it[data-drive][data-name$=".body"] :is(.iso-shade, .iso-top, .iso-fill), .am-figbox .it[data-name^="car2.body"] :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-car); }
.am-figbox .it[data-cab] :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-cab); }
.am-figbox .it[data-name$=".crown"] :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-crown); }
.am-figbox .it[data-name="nbA.jojo"] :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-tank); }
.am-figbox[data-mode="day"] .it[data-name$="crown"] .iso-shade[data-shade="0"] { fill: #d3cdc2; }

/* Red: every stop shows a hint at rest, the one being visited goes full signal red. */
.am-figbox .it[data-red] :is(.iso-shade, .iso-top, .iso-fill) { fill: var(--st-red-rest); transition: fill .6s; }
.am-figbox .it[data-red] .iso-edge { stroke: transparent; }
.am-figbox:not([data-on]) .it[data-red] :is(.iso-shade, .iso-top, .iso-fill),
.am-figbox[data-on="website"] .it[data-zone="website"][data-red] :is(.iso-shade, .iso-top, .iso-fill),
.am-figbox[data-on="ecommerce"] .it[data-zone="ecommerce"][data-red] :is(.iso-shade, .iso-top, .iso-fill),
.am-figbox[data-on="seo"] .it[data-zone="seo"][data-red] :is(.iso-shade, .iso-top, .iso-fill),
.am-figbox[data-on="ads"] .it[data-zone="ads"][data-red] :is(.iso-shade, .iso-top, .iso-fill),
.am-figbox[data-on="meta"] .it[data-zone="meta"][data-red] :is(.iso-shade, .iso-top, .iso-fill),
.am-figbox[data-on="social"] .it[data-zone="social"][data-red] :is(.iso-shade, .iso-top, .iso-fill),
.am-figbox[data-on="aeo"] .it[data-zone="aeo"][data-red] :is(.iso-shade, .iso-top, .iso-fill) { fill: #e10600; }
.am-figbox[data-mode="night"] .it[data-name="open.sign"] :is(.iso-shade, .iso-top, .iso-fill) { fill: #e10600; }

/* Focus: the stop being visited stays, the rest of the street steps back. */
.am-figbox .it { transition: opacity .6s cubic-bezier(.16, 1, .3, 1); }
.am-figbox[data-on] .it[data-zone] { opacity: .38; }
.am-figbox[data-on] .it:not([data-zone]) { opacity: .56; }
.am-figbox[data-mode="day"][data-on] .it[data-zone] { opacity: .58; }
.am-figbox[data-mode="day"][data-on] .it:not([data-zone]) { opacity: .72; }
.am-figbox[data-mode][data-on="website"] .it[data-zone="website"],
.am-figbox[data-mode][data-on="ecommerce"] .it[data-zone="ecommerce"],
.am-figbox[data-mode][data-on="seo"] .it[data-zone="seo"],
.am-figbox[data-mode][data-on="ads"] .it[data-zone="ads"],
.am-figbox[data-mode][data-on="meta"] .it[data-zone="meta"],
.am-figbox[data-mode][data-on="social"] .it[data-zone="social"],
.am-figbox[data-mode][data-on="aeo"] .it[data-zone="aeo"] { opacity: 1; }

/* Light */
.am-figbox .am-lights ellipse { fill: url(#am-g-warm); transition: opacity 1.2s; pointer-events: none; }
.am-figbox .am-glow--bulb { opacity: .9; }
.am-figbox[data-mode="day"] .am-lights { opacity: 0; }
.am-figbox[data-mode="night"] .am-lights { opacity: .85; }
.am-figbox[data-mode="night"][data-on] .am-lights { opacity: .5; }
.am-figbox .am-pool { fill: url(#am-g-red); opacity: 0; transition: opacity .9s; }
.am-figbox[data-mode="day"] .am-pool { opacity: 0; }
.am-figbox[data-on="website"] .am-pool[data-zone="website"], .am-figbox[data-on="ecommerce"] .am-pool[data-zone="ecommerce"],
.am-figbox[data-on="seo"] .am-pool[data-zone="seo"], .am-figbox[data-on="ads"] .am-pool[data-zone="ads"],
.am-figbox[data-on="meta"] .am-pool[data-zone="meta"], .am-figbox[data-on="social"] .am-pool[data-zone="social"],
.am-figbox[data-on="aeo"] .am-pool[data-zone="aeo"] { opacity: 1; }
.am-figbox .am-beam { fill: url(#am-g-beam-r); stroke: none; opacity: 0; transition: opacity 1s; }
.am-figbox .am-beam--l { fill: url(#am-g-beam-l); }
.am-figbox[data-mode="night"] .am-beam { opacity: 1; }

/* Life: a sign that flickers, a till that rings, a few windows that come and go. */
@keyframes am-st-flicker { 0%, 100% { opacity: 1; } 3% { opacity: .35; } 6% { opacity: 1; } 8% { opacity: .5; } 10% { opacity: 1; } }
@keyframes am-st-ring { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
@keyframes am-st-win { 0%, 46% { fill: var(--st-win-on); } 50%, 96% { fill: var(--st-win); } 100% { fill: var(--st-win-on); } }
.am-figbox.is-live[data-mode="night"] .it[data-name="open.sign"] > * { animation: am-st-flicker 5.5s steps(1) infinite; }
.am-figbox.is-live .it[data-name="till.screen"] > * { animation: am-st-ring 1.6s ease-in-out infinite; }
.am-figbox.is-live[data-mode="night"] .it[data-win][data-on]:nth-child(5n+2) :is(.iso-shade, .iso-top, .iso-fill) { animation: am-st-win 13s steps(1) infinite; }
.am-figbox.is-live[data-mode="night"] .it[data-win][data-on]:nth-child(7n+3) :is(.iso-shade, .iso-top, .iso-fill) { animation: am-st-win 19s steps(1) -6s infinite; }
/* The camera is moving: hold everything still so only the picture slides. */
.am-figbox.is-moving .it, .am-figbox.is-moving .it > *, .am-figbox.is-moving .it * { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { .am-figbox .it, .am-figbox .it > *, .am-figbox .it * { animation: none !important; } }

/* street traffic (generated by _build/figure/street.mjs) */
@keyframes am-drive-car0{from{transform:translate(-587.1px,-360.4px)}to{transform:translate(182.5px,112.0px)}}
.am-street__fig.is-live .it[data-drive="car0"]{animation:am-drive-car0 15s linear -11.44s infinite}
.am-street__fig.is-live .it[data-drive="car0"]>*{animation:am-drive-fade 15s linear -11.44s infinite}
@keyframes am-drive-car1{from{transform:translate(-126.9px,-77.9px)}to{transform:translate(642.7px,394.5px)}}
.am-street__fig.is-live .it[data-drive="car1"]{animation:am-drive-car1 15s linear -2.47s infinite}
.am-street__fig.is-live .it[data-drive="car1"]>*{animation:am-drive-fade 15s linear -2.47s infinite}
@keyframes am-drive-hwy-car{from{transform:translate(35.7px,21.9px)}to{transform:translate(-226.1px,-138.8px)}}
.am-street__fig.is-live .it[data-drive="hwy-car"]{animation:am-drive-hwy-car 5.2s linear -0.71s infinite}
.am-street__fig.is-live .it[data-drive="hwy-car"]>*{animation:am-drive-fade 5.2s linear -0.71s infinite}
@keyframes am-drive-hwy-car2{from{transform:translate(115.0px,70.6px)}to{transform:translate(-146.8px,-90.1px)}}
.am-street__fig.is-live .it[data-drive="hwy-car2"]{animation:am-drive-hwy-car2 5.2s linear -2.28s infinite}
.am-street__fig.is-live .it[data-drive="hwy-car2"]>*{animation:am-drive-fade 5.2s linear -2.28s infinite}
@keyframes am-drive-hwy-car1{from{transform:translate(-51.6px,-31.7px)}to{transform:translate(210.3px,129.1px)}}
.am-street__fig.is-live .it[data-drive="hwy-car1"]{animation:am-drive-hwy-car1 4.6s linear -0.91s infinite}
.am-street__fig.is-live .it[data-drive="hwy-car1"]>*{animation:am-drive-fade 4.6s linear -0.91s infinite}
@keyframes am-drive-fade{0%{opacity:0}7%{opacity:1}93%{opacity:1}100%{opacity:0}}

/* ==========================================================================
   v3: the street as a full stage, online twins, built-for, services menu,
   service index, footer, work grid, scroll address.
   ========================================================================== */

/* ---------- The high street ---------- */
.am-street { padding: var(--sec) 0 0; }
.am-street__head { display: grid; gap: 24px; margin-bottom: clamp(36px, 4vw, 56px); }
.am-street__head .am-h2 { max-width: 14ch; }
.am-street__intro { display: grid; gap: 18px; max-width: 46ch; }
.am-street__intro > p:first-child { color: #CFCFCF; }
.am-street__now { font: 500 .8125rem/1.55 var(--mono); color: var(--fog); padding-left: 16px; border-left: 2px solid var(--red); }
.am-street__now b { color: var(--white); font-weight: 600; font-variant-numeric: tabular-nums; }
.am-street[data-mode="day"] .am-street__now-n, .am-street[data-mode="night"] .am-street__now-d { display: none; }
@media (min-width: 900px) { .am-street__head { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; } .am-street__intro { justify-self: end; } }

.am-street__stage { position: relative; display: grid; gap: 18px; grid-template-columns: minmax(0, 1fr); padding: 0 var(--gut) clamp(64px, 8vw, 110px); max-width: calc(var(--max) + var(--gut) * 2); margin-inline: auto; }
.am-street__map {
	position: relative; aspect-ratio: 1200 / 760; overflow: hidden; border-radius: 14px; outline: none; isolation: isolate;
	transition: background .9s var(--ease), box-shadow .9s var(--ease);
}
.am-street[data-mode="night"] .am-street__map { background: radial-gradient(90% 70% at 55% 38%, #1d1b19 0%, #100f0e 55%, #090909 100%); box-shadow: inset 0 0 0 1px #242220; }
.am-street[data-mode="day"] .am-street__map { background: radial-gradient(95% 80% at 52% 34%, #F7F5F1 0%, #E9E5DE 52%, #D8D2C8 100%); box-shadow: inset 0 0 0 1px #E2DDD5; }
.am-street__map::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; border-radius: inherit; transition: opacity .9s; }
.am-street[data-mode="night"] .am-street__map::after { background: radial-gradient(70% 45% at 50% 0%, rgba(225, 6, 0, .09), transparent 70%), radial-gradient(130% 100% at 50% 50%, transparent 60%, rgba(0, 0, 0, .55)); }
.am-street[data-mode="day"] .am-street__map::after { background: radial-gradient(130% 100% at 50% 50%, transparent 62%, rgba(120, 110, 96, .18)); }
.am-street__map:focus-visible { box-shadow: 0 0 0 2px var(--white); }
.am-street__canvas { position: absolute; left: 0; top: 0; width: 300%; aspect-ratio: 1200 / 760; transform-origin: 0 0; will-change: transform; }
.am-street__fig { width: 100%; height: 100%; }
.am-street__fig > svg { display: block; width: 100%; height: 100%; overflow: visible; }
.am-street__fig:empty::before { content: ""; position: absolute; inset: 20% 16%; border-radius: 12px; background: linear-gradient(100deg, rgba(128, 128, 128, .08) 30%, rgba(128, 128, 128, .16) 50%, rgba(128, 128, 128, .08) 70%) 0 0 / 300% 100%; animation: am-wait 1.6s linear infinite; }
@keyframes am-wait { to { background-position: -300% 0; } }

/* Light over the drawing (night lamps, the red pool under the stop being visited). */
.am-street__glow { position: absolute; inset: 0; pointer-events: none; }
.am-street__glow i { position: absolute; border-radius: 50%; opacity: 0; transition: opacity 1s var(--ease); }
.am-street__glow .l { background: radial-gradient(closest-side, rgba(255, 244, 226, .55), rgba(255, 233, 201, .2) 45%, rgba(255, 233, 201, 0)); }
.am-street__glow .p { background: radial-gradient(closest-side, rgba(225, 6, 0, .42), rgba(225, 6, 0, .14) 55%, rgba(225, 6, 0, 0)); }
.am-street[data-mode="night"] .am-street__glow .l { opacity: .9; }
.am-street[data-mode="night"] .am-street__glow[data-on] .l { opacity: .5; }
.am-street[data-mode="night"] .am-street__glow .bulb { opacity: 1; }
.am-street__glow[data-on="website"] .p[data-zone="website"], .am-street__glow[data-on="ecommerce"] .p[data-zone="ecommerce"], .am-street__glow[data-on="seo"] .p[data-zone="seo"],
.am-street__glow[data-on="ads"] .p[data-zone="ads"], .am-street__glow[data-on="meta"] .p[data-zone="meta"], .am-street__glow[data-on="social"] .p[data-zone="social"], .am-street__glow[data-on="aeo"] .p[data-zone="aeo"] { opacity: 1; }
.am-street[data-mode="day"] .am-street__glow .p { background: radial-gradient(closest-side, rgba(225, 6, 0, .22), rgba(225, 6, 0, .08) 55%, rgba(225, 6, 0, 0)); }

/* Pins */
.am-spin {
	position: absolute; left: 0; top: 0; z-index: 3; display: inline-flex; align-items: center; gap: 8px;
	height: 34px; padding: 0 13px 0 4px; border: 0; border-radius: 999px; background: var(--ink); box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .12);
	color: var(--white); font: 600 .75rem/1 var(--sans); letter-spacing: -.005em; cursor: pointer; white-space: nowrap; transition: background .3s, color .3s, opacity .4s, box-shadow .3s;
}
.am-spin__n { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #2a2a2a; font: 600 .6875rem/1 var(--mono); transition: background .3s; }
.am-spin::after { content: ""; position: absolute; left: 17px; top: 100%; width: 1px; height: 12px; background: currentColor; opacity: .5; }
.am-spin:hover { box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .7), 0 0 0 1px var(--white); }
.am-spin.is-on { background: var(--white); color: var(--ink); }
.am-spin.is-on .am-spin__n { background: var(--red); color: var(--white); }
.am-spin.is-on .am-spin__n::after { content: ""; position: absolute; left: 4px; top: 4px; width: 26px; height: 26px; border-radius: 50%; box-shadow: 0 0 0 0 rgba(225, 6, 0, .55); animation: am-pulse 2s infinite; }
.am-street.is-focus .am-spin:not(.is-on) { opacity: .5; }
@media (max-width: 699px) { .am-spin__label { display: none; } .am-spin { padding: 0 4px; } .am-spin::after { display: none; } }

/* Clock and the day / night switch */
.am-street__clock { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; }
.am-street__time { display: inline-flex; align-items: center; gap: 10px; font: 500 .75rem/1 var(--mono); color: var(--fog); }
.am-street__time b { color: var(--white); font-weight: 600; font-variant-numeric: tabular-nums; }
.am-street__time i { width: 8px; height: 8px; border-radius: 50%; background: var(--red); animation: am-pulse 2s infinite; }
.am-street__modes { display: inline-flex; padding: 3px; border-radius: 999px; background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); }
.am-street__modes button { min-height: 32px; padding: 0 14px; border: 0; border-radius: 999px; background: none; color: var(--fog); font: 600 .75rem/1 var(--mono); cursor: pointer; transition: background .35s var(--ease), color .35s; }
.am-street__modes button[aria-pressed="true"] { background: var(--white); color: var(--ink); }
.am-street__modes button:hover:not([aria-pressed="true"]) { color: var(--white); }

/* Cards (phones: a swipe deck under the map) */
.am-street__cards { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; margin-inline: calc(var(--gut) * -1); padding: 0 var(--gut) 6px; scrollbar-width: none; }
.am-street__cards::-webkit-scrollbar { display: none; }
.am-stop { flex: 0 0 min(86%, 420px); scroll-snap-align: start; display: flex; flex-direction: column; padding: 24px; border: 1px solid var(--ink-3); border-radius: 14px; background: var(--ink-2); }
.am-stop__n { font: 500 .75rem/1 var(--mono); color: var(--fog); }
.am-stop__n span { color: var(--red); font-weight: 700; }
.am-stop__t { margin-top: 14px; font-size: clamp(1.45rem, 2.4vw, 2.3rem); font-weight: 650; letter-spacing: -.045em; line-height: 1.02; color: var(--white); text-wrap: balance; }
.am-stop__p { margin-top: 14px; color: #CFCFCF; }
.am-stop__go { display: inline-flex; align-items: center; gap: 8px; width: max-content; margin-top: 20px; color: var(--white); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--red); padding-bottom: 3px; }
.am-stop__go .am-ic { width: 18px; height: 18px; color: var(--red); transition: transform .4s var(--ease); }
.am-stop__go:hover .am-ic { transform: translateX(4px); }
.am-stop__hint { display: none; }
.am-stop .am-twin { margin-top: 22px; }
.am-street__rail { display: none; }

/* Desktop with motion: the stage pins full screen and the scroll walks the street. */
@media (min-width: 1024px) {
	.am-street.is-pinned .am-street__stage { display: block; max-width: none; height: calc(100svh - var(--head)); padding: 0; margin: 0; }
	.am-street.is-pinned .am-street__map { position: absolute; inset: 0 var(--gut) 18px; aspect-ratio: auto; border-radius: 18px; }
	.am-street.is-pinned .am-street__clock { position: absolute; z-index: 4; top: 18px; left: calc(var(--gut) + 18px); right: calc(var(--gut) + 18px); pointer-events: none; }
	.am-street.is-pinned .am-street__clock > * { pointer-events: auto; }
	.am-street.is-pinned .am-street__time { padding: 9px 14px; border-radius: 999px; background: rgba(10, 10, 10, .78); }
	.am-street.is-pinned .am-street__modes { background: rgba(10, 10, 10, .78); }
	.am-street.is-pinned .am-street__cards { position: absolute; z-index: 4; left: calc(var(--gut) + 18px); bottom: 88px; width: min(400px, 31vw); display: grid; overflow: visible; margin: 0; padding: 0; }
	.am-street.is-pinned .am-stop {
		grid-area: 1 / 1; padding: clamp(22px, 2vw, 30px); border: 1px solid rgba(255, 255, 255, .08); background: rgba(12, 12, 12, .9); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .8);
		opacity: 0; transform: translateY(26px); transition: opacity .45s var(--ease), transform .8s var(--ease), visibility 0s .45s; visibility: hidden; pointer-events: none;
	}
	.am-street.is-pinned .am-stop.is-on { opacity: 1; transform: none; pointer-events: auto; visibility: visible; transition: opacity .55s var(--ease) .12s, transform .9s var(--ease) .12s, visibility 0s; }
	.am-street.is-pinned .am-stop__t { font-size: clamp(1.7rem, 2.4vw, 2.5rem); }
	.am-street.is-pinned .am-stop__hint { display: flex; align-items: center; gap: 10px; margin-top: 22px; font: 500 .75rem/1 var(--mono); color: var(--fog); }
	.am-street.is-pinned .am-stop__hint span { position: relative; width: 1px; height: 30px; background: var(--ink-4); overflow: hidden; }
	.am-street.is-pinned .am-stop__hint span::after { content: ""; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--red); animation: am-cue 1.8s var(--ease) infinite; }
	/* The twin of the stop being visited floats on the right of the stage. */
	.am-street.is-pinned .am-stop .am-twin { display: none; }
	.am-street.is-pinned .am-street__twins { position: absolute; z-index: 4; top: 50%; right: calc(var(--gut) + 28px); width: clamp(270px, 22vw, 330px); display: grid; transform: translateY(-50%); }
	.am-street__twin { grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateY(16px) scale(.98); transition: opacity .4s var(--ease), transform .7s var(--ease), visibility 0s .4s; }
	.am-street__twin.is-on { opacity: 1; visibility: visible; transform: none; transition: opacity .6s var(--ease) .3s, transform .9s var(--ease) .3s, visibility 0s; }
	.am-street.is-pinned .am-street__rail { position: absolute; z-index: 4; left: calc(var(--gut) + 18px); right: calc(var(--gut) + 18px); bottom: 36px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; }
	.am-street__rail button { position: relative; height: 36px; padding: 13px 0 0; border: 0; background: none; color: rgba(255, 255, 255, .62); font: 500 .6875rem/1.1 var(--mono); text-align: left; cursor: pointer; transition: color .3s; }
	.am-street[data-mode="day"] .am-street__rail button { color: rgba(10, 10, 10, .55); }
	.am-street__rail button b { font-weight: 700; margin-right: 4px; }
	.am-street__rail button::before, .am-street__rail button::after { content: ""; position: absolute; left: 0; top: 0; height: 2px; border-radius: 2px; }
	.am-street__rail button::before { right: 0; background: rgba(255, 255, 255, .18); }
	.am-street[data-mode="day"] .am-street__rail button::before { background: rgba(10, 10, 10, .14); }
	.am-street__rail button::after { width: var(--p, 0%); background: var(--red); }
	.am-street__rail button.is-on, .am-street__rail button:hover { color: var(--white); }
	.am-street[data-mode="day"] .am-street__rail button.is-on, .am-street[data-mode="day"] .am-street__rail button:hover { color: var(--ink); }
	.am-street__rail span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
.am-street__twins { display: none; }

/* ---------- Online twins ---------- */
.am-twin { transition: opacity .4s var(--ease), transform .6s var(--ease); }
.am-twin__label { display: inline-flex; gap: 6px; font: 500 .6875rem/1.3 var(--mono); color: var(--fog); margin-bottom: 10px; }
.am-street__twins .am-twin__label { padding: 8px 12px; border-radius: 999px; background: rgba(10, 10, 10, .82); }
.am-twin__label span { color: var(--red); font-weight: 700; }
.am-twin__label b { color: var(--white); font-weight: 600; }
.am-twin__card { position: relative; overflow: hidden; border-radius: 12px; background: var(--white); color: var(--ink); box-shadow: 0 30px 60px -28px rgba(0, 0, 0, .85), 0 0 0 1px rgba(255, 255, 255, .1); font-size: .8125rem; line-height: 1.35; }
.am-twin__bar { display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px; background: var(--paper); border-bottom: 1px solid var(--line); font: 500 .6875rem/1 var(--mono); color: var(--graphite); }
.am-twin__bar .am-ic { width: 11px; height: 11px; }
.am-twin__site { padding: 16px 16px 14px; }
.am-twin__eyebrow { font: 600 .625rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--red); }
.am-twin__h { margin-top: 8px; font-size: 1.25rem; font-weight: 650; letter-spacing: -.04em; line-height: 1.02; }
.am-twin__btns { display: flex; gap: 6px; margin-top: 12px; }
.am-twin__btns b, .am-twin__btns span { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 10px; border-radius: 6px; font-size: .6875rem; font-weight: 600; }
.am-twin__btns b { background: var(--ink); color: var(--white); }
.am-twin__btns span { box-shadow: inset 0 0 0 1px var(--line); }
.am-twin__btns .am-ic { width: 12px; height: 12px; }
.am-twin__tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 12px; }
.am-twin__tiles i { aspect-ratio: 4 / 3; border-radius: 6px; background: linear-gradient(135deg, var(--paper-2), var(--paper)); }
.am-twin__tiles i:nth-child(2) { background: linear-gradient(135deg, #f6d4d2, #fbeceb); }
.am-twin__head { padding: 14px 14px 4px; font: 600 .6875rem/1 var(--mono); color: var(--graphite); }
.am-twin__orders { padding: 6px 10px 12px; display: grid; gap: 6px; }
.am-twin__orders li { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 9px 10px; border-radius: 9px; background: var(--paper); }
.am-twin__orders i { grid-row: span 2; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--ink); color: var(--white); }
.am-twin__orders li:first-child i { background: var(--red); }
.am-twin__orders .am-ic { width: 14px; height: 14px; }
.am-twin__orders b { font-size: .75rem; font-weight: 650; }
.am-twin__orders span { grid-column: 2; font: 500 .6875rem/1.2 var(--mono); color: var(--graphite); }
.am-twin__orders time { grid-column: 3; grid-row: 1 / span 2; font: 600 .6875rem/1 var(--mono); color: var(--graphite); }
.am-twin__q { display: flex; align-items: center; gap: 8px; margin: 12px; height: 36px; padding: 0 14px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line), 0 4px 12px -6px rgba(0, 0, 0, .2); font-size: .8125rem; }
.am-twin__q .am-ic { width: 14px; height: 14px; color: var(--graphite); }
.am-twin__serp { display: grid; gap: 2px; padding: 0 12px 12px; }
.am-twin__serp li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: center; padding: 10px; border-radius: 9px; }
.am-twin__serp li > span { font: 600 .75rem/1 var(--mono); color: var(--graphite); }
.am-twin__serp li.is-you { background: var(--paper); box-shadow: inset 3px 0 0 var(--red); }
.am-twin__serp li.is-you > span { color: var(--red); }
.am-twin__serp b { display: block; font-size: .875rem; font-weight: 650; letter-spacing: -.01em; }
.am-twin__serp small { display: block; margin-top: 3px; font: 500 .6875rem/1.2 var(--mono); color: var(--graphite); }
.am-twin__serp i { display: block; height: 8px; border-radius: 4px; background: var(--paper-2); width: 72%; }
.am-twin__serp i + i { margin-top: 6px; width: 46%; }
.am-twin__ad { margin: 0 12px; padding: 12px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--line); }
.am-twin__spon { font: 600 .6875rem/1.3 var(--mono); color: var(--graphite); }
.am-twin__title { margin-top: 6px; font-size: .9375rem; font-weight: 650; letter-spacing: -.02em; line-height: 1.2; color: var(--ink); }
.am-twin__links { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.am-twin__links span { padding: 4px 8px; border-radius: 999px; background: var(--paper); font-size: .6875rem; font-weight: 600; }
.am-twin__note { padding: 12px 14px 14px; font: 500 .6875rem/1.4 var(--mono); color: var(--graphite); }
.am-twin__who { display: flex; align-items: center; gap: 8px; padding: 12px; font-size: .75rem; }
.am-twin__who i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--ink); color: var(--white); font: 700 .625rem/1 var(--mono); font-style: normal; }
.am-twin__who b { font-weight: 650; }
.am-twin__who span { margin-left: auto; font: 500 .6875rem/1 var(--mono); color: var(--graphite); }
.am-twin__img { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--ink); color: var(--white); }
.am-twin__img span { position: absolute; left: 14px; bottom: 12px; z-index: 1; font-size: 1.5rem; font-weight: 680; letter-spacing: -.05em; }
.am-twin__sl { position: absolute; right: -6%; top: -8%; width: 62%; height: auto; }
.am-twin__sl .am-slashes__a { fill: #3a3a3a; }
.am-twin__sl .am-slashes__b { fill: var(--red); }
.am-twin__aud { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px; }
.am-twin__aud span { padding: 5px 9px; border-radius: 999px; background: var(--paper); font: 600 .6875rem/1 var(--mono); }
.am-twin__aud span:first-child { background: #fde8e7; color: #a10400; }
.am-twin__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; padding: 0 12px; }
.am-twin__grid i { position: relative; aspect-ratio: 1; background: var(--paper-2); }
.am-twin__grid i:nth-child(1) { background: var(--ink); }
.am-twin__grid i:nth-child(5) { background: #f6d4d2; }
.am-twin__grid i.is-new { background: var(--red); }
.am-twin__grid i.is-new span { position: absolute; left: 6px; top: 6px; padding: 3px 6px; border-radius: 999px; background: var(--white); color: var(--ink); font: 700 .5625rem/1 var(--mono); }
.am-twin__week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; padding: 12px; font: 600 .625rem/1 var(--mono); color: var(--graphite); text-align: center; }
.am-twin__week span { position: relative; padding-bottom: 10px; }
.am-twin__week span.is-post::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; background: var(--red); }
/* Each twin plays a little when its stop comes up. */
:is(.am-stop.is-on, .am-street__twin.is-on) :is(.am-twin__orders li, .am-twin__serp li, .am-twin__aud span, .am-twin__grid i, .am-twin__tiles i) { animation: am-twin-in .7s var(--ease) both; }
:is(.am-stop.is-on, .am-street__twin.is-on) .am-twin :is(li, span, i):nth-child(2) { animation-delay: .5s; }
:is(.am-stop.is-on, .am-street__twin.is-on) .am-twin :is(li, span, i):nth-child(3) { animation-delay: .62s; }
:is(.am-stop.is-on, .am-street__twin.is-on) .am-twin :is(li, span, i):nth-child(4) { animation-delay: .74s; }
:is(.am-stop.is-on, .am-street__twin.is-on) .am-twin :is(li, span, i):nth-child(5) { animation-delay: .86s; }
:is(.am-stop.is-on, .am-street__twin.is-on) .am-twin :is(li, span, i):nth-child(6) { animation-delay: .98s; }
:is(.am-stop.is-on, .am-street__twin.is-on) .am-twin :is(li, span, i):first-child { animation-delay: .38s; }
@keyframes am-twin-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
:is(.am-stop.is-on, .am-street__twin.is-on) .am-twin__serp li.is-you { animation: am-twin-climb 1.1s var(--ease) .4s both; }
@keyframes am-twin-climb { from { opacity: 0; transform: translateY(96px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .am-twin * { animation: none !important; } }

/* AI search twin: a question and the one answer that names you. */
.am-twin__ai { display: grid; gap: 10px; padding: 14px 12px; }
.am-twin__ask { justify-self: end; max-width: 88%; padding: 8px 11px; border-radius: 12px 12px 4px 12px; background: var(--ink); color: var(--white); font-size: .75rem; line-height: 1.35; }
.am-twin__ans { max-width: 94%; padding: 9px 11px; border-radius: 12px 12px 12px 4px; background: var(--paper); box-shadow: inset 3px 0 0 var(--red); font-size: .75rem; line-height: 1.45; }
.am-twin__ans b { color: var(--red); font-weight: 650; }
.am-twin__cite { display: flex; flex-wrap: wrap; gap: 5px; }
.am-twin__cite span { padding: 3px 8px; border-radius: 999px; background: var(--paper); font: 500 .625rem/1.2 var(--mono); color: var(--graphite); }
.am-twin__cite span:first-child { background: var(--ink); color: var(--white); }

/* "New" next to the newest service. */
.am-new { display: inline-block; margin-left: 6px; padding: 3px 7px; border-radius: 999px; background: var(--red); color: var(--white); font: 600 .625rem/1 var(--mono); font-style: normal; letter-spacing: .04em; text-transform: uppercase; vertical-align: .35em; }

/* ---------- Built for: one sentence, every business ---------- */
.am-bf { padding: var(--sec) 0 clamp(64px, 8vw, 120px); overflow: clip; }
.am-bf__in { display: grid; gap: clamp(40px, 5vw, 72px); grid-template-columns: minmax(0, 1fr); align-items: center; }
@media (min-width: 1100px) { .am-bf__in { grid-template-columns: minmax(0, 6.4fr) minmax(0, 5.6fr); } }
.am-bf__h { margin-top: 22px; font-size: clamp(2.3rem, 5vw, 5.1rem); line-height: .98; letter-spacing: -.055em; font-weight: 660; }
.am-bf__fix { display: block; color: #B9B9B5; }
.am-bf__w { color: #B9B9B5; }
.am-bf__roll { position: relative; display: block; overflow: clip; padding-bottom: .08em; margin-bottom: -.08em; }
.am-bf__it { display: block; white-space: nowrap; }
.am-bf__it i { font-style: normal; color: var(--red); }
.am-bf__roll .am-bf__it + .am-bf__it { position: absolute; left: 0; top: 0; width: 100%; }
.am-bf__p { margin-top: clamp(22px, 2.6vw, 32px); max-width: 46ch; color: #2B2B2B; }
.am-bf__now { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 28px; margin-top: clamp(26px, 3vw, 40px); padding-top: 22px; border-top: 1px solid var(--line); }
.am-bf__client { display: grid; gap: 4px; min-width: 0; }
.am-bf__client a, .am-bf__client > b { display: inline-flex; align-items: center; gap: 8px; width: max-content; max-width: 100%; color: var(--ink); text-decoration: none; font-size: 1.125rem; font-weight: 650; letter-spacing: -.02em; }
.am-bf__client a .am-ic { width: 16px; height: 16px; color: var(--red); transition: transform .4s var(--ease); }
.am-bf__client a:hover .am-ic { transform: translate(3px, -3px); }
.am-bf__client > span { font: 500 .75rem/1.3 var(--mono); color: var(--graphite); }
.am-bf__ctrl { display: flex; align-items: center; gap: 8px; }
.am-bf__btn { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--white); color: var(--ink); cursor: pointer; transition: border-color .3s, background .3s, color .3s; }
.am-bf__btn .am-ic { width: 18px; height: 18px; }
.am-bf__btn:hover { border-color: var(--ink); background: var(--ink); color: var(--white); }
.am-bf__btn--play span { width: 10px; height: 12px; border-inline: 3px solid currentColor; }
.am-bf__btn--play[aria-pressed="true"] span { width: 0; height: 0; border: 0; border-left: 10px solid currentColor; border-block: 6px solid transparent; margin-left: 3px; }
.am-bf__bar { position: relative; width: 74px; height: 2px; margin-left: 8px; background: var(--line); overflow: hidden; }
.am-bf__bar i { position: absolute; inset: 0; background: var(--red); transform-origin: 0 50%; transform: scaleX(0); }
.am-bf__win { margin: 0; }
.am-bf__win .am-win { box-shadow: var(--shadow); }
.am-bf__view { position: relative; aspect-ratio: 1200 / 750; overflow: hidden; background: var(--paper); }
.am-bf__view img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; }
@media (max-width: 699px) {
				.am-bf__bar { display: none; }
}

/* ---------- Services panel under the header ---------- */
.am-nav__list > li { display: flex; align-items: center; }
.am-nav__more { display: none; }
.am-mega { display: none; }
@media (min-width: 1024px) {
	.am-nav__more {
		display: grid; place-items: center; width: 22px; height: 22px; margin-left: -10px; margin-right: 2px; padding: 0;
		border: 0; border-radius: 50%; background: none; color: inherit; cursor: pointer; transition: transform .4s var(--ease), background .3s;
	}
	.am-nav__more svg { width: 12px; height: 12px; }
	.am-nav__more[aria-expanded="true"] { transform: rotate(180deg); }
	body.am-dark-top .am-head:not(.is-solid) .am-nav__more { color: var(--white); }
	.am-mega {
		display: block; position: absolute; left: 0; right: 0; top: 100%; z-index: -1;
		background: var(--white); color: var(--ink); border-top: 1px solid var(--line); box-shadow: 0 40px 80px -40px rgba(10, 10, 10, .35);
		clip-path: inset(0 0 100% 0); visibility: hidden; transition: clip-path .55s var(--ease), visibility 0s .55s;
	}
	.am-mega.is-open { clip-path: inset(0 0 -60px 0); visibility: visible; transition: clip-path .6s var(--ease), visibility 0s; }
	.am-mega__in { display: grid; grid-template-columns: minmax(0, 3.4fr) minmax(0, 8.6fr); gap: clamp(28px, 3vw, 56px); padding-block: 30px 34px; }
	.am-mega__k { font: 500 var(--fs-mono)/1 var(--mono); color: var(--graphite); }
	.am-mega__k span { color: var(--red); font-weight: 700; }
	.am-mega__pic { position: relative; margin-top: 16px; aspect-ratio: 440 / 300; overflow: hidden; border-radius: 10px; background: radial-gradient(95% 80% at 52% 34%, #F7F5F1 0%, #E9E5DE 52%, #D8D2C8 100%); }
	.am-mega__pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .45s var(--ease), transform 1.2s var(--ease); }
	.am-mega__pic img.is-on { opacity: 1; transform: scale(1); }
	.am-mega__p { margin-top: 14px; font-size: .9375rem; color: var(--graphite); max-width: 34ch; }
	.am-mega__all { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-weight: 600; font-size: .9375rem; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--red); padding-bottom: 3px; }
	.am-mega__all .am-ic { width: 16px; height: 16px; transition: transform .4s var(--ease); }
	.am-mega__all:hover .am-ic { transform: translateX(4px); }
	.am-mega__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--ink); align-self: start; margin-top: 28px; }
	.am-mega__list li { border-bottom: 1px solid var(--line); }
	.am-mega__list li:not(:nth-of-type(3n)) { border-right: 1px solid var(--line); }
	.am-mega__list a {
		position: relative; isolation: isolate; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "n t go" "n a a" "n l l";
		gap: 4px 12px; height: 100%; padding: 20px 18px 22px; color: var(--ink); text-decoration: none; overflow: hidden;
	}
	.am-mega__list a::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--ink); transform: translateY(101%); transition: transform .5s var(--ease); }
	.am-mega__n { grid-area: n; font: 500 .75rem/1.5 var(--mono); color: var(--graphite); transition: color .3s; }
	.am-mega__t { grid-area: t; font-size: 1.25rem; font-weight: 650; letter-spacing: -.035em; line-height: 1.15; transition: color .3s; }
	.am-mega__a { grid-area: a; font: 600 .6875rem/1.3 var(--mono); color: var(--red); text-transform: uppercase; letter-spacing: .06em; }
	.am-mega__l { grid-area: l; margin-top: 4px; font-size: .875rem; line-height: 1.4; color: var(--graphite); transition: color .3s; }
	.am-mega__go { grid-area: go; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line); transition: background .3s, border-color .3s, transform .5s var(--ease); }
	.am-mega__go .am-ic { width: 14px; height: 14px; transform: rotate(-45deg); transition: transform .5s var(--ease); }
	.am-mega__list a:is(:hover, :focus-visible)::before { transform: none; }
	.am-mega__list a:is(:hover, :focus-visible) :is(.am-mega__t) { color: var(--white); }
	.am-mega__list a:is(:hover, :focus-visible) :is(.am-mega__n, .am-mega__l) { color: #BDBDBD; }
	.am-mega__list a:is(:hover, :focus-visible) .am-mega__go { background: var(--red); border-color: var(--red); color: var(--white); }
	.am-mega__list a:is(:hover, :focus-visible) .am-mega__go .am-ic { transform: none; }
	.am-mega__list a:focus-visible { outline-offset: -3px; }
}
@media (prefers-reduced-motion: reduce) { .am-mega, .am-mega.is-open { transition: none; } }

/* ---------- Services index: every row is a door ---------- */
.am-paths { position: relative; padding-block: var(--sec); }
.am-paths__list { border-top: 1px solid var(--ink); counter-reset: path; }
.am-path { border-bottom: 1px solid var(--line); }
.am-path__row {
	position: relative; isolation: isolate; display: grid; grid-template-columns: 2.4rem minmax(0, 1fr) 44px; grid-template-areas: "n main go" ". side side";
	column-gap: 12px; row-gap: 14px; padding: 26px 0 28px; color: var(--ink); text-decoration: none;
}
.am-path__row::before {
	content: ""; position: absolute; z-index: -1; inset: -1px calc(var(--gut) * -1); background: var(--ink);
	transform: scaleY(0); transform-origin: 50% 100%; transition: transform .6s var(--ease);
}
.am-path__n { grid-area: n; padding-top: .45em; font: 500 var(--fs-mono)/1 var(--mono); color: var(--graphite); transition: color .4s; }
.am-path__main { grid-area: main; display: grid; gap: 8px; min-width: 0; }
.am-path__url { font: 500 .75rem/1 var(--mono); color: var(--graphite); transition: color .4s; }
.am-path__sl { color: var(--red); font-weight: 700; margin-right: 1px; }
.am-path__title { font-size: clamp(1.9rem, 4.4vw, 3.6rem); font-weight: 650; letter-spacing: -.05em; line-height: 1; transition: color .4s, transform .7s var(--ease); }
.am-path__analogy { font-size: clamp(1rem, 1.3vw, 1.15rem); font-weight: 500; letter-spacing: -.015em; color: #3B3B3B; transition: color .4s; }
.am-path__side { grid-area: side; display: grid; gap: 12px; align-content: start; min-width: 0; }
.am-path__line { color: var(--graphite); font-size: .98rem; line-height: 1.55; max-width: 52ch; transition: color .4s; }
.am-path__inc { display: flex; flex-wrap: wrap; gap: 6px; }
.am-path__inc span { padding: 6px 10px; border-radius: 999px; background: var(--paper); font: 500 .75rem/1.2 var(--mono); color: #3B3B3B; transition: background .4s, color .4s; }
.am-path__stop { display: inline-flex; align-items: center; gap: 8px; width: max-content; font: 600 .6875rem/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--red); }
.am-path__stop::before { content: ""; width: 14px; height: 1px; background: currentColor; }
.am-path__go {
	grid-area: go; justify-self: end; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%;
	transition: background .4s, border-color .4s, color .4s, transform .6s var(--ease);
}
.am-path__go .am-ic { width: 18px; height: 18px; transform: rotate(-45deg); transition: transform .6s var(--ease); }
@media (min-width: 900px) {
	.am-path__row { grid-template-columns: 4.5rem minmax(0, 6fr) minmax(0, 4.6fr) 56px; grid-template-areas: "n main side go"; column-gap: clamp(20px, 3vw, 48px); align-items: start; padding: 34px 0 36px; }
	.am-path__side { padding-top: 1.55rem; }
	.am-path__go { width: 56px; height: 56px; align-self: center; }
}
@media (hover: hover) {
	.am-path__row:is(:hover, :focus-visible)::before { transform: scaleY(1); }
	.am-path__row:is(:hover, :focus-visible) .am-path__title { color: var(--white); transform: translateX(8px); }
	.am-path__row:is(:hover, :focus-visible) :is(.am-path__analogy) { color: #E6E6E6; }
	.am-path__row:is(:hover, :focus-visible) :is(.am-path__n, .am-path__url, .am-path__line) { color: #A9A9A9; }
	.am-path__row:is(:hover, :focus-visible) .am-path__inc span { background: rgba(255, 255, 255, .08); color: #DADADA; }
	.am-path__row:is(:hover, :focus-visible) .am-path__go { background: var(--red); border-color: var(--red); color: var(--white); }
	.am-path__row:is(:hover, :focus-visible) .am-path__go .am-ic { transform: none; }
}
.am-path__row:focus-visible { outline-offset: -2px; }
.am-path__row:active .am-path__go { transform: scale(.94); }

/* The stop on the street rides beside the cursor (fine pointers only). */
.am-paths__pic {
	position: fixed; left: 0; top: 0; z-index: 60; width: clamp(220px, 20vw, 300px); aspect-ratio: 440 / 320; overflow: hidden; border-radius: 10px; pointer-events: none;
	background: radial-gradient(95% 80% at 52% 34%, #F7F5F1 0%, #E9E5DE 52%, #D8D2C8 100%); box-shadow: 0 30px 60px -24px rgba(10, 10, 10, .45), 0 0 0 1px rgba(10, 10, 10, .08);
	opacity: 0; transform: scale(.85); transition: opacity .35s var(--ease), transform .5s var(--ease); visibility: hidden;
}
.am-paths__pic.is-on { opacity: 1; transform: none; visibility: visible; }
.am-paths__pic img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (hover: none), (pointer: coarse) { .am-paths__pic { display: none; } }

/* ---------- Footer: Johannesburg at dusk ---------- */
.am-foot { position: relative; overflow: clip; padding-top: clamp(64px, 8vw, 120px); background: var(--ink); }
.am-foot::after { z-index: 1; }
.am-foot__top { position: relative; z-index: 2; display: grid; gap: clamp(44px, 5vw, 72px); }
@media (min-width: 1100px) { .am-foot__top { grid-template-columns: minmax(0, 5.6fr) minmax(0, 6.4fr); align-items: start; } }
.am-foot__brandlink { display: inline-block; }
.am-foot__logo { display: block; width: clamp(150px, 14vw, 200px); height: auto; }
.am-foot__h { margin-top: clamp(26px, 3vw, 40px); font-size: clamp(2rem, 3.6vw, 3.4rem); font-weight: 660; letter-spacing: -.05em; line-height: 1; max-width: 14ch; }
.am-foot__lede { margin-top: 26px; color: #CFCFCF; max-width: 40ch; }
.am-addr--sm { max-width: 560px; height: 60px; margin-top: 26px; font-size: 1rem; }
.am-addr--sm .am-addr__go { font-size: .9375rem; }
.am-foot__talk { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 28px; }
.am-foot__talk-k { margin-right: 6px; font-weight: 600; font-size: .95rem; }
.am-foot__ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .08); color: var(--white); transition: background .3s, color .3s, transform .4s var(--ease); }
.am-foot__ic .am-ic { width: 18px; height: 18px; }
.am-foot__ic:hover { background: var(--red); transform: translateY(-3px); }

.am-foot__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; }
@media (min-width: 700px) { .am-foot__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .am-foot__cols { padding-top: 6px; justify-self: end; width: 100%; max-width: 640px; } }
.am-foot__label { margin-bottom: 18px; font-weight: 650; font-size: 1rem; letter-spacing: -.01em; color: var(--white); }
.am-foot__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.am-foot__list a, .am-foot__dir { color: #BDBDBD; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; padding-bottom: 2px; transition: background-size .45s var(--ease), color .3s; }
.am-foot__list a:hover, .am-foot__dir:hover { color: var(--white); background-size: 100% 1px; }
.am-foot__addr { font-style: normal; color: #BDBDBD; line-height: 1.6; }
.am-foot__dir { display: inline-block; margin-top: 12px; color: var(--white); font-weight: 600; }
.am-foot__clock { display: flex; align-items: center; gap: 8px; margin-top: 18px; font: 500 .75rem/1 var(--mono); color: var(--fog); }
.am-foot__clock i { width: 7px; height: 7px; border-radius: 50%; background: var(--red); animation: am-pulse 2s infinite; }
.am-foot__clock b { color: var(--white); font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 699px) { .am-foot__cols > :last-child { grid-column: 1 / -1; } }

/* The skyline, engraved: full width, settling into place as the footer arrives. */
.am-foot__scene { position: relative; z-index: 0; aspect-ratio: 2172 / 724; min-height: 280px; margin-top: clamp(8px, 2vw, 24px); overflow: hidden; }
.am-foot__sky { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 70%; transform-origin: 50% 100%; will-change: transform; }
.am-foot__base { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; padding-block: 14px clamp(14px, 1.6vw, 22px); font: 500 .75rem/1.4 var(--mono); color: #A9A39A; }
.am-foot__links { display: flex; align-items: center; gap: 20px; }
.am-foot__base a { color: #EDE6DA; text-decoration: none; }
.am-foot__totop { display: inline-flex; align-items: center; gap: 8px; }
.am-foot__totop .am-ic { width: 14px; height: 14px; transform: rotate(-90deg); transition: transform .4s var(--ease); }
.am-foot__totop:hover .am-ic { transform: rotate(-90deg) translateX(3px); }
.am-foot__base { background: linear-gradient(rgba(10, 10, 10, 0), rgba(10, 10, 10, .7) 45%); }
.am-foot__sl { color: var(--red); letter-spacing: -.12em; }
@media (max-width: 699px) {
	.am-foot__scene { aspect-ratio: auto; height: 340px; }
	.am-foot__sky { bottom: 70px; height: calc(100% - 70px); object-position: 34% 70%; }
	.am-foot__base { background: var(--ink); padding-top: 12px; }
}
}

/* ---------- Scroll motion, everywhere ---------- */
/* Kickers: the two strokes slide in, then the words. */
.js .am-kicker .am-kicker__sl { display: inline-block; opacity: 0; transform: translateX(-10px); transition: opacity .5s var(--ease), transform .8s var(--ease); }
.js .am-kicker.is-in .am-kicker__sl { opacity: 1; transform: none; }
/* Rules draw across instead of just being there. */
.am-rule { position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: 0 50%; transition: transform 1.4s var(--ease); pointer-events: none; }
.am-rule.is-in { transform: none; }
.js .am-has-rule { border-top-color: transparent !important; position: relative; }
/* Screens settle from a little zoom as they come in. */
.js [data-reveal] :is(.am-win__view, .am-card__view, .am-crop__frame, .am-bf__view) img { transform: scale(1.07); transition: transform 1.6s var(--ease) var(--d, 0s); }
.js [data-reveal].is-in :is(.am-win__view, .am-card__view, .am-crop__frame, .am-bf__view) img { transform: none; }
@media (prefers-reduced-motion: reduce) {
	.js .am-kicker .am-kicker__sl, .am-rule { opacity: 1 !important; transform: none !important; transition: none !important; }
	.js [data-reveal] img { transform: none !important; }
}

/* ---------- Work: a dealt hand of sites in the hero ---------- */
.am-deck { position: relative; height: clamp(260px, 30vw, 400px); margin-inline: auto; max-width: 560px; }
.am-deck__w { position: absolute; left: 50%; top: 50%; width: 72%; margin: 0; box-shadow: 0 40px 70px -34px rgba(10, 10, 10, .55), 0 0 0 1px rgba(10, 10, 10, .06); transform: translate(-50%, -50%); transition: transform 1.2s var(--ease), box-shadow .6s; }
.am-deck__w .am-win__view { display: block; aspect-ratio: 16 / 10; overflow: hidden; }
.am-deck__w img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.am-deck__w:nth-child(1) { z-index: 1; }
.am-deck__w:nth-child(2) { z-index: 2; }
.am-deck__w:nth-child(3) { z-index: 3; }
.is-in > .am-deck .am-deck__w:nth-child(1), .am-phero__aside:not([data-reveal]) .am-deck__w:nth-child(1) { transform: translate(-78%, -64%) rotate(-7deg); }
.is-in > .am-deck .am-deck__w:nth-child(2), .am-phero__aside:not([data-reveal]) .am-deck__w:nth-child(2) { transform: translate(-30%, -52%) rotate(5deg); transition-delay: .08s; }
.is-in > .am-deck .am-deck__w:nth-child(3), .am-phero__aside:not([data-reveal]) .am-deck__w:nth-child(3) { transform: translate(-52%, -30%) rotate(-1.5deg); transition-delay: .16s; }
@media (hover: hover) {
	.is-in > .am-deck:hover .am-deck__w:nth-child(1) { transform: translate(-86%, -70%) rotate(-10deg); }
	.is-in > .am-deck:hover .am-deck__w:nth-child(2) { transform: translate(-22%, -58%) rotate(8deg); }
	.is-in > .am-deck:hover .am-deck__w:nth-child(3) { transform: translate(-52%, -24%) rotate(-1deg); }
}
@media (prefers-reduced-motion: reduce) { .am-deck__w { transition: none; } }

/* ---------- Work: the open spot at the end of the grid ---------- */
.am-card--next { grid-column: span var(--span, 1); }
.am-next { display: grid; gap: 22px; height: 100%; color: var(--ink); text-decoration: none; }
.am-next__win { display: flex; flex-direction: column; border-style: dashed; border-color: #CFCFCB; background: var(--paper); box-shadow: none; transition: border-color .4s, background .4s; }
.am-next__view { position: relative; flex: 1; display: flex; align-items: flex-end; min-height: clamp(180px, 16vw, 250px); padding: clamp(18px, 2vw, 28px); overflow: hidden; }
.am-next__h { position: relative; z-index: 1; font-size: clamp(1.8rem, 3.2vw, 3rem); font-weight: 660; letter-spacing: -.055em; line-height: .95; }
.am-next__sl { position: absolute; right: -4%; top: -10%; width: clamp(110px, 28%, 220px); height: auto; color: #DADAD6; transition: transform 1s var(--ease); }
.am-next__sl .am-slashes__b { fill: var(--red); transition: transform 1s var(--ease); }
.am-next__meta { display: grid; gap: 8px; }
.am-next__t { font-size: 1.35rem; font-weight: 650; letter-spacing: -.035em; }
.am-next__p { color: var(--graphite); font-size: .95rem; max-width: 46ch; }
.am-next__go { display: inline-flex; align-items: center; gap: 8px; width: max-content; margin-top: 4px; font-weight: 600; border-bottom: 1px solid var(--red); padding-bottom: 3px; }
.am-next__go .am-ic { width: 16px; height: 16px; transition: transform .4s var(--ease); }
.am-next:hover .am-next__win { border-color: var(--ink); background: var(--white); }
.am-next:hover .am-next__sl .am-slashes__b { transform: translateY(-14%); }
.am-next:hover .am-next__go .am-ic { transform: translateX(4px); }
/* Wide spot: window and words side by side. */
.am-card--next.is-wide .am-next { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; gap: clamp(24px, 3vw, 48px); }
.am-grid[data-layout="list"] .am-card--next { grid-column: auto; }
.am-grid[data-layout="list"] .am-next { grid-template-columns: 1fr; padding: 26px 0; }
.am-grid[data-layout="list"] .am-next__win { display: none; }

/* ---------- How a project runs: a page load you scroll through ---------- */
.am-run { padding-block: var(--sec); background: var(--paper); overflow: clip; }
.am-run__head { display: grid; gap: 22px; margin-bottom: clamp(32px, 4vw, 52px); }
.am-run__head .am-h2 { max-width: 13ch; }
.am-run__side { display: grid; gap: 18px; max-width: 460px; }
.am-run__p { color: #2B2B2B; }
@media (min-width: 900px) { .am-run__head { grid-template-columns: minmax(0, 1fr) minmax(0, 460px); align-items: end; justify-content: space-between; } }
.am-run__bar { position: relative; display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 16px; border-radius: 999px; background: var(--white); box-shadow: inset 0 0 0 1px var(--line), 0 18px 36px -24px rgba(10, 10, 10, .35); font: 500 .8125rem/1 var(--mono); overflow: hidden; }
.am-run__bar .am-ic { width: 13px; height: 13px; flex: none; }
.am-run__url { color: var(--ink); font-weight: 600; white-space: nowrap; }
.am-run__status { margin-left: auto; padding: 5px 10px; border-radius: 999px; background: var(--paper); color: var(--graphite); white-space: nowrap; transition: background .3s, color .3s; }
.am-run__status.is-ok { background: var(--red); color: var(--white); }
.am-run__line { position: absolute; left: 16px; right: 16px; bottom: 0; height: 2px; background: var(--paper-2); }
.am-run__line i { position: absolute; inset: 0; background: var(--red); transform-origin: 0 50%; transform: scaleX(0); }

.am-run__track { display: grid; gap: 14px; padding-inline: var(--gut); max-width: calc(var(--max) + var(--gut) * 2); margin-inline: auto; }
@media (min-width: 700px) and (max-width: 1023px) { .am-run__track { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.am-step {
	position: relative; display: flex; flex-direction: column; min-width: 0; padding: clamp(20px, 2vw, 28px); border-radius: 16px;
	background: var(--white); box-shadow: inset 0 0 0 1px var(--line); color: var(--ink); transition: background .6s var(--ease), color .6s var(--ease), box-shadow .6s, transform .8s var(--ease);
}
.am-step__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.am-step__n { font-size: clamp(2.4rem, 3.6vw, 3.6rem); font-weight: 680; letter-spacing: -.06em; line-height: .9; color: #CFCFCB; transition: color .6s; }
.am-step__code { padding: 6px 10px; border-radius: 999px; background: var(--paper); font: 600 .6875rem/1 var(--mono); color: var(--ink); transition: background .6s, color .6s; }
.am-step__pic { position: relative; display: grid; align-content: center; gap: 8px; height: clamp(150px, 15vw, 190px); margin: 18px 0 20px; padding: 16px; border-radius: 12px; background: var(--paper); overflow: hidden; transition: background .6s; }
.am-step__t { font-size: clamp(1.5rem, 2.2vw, 2.1rem); font-weight: 660; letter-spacing: -.045em; line-height: 1; }
.am-step__p { margin-top: 10px; color: var(--graphite); font-size: .95rem; line-height: 1.55; transition: color .6s; }
.am-step__get { margin-top: auto; padding-top: 18px; font-size: .9rem; font-weight: 600; letter-spacing: -.01em; }
.am-step__get span { display: inline-block; margin-right: 6px; font: 500 .6875rem/1 var(--mono); color: var(--red); text-transform: uppercase; letter-spacing: .06em; }
.am-step.is-on { background: var(--ink); color: var(--white); box-shadow: 0 40px 70px -40px rgba(10, 10, 10, .7); }
.am-step.is-on .am-step__n { color: var(--red); }
.am-step.is-on .am-step__code { background: rgba(255, 255, 255, .1); color: var(--white); }
.am-step.is-on .am-step__p { color: #C9C9C9; }
.am-step.is-on .am-step__pic { background: #1b1b1b; }

/* The little pictures */
.am-chat { max-width: 84%; padding: 9px 12px; border-radius: 12px; font-size: .8125rem; line-height: 1.35; }
.am-chat--in { background: var(--white); color: var(--ink); border-bottom-left-radius: 4px; box-shadow: 0 6px 16px -10px rgba(0, 0, 0, .3); }
.am-chat--out { justify-self: end; background: var(--red); color: var(--white); border-bottom-right-radius: 4px; }
.am-chat small { display: block; margin-top: 4px; text-align: right; font: 500 .625rem/1 var(--mono); opacity: .8; }
.am-map { display: grid; justify-items: center; gap: 14px; }
.am-map__root, .am-map__kids span { padding: 6px 12px; border-radius: 8px; background: var(--white); color: var(--ink); font-size: .75rem; font-weight: 600; box-shadow: 0 6px 16px -10px rgba(0, 0, 0, .3); }
.am-map__root { position: relative; background: var(--ink); color: var(--white); }
.am-step.is-on .am-map__root { background: var(--red); }
.am-map__root::after { content: ""; position: absolute; left: 50%; top: 100%; width: 1px; height: 14px; background: #BDBDB8; }
.am-map__kids { position: relative; display: flex; gap: 8px; padding-top: 0; }
.am-map__kids::before { content: ""; position: absolute; left: 16%; right: 16%; top: -7px; height: 1px; background: #BDBDB8; }
.am-map__kw { font: 500 .6875rem/1 var(--mono); color: var(--graphite); }
.am-step.is-on .am-map__kw { color: #A9A9A9; }
.am-mini { border-radius: 8px; background: var(--white); box-shadow: 0 10px 24px -14px rgba(0, 0, 0, .35); overflow: hidden; }
.am-mini__bar { display: flex; align-items: center; gap: 6px; height: 22px; padding: 0 8px; background: var(--paper-2); font: 500 .5625rem/1 var(--mono); color: var(--graphite); white-space: nowrap; overflow: hidden; }
.am-mini__bar i { width: 10px; height: 6px; flex: none; background: linear-gradient(115deg, transparent 22%, #8a8a8a 22% 40%, transparent 40% 56%, var(--red) 56% 74%, transparent 74%); }
.am-mini__bar b { font-weight: 500; }
.am-mini__body { display: grid; gap: 6px; padding: 10px; }
.am-mini__body i { display: block; height: 7px; border-radius: 4px; background: var(--paper-2); }
.am-mini__h { width: 70%; height: 12px !important; background: var(--ink) !important; }
.am-mini__l { width: 88%; }
.am-mini__l--s { width: 56%; }
.am-mini__tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; margin-top: 4px; }
.am-mini__tiles i { height: 28px !important; }
.am-mini__tiles i:nth-child(2) { background: #f6d4d2 !important; }
.am-step.is-on .am-mini__h, .am-step.is-on .am-mini__body i { animation: am-build .9s var(--ease) both; }
.am-step.is-on .am-mini__body > i:nth-child(2) { animation-delay: .1s; } .am-step.is-on .am-mini__body > i:nth-child(3) { animation-delay: .2s; }
.am-step.is-on .am-mini__tiles i:nth-child(1) { animation-delay: .3s; } .am-step.is-on .am-mini__tiles i:nth-child(2) { animation-delay: .38s; } .am-step.is-on .am-mini__tiles i:nth-child(3) { animation-delay: .46s; }
@keyframes am-build { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.am-ok b { display: block; font-size: 2.6rem; font-weight: 700; letter-spacing: -.06em; line-height: 1; }
.am-ok b span { color: var(--red); }
.am-ok ul { list-style: none; padding: 0; display: grid; gap: 4px; margin-top: 8px; font: 500 .6875rem/1.3 var(--mono); color: var(--graphite); }
.am-ok li::before { content: "✓ "; color: var(--red); font-weight: 700; }
.am-step.is-on .am-ok ul { color: #BDBDBD; }
.am-grow { display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 8px; height: 100%; min-height: 0; }
.am-step__pic:has(.am-grow) { align-content: stretch; }
.am-grow__bars { display: grid; grid-template-columns: repeat(6, 1fr); align-items: end; gap: 6px; height: 100%; min-height: 0; }
.am-grow__bars i { display: block; height: calc(var(--h) * 100%); border-radius: 4px 4px 0 0; background: #CFCFCB; transform-origin: 50% 100%; }
.am-grow__bars i:last-child { background: var(--red); }
.am-step.is-on .am-grow__bars i { animation: am-rise 1s var(--ease) both; }
.am-step.is-on .am-grow__bars i:nth-child(2) { animation-delay: .06s; } .am-step.is-on .am-grow__bars i:nth-child(3) { animation-delay: .12s; } .am-step.is-on .am-grow__bars i:nth-child(4) { animation-delay: .18s; } .am-step.is-on .am-grow__bars i:nth-child(5) { animation-delay: .24s; } .am-step.is-on .am-grow__bars i:nth-child(6) { animation-delay: .3s; }
@keyframes am-rise { from { transform: scaleY(.1); } to { transform: none; } }
.am-step.is-on .am-grow__bars i:not(:last-child) { background: #3a3a3a; }
.am-grow__k { font: 500 .6875rem/1 var(--mono); color: var(--graphite); }

/* The request waterfall under the steps (desktop). */
.am-run__fall { display: none; }
@media (min-width: 1024px) {
	.am-run__fall { display: block; margin-top: clamp(26px, 3vw, 40px); }
	.am-run__lanes { position: relative; display: grid; gap: 5px; padding: 12px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); background: repeating-linear-gradient(90deg, rgba(10, 10, 10, .06) 0 1px, transparent 1px 10%); }
	.am-run__lane { position: relative; height: 14px; }
	.am-run__lane i { position: absolute; top: 0; bottom: 0; left: calc(var(--s) * 1%); width: calc((var(--e) - var(--s)) * 1%); display: flex; align-items: center; padding-left: 8px; border-radius: 3px; background: #D9D9D5; font: 600 .5625rem/1 var(--mono); font-style: normal; color: var(--graphite); white-space: nowrap; overflow: hidden; transition: background .4s, color .4s; }
	.am-run__lane i.is-on { background: var(--ink); color: var(--white); }
	.am-run__lane i.is-done { background: #8F8F8B; color: var(--white); }
	.am-run__head-line { position: absolute; top: -6px; bottom: -6px; left: 0; width: 2px; background: var(--red); transform: translateX(var(--x, 0px)); }
	.am-run__head-line::before { content: ""; position: absolute; left: -4px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: var(--red); }
	.am-run__scale { display: flex; justify-content: space-between; margin-top: 10px; font: 500 .6875rem/1 var(--mono); color: var(--graphite); }

	/* Pinned: the steps scroll sideways under a fixed head. */
	.am-run.is-pinned { padding-block: 0; }
	.am-run.is-pinned .am-run__pin { height: calc(100svh - var(--head)); display: flex; flex-direction: column; justify-content: center; padding-block: clamp(20px, 3vh, 40px); }
	.am-run.is-pinned .am-run__head { margin-bottom: clamp(18px, 3vh, 36px); }
	.am-run.is-pinned .am-run__view { overflow: visible; }
	.am-run.is-pinned .am-run__track { display: flex; gap: 18px; width: max-content; max-width: none; margin: 0; padding-left: max(var(--gut), calc((100vw - var(--max)) / 2)); padding-right: 30vw; will-change: transform; }
	.am-run.is-pinned .am-step { width: clamp(330px, 31vw, 460px); flex: none; }
	.am-run.is-pinned .am-step__pic { height: clamp(120px, 17vh, 180px); }
}
@media (prefers-reduced-motion: reduce) { .am-step *, .am-step.is-on * { animation: none !important; } }
