/* ============================================================
   FLAVOR AURA — signature visual system.
   Every dish gets a generated gradient + fine-line icon instead
   of a stock photo: a visual fingerprint driven by its flavor
   profile, echoing "20 flavour profiles, 50 cuisines, AI-matched".
   ============================================================ */

.aura{
  position:relative;
  isolation:isolate;
  display:flex; align-items:flex-end;
  overflow:hidden;
  background:var(--navy-800);
}
.aura::before{ /* gradient wash */
  content:''; position:absolute; inset:0;
  background:var(--aura-grad, linear-gradient(150deg,var(--ocean-600),var(--navy-800)));
}
.aura::after{ /* grain */
  content:''; position:absolute; inset:0; opacity:.5; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.35'/%3E%3C/svg%3E");
}
.aura-icon{
  position:absolute; z-index:1; opacity:.28;
  color:rgba(255,255,255,.9);
  width:42%; height:42%; right:-5%; bottom:-8%;
}
.aura-icon svg{ width:100%; height:100%; }
.aura-label{
  position:relative; z-index:2; width:100%;
  padding:var(--sp-4);
  background:linear-gradient(0deg, rgba(0,0,0,.42), transparent 65%);
  color:#fff;
}

/* --- hue variants: mapped to flavor families --- */
.aura[data-aura="fusion"]{ --aura-grad: linear-gradient(150deg,#3E6FA8 0%,#5C4A82 55%,#23406E 100%); }
.aura[data-aura="legends"]{ --aura-grad: linear-gradient(150deg,#2A4A73 0%,#1C2D4B 60%,#12203A 100%); }
.aura[data-aura="speed"]{ --aura-grad: linear-gradient(150deg,#57A34B 0%,#2E7A73 55%,#1F5A63 100%); }
.aura[data-aura="event"]{ --aura-grad: linear-gradient(150deg,#B5502E 0%,#8C3A2C 55%,#4A2530 100%); }
.aura[data-aura="lean"]{ --aura-grad: linear-gradient(150deg,#6FAE63 0%,#3E7C36 60%,#26502A 100%); }
.aura[data-aura="sweet"]{ --aura-grad: linear-gradient(150deg,#C98BB0 0%,#8A5A96 55%,#4E3A6B 100%); }
.aura[data-aura="spice"]{ --aura-grad: linear-gradient(150deg,#D97B3E 0%,#B5502E 55%,#6E2E24 100%); }
.aura[data-aura="herb"]{ --aura-grad: linear-gradient(150deg,#4F9B44 0%,#2A5D8F 60%,#12203A 100%); }
.aura[data-aura="ocean"]{ --aura-grad: linear-gradient(150deg,#2082C1 0%,#23406E 60%,#12203A 100%); }
.aura[data-aura="gold"]{ --aura-grad: linear-gradient(150deg,#E4C868 0%,#C9A227 55%,#8A6C14 100%); }

/* sizes */
.aura-card{ aspect-ratio:4/3; }
.aura-square{ aspect-ratio:1/1; }