/* The studio: four expandable chapters, one shared canvas. */
.method { background:#eeebe5; }
.method-grid { grid-template-columns:1fr; gap:36px; }
.method-sticky { position:static; max-width:840px; }
.method-sticky h2 { max-width:850px; }
.method-sticky p { max-width:650px; }
.method-sticky p strong { color:#502f82; }
.method-workshop { padding:26px; background:#101327; border:0; border-radius:30px; box-shadow:0 30px 70px #25244020; }
.workshop-header { color:#c7bfdc; font-size:.63rem; letter-spacing:.12em; margin-bottom:24px; }
.method-list { display:flex; gap:12px; border:0; align-items:stretch; }
.method-phase { position:relative; flex:1; min-width:0; border:1px solid #ffffff1f; border-radius:22px; padding:22px; color:white; overflow:hidden; background:linear-gradient(150deg,#32244c,#181b32); transition:flex .55s cubic-bezier(.2,.7,.2,1), background .3s; }
.method-phase:nth-child(2) { background:linear-gradient(150deg,#203c50,#181b32); }
.method-phase:nth-child(3) { background:linear-gradient(150deg,#343948,#181b32); }
.method-phase:nth-child(4) { background:linear-gradient(150deg,#413354,#181b32); }
.method-phase:last-child { border:1px solid #ffffff1f; }
.method-phase::after { content:""; position:absolute; width:170px; height:170px; border:1px solid #ffffff18; border-radius:50%; bottom:-60px; right:-80px; pointer-events:none; box-shadow:0 0 0 28px #ffffff04,0 0 0 56px #ffffff03; }
.method-phase[open] { flex:3.5; background:linear-gradient(135deg,#493475,#20203b 70%); }
.method-phase summary { display:flex; min-height:385px; flex-direction:column; align-items:flex-start; justify-content:space-between; padding:0; gap:26px; position:relative; z-index:1; }
.method-phase summary > span { font:italic clamp(2.8rem,5vw,4.8rem)/1 var(--serif); color:#d0c0f5; letter-spacing:-.05em; }
.method-phase summary h3 { font:1.24rem/1.25 var(--serif); max-width:230px; }
.method-phase summary b { color:#d6ff66; font-weight:400; border:1px solid #ffffff30; border-radius:50%; width:36px; height:36px; display:grid; place-items:center; }
.method-phase[open] summary { min-height:0; display:grid; grid-template-columns:auto 1fr 36px; gap:20px; align-items:center; }
.method-phase[open] summary > span { color:#d6ff66; font-size:3.4rem; }
.method-phase[open] summary h3 { font-size:1.6rem; }
.method-phase .phase-body { position:relative; z-index:1; padding:22px 0 0; animation:phase-enter .5s both; }
.method-phase .phase-body p { color:#e0dceb; font-size:.88rem; margin:18px 0; }
.method-phase .phase-body small { display:inline-block; padding:6px 10px; border:1px solid #cbb4ff42; border-radius:8px; color:#e0fda0; font-size:.66rem; }
.method-phase .phase-art { height:150px; background:radial-gradient(ellipse at 60% 30%,#ad89ff33,transparent 65%),#15192c; border:1px solid #ffffff12; }
.method-phase .phase-art span { color:#d0c4ee; letter-spacing:.2em; }
.method-phase .art-discover i { border-color:#b99af9; background:#a181ea20; }
.method-phase .art-discover i:nth-child(2) { background:#ab88ff55; }
.method-phase .art-discover i:nth-child(3) { background:#d6ff66; }
.method-phase .art-connect::after { z-index:0; border-color:#a985f2; }
.method-phase .art-connect i { z-index:1; }
@media (hover:hover) { .method-phase summary:hover h3 { color:#d6ff66; } .method-phase:not([open]):hover { border-color:#b999ff; } }

/* A compact sector switchboard with a photographic stage. */
.verticals { padding:70px 0; background:radial-gradient(ellipse at 0 0,#493078,transparent 65%),#141324; }
.verticals > .container { display:grid; grid-template-columns:.8fr 1.3fr; gap:50px; align-items:center; }
.verticals .section-head { margin:0; }
.verticals .section-head h2 { font-size:clamp(2.2rem,3.6vw,3.5rem); }
.verticals .section-head p { font-size:.9rem; color:#d2cbdf; }
.sector-console { min-width:0; }
.sector-console-label { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#cbb9e4; font-size:.58rem; letter-spacing:.11em; margin-bottom:12px; }
.sector-pause { color:#e2d9ef; background:transparent; border:1px solid #ffffff30; border-radius:30px; padding:6px 10px; cursor:pointer; font-size:.61rem; letter-spacing:0; min-height:34px; }
.sector-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-bottom:14px; }
.sector-tabs button { text-align:left; display:grid; grid-template-columns:1fr auto; gap:5px; padding:12px; border:1px solid #ffffff26; border-radius:12px; color:#eee5ff; background:#ffffff06; font-size:.71rem; cursor:pointer; transition:background .2s,color .2s; }
.sector-tabs button > span { grid-column:1 / -1; font-size:.52rem; opacity:.72; }
.sector-tabs button b { color:#d6ff66; font-weight:400; }
.sector-tabs button[aria-selected="true"] { color:#17202a; background:#d6ff66; border-color:#d6ff66; }
.sector-tabs button[aria-selected="true"] b { color:#17202a; }
.sector-panel { position:relative; min-height:350px; isolation:isolate; border-radius:22px; overflow:hidden; background:#1b2035; border:1px solid #ffffff25; }
.sector-panel[hidden] { display:none; }
.sector-panel:not([hidden]) { animation:sector-in .5s both; }
.sector-panel > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.sector-panel::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,#090e1b15,#090e1be8 65%,#090e1b); }
.sector-panel-content { min-height:350px; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; padding:26px; }
.sector-kicker { color:#dcff86; font-size:.58rem; letter-spacing:.12em; margin-bottom:12px; padding:5px 9px; border-radius:30px; background:#101327d9; }
.sector-panel h3 { color:white; margin:0 0 10px; font:1.9rem/1.08 var(--serif); max-width:430px; }
.sector-panel p { color:#e3e3ec; font-size:.8rem; line-height:1.6; margin:0 0 18px; max-width:440px; }
.sector-links { display:flex; gap:9px; flex-wrap:wrap; }
.sector-links a { display:inline-flex; gap:16px; justify-content:space-between; align-items:center; padding:10px 13px; min-height:44px; background:#fff; border-radius:8px; color:#262037; text-decoration:none; font-size:.7rem; font-weight:700; }
.sector-links a:hover { background:#d6ff66; }
.sector-stage > .sector-panel + .sector-panel:not([hidden]) { margin-top:16px; }
.sector-console.is-enhanced .sector-stage > .sector-panel { margin-top:0; }
@keyframes sector-in { from { opacity:.5; transform:translateY(7px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:980px) {
 .method-phase { padding:16px; }
 .method-phase[open] { flex:3; }
 .method-phase[open] summary { gap:12px; grid-template-columns:1fr 30px; }
 .method-phase[open] summary > span { grid-column:1 / -1; font-size:3rem; }
 .method-phase[open] summary h3 { font-size:1.35rem; }
 .method-phase summary h3 { font-size:1.08rem; }
 .verticals > .container { grid-template-columns:.8fr 1.2fr; gap:28px; }
 .sector-tabs button { padding:9px; font-size:.66rem; }
}
@media (max-width:700px) {
 .method-grid { gap:24px; }
 .method-workshop { padding:18px; border-radius:22px; }
 .workshop-header { flex-direction:column; gap:6px; font-size:.55rem; }
 .method-list { flex-direction:column; }
 .method-phase, .method-phase[open] { flex:initial; padding:18px; border-radius:16px; }
 .method-phase summary, .method-phase[open] summary { min-height:0; display:grid; grid-template-columns:42px 1fr 30px; gap:12px; align-items:center; }
 .method-phase summary > span, .method-phase[open] summary > span { font-size:2.5rem; grid-column:auto; }
 .method-phase summary h3, .method-phase[open] summary h3 { font-size:1.15rem; }
 .method-phase summary b { width:30px; height:30px; }
 .method-phase .phase-body { padding-top:20px; }
 .verticals > .container { grid-template-columns:1fr; gap:25px; }
 .verticals { padding:55px 0; }
 .verticals .section-head { max-width:540px; }
 .sector-panel h3 { font-size:1.8rem; }
 .sector-panel-content { padding:22px; }
}
@media (max-width:360px) { .method-workshop { padding:12px; } .method-phase { padding:14px; } .method-phase summary h3,.method-phase[open] summary h3 { font-size:1rem; } .sector-tabs button { font-size:.6rem; padding:8px; } .sector-panel-content { padding:18px; } }
@media (prefers-reduced-motion:reduce) { .method-phase,.sector-tabs button { transition:none; } .method-phase .phase-body,.sector-panel:not([hidden]) { animation:none; } }