:root{
  --bg:#ffffff; --surface:#f3f5f8; --surface-2:#e9edf3; --text:#0a0d12; --text-muted:#5b6472;
  --line:#dde2e9; --accent:#155eef; --glow: 0 0 0 rgba(21,94,239,0); --icon-fill:#155eef;
  --shadow: 0 10px 30px rgba(10,13,18,0.08); --radius:14px;
}
html[data-theme="dark"]{
  --bg:#05070a; --surface:#0d1117; --surface-2:#121822; --text:#eef2f7; --text-muted:#8b99ac;
  --line:#1c2531; --accent:#3fb0ff; --glow: 0 0 8px rgba(63,176,255,0.9), 0 0 22px rgba(63,176,255,0.5);
  --icon-fill:#3fb0ff; --shadow: 0 20px 50px rgba(0,0,0,0.55);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{ background:var(--bg); color:var(--text); font-family:'Inter', sans-serif; transition:background .5s ease, color .5s ease; overflow-x:hidden; }
h1,h2,h3{font-family:'Space Grotesk', sans-serif; letter-spacing:-0.02em;}
.eyebrow{ font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:2.5px; text-transform:uppercase; color:var(--accent); display:inline-block; margin-bottom:14px; }
.wrap{max-width:1080px; margin:0 auto; padding:0 28px;}
a{color:inherit;} img{max-width:100%; display:block;}
#cursorGlow{ position:fixed; width:420px; height:420px; border-radius:50%; pointer-events:none; z-index:1; background:radial-gradient(circle, rgba(21,94,239,0.15), transparent 70%); transform:translate(-50%,-50%); transition:opacity .3s ease; opacity:0; }
html[data-theme="dark"] #cursorGlow{ background:radial-gradient(circle, rgba(63,176,255,0.18), transparent 70%); }
nav{ position:fixed; top:0; left:0; right:0; z-index:50; backdrop-filter:blur(14px); background:color-mix(in srgb, var(--bg) 78%, transparent); border-bottom:1px solid var(--line); }
nav .wrap{display:flex; align-items:center; justify-content:space-between; height:66px; gap:18px;}
.logo{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.15rem; white-space:nowrap;}
.back-link{ display:flex; align-items:center; gap:8px; font-family:'IBM Plex Mono',monospace; font-size:0.78rem; color:var(--text-muted); text-decoration:none; transition:color .3s ease; }
.back-link:hover{ color:var(--accent); }
.nav-right{ display:flex; align-items:center; gap:12px; }
.lang-switch{ display:flex; border:1px solid var(--line); border-radius:999px; overflow:hidden; }
.lang-btn{ font-family:'IBM Plex Mono', monospace; font-size:0.68rem; letter-spacing:1px; padding:8px 11px; background:transparent; border:none; color:var(--text-muted); cursor:pointer; transition:color .3s ease, background .3s ease; }
.lang-btn.active{ color:#fff; background:var(--accent); }
.lang-btn:not(.active):hover{ color:var(--text); }
.theme-toggle{ width:42px; height:42px; border-radius:50%; border:1px solid var(--line); background:var(--surface); cursor:pointer; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; transition:border-color .3s ease, transform .3s ease; flex-shrink:0; }
.theme-toggle:hover{ transform:scale(1.08); border-color:var(--accent); }
.theme-toggle svg{ width:19px; height:19px; stroke:var(--icon-fill); transition:transform .5s cubic-bezier(.4,1.8,.5,1); filter:drop-shadow(var(--glow)); }
html[data-theme="dark"] .theme-toggle svg{ transform:rotate(180deg); }
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }
header.page-head{ padding:150px 0 60px; }
header.page-head h1{ font-size:clamp(2rem,4.6vw,3.2rem); line-height:1.08; margin-bottom:20px; max-width:760px;}
header.page-head p{ color:var(--text-muted); font-size:1.05rem; line-height:1.7; max-width:700px; }
section.cases{ padding:20px 0 120px; }
.case{ border-top:1px solid var(--line); padding:56px 0; }
.case-tag{ font-family:'IBM Plex Mono',monospace; font-size:0.72rem; color:var(--accent); letter-spacing:1.5px; text-transform:uppercase; display:block; margin-bottom:10px;}
.case h2{ font-size:clamp(1.4rem,2.6vw,1.9rem); margin-bottom:6px;}
.case .case-sub{ color:var(--text-muted); font-size:0.9rem; margin-bottom:22px;}
.case p.case-context{ color:var(--text-muted); font-size:1rem; line-height:1.75; max-width:820px; margin-bottom:30px;}
.metrics-row{ display:flex; gap:26px; margin-bottom:30px; flex-wrap:wrap;}
.metric{ font-family:'Space Grotesk',sans-serif; max-width:210px; }
.metric .m-num{ font-size:2rem; font-weight:700; color:var(--accent);}
.metric .m-lbl{ font-size:.72rem; color:var(--text-muted); font-family:'IBM Plex Mono',monospace; text-transform:uppercase; letter-spacing:.5px;}
.m-prefix{ display:block; font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:1px; text-transform:uppercase; color:var(--text-muted); margin-bottom:2px; }
.case-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
@media(max-width:760px){ .case-grid{ grid-template-columns:1fr; } }
.case-field{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:20px 22px; transition:border-color .3s ease, transform .3s ease; }
.case-field:hover{ border-color:var(--accent); transform:translateY(-3px); }
.case-field h4{ font-family:'IBM Plex Mono',monospace; font-size:0.68rem; letter-spacing:1.5px; text-transform:uppercase; color:var(--accent); margin-bottom:10px; }
.case-field p{ color:var(--text-muted); font-size:0.9rem; line-height:1.6; }
.case-field ul{ list-style:none; display:flex; flex-direction:column; gap:6px; margin-top:4px;}
.case-field li{ color:var(--text-muted); font-size:0.88rem; line-height:1.5; padding-left:14px; position:relative;}
.case-field li::before{ content:""; position:absolute; left:0; top:7px; width:4px; height:4px; border-radius:50%; background:var(--accent); }
.result-banner{ margin-top:18px; padding:18px 22px; border-left:2px solid var(--accent); background:var(--surface-2); border-radius:0 var(--radius) var(--radius) 0; }
.result-banner h4{ font-family:'IBM Plex Mono',monospace; font-size:0.68rem; letter-spacing:1.5px; text-transform:uppercase; color:var(--accent); margin-bottom:8px; }
.result-banner p{ color:var(--text); font-size:0.94rem; line-height:1.6; }
footer.page-foot{ padding:60px 0; text-align:center; color:var(--text-muted); font-size:0.78rem; font-family:'IBM Plex Mono',monospace; }
.magnetic{ display:inline-block; }

/* Caso 01, blocos dinâmicos */
.case-field-wide{ grid-column:1 / -1; }
.block-label{ font-family:'IBM Plex Mono',monospace; font-size:0.72rem; letter-spacing:1.5px; text-transform:uppercase; color:var(--accent); display:block; margin:40px 0 16px; }

.journey-steps{ display:flex; align-items:flex-start; gap:18px; margin-bottom:36px; }
.journey-step{ flex:1; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:20px 18px 18px; opacity:0; transform:translateY(24px); transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1); }
.journey-steps.is-visible .journey-step{ opacity:1; transform:translateY(0); }
.journey-step:nth-child(1){ transition-delay:0s; }
.journey-step:nth-child(2){ transition-delay:.12s; }
.journey-step:nth-child(3){ transition-delay:.24s; }
.journey-step:nth-child(4){ transition-delay:.36s; }
.journey-step.is-active{ border-color:var(--accent); box-shadow:var(--glow); }
.journey-num{ display:flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:var(--accent); color:var(--bg); font-family:'IBM Plex Mono',monospace; font-size:0.75rem; font-weight:600; margin-bottom:12px; }
.journey-step h5{ font-family:'Space Grotesk',sans-serif; font-size:0.98rem; margin-bottom:8px; }
.journey-step p{ color:var(--text-muted); font-size:0.85rem; line-height:1.55; }
@media(max-width:760px){ .journey-steps{ flex-direction:column; } }

.journey-step-form{ display:flex; flex-direction:column; }
.form-mock-crumb{ display:block; font-family:'IBM Plex Mono',monospace; font-size:0.62rem; letter-spacing:.8px; text-transform:uppercase; color:var(--text-muted); margin-bottom:12px; }
.form-mock-crumb b{ color:var(--accent); font-weight:600; }
.form-mock{ display:flex; flex-direction:column; gap:7px; }
.form-mock-row{ display:flex; gap:7px; }
.form-field{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:6px 9px; }
.form-field-sm{ flex:0 0 46px; }
.form-label{ font-family:'IBM Plex Mono',monospace; font-size:0.58rem; letter-spacing:.3px; text-transform:uppercase; color:var(--text-muted); }
.form-value{ font-family:'Space Grotesk',sans-serif; font-size:0.8rem; color:var(--text); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.form-group-label{ font-family:'IBM Plex Mono',monospace; font-size:0.6rem; letter-spacing:1px; text-transform:uppercase; color:var(--accent); margin:5px 0 -1px; }
.form-save-btn{ margin-top:12px; width:100%; display:flex; align-items:center; justify-content:center; gap:7px; padding:10px; border-radius:999px; border:1px solid var(--accent); background:transparent; color:var(--accent); font-family:'IBM Plex Mono',monospace; font-size:0.72rem; letter-spacing:1px; text-transform:uppercase; transition:background .3s ease, color .3s ease, transform .15s ease; }
.form-save-check{ width:13px; height:13px; opacity:0; transform:scale(.5); transition:opacity .25s ease, transform .25s ease; }
.form-save-btn.is-pressed{ transform:scale(.96); background:var(--accent); color:var(--bg); }
.form-save-btn.is-saved{ background:var(--accent); color:var(--bg); }
.form-save-btn.is-saved .form-save-check{ opacity:1; transform:scale(1); }

.backlog-box{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:22px 24px; }
.backlog-box-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:18px; }
.backlog-box-head h5{ font-family:'Space Grotesk',sans-serif; font-size:1rem; color:var(--text); }
.backlog-toggle{ flex-shrink:0; font-family:'IBM Plex Mono',monospace; font-size:0.72rem; letter-spacing:1px; text-transform:uppercase; color:var(--accent); background:transparent; border:1px solid var(--accent); border-radius:999px; padding:8px 16px; cursor:pointer; transition:background .3s ease, color .3s ease; white-space:nowrap; }
.backlog-toggle:hover{ background:var(--accent); color:var(--bg); }
.backlog-collapse{ max-height:260px; overflow:hidden; position:relative; transition:max-height .6s cubic-bezier(.2,.7,.3,1); }
.backlog-collapse::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:56px; background:linear-gradient(to bottom, transparent, var(--surface)); pointer-events:none; transition:opacity .3s ease; }
.backlog-collapse.is-open{ max-height:2200px; }
.backlog-collapse.is-open::after{ opacity:0; }
.backlog-list{ display:flex; flex-direction:column; gap:10px; }
.backlog-item{ display:flex; align-items:flex-start; gap:14px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:14px 18px; opacity:0; transform:translateY(16px); transition:opacity .6s cubic-bezier(.2,.7,.3,1), transform .6s cubic-bezier(.2,.7,.3,1); }
.backlog-list.is-visible .backlog-item{ opacity:1; transform:translateY(0); }
.backlog-item:nth-child(1){ transition-delay:0s; } .backlog-item:nth-child(2){ transition-delay:.04s; } .backlog-item:nth-child(3){ transition-delay:.08s; } .backlog-item:nth-child(4){ transition-delay:.12s; } .backlog-item:nth-child(5){ transition-delay:.16s; } .backlog-item:nth-child(6){ transition-delay:.2s; } .backlog-item:nth-child(7){ transition-delay:.24s; } .backlog-item:nth-child(8){ transition-delay:.28s; } .backlog-item:nth-child(9){ transition-delay:.32s; } .backlog-item:nth-child(10){ transition-delay:.36s; } .backlog-item:nth-child(11){ transition-delay:.4s; } .backlog-item:nth-child(12){ transition-delay:.44s; } .backlog-item:nth-child(13){ transition-delay:.48s; }
.backlog-priority{ flex-shrink:0; width:30px; height:30px; border-radius:8px; background:var(--surface-2); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-family:'IBM Plex Mono',monospace; font-size:0.72rem; color:var(--accent); }
.backlog-item p{ color:var(--text-muted); font-size:0.88rem; line-height:1.55; padding-top:5px; }

.sprint-timeline{ position:relative; display:flex; gap:14px; padding-top:24px; margin-bottom:30px; }
.sprint-timeline::before{ content:""; position:absolute; top:9px; left:0; right:0; height:2px; background:var(--line); }
.sprint-timeline::after{ content:""; position:absolute; top:9px; left:0; width:0; height:2px; background:var(--accent); transition:width 1.2s cubic-bezier(.2,.7,.3,1); }
.sprint-timeline.is-visible::after{ width:100%; }
.sprint-dot{ position:absolute; top:9px; left:0; width:12px; height:12px; margin-top:-5px; margin-left:-6px; border-radius:50%; background:var(--accent); box-shadow:var(--glow); transition:left 1.4s cubic-bezier(.4,0,.2,1); z-index:2; }
.sprint-block{ flex:1; text-align:center; opacity:0; transform:translateY(10px); transition:opacity .5s ease, transform .5s ease; }
.sprint-timeline.is-visible .sprint-block{ opacity:1; transform:translateY(0); }
.sprint-block:nth-child(2){ transition-delay:.1s; } .sprint-block:nth-child(3){ transition-delay:.2s; } .sprint-block:nth-child(4){ transition-delay:.3s; } .sprint-block:nth-child(5){ transition-delay:.4s; } .sprint-block:nth-child(6){ transition-delay:.5s; }
.sprint-block span{ display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:0.7rem; color:var(--text-muted); background:var(--bg); padding:4px 10px; border:1px solid var(--line); border-radius:999px; transition:border-color .3s ease, color .3s ease, box-shadow .3s ease; }
.sprint-block.is-active span{ border-color:var(--accent); color:var(--accent); box-shadow:var(--glow); }
.sprint-groups{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
@media(max-width:760px){ .sprint-timeline{ flex-wrap:wrap; } .sprint-groups{ grid-template-columns:1fr; } }
.sprint-group{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px; opacity:0; transform:translateY(16px); transition:opacity .6s cubic-bezier(.2,.7,.3,1), transform .6s cubic-bezier(.2,.7,.3,1); }
.sprint-groups.is-visible .sprint-group{ opacity:1; transform:translateY(0); }
.sprint-group:nth-child(2){ transition-delay:.1s; } .sprint-group:nth-child(3){ transition-delay:.2s; }
.sprint-group h5{ font-family:'IBM Plex Mono',monospace; font-size:0.72rem; letter-spacing:1px; text-transform:uppercase; color:var(--accent); margin-bottom:8px; }
.sprint-group p{ color:var(--text-muted); font-size:0.86rem; line-height:1.55; }

.refine-toggle{ display:flex; gap:10px; margin-bottom:20px; }
.refine-btn{ font-family:'IBM Plex Mono',monospace; font-size:0.75rem; letter-spacing:1px; text-transform:uppercase; padding:9px 20px; border-radius:999px; border:1px solid var(--line); background:var(--surface); color:var(--text-muted); cursor:pointer; transition:border-color .3s ease, color .3s ease, background .3s ease; }
.refine-btn.is-active{ border-color:var(--accent); color:var(--accent); background:var(--surface-2); }
.refine-panels{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:24px 26px; }
.refine-panel{ display:none; }
.refine-panel.is-active{ display:block; animation:refineIn .5s cubic-bezier(.2,.7,.3,1); }
@keyframes refineIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:translateY(0); } }
.refine-panel h5{ font-family:'IBM Plex Mono',monospace; font-size:0.72rem; letter-spacing:1px; text-transform:uppercase; color:var(--accent); margin-bottom:10px; }
.refine-panel h5 ~ h5{ margin-top:20px; }
.refine-panel ul{ list-style:none; display:flex; flex-direction:column; gap:6px; margin:10px 0 4px; }
.refine-panel li{ color:var(--text-muted); font-size:0.88rem; line-height:1.5; padding-left:14px; position:relative; }
.refine-panel li::before{ content:""; position:absolute; left:0; top:7px; width:4px; height:4px; border-radius:50%; background:var(--accent); }
.refine-raw{ font-family:'Space Grotesk',sans-serif; font-size:1.05rem; color:var(--text); margin-bottom:14px; }
.refine-note{ font-family:'IBM Plex Mono',monospace; font-size:0.68rem; letter-spacing:1px; text-transform:uppercase; color:var(--text-muted); margin-bottom:12px; }
.refine-panel > p{ color:var(--text-muted); font-size:0.92rem; line-height:1.65; }
.qa-chat{ display:flex; flex-direction:column; gap:8px; }
.qa-line{ font-size:0.86rem; line-height:1.55; padding:10px 14px; border-radius:var(--radius); max-width:88%; }
.qa-line span{ display:block; font-family:'IBM Plex Mono',monospace; font-size:0.65rem; letter-spacing:1px; text-transform:uppercase; color:var(--accent); margin-bottom:4px; }
.qa-q{ background:var(--surface-2); color:var(--text); align-self:flex-start; }
.qa-a{ background:var(--bg); border:1px solid var(--line); color:var(--text-muted); align-self:flex-end; }
.estimate-badge{ display:inline-flex; align-items:center; gap:8px; margin-top:18px; padding:8px 16px; border-radius:999px; border:1px solid var(--accent); font-family:'IBM Plex Mono',monospace; font-size:0.75rem; color:var(--accent); }
.estimate-badge span{ color:var(--text-muted); }
@media(max-width:600px){ .qa-line{ max-width:100%; } }

/* Caso 02, blocos dinâmicos */
.sprint-groups-2{ grid-template-columns:repeat(2,1fr); }

.impact-compare{ display:flex; align-items:stretch; gap:18px; }
.impact-card{ flex:1; border-radius:var(--radius); padding:28px 26px; }
.impact-before{ background:var(--surface); border:1px solid var(--line); }
.impact-after{ background:var(--accent); border:1px solid var(--accent); }
.impact-tag{ display:block; font-family:'IBM Plex Mono',monospace; font-size:0.7rem; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:12px; }
.impact-before .impact-tag{ color:var(--text-muted); }
.impact-after .impact-tag{ color:var(--bg); opacity:.8; }
.impact-text{ font-family:'Space Grotesk',sans-serif; }
.impact-before .impact-text{ color:var(--text); font-size:1.05rem; }
.impact-after .impact-text{ color:var(--bg); font-size:1.25rem; font-weight:600; }
.impact-arrow{ display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:var(--accent); flex-shrink:0; }
@media(max-width:640px){ .impact-compare{ flex-direction:column; } .impact-arrow{ transform:rotate(90deg); } }

.decision-compare{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
@media(max-width:760px){ .decision-compare{ grid-template-columns:1fr; } }
.decision-card{ border-radius:var(--radius); padding:22px 24px; border:1px solid var(--line); background:var(--surface); }
.decision-discarded{ opacity:.6; }
.decision-discarded h5{ text-decoration:line-through; color:var(--text-muted); }
.decision-chosen{ border-color:var(--accent); box-shadow:var(--glow); }
.decision-tag{ display:block; font-family:'IBM Plex Mono',monospace; font-size:0.68rem; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:10px; }
.decision-discarded .decision-tag{ color:var(--text-muted); }
.decision-chosen .decision-tag{ color:var(--accent); }
.decision-card h5{ font-family:'Space Grotesk',sans-serif; font-size:1.05rem; margin-bottom:10px; }
.decision-card p{ color:var(--text-muted); font-size:0.9rem; line-height:1.6; }
.decision-criteria{ margin-top:18px; padding:16px 20px; border-left:2px solid var(--accent); background:var(--surface-2); border-radius:0 var(--radius) var(--radius) 0; font-size:0.9rem; line-height:1.6; color:var(--text); }
.decision-criteria span{ display:block; font-family:'IBM Plex Mono',monospace; font-size:0.68rem; letter-spacing:1.5px; text-transform:uppercase; color:var(--accent); margin-bottom:6px; }

/* Caso 03, blocos dinâmicos */
.scope-table{ border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); overflow:hidden; }
.scope-row{ display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:12px; align-items:center; padding:14px 20px; border-bottom:1px solid var(--line); opacity:0; transform:translateY(14px); transition:opacity .5s cubic-bezier(.2,.7,.3,1), transform .5s cubic-bezier(.2,.7,.3,1); }
.scope-table.is-visible .scope-row{ opacity:1; transform:translateY(0); }
.scope-row:nth-child(1){ transition-delay:0s; } .scope-row:nth-child(2){ transition-delay:.08s; } .scope-row:nth-child(3){ transition-delay:.16s; } .scope-row:nth-child(4){ transition-delay:.24s; } .scope-row:nth-child(5){ transition-delay:.32s; }
.scope-row:last-child{ border-bottom:none; }
.scope-head{ background:var(--surface-2); }
.scope-head .scope-col{ font-family:'IBM Plex Mono',monospace; font-size:0.68rem; letter-spacing:1px; text-transform:uppercase; color:var(--text-muted); }
.scope-col-module{ font-family:'Space Grotesk',sans-serif; font-size:0.92rem; color:var(--text); }
.scope-old-value{ color:var(--text-muted); text-decoration:line-through; font-size:0.9rem; }
.scope-new-value{ color:var(--accent); font-weight:700; font-size:1rem; }
.scope-total{ background:var(--surface-2); }
.scope-total .scope-col-module, .scope-total .scope-old-value, .scope-total .scope-new-value{ font-weight:700; }
@media(max-width:640px){ .scope-row{ padding:12px 14px; gap:8px; } .scope-col-module{ font-size:0.82rem; } .scope-old-value, .scope-new-value{ font-size:0.82rem; } }