/* =========================================================
   GOMMA WELL V23 — ROTINA "INFANTIL" + NEURO KIDS SHOWCASE
   Content-level rename affects both breakpoints (same markup,
   no visual regression on desktop — see note below). The new
   Neuro Kids showcase card is MOBILE ONLY; desktop keeps the
   original .manifesto-list untouched.
   ========================================================= */

/* The HTML class on #routineScene was renamed from "morning" to
   "infantil" (data content change from stage 3, item 1). This rule
   simply reproduces the exact same gradient under the new class
   name so BOTH desktop and mobile keep the identical background —
   nothing changes visually here, it only follows the renamed class. */
.routine-scene.infantil{background:linear-gradient(135deg,#ffd2e0,#ff8eb4)}

/* ---------- Neuro Kids showcase: hidden on desktop by default ---------- */
.nk-showcase{display:none}

@media(max-width:720px){

  /* Replace the generic 4-item list with the richer, product-specific
     showcase on mobile only. Desktop keeps .manifesto-list as-is. */
  .manifesto-list{display:none}

  .nk-showcase{
    display:block;
    margin-top:8px;
    padding-top:26px;
    border-top:1px solid rgba(255,255,255,.14);
  }

  .nk-eyebrow{
    margin:0 0 10px;
    font-size:11px;
    font-weight:950;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:var(--lime);
  }

  .nk-title{
    margin:0 0 12px;
    font-size:27px;
    line-height:1.12;
    letter-spacing:-.02em;
    color:#fff;
  }

  .nk-lead{
    margin:0;
    font-size:14.5px;
    line-height:1.55;
    color:rgba(255,255,255,.72);
  }

  .nk-features{margin-top:22px}
  .nk-feature{
    display:grid;
    grid-template-columns:34px 1fr;
    gap:10px;
    padding:16px 0;
    border-top:1px solid rgba(255,255,255,.14);
    opacity:0;
    transform:translateX(20px);
    transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);
  }
  .nk-feature.visible{opacity:1;transform:none}
  .nk-feature:nth-child(2){transition-delay:.06s}
  .nk-feature:nth-child(3){transition-delay:.12s}
  .nk-feature:nth-child(4){transition-delay:.18s}
  .nk-feature span{font-size:11px;font-weight:950;color:var(--lime)}
  .nk-feature h4{
    margin:0 0 5px;
    font-size:14.5px;
    line-height:1.28;
    font-weight:900;
    color:#fff;
  }
  .nk-feature p{
    margin:0;
    font-size:12.5px;
    line-height:1.5;
    color:rgba(255,255,255,.58);
  }

  .nk-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:22px;
    font-size:13px;
    font-weight:900;
    color:#fff;
    text-decoration:underline;
    text-underline-offset:3px;
  }
  .nk-link span{font-size:14px}
}