/* Balon Geçidi · balloon-parade — Atölye #5 (#414, Mina).
   Contract: docs/tasarim/v2/yon.md §2 row 5, §3 (playful), §4 + §4.1. Selectors: [data-theme] + .inv-cover only.
   Readability: large. Primary pulled from #E4572E to #C2401F: #E4572E reached only 3.68:1 with white (README).
   Age numeral: .inv-cover__age / .inv-intro__age (proposed page hook, see README) — without it the cover still works. */

[data-theme="balloon-parade"] {
  /* yon.md §4.1 (1): this theme owns the whole cover composition; page.js sets <body data-cover="theme"> */
  --inv-cover-owned: 1;

  /* colour — contrast measured in README.md */
  --inv-bg: #FFF7E8;
  --inv-surface: #FFFFFF;
  --inv-text: #2A2140;
  --inv-text-muted: #5E5670;
  --inv-primary: #C2401F;
  --inv-on-primary: #FFFFFF;
  --inv-accent: #FFC24B;
  --inv-ornament: #3AA7A3;
  --inv-border: #F0DDBA;
  --inv-backdrop: #FFF1D6;
  --inv-danger: #B3261E;
  --inv-focus: var(--inv-text);

  /* type: name + age / heading / body */
  --inv-font-script: 'Baloo 2', 'Nunito', system-ui, sans-serif;
  --inv-font-display: 'Baloo 2', 'Nunito', system-ui, sans-serif;
  --inv-font-body: 'Nunito', system-ui, sans-serif;
  --inv-display-weight: 700;
  --inv-display-transform: none;
  --inv-display-tracking: .01em;
  --inv-body-size: 1.1875rem;
  --inv-radius: 16px;

  /* motion: springy and cheerful (yon.md §3 column "Neşeli" 5) */
  --inv-motion-intro-total: 2000ms;
  --inv-motion-ease-open: var(--ease-spring);
  --inv-motion-name-in: 500ms;
  --inv-motion-reveal: 450ms;
  --inv-motion-reveal-distance: 20px;
  --inv-motion-stagger: 70ms;
  --inv-motion-micro: 220ms;
  --inv-motion-ambient: confetti;

  /* art slots */
  --inv-art-backdrop: url("/themes/balloon-parade/art/backdrop.svg");
  --inv-art-scene: url("/themes/balloon-parade/art/scene.svg");
  --inv-art-scene-1x: url("/themes/balloon-parade/art/scene.svg");
  --inv-art-flank-left: url("/themes/balloon-parade/art/flank-left.svg");
  --inv-art-flank-right: url("/themes/balloon-parade/art/flank-right.svg");
  --inv-art-divider: url("/themes/balloon-parade/art/divider.svg");
  --inv-art-corner: url("/themes/balloon-parade/art/corner.svg");
  --inv-art-icon-schedule: url("/themes/balloon-parade/art/icon-schedule.svg");
  --inv-art-icon-rsvp: url("/themes/balloon-parade/art/icon-rsvp.svg");
  --inv-art-icon-gift: url("/themes/balloon-parade/art/icon-gift.svg");
  --inv-art-icon-gallery: url("/themes/balloon-parade/art/icon-gallery.svg");
  --inv-art-icon-guestbook: url("/themes/balloon-parade/art/icon-guestbook.svg");
  --inv-art-icon-share: url("/themes/balloon-parade/art/icon-share.svg");
}

/* ---- Cover: party wall with balloon clusters top and bottom, giant age numeral over the name ---- */
[data-theme="balloon-parade"] .inv-cover {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 100svh;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: var(--space-2);
  padding: 20svh var(--space-8) 22svh;
  text-align: center;
  color: var(--inv-text);
  background: var(--inv-bg);
}
[data-theme="balloon-parade"] .inv-cover__art {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--inv-art-scene) 50% 50% / cover no-repeat, var(--inv-bg);
}
[data-theme="balloon-parade"] .inv-cover__content { display: contents; }
/* yon.md §4.1/10: the page hides the age hook by default; this theme opens it whenever the page gives an age */
[data-theme="balloon-parade"] .inv-cover__age[data-age] { display: block; }
[data-theme="balloon-parade"] .inv-cover__age {
  margin: 0 0 -.12em;
  font: 800 clamp(7rem, 6rem + 4vw, 9.5rem)/.9 var(--inv-font-script);
  font-variant-numeric: lining-nums;
  background: linear-gradient(160deg, #F28CA0 0%, var(--inv-primary) 45%, #8E2A12 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 6px 0 rgba(42, 33, 64, .12));
}
[data-theme="balloon-parade"] .inv-cover__eyebrow {
  order: -1;
  background: color-mix(in srgb, var(--inv-bg) 84%, transparent); padding: var(--space-1) var(--space-3); /* görev 678: görsel üstünde AA */
  margin: 0 0 var(--space-3);
  font: 700 1rem/1.3 var(--inv-font-display);
  letter-spacing: var(--inv-display-tracking);
  color: var(--inv-primary);
}
[data-theme="balloon-parade"] .inv-cover__names {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  column-gap: .25em;
  max-width: max(18rem, calc(var(--inv-name-word-chars, 8) * .6em));
  margin: 0;
  /* 56 → 80. The page sets --inv-name-word-chars (letters in the longest name word); the cap fits that word between the cover paddings (#649). */
  font: 800 min(clamp(3.5rem, 2.9rem + 2.4vw, 5rem), calc((100vw - 2 * var(--space-8)) / (var(--inv-name-word-chars, 8) * .62)))/1.2 var(--inv-font-script);
  color: var(--inv-text);
}
[data-theme="balloon-parade"] .inv-cover__name { font: inherit; }
[data-theme="balloon-parade"] .inv-cover__amp { font-size: .6em; color: var(--inv-primary); }
[data-theme="balloon-parade"] .inv-cover__date { margin: var(--space-3) 0 0; }
[data-theme="balloon-parade"] .inv-cover__date time,
[data-theme="balloon-parade"] .inv-cover__day { display: block; }
[data-theme="balloon-parade"] .inv-cover__day {
  font: 700 1.0625rem/1.3 var(--inv-font-display); /* 17 px ≤ 18 (large readability), lining */
  font-variant-numeric: lining-nums;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--inv-text);
}
[data-theme="balloon-parade"] .inv-cover__time {
  display: block;
  margin-top: .2em;
  font: 700 .9375rem/1.3 var(--inv-font-display);
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--inv-text-muted);
}
[data-theme="balloon-parade"] .inv-cover__venue {
  margin: 0;
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-pill);
  background: var(--inv-surface);
  font: 600 1.0625rem/1.4 var(--inv-font-body);
  color: var(--inv-text-muted);
}
[data-theme="balloon-parade"] .inv-cover__guest,
[data-theme="balloon-parade"] .inv-cover__badge { margin: 0; font: 600 1.0625rem/1.4 var(--inv-font-body); color: var(--inv-text-muted); }
[data-theme="balloon-parade"] .inv-cover__scroll {
  position: absolute;
  left: 50%;
  bottom: 3svh;
  translate: -50% 0;
  margin: 0;
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-pill);
  background: var(--inv-surface);
  font: 600 .875rem/1 var(--inv-font-display);
  color: var(--inv-text);
}
@media (min-width: 1024px) {
  [data-theme="balloon-parade"] .inv-cover { width: auto; margin-inline: 0; padding-top: 18svh; }
  [data-theme="balloon-parade"] .inv-cover__art { background: url("art/scene-wide.svg") 50% 50% / cover no-repeat, var(--inv-bg); }
}

/* Görev 1527: tarih ve saat paylaşılan ölçü token'larında (390'da 28 / 16 px); kapak ile açılış aynı ölçüyü kullanır. */
[data-theme="balloon-parade"] .inv-cover__day { font-size: var(--inv-text-date); line-height: var(--inv-lh-date); letter-spacing: .03em; white-space: normal; }
[data-theme="balloon-parade"] .inv-cover__time { font-size: var(--inv-text-time-min); }
[data-theme="balloon-parade"] .inv-cover__date { font-size: var(--inv-text-date); line-height: var(--inv-lh-date); }
