/* InfuseAI · Daybreak skin for the live React site.
 * Ports the marketing.infuseai.agency look (warm sand, ink, ocean-teal, dawn gold,
 * Bricolage Grotesque / Inter Tight / Space Mono) onto the compiled Tailwind/shadcn build.
 * Loaded after index-*.css, so it overrides by cascade order — no source needed.
 * Content, routes and markup are untouched. */

/* ---------- tokens (shadcn HSL triplets) ---------- */
:root {
  --background: 37 42% 94%;          /* paper */
  --foreground: 32 21% 11%;          /* ink */
  --card: 40 50% 97%;
  --card-foreground: 32 21% 11%;
  --popover: 40 50% 97%;
  --popover-foreground: 32 21% 11%;
  --primary: 192 100% 29%;           /* ocean-teal */
  --primary-foreground: 40 50% 96%;
  --secondary: 32 21% 11%;           /* ink — primary CTAs */
  --secondary-foreground: 40 50% 96%;
  --muted: 38 35% 90%;               /* paper-2 */
  --muted-foreground: 34 6% 38%;
  --accent: 194 64% 89%;             /* teal tint */
  --accent-foreground: 32 21% 11%;
  --border: 37 13% 80%;
  --input: 37 13% 80%;
  --ring: 192 100% 34%;
  --radius: .875rem;
  --font-sans: "Inter Tight", system-ui, sans-serif;
  --font-display: "Bricolage Grotesque", "Inter Tight", system-ui, sans-serif;
  --font-mono: "Space Mono", ui-monospace, monospace;

  --db-gold: #ddb95b;
  --db-gold-soft: #e9d08a;
  --db-on-media: #f9f6ef;
  --db-on-media-2: #ddd8ce;
  --db-ink: #211b15;
  --db-accent: #007694;
  --db-accent-2: #006180;
  --db-ease: cubic-bezier(.16, 1, .3, 1);
}

body { font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, .font-display { font-family: var(--font-display); letter-spacing: -.02em; font-style: normal; }
h1 { font-weight: 800; letter-spacing: -.03em; }
::selection { background: hsl(194 64% 85%); color: var(--db-ink); }

/* ---------- retire the hard-coded hospital blues ---------- */
.text-blue-400, .text-blue-500, .text-blue-600, .text-blue-700, .text-blue-800 { color: var(--db-accent) !important; }
.bg-blue-50, .bg-blue-100 { background-color: hsl(194 64% 92%) !important; }
.bg-blue-400, .bg-blue-500, .bg-indigo-500 { background-color: var(--db-accent) !important; }
.border-blue-100, .border-blue-200 { border-color: hsl(194 40% 82%) !important; }
.from-blue-800 { --tw-gradient-from: var(--db-accent-2) var(--tw-gradient-from-position) !important; --tw-gradient-to: rgb(0 97 128 / 0) var(--tw-gradient-to-position) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.to-blue-400 { --tw-gradient-to: var(--db-accent) var(--tw-gradient-to-position) !important; }
[class*="rgba(59,130,246"] { box-shadow: 0 1px 0 hsl(37 20% 82%), 0 14px 34px -18px rgb(33 27 21 / .28) !important; }
[class*="rgba(59,130,246"]:hover { box-shadow: 0 1px 0 hsl(37 20% 78%), 0 22px 44px -18px rgb(33 27 21 / .36) !important; }

/* ---------- surfaces: warmer cards, no blue wash ---------- */
.shadcn-card, .rounded-2xl.border, .rounded-xl.border { border-color: hsl(37 13% 82%); }
[class*="bg-primary/10"]:not(:is(.w-8,.w-10,.w-12,.w-14,.w-16)) { background-color: hsl(40 50% 97%) !important; }
/* icon tiles: solid teal, light glyph */
[class*="bg-primary/10"]:is(.w-8,.w-10,.w-12,.w-14,.w-16) { background-color: var(--db-accent) !important; color: var(--db-on-media) !important; }
[class*="border-primary/30"], [class*="border-primary/20"] { border-color: hsl(37 13% 80%) !important; }
section.bg-muted, section[class*="bg-muted/"], section.bg-secondary\/5 { background-color: hsl(38 35% 90%); }

/* ---------- buttons: pills ---------- */
button[class*="rounded-xl"], button[class*="rounded-lg"], a[class*="rounded-md"][class*="hover-elevate"],
button[class*="rounded-md"][class*="hover-elevate"] { border-radius: 100px !important; }
button[class*="bg-secondary"] { box-shadow: none !important; transition: background-color .18s var(--db-ease), transform .12s var(--db-ease) !important; }
button[class*="bg-secondary"]:hover { background-color: var(--db-accent-2) !important; transform: none !important; }
button[class*="bg-white"][class*="border"] { background: transparent !important; }
button[class*="bg-white"][class*="border"]:hover { background: hsl(38 35% 90%) !important; }

/* ---------- nav: floating glass pill ---------- */
nav[aria-label="Main navigation"] {
  top: 14px; left: 50%; width: min(calc(100% - 24px), 1240px); transform: translateX(-50%) !important;
  border: 1px solid rgb(33 27 21 / .1) !important; border-radius: 100px;
  background: rgb(250 247 241 / .74) !important; backdrop-filter: blur(16px) saturate(1.3);
  box-shadow: 0 10px 30px -18px rgb(33 27 21 / .35);
}
nav[aria-label="Main navigation"] > div { padding-inline: 10px 8px 10px 22px; }
nav[aria-label="Main navigation"] > div > div { height: 60px; }
nav[aria-label="Main navigation"] [data-testid="link-logo"] span { font-family: var(--font-display); font-weight: 800; letter-spacing: -.01em; text-transform: uppercase; font-size: 1.15rem; }
nav[aria-label="Main navigation"] [data-testid="button-nav-contact"] { background: var(--db-accent); box-shadow: none; padding: .75rem 1.3rem; }
nav[aria-label="Main navigation"] [data-testid="button-nav-contact"]:hover { background: var(--db-accent-2); transform: none; }
/* mobile menu sheet hangs off the pill */
#mobile-menu { border-radius: 22px; margin-top: 8px; }

/* ---------- homepage hero: cinematic plate ---------- */
main > section:first-child:has([data-testid="text-location-signal"]) {
  isolation: isolate; min-height: 92svh; display: flex; align-items: flex-end;
  padding-top: 8.5rem; padding-bottom: 4.5rem;
  color: var(--db-on-media);
}
main > section:first-child:has([data-testid="text-location-signal"])::before {
  content: ""; position: absolute; z-index: -2; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%);
  background: #2a2119 url("/images/hero-daybreak.jpg") center / cover no-repeat;
}
main > section:first-child:has([data-testid="text-location-signal"])::after {
  content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%);
  background:
    linear-gradient(90deg, rgb(28 22 16 / .78) 0%, rgb(28 22 16 / .42) 48%, transparent 80%),
    linear-gradient(0deg, rgb(24 19 14 / .8) 0%, rgb(24 19 14 / .14) 42%, transparent 70%);
}
main > section:first-child:has([data-testid="text-location-signal"]) > .absolute { display: none; }
main > section:first-child:has([data-testid="text-location-signal"]) .max-w-3xl { max-width: 780px; }
/* kicker: mono, gold */
main > section:first-child:has([data-testid="text-location-signal"]) span.rounded-full {
  background: none; padding: 0; border-radius: 0; color: #ecd593;
  font-family: var(--font-mono); font-weight: 400; font-size: .76rem; letter-spacing: .14em; text-transform: uppercase;
}
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="text-location-signal"] {
  color: var(--db-on-media-2); font-family: var(--font-mono); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase;
}
main > section:first-child:has([data-testid="text-location-signal"]) h1 {
  color: var(--db-on-media); font-size: clamp(2.5rem, 5.6vw, 4.6rem); line-height: 1.02;
}
main > section:first-child:has([data-testid="text-location-signal"]) h1 .text-primary { color: #e3cf86; }
main > section:first-child:has([data-testid="text-location-signal"]) h1 + p { color: var(--db-on-media-2); max-width: 46ch; font-size: clamp(1.08rem, 1.5vw, 1.3rem); }
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="button-schedule-consultation"] {
  background: var(--db-on-media) !important; color: var(--db-ink) !important; font-size: 1rem; padding: 1rem 1.6rem; box-shadow: none;
}
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="button-schedule-consultation"]:hover { background: #fff !important; }
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="button-view-smart-websites"] {
  background: transparent !important; color: var(--db-on-media); border-color: rgb(249 246 239 / .5); font-size: 1rem; padding: 1rem 1.6rem;
}
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="button-view-smart-websites"]:hover { background: rgb(249 246 239 / .12) !important; }
/* voice demo card: glass on the plate */
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="section-voice-demo"] {
  background: rgb(250 247 241 / .1) !important; border-color: rgb(250 247 241 / .22) !important;
  backdrop-filter: blur(14px) saturate(1.2); color: var(--db-on-media); border-radius: 22px;
}
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="section-voice-demo"] h3 { color: var(--db-on-media); }
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="section-voice-demo"] p { color: var(--db-on-media-2); }
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="section-voice-demo"] .bg-primary\/20 { background: rgb(227 207 134 / .18); color: #e3cf86; }
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="button-call-voice-demo"] { background: var(--db-accent); border-color: transparent; }
main > section:first-child:has([data-testid="text-location-signal"]) [data-testid="link-learn-voice-demo"] { color: var(--db-on-media); border-color: rgb(249 246 239 / .4); }

/* ---------- interior-page headings & eyebrows ---------- */
main h2 { font-weight: 700; }
.text-primary { color: hsl(192 100% 29%); }

/* ---------- footer: ink band like the marketing site ---------- */
footer { background: var(--db-ink) !important; color: var(--db-on-media-2) !important; border-top: 0 !important; }
footer h2, footer h3, footer h4, footer .text-foreground { color: var(--db-on-media) !important; }
footer .text-muted-foreground, footer p, footer li, footer span { color: #b9b2a6 !important; }
footer a:hover, footer a:hover span { color: var(--db-gold-soft) !important; }
footer .border-border, footer [class*="border-t"] { border-color: rgb(249 246 239 / .12) !important; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }