/* Shared public experience layer for navigation, storytelling and system pages. */
.mzs-experience{
  --mzs-hairline:color-mix(in srgb,var(--mzs-line) 34%,transparent);
  --mzs-glow-aqua:color-mix(in srgb,var(--mzs-aqua) 23%,transparent);
  --mzs-glow-gold:color-mix(in srgb,var(--mzs-gold) 18%,transparent);
  --mzs-pointer-x:50%;
  --mzs-pointer-y:18%;
  --mzs-page-progress:0;
  padding-bottom:var(--mzs-radio-player-height);
  background:
    radial-gradient(circle at var(--mzs-pointer-x) var(--mzs-pointer-y),color-mix(in srgb,var(--mzs-aqua) 7%,transparent),transparent 27rem),
    radial-gradient(ellipse at 84% 12%,color-mix(in srgb,var(--mzs-gold) 5%,transparent),transparent 33rem),
    linear-gradient(180deg,var(--mzs-bg-top),var(--mzs-bg-mid) 43%,var(--mzs-bg-bottom));
}
.mzs-experience .mzs-pointer-light{
  position:fixed;z-index:0;left:0;top:0;width:380px;height:380px;border-radius:50%;
  pointer-events:none;opacity:.26;transform:translate3d(calc(var(--mzs-pointer-px,50vw) - 190px),calc(var(--mzs-pointer-py,24vh) - 190px),0);
  background:radial-gradient(circle,color-mix(in srgb,var(--mzs-aqua) 14%,transparent),transparent 68%);
  filter:blur(10px);transition:opacity .3s;
}
.mzs-experience .mzs-journey-rail{
  position:fixed;z-index:3;right:18px;top:20vh;width:1px;height:60vh;pointer-events:none;
  background:linear-gradient(180deg,transparent,var(--mzs-hairline) 16%,var(--mzs-hairline) 84%,transparent);
}
.mzs-experience .mzs-journey-rail span{display:block;width:1px;height:calc(var(--mzs-page-progress)*1%);max-height:100%;background:linear-gradient(180deg,var(--mzs-gold),var(--mzs-aqua));box-shadow:0 0 16px var(--mzs-glow-aqua)}

/* Shared spatial rhythm and section storytelling */
.mzs-experience :where(.mzs-public-section,.mzs-public-process,.mzs-public-cta,.mzs-section,.mzs-history-chapter,.mzs-history-system,.mzs-history-events,.mzs-history-local){
  position:relative;isolation:isolate;
}
.mzs-experience :where(.mzs-public-section,.mzs-section,.mzs-history-chapter)::before{
  content:"";position:absolute;z-index:-1;left:var(--mzs-gutter);right:var(--mzs-gutter);top:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--mzs-hairline) 17%,color-mix(in srgb,var(--mzs-aqua) 30%,transparent) 50%,var(--mzs-hairline) 83%,transparent);
}
.mzs-experience :where(.mzs-public-section,.mzs-section,.mzs-history-chapter)::after{
  content:"";position:absolute;z-index:-1;right:clamp(20px,4vw,72px);top:12%;width:clamp(260px,35vw,560px);max-width:calc(100% - 40px);aspect-ratio:1;border:1px solid color-mix(in srgb,var(--mzs-aqua) 7%,transparent);border-radius:50%;opacity:.62;pointer-events:none;
}

.mzs-experience .mzs-public-heading h2,.mzs-experience .mzs-section-intro h2{max-width:17ch;text-wrap:balance}
.mzs-experience .mzs-eyebrow::before{content:"";flex:0 0 28px;width:28px;height:1px;background:linear-gradient(90deg,var(--mzs-gold),transparent)}

/* Public hero: restrained, cinematic and legible */

.mzs-experience .mzs-public-hero::before,
.mzs-experience .mzs-public-hero::after{content:"";position:absolute;pointer-events:none;border-radius:50%}

.mzs-experience .mzs-public-hero::after{right:clamp(-80px,12vw,190px);top:29%;width:clamp(155px,19vw,300px);aspect-ratio:1;border:1px solid color-mix(in srgb,var(--mzs-gold) 17%,transparent);filter:drop-shadow(0 0 28px var(--mzs-glow-gold))}


/* Navigation refinement without changing its architecture */

.mzs-experience .mzs-nav.is-scrolled{background:color-mix(in srgb,var(--mzs-nav) 90%,transparent);box-shadow:0 18px 50px rgba(0,10,12,.28)}


.mzs-experience .mzs-submenu-links a::before{content:"";position:absolute;left:0;bottom:-1px;width:0;height:1px;background:var(--mzs-aqua);transition:width .25s var(--mzs-ease)}
.mzs-experience .mzs-submenu-links a:hover::before,.mzs-experience .mzs-submenu-links a:focus-visible::before{width:100%}

/* Shared premium surfaces */
.mzs-experience :where(.mzs-history-guide-panel){
  border-color:var(--mzs-hairline);background:
    linear-gradient(145deg,color-mix(in srgb,var(--mzs-surface-soft) 72%,transparent),color-mix(in srgb,var(--mzs-nav) 78%,transparent));
  box-shadow:0 28px 84px rgba(0,12,14,.22),inset 0 1px rgba(255,255,255,.025);
}

/* Service catalogue */

.mzs-experience .mzs-service-panel::before{content:"";position:absolute;left:0;top:-1px;width:96px;height:1px;pointer-events:none;background:linear-gradient(90deg,var(--mzs-aqua),transparent)}
.mzs-experience .mzs-service-panel>*{position:relative;z-index:1}

/* Event/project rows — the page background remains visible; hierarchy comes from rhythm, lines and logos. */


.mzs-experience .mzs-event-card>a::after{display:none}

.mzs-experience .mzs-event-visual .mzs-logo-stage-proof{width:min(100%,150px);max-width:150px}

.mzs-experience .mzs-event-copy::before{display:none}
.mzs-experience .mzs-event-copy-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px}.mzs-experience .mzs-event-copy-head p{margin:0;color:var(--mzs-gold);font-size:var(--mzs-micro-compact);font-weight:850;letter-spacing:.1em;text-transform:uppercase;line-height:1.4}
.mzs-experience .mzs-event-copy>strong i{display:inline-block;margin-left:6px;font-style:normal;transition:transform .25s var(--mzs-ease)}
.mzs-experience .mzs-event-card>a:hover .mzs-event-copy-head>span,.mzs-experience .mzs-event-card>a:focus-visible .mzs-event-copy-head>span{transform:translate(2px,-2px);background:color-mix(in srgb,var(--mzs-hover-surface) 78%,transparent)}.mzs-experience .mzs-event-card>a:hover .mzs-event-copy>strong i,.mzs-experience .mzs-event-card>a:focus-visible .mzs-event-copy>strong i{transform:translateX(5px)}

/* Project and service detail pages */

.mzs-experience .mzs-event-detail-visual::before,.mzs-experience .mzs-event-detail-visual::after{content:"";position:absolute;left:50%;top:50%;border:1px solid color-mix(in srgb,var(--mzs-aqua) 14%,transparent);border-radius:50%;transform:translate(-50%,-50%)}
.mzs-experience .mzs-event-detail-visual::before{width:76%;aspect-ratio:1}.mzs-experience .mzs-event-detail-visual::after{width:48%;aspect-ratio:1;border-color:color-mix(in srgb,var(--mzs-gold) 14%,transparent)}
.mzs-experience .mzs-event-detail-visual img{position:relative;z-index:2;width:auto;height:auto;max-width:78%;max-height:330px;filter:drop-shadow(0 26px 38px rgba(0,12,14,.3))}

.mzs-experience .mzs-public-price-card::after{content:"";position:absolute;right:-30px;bottom:-32px;width:90px;height:90px;border:1px solid color-mix(in srgb,var(--mzs-aqua) 18%,transparent);border-radius:50%}

/* History becomes a connected journey */


.mzs-experience .mzs-history-index button,.mzs-experience .mzs-history-choice-list button{transition:transform .22s var(--mzs-ease),border-color .22s,background .22s}
.mzs-experience .mzs-history-index button:hover,.mzs-experience .mzs-history-index button:focus-visible,.mzs-experience .mzs-history-choice-list button:hover,.mzs-experience .mzs-history-choice-list button:focus-visible{transform:translateX(5px);border-color:color-mix(in srgb,var(--mzs-aqua) 55%,transparent)}

/* Footer and CTA closing chapter */

/* Reveal and micro-interaction system */
.mzs-experience .mzs-action:hover{transform:translate3d(var(--mzs-magnet-x,0),calc(var(--mzs-magnet-y,0) - 1px),0)}

@media(max-width:1100px){
   .mzs-experience .mzs-event-card>a{grid-template-columns:154px minmax(0,1fr)}
  }
@media(max-width:960px){
  .mzs-experience .mzs-pointer-light,.mzs-experience .mzs-journey-rail{display:none}
  .mzs-experience .mzs-public-hero::before{right:-170px;top:21%;width:430px}.mzs-experience .mzs-public-hero::after{right:-40px;top:34%;width:180px}
  .mzs-experience .mzs-event-card>a{grid-template-columns:140px minmax(0,1fr)}
  }
@media(max-width:620px){
  .mzs-experience :where(.mzs-public-section,.mzs-section,.mzs-history-chapter)::after{display:none}
  .mzs-experience .mzs-public-hero h1{font-size:clamp(44px,12vw,56px);line-height:.96}
  .mzs-experience .mzs-eyebrow{font-size:var(--mzs-micro-compact);letter-spacing:.11em}.mzs-experience .mzs-eyebrow::before{flex-basis:20px;width:20px}
  .mzs-experience .mzs-event-visual .mzs-logo-stage-proof{width:min(72vw,250px);max-width:250px}
  .mzs-experience .mzs-event-copy h2{font-size:clamp(27px,8.1vw,34px)}
  .mzs-experience .mzs-event-summary{font-size:16px;line-height:1.68;-webkit-line-clamp:4}
  .mzs-experience .mzs-event-copy>strong{min-height:44px;display:inline-flex;align-items:center;font-size:15px}
}
@media(prefers-reduced-motion:reduce){
  .mzs-experience .mzs-pointer-light{display:none}
    .mzs-experience .mzs-event-card>a,.mzs-experience .mzs-service-panel{transition:none}
}


/* Targeted public-experience refinements. */

/* Hero eyebrow stays legible above orbital graphics and bright backgrounds. */
.mzs-experience .mzs-public-hero .mzs-eyebrow{
  position:relative;z-index:4;width:max-content;max-width:min(100%,38rem);padding:9px 13px;border:1px solid color-mix(in srgb,var(--mzs-gold) 34%,transparent);border-radius:var(--mzs-radius-pill,999px);
  background:linear-gradient(100deg,color-mix(in srgb,var(--mzs-bg-bottom) 78%,transparent),color-mix(in srgb,var(--mzs-nav) 54%,transparent));
  color:color-mix(in srgb,var(--mzs-gold) 92%,white);text-shadow:0 2px 16px rgba(0,12,14,.72);box-shadow:0 10px 34px rgba(0,12,14,.13);backdrop-filter:blur(12px)
}
.mzs-experience .mzs-public-hero .mzs-eyebrow::before{flex-basis:20px;width:20px;background:linear-gradient(90deg,var(--mzs-gold),var(--mzs-aqua))}

/* The closing orbit crosses the section boundary instead of being clipped by it. */

.mzs-experience .mzs-public-cta::before{content:"";position:absolute;left:50%;bottom:-56%;z-index:0;width:min(860px,84vw);aspect-ratio:1;border:1px solid color-mix(in srgb,var(--mzs-aqua) 17%,transparent);border-radius:50%;transform:translateX(-50%);box-shadow:0 0 0 72px color-mix(in srgb,var(--mzs-aqua) 1.5%,transparent)}
.mzs-experience .mzs-public-cta::after{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:-150px;height:250px;pointer-events:none;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--mzs-bg-bottom) 72%,transparent) 70%,var(--mzs-bg-bottom))}


@media(max-width:960px){
  .mzs-experience .mzs-public-hero .mzs-eyebrow{margin-inline:auto}
}

/* Continuity guard: large orbital decorations may cross section boundaries without clipping. */
.mzs-experience .mzs-view-shell,.mzs-experience .mzs-public-section,.mzs-experience .mzs-public-process,.mzs-experience .mzs-public-bridge{overflow:visible}

.mzs-experience .mzs-public-hero,.mzs-experience .mzs-history-experience{overflow:visible}
