/*
  GIÓVA Gelato — CSS Image Placeholders
  Χρησιμοποιείται όταν οι generated εικόνες δεν είναι ακόμα διαθέσιμες.
  Αντικαταστήστε τα background-color με background-image url() όταν τα assets είναι έτοιμα.
  Κάθε placeholder έχει brand-accurate χρώμα + gradient που μιμείται το mood της φωτογραφίας.
*/

/* ── Hero ── */
.giova-hero-img {
  background-color: #D4B896;
  background-image:
    radial-gradient(ellipse at 30% 60%, rgba(122, 158, 111, 0.35) 0%, transparent 60%),
    radial-gradient(ellipse at 70% 30%, rgba(196, 125, 44, 0.25) 0%, transparent 55%),
    linear-gradient(160deg, #FAF6EE 0%, #D4B896 45%, #C4A882 100%);
  /* Replace with: background-image: url('../assets/hero-gelato-counter.avif'); */
}

/* ── Card: Pistachio Gelato ── */
.giova-card-pistachio {
  background-color: #7A9E6F;
  background-image:
    radial-gradient(ellipse at 50% 40%, rgba(191, 212, 179, 0.7) 0%, transparent 55%),
    linear-gradient(180deg, #BFD4B3 0%, #7A9E6F 60%, #4A6B40 100%);
  /* Replace with: background-image: url('../assets/card-pistachio-cone.avif'); */
}

/* ── Card: Cinnamon Roll & Babka ── */
.giova-card-cinnamon {
  background-color: #C47D2C;
  background-image:
    radial-gradient(ellipse at 40% 35%, rgba(228, 168, 74, 0.6) 0%, transparent 50%),
    linear-gradient(155deg, #F2E8D5 0%, #E4A84A 35%, #C47D2C 70%, #8B5E1A 100%);
  /* Replace with: background-image: url('../assets/card-cinnamon-babka.avif'); */
}

/* ── Card: Latte Art ── */
.giova-card-latte {
  background-color: #8B6339;
  background-image:
    radial-gradient(ellipse at 50% 50%, rgba(196, 168, 130, 0.7) 0%, transparent 45%),
    linear-gradient(180deg, #C4A882 0%, #8B6339 55%, #3C2410 100%);
  /* Replace with: background-image: url('../assets/card-latte-art.avif'); */
}

/* ── Card: Cheesecake Gelato ── */
.giova-card-cheesecake {
  background-color: #FAF0DC;
  background-image:
    radial-gradient(ellipse at 50% 35%, rgba(250, 246, 238, 0.9) 0%, transparent 55%),
    radial-gradient(ellipse at 70% 70%, rgba(212, 85, 106, 0.2) 0%, transparent 40%),
    linear-gradient(180deg, #FFFFFF 0%, #FAF0DC 50%, #F2E8D5 100%);
  /* Replace with: background-image: url('../assets/card-cheesecake-gelato.avif'); */
}

/* ── IG tile variants (reuse brand placeholders, distinct moods) ── */
.giova-ig-1 {
  background-color: #7A9E6F;
  background-image:
    radial-gradient(ellipse at 40% 35%, rgba(191,212,179,0.75) 0%, transparent 55%),
    linear-gradient(160deg, #BFD4B3 0%, #7A9E6F 70%);
}
.giova-ig-2 {
  background-color: #C47D2C;
  background-image:
    radial-gradient(ellipse at 60% 40%, rgba(228,168,74,0.7) 0%, transparent 50%),
    linear-gradient(150deg, #E4A84A 0%, #C47D2C 75%);
}
.giova-ig-3 {
  background-color: #D4556A;
  background-image:
    radial-gradient(ellipse at 45% 45%, rgba(255,255,255,0.5) 0%, transparent 50%),
    linear-gradient(165deg, #E68AA0 0%, #D4556A 80%);
}
.giova-ig-4 {
  background-color: #4A8E96;
  background-image:
    radial-gradient(ellipse at 50% 35%, rgba(168,213,217,0.7) 0%, transparent 55%),
    linear-gradient(170deg, #A8D5D9 0%, #4A8E96 80%);
}

/* ── .fill helper: makes any placeholder fill its slot as an absolute block ── */
.fill { width: 100%; height: 100%; }

/* ── Texture / Background ── */
.giova-texture-bg {
  background-color: #FAF6EE;
  background-image:
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 3px,
      rgba(196, 168, 130, 0.04) 3px,
      rgba(196, 168, 130, 0.04) 4px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 3px,
      rgba(196, 168, 130, 0.04) 3px,
      rgba(196, 168, 130, 0.04) 4px
    );
  /* Replace with: background-image: url('../assets/texture-cream-linen.avif'); */
}