/* Randorff v1.8.5.313: original cascade group 3; source order retained. */

.work-feature.explainer{background:#161616;color:#fff;min-height:80svh;display:flex;align-items:center;padding:90px 0}
.explainer .explainer-intro{margin-bottom:clamp(64px,7vw,105px)}
.work-feature.explainer > .site-wrap.feature-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:clamp(12px,1.4vw,24px)!important}
.work-feature.explainer > .site-wrap.feature-grid > .feature-visual,.work-feature.explainer > .site-wrap.feature-grid > .feature-copy{grid-column:span 2;min-width:0}
@media(max-width:900px){.work-feature.explainer > .site-wrap.feature-grid{grid-template-columns:1fr!important;gap:clamp(28px,5vw,40px)!important}.work-feature.explainer > .site-wrap.feature-grid > .feature-visual,.work-feature.explainer > .site-wrap.feature-grid > .feature-copy{grid-column:auto}}
.explainer-feature-art{aspect-ratio:1.16;min-height:0;background:#00b6ed;overflow:hidden;position:relative}
.explainer-feature-frame{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}
.explainer-feature-orbit{position:absolute;width:65%;aspect-ratio:1;border:2px solid #191919;border-radius:50%;transform:rotate(-28deg) scaleX(.7)}
.explainer-feature-orbit.inner{width:44%;transform:rotate(32deg) scaleX(.7)}
.explainer-feature-play{font-size:clamp(40px,5vw,84px);color:#191919;transform:translateX(4px)}
.explainer-feature-label{position:absolute;bottom:20px;left:22px;font:11px 'JetBrains Mono',monospace;letter-spacing:.05em;color:#191919}
.explainer-showcase{padding-bottom:clamp(30px,5vw,80px)}
.explainer-section-label{font:11px 'JetBrains Mono',monospace;letter-spacing:.06em;margin:0 0 23px;color:#fff}
.explainer-films{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.6vw,24px);margin-bottom:clamp(75px,9vw,130px)}
.explainer-film{all:unset;display:block;min-width:0;cursor:pointer}
.explainer-film:focus-visible{outline:2px solid white;outline-offset:5px}
.explainer-film-art{display:block;position:relative;aspect-ratio:16/9;overflow:hidden}
.explainer-film-art.art-one,.explainer-film-art.art-two,.explainer-film-art.art-three{background:#222}
.explainer-glyph{position:absolute;display:block;width:35%;aspect-ratio:1;top:19%;left:33%;border-radius:50%;border:14px solid rgba(0,0,0,.72)}
.glyph-two{border-radius:0;transform:rotate(24deg);border-width:13px}.glyph-three{border-radius:50% 50% 8% 8%;transform:rotate(-15deg)}
.explainer-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,.75);color:#fff;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;font:20px sans-serif;padding-left:3px;box-sizing:border-box;transition:background .2s}
.explainer-film:hover .explainer-play{background:#111}
.explainer-art-code{position:absolute;left:15px;bottom:14px;color:#111;font:11px 'JetBrains Mono',monospace}
.explainer-film-caption{display:flex;justify-content:space-between;padding-top:15px;font:11px 'JetBrains Mono',monospace;color:#fff}
.explainer-process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.6vw,24px);margin-bottom:clamp(70px,9vw,120px)}
.explainer-process-card{aspect-ratio:1;position:relative;overflow:hidden;background:#eee;color:#161616}
.explainer-card-number{position:absolute;bottom:16px;left:18px;font:11px 'JetBrains Mono',monospace;z-index:3}
.explainer-characters .explainer-process-card{aspect-ratio:4/3;background:#fff}
.explainer-character-image{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;background:#fff}
.explainer-characters .explainer-card-number{color:#111;background:rgba(255,255,255,.85);padding:4px 6px}
.explainer-characters .character-b{background:#bbb}.explainer-characters .character-c{background:#eee}
.explainer-character-head{position:absolute;width:33%;aspect-ratio:1;border-radius:50%;background:#202020;top:15%;left:34%}
.explainer-character-body{position:absolute;width:62%;height:57%;background:#202020;border-radius:45% 45% 0 0;top:52%;left:19%}
.character-b .explainer-character-head{border-radius:30% 60% 40% 40%;transform:rotate(-12deg)}
.character-b .explainer-character-body{border-radius:8% 55% 0 0;transform:rotate(-8deg)}
.character-c .explainer-character-head{border-radius:50% 18% 50% 40%}
.character-c .explainer-character-body{border-radius:35% 15% 0 0}
.explainer-storyboards .explainer-process-card{background:#e3e3e3;padding:12%;box-sizing:border-box}
.explainer-storyframe{height:73%;border:2px solid #222;position:relative;overflow:hidden}
.explainer-storycircle{position:absolute;width:33%;aspect-ratio:1;background:#333;border-radius:50%;left:15%;top:16%}
.explainer-storyline{position:absolute;width:95%;height:50%;border-top:3px solid #333;transform:rotate(-25deg);left:18%;top:68%}
.explainer-storyframe.reverse .explainer-storycircle{left:60%;top:45%;width:25%}.explainer-storyframe.reverse .explainer-storyline{transform:rotate(22deg);left:-10%;top:65%}
.explainer-storyframe.three .explainer-storycircle{width:48%;left:27%;top:28%;border-radius:0;transform:rotate(15deg)}
.explainer-modal[hidden]{display:none!important}.explainer-modal{position:fixed;inset:0;z-index:2147483647;background:rgba(0,0,0,.95);display:flex;align-items:center;justify-content:center;padding:clamp(20px,5vw,70px);box-sizing:border-box}
.explainer-modal-content{width:min(1200px,100%);color:white}.explainer-modal-title{font:11px 'JetBrains Mono',monospace;margin-bottom:20px}.explainer-modal-screen{aspect-ratio:16/9;background:#000;display:block;overflow:hidden}.explainer-modal-video{display:block;width:100%;height:100%;object-fit:contain}.explainer-modal-symbol{font:60px sans-serif;color:white}
.explainer-modal-close{position:absolute;right:clamp(18px,4vw,60px);top:clamp(12px,2vw,30px);border:0;background:transparent;color:white;font:44px sans-serif;cursor:pointer;padding:4px 14px}
@media(max-width:700px){.explainer-films,.explainer-process-grid{grid-template-columns:1fr}.explainer-process-card{aspect-ratio:1.25}.explainer-feature-art{aspect-ratio:1.1}}
.work-feature.explainer:not(.is-case-visible){display:none}
.work-feature.explainer.is-case-visible{display:block}

/* v1.8.5.259 Explainer detail viewport and character captions */
.explainer .explainer-intro{margin-bottom:0}
.work-feature.explainer.is-expanded{min-height:100svh;display:block;padding:70px 0 0}
.work-feature.explainer.is-expanded > .site-wrap.feature-grid{min-height:calc(100svh - 140px);align-items:center}
.explainer .explainer-details.feature-more{width:100%;max-width:none;margin:0 auto;padding:clamp(24px,3vw,42px) 0 70px}
.explainer .explainer-showcase{padding-bottom:0}
.explainer .explainer-content-heading{font-family:inherit;font-size:clamp(26px,3vw,44px);font-weight:700;line-height:1.12;letter-spacing:-.025em;color:#fff;margin:0 0 clamp(22px,3vw,36px)}
.explainer .explainer-films{margin-bottom:clamp(43px,4.8vw,72px)}
.explainer .explainer-showcase > .case-close-button{display:block;margin-top:clamp(64px,6vw,96px);margin-bottom:0}
.explainer .feature-more-toggle:hover{background:#fff;color:#161616;border-color:#fff}
.explainer-character-figure{margin:0;min-width:0}
.explainer-characters .explainer-process-card{aspect-ratio:4/3;overflow:hidden}
.explainer-character-name{color:#fff;font:11px 'JetBrains Mono',monospace;letter-spacing:.04em;margin-top:14px}
@media(max-width:700px){.explainer-characters .explainer-process-card{aspect-ratio:4/3}}

.explainer-film-poster{display:block;width:100%;height:100%;object-fit:cover}
.explainer-film-caption{gap:8px}

/* Explainer case hero: keep original SVG proportions while filling the visual height. */
.explainer .explainer-feature-art{display:flex;align-items:center;justify-content:center;overflow:hidden}
.explainer .explainer-hero-nettolager{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;flex-shrink:0}

/* v1.8.5.262 — Character lineup at the case boundary */
.explainer .explainer-details.feature-more{padding-bottom:0}
.explainer .explainer-process-grid.explainer-characters{display:none}
.explainer .explainer-finale{--finale-margin:max(3%,calc((100% - 1444px)/2));position:relative;isolation:isolate;min-height:clamp(340px,38vw,620px);margin-top:clamp(18px,2vw,28px);width:100%;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.explainer .explainer-finale::after{content:"";position:absolute;bottom:0;left:var(--finale-margin);right:var(--finale-margin);border-bottom:1px solid rgba(255,255,255,.55);z-index:0}
.explainer .explainer-finale-characters{display:block;position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:calc(100% - (var(--finale-margin) * 2));height:100%;object-fit:contain;object-position:center bottom;max-width:none;z-index:1;pointer-events:none}
.explainer .explainer-finale > .case-close-button{position:absolute;left:var(--finale-margin);bottom:clamp(44px,6vw,75px);margin:0;z-index:2}
@media(max-width:700px){.explainer .explainer-finale{--finale-margin:3%;min-height:clamp(190px,52vw,320px);margin-top:18px}.explainer .explainer-finale-characters{width:calc(100% - (var(--finale-margin) * 2));height:100%}.explainer .explainer-finale > .case-close-button{bottom:12px;left:3%;z-index:3}}

/* v1.8.5.286 — NET lightboxes immediately after the image mosaic. */
/* v1.8.5.288 — Restored complete original NET lightbox design (frames and feet) at original 65vw scale. */
.work-feature.net .net-lightbox-card{
  width:100%;max-width:none;margin:var(--case-space-small) 0 0;
  background:#2D333A url("../net/net-lightbox-bg.png") center center / cover no-repeat;box-sizing:border-box;
  padding:clamp(38px,5vw,76px) 0;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
/* v1.8.5.270 — Midterste NET-lightbox med scrollstyret tænding */
.work-feature.net .net-lightbox-card .net-finale-stage{position:relative;flex:none;width:min(65vw,1072.5px);aspect-ratio:703.13/493.87;z-index:1}
.work-feature.net .net-lightbox-card .net-finale-stage>.net-finale-illustration{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:fill;transform:none;pointer-events:none}
.work-feature.net .net-lightbox-card .net-race-lightbox{position:absolute;left:0.1422%;top:0.2025%;width:28.302%;height:99.015%;overflow:hidden;border-radius:0.754% / 0.307%;z-index:2}
.work-feature.net .net-lightbox-card .net-race-image{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block}
.work-feature.net .net-lightbox-card .net-race-lit{opacity:0;transition:opacity 850ms cubic-bezier(.2,.7,.2,1)}
.work-feature.net .net-lightbox-card .net-race-lightbox.is-on .net-race-lit{opacity:1}
/* Centre green lightbox: same rounded image mask and scroll fade. */
.work-feature.net .net-lightbox-card .net-energy-lightbox{position:absolute;left:35.85%;top:0.2025%;width:28.302%;height:99.015%;overflow:hidden;border-radius:0.754% / 0.307%;z-index:2}
.work-feature.net .net-lightbox-card .net-energy-image{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block}
.work-feature.net .net-lightbox-card .net-energy-lit{opacity:0;transition:opacity 850ms cubic-bezier(.2,.7,.2,1)}
.work-feature.net .net-lightbox-card .net-energy-lightbox.is-on .net-energy-lit{opacity:1}
/* Right lightbox uses the exact green rounded field in the source SVG. */
.work-feature.net .net-lightbox-card .net-nerd-lightbox{position:absolute;left:71.5543%;top:18.7134%;width:28.302%;height:80.505%;overflow:hidden;border-radius:0.754% / 0.377%;z-index:2}
.work-feature.net .net-lightbox-card .net-nerd-image{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block}
.work-feature.net .net-lightbox-card .net-nerd-lit{opacity:0;transition:opacity 850ms cubic-bezier(.2,.7,.2,1)}
.work-feature.net .net-lightbox-card .net-nerd-lightbox.is-on .net-nerd-lit{opacity:1}
@media(prefers-reduced-motion:reduce){.work-feature.net .net-lightbox-card .net-race-lit,.work-feature.net .net-lightbox-card .net-nerd-lit,.work-feature.net .net-lightbox-card .net-energy-lit{transition:none}}
@media(max-width:700px){.work-feature.net .net-lightbox-card .net-finale-stage{width:91.5vw}}



/* v1.8.5.298 — mulepose 2% mod højre */
/* Full-width white editorial collage, composed from the five original NET SVG assets. */
.work-feature.net .net-welcome-collage{width:100%;max-width:none;margin:var(--case-space-small) 0 0;background:#fff;overflow:hidden}
.work-feature.net .net-welcome-canvas{position:relative;width:100%;aspect-ratio:1650/895;background:#fff;isolation:isolate}
.work-feature.net .net-welcome-canvas img{display:block;position:absolute;height:auto;max-width:none;object-fit:contain}
.work-feature.net .net-welcome-cover{width:26%;left:calc(57.8% - 2px);top:6.2%;z-index:1}
.work-feature.net .net-welcome-tote{width:37%;left:8.2%;top:-6%;transform:rotate(-17deg);transform-origin:left top;z-index:2;filter:drop-shadow(4px 8px 5px rgba(0,0,0,.08))}
.work-feature.net .net-welcome-letter{width:18.25%;left:4.3%;top:26.4%;z-index:3;filter:drop-shadow(2px 5px 4px rgba(0,0,0,.08))}
.work-feature.net .net-welcome-open{width:25.7%;left:70%;top:26.4%;z-index:4;filter:drop-shadow(2px 5px 4px rgba(0,0,0,.10))}
.work-feature.net .net-welcome-seeds{width:12.4%;left:56.5%;top:53.5%;transform:rotate(-13deg);z-index:5;filter:drop-shadow(3px 6px 4px rgba(0,0,0,.13))}
@media(max-width:700px){
 .work-feature.net .net-welcome-canvas{aspect-ratio:1/1.1}
 .work-feature.net .net-welcome-cover{width:39%;left:calc(53% - 2px);top:8%}
 .work-feature.net .net-welcome-tote{width:55%;left:3%;top:18%;transform:rotate(-16deg);transform-origin:left top}
 .work-feature.net .net-welcome-letter{width:27%;left:3%;top:31%}
 .work-feature.net .net-welcome-open{width:36%;left:63%;top:34%}
 .work-feature.net .net-welcome-seeds{width:17%;left:54%;top:64%}
}



/* The Core: independent, edge-to-edge scroll animation with spacing after six-card grid. */
.work-feature.net .net-core-seventh{position:relative;left:50%;transform:translateX(-50%);width:100vw;max-width:none;height:1350svh;margin:clamp(54px,6vw,96px) 0 0;padding:0;overflow:clip;overflow-clip-margin:0;background:#2D333A;z-index:3}
.work-feature.net .net-core-seventh-sticky{position:sticky;top:0;height:100svh;width:100%;overflow:hidden;background:#2D333A}
.work-feature.net .net-core-seventh-frame{width:100%;height:100%;display:block;border:0;pointer-events:none;background:#2D333A}
@media(max-width:700px){.work-feature.net .net-core-seventh{height:1350svh}}