.visual-grid{list-style:none;padding:0;margin:0;display:grid;gap:20px}.visual-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.visual-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.visual-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.visual-card{border:1px solid #d8ded8;border-radius:12px;background:#eef1ec;padding:28px;min-width:0}.visual-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:24px}.card-icon{width:64px;height:64px;border-radius:14px;background:#e4e9e2;color:var(--red);display:grid;place-items:center;flex-shrink:0}.card-icon svg{width:39px;height:39px}.visual-card h3{font-size:23px;line-height:1.28;margin:0 0 12px}.visual-card p{font-size:15px;line-height:1.65;margin:0}.card-detail{display:block;border-top:1px solid #d1d8d0;margin-top:24px;padding-top:15px;color:var(--muted);font-size:12px;line-height:1.6}.role-label{font-size:12px;line-height:1.4;border-radius:5px;padding:5px 7px;background:#e1e6df;color:#46534c;max-width:130px;text-align:right}.step-index{font-size:12px;letter-spacing:.13em;color:var(--muted);display:block;margin-bottom:10px}.process-cards{margin-top:22px}.process-cards .visual-card{padding:24px}.process-cards .visual-card h3{font-size:22px}.process-cards .visual-card-top{min-height:64px}.client-step{background:#f3e9e5;border-color:#d8b7af}.client-step .card-icon{background:var(--red);color:white}.client-step .role-label{background:#e9d8d2;color:#713c32}.on-dark .visual-card{background:#303c45;border-color:#52606a}.on-dark .card-icon{background:#45525a;color:#f1c3b8}.on-dark .role-label{background:#45525a;color:#e1e7e2}.on-dark .step-index{color:#bfcbc6}.on-dark .client-step{border-color:#c8897b;background:#403d40}.on-dark .client-step .card-icon{background:var(--red);color:#fff}.episode-source{display:flex;align-items:center;gap:22px;margin:15px auto 0;width:fit-content;max-width:100%;padding:22px 32px;border:1px solid #b7c3ba;border-radius:12px;background:var(--paper)}.episode-source h3{font-size:24px}.episode-source .step-index{margin-bottom:6px}.ecosystem-connector{width:1px;height:40px;background:#9eada2;margin:auto}.format-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;border-top:1px solid #aebbaf;padding-top:28px}.format-card{position:relative;min-width:0}.format-card:before{content:'';position:absolute;width:1px;height:28px;background:#aebbaf;top:-28px;left:50%}.format-preview{height:190px;background:#cdd5cf;border:1px solid #bbc6bd;border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;padding:20px;position:relative}.media-frame{position:relative;width:100%;overflow:hidden;border-radius:4px}.media-frame img{display:block;width:100%;height:100%;object-fit:cover}.format-clips .media-frame{width:88px;height:156px}.format-clips .media-frame img{object-position:33% center}.sample-caption{position:absolute;bottom:12px;left:0;right:0;text-align:center;color:white;font-size:12px;line-height:1.3;background:#273039de;padding:5px}.sample-title{position:absolute;inset:auto 0 0;background:#273039dc;color:white;padding:9px;font-size:12px}.format-thumbnail .media-frame{width:65%;align-self:flex-end}.sample-headline{position:absolute;left:12px;top:68px;color:var(--paper);font-weight:700;font-size:17px;line-height:1.15;background:var(--ink);padding:12px}.sample-timeline{width:100%;height:4px;background:#a7b2aa;margin-top:10px}.sample-timeline span{display:block;width:40%;height:4px;background:var(--red)}.format-card h3{font-size:20px;margin:19px 0 8px}.format-card p{font-size:14px}.format-note{font-size:12px;margin-top:25px;color:var(--muted)}
@media(max-width:1100px){.visual-grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}.visual-card{padding:24px}.format-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.format-card:nth-child(n+3):before{display:none}.format-preview{height:215px}}
@media(max-width:760px){.visual-grid.cols-2,.visual-grid.cols-3,.visual-grid.cols-4{grid-template-columns:1fr;gap:16px}.visual-card,.process-cards .visual-card{padding:25px}.visual-card-top{margin-bottom:20px}.visual-card h3{font-size:23px}.card-icon{width:60px;height:60px}.card-detail{margin-top:20px}.format-grid{grid-template-columns:1fr;gap:0;border-top:0;padding:0}.format-card{border-left:1px solid #9eada2;margin-left:19px;padding:0 0 28px 25px}.format-card:before{display:block!important;left:0;top:110px;width:25px;height:1px}.format-preview{height:220px}.format-card h3{font-size:23px}.episode-source{width:100%;padding:22px;gap:17px}.episode-source h3{font-size:21px}.ecosystem-connector{margin-left:19px;height:25px}.format-thumbnail .media-frame{max-width:280px}.sample-headline{top:90px;left:23px}.on-dark .visual-card p{color:#cbd2ce}}