
/* =========================================================
   DATA & AI — APPROVED COLLECTION REFINEMENT v9
   presentation-only, no content/logic changes
   ========================================================= */

:root {
  --da-bg: #fbfcfb;
  --da-panel: rgba(255,255,255,0.88);
  --da-text: #0e2340;
  --da-muted: #5a6c81;
  --da-border: rgba(18, 47, 71, 0.10);
  --da-shadow: 0 14px 34px rgba(12, 32, 54, 0.06);
  --da-yellow: #f2bf3d;
  --da-orange: #ef7c33;
  --da-teal: #35b7b0;
  --da-cyan: #59c5e8;
  --da-lime: #8bcf91;
}

/* neutral interaction: no jumpiness */
a, button, .card, .tile, .feature, .collection-card,
.data-ai-card, .data-ai-feature, .data-ai-rail-item {
  transition:
    color 180ms ease,
    background-color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    opacity 180ms ease !important;
  transform: none !important;
}
a:hover, button:hover, .card:hover, .tile:hover, .feature:hover,
.collection-card:hover, .data-ai-card:hover, .data-ai-feature:hover,
.data-ai-rail-item:hover {
  transform: none !important;
  translate: none !important;
  box-shadow: inherit !important;
  cursor: pointer !important;
}

/* page background */
body {
  background:
    radial-gradient(circle at 16% 20%, rgba(82, 201, 216, 0.03), transparent 22%),
    radial-gradient(circle at 84% 16%, rgba(242, 191, 61, 0.03), transparent 24%),
    linear-gradient(180deg, #fdfefe 0%, #fbfcfb 100%);
}

/* =========================================================
   HERO / VISUAL
   ========================================================= */

/* try to catch the current collection shell regardless of exact class name */
.data-ai-collection,
.data-ai-shell,
.collection-shell,
main[data-page="data-ai"],
main .data-ai-root,
main .data-ai-page {
  position: relative;
}

.data-ai-hero,
.collection-hero,
.data-ai-collection-hero,
.hero-collection {
  position: relative;
  overflow: hidden;
  min-height: 360px;
}

.data-ai-hero-art,
.collection-hero-art,
.hero-wave-art,
.data-ai-wave-hero {
  position: absolute !important;
  right: 0;
  top: 22px;
  width: 55%;
  height: 270px;
  pointer-events: none;
  opacity: 1;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right top;
}

/* Large pale ring */
.data-ai-hero-art::before,
.collection-hero-art::before,
.hero-wave-art::before,
.data-ai-wave-hero::before {
  content: "";
  position: absolute;
  right: 14%;
  top: -4px;
  width: 210px;
  height: 210px;
  border-radius: 999px;
  border: 32px solid rgba(141, 224, 217, 0.13);
  box-sizing: border-box;
}

/* flowing “safety-net” wave */
.data-ai-hero-art::after,
.collection-hero-art::after,
.hero-wave-art::after,
.data-ai-wave-hero::after {
  content: "";
  position: absolute;
  inset: 10px 0 0 0;
  background-image:
    url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 280'>\
<defs>\
<linearGradient id='g1' x1='0' y1='0' x2='1' y2='0'>\
<stop offset='0%' stop-color='%23f4d058'/>\
<stop offset='35%' stop-color='%23f29c52'/>\
<stop offset='65%' stop-color='%238fd0a0'/>\
<stop offset='100%' stop-color='%2359c5e8'/>\
</linearGradient>\
</defs>\
<g fill='none' stroke='url(%23g1)' stroke-linecap='round'>\
<path d='M0,165 C95,120 165,205 260,160 C355,115 432,68 534,130 C640,195 726,186 900,86' stroke-width='2.3' opacity='0.55'/>\
<path d='M0,150 C98,108 168,192 263,148 C360,102 437,59 539,121 C641,181 730,171 900,78' stroke-width='2.8' opacity='0.62'/>\
<path d='M0,136 C100,96 170,180 266,138 C362,93 440,48 542,112 C645,172 735,162 900,72' stroke-width='3.4' opacity='0.68'/>\
<path d='M0,122 C102,84 173,168 270,126 C369,81 447,40 549,102 C653,161 742,154 900,66' stroke-width='4.0' opacity='0.75'/>\
<path d='M0,108 C105,74 178,156 276,116 C376,72 454,34 557,93 C661,150 748,145 900,60' stroke-width='4.7' opacity='0.82'/>\
<path d='M0,96 C110,66 184,145 282,105 C382,64 461,30 565,85 C670,140 755,136 900,56' stroke-width='5.6' opacity='0.88'/>\
<path d='M0,84 C114,56 190,132 288,95 C389,57 468,28 572,78 C679,130 763,129 900,52' stroke-width='6.3' opacity='0.92'/>\
</g>\
<g fill='%23f2d56a' opacity='0.75'>\
<circle cx='116' cy='88' r='8'/>\
<circle cx='214' cy='72' r='5'/>\
<circle cx='428' cy='55' r='4'/>\
<circle cx='620' cy='99' r='7'/>\
</g>\
<g fill='%2379d4c7' opacity='0.75'>\
<circle cx='316' cy='112' r='7'/>\
<circle cx='548' cy='48' r='5'/>\
<circle cx='784' cy='43' r='8'/>\
<circle cx='702' cy='67' r='4'/>\
</g>\
<g fill='%235fc3e4' opacity='0.78'>\
<circle cx='476' cy='88' r='8'/>\
<circle cx='708' cy='95' r='6'/>\
</g>\
</svg>");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right top;
  opacity: 1;
}

/* =========================================================
   PRODUCT CARDS
   ========================================================= */

.data-ai-card-grid,
.collection-grid,
.product-grid,
.collection-cards {
  gap: 26px !important;
}

.data-ai-card,
.collection-card,
.product-card,
.collection-tile {
  position: relative;
  overflow: hidden;
  border-radius: 22px !important;
  border: 1.6px solid var(--da-border) !important;
  box-shadow: var(--da-shadow) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.92), rgba(255,255,255,0.88)) !important;
}

.data-ai-card:nth-child(1),
.collection-card:nth-child(1),
.product-card:nth-child(1),
.collection-tile:nth-child(1) {
  border-color: rgba(242, 191, 61, 0.55) !important;
}
.data-ai-card:nth-child(2),
.collection-card:nth-child(2),
.product-card:nth-child(2),
.collection-tile:nth-child(2) {
  border-color: rgba(239, 124, 51, 0.50) !important;
}
.data-ai-card:nth-child(3),
.collection-card:nth-child(3),
.product-card:nth-child(3),
.collection-tile:nth-child(3) {
  border-color: rgba(53, 183, 176, 0.52) !important;
}

.data-ai-card::after,
.collection-card::after,
.product-card::after,
.collection-tile::after {
  content: "";
  position: absolute;
  right: -2%;
  bottom: -2%;
  width: 48%;
  height: 38%;
  opacity: 0.46;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right bottom;
}

.data-ai-card:nth-child(1)::after,
.collection-card:nth-child(1)::after,
.product-card:nth-child(1)::after,
.collection-tile:nth-child(1)::after {
  background-image:
    url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 120'>\
<g fill='none' stroke='%23f2c14c' stroke-width='1.8' opacity='0.55'>\
<path d='M26,120 C48,88 68,80 94,58 C118,38 140,28 170,0'/>\
<path d='M52,120 C74,88 94,80 120,58 C144,38 166,28 196,0'/>\
<path d='M78,120 C100,88 120,80 146,58 C170,38 192,28 222,0'/>\
<path d='M104,120 C126,88 146,80 172,58 C196,38 218,28 248,0'/>\
</g></svg>");
}
.data-ai-card:nth-child(2)::after,
.collection-card:nth-child(2)::after,
.product-card:nth-child(2)::after,
.collection-tile:nth-child(2)::after {
  background-image:
    url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 120'>\
<g fill='none' stroke='%23ef8b54' stroke-width='1.8' opacity='0.55'>\
<path d='M26,120 C48,88 68,80 94,58 C118,38 140,28 170,0'/>\
<path d='M52,120 C74,88 94,80 120,58 C144,38 166,28 196,0'/>\
<path d='M78,120 C100,88 120,80 146,58 C170,38 192,28 222,0'/>\
<path d='M104,120 C126,88 146,80 172,58 C196,38 218,28 248,0'/>\
</g></svg>");
}
.data-ai-card:nth-child(3)::after,
.collection-card:nth-child(3)::after,
.product-card:nth-child(3)::after,
.collection-tile:nth-child(3)::after {
  background-image:
    url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 120'>\
<g fill='none' stroke='%2350c6bc' stroke-width='1.8' opacity='0.55'>\
<path d='M26,120 C48,88 68,80 94,58 C118,38 140,28 170,0'/>\
<path d='M52,120 C74,88 94,80 120,58 C144,38 166,28 196,0'/>\
<path d='M78,120 C100,88 120,80 146,58 C170,38 192,28 222,0'/>\
<path d='M104,120 C126,88 146,80 172,58 C196,38 218,28 248,0'/>\
</g></svg>");
}

/* stronger card typography match */
.data-ai-card h2, .data-ai-card h3,
.collection-card h2, .collection-card h3,
.product-card h2, .product-card h3,
.collection-tile h2, .collection-tile h3 {
  letter-spacing: -0.02em;
  color: var(--da-text) !important;
}

.data-ai-card p,
.collection-card p,
.product-card p,
.collection-tile p {
  color: var(--da-muted) !important;
}

/* =========================================================
   QUANTITATIVE SAFETY STRIP
   ========================================================= */

.data-ai-feature-strip,
.collection-feature-strip,
.feature-rail,
.data-ai-rail {
  border-radius: 18px !important;
  background: rgba(255,255,255,0.82) !important;
  border: 1px solid var(--da-border) !important;
  box-shadow: 0 10px 24px rgba(15, 35, 58, 0.035) !important;
}

.data-ai-feature-strip > *,
.collection-feature-strip > *,
.feature-rail > *,
.data-ai-rail > * {
  min-height: 92px;
}

/* footer remains quiet */
.data-ai-footer,
.collection-footer,
footer.data-ai {
  background: transparent !important;
  box-shadow: none !important;
}
