:root{--x-black:#090909;--x-charcoal:#131312;--x-cream:#efebe2;--x-orange:#f26d21;--x-line:rgba(18,18,17,.2);--x-pad:clamp(1.25rem,4vw,5rem);--x-max:1600px}
html{background:var(--x-black);scroll-padding-top:5rem}body.extreme-inner{background:var(--x-cream);color:#171716}.x-progress{position:fixed;inset:0 0 auto;height:3px;z-index:100}.x-progress span{display:block;width:100%;height:100%;background:var(--x-orange);transform:scaleX(0);transform-origin:left}.x-header{height:92px;position:absolute;inset:0 0 auto;padding:0 var(--x-pad);z-index:80;display:grid;grid-template-columns:minmax(190px,260px) 1fr auto;gap:2rem;align-items:center;color:#fff}.x-brand img{width:100%;filter:brightness(0) invert(1)}.x-context{justify-self:center;margin:0;font-size:.64rem;text-transform:uppercase;letter-spacing:.16em;color:#aaa}.x-context i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--x-orange);margin-right:.7rem}.x-menu-button{border:1px solid #555;background:rgba(10,10,10,.7);color:#fff;border-radius:99px;padding:.72rem 1rem;display:flex;align-items:center;gap:1rem;cursor:pointer}.x-menu-button b,.x-menu-button b:after{display:block;width:18px;height:1px;background:currentColor;content:"";transition:.3s}.x-menu-button b:after{transform:translateY(5px)}.x-menu-button[aria-expanded=true] b{transform:rotate(45deg)}.x-menu-button[aria-expanded=true] b:after{transform:rotate(90deg)}.x-nav{position:fixed;inset:0;background:var(--x-orange);color:#111;z-index:-1;padding:clamp(7rem,13vh,11rem) var(--x-pad) 3rem;display:grid;grid-template-columns:1fr minmax(240px,.35fr);gap:5vw;align-items:end;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}.x-nav.open{opacity:1;visibility:visible}.x-nav-main{display:flex;flex-direction:column}.x-nav-main a{font-size:clamp(3rem,7vw,8rem);font-weight:600;letter-spacing:-.07em;line-height:.85;border-bottom:1px solid rgba(0,0,0,.25);padding:.08em 0;transition:padding .2s}.x-nav-main a:hover{padding-left:.12em}.x-nav-main sup{font-size:.12em;letter-spacing:0}.x-nav-side{border-top:1px solid rgba(0,0,0,.35);padding-top:1.5rem}.x-nav-side p{max-width:330px}.x-nav-side a{display:flex;justify-content:space-between;border-block:1px solid rgba(0,0,0,.3);padding:1rem 0;margin-top:2rem;font-weight:600}.x-backtop{position:fixed;right:1.2rem;bottom:1.2rem;width:52px;height:52px;border:1px solid #777;border-radius:50%;background:#111;color:#fff;z-index:40;display:grid;place-items:center;opacity:0;transform:translateY(15px);transition:.3s;cursor:pointer}.x-backtop.visible{opacity:1;transform:none}.x-page-index{position:absolute;right:var(--x-pad);top:130px;z-index:4;font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:#888}.x-page-index strong{display:block;color:var(--x-orange);font-size:clamp(2.5rem,5vw,6rem);line-height:1;letter-spacing:-.06em}
/* Universal inner-page heroes */
body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro){position:relative;min-height:min(820px,92svh);padding:clamp(10rem,17vh,14rem) var(--x-pad) clamp(4rem,8vw,8rem);background:var(--x-black);color:#fff;overflow:hidden;display:flex;align-items:flex-end}body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro):before{content:"";position:absolute;width:clamp(300px,42vw,720px);aspect-ratio:1;border-radius:50%;background:var(--x-orange);right:-15%;top:-35%;opacity:.95}body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro):after{content:"";position:absolute;width:min(48vw,700px);aspect-ratio:1;border:1px solid #353533;border-radius:50%;right:4vw;top:16%;box-shadow:0 0 0 7vw transparent,0 0 0 calc(7vw + 1px) #252523}body.extreme-inner :is(.page-hero-inner,.studio-hero-inner,.case-hero-inner,.about-hero-inner,.team-hero-inner,.profile-hero-inner,.testimonial-hero-inner,.updates-hero-inner,.post-hero-inner,.private-work-intro-inner){width:100%;max-width:var(--x-max);margin:auto;position:relative;z-index:2}body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro) h1{font-size:clamp(4.2rem,9.5vw,11rem);line-height:.78;letter-spacing:-.08em;max-width:1250px;margin:0;font-weight:600}body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro) h1 :is(em,span){color:var(--x-orange);font-style:normal;font-weight:500}body.extreme-inner .eyebrow{color:var(--x-orange);letter-spacing:.19em}body.extreme-inner :is(.page-hero-lede,.studio-hero-copy,.about-hero-copy,.team-hero-copy,.profile-hero-role,.testimonial-hero-copy,.updates-hero-copy){max-width:560px;margin:2rem 0 0 auto;color:#aaa;font-size:clamp(1rem,1.4vw,1.25rem)}
/* Case studies: alternating full-bleed visual rhythm */
body.case-page .case-hero-inner{display:flex!important;flex-direction:column;justify-content:flex-end}body.case-page .case-meta{border-top:1px solid #444;margin-top:3rem;padding-top:1rem;max-width:900px}body.case-page .case-overview{padding:clamp(6rem,11vw,11rem) var(--x-pad);background:var(--x-cream)}body.case-page .case-overview-inner{max-width:var(--x-max);margin:auto;display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(3rem,9vw,11rem)}body.case-page .case-overview h2{font-size:clamp(3rem,6vw,7rem);line-height:.9;letter-spacing:-.06em;margin:0}body.case-page :is(.case-gallery,.voice-archive,.voice-events,.voice-photo-story,.voice-spreads,.oggy-design-section,.oggy-vehicle-section,.oggy-cast-section){background:#0d0d0c;color:#fff;padding:clamp(4rem,8vw,8rem) var(--x-pad)}body.case-page :is(.case-gallery-grid,.voice-cover-grid,.voice-photo-grid,.art-grid){gap:clamp(.8rem,2vw,1.8rem)}body.case-page :is(.case-gallery,.voice-archive,.voice-events,.voice-photo-story,.voice-spreads) img{transition:transform .8s cubic-bezier(.2,.8,.2,1),filter .4s}body.case-page :is(.case-gallery,.voice-archive,.voice-events,.voice-photo-story,.voice-spreads) img:hover{transform:scale(1.02);filter:saturate(1.1)}body.case-page :is(.case-story,.oggy-mystery,.oggy-turn,.oggy-sorren-section,.oggy-legacy-v2,.voice-legacy){padding:clamp(6rem,11vw,11rem) var(--x-pad)}body.case-page .case-story h2,body.case-page :is(.voice-archive,.voice-events,.voice-photo-story,.voice-spreads,.voice-legacy) h2{font-size:clamp(2.8rem,6vw,7rem);line-height:.92;letter-spacing:-.055em}body.case-page .case-next{background:var(--x-orange);color:#111;padding:clamp(4rem,7vw,7rem) var(--x-pad)}body.case-page .case-next a{max-width:var(--x-max);margin:auto;border-color:rgba(0,0,0,.35)}.x-chapters{position:fixed;left:1rem;top:50%;z-index:35;transform:translateY(-50%);display:flex;flex-direction:column;gap:.55rem}.x-chapters a{width:8px;height:8px;border:1px solid #888;border-radius:50%;background:#111;position:relative}.x-chapters a span{position:absolute;left:18px;top:50%;transform:translateY(-50%);padding:.3rem .5rem;background:#111;color:#fff;font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap;opacity:0;pointer-events:none}.x-chapters a:hover span,.x-chapters a.active span{opacity:1}.x-chapters a.active{background:var(--x-orange);border-color:var(--x-orange)}
/* Portfolio: a browsable, scalable archive */
body.projects-page .portfolio-directory{background:var(--x-orange);color:#111}body.projects-page .portfolio-directory .eyebrow,body.projects-page .directory-heading>p{color:#31190d}body.projects-page .directory-heading{border-color:rgba(17,17,17,.45)}body.projects-page .directory-heading h2,body.projects-page .catalog-heading h2{color:#111;font-size:clamp(3rem,6vw,7rem);line-height:.9;letter-spacing:-.06em}body.projects-page .discipline-grid{gap:1px;background:#111}body.projects-page .discipline-card{background:var(--x-orange);border:0;min-height:320px;transition:.3s}body.projects-page .discipline-card:hover{background:#111;color:#fff;transform:none}body.projects-page .discipline-card-dark{background:#111;color:#fff}body.projects-page .projects-catalog{background:var(--x-black);color:#fff}.x-filters{max-width:var(--x-max);margin:0 auto 4rem;display:flex;gap:.7rem;flex-wrap:wrap}.x-filters button{border:1px solid #555;color:#fff;background:transparent;border-radius:99px;padding:.65rem 1rem;cursor:pointer;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}.x-filters button.active,.x-filters button:hover{background:var(--x-orange);border-color:var(--x-orange);color:#111}.x-hidden{display:none!important}body.projects-page .portfolio-item{background:#151514;padding:1rem}body.projects-page .portfolio-copy{border-top-color:#555}body.projects-page .portfolio-copy h2{color:#fff}body.projects-page .portfolio-copy>p:not(.portfolio-services){color:#aaa}body.projects-page .originals-showcase{background:var(--x-orange)}
/* Discipline galleries */
body.extreme-inner :is(.identity-page,.publishing-page) .studio-hero{}body.extreme-inner .archive-intro h2{font-size:clamp(3rem,6vw,7rem);line-height:.9;letter-spacing:-.06em}body.extreme-inner .gallery-section{background:#0d0d0c;color:#fff;padding-top:clamp(5rem,9vw,9rem)}body.extreme-inner :is(.art-card,.book-card,.logo-card){transition:transform .35s}body.extreme-inner :is(.art-card,.book-card,.logo-card):hover{transform:translateY(-7px)}body.extreme-inner .book-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));max-width:var(--x-max)}body.extreme-inner .book-card:nth-child(even){margin-top:4rem}body.extreme-inner .logo-gallery{gap:1px;background:#aaa}
/* Team and profiles */
body.team-page .team-roster{padding:clamp(6rem,11vw,11rem) var(--x-pad);background:var(--x-orange)}body.team-page .team-roster h2{font-size:clamp(3rem,6vw,7rem);line-height:.9;letter-spacing:-.06em}body.team-page .team-card{background:#111;color:#fff;min-height:520px;border:0;transition:.35s}body.team-page .team-card:hover{background:#fff;color:#111;transform:translateY(-8px)}body.profile-page .profile-intro{padding:clamp(6rem,11vw,11rem) var(--x-pad);grid-template-columns:1fr 1fr}body.profile-page .profile-intro h2{font-size:clamp(3rem,6vw,7rem);line-height:.9;letter-spacing:-.06em}body.profile-page .profile-work{background:#10100f;color:#fff;padding:clamp(6rem,11vw,11rem) var(--x-pad)}body.profile-page .profile-work article{border-color:#444}
/* About, proof, updates, contact */
body.about-page .about-statement,body.about-page .founder-section{padding:clamp(6rem,11vw,11rem) var(--x-pad)}body.about-page .about-statement h2,body.about-page .about-values h2,body.about-page .founder-section h2{font-size:clamp(3rem,6vw,7rem);line-height:.9;letter-spacing:-.06em}body.about-page .about-values{background:var(--x-orange);color:#111;padding:clamp(6rem,11vw,11rem) var(--x-pad)}body.about-page .about-values .eyebrow,body.about-page .about-values-grid span{color:#31190d}body.about-page .about-values-grid{border-color:rgba(17,17,17,.45)}body.about-page .about-values-grid article{border-color:rgba(17,17,17,.45)}body.about-page .about-values-grid p{color:#31190d}body.testimonials-page .testimonial-library{background:#111;color:#fff}body.testimonials-page details{border-color:#555}body.testimonials-page summary:hover{color:var(--x-orange)}body.updates-page .updates-list{background:var(--x-orange)}body.updates-page .update-card{background:#111;color:#fff;min-height:520px;padding:clamp(2rem,5vw,5rem)}body.update-post article{font-size:1.1rem}body.extreme-inner .contact-page{background:var(--x-black);padding-top:clamp(10rem,16vh,13rem)}body.extreme-inner .contact-form{box-shadow:0 30px 100px rgba(0,0,0,.3)}body.extreme-inner .contact-form:focus-within{outline:2px solid var(--x-orange);outline-offset:8px}body.extreme-inner .error-page{background:var(--x-black);color:#fff}
/* Lightbox and image affordance */
.x-zoomable{cursor:zoom-in}.x-lightbox{width:100vw;height:100vh;max-width:none;max-height:none;border:0;padding:clamp(1rem,3vw,3rem);background:rgba(0,0,0,.94);color:#fff}.x-lightbox[open]{display:grid;grid-template-rows:auto 1fr auto}.x-lightbox button{justify-self:end;border:1px solid #777;background:#111;color:#fff;border-radius:99px;padding:.6rem 1rem;cursor:pointer}.x-lightbox img{width:100%;height:100%;object-fit:contain;min-height:0}.x-lightbox p{text-align:center;margin:.75rem 0 0;color:#aaa;font-size:.8rem}.x-lightbox::backdrop{background:#000}
@media(max-width:900px){.x-header{height:78px;grid-template-columns:1fr auto}.x-brand{max-width:210px}.x-context{display:none}.x-nav{grid-template-columns:1fr;align-content:center}.x-nav-side{display:none}.x-page-index{top:100px}.x-chapters{display:none}body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro){min-height:700px}body.case-page .case-overview-inner{grid-template-columns:1fr}body.profile-page .profile-intro{grid-template-columns:1fr}.x-filters{margin-bottom:2rem}}
@media(max-width:620px){body.extreme-inner{overflow-x:hidden}.x-header{gap:1rem}.x-brand{width:175px;max-width:48vw}.x-menu-button span{display:none}.x-page-index{display:none}body.extreme-inner :is(main,main>*,.page-hero-inner,.studio-hero-inner,.case-hero-inner,.about-hero-inner,.team-hero-inner,.profile-hero-inner,.testimonial-hero-inner,.updates-hero-inner,.contact-layout){min-width:0;max-width:100%}body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro){min-height:620px;padding-top:8rem}body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro) h1{font-size:clamp(3rem,15vw,4.5rem);line-height:.83;overflow-wrap:anywhere}.x-nav-main a{font-size:clamp(3rem,15vw,5rem)}body.extreme-inner .book-card:nth-child(even){margin-top:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.x-nav,.x-backtop,body.extreme-inner :is(.art-card,.book-card,.logo-card,.team-card){transition:none}}

/* Brand the orbital hero graphic with the standalone Vigilante mark. */
body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro):after{
  background-image:url("../images/mark.svg");
  background-position:center;
  background-repeat:no-repeat;
  background-size:clamp(280px,48%,440px);
}

/* Give the About hero's focal mark more authority inside the orbit. */
body.about-page .about-hero:after{
  background-size:clamp(380px,68%,580px);
}

@media(max-width:620px){
  body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro):after{
    background-size:clamp(170px,42%,280px);
  }

  body.about-page .about-hero:after{
    background-size:110px;
  }
}

/* Identity archive: large artwork, editorial rhythm, no picture-frame cards. */
body.identity-page .identity-gallery{padding-inline:var(--x-pad);background:#0d0d0c}
body.identity-page .logo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1rem,2vw,2rem);max-width:var(--x-max)}
body.identity-page .logo-card,body.identity-page .logo-card-feature,body.identity-page .logo-card-wide{grid-column:auto;border:0;background:#171716;color:#fff;overflow:hidden}
body.identity-page .logo-card a,body.identity-page .logo-card-feature a,body.identity-page .logo-card-wide a{display:flex;flex-direction:column;height:100%}
body.identity-page .logo-card-media,body.identity-page .logo-card:not(.logo-card-feature,.logo-card-wide) .logo-card-media{min-height:0;height:auto;aspect-ratio:4/3;padding:0;background:#242321;overflow:hidden}
body.identity-page .logo-card-media img,body.identity-page .krbc-logo-card .logo-card-media img{width:100%;height:100%;max-width:none;max-height:none;padding:0;object-fit:cover;object-position:center;transform:none}
body.identity-page .logo-card-feature .logo-card-media img{object-fit:contain;background:#f7f6f2;padding:clamp(1rem,3vw,2.5rem)}
body.identity-page .logo-card:nth-child(2) .logo-card-media img{object-fit:contain;background:#242423;padding:clamp(2rem,5vw,5rem)}
body.identity-page .krbc-logo-card .logo-card-media img{object-fit:contain;background:#f4f1e9;padding:clamp(1rem,2.5vw,2rem)}
body.identity-page .logo-card-wide .logo-card-media img{object-fit:cover;object-position:center 22%}
body.identity-page .logo-card-copy{display:flex;flex:1;flex-direction:column;justify-content:flex-start;padding:clamp(1.5rem,3vw,2.75rem);border-top:1px solid #3b3935}
body.identity-page .logo-card-copy h2{color:#fff}
body.identity-page .logo-card-copy p{color:#aaa69f}
@media(max-width:760px){body.identity-page .logo-grid{grid-template-columns:1fr}}

/* Small-screen integrity across every inner-page family. */
@media(max-width:620px){
  body.extreme-inner :is(.studio-hero-inner,.page-hero-inner,.about-hero-inner,.team-hero-inner,.profile-hero-inner,.testimonial-hero-inner,.updates-hero-inner,.archive-intro),
  body.extreme-inner :is(.studio-hero-inner,.page-hero-inner,.about-hero-inner,.team-hero-inner,.profile-hero-inner,.testimonial-hero-inner,.updates-hero-inner,.archive-intro)>*{
    min-width:0;
    width:100%;
    max-width:100%;
  }
  body.extreme-inner :is(.studio-hero,.page-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero) h1{
    max-width:100%;
    font-size:clamp(2.9rem,13.25vw,3.55rem);
    line-height:.86;
    overflow-wrap:normal;
  }
  body.extreme-inner .studio-hero h1 em{display:block}
  body.extreme-inner :is(.studio-hero-copy,.page-hero-lede,.about-hero-copy,.team-hero-copy,.profile-hero-role,.testimonial-hero-copy,.updates-hero-copy){
    margin-left:0;
    overflow-wrap:break-word;
  }
  body.extreme-inner .archive-intro h2{font-size:clamp(2.5rem,12vw,3.35rem);overflow-wrap:break-word}
  body.extreme-inner .archive-meta{max-width:100%;gap:.55rem}
  body.extreme-inner .archive-meta span{max-width:100%;white-space:normal}
  body.extreme-inner :is(.studio-hero,.page-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero):after{background-size:72px}
  body.about-page .about-hero:after{background-size:110px}
  body.extreme-inner :is(.studio-hero-copy,.archive-intro-copy),
  body.extreme-inner :is(.studio-hero-copy,.archive-intro-copy)>p{
    width:auto!important;
    max-width:calc(100vw - 2.5rem)!important;
    min-width:0!important;
  }
  body.extreme-inner .archive-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  body.extreme-inner .archive-meta span{min-width:0}
  body.extreme-inner .x-menu-button{position:absolute;top:1rem;right:1.25rem;justify-self:auto}
}

/* Main projects catalog: website captures are clean, matching edge-to-edge cards. */
body.projects-page :is(#honey-b-pockets,#crop-control,#bf-glass-and-door){
  padding:0;
}
body.projects-page :is(#honey-b-pockets,#crop-control,#bf-glass-and-door) .portfolio-media{
  padding:0;
  border:0;
  aspect-ratio:4/3;
  background:#111;
}
body.projects-page :is(#honey-b-pockets,#crop-control,#bf-glass-and-door) .portfolio-media img{
  display:block;
  width:100%;
  height:100%;
  max-height:none;
  padding:0;
  border:0;
  aspect-ratio:auto;
  object-fit:cover!important;
  object-position:top center!important;
  background:#111;
}

/* Vigilante history: first animation */
.history-animation {
  padding: clamp(5rem, 10vw, 10rem) var(--pad);
  background: #121212;
  color: #fff;
}

.history-animation-inner {
  width: min(100%, var(--max));
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(240px, 0.65fr) minmax(0, 1.35fr);
  gap: clamp(2.5rem, 7vw, 8rem);
  align-items: center;
}

.history-animation-copy h2 {
  margin: 0 0 1.5rem;
  max-width: 11ch;
  font-size: clamp(2.6rem, 5vw, 5.5rem);
  line-height: 0.92;
  letter-spacing: -0.055em;
}

.history-animation-copy > p:not(.eyebrow) {
  max-width: 38rem;
  color: #bdb8b0;
  line-height: 1.75;
}

.history-animation-copy > a {
  display: inline-block;
  margin-top: 1.25rem;
  color: #f26a22;
  font-weight: 700;
  text-decoration: none;
}

.history-animation-video {
  overflow: hidden;
  border: 1px solid #343434;
  background: #050505;
  box-shadow: 0 2rem 5rem rgba(0, 0, 0, 0.35);
}

.history-animation-video iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
}

@media (max-width: 800px) {
  .history-animation-inner {
    grid-template-columns: 1fr;
  }
}

/* 3D studio: custom product modeling feature */
.product-model-feature {
  padding: clamp(5rem, 10vw, 10rem) var(--pad);
  background: #121212;
  color: #fff;
}

.product-model-feature-inner {
  width: min(100%, var(--max));
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.62fr);
  gap: clamp(3rem, 8vw, 9rem);
  align-items: center;
}

.product-model-copy h2 {
  margin: 0 0 1.5rem;
  max-width: 12ch;
  font-size: clamp(2.8rem, 5.5vw, 6rem);
  line-height: 0.9;
  letter-spacing: -0.055em;
}

.product-model-copy > p:not(.eyebrow) {
  max-width: 42rem;
  color: #bdb8b0;
  line-height: 1.75;
}

.product-model-copy .archive-meta {
  margin: 2rem 0;
}

.product-model-video {
  justify-self: center;
  width: min(100%, 430px);
  overflow: hidden;
  border: 1px solid #343434;
  background: #050505;
  box-shadow: 0 2rem 5rem rgba(0, 0, 0, 0.4);
}

.product-model-video iframe {
  display: block;
  width: 100%;
  aspect-ratio: 9 / 16;
  border: 0;
}

@media (max-width: 800px) {
  .product-model-feature-inner {
    grid-template-columns: 1fr;
  }
}

/* 2026-10-16 deep polish shared by all 27 inner pages. */
::selection{background:var(--x-orange);color:#111}
:focus-visible{outline:3px solid var(--x-orange);outline-offset:5px}
.x-header{transition:height .3s,background .3s,backdrop-filter .3s}
.x-header.is-scrolled{position:fixed;height:74px;background:rgba(9,9,9,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.1)}
.x-header.is-scrolled .x-brand{max-width:220px}
body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro):after{animation:x-orbit 10s ease-in-out infinite}
@keyframes x-orbit{50%{transform:scale(1.025);box-shadow:0 0 0 8vw transparent,0 0 0 calc(8vw + 1px) #2c2c29}}
.x-page-index{padding-left:1rem;border-left:1px solid #444}
body.extreme-inner :is(.art-card,.book-card,.logo-card,.team-card,.portfolio-item){position:relative;overflow:hidden}
body.extreme-inner :is(.art-card,.book-card,.logo-card,.team-card,.portfolio-item) img{transition:transform .8s cubic-bezier(.2,.8,.2,1),filter .35s}
body.extreme-inner :is(.art-card,.book-card,.logo-card,.team-card,.portfolio-item):hover img{transform:scale(1.025);filter:saturate(1.06)}
body.extreme-inner .portfolio-item{transition:transform .35s,box-shadow .35s}
body.extreme-inner .portfolio-item:hover{transform:translateY(-7px);box-shadow:0 24px 60px rgba(0,0,0,.16)}
body.extreme-inner .portfolio-copy{position:relative}
body.extreme-inner .portfolio-copy:after{content:"\2197\FE0E";position:absolute;right:clamp(1rem,2vw,2rem);bottom:clamp(1rem,2vw,2rem);color:var(--x-orange);font-size:1.35rem;transition:transform .25s}
body.extreme-inner .portfolio-item:hover .portfolio-copy:after{transform:translate(4px,-4px)}
body.extreme-inner :is(.history-animation-video,.product-model-video){border:0;box-shadow:0 2rem 6rem rgba(0,0,0,.5)}
body.extreme-inner :is(.history-animation-video,.product-model-video):before{content:"";display:block;height:4px;background:var(--x-orange)}
.x-backtop:hover{background:var(--x-orange);color:#111;border-color:var(--x-orange)}
body.extreme-inner footer a{transition:color .2s}body.extreme-inner footer a:hover{color:#fff}
@media(max-width:620px){.x-header.is-scrolled{height:66px}.x-header.is-scrolled .x-brand{max-width:165px}body.extreme-inner .portfolio-item:hover{transform:none;box-shadow:none}body.extreme-inner .portfolio-copy:after{display:none}}
@media(prefers-reduced-motion:reduce){body.extreme-inner :is(.page-hero,.studio-hero,.case-hero,.about-hero,.team-hero,.profile-hero,.testimonial-hero,.updates-hero,.post-hero,.private-work-intro):after{animation:none}}

/* Keep mobile navigation operable after the header changes to fixed on scroll. */
.x-header>.x-brand,.x-header>.x-context,.x-header>.x-menu-button{position:relative;z-index:2}
.x-menu-button{-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent}
.x-menu-button[aria-expanded=true]{color:#111;border-color:#111;background:transparent}
.x-menu-button[aria-expanded=true] b,.x-menu-button[aria-expanded=true] b:after{background:#111}
.x-nav{z-index:79;height:100dvh;overflow-y:auto;overscroll-behavior:contain}
body.menu-open{overflow:hidden}
body.menu-open .x-header.is-scrolled{backdrop-filter:none;-webkit-backdrop-filter:none;background:transparent;border-bottom-color:transparent}
@media(max-width:620px){
  body.extreme-inner .x-menu-button{position:relative;inset:auto;justify-self:end}
  .x-nav{padding-top:max(6.5rem,calc(env(safe-area-inset-top) + 5rem));padding-bottom:max(2rem,env(safe-area-inset-bottom))}
}

/* Hero copy is primary content: never hold it behind scroll-reveal opacity. */
body.extreme-inner :is(.page-hero-inner,.studio-hero-inner,.case-hero-inner,.about-hero-inner,.team-hero-inner,.profile-hero-inner,.testimonial-hero-inner,.updates-hero-inner,.post-hero-inner,.private-work-intro-inner){opacity:1;transform:none}

body.testimonials-page .testimonial-hero:after{background-position:82% 27%;background-size:clamp(72px,13%,112px)}

/* Web Portfolio — Level 2 working collection. */
.web-portfolio-level-two .private-work-intro{min-height:min(760px,88svh)}
.web2-library{padding:clamp(5rem,9vw,9rem) var(--x-pad);background:#eeeae0;color:#171716}.web2-inner{width:100%;max-width:var(--x-max);margin:auto}
.web2-heading{display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(2rem,8vw,9rem);align-items:end;margin-bottom:clamp(4rem,8vw,8rem)}.web2-heading h2{margin:0;font-size:clamp(3rem,6vw,7rem);line-height:.88;letter-spacing:-.06em}.web2-heading>p{max-width:530px;margin:0;color:#625e57;font-size:clamp(1rem,1.3vw,1.18rem);line-height:1.7}
.web2-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.2rem,3vw,3rem)}.web2-card{min-width:0;background:#fff;border:1px solid #c9c2b6;transition:transform .3s,box-shadow .3s}.web2-card:hover{transform:translateY(-6px);box-shadow:0 1.5rem 4rem rgba(35,29,20,.14)}.web2-card>a{display:block;height:100%}.web2-card figure{height:clamp(270px,35vw,520px);margin:0;overflow:hidden;background:#171716}.web2-card figure img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .8s cubic-bezier(.2,.8,.2,1)}.web2-card:hover figure img{transform:scale(1.015)}
.web2-featured{grid-column:1/-1}.web2-featured>a{display:grid;grid-template-columns:1.35fr .65fr}.web2-featured figure{height:min(58vw,720px)}.web2-copy{padding:clamp(1.5rem,3vw,3rem);display:flex;flex-direction:column;align-items:flex-start}.web2-featured .web2-copy{justify-content:flex-end;background:#151514;color:#fff}.web2-copy>span{color:var(--x-orange);font-size:.65rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.web2-copy h3{margin:1.2rem 0;font-size:clamp(2rem,3.5vw,4.6rem);line-height:.92;letter-spacing:-.05em}.web2-copy p{max-width:520px;margin:0;color:#625e57;line-height:1.65}.web2-featured .web2-copy p{color:#aaa}.web2-copy b{margin-top:2rem;padding-top:1rem;border-top:1px solid #bdb7ad;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}.web2-featured .web2-copy b{border-color:#555;color:var(--x-orange)}
.web2-development{background:#181817;color:#fff}.web2-development .web2-copy p{color:#aaa}.web2-development .web2-copy b{border-color:#555}.web2-placeholder-art{height:clamp(270px,35vw,520px);position:relative;display:grid;place-items:center;overflow:hidden;background:var(--x-orange);color:#111}.web2-placeholder-art span{position:relative;z-index:2;font-size:clamp(5rem,12vw,11rem);font-weight:600;letter-spacing:-.09em}.web2-placeholder-art i{position:absolute;width:70%;aspect-ratio:1;border:1px solid rgba(0,0,0,.28);border-radius:50%}.web2-placeholder-art i:last-child{width:42%}.web2-coming-soon .web2-copy b{color:#777}
.web2-more{display:grid;grid-template-columns:.45fr 1.55fr;gap:clamp(2rem,6vw,7rem);padding:clamp(3rem,6vw,6rem) 0 0;margin-top:clamp(4rem,8vw,8rem);border-top:1px solid #aaa49a}.web2-more span{font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.web2-more p{max-width:650px;margin:0;color:#625e57;line-height:1.7}
@media(max-width:800px){.web2-heading,.web2-featured>a{grid-template-columns:1fr}.web2-featured figure{height:min(80vw,600px)}}
@media(max-width:620px){.web-portfolio-level-two .private-work-intro h1{font-size:clamp(2.6rem,12.5vw,3.1rem);line-height:.88;letter-spacing:-.065em;overflow-wrap:normal}.web-portfolio-level-two .private-work-summary>p:first-child{font-size:1rem}.web2-heading h2{font-size:clamp(2.55rem,12vw,3.05rem);overflow-wrap:normal}.web2-grid{grid-template-columns:1fr}.web2-card,.web2-featured{grid-column:auto}.web2-card figure,.web2-featured figure,.web2-placeholder-art{height:auto;aspect-ratio:4/3}.web2-card figure img{object-fit:cover}.web2-copy{padding:1.4rem}.web2-copy h3{font-size:clamp(2rem,10vw,3rem)}.web2-more{grid-template-columns:1fr;gap:1rem}}
@media(max-width:620px){.web-portfolio-level-two .private-work-intro-inner{min-width:0;width:100%;max-width:100%}.web-portfolio-level-two .private-work-intro h1{font-size:clamp(2.45rem,11.5vw,2.85rem)}}

/* Web Portfolio — Level 3: cinematic progressive-enhancement layer. */
.web-portfolio-level-three{--web3-lime:#f26d21;--web3-violet:#786cff;background:#090909}
.web-portfolio-level-three .x-progress{display:none}
.web3-progress{position:fixed;inset:0 0 auto;height:4px;z-index:150;pointer-events:none}.web3-progress i{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--x-orange),var(--web3-lime));transform:scaleX(0);transform-origin:left;will-change:transform}
.web3-cursor{position:fixed;left:0;top:0;width:440px;aspect-ratio:1;border-radius:50%;z-index:0;pointer-events:none;opacity:0;background:radial-gradient(circle,rgba(242,109,33,.16),transparent 68%);transform:translate3d(-50%,-50%,0);transition:opacity .35s;will-change:transform}
.web-portfolio-level-three.has-pointer .web3-cursor{opacity:1}
.web-portfolio-level-three .private-work-intro{isolation:isolate;min-height:100svh;background:#090909}
.web-portfolio-level-three .private-work-intro:before{width:clamp(390px,52vw,880px);right:-18%;top:-32%;background:conic-gradient(from 45deg,var(--x-orange),var(--web3-violet),var(--web3-lime),var(--x-orange));filter:saturate(1.1);animation:web3-orb 16s linear infinite}
.web-portfolio-level-three .private-work-intro:after{width:min(58vw,880px);right:-2vw;top:7%;border-color:#454541;box-shadow:0 0 0 9vw transparent,0 0 0 calc(9vw + 1px) #292927,0 0 0 18vw transparent,0 0 0 calc(18vw + 1px) #1e1e1c;animation:web3-rings 12s ease-in-out infinite}
.web-portfolio-level-three .private-work-intro-inner{z-index:3}
.web-portfolio-level-three .private-work-intro h1{max-width:1350px}.web-portfolio-level-three .private-work-intro h1 span{display:inline-block;color:#fff}.web-portfolio-level-three .private-work-intro h1 em{color:var(--web3-lime);text-shadow:0 0 45px rgba(216,255,57,.12)}
.web-portfolio-level-three .private-work-count strong{color:var(--web3-lime)}
.web3-marquee{position:relative;z-index:4;overflow:hidden;background:var(--web3-lime);color:#111;border-block:1px solid #111;transform:rotate(-1.2deg) scale(1.02)}.web3-marquee>div{display:flex;width:max-content;align-items:center;padding:.7rem 0;animation:web3-track 25s linear infinite}.web3-marquee span{font-size:clamp(.8rem,1.2vw,1.05rem);font-weight:700;letter-spacing:.1em;text-transform:uppercase}.web3-marquee i{margin:0 1.6rem;font-style:normal}
.web-portfolio-level-three .web2-library{position:relative;z-index:2;background:#0b0b0a;color:#fff;overflow:hidden}.web-portfolio-level-three .web2-library:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(#000,transparent 60%)}
.web-portfolio-level-three .web2-inner{position:relative;z-index:1}.web-portfolio-level-three .web2-heading>p,.web-portfolio-level-three .web2-more p{color:#aaa}.web-portfolio-level-three .web2-heading .eyebrow{color:var(--web3-lime)}
.web-portfolio-level-three .web2-grid{gap:clamp(2rem,5vw,6rem)}
.web-portfolio-level-three .web2-card{position:relative;background:#141413;border-color:#393936;color:#fff;overflow:hidden;transform-style:preserve-3d;will-change:transform;transition:transform .18s ease-out,box-shadow .35s,border-color .35s;--rx:0deg;--ry:0deg;--lift:0px;transform:perspective(1100px) translateY(var(--lift)) rotateX(var(--rx)) rotateY(var(--ry))}
.web-portfolio-level-three .web2-card:nth-child(3n){margin-top:clamp(1rem,5vw,5rem)}.web-portfolio-level-three .web2-card:nth-child(4n){margin-top:clamp(-3rem,-2vw,-1rem)}.web-portfolio-level-three .web2-featured{margin-top:0}
.web-portfolio-level-three .web2-card:hover{--lift:-10px;border-color:var(--web3-lime);box-shadow:0 2rem 7rem rgba(0,0,0,.55),0 0 0 1px rgba(216,255,57,.16)}
.web-portfolio-level-three .web2-card:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.18),transparent 34%);opacity:0;transition:opacity .25s}.web-portfolio-level-three .web2-card:hover:after{opacity:1}
.web-portfolio-level-three .web2-card figure{position:relative}.web-portfolio-level-three .web2-card figure:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 55%,rgba(216,255,57,.2));mix-blend-mode:screen;opacity:0;transition:opacity .35s}.web-portfolio-level-three .web2-card:hover figure:after{opacity:1}
.web-portfolio-level-three .web2-card figure img{filter:saturate(.85) contrast(1.03);transform:scale(1.01)}.web-portfolio-level-three .web2-card:hover figure img{filter:saturate(1.12) contrast(1.04);transform:scale(1.045)}
.web-portfolio-level-three .web2-copy p{color:#aaa}.web-portfolio-level-three .web2-copy>span,.web-portfolio-level-three .web2-copy b{color:var(--web3-lime)}.web-portfolio-level-three .web2-copy b{border-color:#4a4a46}.web-portfolio-level-three .web2-featured .web2-copy{background:linear-gradient(145deg,#111 10%,#1b1b16)}
.web-portfolio-level-three .web2-development{background:linear-gradient(145deg,#17151f,#111)}.web-portfolio-level-three .web2-placeholder-art{background:linear-gradient(135deg,var(--x-orange),var(--web3-violet));color:#fff}.web-portfolio-level-three .web2-placeholder-art i{border-color:rgba(255,255,255,.4);animation:web3-ring-spin 14s linear infinite}.web-portfolio-level-three .web2-placeholder-art i:last-child{animation-direction:reverse;animation-duration:9s}
.web-portfolio-level-three .web2-more{border-color:#444}.web-portfolio-level-three .web2-more span{color:var(--web3-lime)}
.web3-reveal{opacity:0;transform:translateY(70px) scale(.985);transition:opacity .8s,transform .9s cubic-bezier(.16,1,.3,1)}.web3-reveal.web3-visible{opacity:1;transform:none}
@keyframes web3-orb{to{transform:rotate(360deg)}}@keyframes web3-rings{50%{transform:translate3d(-3%,3%,0) scale(1.035)}}@keyframes web3-track{to{transform:translateX(-50%)}}@keyframes web3-ring-spin{to{transform:rotate(360deg)}}
@media(max-width:800px){.web-portfolio-level-three .web2-card:nth-child(n){margin-top:0}.web3-cursor{display:none}}
@media(max-width:620px){.web-portfolio-level-three .private-work-intro-inner{width:calc(100vw - 2.5rem);max-width:calc(100vw - 2.5rem);min-width:0}.web-portfolio-level-three .private-work-summary{width:100%;max-width:100%;min-width:0;margin-inline:0}.web-portfolio-level-three .private-work-summary>p{min-width:0;max-width:100%;overflow-wrap:break-word}.web-portfolio-level-three .private-work-intro h1{font-size:clamp(2.7rem,13vw,3.25rem)}.web-portfolio-level-three .private-work-intro:before{width:115vw;right:-62%;top:-10%}.web-portfolio-level-three .private-work-intro:after{width:90vw;right:-45%;top:13%}.web3-marquee{transform:rotate(-1deg) scale(1.03)}.web-portfolio-level-three .web2-grid{gap:2rem}.web-portfolio-level-three .web2-card{transform:none!important}.web3-reveal{transform:translateY(35px)}}
@media(prefers-reduced-motion:reduce){.web-portfolio-level-three .private-work-intro:before,.web-portfolio-level-three .private-work-intro:after,.web3-marquee>div,.web-portfolio-level-three .web2-placeholder-art i{animation:none}.web3-reveal{opacity:1;transform:none;transition:none}.web-portfolio-level-three .web2-card{transform:none!important;transition:none}.web3-cursor{display:none}}
@media(max-width:620px){body.web-portfolio-level-three .private-work-intro .private-work-intro-inner{width:calc(100vw - 2.5rem)!important;max-width:calc(100vw - 2.5rem)!important;min-width:0!important}body.web-portfolio-level-three .private-work-intro .private-work-summary{width:100%!important;max-width:100%!important;grid-template-columns:minmax(0,1fr)!important}body.web-portfolio-level-three .private-work-intro .private-work-summary>p{width:100%;max-width:100%;white-space:normal}}
.web3-mobile-break{display:none}@media(max-width:620px){.web3-mobile-break{display:block}}

/* Level 3 push: orderly grid, higher-impact interaction. */
.web-portfolio-level-three .web2-card:nth-child(n){margin-top:0}
.web3-atmosphere{position:fixed;inset:auto -18vw -35vw auto;width:75vw;aspect-ratio:1;border-radius:50%;z-index:0;pointer-events:none;background:var(--web3-active,#f26d21);opacity:.11;filter:blur(110px);transition:background .9s,transform 1.2s cubic-bezier(.16,1,.3,1);transform:translate3d(0,0,0)}
.web3-hud{position:fixed;right:1.2rem;top:50%;z-index:38;display:grid;justify-items:end;gap:.15rem;padding:.8rem;border-right:2px solid var(--web3-lime);color:#fff;transform:translateY(-50%);mix-blend-mode:difference;pointer-events:none}.web3-hud span,.web3-hud i{font-size:.52rem;letter-spacing:.16em;text-transform:uppercase;font-style:normal}.web3-hud strong{font-size:2.6rem;line-height:.9;letter-spacing:-.06em;font-weight:500}
.web-portfolio-level-three .web2-card{counter-increment:web3-card}.web-portfolio-level-three .web2-grid{counter-reset:web3-card}
.web3-card-number{position:absolute;top:1rem;right:1rem;z-index:4;display:grid;place-items:center;width:46px;aspect-ratio:1;border-radius:50%;background:#0b0b0bcc;border:1px solid #ffffff55;color:#fff;font-size:.68rem;font-weight:700;letter-spacing:.08em;backdrop-filter:blur(10px);transition:.3s}.web2-card:hover .web3-card-number{background:var(--web3-lime);border-color:var(--web3-lime);color:#111;transform:rotate(8deg) scale(1.08)}
.web3-image-curtain{position:absolute;inset:0;z-index:3;pointer-events:none;background:var(--web3-lime);transform-origin:right;transform:scaleX(1);transition:transform 1s cubic-bezier(.77,0,.18,1)}.web3-visible .web3-image-curtain{transform:scaleX(0)}
.web-portfolio-level-three .web2-card figure{clip-path:inset(0 0 0 0);transition:clip-path .8s cubic-bezier(.16,1,.3,1)}.web-portfolio-level-three .web2-card:hover figure{clip-path:inset(1.2%)}
.web-portfolio-level-three .web2-card h3{transition:letter-spacing .35s,color .35s}.web-portfolio-level-three .web2-card:hover h3{color:var(--web3-lime);letter-spacing:-.06em}
.web-portfolio-level-three .web2-card b{position:relative;overflow:hidden}.web-portfolio-level-three .web2-card b:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--web3-lime);transform:translateX(-105%);transition:transform .35s}.web-portfolio-level-three .web2-card:hover b:after{transform:none}
.web-portfolio-level-three.web3-card-hover .web3-cursor{width:92px;background:var(--web3-lime);opacity:.92;mix-blend-mode:difference}.web-portfolio-level-three.web3-card-hover .web3-cursor:after{content:"VIEW";position:absolute;inset:0;display:grid;place-items:center;color:#111;font-size:.62rem;font-weight:800;letter-spacing:.12em}
.web-portfolio-level-three.web3-loaded .private-work-intro .eyebrow{animation:web3-enter .8s .1s both}.web-portfolio-level-three.web3-loaded .private-work-intro h1{animation:web3-enter 1s .18s both}.web-portfolio-level-three.web3-loaded .private-work-summary{animation:web3-enter 1s .32s both}
@keyframes web3-enter{from{opacity:0;transform:translateY(45px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@media(max-width:900px){.web3-hud{display:none}.web3-atmosphere{width:120vw;right:-65vw;bottom:-40vw}}
@media(max-width:620px){.web3-image-curtain{display:none}.web-portfolio-level-three .web2-card:hover figure{clip-path:none}.web3-atmosphere{filter:blur(75px);opacity:.08}}
@media(prefers-reduced-motion:reduce){.web3-image-curtain{display:none}.web-portfolio-level-three.web3-loaded .private-work-intro .eyebrow,.web-portfolio-level-three.web3-loaded .private-work-intro h1,.web-portfolio-level-three.web3-loaded .private-work-summary{animation:none}}

/* Web Portfolio — Level 4: experimental transmission interface. */
.web-portfolio-level-four{--web4-cyan:#54f8ff;--web4-pink:#ff3ca6;--web4-yellow:#f26d21;background:#030307;color:#fff}
.web4-field{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.62;mix-blend-mode:screen}
.web4-scanlines{position:fixed;inset:0;z-index:145;pointer-events:none;opacity:.055;background:repeating-linear-gradient(0deg,transparent 0 3px,#fff 4px);mix-blend-mode:overlay}
.web4-signal{position:fixed;left:1rem;bottom:1rem;z-index:42;display:grid;gap:.15rem;padding:.75rem 1rem;border-left:2px solid var(--web4-cyan);background:#030307aa;color:#fff;backdrop-filter:blur(12px);pointer-events:none}.web4-signal span,.web4-signal i{font-size:.48rem;letter-spacing:.18em;font-style:normal}.web4-signal strong{font-size:.9rem;letter-spacing:.08em;color:var(--web4-cyan)}.web4-signal i{color:#8b8b94}.web4-signal i:before{content:"";display:inline-block;width:5px;height:5px;margin-right:.5rem;border-radius:50%;background:var(--web4-yellow);box-shadow:0 0 12px var(--web4-yellow);animation:web4-blink 1.3s steps(2) infinite}
.web-portfolio-level-four .web3-progress i{background:linear-gradient(90deg,var(--web4-cyan),var(--web4-pink),var(--web4-yellow))}
.web-portfolio-level-four .private-work-intro{background:radial-gradient(circle at 70% 45%,#17102f 0,transparent 33%),#030307}
.web-portfolio-level-four .private-work-intro:before{background:conic-gradient(from var(--web4-spin,0deg),transparent 0 18%,var(--web4-cyan) 20% 23%,transparent 25% 48%,var(--web4-pink) 50% 53%,transparent 55% 78%,var(--web4-yellow) 80% 83%,transparent 85%);filter:blur(1px);opacity:.82;animation:web4-disc 18s linear infinite}
.web-portfolio-level-four .private-work-intro:after{border:0;border-radius:0;background:repeating-radial-gradient(circle,transparent 0 42px,#ffffff12 43px 44px);box-shadow:none;transform:perspective(700px) rotateX(63deg) rotateZ(-12deg) scale(1.4);animation:web4-grid 12s ease-in-out infinite}
.web-portfolio-level-four .private-work-intro h1{position:relative;max-width:1400px;text-transform:uppercase}.web-portfolio-level-four .private-work-intro h1 span{color:var(--web4-cyan)!important;text-shadow:-4px 0 0 var(--web4-pink),4px 0 0 #1c37ff}.web-portfolio-level-four .private-work-intro h1 em{color:#fff;text-shadow:0 0 35px #54f8ff55}
.web-portfolio-level-four .private-work-intro h1:after{content:attr(data-text);position:absolute;left:2px;top:0;color:transparent;-webkit-text-stroke:1px #ffffff25;clip-path:inset(42% 0 35%);transform:translateX(7px);pointer-events:none;animation:web4-glitch 4.5s steps(1) infinite}
body.web-portfolio-level-four.web3-loaded .private-work-intro .eyebrow,body.web-portfolio-level-four.web3-loaded .private-work-intro h1,body.web-portfolio-level-four.web3-loaded .private-work-summary{animation:none;opacity:1;transform:none;filter:none}
.web-portfolio-level-four .private-work-count strong{color:var(--web4-cyan);text-shadow:2px 2px 0 var(--web4-pink)}
.web-portfolio-level-four .web3-marquee{background:#030307;color:#fff;border-color:var(--web4-cyan);box-shadow:0 0 30px #54f8ff44}.web-portfolio-level-four .web3-marquee i{color:var(--web4-pink)}
.web-portfolio-level-four .web2-library{background:#030307}.web-portfolio-level-four .web2-library:before{opacity:.28;background-image:linear-gradient(#54f8ff12 1px,transparent 1px),linear-gradient(90deg,#ff3ca612 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(#000 0 70%,transparent)}
.web-portfolio-level-four .web2-heading .eyebrow,.web-portfolio-level-four .web2-more span{color:var(--web4-cyan)}.web-portfolio-level-four .web2-heading h2{background:linear-gradient(90deg,#fff,var(--web4-cyan),var(--web4-pink));background-clip:text;-webkit-background-clip:text;color:transparent}
.web-portfolio-level-four .web2-card{background:#08080e;border:1px solid #54f8ff45;box-shadow:inset 0 0 0 1px #ff3ca611;clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px))}
.web-portfolio-level-four .web2-card:nth-child(even){border-color:#ff3ca655}.web-portfolio-level-four .web2-card:hover{border-color:var(--web4-cyan);box-shadow:0 0 0 1px var(--web4-cyan),0 0 55px #54f8ff33,0 2rem 7rem #000}
.web-portfolio-level-four .web2-card:before{content:"SIGNAL // " counter(web3-card,decimal-leading-zero);position:absolute;left:1rem;top:1rem;z-index:5;color:var(--web4-cyan);font-size:.48rem;letter-spacing:.18em;text-shadow:0 0 8px currentColor}.web-portfolio-level-four .web2-card:nth-child(even):before{color:var(--web4-pink)}
.web-portfolio-level-four .web3-card-number{border-radius:0;clip-path:polygon(20% 0,100% 0,100% 80%,80% 100%,0 100%,0 20%);background:#030307;border-color:var(--web4-cyan);color:var(--web4-cyan)}
.web-portfolio-level-four .web2-card:hover .web3-card-number{background:var(--web4-cyan);border-color:var(--web4-cyan);color:#030307;transform:none}
.web-portfolio-level-four .web2-copy>span,.web-portfolio-level-four .web2-copy b{color:var(--web4-cyan)}.web-portfolio-level-four .web2-card:nth-child(even) .web2-copy>span,.web-portfolio-level-four .web2-card:nth-child(even) .web2-copy b{color:var(--web4-pink)}.web-portfolio-level-four .web2-card:hover h3{color:#fff;text-shadow:2px 0 var(--web4-pink),-2px 0 var(--web4-cyan)}
.web-portfolio-level-four .web3-image-curtain{background:linear-gradient(90deg,var(--web4-cyan),var(--web4-pink))}.web-portfolio-level-four .web2-card figure img{filter:saturate(.75) contrast(1.12)}.web-portfolio-level-four .web2-card:hover figure img{filter:saturate(1.25) contrast(1.08) hue-rotate(var(--web4-hue,0deg))}
.web-portfolio-level-four .web3-hud{border-color:var(--web4-cyan)}.web-portfolio-level-four .web3-atmosphere{opacity:.16;filter:blur(150px)}
.web4-coordinates{position:absolute;left:1rem;bottom:1rem;z-index:4;padding:.4rem .55rem;background:#030307cc;color:var(--web4-cyan);font:600 .48rem/1.2 monospace;letter-spacing:.08em;pointer-events:none}
@keyframes web4-disc{to{transform:rotate(360deg)}}@keyframes web4-grid{50%{transform:perspective(700px) rotateX(63deg) rotateZ(-7deg) scale(1.5)}}@keyframes web4-blink{50%{opacity:.25}}@keyframes web4-glitch{0%,92%,100%{transform:translateX(7px)}93%{transform:translate(-10px,3px)}95%{transform:translate(14px,-2px)}97%{transform:translateX(-4px)}}
@media(max-width:900px){.web4-signal{display:none}.web4-field{opacity:.42}.web-portfolio-level-four .web2-card{clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}}
@media(max-width:620px){.web-portfolio-level-four .private-work-intro h1{font-size:clamp(2.35rem,11.5vw,2.85rem);line-height:.9}.web-portfolio-level-four .private-work-intro:after{opacity:.55}.web4-scanlines{opacity:.035}.web4-coordinates{display:none}}
@media(prefers-reduced-motion:reduce){.web4-field{display:none}.web4-signal i:before,.web-portfolio-level-four .private-work-intro:before,.web-portfolio-level-four .private-work-intro:after,.web-portfolio-level-four .private-work-intro h1:after{animation:none}}

/* Web Portfolio — Level 5: monochrome future / acid signal. */
.web-portfolio-level-five{--x-orange:#f26d21;--web3-lime:#f26d21;--web3-violet:#a84416;--web4-cyan:#f26d21;--web4-pink:#a84416;--web4-yellow:#eeeae0;background:#050505;color:#eeeae0}
.web-portfolio-level-five .web4-scanlines{opacity:.035}
.web-portfolio-level-five .web3-progress i{background:linear-gradient(90deg,#eeeae0 0 20%,#f26d21 20% 72%,#a84416 72%)}
body.web-portfolio-level-five .private-work-intro{background:radial-gradient(circle at 72% 42%,#282825 0,transparent 34%),#050505}
body.web-portfolio-level-five .private-work-intro:before{background:conic-gradient(from 0deg,transparent 0 19%,#f26d21 20% 22%,transparent 23% 49%,#a84416 50% 52%,transparent 53% 79%,#eeeae0 80% 81%,transparent 82%)!important;opacity:.68!important}
body.web-portfolio-level-five .private-work-intro:after{background:repeating-radial-gradient(circle,transparent 0 42px,#ffffff10 43px 44px)!important}
.web-portfolio-level-five .private-work-intro h1 span{color:#f26d21!important;text-shadow:-4px 0 #a84416,4px 0 #eeeae055!important}.web-portfolio-level-five .private-work-intro h1 em{color:#eeeae0!important;text-shadow:0 0 42px #f26d2138!important}.web-portfolio-level-five .private-work-count strong{color:#f26d21;text-shadow:2px 2px #a84416}
.web-portfolio-level-five .web3-marquee{background:#050505;color:#eeeae0;border-color:#f26d21;box-shadow:0 0 32px #f26d2128}.web-portfolio-level-five .web3-marquee i{color:#a84416}
.web-portfolio-level-five .web2-library{background:#050505}.web-portfolio-level-five .web2-library:before{background-image:linear-gradient(#f26d210c 1px,transparent 1px),linear-gradient(90deg,#ffffff0b 1px,transparent 1px);opacity:.3}.web-portfolio-level-five .web2-heading h2{background:linear-gradient(90deg,#eeeae0,#f26d21 62%,#a84416);background-clip:text;-webkit-background-clip:text;color:transparent}.web-portfolio-level-five .web2-heading .eyebrow{color:#f26d21}
.web-portfolio-level-five .web2-card{background:#0a0a0a;border-color:#f26d2140;box-shadow:inset 0 0 0 1px #ffffff08}.web-portfolio-level-five .web2-card:nth-child(even){border-color:#a8441644}.web-portfolio-level-five .web2-card:hover{border-color:#f26d21;box-shadow:0 0 0 1px #f26d21,0 0 60px #f26d2122,0 2rem 7rem #000}.web-portfolio-level-five .web2-card:before{color:#f26d21}.web-portfolio-level-five .web2-card:nth-child(even):before{color:#a84416}
.web-portfolio-level-five .web2-card figure img{filter:grayscale(1) contrast(1.13) brightness(.82)}.web-portfolio-level-five .web2-card:hover figure img{filter:grayscale(0) saturate(1.04) contrast(1.06)}
.web-portfolio-level-five .web3-card-number{background:#050505;border-color:#f26d21;color:#f26d21}.web-portfolio-level-five .web2-card:hover .web3-card-number{background:#f26d21;color:#050505;border-color:#f26d21}.web-portfolio-level-five .web2-copy>span,.web-portfolio-level-five .web2-copy b{color:#f26d21}.web-portfolio-level-five .web2-card:nth-child(even) .web2-copy>span,.web-portfolio-level-five .web2-card:nth-child(even) .web2-copy b{color:#a84416}.web-portfolio-level-five .web2-card:hover h3{color:#eeeae0;text-shadow:2px 0 #a84416,-2px 0 #f26d21}

/* Level 5 project-title hover: crisp signal lock instead of chromatic blur. */
.web-portfolio-level-five .web2-copy h3{position:relative;display:table;padding-right:.55em;text-shadow:none!important;transition:color .24s ease,transform .42s cubic-bezier(.16,1,.3,1),letter-spacing .42s cubic-bezier(.16,1,.3,1)}
.web-portfolio-level-five .web2-copy h3:before{content:"";position:absolute;left:0;right:0;bottom:-.12em;height:3px;background:linear-gradient(90deg,#f26d21 0 72%,#eeeae0 72% 84%,#a84416 84%);transform:scaleX(0);transform-origin:right;transition:transform .48s cubic-bezier(.16,1,.3,1)}
.web-portfolio-level-five .web2-copy h3:after{content:"";position:absolute;right:0;top:.08em;width:.22em;height:.22em;border-top:2px solid #f26d21;border-right:2px solid #f26d21;opacity:0;transform:translate(-.35em,.35em) rotate(45deg);transition:opacity .2s,transform .42s cubic-bezier(.16,1,.3,1)}
.web-portfolio-level-five .web2-card:hover .web2-copy h3,.web-portfolio-level-five .web2-card:focus-within .web2-copy h3{color:#eeeae0;text-shadow:none!important;transform:translateX(.12em);letter-spacing:-.052em}
.web-portfolio-level-five .web2-card:hover .web2-copy h3:before,.web-portfolio-level-five .web2-card:focus-within .web2-copy h3:before{transform:scaleX(1);transform-origin:left}
.web-portfolio-level-five .web2-card:hover .web2-copy h3:after,.web-portfolio-level-five .web2-card:focus-within .web2-copy h3:after{opacity:1;transform:translate(0,0) rotate(45deg)}
.web-portfolio-level-five .web3-image-curtain{background:linear-gradient(90deg,#f26d21,#a84416)}.web-portfolio-level-five .web3-hud{border-color:#f26d21}.web-portfolio-level-five .web4-signal{border-color:#f26d21}.web-portfolio-level-five .web4-signal strong{color:#f26d21}.web-portfolio-level-five .web4-signal i:before{background:#a84416;box-shadow:0 0 12px #a84416}
.web5-rail{position:fixed;right:0;top:0;bottom:0;z-index:41;display:flex;align-items:center;gap:1.5rem;padding:.65rem;background:#050505d9;border-left:1px solid #ffffff22;color:#98988f;writing-mode:vertical-rl;text-transform:uppercase;font-size:.48rem;letter-spacing:.18em;pointer-events:none}.web5-rail i{color:#a84416;font-style:normal}
.web5-seal{position:relative;z-index:5;width:clamp(135px,17vw,245px);margin:clamp(-5rem,-6vw,-2rem) var(--x-pad) clamp(2rem,4vw,4rem) auto;color:#eeeae0;mix-blend-mode:difference}.web5-seal svg{display:block;width:100%;overflow:visible;animation:web5-seal 22s linear infinite}.web5-seal text{fill:currentColor;font:700 10px/1 Helvetica,Arial,sans-serif;letter-spacing:2px}.web5-seal circle,.web5-seal path{fill:none;stroke:currentColor;stroke-width:1}.web5-seal path:last-child{stroke:#a84416;stroke-width:3}
@keyframes web5-seal{to{transform:rotate(360deg)}}
@media(max-width:900px){.web5-rail{display:none}}@media(max-width:620px){.web5-seal{width:120px;margin-top:-2rem}.web-portfolio-level-five .private-work-intro h1{font-size:clamp(2rem,9.6vw,2.35rem);line-height:.92;letter-spacing:-.065em}}
@media(prefers-reduced-motion:reduce){.web5-seal svg{animation:none}}

/* Level 6 restores the dimensional circular Vigilante emblem in the brand palette. */
.web-portfolio-level-six{--x-orange:#f26d21;--web3-lime:#f26d21;--web3-violet:#f26d21;--web4-cyan:#f26d21;--web4-pink:#f26d21;--web4-yellow:#eeeae0;--web6-orange:#f26d21;--web6-orange-deep:#7d2a08;--web6-tilt-x:-8deg;--web6-tilt-y:-18deg;--web6-shift-x:0px;--web6-shift-y:0px}
.web-portfolio-level-six .web3-progress i{background:linear-gradient(90deg,#eeeae0 0 20%,var(--web6-orange) 20% 100%)}
.web-portfolio-level-six .web3-marquee{border-color:var(--web6-orange);box-shadow:0 0 32px #f26d2128}
.web-portfolio-level-six .web2-heading .eyebrow,.web-portfolio-level-six .web2-copy>span,.web-portfolio-level-six .web2-copy b,.web-portfolio-level-six .web2-more span{color:var(--web6-orange)}
.web-portfolio-level-six .web2-heading h2{background:linear-gradient(90deg,#eeeae0,var(--web6-orange) 72%,#a83a0d);background-clip:text;-webkit-background-clip:text;color:transparent}
.web-portfolio-level-six .web2-card{border-color:#f26d2148}.web-portfolio-level-six .web2-card:hover{border-color:var(--web6-orange);box-shadow:0 0 0 1px var(--web6-orange),0 0 60px #f26d2128,0 2rem 7rem #000}
.web-portfolio-level-six .web3-card-number{border-color:var(--web6-orange);color:var(--web6-orange)}.web-portfolio-level-six .web2-card:hover .web3-card-number{background:var(--web6-orange);border-color:var(--web6-orange)}
.web-portfolio-level-six .web2-copy h3:before{background:linear-gradient(90deg,var(--web6-orange) 0 78%,#eeeae0 78% 88%,#7d2a08 88%)}.web-portfolio-level-six .web2-copy h3:after{border-color:var(--web6-orange)}
body.web-portfolio-level-six .private-work-intro{isolation:isolate;perspective:1100px;background:radial-gradient(circle at 76% 39%,#292923 0,transparent 36%),#050505}
body.web-portfolio-level-six .private-work-intro:before{background:conic-gradient(from 0deg,transparent 0 19%,var(--web6-orange) 20% 22%,transparent 23% 49%,#eeeae0 50% 51%,transparent 52% 79%,#7d2a08 80% 82%,transparent 83%)!important;opacity:.38!important}
.web6-mark-stage{position:absolute;z-index:1;right:clamp(3rem,7vw,8rem);top:clamp(10rem,18vh,14rem);width:clamp(230px,26vw,430px);aspect-ratio:1;transform-style:preserve-3d;transform:translate3d(var(--web6-shift-x),var(--web6-shift-y),0) rotateX(var(--web6-tilt-x)) rotateY(var(--web6-tilt-y)) rotateZ(7deg);transition:transform .16s ease-out;animation:web6-breathe 5.5s ease-in-out infinite;pointer-events:none}
.web6-mark-stage:before,.web6-mark-stage:after{content:"";position:absolute;inset:-10%;border:1px solid #f26d215c;border-radius:50%;transform:translateZ(-12px);box-shadow:0 0 38px #f26d211c}
.web6-mark-stage:after{inset:-23%;border-color:#ffffff1c;transform:translateZ(-28px) rotateX(3deg);box-shadow:none}
.web6-mark-face,.web6-mark-depth,.web6-mark-shadow{position:absolute;inset:0;border-radius:50%}
.web6-mark-face{z-index:3;display:grid;place-items:center;overflow:hidden;border:2px solid var(--web6-orange);background:radial-gradient(circle at 35% 27%,#31312f 0 7%,#111 43%,#050505 76%);box-shadow:inset 0 0 0 10px #080808,inset 0 0 0 11px #f26d216e,inset 20px 16px 45px #ffffff12,inset -28px -25px 60px #000,0 0 22px #f26d2140,0 0 75px #f26d211f;transform:translateZ(24px)}
.web6-mark-face:before{content:"";position:absolute;inset:11%;border:1px solid #ffffff26;border-radius:50%;background:conic-gradient(from 205deg,transparent 0 24%,#ffffff18 30%,transparent 37% 72%,#f26d212b 78%,transparent 84%);box-shadow:inset 0 0 42px #000}
.web6-mark-face:after{content:"VIGILANTE / 06";position:absolute;right:8%;top:46%;color:#f26d21a8;font-size:.48rem;letter-spacing:.18em;writing-mode:vertical-rl}
.web6-mark-face img{position:relative;z-index:2;width:38%;height:54%;object-fit:contain;filter:brightness(0) invert(1) drop-shadow(10px 14px 16px #000);opacity:.98;transform:translateZ(38px)}
.web6-mark-depth{z-index:2;inset:1%;background:linear-gradient(145deg,#f26d21,#6f2308 48%,#130704 75%);transform:translate3d(15px,18px,0);box-shadow:inset -14px -12px 28px #100400}
.web6-mark-shadow{z-index:1;background:#000;opacity:.8;filter:blur(28px);transform:translate3d(36px,46px,-35px) scale(.9)}
.web6-mark-glint{position:absolute;z-index:4;left:18%;top:10%;width:64%;height:1px;background:linear-gradient(90deg,transparent,#fff,transparent);box-shadow:0 0 15px #fff;transform:translateZ(35px) rotate(-17deg);animation:web6-glint 4.8s ease-in-out infinite}
.web-portfolio-level-six .private-work-intro-inner{z-index:3}
.web-portfolio-level-six .private-work-intro h1{max-width:980px}
.web-portfolio-level-six .private-work-intro h1 span{color:#eeeae0!important;text-shadow:none!important}.web-portfolio-level-six .private-work-intro h1 em{color:var(--web6-orange)!important;text-shadow:3px 3px 0 #7d2a08!important}
.web-portfolio-level-six .private-work-intro .eyebrow{color:var(--web6-orange)!important}.web-portfolio-level-six .private-work-count strong{color:var(--web6-orange);text-shadow:2px 2px 0 #7d2a08}
.web-portfolio-level-six .web2-card:nth-child(even){border-color:#f26d2148}.web-portfolio-level-six .web2-card:nth-child(even):before,.web-portfolio-level-six .web2-card:nth-child(even) .web2-copy>span,.web-portfolio-level-six .web2-card:nth-child(even) .web2-copy b,.web-portfolio-level-six .web3-marquee i,.web-portfolio-level-six .web5-rail i{color:var(--web6-orange)}
.web-portfolio-level-six .web3-image-curtain{background:linear-gradient(90deg,var(--web6-orange),#7d2a08)}.web-portfolio-level-six .web3-hud,.web-portfolio-level-six .web4-signal{border-color:var(--web6-orange)}.web-portfolio-level-six .web3-hud{mix-blend-mode:normal}.web-portfolio-level-six .web3-hud strong,.web-portfolio-level-six .web4-signal strong{color:var(--web6-orange)}.web-portfolio-level-six .web4-signal i:before{background:var(--web6-orange);box-shadow:0 0 12px #f26d21}.web-portfolio-level-six .web2-card:hover h3{color:#eeeae0;text-shadow:none}
.web-portfolio-level-six .web5-seal-mark{filter:brightness(0);opacity:.82}
@keyframes web6-breathe{0%,100%{scale:1}50%{scale:1.035}}
@keyframes web6-glint{0%,55%,100%{opacity:.15;transform:translateZ(35px) translateY(0) rotate(-17deg)}70%{opacity:.95;transform:translateZ(35px) translateY(150px) rotate(-17deg)}}
@media(max-width:900px){.web6-mark-stage{right:-2rem;top:11rem;width:clamp(190px,38vw,300px);opacity:.78}.web-portfolio-level-six .private-work-intro h1{max-width:750px}}
@media(max-width:620px){.web6-mark-stage{right:-3.5rem;top:8rem;width:180px;opacity:.58}.web-portfolio-level-six .private-work-intro h1{font-size:clamp(2rem,9.6vw,2.35rem)}}
@media(prefers-reduced-motion:reduce){.web6-mark-stage,.web6-mark-glint{animation:none}.web6-mark-stage{transform:rotateX(-8deg) rotateY(-18deg) rotateZ(8deg)}}

/* VOICE spreads are artwork, not tall padded display panels. */
body.voice-case .voice-spread-grid{align-items:start}
body.voice-case .voice-spread-grid figure{height:auto;align-self:start;background:transparent}
body.voice-case .voice-spread-grid img{height:auto;aspect-ratio:auto;object-fit:initial;padding:0;background:transparent}
/* Mobile image integrity: let editorial artwork establish its own height.
   Fixed-ratio frames paired with object-fit:contain created empty bands above
   and below otherwise complete images on narrow screens. */
@media(max-width:760px){
  body.extreme-inner :is(
    .featured-lead-image,
    .featured-card-image,
    .portfolio-media,
    .original-card-image,
    .art-card,
    .book-image,
    .logo-card-media,
    .case-figure,
    .voice-cover-grid figure,
    .voice-photo-grid figure,
    .label-grid figure,
    .oggy-world-grid figure,
    .oggy-cast-grid figure,
    .oggy-design-grid figure,
    .oggy-concept-grid a,
    .oggy-vehicle-concept a,
    .oggy-crain-feature a
  ){
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    padding:0!important;
  }
  body.extreme-inner :is(
    .featured-lead-image,
    .featured-card-image,
    .portfolio-media,
    .original-card-image,
    .art-card,
    .book-image,
    .case-figure,
    .voice-cover-grid figure,
    .voice-photo-grid figure,
    .label-grid figure,
    .oggy-world-grid figure,
    .oggy-cast-grid figure,
    .oggy-design-grid figure,
    .oggy-concept-grid a,
    .oggy-vehicle-concept a,
    .oggy-crain-feature a
  )>img,
  body.extreme-inner .logo-card-media img,
  body.extreme-inner .case-figure img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    padding:0!important;
    object-fit:contain!important;
  }
  body.extreme-inner .oggy-crain-feature{
    display:block!important;
    align-items:start;
  }
  body.extreme-inner .oggy-crain-feature>a{
    display:block!important;
    line-height:0;
  }
  body.extreme-inner .oggy-crain-feature figcaption{
    display:flex;
  }
}