/*Clock Lobster — Static Site StylesheetBased on the WordPress custom theme design system.*/:root {  --bg: #121214;  --surface: #1e293b;  --surface-light: #334155;  --cta: #e11d48;  --cta-hover: #be123c;  --cta-light: #fb7185;  --cta-text: #f87171;  --text-muted-on-glass: #94a3b8;  --text-primary: #f8fafc;  --text-secondary: #94a3b8;  --text-muted: #94a3b8;  --border: rgba(255,255,255,0.08);  --glass-bg: #1e293b;  --glass-border: rgba(255,255,255,0.1);  --success: #22c55e;  --accent: #38bdf8;  --status-ok: #22c55e;  --status-warn: #eab308;  --status-bad: #ef4444;  --status-idle: #64748b;  --status-info: #38bdf8;  --font-header: 'Outfit', sans-serif;  --font-body: 'Inter', sans-serif;  --container-max: 1440px;  --radius-lg: 16px;  --shadow-lg: 0 10px 30px rgba(0,0,0,0.4);}*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }html { color-scheme: dark; scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }body {  font-family: var(--font-body);  font-size: 1rem;  line-height: 1.6;  color: #f8fafc;  background-color: #121214;  min-height: 100vh;  overflow-x: hidden;}img, svg { display: block; max-width: 100%; height: auto; }input, button, textarea, select { font: inherit; color: inherit; }a { color: inherit; text-decoration: none; transition: color 150ms ease; }ul, ol { list-style: none; }h1, h2, h3, h4, h5, h6 {  font-family: var(--font-header);  font-weight: 700;  line-height: 1.1;  color: var(--text-primary);  letter-spacing: -0.02em;}h1 { font-size: clamp(2.25rem, 5vw, 3.75rem); }h2 { font-size: clamp(1.875rem, 4vw, 2.25rem); }h3 { font-size: clamp(1.5rem, 3vw, 1.875rem); }h4 { font-size: 1.5rem; }p { color: var(--text-secondary); line-height: 1.75; }.container {  width: 100%; max-width: var(--container-max);  margin-left: auto; margin-right: auto;  padding-left: 1.5rem; padding-right: 1.5rem;}.section { padding-top: 6rem; padding-bottom: 6rem; position: relative; }.container-narrow { max-width: 960px; margin-left: auto; margin-right: auto; }.section-sm { padding-top: 4rem; padding-bottom: 4rem; }.grid-2, .grid-3, .grid-4 {  display: grid; gap: 2rem; grid-template-columns: 1fr;}@media (min-width: 768px) {  .grid-2 { grid-template-columns: repeat(2, 1fr); }  .grid-3 { grid-template-columns: repeat(3, 1fr); }  .grid-4 { grid-template-columns: repeat(2, 1fr); }}@media (min-width: 1024px) {  .grid-4 { grid-template-columns: repeat(4, 1fr); }  .container { padding-left: 2rem; padding-right: 2rem; }}.glass-card {  background: #1e293b;    border: 1px solid var(--glass-border);  border-radius: var(--radius-lg);  padding: 2rem;  transition: transform 300ms ease, box-shadow 300ms ease;}.glass-card:hover {  transform: translateY(-4px);  box-shadow: var(--shadow-lg), 0 0 30px rgba(56,189,248,0.08);}.glass-panel {  background: var(--glass-bg);  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);  border: 1px solid var(--glass-border);  border-radius: var(--radius-lg);}.btn {  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;  font-family: var(--font-header); font-weight: 600; font-size: 1rem;  padding: 0.75rem 1.5rem; border-radius: 12px; border: none;  cursor: pointer; transition: all 300ms ease; text-align: center; line-height: 1.5;}.btn-primary {  background-color: var(--cta); color: #fff;  box-shadow: 0 4px 14px rgba(225,29,72,0.35);}.btn-primary:hover {  background-color: var(--cta-hover); transform: translateY(-2px);  box-shadow: 0 6px 20px rgba(225,29,72,0.45);}.btn-secondary {  background: transparent; color: var(--text-primary);  border: 1.5px solid var(--border);}.btn-secondary:hover { border-color: var(--text-secondary); background: rgba(255,255,255,0.04); }.btn-lg { padding: 1rem 2rem; font-size: 1.125rem; border-radius: var(--radius-lg); }.site-header { position: sticky; top: 0; z-index: 50; }.header-glass {  background: rgba(18,18,20,0.8);   border-bottom: 1px solid var(--border);}.nav-container { display: flex; align-items: center; justify-content: space-between; height: 72px; }.site-logo {  display: flex; align-items: center; gap: 0.5rem;  font-family: var(--font-header); font-weight: 700; font-size: 1.25rem;  color: var(--text-primary); flex-shrink: 0;}.logo-icon,.logo-icon picture,.logo-icon img { width: 32px; height: 32px; display: block; object-fit: contain; }/* Circular founder avatar on /about (wraps the responsive <picture>). */.avatar-wrap {  display: block;  width: 120px; height: 120px;  border-radius: 50%;  overflow: hidden;  margin: 0 auto 1.5rem;}.avatar-img,.avatar-wrap picture,.avatar-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }/* Agent workflow diagram on /services (wraps the responsive <picture>). */.diagram-wrap { display: block; max-width: 100%; width: 720px; margin: 0 auto; }.diagram-img,.diagram-wrap picture,.diagram-wrap img {  max-width: 100%; width: 100%; height: auto;  border-radius: var(--radius-lg);  box-shadow: var(--shadow-lg);  border: 1px solid var(--border);  display: block;}.main-nav { display: none; }.nav-menu { display: flex; align-items: center; gap: 1.5rem; }.nav-menu a {  font-family: var(--font-header); font-weight: 500; font-size: 0.9375rem;  color: var(--text-secondary); transition: color 150ms ease;}.nav-menu a:hover { color: var(--text-primary); }/* Active nav uses high-contrast text-primary (not --cta, which is only 3.98:1   on the dark header and fails WCAG AA for normal-size text). The red is kept   as a left border accent instead, which carries the "active" signal without   relying on color contrast for legible text. */.nav-menu a.active { color: var(--text-primary); font-weight: 600; }.header-cta { display: none; }.mobile-menu-toggle {  display: flex; flex-direction: column; gap: 5px;  background: none; border: none; cursor: pointer; padding: 0.5rem;}.mobile-menu-toggle span {  display: block; width: 24px; height: 2px; background: var(--text-primary);  border-radius: 2px; transition: all 300ms ease;}@media (min-width: 810px) {  .main-nav { display: block; }  .header-cta { display: block; }  .mobile-menu-toggle { display: none; }}.site-footer { border-top: 1px solid var(--border); }.footer-main { padding: 4rem 0; }.footer-grid {  display: grid; gap: 3rem; grid-template-columns: 1fr;}.footer-brand .site-logo { margin-bottom: 1rem; }.footer-tagline { color: var(--text-muted); font-size: 0.9375rem; margin-bottom: 0.5rem; }.footer-email { color: var(--text-secondary); font-size: 0.9375rem; }.footer-heading {  font-family: var(--font-header); font-weight: 600; font-size: 1rem;  color: var(--text-primary); margin-bottom: 1rem;}.footer-menu li { margin-bottom: 0.5rem; }.footer-menu a {  color: var(--text-muted); font-size: 0.9375rem;  transition: color 150ms ease;}.footer-menu a:hover { color: var(--text-primary); }.footer-form-text { color: var(--text-muted); font-size: 0.9375rem; margin-bottom: 1rem; }.footer-bottom {  border-top: 1px solid var(--border); padding: 1.5rem 0;}.footer-bottom .container {  display: flex; flex-direction: column; gap: 0.5rem;  align-items: center; text-align: center;}.copyright, .footer-legal { color: var(--text-muted); font-size: 0.875rem; }.footer-legal a:hover { color: var(--text-secondary); }@media (min-width: 768px) {  .footer-grid { grid-template-columns: 2fr 1fr 1fr 2fr; }  .footer-bottom .container { flex-direction: row; justify-content: space-between; }}.section-label {  display: inline-block; font-family: var(--font-header); font-weight: 600;  font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.08em;  color: #fb7185; margin-bottom: 1rem;}.section-title { margin-bottom: 1rem; }.section-subtitle {  color: #cbd5e1; font-size: 1.125rem; max-width: 600px;}.hero { padding-top: 6rem; padding-bottom: 6rem; position: relative; overflow: hidden; }.hero-grid {  display: grid; gap: 3rem; align-items: center; grid-template-columns: 1fr;}.hero-content { max-width: 640px; }.hero-title { margin-bottom: 1.25rem; }.hero-title span { color: var(--cta); }.hero-subtitle {  font-size: 1.125rem; color: var(--text-secondary); margin-bottom: 2rem; line-height: 1.75;}.hero-actions { display: flex; flex-wrap: wrap; gap: 1rem; }@media (min-width: 1024px) {  .hero-grid { grid-template-columns: 1fr 1fr; }  .hero { padding-top: 8rem; padding-bottom: 8rem; }}.problem-section { background-color: #121214; }.problem-stat {  font-family: var(--font-header); font-size: 3rem; font-weight: 800;  color: var(--cta-text); line-height: 1;}.problem-stat-label { color: var(--text-muted-on-glass); font-size: 0.875rem; margin-top: 0.5rem; }.step-number {  display: inline-flex; align-items: center; justify-content: center;  width: 48px; height: 48px; border-radius: 50%;  background: var(--cta); color: #fff; font-family: var(--font-header);  font-weight: 700; font-size: 1.25rem; margin-bottom: 1.25rem;}.step-title { font-size: 1.25rem; margin-bottom: 0.5rem; }.step-desc { color: var(--text-secondary); font-size: 0.9375rem; }.lead-magnet-section {  background-color: #121214;  border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);}.lead-magnet-grid {  display: grid; gap: 3rem; align-items: center; grid-template-columns: 1fr;}.lead-magnet-form {  background: var(--glass-bg); backdrop-filter: blur(16px);  -webkit-backdrop-filter: blur(16px); border: 1px solid var(--glass-border);  border-radius: var(--radius-lg); padding: 2rem;}@media (min-width: 768px) {  .lead-magnet-grid { grid-template-columns: 1fr 1fr; }}.service-card { text-align: center; }.service-icon {  width: 64px; height: 64px; margin: 0 auto 1.5rem;  background: var(--surface); border-radius: var(--radius-lg);  display: flex; align-items: center; justify-content: center;  font-size: 1.75rem;}.service-card h3 { font-size: 1.25rem; margin-bottom: 0.75rem; }.service-card p { font-size: 0.9375rem; }.pricing-card { text-align: center; border: 1px solid var(--border); }.pricing-card.featured { border-color: var(--cta); position: relative; }.pricing-card.featured::before {  content: 'Most Popular'; position: absolute; top: -12px; left: 50%; transform: translateX(-50%);  background: var(--cta); color: #fff; font-family: var(--font-header); font-weight: 600;  font-size: 0.75rem; padding: 0.25rem 0.75rem; border-radius: 9999px;}.pricing-amount {  font-family: var(--font-header); font-weight: 800; font-size: 2.5rem;  color: var(--text-primary); margin-bottom: 0.25rem;}.pricing-amount span { font-size: 1rem; font-weight: 500; color: #cbd5e1; background-color: #1e293b; }.pricing-desc { color: #cbd5e1; font-size: 0.9375rem; margin-bottom: 1.5rem; }.trust-grid { display: flex; flex-wrap: wrap; gap: 2rem; justify-content: center; align-items: center; }.trust-item {  display: flex; align-items: center; gap: 0.75rem;  color: var(--text-muted); font-size: 0.9375rem;}.trust-item svg { width: 24px; height: 24px; color: var(--success); flex-shrink: 0; }.philosophy-quote {  font-family: var(--font-header); font-size: 1.5rem; font-weight: 500;  color: var(--text-primary); line-height: 1.4; padding-left: 1.5rem;  border-left: 3px solid var(--cta); margin-bottom: 1.5rem;}.security-card { display: flex; gap: 1rem; align-items: flex-start; }.security-icon {  width: 48px; height: 48px; border-radius: 12px; background: var(--surface);  display: flex; align-items: center; justify-content: center; flex-shrink: 0;  font-size: 1.25rem;}.security-card :is(h3, h4) { font-size: 1.125rem; margin-bottom: 0.25rem; }.security-card p { font-size: 0.9375rem; }.contact-grid {  display: grid; gap: 3rem; grid-template-columns: 1fr;}@media (min-width: 768px) { .contact-grid { grid-template-columns: 1fr 1fr; } }.contact-info-item { display: flex; gap: 1rem; margin-bottom: 1.5rem; }.contact-info-icon {  width: 40px; height: 40px; border-radius: 10px; background: var(--surface);  display: flex; align-items: center; justify-content: center; flex-shrink: 0;}.calendar-mockup {  background: var(--surface); border-radius: var(--radius-lg);  padding: 2rem; border: 1px solid var(--border);}.calendar-header {  display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem;}.calendar-grid {  display: grid; grid-template-columns: repeat(7, 1fr); gap: 0.5rem;}.calendar-day-header {  text-align: center; font-size: 0.75rem; font-weight: 600;  color: var(--text-muted); padding: 0.5rem 0;}.calendar-day {  aspect-ratio: 1; display: flex; align-items: center; justify-content: center;  border-radius: 8px; font-size: 0.875rem; color: var(--text-secondary);  background: var(--bg); border: 1px solid var(--border);}.calendar-day.available {  background: var(--glass-bg); border-color: var(--glass-border);  color: var(--text-primary); cursor: pointer; transition: all 200ms ease;}.calendar-day.available:hover { background: var(--cta); color: #fff; border-color: var(--cta); }.calendar-day.past { color: var(--text-muted); opacity: 0.4; }.calendar-day.today { border-color: var(--cta); color: var(--cta); font-weight: 600; }.automation-visual {  position: relative; width: 100%; height: 400px;  background-color: var(--bg);  background-image: radial-gradient(circle at 50% 50%, rgba(30,41,59,0.5) 0%, transparent 70%);  border-radius: var(--radius-lg); overflow: hidden;  display: flex; align-items: center; justify-content: center;}.automation-flow {  position: relative; width: 320px; height: 320px;}.flow-node {  position: absolute; width: 56px; height: 56px;  background: var(--surface); border: 1px solid var(--border);  border-radius: 50%; display: flex; align-items: center; justify-content: center;  font-size: 1.5rem; z-index: 2;  box-shadow: 0 0 20px rgba(56,189,248,0.1);}.flow-node.person { top: 0; left: 50%; transform: translateX(-50%); }.flow-node.system {  top: 50%; left: 50%; transform: translate(-50%, -50%);  width: 72px; height: 72px; background: var(--glass-bg);  backdrop-filter: blur(10px); border-color: var(--accent);  box-shadow: 0 0 30px rgba(56,189,248,0.2);  animation: systemPulse 3s ease-in-out infinite;}.flow-node.output { bottom: 0; left: 50%; transform: translateX(-50%); }@keyframes systemPulse {  0%, 100% { box-shadow: 0 0 20px rgba(56,189,248,0.15); }  50% { box-shadow: 0 0 40px rgba(56,189,248,0.35); }}.flow-particle {  position: absolute; width: 8px; height: 8px;  background: var(--accent); border-radius: 50%;  box-shadow: 0 0 8px var(--accent); opacity: 0;}.flow-particle.p1 { top: 56px; left: 50%; animation: particleDown 3s ease-in-out infinite; }.flow-particle.p2 { top: 56px; left: 50%; animation: particleDown 3s ease-in-out 0.8s infinite; }.flow-particle.p3 { top: 50%; left: 50%; animation: particleOut 3s ease-in-out 1.5s infinite; }.flow-particle.p4 { top: 50%; left: 50%; animation: particleOut 3s ease-in-out 2.2s infinite; }@keyframes particleDown {  0% { transform: translate(-50%, 0) scale(0); opacity: 0; }  20% { opacity: 1; transform: translate(-50%, 0) scale(1); }  80% { opacity: 1; transform: translate(-50%, 90px) scale(0.6); }  100% { opacity: 0; transform: translate(-50%, 100px) scale(0); }}@keyframes particleOut {  0% { transform: translate(-50%, -50%) scale(0); opacity: 0; }  20% { opacity: 1; transform: translate(-50%, -50%) scale(1); }  80% { opacity: 1; transform: translate(-50%, 60px) scale(0.6); }  100% { opacity: 0; transform: translate(-50%, 70px) scale(0); }}.flow-label {  position: absolute; font-size: 0.75rem; font-weight: 600;  color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.05em;}.flow-label.in { top: 64px; left: 50%; transform: translateX(-50%); }.flow-label.out { bottom: 64px; left: 50%; transform: translateX(-50%); }.flow-words {  position: absolute; top: 20px; left: 50%; transform: translateX(-50%);  display: flex; gap: 0.5rem; opacity: 0;  animation: wordsFloat 3s ease-in-out infinite;}.flow-words span {  background: var(--glass-bg); border: 1px solid var(--glass-border);  padding: 0.25rem 0.5rem; border-radius: 6px; font-size: 0.625rem;  color: var(--text-secondary); white-space: nowrap;}@keyframes wordsFloat {  0%, 100% { opacity: 0; transform: translateX(-50%) translateY(0); }  30% { opacity: 1; transform: translateX(-50%) translateY(8px); }  70% { opacity: 1; transform: translateX(-50%) translateY(20px); }  90% { opacity: 0; transform: translateX(-50%) translateY(28px); }}.flow-reports {  position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);  display: flex; gap: 0.5rem; opacity: 0;  animation: reportsAppear 3s ease-in-out 1.8s infinite;}.flow-reports span {  background: rgba(34,197,94,0.1); border: 1px solid rgba(34,197,94,0.2);  padding: 0.25rem 0.5rem; border-radius: 6px; font-size: 0.625rem;  color: var(--success); white-space: nowrap;}@keyframes reportsAppear {  0%, 100% { opacity: 0; transform: translateX(-50%) translateY(10px); }  40% { opacity: 1; transform: translateX(-50%) translateY(0); }  80% { opacity: 1; transform: translateX(-50%) translateY(-4px); }  95% { opacity: 0; transform: translateX(-50%) translateY(-8px); }}.mobile-menu-open .nav-menu {  display: flex; flex-direction: column;  position: absolute; top: 72px; left: 0; right: 0;  background: var(--surface); padding: 1.5rem;  border-bottom: 1px solid var(--border); gap: 1rem;}.mobile-menu-open .main-nav { display: block; }.form-group { margin-bottom: 1rem; }.form-input,.form-textarea,.form-select {  width: 100%;  padding: 0.75rem 1rem;  background: var(--bg);  border: 1px solid var(--border);  border-radius: 12px;  color: var(--text-primary);  font-size: 0.9375rem;  outline: none;  transition: border-color 150ms ease;}.form-input::placeholder,.form-textarea::placeholder {  color: var(--text-muted);}.form-input:focus,.form-textarea:focus,.form-select:focus {  border-color: var(--cta);}.form-textarea {  min-height: 120px;  resize: vertical;}.form-select {  appearance: none;  cursor: pointer;  /* color-scheme lets the native <select> chrome (including the closed-state     text and the option list) render with dark-mode colors so the disabled     placeholder option meets WCAG contrast on the dark background. */  color-scheme: dark;  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");  background-repeat: no-repeat;  background-position: right 1rem center;  padding-right: 2.5rem;}.form-select option {  color: var(--text-primary);  background: var(--bg);}.form-success {  padding: 1.5rem;  background: rgba(34,197,94,0.08);  border: 1px solid rgba(34,197,94,0.2);  border-radius: var(--radius-lg);  text-align: center;}.form-success p {  color: var(--success);  font-size: 0.9375rem;}.text-center { text-align: center; }.mx-auto { margin-left: auto; margin-right: auto; }.mb-4 { margin-bottom: 1rem; }.mb-6 { margin-bottom: 1.5rem; }.mb-8 { margin-bottom: 2rem; }.mt-4 { margin-top: 1rem; }.mt-8 { margin-top: 2rem; }.max-w-xl { max-width: 36rem; }.max-w-2xl { max-width: 42rem; }.max-w-3xl { max-width: 48rem; }/* Pinned section */.section-divider {  border: none;  border-top: 1px solid var(--border);  margin: 2rem 0;}.glass-card.pinned {  border-left: 3px solid var(--accent);  background: var(--glass-bg);}/* ADR 0002 — Reusable patterns */.meta { color: var(--text-muted-on-glass); font-size: 0.875rem; margin-bottom: 0.5rem; }.lede { color: var(--text-secondary); font-size: 1.125rem; line-height: 1.75; }.accent { color: var(--cta-text); }.section-flush { padding-top: 0; }.glass-card table {  border-collapse: collapse;  width: 100%;  margin-bottom: 1.5rem;  font-size: 0.9375rem;}.glass-card th {  background: #1e293b;  color: #cbd5e1;  font-weight: 600;  text-align: left;  padding: 0.625rem 0.75rem;  border-bottom: 1px solid var(--border);}.glass-card th.sortable {  cursor: pointer;  user-select: none;  transition: color 150ms ease;  position: relative;  padding-right: 1.5rem;}.glass-card th.sortable:hover {  color: var(--text-primary);}.glass-card th.sortable::after {  content: '';  position: absolute;  right: 0.5rem;  top: 50%;  transform: translateY(-50%);  border-left: 4px solid transparent;  border-right: 4px solid transparent;  opacity: 0.3;}.glass-card th.sortable.asc::after {  border-bottom: 5px solid var(--cta);  opacity: 1;}.glass-card th.sortable.desc::after {  border-top: 5px solid var(--cta);  opacity: 1;}.glass-card td {  padding: 0.625rem 0.75rem;  border-bottom: 1px solid var(--border);  color: #cbd5e1;  background-color: #1e293b;}.glass-card tr:last-child td {  border-bottom: none;}.glass-card table code {  font-size: 0.875rem;}.glass-card [style*="color: var(--text-muted)"] {  color: var(--text-muted-on-glass) !important;}[style*="color: var(--cta-text)"] {  color: var(--cta-text) !important;}.glass-card p {  color: #cbd5e1;  line-height: 1.75;  margin-bottom: 1rem;}.glass-card ul,.glass-card ol {  padding-left: 1.5rem;  margin-bottom: 1.5rem;  line-height: 2.2;  color: #cbd5e1;}.glass-card ul {  list-style: disc;}.glass-card ol {  list-style: decimal;}.glass-card li {  margin-bottom: 0.25rem;  background-color: #1e293b;  color: #cbd5e1;}.glass-card blockquote {  border-left: 3px solid var(--cta);  margin: 1.5rem 0;  padding: 0.75rem 1.25rem;  background: var(--surface);  border-radius: 0 12px 12px 0;  color: var(--text-secondary);  font-style: italic;}.glass-card blockquote p {  margin-bottom: 0;}.glass-card h2 {  margin-top: 2.5rem;  margin-bottom: 1rem;}.glass-card h3 {  margin-top: 1.5rem;  margin-bottom: 0.5rem;  color: #f8fafc;}.glass-card h4 {  margin-top: 1.5rem;  margin-bottom: 0.5rem;  color: #f8fafc;}.glass-card hr {  border: none;  border-top: 1px solid var(--border);  margin: 2rem 0;}.code-block {  background: var(--surface);  border-radius: 12px;  padding: 1.25rem;  margin-bottom: 2rem;  border: 1px solid var(--border);  overflow-x: auto;}.code-block pre {  color: var(--text-primary);  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;  font-size: 0.9375rem;  white-space: pre-wrap;}.recipe-time {  color: var(--text-muted);  font-size: 0.9375rem;  margin-bottom: 1rem;}.glossary-term {  position: relative;  cursor: help;  border-bottom: 1px dotted var(--cta);  color: var(--cta);}.glossary-term::after {  content: attr(data-def);  position: absolute;  bottom: calc(100% + 10px);  left: 50%;  transform: translateX(-50%);  background: var(--surface);  border: 1px solid var(--border);  border-radius: 8px;  padding: 0.625rem 0.875rem;  font-size: 0.8125rem;  font-family: var(--font-body);  font-weight: 400;  color: var(--text-secondary);  line-height: 1.5;  width: 280px;  max-width: 90vw;  text-align: left;  white-space: normal;  opacity: 0;  pointer-events: none;  transition: opacity 180ms ease;  z-index: 100;  box-shadow: var(--shadow-lg);}.glossary-term:hover::after {  opacity: 1;}@media (pointer: coarse) {  .glossary-term {    border-bottom-style: solid;  }  .glossary-term::after {    display: none;  }}/* Mobile refinements — tighter spacing, smaller visuals */@media (max-width: 640px) {  .glass-card table,  .glass-card thead,  .glass-card tbody,  .glass-card th,  .glass-card td,  .glass-card tr {    display: block;  }  .glass-card thead,  .glass-card tr:first-child {    display: none;  }  .glass-card tr {    margin-bottom: 1rem;    border: 1px solid var(--border);    border-radius: 10px;    padding: 0.75rem;    background: var(--bg);  }  .glass-card td {    display: flex;    gap: 0.5rem;    padding: 0.375rem 0;    border: none;    font-size: 0.875rem;  }  .glass-card td::before {    content: attr(data-label);    font-weight: 600;    color: var(--cta);    min-width: 80px;    flex-shrink: 0;    font-size: 0.8125rem;  }  .section { padding-top: 3rem; padding-bottom: 3rem; }  .section-sm { padding-top: 2rem; padding-bottom: 2rem; }  .hero { padding-top: 3rem; padding-bottom: 3rem; }  .grid-2, .grid-3, .grid-4 { gap: 1rem; }  .hero-grid, .lead-magnet-grid, .contact-grid { gap: 1.5rem; }  .footer-grid { gap: 2rem; }  .glass-card { padding: 1.25rem; }  .lead-magnet-form { padding: 1.25rem; }  .automation-visual { height: 260px; }  .section-subtitle { font-size: 1rem; }  .step-number { width: 40px; height: 40px; font-size: 1rem; }  .service-icon { width: 48px; height: 48px; font-size: 1.25rem; margin-bottom: 1rem; }  .pricing-amount { font-size: 2rem; }  .pricing-card ul { font-size: 0.875rem; }  .hero-subtitle { font-size: 1rem; }  .footer-main { padding: 2.5rem 0; }}/* ADR 0002 — Focus & skip-link */:focus-visible {  outline: 2px solid var(--cta);  outline-offset: 2px;}/* Reduced motion — disable infinite hero animations and smooth scroll */@media (prefers-reduced-motion: reduce) {  html { scroll-behavior: auto; }  *, *::before, *::after {    animation-duration: 0.001ms !important;    animation-iteration-count: 1 !important;    transition-duration: 0.001ms !important;  }}.skip-link {  position: absolute;  top: -100%;  left: 0;  padding: 0.5rem 1rem;  background: var(--cta);  color: #fff;  z-index: 100;  font-family: var(--font-body);  font-weight: 600;}.skip-link:focus {  top: 0;}/* =============================================================   Admin portal — /admin.html   A reader over the static data/admin-status.json produced by   scripts/admin (cron). No secrets reach the browser.   ============================================================= */.admin-shell { min-height: 70vh; }.admin-title { font-size: clamp(2rem, 4vw, 2.75rem); margin-bottom: 0.25rem; }.admin-sub { margin: 0; }.admin-h2 { font-size: 1.25rem; margin: 2.5rem 0 1rem; }.admin-muted { color: var(--text-muted); font-size: 0.875rem; }.admin-foot { margin-top: 2rem; }.admin-head {  display: flex; align-items: flex-start; justify-content: space-between;  gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem;}.btn-sm {  padding: 0.5rem 1rem; font-size: 0.875rem; border-radius: 10px;  border: 1px solid var(--glass-border); background: var(--glass-bg);  cursor: pointer; transition: transform 120ms ease, background 120ms ease;}.btn-sm:hover { transform: translateY(-1px); background: var(--surface-light); }/* summary cards */.admin-summary .stat-card {  padding: 1.25rem 1.5rem; border-radius: var(--radius-lg);  display: flex; flex-direction: column; gap: 0.25rem;}.stat-value {  font-family: var(--font-header); font-weight: 800; font-size: 2rem;  color: var(--text-primary); line-height: 1;}.stat-label { color: var(--text-muted); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; }/* agent chips */.admin-agents { margin-bottom: 0.5rem; }.agent-chip {  display: flex; align-items: center; gap: 0.75rem;  padding: 0.875rem 1.25rem; border-radius: var(--radius-lg);  border: 1px solid var(--glass-border);}.agent-chip .pulse {  width: 10px; height: 10px; border-radius: 50%;  background: var(--status-idle); flex-shrink: 0;}.agent-chip.is-active .pulse {  background: var(--status-ok);  box-shadow: 0 0 0 0 rgba(34,197,94,0.6);  animation: admin-pulse 1.6s infinite;}.agent-chip.is-active { border-color: rgba(34,197,94,0.4); }.agent-name { font-weight: 600; }.agent-state { color: var(--text-secondary); font-size: 0.875rem; margin-left: auto; }@keyframes admin-pulse {  0% { box-shadow: 0 0 0 0 rgba(34,197,94,0.5); }  70% { box-shadow: 0 0 0 8px rgba(34,197,94,0); }  100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); }}/* repo grid */.admin-repos { display: grid; gap: 1rem; grid-template-columns: 1fr; }@media (min-width: 768px) { .admin-repos { grid-template-columns: repeat(2, 1fr); } }@media (min-width: 1200px) { .admin-repos { grid-template-columns: repeat(3, 1fr); } }.repo-card {  padding: 1.25rem; border-radius: var(--radius-lg);  border: 1px solid var(--glass-border);  display: flex; flex-direction: column; gap: 0.75rem;  background: var(--glass-bg);}.repo-head { display: flex; align-items: center; gap: 0.5rem; justify-content: space-between; }.repo-name { font-family: var(--font-header); font-weight: 700; font-size: 1.05rem; word-break: break-all; }.repo-name:hover { color: var(--accent); }.repo-vis {  font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em;  padding: 0.15rem 0.5rem; border-radius: 999px;  border: 1px solid var(--glass-border); color: var(--text-muted);  flex-shrink: 0;}.vis-private { color: var(--status-warn); border-color: rgba(234,179,8,0.3); }.vis-public { color: var(--status-ok); border-color: rgba(34,197,94,0.3); }.repo-desc { font-size: 0.85rem; margin: 0; }.repo-road-row { display: flex; justify-content: space-between; font-size: 0.8rem; margin-bottom: 0.35rem; }.repo-road-label { color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.04em; }.repo-road-pct { font-weight: 700; }.bar {  width: 100%; height: 6px; border-radius: 999px;  background: rgba(255,255,255,0.08); overflow: hidden;}.bar-fill {  display: block; height: 100%; border-radius: 999px;  background: linear-gradient(90deg, var(--status-warn), var(--status-ok));  transition: width 400ms ease;}.repo-gates { display: flex; flex-wrap: wrap; gap: 0.4rem; }.repo-gates-empty { font-size: 0.8rem; }.gate {  display: inline-flex; align-items: center; gap: 0.35rem;  padding: 0.25rem 0.6rem; border-radius: 999px;  font-size: 0.75rem; font-weight: 600;  border: 1px solid var(--glass-border); background: rgba(0,0,0,0.2);  transition: transform 100ms ease;}.gate:hover { transform: translateY(-1px); }.gate-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--status-idle); }.gate-ok { color: var(--status-ok); border-color: rgba(34,197,94,0.35); }.gate-ok .gate-dot { background: var(--status-ok); }.gate-bad { color: var(--status-bad); border-color: rgba(239,68,68,0.35); }.gate-bad .gate-dot { background: var(--status-bad); }.gate-running { color: var(--status-info); border-color: rgba(56,189,248,0.35); }.gate-running .gate-dot { background: var(--status-info); animation: admin-pulse 1s infinite; }.gate-idle, .gate-unknown { color: var(--status-idle); }.repo-foot {  font-size: 0.8rem; display: flex; flex-wrap: wrap; gap: 0.5rem;  border-top: 1px solid var(--border); padding-top: 0.6rem; margin-top: auto;}.repo-foot a { color: var(--accent); }.repo-foot a:hover { text-decoration: underline; }.repo-prs { color: var(--status-warn) !important; }.repo-building { color: var(--status-info); }.mono { font-family: ui-monospace, 'SF Mono', Consolas, monospace; font-size: 0.78rem; }@media (prefers-reduced-motion: reduce) {  .agent-chip.is-active .pulse,  .gate-running .gate-dot { animation: none; }}