/* CORE one — final material pass. Load after component styles.
   Gold marks a decision; dark surfaces carry the content. No markup changes. */
.avant{--galactic-base:#080a0b;--galactic-panel:#141b22;--galactic-ink:#f2f4f6;--galactic-muted:#bdc7c9;--galactic-gold:#ffd400;--galactic-line:#485460;background-color:var(--galactic-base)}
.avant :is(.depth-inputs,.method,.showcase,.agency-sectors,.family-one,.crm-connections,.web-platforms,.service-delivery,.about-delivery,.about-bridge,.origin-graphic,.bespoke-statement,.bespoke-investment,.bespoke-film-section,.cw-manifesto,.cw-quality,.crm-distinctions,.crm-investment,.automation-boundaries){background:#0c1015!important;color:#f2f4f6!important;border-color:#485460}
.avant :is(.depth-inputs,.method,.showcase,.agency-sectors,.family-one,.crm-connections,.web-platforms,.service-delivery,.about-delivery,.about-bridge,.origin-graphic,.bespoke-statement,.bespoke-investment,.bespoke-film-section,.cw-manifesto,.cw-quality,.crm-distinctions,.crm-investment,.automation-boundaries) :is(h2,h3,h4,strong,b){color:#f2f4f6!important}
.avant :is(.depth-inputs,.method,.showcase,.agency-sectors,.family-one,.crm-connections,.web-platforms,.service-delivery,.about-delivery,.about-bridge,.origin-graphic,.bespoke-statement,.bespoke-investment,.bespoke-film-section,.cw-manifesto,.cw-quality,.crm-distinctions,.crm-investment,.automation-boundaries) :is(p,li,dd){color:#bdc7c9!important}
.avant :is(.depth-inputs,.method,.showcase,.agency-sectors,.family-one,.crm-connections,.web-platforms,.service-delivery,.about-delivery,.about-bridge,.origin-graphic,.bespoke-statement,.bespoke-investment,.bespoke-film-section,.cw-manifesto,.cw-quality,.crm-distinctions,.crm-investment,.automation-boundaries) :is(.eyebrow,h2 span,h2 em,.text-link){color:#ffd400!important}
.avant :is(.depth-inputs,.method,.showcase,.agency-sectors,.family-one,.crm-connections,.web-platforms,.service-delivery,.about-delivery,.about-bridge,.origin-graphic,.bespoke-statement,.bespoke-investment,.bespoke-film-section,.cw-manifesto,.cw-quality,.crm-distinctions,.crm-investment,.automation-boundaries) .button.primary{background:#ffd400!important;color:#080a0b!important;border-color:#ffd400!important}
.avant :is(.depth-inputs,.method,.showcase,.agency-sectors,.family-one,.crm-connections,.web-platforms,.service-delivery,.about-delivery,.about-bridge,.origin-graphic,.bespoke-statement,.bespoke-investment,.bespoke-film-section,.cw-manifesto,.cw-quality,.crm-distinctions,.crm-investment,.automation-boundaries) .button.primary :is(span,b,strong){color:#080a0b!important}
.avant :is(.depth-inputs,.method,.showcase,.agency-sectors,.family-one,.crm-connections,.web-platforms,.service-delivery,.about-delivery,.about-bridge,.origin-graphic,.bespoke-statement,.bespoke-investment,.bespoke-film-section,.cw-manifesto,.cw-quality,.crm-distinctions,.crm-investment,.automation-boundaries) .button:not(.primary){background:#141b22!important;color:#f2f4f6!important;border-color:#74808b!important}

/* Repeated panels: cool graphite faces, restrained warm edges. */
.avant :is(.depth-input-card,.workflow-tile,.search-discipline-card,.one-card,.platform-card){background:#141b22!important;border-color:#485460!important;color:#f2f4f6!important;box-shadow:0 16px 26px #0005}
.avant :is(.depth-input-card,.workflow-tile,.search-discipline-card,.one-card,.platform-card) :is(h3,b,strong){color:#f2f4f6!important}
.avant :is(.depth-input-card,.workflow-tile,.search-discipline-card,.one-card,.platform-card) :is(p,small){color:#bdc7c9!important}
.avant :is(.depth-input-card,.workflow-tile,.search-discipline-card,.one-card,.platform-card)>span{color:#ffd400!important}
.avant .depth-input-card .depth-responsibility{color:#bdc7c9!important;border-color:#485460!important}
.avant .depth-input-grid{gap:32px;align-items:stretch;padding:6px}
.avant .depth-input-card.is-depth-responsive{box-shadow:0 20px 32px #0008}
.avant .workflow-stage{gap:32px}
.avant .workflow-tile:nth-of-type(even){transform:rotateY(-7deg) rotateX(3deg)}
.avant .origin-graphic :is(.origin-orbit,.orbit){border-color:#75671e}

/* Editorial diagram: separate cards in real document flow. Pointer rotation
   remains on the parent, so the model retains depth without crossing labels. */
.avant .depth-explorer{overflow:visible;background:#0c1015;border-color:#485460}
.avant .depth-model{height:560px;min-width:0}
.avant .depth-model-core{display:grid;grid-template-rows:repeat(4,minmax(0,1fr));gap:22px;inset:20px 24px 45px}
.avant .depth-model-node{position:relative!important;inset:auto!important;min-width:0;height:auto!important;min-height:92px;box-sizing:border-box;transform:rotateY(-8deg) rotateX(4deg) rotateZ(-1deg);padding:19px 22px;background:#141b22!important;color:#f2f4f6!important;border-color:#485460;box-shadow:8px 12px 20px #0006}
.avant .depth-model-node>span{color:#bdc7c9!important}
.avant .depth-model-node.is-active{border-color:#ffd400!important;box-shadow:inset 3px 0 #ffd400,8px 12px 20px #0006}
.avant .depth-model-node.is-active>span{color:#ffd400!important}
.avant .depth-model-caption{color:#bdc7c9;font-size:8px;line-height:1.5}

/* Three planes, three readable layers. Decorative coordinate/grid elements
   remain absolute; no focusable elements are placed in a clipped wrapper. */
.avant .compass-stage{height:600px;min-width:0}
.avant .compass-structure{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:26px;inset:25px 30px 55px}
.avant .compass-facet{position:relative!important;inset:auto!important;width:auto!important;height:auto!important;min-height:140px;box-sizing:border-box;transform:rotateY(-8deg) rotateX(5deg) rotateZ(-2deg);background:#141b22!important;color:#f2f4f6!important;border-color:#485460!important;box-shadow:10px 16px 24px #0007}
.avant .compass-facet :is(b,strong){color:#f2f4f6!important}
.avant .compass-facet :is(span,small,p,i){color:#bdc7c9!important}
.avant .compass-facet.is-active{border-color:#ffd400!important;box-shadow:inset 3px 0 #ffd400,10px 16px 24px #0007}

/* Five process stages stay sequential even at the narrowest breakpoint. */
.avant .service-walkthrough{overflow:visible;background:#0c1015!important;border-color:#485460}
.avant .service-walkthrough .walkthrough-visual{min-height:650px;overflow:clip;background:#0c1015;border-color:#485460}
.avant .service-walkthrough .walkthrough-stack{display:grid;grid-template-rows:repeat(5,minmax(0,1fr));gap:20px;inset:30px 32px 55px;transform:rotateY(-7deg) rotateX(3deg)}
.avant .service-walkthrough .walkthrough-node{position:relative!important;inset:auto!important;width:auto!important;min-width:0;min-height:86px;box-sizing:border-box;background:#141b22!important;color:#f2f4f6!important;border-color:#485460;transform:translateZ(0);padding:16px 20px;box-shadow:5px 10px 18px #0007}
.avant .service-walkthrough .walkthrough-node small{color:#bdc7c9}
.avant .service-walkthrough .walkthrough-node.is-active{border-color:#ffd400;transform:translateZ(8px);box-shadow:inset 3px 0 #ffd400,5px 10px 18px #0007}
.avant .service-walkthrough .walkthrough-node.is-active small{color:#ffd400}
.avant .service-walkthrough[data-playing=true] .walkthrough-node.is-active:after{background:#ffd400}
.avant .service-walkthrough .walkthrough-visual-label{color:#bdc7c9}

/* Bespoke CRM architecture and illustrative scenario nodes. */
.avant .crm-architecture{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:28px;padding:25px 30px 65px;min-height:620px;box-sizing:border-box}
.avant .crm-architecture-board{position:relative!important;inset:auto!important;width:auto!important;height:auto!important;min-height:145px;box-sizing:border-box;background:#141b22!important;color:#f2f4f6!important;border-color:#687580!important;transform:rotateY(-8deg) rotateX(4deg) rotateZ(-1deg);box-shadow:8px 13px 24px #0007}
.avant .crm-architecture-board :is(span,small,p,i){color:#bdc7c9!important}
.avant .crm-architecture-board :is(b,strong){color:#f2f4f6!important}
.avant .crm-lab-geometry{gap:28px}
.avant .crm-lab-geometry>div{transform:rotateY(-6deg) rotateX(3deg)!important}
.avant .crm-lab-geometry>div.is-active{background:#141b22!important;color:#f2f4f6!important;border-color:#ffd400!important}
.avant .crm-lab-geometry>div.is-active :is(span,i){color:#ffd400!important}
.avant .crm-sculpture:not(.live-crm-sculpture){display:grid;grid-template-rows:1fr 1fr;gap:28px;padding:25px 25px 45px;height:570px;box-sizing:border-box}
.avant .crm-sculpture:not(.live-crm-sculpture) .crm-layer{position:relative!important;inset:auto!important;height:auto!important;min-width:0;opacity:1;transform:rotateY(-7deg) rotateX(3deg);background:#141b22!important;color:#f2f4f6!important}

/* Shop examples and their annotations no longer occupy the same plane. */
.avant .package-panel{overflow:visible;gap:40px}
.avant .package-scene{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;height:auto!important;min-height:0;padding:18px 20px 45px;box-sizing:border-box;overflow:clip}
.avant .package-shop-mock{position:relative!important;inset:auto!important;width:100%;min-width:0;box-sizing:border-box;transform:rotateY(-5deg) rotateX(3deg) rotateZ(-1deg);box-shadow:8px 16px 25px #0007}
.avant .package-floating-ui{position:relative!important;inset:auto!important;width:100%!important;min-width:0;box-sizing:border-box;background:#141b22!important;color:#f2f4f6!important;border:1px solid #8a7825;transform:rotateY(4deg) rotateX(2deg);box-shadow:5px 10px 18px #0006}
.avant .package-floating-ui :is(b,strong){color:#ffd400!important}
.avant .package-floating-ui :is(p,small,span){color:#bdc7c9!important}
.avant .package-price-grid{gap:28px;padding:8px}
.avant .package-scene-tag{color:#bdc7c9}

/* Other large yellow illustrative faces use the same material vocabulary. */
.avant :is(.cw-window-front,.sheet-top,.cw-portal-gateway,.plate-action){background:#141b22!important;color:#f2f4f6!important;border-color:#b59c32!important}
.avant :is(.cw-window-front,.sheet-top,.cw-portal-gateway,.plate-action) :is(b,strong){color:#ffd400!important}
.avant :is(.cw-window-front,.sheet-top,.cw-portal-gateway,.plate-action) :is(span,small,p){color:#bdc7c9!important}
.avant .cw-keyhole,.avant .cw-keyhole:before{border-color:#ffd400}
.avant .cw-window-front:after{background:#26313b;border-color:#53616f}
.avant .cw-window-front:before{background:#1d252e;border-color:#53616f}

@media(max-width:1100px){
  .avant .depth-model{position:relative;top:auto;height:545px}
  .avant .depth-model-core{inset:20px 15px 45px}
  .avant .service-walkthrough .walkthrough-layout{grid-template-columns:1fr;gap:35px}
  .avant .service-walkthrough .walkthrough-visual{max-width:720px;width:100%;box-sizing:border-box;justify-self:center;min-height:650px}
  .avant .package-price-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .avant :is(.depth-explorer-layout,.depth-heading){grid-template-columns:minmax(0,1fr)}
  .avant .depth-input-grid{grid-template-columns:minmax(0,1fr);gap:26px;padding:4px}
  .avant .depth-input-card{padding:26px;transform:none}
  .avant .depth-model{height:495px;position:relative;top:auto;margin-bottom:28px}
  .avant .depth-model-core{inset:15px 16px 45px;gap:20px}
  .avant .depth-model-node{min-height:88px;padding:16px 19px;transform:rotateY(-4deg) rotateX(2deg)}
  .avant .depth-model-node>b{font-size:21px}
  .avant .compass-stage{height:530px}
  .avant .compass-structure{inset:20px 18px 55px;gap:22px}
  .avant .compass-facet{min-height:130px;padding:20px;transform:rotateY(-4deg) rotateX(2deg)}
  .avant .service-walkthrough .walkthrough-visual{min-height:600px}
  .avant .service-walkthrough .walkthrough-stack{inset:22px 19px 55px;gap:20px;transform:rotateY(-3deg) rotateX(2deg)}
  .avant .service-walkthrough .walkthrough-node{min-height:85px;padding:14px 17px}
  .avant .service-walkthrough .walkthrough-node b{font-size:22px;overflow-wrap:anywhere}
  .avant .service-walkthrough .walkthrough-tabs{gap:5px;flex-wrap:wrap}
  .avant .service-walkthrough .walkthrough-tabs button{flex:1 1 28%;min-height:52px;font-size:11px}
  .avant .crm-architecture{gap:24px;padding:20px 17px 65px;min-height:600px}
  .avant .crm-architecture-board{min-height:145px;transform:rotateY(-4deg) rotateX(2deg);padding:21px}
  .avant .crm-lab-geometry{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
  .avant .package-panel{padding:25px 17px;gap:25px}
  .avant .package-scene{padding:12px 12px 42px;gap:24px}
  .avant .package-shop-mock{transform:rotateY(-3deg) rotateX(2deg)}
  .avant .package-floating-ui{transform:rotateY(2deg);font-size:12px}
  .avant .package-price-grid{grid-template-columns:minmax(0,1fr);gap:25px;padding:4px}
  .avant .workflow-stage{gap:28px}
}
@media(max-width:380px){
  .avant .workflow-stage{grid-template-columns:minmax(0,1fr)}
  .avant .workflow-tile{min-height:0;padding:25px;transform:rotateY(-4deg) rotateX(2deg)!important}
  .avant .depth-model-core{inset-inline:12px}
  .avant .depth-model-node{padding-inline:16px}
  .avant .compass-structure{inset-inline:13px}
  .avant .compass-facet{padding:18px}
  .avant .service-walkthrough .walkthrough-stack{inset-inline:15px}
  .avant .service-walkthrough .walkthrough-node b{font-size:20px}
}
@media(prefers-reduced-motion:reduce){
  .avant :is(.depth-model-core,.compass-structure,.depth-model-node,.compass-facet,.crm-architecture-board,.package-scene,.package-shop-mock,.package-floating-ui){transition:none!important}
  .avant .service-walkthrough .walkthrough-node{transition:none!important}
}

/* Decorative perspective stays inside its visual stage on narrow screens. */
.avant .depth-model,.avant .package-scene{overflow:hidden}

