/*
 * colors.css — CurbApps color system
 * Color space: OKLCH. Palette: Zinc neutrals + Amber/Copper accent.
 * Raw scale values are stored as bare OKLCH components for use with oklch().
 */

:root {
  /* ---- Zinc neutrals (pavement) ---- */
  --zinc-50: 0.985 0 0; /* @kind color */
  --zinc-100: 0.967 0.001 286.375; /* @kind color */
  --zinc-200: 0.92 0.004 286.32; /* @kind color */
  --zinc-300: 0.871 0.006 286.286; /* @kind color */
  --zinc-400: 0.705 0.015 286.067; /* @kind color */
  --zinc-500: 0.552 0.016 285.938; /* @kind color */
  --zinc-600: 0.442 0.017 285.786; /* @kind color */
  --zinc-700: 0.37 0.013 285.805; /* @kind color */
  --zinc-800: 0.274 0.006 286.033; /* @kind color */
  --zinc-900: 0.21 0.006 285.885; /* @kind color */
  --zinc-950: 0.141 0.005 285.823; /* @kind color */

  /* ---- Amber / Copper accent ---- */
  --amber-50: 0.987 0.022 95.277; /* @kind color */
  --amber-100: 0.962 0.059 95.617; /* @kind color */
  --amber-200: 0.924 0.12 95.746; /* @kind color */
  --amber-300: 0.879 0.169 91.605; /* @kind color */
  --amber-400: 0.828 0.189 84.429; /* @kind color */
  --amber-500: 0.769 0.188 70.08; /* @kind color */
  --amber-600: 0.666 0.179 58.318; /* @kind color */
  --amber-700: 0.555 0.163 48.998; /* @kind color */
  --amber-800: 0.473 0.137 46.201; /* @kind color */
  --amber-900: 0.414 0.112 45.904; /* @kind color */
  --amber-950: 0.279 0.077 45.635; /* @kind color */

  /* ---- Orange (secondary warm) ---- */
  --orange-400: 0.75 0.183 55.934; /* @kind color */
  --orange-500: 0.705 0.213 47.604; /* @kind color */
  --orange-600: 0.646 0.222 41.116; /* @kind color */

  /* ---- Yellow (warning warm) ---- */
  --yellow-400: 0.852 0.199 91.936; /* @kind color */
  --yellow-500: 0.795 0.184 86.047; /* @kind color */

  /* ---- Ready-to-use convenience aliases (full oklch()) ---- */
  --color-primary: oklch(0.75 0.18 75);          /* signature gold */
  --color-accent: oklch(var(--amber-500));
  --color-ink: oklch(var(--zinc-900));
  --color-pavement: oklch(var(--zinc-50));
  --color-asphalt: oklch(var(--zinc-950));

  /* ---- Semantic tokens — LIGHT (default) ---- */
  --radius: 0rem;                                 /* sharp curb corners */
  --background: oklch(0.985 0 0);                 /* pavement silver */
  --foreground: oklch(0.21 0.006 285.885);        /* zinc-900 */
  --card: oklch(0.967 0.001 286.375);             /* zinc-100 */
  --card-foreground: oklch(0.21 0.006 285.885);
  --popover: oklch(0.967 0.001 286.375);
  --popover-foreground: oklch(0.21 0.006 285.885);
  --primary: oklch(0.75 0.18 75);           /* amber-600 */
  --primary-foreground: oklch(0.21 0.006 285.885); /* ink on gold */
  --secondary: oklch(0.92 0.004 286.32);          /* zinc-200 */
  --secondary-foreground: oklch(0.21 0.006 285.885);
  --muted: oklch(0.92 0.004 286.32);
  --muted-foreground: oklch(0.552 0.016 285.938); /* zinc-500 */
  --accent: oklch(0.80 0.165 76);                 /* light gold */
  --accent-foreground: oklch(0.141 0.005 285.823);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.985 0 0);
  --success: oklch(0.62 0.13 162);
  --warning: oklch(0.70 0.155 62);                /* gold-copper caution — same warm line as primary */
  --info: oklch(0.55 0.12 245);
  --border: oklch(0.92 0.004 286.32);
  --input: oklch(0.92 0.004 286.32);
  --ring: oklch(0.75 0.18 75);

  /* Warm gold→copper line. Charts stay a single-hue gold ramp; cool steps come last. */
  --chart-1: oklch(0.75 0.18 75);  /* copper */
  --chart-2: oklch(0.79 0.165 72);       /* gold */
  --chart-3: oklch(0.55 0.155 50);       /* deep copper */
  --chart-4: oklch(0.62 0.13 162);       /* green */
  --chart-5: oklch(0.55 0.12 245);       /* blue */

  /* ---- Sidebar — LIGHT ---- */
  --sidebar: oklch(0.967 0.001 286.375);
  --sidebar-foreground: oklch(0.21 0.006 285.885);
  --sidebar-primary: oklch(0.75 0.18 75);
  --sidebar-primary-foreground: oklch(0.21 0.006 285.885);
  --sidebar-accent: oklch(0.769 0.188 70.08);
  --sidebar-accent-foreground: oklch(0.141 0.005 285.823);
  --sidebar-border: oklch(0.92 0.004 286.32);
  --sidebar-ring: oklch(0.75 0.18 75);

  --selection-background-color: oklch(0.769 0.188 70.08 / 0.7);
}

/* ---- Semantic tokens — DARK (the product's home turf) ---- */
.dark {
  --radius: 0rem;
  --background: oklch(0.141 0.005 285.823);        /* zinc-950 pavement */
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.21 0.006 285.885);               /* zinc-900 */
  --card-foreground: oklch(0.967 0.001 286.375);
  --popover: oklch(0.21 0.006 285.885);
  --popover-foreground: oklch(0.967 0.001 286.375);
  --primary: oklch(0.82 0.18 76);            /* amber-400 — brighter on dark */
  --primary-foreground: oklch(0.141 0.005 285.823);
  --secondary: oklch(0.274 0.006 286.033);         /* zinc-800 */
  --secondary-foreground: oklch(0.967 0.001 286.375);
  --muted: oklch(0.274 0.006 286.033);
  --muted-foreground: oklch(0.705 0.015 286.067);
  --accent: oklch(0.769 0.188 70.08);              /* amber-500 */
  --accent-foreground: oklch(0.141 0.005 285.823);
  --destructive: oklch(0.704 0.191 22.216);
  --destructive-foreground: oklch(0.985 0 0);
  --success: oklch(0.74 0.14 162);
  --warning: oklch(0.80 0.155 64);
  --info: oklch(0.70 0.12 245);
  --border: oklch(1 0 0 / 0.12);
  --input: oklch(1 0 0 / 0.15);
  --ring: oklch(0.82 0.18 76);

  --chart-1: oklch(0.82 0.18 76);   /* gold */
  --chart-2: oklch(0.70 0.165 58);  /* copper */
  --chart-3: oklch(0.60 0.15 50);   /* deep copper */
  --chart-4: oklch(0.74 0.14 162);  /* green */
  --chart-5: oklch(0.70 0.12 245);  /* blue */

  --sidebar: oklch(0.21 0.006 285.885);
  --sidebar-foreground: oklch(0.967 0.001 286.375);
  --sidebar-primary: oklch(0.82 0.18 76);
  --sidebar-primary-foreground: oklch(0.141 0.005 285.823);
  --sidebar-accent: oklch(0.75 0.18 75);
  --sidebar-accent-foreground: oklch(0.141 0.005 285.823);
  --sidebar-border: oklch(1 0 0 / 0.12);
  --sidebar-ring: oklch(0.82 0.18 76);

  --selection-background-color: oklch(0.828 0.189 84.429 / 0.55);
}

::selection { background-color: var(--selection-background-color); }

/*
 * spacing.css — CurbApps spacing & sizing scale (4px base grid)
 */

:root {
  --space-0: 0;
  --space-px: 1px;
  --space-0-5: 0.125rem; /* 2 */
  --space-1: 0.25rem;    /* 4 */
  --space-1-5: 0.375rem; /* 6 */
  --space-2: 0.5rem;     /* 8 */
  --space-2-5: 0.625rem; /* 10 */
  --space-3: 0.75rem;    /* 12 */
  --space-4: 1rem;       /* 16 */
  --space-5: 1.25rem;    /* 20 */
  --space-6: 1.5rem;     /* 24 */
  --space-8: 2rem;       /* 32 */
  --space-10: 2.5rem;    /* 40 */
  --space-12: 3rem;      /* 48 */
  --space-16: 4rem;      /* 64 */
  --space-20: 5rem;      /* 80 */
  --space-24: 6rem;      /* 96 */
  --space-32: 8rem;      /* 128 */

  /* Layout */
  --container-max: 1366px;
  --header-height: 56px;
  --sidebar-width: 256px;
  --sidebar-width-collapsed: 56px;

  /* Control sizes (heights) */
  --control-sm: 2rem;    /* 32 */
  --control-md: 2.25rem; /* 36 */
  --control-lg: 2.5rem;  /* 40 */
}

/*
 * effects.css — CurbApps radius, shadow, motion & surface treatments
 * Signature: radius is ZERO. CurbApps is a square-cornered, "curb-edge" system.
 * Depth comes from hairline borders + low, tight shadows — never large blur.
 */

:root {
  /* Radius — the curb is sharp. Keep these for the rare pill (OTP chips, avatars). */
  --radius: 0rem;
  --radius-sm: 0rem;
  --radius-md: 0rem;
  --radius-lg: 0rem;
  --radius-pill: 9999px;   /* only for avatars & status dots */

  /* Shadows — subtle, functional. Buttons get xs, popovers/cards get sm/md. */
  --shadow-2xs: 0 1px 0 0 oklch(0 0 0 / 0.04);
  --shadow-xs: 0 1px 2px 0 oklch(0 0 0 / 0.08);
  --shadow-sm: 0 1px 3px 0 oklch(0 0 0 / 0.10), 0 1px 2px -1px oklch(0 0 0 / 0.10);
  --shadow-md: 0 4px 6px -1px oklch(0 0 0 / 0.10), 0 2px 4px -2px oklch(0 0 0 / 0.10);
  --shadow-lg: 0 10px 15px -3px oklch(0 0 0 / 0.12), 0 4px 6px -4px oklch(0 0 0 / 0.10);

  /* Focus ring */
  --ring-width: 1px;
  --ring-offset: 1px;

  /* Motion */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --ease-out: cubic-bezier(0, 0, 0.2, 1); /* @kind other */
  --duration-fast: 120ms; /* @kind other */
  --duration-base: 200ms; /* @kind other */
  --duration-slow: 350ms; /* @kind other */

  /* Grid backdrop (marketing/empty states) */
  --grid-line-light: oklch(0.875 0.006 286.32 / 0.5);
  --grid-line-dark: oklch(1 0 0 / 0.06);
  --grid-size: 45px;
}

@keyframes curb-fade-up {
  0% { opacity: 0; transform: translateY(10px); }
  80% { opacity: 0.6; }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes curb-fade-down {
  0% { opacity: 0; transform: translateY(-10px); }
  80% { opacity: 0.6; }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes curb-shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* Signature surface helpers (used across kits & cards) */
.curb-grid-bg {
  background-color: var(--background);
  background-image:
    linear-gradient(to right, var(--grid-line-light) 1px, transparent 1px),
    linear-gradient(to bottom, var(--grid-line-light) 1px, transparent 1px);
  background-size: var(--grid-size) var(--grid-size);
}
.dark .curb-grid-bg {
  background-image:
    linear-gradient(to right, var(--grid-line-dark) 1px, transparent 1px),
    linear-gradient(to bottom, var(--grid-line-dark) 1px, transparent 1px);
}

/* Gold glow blob — premium hero accent */
.curb-glow-gold {
  position: absolute;
  background: radial-gradient(ellipse at center, oklch(0.75 0.15 70 / 0.22), transparent 70%);
  filter: blur(80px);
  pointer-events: none;
  z-index: 0;
}

/* Shimmer text — chrome/silver hero treatment */
.curb-shimmer-text {
  background: linear-gradient(90deg, #6b7280 0%, #9ca3af 20%, #e5e7eb 50%, #9ca3af 80%, #6b7280 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: curb-shimmer 5s ease-in-out infinite;
}
.dark .curb-shimmer-text {
  background: linear-gradient(90deg, #4b5563 0%, #9ca3af 20%, #f3f4f6 50%, #9ca3af 80%, #4b5563 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

html { scroll-behavior: smooth; }
    body { margin: 0; background: #100D09; color: #F3EFE8; font-family: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
    ::selection { background: rgba(232,163,61,0.55); color: #100D09; }
    ::-webkit-scrollbar { width: 10px; }
    ::-webkit-scrollbar-track { background: #0C0A07; }
    ::-webkit-scrollbar-thumb { background: rgba(232,163,61,0.2); border-radius: 999px; }
    @keyframes cs-dash { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -240; } }
    @keyframes cs-dash-slow { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -120; } }
    @keyframes cs-draw { from { stroke-dashoffset: 1400; } to { stroke-dashoffset: 0; } }
    @keyframes cs-node-pulse { 0%,100% { opacity: 0.5; transform: scale(1); } 50% { opacity: 1; transform: scale(1.35); } }
    @keyframes cs-glow-drift { 0%,100% { transform: translate(0,0); opacity: 0.8; } 50% { transform: translate(-40px,24px); opacity: 1; } }
    @keyframes cs-shimmer { 0%, 88%, 100% { background-position: -220% 0; } 34%, 60% { background-position: 220% 0; } }
    @keyframes cs-radar { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
      html { scroll-behavior: auto; }
    }

/* generated :hover/:focus rules (from style-hover) */
.dc-hover-0:hover{color:#E8A33D}
.dc-hover-1:hover{background:#F0B558}
.dc-hover-2:hover{background:#F0B558;box-shadow:0 10px 40px rgba(232,163,61,0.4)}
.dc-hover-3:hover{border-color:#E8A33D;color:#E8A33D}
.dc-hover-4:hover{transform:translateY(-4px)}
.dc-hover-5:hover{border-color:rgba(232,163,61,0.45)}
.dc-hover-6:hover{background:#191309}
.dc-hover-7:hover{transform:translateY(-4px);border-color:rgba(232,163,61,0.55)}


/* newsletter form (was inline) */
.cs-newsletter .listmonk-form{display:flex;flex-direction:column;gap:12px;max-width:420px;margin:0 auto;text-align:left}.cs-newsletter .cs-field{width:100%;background:rgba(243,239,232,0.04);border:1px solid rgba(243,239,232,0.14);color:#F3EFE8;font-family:'IBM Plex Sans',sans-serif;font-size:15px;padding:14px 18px;box-sizing:border-box;outline:none}.cs-newsletter .cs-field::placeholder{color:rgba(243,239,232,0.38)}.cs-newsletter .cs-field:focus{border-color:#E8A33D;box-shadow:0 0 0 1px rgba(232,163,61,0.35)}.cs-newsletter .cs-submit{background:#E8A33D;color:#100D09;border:none;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:15px;letter-spacing:0.02em;padding:15px 32px;cursor:pointer;box-shadow:0 8px 32px rgba(232,163,61,0.22);transition:background 0.2s ease,box-shadow 0.2s ease}.cs-newsletter .cs-submit:hover{background:#F0B558;box-shadow:0 10px 40px rgba(232,163,61,0.38)}.cs-newsletter .cs-submit:disabled{opacity:0.45;cursor:not-allowed;box-shadow:none}

.cs-contact-dialog{width:min(620px,calc(100vw - 40px));max-width:none;padding:0;border:1px solid rgba(232,163,61,0.36);background:#100D09;color:#F3EFE8;box-shadow:0 28px 90px rgba(0,0,0,0.65);overflow:visible}.cs-contact-dialog::backdrop{background:rgba(5,4,3,0.78);backdrop-filter:blur(7px)}.cs-contact-dialog[open]{animation:cs-contact-enter 0.24s cubic-bezier(0,0,0.2,1)}.cs-contact-panel{position:relative}.cs-contact-route-line{height:3px;background:repeating-linear-gradient(90deg,#E8A33D 0 28px,transparent 28px 56px);opacity:0.72}.cs-contact-body,.cs-contact-success{padding:34px}.cs-contact-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.cs-contact-kicker{margin-bottom:10px;color:#B8792A;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.22em;text-transform:uppercase}.cs-contact-title{margin:0;color:#F3EFE8;font-family:'Space Grotesk',sans-serif;font-size:clamp(27px,4vw,34px);font-weight:700;line-height:1.1;letter-spacing:-0.025em}.cs-contact-intro{max-width:470px;margin:11px 0 26px;color:rgba(243,239,232,0.6);font-size:14px;line-height:1.6}.cs-contact-close{flex:0 0 38px;width:38px;height:38px;padding:0;border:1px solid rgba(243,239,232,0.18);background:transparent;color:#C9CDD2;font-size:24px;line-height:1;cursor:pointer}.cs-contact-close:hover,.cs-contact-close:focus-visible{border-color:#E8A33D;color:#E8A33D;outline:none}.cs-contact-form{display:flex;flex-direction:column;gap:16px}.cs-contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px}.cs-contact-label{display:flex;flex-direction:column;gap:7px;color:rgba(243,239,232,0.62);font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:0.12em;text-transform:uppercase}.cs-contact-label span{color:rgba(243,239,232,0.34)}.cs-contact-wide{grid-column:1/-1}.cs-contact-field{box-sizing:border-box;width:100%;padding:13px 15px;border:1px solid rgba(243,239,232,0.14);border-radius:0;background:rgba(243,239,232,0.04);color:#F3EFE8;font-family:'IBM Plex Sans',sans-serif;font-size:15px;line-height:1.4;outline:none}.cs-contact-field::placeholder{color:rgba(243,239,232,0.32)}.cs-contact-field:focus{border-color:#E8A33D;box-shadow:0 0 0 1px rgba(232,163,61,0.32)}.cs-contact-message{min-height:116px;resize:vertical}.cs-contact-turnstile{min-height:1px}.cs-contact-actions{display:flex;align-items:center;justify-content:space-between;gap:20px}.cs-contact-status{margin:0;color:rgba(243,239,232,0.46);font-family:'IBM Plex Mono',monospace;font-size:10px;line-height:1.5;letter-spacing:0.09em;text-transform:uppercase}.cs-contact-status[data-state="error"]{color:#F0B558}.cs-contact-submit{flex:0 0 auto;padding:14px 24px;border:0;border-radius:0;background:#E8A33D;color:#100D09;font-family:'Space Grotesk',sans-serif;font-size:14px;font-weight:600;cursor:pointer;box-shadow:0 8px 30px rgba(232,163,61,0.22)}.cs-contact-submit:hover{background:#F0B558}.cs-contact-submit:disabled{opacity:0.45;cursor:not-allowed;box-shadow:none}.cs-contact-success{text-align:left}.cs-contact-success .cs-contact-submit{margin-top:4px}@keyframes cs-contact-enter{from{opacity:0;transform:translateY(16px) scale(0.985)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width:780px){.cs-contact-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);margin:10px}.cs-contact-body,.cs-contact-success{padding:26px 20px}.cs-contact-fields{grid-template-columns:1fr}.cs-contact-wide{grid-column:auto}.cs-contact-actions{align-items:stretch;flex-direction:column}.cs-contact-submit{width:100%}}@media (prefers-reduced-motion:reduce){.cs-contact-dialog[open]{animation:none}}