
/* ART DEVOPS — CLIENT SCENARIOS */
.ad-scenarios,.ad-scenarios *{box-sizing:border-box}
.ad-scenarios{position:relative;padding:90px 0;
border-bottom:1px solid var(--border-glass)}
.ad-scenarios .ad-scenarios-intro{
max-width:650px;margin:18px auto 0;color:var(--text-muted);
font-family:var(--font-body);font-size:16px;line-height:1.75}
.ad-scenarios .ad-scenarios-explorer{min-width:0}
.ad-scenarios .ad-scenarios-choices{
display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
gap:12px;margin-bottom:24px}
.ad-scenarios .ad-scenario-choice{
display:flex;align-items:center;justify-content:flex-start;gap:12px;
min-width:0;min-height:84px;padding:18px;
background:var(--bg-card);color:var(--text-pure);
border:1px solid var(--border-glass);border-radius:16px;
font-family:var(--font-body);font-size:14px;font-weight:800;
line-height:1.5;text-align:left;cursor:pointer;
transition:transform .25s,border-color .25s,box-shadow .25s}
.ad-scenarios .ad-scenario-choice i{
flex-shrink:0;color:var(--neon-accent);font-size:22px}
.ad-scenarios .ad-scenario-choice span{min-width:0;overflow-wrap:anywhere}
.ad-scenarios .ad-scenario-choice[aria-pressed="true"]{
border-color:var(--neon-accent);
box-shadow:inset 0 -3px 0 var(--neon-accent),0 8px 24px var(--border-glass)}
.ad-scenarios .ad-scenario-choice:focus-visible{
outline:3px solid var(--neon-accent);outline-offset:4px}
.ad-scenarios .ad-scenarios-panels{display:grid;gap:24px}
.ad-scenarios .ad-scenario-panel{
display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
gap:clamp(30px,5vw,70px);min-width:0;padding:clamp(26px,4vw,50px);
background:var(--bg-card);border:1px solid var(--border-glass);border-radius:26px}
.ad-scenarios .ad-scenario-panel[hidden]{display:none}
.ad-scenarios .ad-scenario-summary{min-width:0}
.ad-scenarios .ad-scenario-symbol{
display:inline-flex;align-items:center;justify-content:center;
width:56px;height:56px;margin-bottom:24px;color:var(--neon-accent);
border:1px solid var(--border-glass);border-radius:16px;font-size:26px}
.ad-scenarios .ad-scenario-summary h3{
margin:0 0 18px;color:var(--text-pure);font-family:var(--font-heading);
font-size:clamp(22px,2.5vw,30px);font-weight:800;line-height:1.35;
letter-spacing:-.03em;overflow-wrap:anywhere}
.ad-scenarios .ad-scenario-summary p{
margin:0 0 28px;color:var(--text-muted);font-family:var(--font-body);
font-size:15px;line-height:1.85}
.ad-scenarios .ad-scenario-cta{
max-width:100%;white-space:normal;text-align:center}
.ad-scenarios .ad-scenario-plan{
align-self:center;min-width:0;padding-left:30px;
border-left:1px solid var(--border-glass)}
.ad-scenarios .ad-scenario-plan h4{
margin:0 0 24px;color:var(--text-pure);font-family:var(--font-body);
font-size:16px;font-weight:800;line-height:1.5}
.ad-scenarios .ad-scenario-plan ol{
display:grid;gap:24px;margin:0;padding:0;list-style:none}
.ad-scenarios .ad-scenario-plan li{
display:flex;align-items:flex-start;gap:15px;min-width:0;
color:var(--text-muted);font-family:var(--font-body);font-size:14px;line-height:1.75}
.ad-scenarios .ad-scenario-step-number{
display:inline-flex;align-items:center;justify-content:center;flex:0 0 34px;
width:34px;height:34px;color:var(--neon-accent);
border:1px solid var(--border-glass);border-radius:10px;
font-family:var(--font-mono);font-size:11px;font-weight:700}
.ad-scenarios .ad-scenario-panel.is-entering{animation:adScenarioReveal .35s ease both}
@keyframes adScenarioReveal{
from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(hover:hover) and (pointer:fine){
.ad-scenarios .ad-scenario-choice:hover{
transform:translateY(-3px);border-color:var(--neon-accent)}}
@media(max-width:960px){
.ad-scenarios .ad-scenarios-choices{grid-template-columns:repeat(2,minmax(0,1fr))}
.ad-scenarios .ad-scenario-panel{gap:32px}}
@media(max-width:700px){
.ad-scenarios{padding:60px 0}
.ad-scenarios .ad-scenario-panel{
grid-template-columns:minmax(0,1fr);padding:26px 20px;border-radius:20px}
.ad-scenarios .ad-scenario-plan{
padding:24px 0 0;border-left:0;border-top:1px solid var(--border-glass)}
.ad-scenarios .ad-scenario-choice{
align-items:flex-start;flex-direction:column;gap:10px;
min-height:104px;padding:16px;font-size:13px}
.ad-scenarios .ad-scenarios-intro{font-size:14px}
.ad-scenarios .ad-scenario-cta{width:100%;justify-content:center}}
@media(prefers-reduced-motion:reduce){
.ad-scenarios .ad-scenario-choice{transition:none}
.ad-scenarios .ad-scenario-panel.is-entering{animation:none}}
