/* v368: For little ones card, dark and gold (mockup v7). Site fonts only. */
.kf-wrap { container-type: inline-size; }
.kids-find { position: relative; display: flex; align-items: center; gap: 26px; margin: 1.4rem auto; max-width: 720px; min-height: 180px; padding: 26px 28px; border-radius: 26px; overflow: hidden; text-decoration: none; color: inherit; border: 1.5px solid #e2bc4a;
  background: radial-gradient(circle at 24% 50%, rgba(243,190,80,.22), transparent 38%), radial-gradient(circle at 15% 8%, rgba(255,180,220,.13), transparent 32%), radial-gradient(circle at 92% 85%, rgba(150,200,255,.10), transparent 32%), radial-gradient(ellipse at 70% 0%, rgba(212,175,55,.08), transparent 55%), linear-gradient(160deg, #110d06, #060504 60%, #030303);
  box-shadow: 0 0 0 1px rgba(243,210,122,.12) inset, 0 0 26px rgba(212,175,55,.28), 0 0 60px rgba(212,175,55,.08); transition: transform .35s ease, box-shadow .35s ease; }
.kids-find:hover, .kids-find:focus-visible { border-color: #e2bc4a; transform: translateY(-3px); box-shadow: 0 0 0 1px rgba(243,210,122,.18) inset, 0 0 36px rgba(212,175,55,.45), 0 0 80px rgba(212,175,55,.12); }
.kids-find:focus-visible { outline: 2px solid #f3d27a; outline-offset: 3px; }
.kf-deco { position: absolute; inset: 0; pointer-events: none; }
.kf-rainbow { position: absolute; right: -130px; top: -170px; width: 300px; height: 300px; border-radius: 50%; opacity: .1; background: radial-gradient(circle, transparent 54%, #ff8a8a 54%, #ff8a8a 58%, #ffc36b 58%, #ffc36b 62%, #fff07a 62%, #fff07a 66%, #8ef0a0 66%, #8ef0a0 70%, #7fc8ff 70%, #7fc8ff 74%, #c39bff 74%, #c39bff 78%, transparent 78%); }
.kf-star { position: absolute; color: #f3d27a; text-shadow: 0 0 6px rgba(243,210,122,.7); opacity: .6; line-height: 1; animation: kf-tw 2.6s ease-in-out infinite; }
@keyframes kf-tw { 0%, 100% { opacity: .2; transform: scale(.7); } 50% { opacity: .85; transform: scale(1.1); } }
.kf-pals { position: relative; flex: 0 0 220px; height: 140px; animation: kf-fl 5s ease-in-out infinite; }
@keyframes kf-fl { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.kf-mist { position: absolute; left: -10px; right: -10px; bottom: 4px; height: 46px; border-radius: 50%; pointer-events: none; filter: blur(6px); background: radial-gradient(ellipse at 30% 60%, rgba(243,200,110,.16), transparent 60%), radial-gradient(ellipse at 50% 50%, rgba(255,190,225,.07), transparent 60%), radial-gradient(ellipse at 72% 50%, rgba(160,205,255,.06), transparent 60%); }
.kf-dust { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #f3d27a; box-shadow: 0 0 6px #e0a92e; animation: kf-tw 3.2s ease-in-out infinite; pointer-events: none; }
.kf-pal { position: absolute; top: 22px; width: 88px; height: 88px; border-radius: 50%; object-fit: cover; background: #120d05; border: 3px solid #f3d27a; box-shadow: 0 4px 14px rgba(0,0,0,.4), 0 0 16px rgba(243,210,122,.4); transition: transform .5s cubic-bezier(.3,1.4,.5,1); }
.kf-d { left: 8px; }
.kf-k { right: 8px; }
.kids-find:hover .kf-d, .kids-find:focus-visible .kf-d { transform: translateX(7px) rotate(6deg); }
.kids-find:hover .kf-k, .kids-find:focus-visible .kf-k { transform: translateX(-7px) rotate(-6deg); }
.kf-heart { position: absolute; left: 50%; top: 58px; width: 22px; height: 22px; margin-left: -11px; animation: kf-pulse 2.4s ease-in-out infinite; filter: drop-shadow(0 0 8px rgba(255,190,70,.95)); transition: filter .4s; }
.kf-heart svg, .kf-float svg { display: block; width: 100%; height: 100%; }
.kids-find:hover .kf-heart { filter: drop-shadow(0 0 14px rgba(255,200,90,1)); }
@keyframes kf-pulse { 0%, 100% { transform: scale(.9); } 15% { transform: scale(1.12); } 30% { transform: scale(.95); } 45% { transform: scale(1.06); } }
.kf-float { position: absolute; left: 50%; top: 60px; width: 10px; height: 10px; opacity: 0; animation: kf-rise 6s ease-out infinite; pointer-events: none; }
@keyframes kf-rise { 0% { opacity: 0; transform: translate(0,0) scale(.6); } 15% { opacity: .7; } 100% { opacity: 0; transform: translate(var(--dx), -70px) scale(1); } }
.kids-find-text { position: relative; z-index: 1; flex: 1 1 auto; display: flex; flex-direction: column; align-items: flex-start; gap: 0; padding-right: 70px; }
.kids-find-title { font-family: var(--display); font-weight: 500; font-size: 34px; line-height: 1.05; letter-spacing: 0; color: #f3d27a; margin: 0 0 6px; text-shadow: 0 0 16px rgba(243,210,122,.45); }
.kids-find-line { font-family: var(--body); font-weight: 400; font-size: 18px; line-height: 1.35; color: #e6d9b8; margin: 0 0 14px; max-width: 300px; }
.kids-find-pill { white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: .35em; min-height: 44px; padding: 8px 20px; border-radius: 999px; font-family: var(--body); font-weight: 400; font-size: 16px; background: linear-gradient(180deg, #f8dc8a, #e0b040); color: #1a1205; box-shadow: 0 0 14px rgba(243,210,122,.35); }
@container (max-width: 560px) {
  .kids-find { flex-direction: column; text-align: center; padding: 24px 20px; }
  .kf-pals { flex-basis: auto; width: 220px; }
  .kids-find-text { align-items: center; padding-right: 0; }
  .kids-find-line { margin-left: auto; margin-right: auto; }
  .kids-find-title { font-size: 30px; }
  .kf-rainbow { right: -190px; top: -230px; }
}
@media (prefers-reduced-motion: reduce) {
  .kf-star, .kf-dust, .kf-pals, .kf-heart { animation: none; }
  .kf-float { display: none; }
  .kids-find, .kf-pal { transition: none; }
  .kids-find:hover, .kids-find:focus-visible { transform: none; }
  .kids-find:hover .kf-d, .kids-find:hover .kf-k, .kids-find:focus-visible .kf-d, .kids-find:focus-visible .kf-k { transform: none; }
}
