/* V1.2 — product-demo interactions and reduced typography scale */
.manifesto-copy h2, .services-head h2, .network-copy h2, .about-title h2 { font-size: clamp(2.25rem, 4vw, 4.7rem); line-height: 1.08; }
.hero h1 { font-size: clamp(3.2rem, 6.5vw, 7rem); }
.partner-copy h2 { font-size: clamp(3.5rem, 8vw, 9rem); }
.contact h2 { font-size: clamp(3.4rem, 8vw, 9rem); }
.section { padding-block: clamp(95px, 10vw, 145px); }

.live-account { display: grid; grid-template-columns: .85fr 1.15fr; gap: 9vw; align-items: center; background: #0d0e12; overflow: hidden; }
.live-copy .side-label { margin-bottom: 65px; }
.live-copy .micro { margin-bottom: 20px; }
.live-copy h2, .format-head h2, .data-copy h2, .process-copy h2 { font: 400 clamp(2.4rem, 4.4vw, 5rem)/1.05 var(--display); letter-spacing: -.065em; }
.live-copy h2 em, .format-head h2 em, .data-copy h2 em, .process-copy h2 em { font-style: normal; background: var(--prism); color: transparent; background-clip: text; }
.live-copy > p:last-of-type, .format-head > p, .data-copy > p, .process-copy > p { max-width: 500px; margin-top: 30px; color: #a5a6ac; line-height: 1.8; }
.live-stats { display: flex; gap: 50px; margin-top: 55px; padding-top: 20px; border-top: 1px solid var(--line); }
.live-stats span { color: #8d8e94; font-size: .7rem; }
.live-stats b { display: block; color: #f3f1ec; font: 400 1.35rem var(--display); margin-bottom: 5px; }
.phone-stage { min-height: 730px; display: grid; place-items: center; position: relative; }
.signal-halo { position: absolute; width: 620px; height: 620px; border-radius: 50%; background: conic-gradient(from 180deg, transparent, #002571, #9d88bc, #e8aa9c, transparent 62%); filter: blur(45px); opacity: .24; animation: haloSpin 16s linear infinite; }
.live-phone { position: relative; z-index: 2; width: 335px; height: 680px; padding: 15px 14px 12px; overflow: hidden; border: 1px solid #ffffff45; border-radius: 48px; background: #08090c; box-shadow: 0 50px 120px #000, inset 0 0 0 5px #1d1e23; transform: rotate(2deg); }
.live-phone { cursor: pointer; touch-action: manipulation; }
.format-tabs button, .process-controls button { touch-action: manipulation; }
.phone-status { display: flex; justify-content: space-between; padding: 5px 15px 12px; font: 500 .55rem var(--mono); }
.phone-status i { width: 76px; height: 19px; margin-top: -5px; border-radius: 999px; background: #000; }
.account-head { display: flex; align-items: center; gap: 10px; padding: 8px; }
.account-head button { margin-left: auto; background: none; border: 0; color: #fff; }
.account-avatar { width: 38px; height: 38px; padding: 2px; border-radius: 50%; background: var(--prism); }
.account-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.account-head strong, .account-head small { display: block; font-size: .65rem; }.account-head small { color: #888; font-size: .5rem; }
.stories { display: flex; gap: 9px; padding: 10px 8px 13px; overflow: hidden; }
.stories i { flex: 0 0 48px; height: 48px; padding: 2px; border-radius: 50%; background: var(--prism); }
.stories img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; border: 2px solid #090a0d; }
.stories .story-add { display: grid; place-items: center; background: #1c1d22; color: #fff; font-style: normal; }
.feed-card { position: relative; border-radius: 4px; overflow: hidden; background: #15161a; }
.feed-card > img { width: 100%; height: 320px; object-fit: cover; transition: opacity .45s, transform .7s; }
.feed-card.swap > img { opacity: .25; transform: scale(1.06); }
.feed-meta { position: absolute; left: 0; right: 0; bottom: 0; padding: 45px 14px 13px; background: linear-gradient(transparent, #000d); }
.feed-meta b, .feed-meta span { display: block; font-size: .62rem; }.feed-meta span { color: #bbb; font-size: .52rem; margin-top: 4px; }
.mini-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; margin-top: 3px; }
.mini-grid img { height: 70px; width: 100%; object-fit: cover; }
.phone-nav { display: flex; justify-content: space-around; align-items: center; padding: 13px 12px; }
.phone-nav i { width: 11px; height: 11px; border: 1px solid #aaa; border-radius: 50%; }.phone-nav .plus { display: grid; place-items: center; width: 25px; height: 20px; border-radius: 5px; font-style: normal; }
.social-notice { position: absolute; right: 10px; top: 120px; z-index: 5; padding: 10px 13px; border-radius: 12px; background: rgba(238,236,231,.94); color: #111; box-shadow: 0 15px 30px #0007; transform: translateX(125%); opacity: 0; transition: .45s; }
.social-notice.show { transform: none; opacity: 1; }.social-notice b, .social-notice span { display: block; }.social-notice b { font: 500 .8rem var(--display); }.social-notice span { font-size: .48rem; }

.format-lab { background: #e7e5df; color: #111; }
.format-head { display: grid; grid-template-columns: .7fr 2fr 1fr; gap: 5vw; align-items: end; margin-bottom: 75px; }
.format-head h2 em { background: none; color: #002571; }
.format-head > p { color: #555; margin: 0; }
.format-stage { position: relative; min-height: 650px; overflow: hidden; background: #15161a; color: #fff; }
.format-scene { position: absolute; inset: 0; opacity: 0; transform: scale(1.03); transition: opacity .65s, transform .8s; pointer-events: none; }
.format-scene.active { opacity: 1; transform: none; }
.scene-billboard { background: linear-gradient(#6f7581 0 48%, #36373a 48%); }
.building { position: absolute; inset: 12% 10% 0 18%; background: repeating-linear-gradient(90deg,#24262c 0 13%,#474a52 13% 15%); clip-path: polygon(8% 0,100% 8%,100% 100%,0 100%); }
.billboard { position: absolute; left: 12%; top: 16%; width: 68%; height: 48%; overflow: hidden; box-shadow: 0 20px 60px #000b; }.billboard img { width: 100%; height: 100%; object-fit: cover; }.billboard::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#001b56ba,transparent 65%); }.billboard span { position:absolute; z-index:2; left:7%; bottom:10%; font:500 clamp(1.4rem,3vw,3.5rem)/.9 var(--display); letter-spacing:-.06em; }
.scene-story { display:grid; place-items:center; background:radial-gradient(circle,#786b85,#1b1c22 55%); }.story-device { position:relative; width:280px; height:560px; border:8px solid #050608; border-radius:38px; overflow:hidden; box-shadow:0 40px 80px #000b; }.story-device img { width:100%; height:100%; object-fit:cover; }.story-device::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#001a50cc,transparent 55%); }.story-device span { position:absolute; z-index:2; left:22px; bottom:35px; font:500 1.5rem/.95 var(--display); }
.scene-editorial { display:grid; place-items:center; background:#b7b3aa; }.magazine { position:relative; width:440px; height:570px; padding:20px; background:#eeeae0; color:#111; transform:rotate(-4deg); box-shadow:20px 30px 70px #0007; }.magazine img { width:100%; height:72%; margin-top:15px; object-fit:cover; }.magazine small { font:.6rem var(--mono); }.magazine b { display:block; margin-top:14px; font:500 1.7rem/.9 var(--display); letter-spacing:-.06em; }
.scene-video { display:grid; place-items:center; background:#08090c; }.video-frame { position:relative; width:76%; aspect-ratio:16/9; overflow:hidden; border:1px solid #ffffff44; }.video-frame img { width:100%; height:100%; object-fit:cover; }.video-frame::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#001a50a8,transparent); }.video-frame i { position:absolute; z-index:2; left:50%; top:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:68px; height:68px; border:1px solid #fff; border-radius:50%; font-style:normal; }.video-frame span { position:absolute; z-index:2; left:30px; bottom:25px; font:400 1rem var(--display); }
.format-tabs { position:absolute; z-index:5; left:20px; right:20px; bottom:20px; display:grid; grid-template-columns:repeat(4,1fr); background:#0a0b0ed9; backdrop-filter:blur(15px); }.format-tabs button { padding:18px 10px; border:0; border-right:1px solid #ffffff1f; background:none; color:#777; font:400 .58rem var(--mono); letter-spacing:.08em; cursor:pointer; }.format-tabs button.active { color:#fff; background:#ffffff10; }

.data-lab { display:grid; grid-template-columns:.75fr 1.25fr; gap:8vw; padding:130px 6vw; background:#101116; }
.data-copy .side-label { margin-bottom:55px; }.chart-card { align-self:center; padding:28px; border:1px solid var(--line); background:#0b0c10; }.chart-top { display:flex; justify-content:space-between; font:400 .58rem var(--mono); letter-spacing:.12em; }.chart-top b { color:#9eafff; }.chart-top i { display:inline-block; width:6px; height:6px; margin-right:6px; border-radius:50%; background:#ff9eb9; box-shadow:0 0 12px #ff8baa; }.chart-card svg { width:100%; overflow:visible; margin:35px 0 15px; }.grid-line { fill:none; stroke:#ffffff12; }.chart-area { fill:url(#area); opacity:0; transition:opacity 1s .5s; }.chart-line { fill:none; stroke:#a9b8ff; stroke-width:3; stroke-linecap:round; stroke-dasharray:1000; stroke-dashoffset:1000; transition:stroke-dashoffset 2.2s ease; }.chart-card circle { fill:#f1d1dc; opacity:0; transition:opacity .3s 2s; }.chart-card.play .chart-line { stroke-dashoffset:0; }.chart-card.play .chart-area,.chart-card.play circle { opacity:1; }.chart-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:#ffffff18; }.chart-metrics span { padding:17px; background:#101116; }.chart-metrics small,.chart-metrics b { display:block; }.chart-metrics small { color:#7e8088; font:.5rem var(--mono); letter-spacing:.1em; }.chart-metrics b { margin-top:8px; font:400 1.45rem var(--display); }

.process-film { display:grid; grid-template-columns:.75fr 1.25fr; gap:8vw; align-items:center; background:#e6e4de; color:#111; }.process-copy .side-label { margin-bottom:50px; }.process-copy h2 em { background:none; color:#002571; }.process-copy > p { color:#555; }.process-controls { margin-top:45px; border-top:1px solid #aaa; }.process-controls button { width:100%; display:flex; gap:20px; padding:15px 5px; border:0; border-bottom:1px solid #aaa; background:none; color:#777; text-align:left; cursor:pointer; }.process-controls button.active { color:#002571; padding-left:18px; }.process-controls b { font:400 .55rem var(--mono); }
.process-screen { position:relative; height:620px; overflow:hidden; background:#0b0c10; }.process-shot { position:absolute; inset:0; opacity:0; transform:translateY(25px) scale(1.03); transition:.65s; }.process-shot.active { opacity:1; transform:none; }.process-shot img { width:100%; height:100%; object-fit:cover; filter:saturate(.75); }.process-shot::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#001a50ae,transparent 55%); }.process-shot span { position:absolute; z-index:2; left:28px; bottom:28px; color:#fff; font:400 .65rem var(--mono); letter-spacing:.15em; }.process-index { position:absolute; z-index:4; right:20px; top:18px; color:#fff; font:.58rem var(--mono); }.process-report { display:grid; place-items:center; background:#0b0c10; }.report-bars { width:72%; height:55%; display:flex; align-items:end; gap:12px; }.report-bars i { flex:1; height:22%; background:linear-gradient(#b1bdff,#002571); animation:barPulse 2.5s ease-in-out infinite alternate; }.report-bars i:nth-child(2){height:38%;animation-delay:.2s}.report-bars i:nth-child(3){height:62%;animation-delay:.4s}.report-bars i:nth-child(4){height:78%;animation-delay:.6s}.report-bars i:nth-child(5){height:96%;animation-delay:.8s}
@keyframes haloSpin { to { transform:rotate(360deg); } } @keyframes barPulse { to { filter:brightness(1.45); transform:scaleY(.92); } }

@media(max-width:900px){.live-account,.data-lab,.process-film{grid-template-columns:1fr}.format-head{grid-template-columns:1fr}.phone-stage{min-height:700px}.format-stage{min-height:580px}.process-screen{height:520px}}
@media(max-width:620px){.hero h1{font-size:11.7vw}.manifesto-copy h2,.services-head h2,.network-copy h2,.about-title h2{font-size:2.15rem}.live-account,.format-lab,.process-film{padding-block:95px}.live-copy h2,.format-head h2,.data-copy h2,.process-copy h2{font-size:2.35rem}.live-copy .side-label,.data-copy .side-label,.process-copy .side-label{margin-bottom:35px}.phone-stage{min-height:630px;transform:scale(.9);margin:-20px 0}.signal-halo{width:420px;height:420px}.live-phone{width:310px;height:630px}.feed-card>img{height:280px}.format-stage{min-height:520px;margin-inline:-22px}.format-tabs{grid-template-columns:1fr 1fr}.format-tabs button{padding:12px 5px}.billboard{width:78%;left:6%}.story-device{width:235px;height:470px}.magazine{width:300px;height:430px}.video-frame{width:92%}.data-lab{padding:95px 22px}.chart-card{padding:18px}.chart-metrics span{padding:11px}.chart-metrics b{font-size:1rem}.process-screen{height:430px}.contact h2{font-size:15vw}.partner-copy h2{font-size:17vw}}
@media(prefers-reduced-motion:reduce){.signal-halo,.report-bars i{animation:none}.chart-line{stroke-dashoffset:0}.chart-area,.chart-card circle{opacity:1}}
