:root{--media-radius:12px;--media-edge:#d7dee3;--case-highlight:#FFF0E5;--case-highlight-strong:#FFD28C}
.image-zoom{display:block;width:100%;padding:0;margin:0;border:0;background:none;cursor:zoom-in;color:inherit;font:inherit;text-align:inherit}
.image-zoom img{display:block;width:100%;height:auto;border:1px solid var(--media-edge);border-radius:var(--media-radius)}
.product-presentation{width:100%;min-width:0}
.product-frame{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;border:1px solid var(--media-edge);border-radius:var(--media-radius);background:#f2f3f5;isolation:isolate}
.product-frame iframe{position:absolute;left:0;top:0;width:1440px;height:960px;border:0;max-width:none;transform-origin:0 0;pointer-events:none;background:#f2f3f5;display:block}
.product-presentation[data-appearance=dark] .product-frame{border-color:#465260;background:#17171a}
.presentation-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:14px;min-height:32px}
.theme-options{display:flex;gap:4px;align-items:center}
.theme-options button,.playback-toggle{border:0;font:400 14px/1.5 General Sans,Arial,sans-serif;color:#59625d;background:none;padding:4px 10px;cursor:pointer;border-radius:4px}
.theme-options button[aria-pressed=true]{background:#f1f3f2;color:#262927}
.playback-toggle{margin-left:auto;display:flex;gap:7px;align-items:center;color:#414a45}
.playback-toggle:before{content:'Ⅱ';font-size:14px;font-weight:500;line-height:1}
.playback-toggle[data-paused=true]:before{content:'▷'}
.product-presentation[data-static=true] .presentation-controls{justify-content:flex-end}
.roles{display:block;margin-top:36px}
.role{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:48px;align-items:center}
.role+.role{margin-top:48px}
.role .media-block{margin:0!important}
.role-copy h3{margin:0!important}
.role-copy p{font-size:18px;line-height:1.65;margin-top:20px!important}
.scene-illustration{display:block;width:100%;height:auto;border:0;border-radius:0;overflow:hidden}
.illustrated-intro{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:48px;align-items:center;margin-top:28px}
.illustrated-intro p{margin:0!important}
.direction-heading{margin-bottom:36px}
.direction>.media-block{margin-top:0}
.direction-copy{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:28px}
.direction-copy h4{font-size:18px;line-height:1.65;font-weight:500;letter-spacing:0;margin:0 0 10px}
.direction-copy p{font-size:18px;line-height:1.65;margin:0}
.direction+.direction{margin-top:80px}
.journey-redraw,.tradeoff-visual,.dual-flow{container-type:inline-size}
.visual-heading h3{margin:0 0 32px!important}
.journey-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.journey-step{position:relative;min-width:0}
.journey-stage{font-size:15px;line-height:1.5;display:flex;gap:8px;align-items:center;margin-bottom:18px;font-weight:500}
.journey-stage b{font-weight:500;color:#cd3b1e}
.journey-step svg{width:100%;height:auto;display:block;margin-bottom:20px}
.journey-step:not(:last-child):after{content:'→';position:absolute;right:-18px;top:100px;font-size:17px;color:#8c9690}
.journey-step h4{font-size:18px;line-height:1.45;font-weight:500;margin:0 0 12px}
.journey-step p{font-size:16px;line-height:1.65;margin:0}
.journey-feeling{display:block;font-size:16px;line-height:1.5;color:#a43e29;margin-top:20px}
.tradeoff-visual>h3{margin-bottom:28px!important}
.tradeoff-inputs{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.tradeoff-inputs>div{padding:28px;background:#f4f6f5;border-radius:var(--media-radius)}
.tradeoff-inputs>div:nth-child(2){background:var(--case-highlight)}
.decision-owner{display:block;font-size:16px;line-height:1.5;font-weight:500;margin-bottom:14px;color:#59625d}
.tradeoff-visual h4{font-size:24px;line-height:1.35;letter-spacing:-.3px;font-weight:500;margin:0 0 18px}
.tradeoff-visual p,.decision-cost{font-size:18px;line-height:1.65;margin:0}
.decision-cost{display:block;margin-top:20px;color:#59625d}
.converging-lines{width:100%;height:58px;display:block}
.mvp-decision{padding:28px 32px;text-align:center;background:var(--case-highlight);border-radius:var(--media-radius)}
.mvp-decision h4{margin:0 0 12px}
.dual-flow{margin-bottom:36px}
.dual-row{display:grid;grid-template-columns:120px 1fr 1fr;gap:20px;align-items:center}
.lane-name{font-size:18px;font-weight:500;line-height:1.5}
.dual-row>div{padding:24px;background:#f4f6f5;border-radius:var(--media-radius)}
.dual-row b{display:block;font-size:18px;font-weight:500;line-height:1.5}
.dual-row div span{display:block;font-size:16px;line-height:1.6;margin-top:10px}
.seller-lane>div{background:var(--case-highlight)}
.flow-bridge{display:flex;flex-direction:column;align-items:center;gap:10px;margin:24px 0 24px 140px;font-size:16px;line-height:1.5;color:#59625d}
.flow-bridge>span:last-child{font-size:22px}
.impact-visual{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.visual-eyebrow{display:block;font-size:16px;line-height:1.5;font-weight:500;color:#59625d}
.impact-unit{min-width:0}
.impact-unit h3{font-size:32px!important;line-height:1.2;margin:14px 0 28px!important;letter-spacing:-.6px}
.impact-unit p{font-size:16px;line-height:1.6;margin-top:22px!important}
.bar-row{display:grid;grid-template-columns:46px 1fr 40px;align-items:center;gap:10px;margin-top:14px;font-size:14px;color:#59625d}
.bar-row>div{height:10px;background:#f2f3f5;border-radius:3px}
.bar-row i{display:block;height:10px;background:#c9cdd4;border-radius:3px}
.bar-row.after i{background:#EE4D2D}
.bar-row b{font-weight:500;text-align:right;color:#262927}
.effort-line{display:flex;height:18px;gap:5px;margin-top:38px}
.effort-line span{background:#EE4D2D;border-radius:3px}.effort-line i{background:#e5e6eb;border-radius:3px}
.support-impact p.saved-hours{font-size:20px;line-height:1.5;font-weight:500;margin-top:20px!important}
.support-impact p:last-child{margin-top:6px!important}
.related-cover{display:block;width:100%;height:auto;border-radius:var(--media-radius);margin-bottom:20px}
.media-lightbox{position:fixed;width:min(1500px,96vw);max-width:96vw;max-height:96vh;padding:54px 16px 16px;border:0;border-radius:var(--media-radius);background:#fff;color:#262927}
.media-lightbox::backdrop{background:#14171cd1}.media-lightbox>img{display:block;width:100%;height:auto}
.lightbox-close{position:fixed;right:3vw;top:3vh;background:#fff;border:1px solid var(--media-edge);border-radius:6px;font:inherit;padding:10px 14px;cursor:pointer}
button:focus-visible{outline:2px solid #CD3B1E;outline-offset:4px}
@media(min-width:811px) and (max-width:1250px){main,.page-end{max-width:900px}}
@media(max-width:760px){.role,.illustrated-intro{grid-template-columns:1fr 240px;gap:28px}.journey-grid{grid-template-columns:1fr 1fr;gap:36px}.journey-step:after{display:none}.direction-copy{grid-template-columns:1fr;gap:24px}.tradeoff-inputs{gap:20px}.tradeoff-inputs>div{padding:24px}.tradeoff-visual h4{font-size:22px}.dual-row{grid-template-columns:1fr 1fr;gap:16px}.lane-name{grid-column:1/-1}.flow-bridge{margin-left:0}.impact-visual{grid-template-columns:1fr;gap:40px}.impact-unit h3{margin-bottom:22px!important}.effort-line{margin-top:22px}}
@media(max-width:580px){.role,.illustrated-intro{grid-template-columns:1fr;gap:28px}.role .media-block,.illustrated-intro .scene-illustration{width:260px;max-width:100%;justify-self:center}.role+.role{margin-top:48px}.tradeoff-inputs{grid-template-columns:1fr}.converging-lines{height:40px}.mvp-decision{padding:24px}.direction+.direction{margin-top:56px}.journey-grid{grid-template-columns:1fr}.journey-step{display:grid;grid-template-columns:118px minmax(0,1fr);gap:10px 22px}.journey-stage{grid-column:1/-1;margin-bottom:4px;font-size:16px}.journey-step svg{grid-column:1;grid-row:2/5;margin:0}.journey-step h4,.journey-step p,.journey-feeling{grid-column:2;margin:0}.journey-step p{font-size:16px}.journey-feeling{margin-top:6px}.dual-row{grid-template-columns:1fr}.dual-row>div{padding:22px}.presentation-controls{margin-top:10px}.theme-options button,.playback-toggle{font-size:13px}.role-copy p,.direction-copy p,.tradeoff-visual p,.decision-cost{font-size:17px}}
@media(max-width:360px){.journey-step{grid-template-columns:90px minmax(0,1fr);gap:10px 16px}}

.playback-toggle[data-ended=true]:before{content:'↻';font-size:16px}

::selection{background:var(--case-highlight-strong)}

.media-block[id],.hero-media[id]{scroll-margin-top:120px}

/* Shared v1.4 metrics; the project supplies its own accent. */
.page[data-project-detail]{--project-metric-accent:#EE4D2D}
.opening-metrics{margin-top:28px}
.opening-metrics>.label{margin-bottom:20px}
.static-exploration{display:block;width:100%;height:auto;border:1px solid var(--media-edge);border-radius:var(--media-radius)}
.design-snapshot>p{margin:28px 0 36px}
.design-snapshot>.product-presentation{margin-top:36px}
.design-snapshot .product-frame iframe{pointer-events:auto}
.restart-demo{margin-left:auto;border:0;border-radius:4px;background:none;padding:4px 10px;font:400 14px/1.5 General Sans,Arial,sans-serif;color:#414a45;cursor:pointer}
@media(max-width:480px){.design-snapshot>p{margin-bottom:32px}}
