/* The discipline collection: Bennu's identity, rendered as working materials. */
#disciplines { --edition-paper:#ede4d2; --edition-ink:#112334; }
.sv-art-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 0 20px; border-bottom:1px solid #a4b8bf26; margin-bottom:28px; }
.sv-art-toolbar p { margin:0; font:.61rem/1.7 var(--mono); letter-spacing:.07em; color:#a6bbc7; }
.sv-art-toolbar button { display:flex; align-items:center; gap:9px; min-height:40px; padding:9px 15px; border:1px solid #afc0c544; border-radius:99px; color:#dfd3b5; font:.61rem var(--mono); white-space:nowrap; }
.sv-art-toolbar button::before { content:'Ⅱ'; font:700 .8rem var(--sans); }
.sv-art-toolbar button[aria-pressed=true]::before { content:'▷'; }
.sv-art-toolbar button:focus-visible { outline:2px solid #ddbf82; outline-offset:4px; }
.sv-art-toolbar button:disabled { display:none; }
.sv-gallery { grid-template-columns:repeat(12,minmax(0,1fr)); gap:28px; }
.sv-gallery .sv-card { grid-column:span 6; background:linear-gradient(130deg,#112437,#0c1929); border-color:#73929944; border-radius:16px; }
.sv-gallery .sv-card:hover,.sv-gallery .sv-card:focus-visible { transform:translateY(-5px); box-shadow:0 25px 70px #0005; border-color:var(--card-accent); }
.sv-gallery .sv-card-content { grid-column:1/-1; display:grid; grid-template-columns:1.12fr 1fr; }
.sv-gallery .sv-card-content .sv-art { height:100%; min-height:420px; aspect-ratio:auto; border-bottom:0; border-right:1px solid #849aa52b; }
.sv-gallery .sv-card-content .sv-card-copy { justify-content:center; padding:42px; }
.sv-gallery .sv-card-content .sv-card-foot { margin-top:8px; }
.sv-gallery .sv-card-copy { padding:32px; }
.sv-gallery .sv-card h3 { font-size:2rem; }
.sv-gallery .sv-pain { font-size:.63rem; }
.sv-gallery .sv-card-copy>p:not(.sv-card-promise) { font-size:.91rem; }
.sv-gallery .sv-card-foot { display:flex; font-size:.59rem; }
.sv-gallery .sv-card-foot>span { margin:0; }
.sv-gallery .sv-art { isolation:isolate; aspect-ratio:1.6; background:radial-gradient(ellipse at 48% 43%,#193343 0%,#0d1c2d 53%,#081422 100%); container-type:inline-size; }
.sv-gallery .sv-art::before { content:''; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(#8aa7b508 1px,transparent 1px),linear-gradient(90deg,#8aa7b508 1px,transparent 1px); background-size:36px 36px; mask-image:radial-gradient(ellipse at center,#000,transparent 78%); }
.sv-gallery .sv-art::after { z-index:4; background:radial-gradient(ellipse at var(--art-x,50%) var(--art-y,40%),#dcf6eb13,transparent 58%); }
.sv-gallery .sv-art-index { z-index:5; left:25px; top:23px; font:.48rem/1.8 var(--mono); letter-spacing:.16em; color:#d5c7a5; }
.sv-gallery .sv-art-arrow { z-index:5; top:18px; right:22px; border-color:#bbcbd133; background:#102439aa; }
.sv-art-caption { position:absolute; z-index:5; left:25px; right:25px; bottom:19px; display:flex; justify-content:space-between; gap:15px; font:.45rem/1.6 var(--mono); letter-spacing:.12em; color:#9cb5c3; text-transform:uppercase; pointer-events:none; }
.sv-art-caption b { color:var(--card-accent); font-weight:500; }
.sv-composition { position:absolute; inset:0; transform:perspective(1000px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg)); transform-style:flat; transition:transform .7s cubic-bezier(.2,.7,.2,1); pointer-events:none; }
.sv-material { position:absolute; transform-style:preserve-3d; animation:edition-float 8s ease-in-out infinite; animation-play-state:paused; }
.sv-art-shadow { position:absolute; left:20%; right:15%; bottom:14%; height:8%; background:#0008; border-radius:50%; filter:blur(16px); transform:rotate(-9deg); }
@keyframes edition-float { 0%,100% { translate:0 0; } 50% { translate:0 -8px; } }
@keyframes edition-travel { to { stroke-dashoffset:-128; } }
@keyframes edition-light { 0%,100% { opacity:.28; } 50% { opacity:1; } }
.art-visible .sv-material { animation-play-state:running; }
.sv-gallery .sv-art img { object-fit:contain; transform:none; filter:none; transition:none; }
.sv-gallery .sv-card:hover .sv-art img,.sv-gallery .sv-card:focus-visible .sv-art img { transform:none; filter:none; }

/* 01 — the original GPU mascot, with a static logo when WebGL is unavailable. */
.sv-card-brand .sv-art { background:radial-gradient(ellipse at 43% 48%,#a60c5423,transparent 48%),radial-gradient(ellipse at 65% 53%,#00979520,transparent 54%),#0b1828; }
.sv-brand-orbit { position:absolute; width:54%; aspect-ratio:1; left:23%; top:9%; border:1px solid #afbbad28; border-radius:50%; transform:rotateX(24deg) rotateY(-14deg); }
.sv-brand-orbit::before,.sv-brand-orbit::after { content:''; position:absolute; inset:6%; border:1px solid #b5ab8220; border-radius:inherit; }
.sv-brand-orbit::after { inset:-8%; border-style:dashed; opacity:.5; }
.sv-brand-fallback { position:absolute; width:46%; height:79%; left:27%; top:7%; overflow:visible; filter:drop-shadow(0 15px 18px #0004); }
.sv-brand-canvas { position:absolute; inset:0; display:block; width:100%; height:100%; opacity:0; transition:opacity .65s; }
.sv-brand-rendered .sv-brand-canvas { opacity:1; }
.sv-brand-rendered .sv-brand-fallback { opacity:0; }
.sv-brand-side { position:absolute; top:49%; left:7%; font:500 .43rem var(--mono); letter-spacing:.2em; color:#c79ba9; writing-mode:vertical-rl; transform:rotate(180deg); }
.sv-brand-side-right { left:auto; right:7%; color:#8daead; transform:none; top:39%; }
.sv-palette { position:absolute; bottom:15%; right:11%; display:flex; gap:5px; transform:rotate(-90deg); }
.sv-palette i { width:7px; height:7px; border-radius:1px; background:#d20b72; }
.sv-palette i:nth-child(2) { background:#00acae; }.sv-palette i:nth-child(3) { background:#d4ae5a; }.sv-palette i:nth-child(4) { background:#eee4ce; }

/* 02 — a responsive website as a layered, dimensional product. */
.sv-browser { left:17%; top:19%; width:69%; height:65%; border:1px solid #7fada8; border-radius:9px; background:#122a3b; box-shadow:3px 4px 0 #0a1725,6px 7px 0 #43656c,18px 25px 32px #0007; transform:perspective(800px) rotateY(-17deg) rotateX(10deg) rotateZ(-5deg); }
.sv-browser-bar { height:12%; min-height:20px; border-bottom:1px solid #7fa4ad40; display:flex; align-items:center; gap:4px; padding:0 5%; background:#284250; border-radius:8px 8px 0 0; }
.sv-browser-bar i { width:4px; height:4px; border-radius:50%; background:#bdc4aa; opacity:.6; }
.sv-browser-bar span { font:500 1.1cqw var(--mono); margin-left:auto; color:#b1c4c9; }
.sv-browser-body { position:absolute; inset:20% 7% 8%; }
.sv-browser-label { color:#72d1c6; font:500 1.05cqw var(--mono); letter-spacing:.14em; }
.sv-browser-title { display:block; font:400 5.1cqw/.98 var(--serif); letter-spacing:-.03em; color:#f0e8d8; margin-top:8%; }
.sv-browser-cta { display:inline-block; background:#ded0af; border:1px solid #f2e7cd; padding:3% 5%; font:600 1.02cqw var(--sans); color:#153345; margin-top:6%; border-radius:3px; }
.sv-web-sculpture { position:absolute; width:30%; height:64%; right:-1%; top:17%; border:1px solid #7fc7bd; border-radius:48% 48% 9% 9%; background:linear-gradient(140deg,#85d1c4,#246f74 43%,#122e48 68%,#cbb777); box-shadow:inset 6px 1px 10px #b8e2c840,5px 9px 18px #0005; transform:rotate(-13deg); overflow:hidden; }
.sv-web-sculpture::before { content:''; position:absolute; inset:12%; border:1px solid #cceddc80; border-radius:inherit; }
.sv-web-sculpture::after { content:''; position:absolute; inset:25%; border:1px solid #cceddc50; border-radius:inherit; }
.sv-phone { width:18%; height:53%; right:9%; top:35%; border:2px solid #b1c6c0; border-radius:15px; padding:8% 8%; background:linear-gradient(145deg,#203d4c,#101f30); transform:perspective(650px) rotateY(-19deg) rotateZ(8deg) translateZ(30px); box-shadow:4px 5px 0 #3d5b64,13px 17px 24px #0008; animation-delay:-3s; }
.sv-phone::before { content:''; position:absolute; top:4%; left:35%; width:30%; height:3%; border-radius:5px; background:#081b27; }
.sv-phone-screen { position:absolute; inset:14% 11% 8%; display:flex; flex-direction:column; justify-content:space-between; }
.sv-phone-screen b { font:400 2.5cqw/1.1 var(--serif); color:#eadfc7; }
.sv-phone-lines { height:34%; background:repeating-linear-gradient(0deg,transparent 0 8px,#7e9fac60 8px 9px); }
.sv-phone-screen i { display:block; height:10%; border-radius:3px; background:#76bbb2; }
.sv-device-tag { position:absolute; bottom:11%; left:12%; padding:9px 12px; border:1px solid #76949355; background:#0b2031ed; border-radius:5px; color:#a6c8c7; font:.42rem/1.5 var(--mono); transform:rotate(-5deg); }

/* 03 — one campaign, carried into editorial, email, and social. */
.sv-card-content .sv-art { background:radial-gradient(ellipse at 45% 47%,#ac497126,transparent 67%),linear-gradient(140deg,#152b3a,#101a2b); }
.sv-campaign-lines { position:absolute; inset:0; width:100%; height:100%; fill:none; stroke:#cbbd9540; stroke-width:1; }
.sv-campaign-lines .sv-lit-route { stroke:#dbbd82; stroke-dasharray:3 13; animation:edition-travel 12s linear infinite paused; }
.art-visible .sv-lit-route { animation-play-state:running; }
.sv-story-poster { left:28%; top:17%; width:40%; height:68%; background:var(--edition-paper); color:var(--edition-ink); border:1px solid #ffefce; box-shadow:3px 4px 0 #9e8d76,7px 7px 0 #273b46,15px 22px 28px #0006; transform:perspective(800px) rotateY(-12deg) rotateZ(-7deg); overflow:hidden; }
.sv-story-poster::before { content:''; position:absolute; inset:5%; border:1px solid #263d4133; }
.sv-poster-label { position:absolute; top:8%; left:11%; right:11%; font:500 1.08cqw var(--mono); letter-spacing:.2em; padding-bottom:5%; border-bottom:1px solid #25394240; }
.sv-poster-title { position:absolute; left:11%; top:24%; z-index:2; font:500 7.8cqw/.92 var(--serif); letter-spacing:-.055em; }
.sv-poster-title em { color:#ab205d; }
.sv-poster-motif { position:absolute; width:88%; aspect-ratio:1; border-radius:50%; left:32%; bottom:-22%; background:conic-gradient(from 80deg,#e8117b,#8d154d 47%,#057c81 48%,#36b6ad 67%,#d1ab5b 68%,#d1ab5b 73%,#15384b 74%); box-shadow:inset 10px 3px 18px #ffdeb01a; }
.sv-poster-motif::before { content:''; position:absolute; inset:20%; background:var(--edition-paper); border-radius:50%; }
.sv-poster-rule { position:absolute; bottom:12%; left:11%; width:29%; height:1px; background:#17384b; }
.sv-social-edition { left:63%; top:38%; width:25%; height:44%; background:linear-gradient(150deg,#922552,#511b3f); border:1px solid #d69da9; border-radius:6px; box-shadow:3px 4px 0 #431932,12px 16px 23px #0005; transform:rotate(10deg) translateZ(30px); animation-delay:-2.3s; }
.sv-social-edition span { position:absolute; left:11%; top:10%; font:500 .95cqw var(--mono); letter-spacing:.14em; color:#f2d7cc; }
.sv-social-edition svg { position:absolute; left:14%; top:23%; width:72%; height:63%; }
.sv-email-edition { left:7%; top:28%; width:25%; height:43%; border:1px solid #77abae; background:#1a3b4a; box-shadow:3px 4px 0 #102b36,12px 16px 20px #0005; border-radius:6px; transform:perspective(600px) rotateY(14deg) rotateZ(-14deg); animation-delay:-5s; }
.sv-email-bar { display:flex; align-items:center; justify-content:space-between; position:absolute; top:9%; left:10%; right:10%; padding-bottom:8%; border-bottom:1px solid #b4d4d144; color:#bed6cc; font:500 1cqw var(--mono); }
.sv-email-edition b { position:absolute; top:30%; left:10%; font:400 3cqw/1.05 var(--serif); color:#f0e6d0; }
.sv-email-lines { position:absolute; top:59%; left:10%; width:65%; height:15%; background:repeating-linear-gradient(0deg,transparent 0 8px,#a0c6c570 8px 9px); }
.sv-email-edition i { position:absolute; left:10%; bottom:10%; width:45%; height:7%; background:#c8b988; border-radius:2px; }
.sv-campaign-token { position:absolute; right:9%; top:21%; display:flex; align-items:center; gap:6px; color:#ddc998; font:.43rem var(--mono); }
.sv-campaign-token::before { content:'✦'; color:#d1a95e; font-size:1rem; }

/* 04 — information and assistance, ending with a human review. */
.sv-knowledge-stack { position:absolute; inset:21% 22% 22%; perspective:850px; }
.sv-knowledge-sheet { position:absolute; left:0; width:100%; height:61%; border:1px solid #92bbb9; border-radius:8px; transform:rotateX(48deg) rotateZ(-25deg); box-shadow:3px 5px 0 #426475,12px 20px 24px #0004; background:linear-gradient(135deg,#446477df,#193347ee 62%); }
.sv-knowledge-sheet:nth-child(1) { top:38%; animation-delay:-4s; border-color:#8da990; }
.sv-knowledge-sheet:nth-child(2) { top:18%; animation-delay:-2s; background:linear-gradient(135deg,#594b76e8,#192e47e8); border-color:#b2a1c5; }
.sv-knowledge-sheet:nth-child(3) { top:-3%; background:linear-gradient(140deg,#214e53df,#132a42e6); border-color:#b7d2bd; }
.sv-knowledge-sheet::before { content:''; position:absolute; inset:10%; border:1px solid #c6d9c91f; border-radius:5px; }
.sv-sheet-name { position:absolute; left:9%; bottom:11%; font:500 1.2cqw var(--mono); letter-spacing:.13em; color:#dae2d6; }
.sv-sheet-number { position:absolute; top:12%; right:9%; font:400 2cqw var(--serif); color:#ded1b1; }
.sv-knowledge-sheet svg { position:absolute; width:33%; height:70%; left:34%; top:5%; overflow:visible; }
.sv-knowledge-beam { position:absolute; left:50%; top:9%; bottom:23%; width:1px; background:linear-gradient(transparent,#decd9e,transparent); box-shadow:0 0 15px #acd2b2; animation:edition-light 4s ease-in-out infinite paused; }
.art-visible .sv-knowledge-beam { animation-play-state:running; }
.sv-review-seal { position:absolute; right:9%; bottom:16%; display:flex; align-items:center; gap:8px; padding:9px 12px; background:#102e38; border:1px solid #b3c7ac; border-radius:5px; color:#e1d6b8; font:.43rem var(--mono); transform:rotate(-5deg); box-shadow:0 10px 15px #0003; }
.sv-review-seal i { font-style:normal; color:#8bd5b5; font-size:.9rem; }

/* 05 — a routed request with a visible owner and next action. */
.sv-workflow-map { position:absolute; inset:11% 5% 8%; width:90%; height:81%; overflow:visible; }
.sv-route-flow { stroke-dasharray:5 11; animation:edition-travel 7s linear infinite paused; }
.art-visible .sv-route-flow { animation-play-state:running; }
.sv-flow-ticket { width:26%; height:34%; top:22%; left:9%; padding:7% 4%; border:1px solid #7bb8b1; border-radius:6px; background:linear-gradient(135deg,#264c59,#142c40); box-shadow:3px 5px 0 #466977,10px 17px 18px #0005; transform:perspective(750px) rotateX(12deg) rotateY(-18deg) rotateZ(-9deg); }
.sv-flow-ticket[data-flow="1"] { left:39%; top:37%; animation-delay:-2.7s; border-color:#d0b77f; }
.sv-flow-ticket[data-flow="2"] { left:69%; top:22%; animation-delay:-5.4s; }
.sv-flow-ticket small { position:absolute; top:12%; left:12%; font:500 1cqw var(--mono); color:#d0ba8b; letter-spacing:.13em; }
.sv-flow-ticket b { position:absolute; left:12%; top:37%; font:400 3.1cqw/1.05 var(--serif); color:#eee6d7; }
.sv-ticket-rule { position:absolute; left:12%; right:15%; bottom:16%; height:1px; background:#95b3b653; }
.sv-ticket-rule::after { content:''; display:block; width:35%; height:2px; background:#78bcb3; }
.sv-flow-ticket[data-flow="1"] .sv-ticket-rule::after { background:#d5b774; width:60%; }
.sv-flow-ticket[data-flow="2"] .sv-ticket-rule::after { width:100%; }

.sv-gallery.art-paused .sv-material,.sv-gallery.art-paused .sv-lit-route,.sv-gallery.art-paused .sv-route-flow,.sv-gallery.art-paused .sv-knowledge-beam { animation-play-state:paused!important; }
.sv-gallery.art-paused .sv-composition { transform:none; }
@media(min-width:1600px) { .sv-gallery .sv-art { aspect-ratio:1.7; } }
@media(max-width:1100px) { .sv-gallery { gap:22px; }.sv-gallery .sv-card-copy { padding:27px; }.sv-gallery .sv-card-content .sv-card-copy { padding:30px; }.sv-gallery .sv-card-content .sv-art { min-height:410px; }.sv-gallery .sv-card h3 { font-size:1.8rem; }.sv-gallery .sv-card-foot { flex-wrap:wrap; gap:8px 14px; } }
@media(max-width:800px) { .sv-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); }.sv-gallery .sv-card { grid-column:span 1; display:flex; }.sv-gallery .sv-card-content { grid-column:1/-1; display:flex; }.sv-gallery .sv-card-content .sv-card-copy { padding:26px; }.sv-gallery .sv-card-content .sv-art { min-height:0; height:auto; aspect-ratio:1.6; border-right:0; border-bottom:1px solid #849aa52b; }.sv-gallery .sv-card-systems .sv-art { aspect-ratio:1.6; height:auto; min-height:0; }.sv-gallery .sv-card h3 { font-size:1.6rem; }.sv-gallery .sv-card-copy { padding:23px; }.sv-gallery .sv-card-copy>p:not(.sv-card-promise) { font-size:.86rem; }.sv-art-caption { font-size:.38rem; left:19px; right:19px; bottom:14px; }.sv-art-caption b { display:none; }.sv-gallery .sv-art-index { left:19px; top:18px; font-size:.41rem; }.sv-gallery .sv-art-arrow { width:27px; height:27px; right:16px; top:14px; }.sv-device-tag,.sv-review-seal { font-size:.36rem; padding:6px 8px; } }
@media(max-width:700px) { .sv-gallery { grid-template-columns:1fr; gap:24px; }.sv-gallery .sv-card,.sv-gallery .sv-card-content { grid-column:auto; display:flex; }.sv-gallery .sv-art,.sv-gallery .sv-card-systems .sv-art { aspect-ratio:1.35; }.sv-gallery .sv-card-content .sv-art { aspect-ratio:1.18; min-height:0; height:auto; border-right:0; border-bottom:1px solid #849aa52b; }.sv-gallery .sv-card-copy,.sv-gallery .sv-card-content .sv-card-copy { padding:28px; }.sv-gallery .sv-card h3 { font-size:1.9rem; }.sv-gallery .sv-card-copy>p:not(.sv-card-promise) { font-size:.91rem; }.sv-gallery .sv-card-content .sv-card-foot { margin-top:auto; }.sv-art-toolbar p { max-width:24ch; font-size:.54rem; }.sv-art-toolbar button { font-size:.56rem; padding:9px 12px; }.sv-art-caption { font-size:.4rem; }.sv-art-caption b { display:block; }.sv-gallery .sv-art-index { font-size:.45rem; }.sv-brand-orbit { width:64%; left:18%; top:11%; }.sv-brand-fallback { width:52%; left:24%; }.sv-device-tag,.sv-review-seal { font-size:.38rem; }.sv-story-poster { height:67%; }.sv-knowledge-sheet { height:56%; } }
@media(max-width:600px) { .sv-brand-side,.sv-card-brand .sv-art-caption b { display:none; } }
@container(max-width:450px) { .sv-brand-side,.sv-device-tag { display:none; } }
@media(pointer:coarse) { .sv-card-brand .sv-art-caption b { display:none; } }
@media(prefers-reduced-motion:reduce) { .sv-gallery .sv-material,.sv-gallery .sv-lit-route,.sv-gallery .sv-route-flow,.sv-gallery .sv-knowledge-beam { animation:none!important; }.sv-gallery .sv-composition,.sv-gallery .sv-card:hover,.sv-gallery .sv-card:focus-visible { transform:none!important; }.sv-gallery .sv-composition,.sv-brand-canvas { transition:none; } }