/* BaizoTech's own interpretation of the DeepEvolutions field design language. */
:root {
  --paper: #f1efe8;
  --paper-2: #e8e7e2;
  --ink: #171a1c;
  --muted: #61676b;
  --line: #c9c7c0;
  --forest: #243140;
  --sage: #637d95;
  --mist: #a8bdcc;
  --blue: #1855bf;
}

body { background: var(--paper); }
:focus-visible { outline: 3px solid #4fa9b9; outline-offset: 4px; }
::selection { color: #142535; background: #b9d5e6; }

.nav-glass {
  border-color: rgba(255,255,255,.78);
  border-radius: 17px;
  background: rgba(248,249,247,.76);
  box-shadow: 0 12px 36px rgba(22,36,50,.08), inset 0 1px rgba(255,255,255,.92);
}
.brand strong, .footer-brand { color: #202b35; }
.brand small, .eyebrow, .hero-footnote { color: #667c8e; }
.main-nav a { color: #52616c; }
.main-nav a:hover, .main-nav a[aria-current=page] { color: #1855bf; background: rgba(99,125,149,.1); }
.nav-contact, .button-dark { background: #243140; }
.nav-contact:hover, .button-dark:hover { background: #345370; }
.button-ghost { color: #243140; border-color: #a6b2c1; background: rgba(255,255,255,.52); }
.button-ghost:hover { border-color: #637d95; background: #fff; }
.text-link { color: #315a7a; border-color: #8da7b8; transition: gap 260ms cubic-bezier(.22,1,.36,1), color 260ms; }
.text-link:hover { color: #1855bf; }
.pulse, .status-dot { background: #637d95; box-shadow: 0 0 0 4px rgba(99,125,149,.14); }
.eyebrow-line { background: #8da4b4; }

.home-hero {
  isolation: isolate;
  background:
    radial-gradient(ellipse at 77% 38%, rgba(168,189,204,.3), transparent 38%),
    linear-gradient(115deg, #f5f3ed 0%, #e9eceb 100%);
}
.home-hero::before { background: #b6cbd7; opacity: .3; }
.home-hero::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: .48;
  background-image: linear-gradient(rgba(85,112,134,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(85,112,134,.08) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(90deg, transparent 15%, #000 100%);
}
.hero-copy h1 { color: #171a1c; }
.hero-copy h1 em { color: #637d95; }
.hero-copy>p, .page-hero p { color: #53616d; }
.hero-art { --art-x: 0px; --art-y: 0px; }
.hero-glow { background: conic-gradient(from 20deg,#98b4c8,#d0dce2,#c7b2ba,#a8bdcc,#98b4c8); opacity: .34; }
.hero-art-frame {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 23px;
  background: linear-gradient(145deg,rgba(255,255,255,.7),rgba(226,235,240,.38));
  box-shadow: 0 32px 76px rgba(36,49,64,.13), inset 0 1px rgba(255,255,255,.95);
  transform: rotate(-2deg) translate3d(var(--art-x),var(--art-y),0);
  transition: transform 650ms cubic-bezier(.22,1,.36,1), box-shadow 400ms ease;
}
.hero-art-frame::before,
.hero-art-frame::after {
  position: absolute;
  width: 14px;
  height: 14px;
  content: "";
  opacity: .55;
  pointer-events: none;
}
.hero-art-frame::before { top: 16px; left: 16px; border-top: 1px solid #647f95; border-left: 1px solid #647f95; }
.hero-art-frame::after { right: 16px; bottom: 16px; border-right: 1px solid #647f95; border-bottom: 1px solid #647f95; }
.hero-art-top, .hero-art-steps, .hero-art-caption { color: #526b7f; }
.hero-art-center::before { background: radial-gradient(circle,rgba(255,255,255,.88) 0%,rgba(236,243,246,.6) 52%,transparent 72%); }
.hero-art-center img { width: 160px; height: 160px; filter: drop-shadow(0 17px 20px rgba(57,82,104,.2)); }
.hero-network { position: absolute; inset: 0; width: 100%; height: 100%; color: #577998; opacity: .62; animation: networkFloat 11s ease-in-out infinite alternate; }
.network-lines path { stroke-width: 1.15; stroke-opacity: .54; stroke-dasharray: 4 7; }
.network-nodes circle { opacity: .78; }
.network-nodes circle:nth-child(3n) { fill: #a8bdcc; }
.orbit-ring { border-color: rgba(81,116,145,.27); }
.hero-art-steps i { background: #9eb4c4; }
.hero-bottom { border-color: #c8d0d2; color: #6c7c88; }

.section-head h2, .fde-copy h2, .detail-editorial h2,
.about-intro h2, .timeline h2, .about-contact h2, .contact-band h2,
.page-hero h1, .article-top h1 { color: #202a32; }
.section-head>p, .editorial-note p, .business-detail p, .rich-text,
.about-contact p, .article-card p { color: #61717a; }
.business-card, .article-card, .product-card, .step-card, .relation-grid>div {
  border-color: #d5d8d5;
  border-radius: 17px;
  box-shadow: inset 0 1px rgba(255,255,255,.56);
}
.business-card { background: #faf9f5; }
.business-card:nth-child(2) { background: #e7edf0; }
.business-card:nth-child(3) { background: #eeeae5; }
.business-card:nth-child(4) { background: #e8eaf0; }
.business-card:hover, .product-card:hover, .article-card:hover {
  border-color: #a6b9c6;
  box-shadow: 0 20px 42px rgba(31,55,73,.1);
}
.business-card-top, .article-card-meta, .article-card-bottom, .product-label { color: #6c7e8b; }
.business-card-top i, .card-link, .article-card-meta span:first-child { color: #426b88; }
.product-card { background: #fbfaf6; }
.product-visual-vibeboard { background: linear-gradient(135deg,#e9e7f0,#e0ebed); }
.product-visual-waimaodazi { background: #dce9ec; }
.product-visual-model { background: radial-gradient(circle at 50% 40%,#d2e3ec,#e5eaec 48%,#f1efe9 83%); }
.model-orbit { border-color: rgba(70,105,137,.35); }
.model-core, .model-label { color: #456783; }
.product-state, .filter-chip { color: #446b82; border-color: #d1dfe4; background: #f3f7f7; }
.filter-chip:hover, .filter-chip.active { color: #fff; border-color: #243140; background: #243140; }

.fde-feature {
  position: relative;
  background: #182636;
  color: #f3f5f5;
}
.fde-feature::before {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: .55;
  background: radial-gradient(ellipse at 15% 50%,rgba(99,125,149,.38),transparent 42%);
}
.fde-grid { position: relative; }
.fde-visual { border-radius: 18px; background: linear-gradient(135deg,#334e66,#172837 57%,#6e7e88); }
.fde-visual-inner { border-radius: 12px; border-color: rgba(214,231,241,.28); background: linear-gradient(120deg,rgba(255,255,255,.06),rgba(255,255,255,.01)); }
.fde-visual-inner>span, .fde-visual-inner small { color: #b6cfdf; }
.fde-visual-inner strong { color: #f2f5f6; }
.fde-visual-inner strong span { color: #9bb9d0; }
.fde-line { border-color: rgba(207,226,239,.37); }
.fde-copy h2, .fde-copy h2 em { color: #f3f5f5; }
.fde-copy h2 em { color: #a8bdcc; }
.fde-copy>p { color: #c8d3dc; }
.fde-copy .eyebrow { color: #b4c7d5; }
.fde-copy .eyebrow-line { background: #809fb4; }
.fde-copy .button-dark { color: #243140; background: #eef2f4; }
.fde-copy .button-dark:hover { background: #dbe8ed; }
.fde-copy .text-link { color: #d9e8f2; border-color: #849fb3; }
.fde-copy .text-link:hover { color: #fff; }
.contact-band { border-radius: 20px; background: radial-gradient(circle at 76% 30%,rgba(121,163,194,.35),transparent 30%),linear-gradient(110deg,#182636,#345372); }
.contact-band h2 { color: #fff; }
.contact-band-kicker, .contact-band p { color: #c7d9e4; }
.button-light { color: #243140; background: #f4f6f5; }

.site-footer { background: #e8e9e6; border-color: #ccd1d1; }
.footer-links b, .footer-links a:hover { color: #345d79; }
.footer-top p, .footer-links a, .footer-bottom { color: #637580; }
.page-hero { border-bottom: 1px solid #d3d7d6; }
.business-detail-wrap, .detail-callout { background: #e9ebea; }
.business-detail { border-color: #c9d1d4; }
.timeline, .de-brand { background: #e4eaec; }
.de-brand-art { background: #243140; }
.relation-grid>div:nth-child(2), .podcast-player { background: #e3edf0; }
.about-contact a, .rich-text a { color: #315d80; }

/* The reference uses short entrance motions and pointer response around its hero. */
.hero-copy > .eyebrow, .hero-copy h1, .hero-copy > p,
.hero-actions, .hero-footnote { animation: heroEnter 820ms cubic-bezier(.22,1,.36,1) both; }
.hero-copy h1 { animation-delay: 80ms; }
.hero-copy > p { animation-delay: 150ms; }
.hero-actions { animation-delay: 220ms; }
.hero-footnote { animation-delay: 290ms; }
.hero-art { animation: heroEnter 900ms 180ms cubic-bezier(.22,1,.36,1) both; }
.motion-pending { transform: translateY(22px); opacity: .62; }
.motion-visible { transform: none; opacity: 1; }
.motion-pending, .motion-visible { transition: transform 750ms cubic-bezier(.22,1,.36,1), opacity 750ms ease; }
.business-card, .product-card, .article-card, .step-card, .relation-grid>div {
  transition: transform 320ms cubic-bezier(.22,1,.36,1), border-color 320ms, box-shadow 320ms, background-color 320ms;
}
.business-card:hover, .product-card:hover, .article-card:hover { transform: translateY(-5px); }
.card-link span, .article-card-bottom span:last-child span, .button span:last-child { transition: transform 260ms cubic-bezier(.22,1,.36,1); }
.business-card:hover .card-link span, .product-card:hover .card-link span,
.article-card:hover .article-card-bottom span:last-child span, .button:hover span:last-child { transform: translate(3px,-3px); }
@keyframes heroEnter { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes networkFloat { from { transform: translateY(4px) rotate(-1deg); } to { transform: translateY(-5px) rotate(1deg); } }

@media (max-width: 760px) {
  .main-nav { background: rgba(247,249,248,.96); border-color: #d7e0e2; }
  .menu-toggle { background: rgba(99,125,149,.12); }
  .menu-toggle span { background: #345370; }
  .home-hero::after { background-size: 48px 48px; }
  .hero-art-frame { transform: rotate(-1deg); }
  .hero-art-center img { width: 130px; height: 130px; }
  .hero-network { width: 112%; left: -6%; }
  .fde-feature { padding: 54px 0; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero-copy > .eyebrow, .hero-copy h1, .hero-copy > p,
  .hero-actions, .hero-footnote, .hero-art, .hero-network { animation: none; }
  .hero-art-frame, .motion-pending, .motion-visible { transform: none; transition: none; }
  .motion-pending { opacity: 1; }
}
@media (prefers-contrast: more), (prefers-reduced-transparency: reduce) {
  .nav-glass, .hero-art-frame { background: #f8faf9; backdrop-filter: none; -webkit-backdrop-filter: none; }
}