/* ============================================================
   Gigglezz homepage concepts — shared base for all 4 variations
   Loads after colors_and_type.css + components.css
   ============================================================ */

.gz-page * { box-sizing: border-box; }
.gz-page {
  width: 1280px;
  font-family: var(--font-body);
  color: var(--color-text-body);
  background: var(--color-white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  position: relative;
  overflow: hidden;
}
.gz-page img { display: block; max-width: 100%; }
.gz-page a { color: inherit; text-decoration: none; }
.gz-page p { margin: 0; }
.gz-page h1, .gz-page h2, .gz-page h3, .gz-page h4 { margin: 0; }

/* ---- soft photo placeholder (reads as a real photo tile) ---- */
.gz-photo {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(150deg, #cfe3ff 0%, #e7d9ff 100%);
}
.gz-photo .ph-ico {
  font-size: 76px;
  color: rgba(255, 255, 255, 0.72);
  filter: drop-shadow(0 4px 10px rgba(20, 24, 60, 0.12));
}
.gz-photo .ph-tag {
  position: absolute;
  left: 14px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--color-neutral-700);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 5px 10px;
  border-radius: var(--radius-full);
  box-shadow: 0 2px 8px rgba(20, 24, 60, 0.12);
  backdrop-filter: blur(2px);
}
.gz-photo .ph-tag i { font-size: 13px; color: var(--color-primary); }

/* tint palettes */
.gz-photo.t-blue    { background: linear-gradient(150deg, #bcd6ff 0%, #8fb4ff 100%); }
.gz-photo.t-mint    { background: linear-gradient(150deg, #c7f1f2 0%, #8fdfe2 100%); }
.gz-photo.t-lav     { background: linear-gradient(150deg, #e4dcff 0%, #b9aef0 100%); }
.gz-photo.t-gold    { background: linear-gradient(150deg, #ffe6b0 0%, #f7c873 100%); }
.gz-photo.t-peach   { background: linear-gradient(150deg, #ffd9c7 0%, #f7a98a 100%); }
.gz-photo.t-sky     { background: linear-gradient(150deg, #d7ecff 0%, #aed4ff 100%); }
.gz-photo.t-green   { background: linear-gradient(150deg, #d3f0d8 0%, #9cdca8 100%); }

/* generic rating row */
.gz-stars { color: var(--color-gold); letter-spacing: 2px; font-size: 15px; }

/* decorative accent svg defaults */
.gz-accent { position: absolute; pointer-events: none; }