/* AI-Assisted Quality Engineering · motivational intro components */
@media (min-width:1001px){ .journey.three { grid-template-columns:repeat(3,1fr); } }
.j-week p { font-size:1rem; }

/* full-bleed film-still scenes */
.scene-hero { position:relative; }
.scene-hero:not([hidden]) { display:grid !important; place-items:center; min-height:100%; }
.hero-bg { position:absolute; inset:0; background:linear-gradient(180deg,rgba(7,17,31,.55),rgba(7,17,31,.82) 55%,rgba(7,17,31,.97)), var(--img) center/cover no-repeat; opacity:.9; animation:kenburns 26s ease-in-out infinite alternate; }
.scene-hero.is-active .hero-bg { animation-play-state:running; }
@keyframes kenburns { from { transform:scale(1.02); } to { transform:scale(1.12) translate(-1.5%,-1%); } }
@media (prefers-reduced-motion:reduce){ .hero-bg { animation:none; } }
.hero-copy { position:relative; z-index:1; text-align:center; max-width:62rem; padding:2rem 1rem; }
.scene-hero .hero-title { font-size:clamp(2.4rem,6vw,5.2rem); line-height:.98; margin-top:1.2rem; }
.big-q { margin:.6rem 0; font-size:clamp(2.2rem,5.4vw,4.6rem); font-weight:800; letter-spacing:-.03em; line-height:1.05; color:var(--white); }
.big-q em { font-style:normal; color:var(--teal); }
.motto { margin:.8rem 0 0; font-size:clamp(1.2rem,2.4vw,1.9rem); color:#d6e1ee; }
.motto b { color:var(--violet); }
.scene-line { font-size:clamp(1.1rem,2.2vw,1.6rem); color:#cbd7e5; margin:0 0 .4rem; }
.answer { font-size:clamp(1.3rem,2.8vw,2.2rem); color:#e6eef8; margin:.4rem 0 0; }
.answer b { color:var(--teal); }

/* wall of green checks */
.green-wall { display:grid; grid-template-columns:repeat(12,1.6rem); gap:.45rem; justify-content:center; margin:1rem 0 1.4rem; }
.green-wall i { width:1.6rem; height:1.6rem; border-radius:.45rem; background:rgba(110,219,215,.16); border:1px solid rgba(110,219,215,.6); position:relative; }
.green-wall i::after { content:"✓"; position:absolute; inset:0; display:grid; place-items:center; color:var(--teal); font-size:.95rem; font-style:normal; font-weight:800; }
.green-wall.is-visible i { animation:pop .5s ease both; }
.green-wall.is-visible i:nth-child(n) { animation-delay:calc(var(--d,0) * 1s); }
.green-wall i:nth-child(1){--d:.05}.green-wall i:nth-child(2){--d:.1}.green-wall i:nth-child(3){--d:.15}.green-wall i:nth-child(4){--d:.2}.green-wall i:nth-child(5){--d:.25}.green-wall i:nth-child(6){--d:.3}.green-wall i:nth-child(7){--d:.35}.green-wall i:nth-child(8){--d:.4}.green-wall i:nth-child(9){--d:.45}.green-wall i:nth-child(10){--d:.5}.green-wall i:nth-child(11){--d:.55}.green-wall i:nth-child(12){--d:.6}
@keyframes pop { from { transform:scale(.4); opacity:0; } to { transform:scale(1); opacity:1; } }

/* your moment */
.lead b { color:var(--white); }
.you { margin:1rem 0 0; font-size:clamp(1.6rem,3.4vw,2.8rem); font-weight:800; letter-spacing:-.02em; }
.you em { font-style:normal; color:var(--teal); }

/* then / now */
.shift { display:grid; grid-template-columns:1fr auto 1fr; gap:1.2rem; align-items:stretch; margin-top:.6rem; }
.shift-card { padding:1.4rem 1.5rem; border:1px solid var(--line); border-radius:1.1rem; background:var(--panel); }
.shift-card h3 { margin:.5rem 0 .8rem; font-size:1.45rem; }
.shift-card ul { margin:0; padding-left:1.1rem; line-height:1.9; color:var(--muted); }
.shift-card.now { border-color:rgba(110,219,215,.55); background:linear-gradient(160deg,rgba(110,219,215,.12),rgba(173,140,255,.08)); }
.shift-card.now ul { color:#e3ecf6; }
.shift-tag { font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800; color:var(--muted); }
.shift-card.now .shift-tag { color:var(--teal); }
.shift-arrow { align-self:center; font-size:2.6rem; color:var(--teal); }
.quote { display:flex; gap:1rem; align-items:center; margin:1.6rem 0 0; padding:1rem 1.2rem; border-left:3px solid var(--gold); background:linear-gradient(90deg,rgba(230,201,132,.1),transparent); border-radius:0 .9rem .9rem 0; }
.quote img { width:3.4rem; height:3.4rem; border-radius:50%; object-fit:cover; flex:none; }
.quote p { margin:0; font-size:clamp(1.05rem,1.9vw,1.4rem); line-height:1.4; }
.quote cite { display:block; margin-top:.3rem; font-style:normal; font-size:.85rem; color:var(--gold); font-weight:700; }

/* why now */
.tiles.twin { grid-template-columns:1fr 1fr; max-width:52rem; }

/* catch the bug */
.bug-case { display:flex; gap:1.2rem; align-items:center; flex-wrap:wrap; margin-bottom:1rem; }
.suite { flex:1 1 22rem; display:grid; grid-template-columns:1fr 1fr; gap:.5rem; padding:1rem 1.1rem; border:1px solid rgba(110,219,215,.4); border-radius:1rem; background:rgba(110,219,215,.06); }
.suite .kicker { grid-column:1/-1; margin:0 0 .2rem; }
.suite span { color:var(--teal); font-weight:600; font-size:.95rem; }
.bug-badge { display:flex; flex-direction:column; align-items:center; gap:.4rem; padding:1rem 1.4rem; border:1px solid rgba(255,154,159,.55); border-radius:1rem; background:rgba(255,154,159,.08); color:var(--danger); transition:all .5s ease; }
.bug-ico { width:2.6rem; height:2.6rem; border-radius:50%; background:radial-gradient(circle at 50% 45%,#ffb3b8 0 30%,transparent 32%),radial-gradient(circle,rgba(255,154,159,.5),transparent 70%); animation:wiggle 1.2s ease-in-out infinite; }
@keyframes wiggle { 0%,100% { transform:translateX(-3px) rotate(-6deg); } 50% { transform:translateX(3px) rotate(6deg); } }
.bug-badge.is-caught { border-color:rgba(110,219,215,.7); background:rgba(110,219,215,.12); color:var(--teal); }
.bug-badge.is-caught .bug-ico { animation:none; background:radial-gradient(circle at 50% 45%,var(--teal) 0 30%,transparent 32%),radial-gradient(circle,rgba(110,219,215,.55),transparent 70%); box-shadow:0 0 1.4rem rgba(110,219,215,.6); }
#tryChoices button b { font-size:1rem; line-height:1.35; }

/* powers */
.powers { display:grid; grid-template-columns:repeat(3,1fr); gap:.9rem; }
.power { padding:1.2rem 1.25rem; border:1px solid var(--line); border-radius:1rem; background:linear-gradient(180deg,rgba(18,34,54,.96),rgba(10,21,36,.93)); }
.power span { display:grid; place-items:center; width:2.6rem; height:2.6rem; border-radius:.8rem; background:rgba(110,219,215,.12); color:var(--teal); font-size:1.3rem; }
.power:nth-child(even) span { background:rgba(173,140,255,.14); color:var(--violet); }
.power h3 { margin:.8rem 0 .35rem; font-size:1.2rem; }
.power p { margin:0; color:var(--muted); line-height:1.5; }

/* mission */
.mission { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; counter-reset:m; }
.m-step { position:relative; padding:1.4rem 1.4rem 1.3rem; border:1px solid var(--line); border-radius:1.1rem; background:var(--panel); }
.m-step span { font-size:.85rem; font-weight:800; letter-spacing:.1em; color:var(--teal); }
.m-step h3 { margin:.4rem 0 .4rem; font-size:1.6rem; }
.m-step p { margin:0; color:var(--muted); line-height:1.5; }
.m-step:nth-child(2) { border-color:rgba(173,140,255,.5); }
.m-step:nth-child(3) { border-color:rgba(110,219,215,.55); }

@media (max-width:1000px){
  .shift { grid-template-columns:1fr; } .shift-arrow { transform:rotate(90deg); justify-self:center; }
  .powers, .mission { grid-template-columns:1fr 1fr; }
}
@media (max-width:620px){
  .powers, .mission, .tiles.twin, .suite { grid-template-columns:1fr; }
  .green-wall { grid-template-columns:repeat(6,1.5rem); }
}