/* New, independent cinematic variants — only in /previews/experience-section/. */
/* Guarantee the actual film occupies the ENTIRE viewport during Chapter 03.
   The existing single movie is never cloned, restarted or swapped. */
body.experience-section-active #arch-morph-media{
  clip-path:none!important;-webkit-clip-path:none!important;
  inset:0!important;width:100%!important;height:100%!important;
  visibility:visible!important;background:#100e1a;
}
body.experience-section-active #arch-morph-media > video{
  width:100%!important;height:100%!important;object-fit:cover!important;
  filter:saturate(.96) contrast(1.06) brightness(1.06)!important;
}
body.experience-section-active .portal-shade{opacity:.12!important;}
body.experience-section-active .frame-stage::before{opacity:.25!important;}
body.experience-section-active .gridlines{opacity:.20!important;}
body.experience-section-active .experience-section{background:transparent!important;}
body.experience-section-active .experience-atmosphere{
 background:
 linear-gradient(100deg,rgba(8,6,20,.53),rgba(9,6,20,.28) 42%,rgba(7,6,20,.14) 78%,rgba(7,6,20,.38)),
 linear-gradient(0deg,rgba(11,6,23,.38),transparent 24%,transparent 72%,rgba(11,6,23,.15))!important;
 backdrop-filter:none!important;
}
body.experience-section-active .experience-atmosphere::after{opacity:.11!important;}
#experience-section{--experience-reveal:.05;--experience-mx:60%;--experience-my:40%;}
#experience-section::before{
 content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
 background:radial-gradient(ellipse 260px 260px at var(--experience-mx) var(--experience-my),
  rgba(224,151,255,.10),transparent 75%);
}
#experience-section .experience-inner{z-index:3;max-width:none;}
#experience-section .experience-eyebrow{letter-spacing:.27em;color:#e5cbed;}
#experience-section .experience-headline h2{
 letter-spacing:-.07em;line-height:1.02;
 text-shadow:0 3px 35px #110b2bdd;
}
#experience-section .experience-headline p{text-shadow:0 2px 13px #080711cc;}
#experience-section .experience-employer{
 --entry:0;opacity:var(--entry);
 transform:translate3d(0,calc((1 - var(--entry))*48px),0);
 transition:transform .16s ease,opacity .16s ease,border-color .25s ease;
}
#experience-section .experience-employer:hover{
 transform:translate3d(0,calc((1 - var(--entry))*48px - 4px),0);
}
#experience-section .experience-company-name{
 text-shadow:0 4px 21px rgba(0,0,0,.46);
}
#experience-section .experience-number{letter-spacing:.19em;}
#experience-section .experience-bottomline{opacity:.85;}
#experience-section .experience-progress{
 position:absolute;right:6.3vw;bottom:13%;z-index:4;
 display:flex;align-items:center;gap:13px;color:#eee4f2;
 font:700 10px/1.45 ui-monospace,Consolas,monospace;letter-spacing:.18em;
 text-shadow:0 2px 15px #05010dd6;pointer-events:none
}
#experience-section .experience-progress-track{
 display:block;width:95px;height:2px;background:#ffffff55;border-radius:8px;overflow:hidden;
}
#experience-section .experience-progress-track span{
 display:block;width:100%;height:100%;background:#dda8f5;
 transform:scaleX(var(--experience-reveal));transform-origin:left center;
}
#experience-section .experience-progress-label{white-space:nowrap;}
#experience-section .experience-progress-count{color:#e3b7f3;white-space:nowrap;}
#experience-section .experience-employer[aria-hidden="true"]{pointer-events:none;}
/* A — Editorial Reveal. Full moving film; company names glide up one after
   another in the right column, with little else obscuring the artwork. */
#experience-section[data-layout="a"] .experience-story{
 grid-template-columns:minmax(0,.90fr) minmax(0,1.07fr);
 gap:clamp(40px,5.2vw,90px);
}
#experience-section[data-layout="a"] .experience-headline h2{font-size:clamp(48px,5.6vw,94px);}
#experience-section[data-layout="a"] .experience-organisations{
 display:flex;flex-direction:column;gap:0;min-width:0;
 border-top:1px solid #ffffff80;
}
#experience-section[data-layout="a"] .experience-employer{
 border:0;border-bottom:1px solid rgba(255,255,255,.43);border-radius:0;
 min-height:0;box-shadow:none;backdrop-filter:none!important;
 background:rgba(11,6,23,.12);padding:18px 10px 19px 2px;
 display:grid;grid-template-columns:1fr auto;gap:6px 9px;align-items:center;
}
#experience-section[data-layout="a"] .experience-employer:hover{background:rgba(20,8,39,.25);}
#experience-section[data-layout="a"] .experience-number{grid-column:1/-1;font-size:8px;}
#experience-section[data-layout="a"] .experience-brandline{grid-column:1;display:flex;gap:17px;margin:0;}
#experience-section[data-layout="a"] .experience-company-name{font-size:clamp(21px,2.2vw,36px);}
#experience-section[data-layout="a"] .experience-company-detail{
 margin:0;grid-column:2;grid-row:2;text-align:right;max-width:135px;font-size:10px;color:#f0ddea;
}
#experience-section[data-layout="a"] .experience-symbol{width:42px;min-width:42px;height:42px;}
/* B — Triptych-inspired moving glass arches. The full-bleed film spans
   behind all four arches; they are purely transparent light surfaces. */
#experience-section[data-layout="b"] .experience-story{display:flex;flex-direction:column;gap:clamp(19px,3vh,35px);justify-content:center;}
#experience-section[data-layout="b"] .experience-headline{text-align:center;}
#experience-section[data-layout="b"] .experience-eyebrow{justify-content:center;margin-bottom:9px;}
#experience-section[data-layout="b"] .experience-headline h2{
 font-size:clamp(46px,5vw,79px);
}
#experience-section[data-layout="b"] .experience-headline p{max-width:560px;margin:12px auto 0;}
#experience-section[data-layout="b"] .experience-organisations{
 display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(9px,1.2vw,17px);
 width:min(1190px,100%);min-height:220px;
}
#experience-section[data-layout="b"] .experience-employer{
 display:flex;flex-direction:column;justify-content:flex-end;text-align:left;
 height:clamp(205px,33vh,330px);padding:20px 17px 21px;
 border:1px solid #ffffff65;
 border-radius:47% 47% 8px 8px / 30% 30% 8px 8px;
 background:linear-gradient(180deg,rgba(248,232,255,.12) 0%,rgba(14,8,28,.29) 37%,rgba(11,6,24,.68) 100%)!important;
 backdrop-filter:blur(3px) saturate(.85)!important;
 box-shadow:inset 0 1px 1px #fff7,0 17px 40px #08051243;
 transform:translate3d(0,calc((1 - var(--entry))*76px),0) scale(calc(.93 + var(--entry)*.07));
 transform-origin:center bottom;
}
#experience-section[data-layout="b"] .experience-employer:hover{transform:translateY(-4px) scale(1.008);}
#experience-section[data-layout="b"] .experience-number{font-size:8px;}
#experience-section[data-layout="b"] .experience-brandline{
 display:flex;align-items:flex-start;flex-direction:column;gap:11px;margin:15px 0 0;
}
#experience-section[data-layout="b"] .experience-symbol{min-width:45px;height:45px;}
#experience-section[data-layout="b"] .experience-company-name{font-size:clamp(19px,1.85vw,27px);}
#experience-section[data-layout="b"] .experience-company-detail{font-size:11px;margin:14px 0 0;color:#efe7f3;}
/* C — Film-led feature, one high-impact organisation at a time,
   oversized company typography with a subtle vertical progress line. */
#experience-section[data-layout="c"] .experience-story{
 display:grid;grid-template-columns:minmax(0,1fr);gap:0;align-items:center;justify-content:center;
 position:relative;text-align:left;
}
#experience-section[data-layout="c"] .experience-headline{
 position:absolute;left:0;top:5%;right:0;text-align:left;
}
#experience-section[data-layout="c"] .experience-headline h2{font-size:clamp(42px,4.7vw,77px);}
#experience-section[data-layout="c"] .experience-headline p{margin-top:13px;}
#experience-section[data-layout="c"] .experience-organisations{
 display:block;border:0;width:min(1040px,100%);height:250px;position:relative;
 margin:clamp(95px,15vh,148px) auto 0;
}
#experience-section[data-layout="c"] .experience-employer{
 position:absolute;inset:0;display:flex;justify-content:center;align-items:flex-start;
 flex-direction:column;gap:10px;padding:26px 5%;height:100%;min-height:0;
 border:0;border-left:2px solid #e8a9ee;border-radius:0;
 background:linear-gradient(90deg,rgba(14,7,31,.60),rgba(10,7,24,.20) 62%,transparent)!important;
 backdrop-filter:blur(1px)!important;box-shadow:none!important;
 opacity:var(--spotlight);
 transform:translate3d(calc((1 - var(--spotlight))*65px),0,0)!important;
 pointer-events:none;
}
#experience-section[data-layout="c"] .experience-employer:hover{transform:none;}
#experience-section[data-layout="c"] .experience-number{font-size:12px;}
#experience-section[data-layout="c"] .experience-brandline{display:flex;align-items:center;gap:20px;margin:0;}
#experience-section[data-layout="c"] .experience-symbol{height:70px;width:70px;min-width:70px;font-size:31px;}
#experience-section[data-layout="c"] .experience-company-name{
 font-size:clamp(45px,7.5vw,118px);letter-spacing:-.075em;line-height:.95;
}
#experience-section[data-layout="c"] .experience-company-detail{
 font-size:clamp(13px,1.3vw,18px);margin:0;color:#f0e7f3;
}
/* Keep a matching small version on mobile with the same full-bleed film. */
@media(max-width:900px){
 #experience-section[data-layout="a"] .experience-story{grid-template-columns:.9fr 1fr;gap:20px;}
 #experience-section[data-layout="a"] .experience-company-name{font-size:23px;}
 #experience-section[data-layout="a"] .experience-company-detail{font-size:9px;}
 #experience-section[data-layout="b"] .experience-employer{padding:14px 10px;}
 #experience-section[data-layout="b"] .experience-company-name{font-size:20px;}
}
@media(max-width:760px){
 #experience-section .experience-inner{padding-top:12px;padding-bottom:16px;}
 #experience-section .experience-topline{font-size:8px;}
 #experience-section .experience-progress{
  right:5%;bottom:10%;gap:8px;font-size:8px;letter-spacing:.1em;
 }
 #experience-section .experience-progress-track{width:55px;}
 #experience-section[data-layout="a"] .experience-story{
  display:flex;flex-direction:column;justify-content:center;gap:21px;
 }
 #experience-section[data-layout="a"] .experience-headline h2{font-size:clamp(38px,9.6vw,63px);}
 #experience-section[data-layout="a"] .experience-organisations{width:100%;}
 #experience-section[data-layout="a"] .experience-employer{padding:10px 2px;}
 #experience-section[data-layout="a"] .experience-symbol{width:31px;min-width:31px;height:31px;}
 #experience-section[data-layout="a"] .experience-brandline{gap:9px;}
 #experience-section[data-layout="a"] .experience-company-name{font-size:clamp(19px,5vw,26px);}
 #experience-section[data-layout="b"] .experience-story{gap:20px;}
 #experience-section[data-layout="b"] .experience-headline h2{font-size:clamp(33px,8vw,54px);}
 #experience-section[data-layout="b"] .experience-organisations{
  grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;min-height:0;
 }
 #experience-section[data-layout="b"] .experience-employer{
  height:clamp(120px,22vh,190px);padding:12px 11px;
  border-radius:43% 43% 6px 6px / 30% 30% 6px 6px;
  transform:translate3d(0,calc((1 - var(--entry))*43px),0);
 }
 #experience-section[data-layout="b"] .experience-brandline{gap:5px;margin-top:7px;}
 #experience-section[data-layout="b"] .experience-symbol{height:27px;min-width:27px;width:27px;}
 #experience-section[data-layout="b"] .experience-company-name{font-size:clamp(15px,4vw,21px);}
 #experience-section[data-layout="b"] .experience-company-detail{font-size:9px;margin-top:8px;}
 #experience-section[data-layout="c"] .experience-story{display:block;}
 #experience-section[data-layout="c"] .experience-headline{position:relative;top:auto;}
 #experience-section[data-layout="c"] .experience-headline h2{font-size:clamp(39px,10vw,64px);}
 #experience-section[data-layout="c"] .experience-organisations{
  height:190px;margin:34px 0 0;width:100%;
 }
 #experience-section[data-layout="c"] .experience-employer{padding:17px 5%;}
 #experience-section[data-layout="c"] .experience-symbol{height:38px;width:38px;min-width:38px;font-size:18px;}
 #experience-section[data-layout="c"] .experience-company-name{font-size:clamp(29px,7.5vw,47px);}
 #experience-section[data-layout="c"] .experience-company-detail{font-size:12px;}
}
@media(max-height:660px){
 #experience-section .experience-progress{bottom:8%;}
 #experience-section[data-layout="b"] .experience-organisations{gap:7px;}
 #experience-section[data-layout="b"] .experience-employer{height:clamp(110px,27vh,195px);}
 #experience-section[data-layout="c"] .experience-organisations{height:165px;margin-top:18px;}
 #experience-section[data-layout="a"] .experience-employer{padding-top:9px;padding-bottom:9px;}
}
@media(prefers-reduced-motion:reduce){
 #experience-section .experience-employer{transition:none!important;}
}