/* /workshops/ (request 720): employee workshops and team lectures. The site's own palette, kit p3 for glass and gloss,
   ring.js draws the circle of participants inside its own canvas. Nothing here moves on scroll from JS: cards enter
   by depth and turn (p3), the halo spins on a timer, the stage section tilts on a CSS scroll timeline. */
.ws-page{--p3-a:#B8893A;--p3-b:#E4C77E;--p3-d:#082625;--p3-top:84px;background:var(--pearl)}
.ws-page section{position:relative}
.ws-page .sec-head{max-width:760px;margin:0 auto 46px;text-align:center}
.ws-page .sec-head .sub{color:var(--muted);font-weight:300;max-width:60ch;margin:0 auto}

/* glass: the crystal card every section shares */
.ws-glass,.ws-card,.ws-pane,.ws-take-list li,.ws-book-step,.ws-fit,.ws-me-in{
  background:linear-gradient(150deg,rgba(255,255,255,.82),rgba(255,255,255,.52));
  -webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);
  border:1px solid rgba(255,255,255,.9);border-radius:var(--r);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 2px rgba(8,38,37,.05),0 26px 50px -30px rgba(8,38,37,.45)}

/* hero: deep lagoon stage, Reut under a gold halo */
.ws-hero{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:clamp(28px,5vw,80px);
  padding:clamp(118px,12vw,150px) var(--pad) clamp(70px,8vw,110px);min-height:100svh;overflow:clip;color:#fff;
  background:radial-gradient(55% 60% at 80% 20%,rgba(228,199,126,.22),transparent 70%),
    radial-gradient(60% 70% at 10% 90%,rgba(169,221,208,.22),transparent 70%),
    linear-gradient(160deg,#0E3B3A 0%,#082625 70%)}
.ws-hero:after{content:"";position:absolute;inset:auto 0 0;height:160px;background:linear-gradient(transparent,#082625);pointer-events:none}
.ws-hero-copy{position:relative;z-index:2;max-width:640px;justify-self:end}
.ws-hero .crumbs,.ws-hero .crumbs a{color:rgba(255,255,255,.78)}
.ws-hero .eyebrow{color:var(--gold-l)}
.ws-hero h1{font-size:clamp(44px,6.2vw,84px);line-height:1.05;color:#fff;margin-bottom:24px}
.ws-hero h1 .gold{display:block;font-size:.62em;margin-top:.18em;line-height:1.15}
.ws-lead{font-size:clamp(17px,1.35vw,20px);color:rgba(255,255,255,.84);max-width:52ch;margin-bottom:30px;font-weight:300}
.ws-hero .btn-ghost{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45)}
.ws-hero .btn-ghost:hover{box-shadow:inset 0 0 0 1.5px #fff}

.ws-portrait{position:relative;justify-self:start;width:min(100%,430px);aspect-ratio:4/5;margin:0;border-radius:220px 220px 32px 32px;
  transform-style:preserve-3d}
.ws-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;border-radius:inherit;
  box-shadow:0 0 0 1px rgba(228,199,126,.6),0 0 0 10px rgba(228,199,126,.12),0 50px 90px -40px rgba(0,0,0,.8)}
.ws-halo{position:absolute;inset:-7% -7% auto;aspect-ratio:1;border-radius:50%;pointer-events:none;transform:translateZ(-40px);
  background:conic-gradient(from 0deg,rgba(228,199,126,0),rgba(228,199,126,.75),rgba(228,199,126,0) 30%,rgba(169,221,208,.5) 55%,rgba(228,199,126,0) 70%,rgba(228,199,126,.6) 90%,rgba(228,199,126,0));
  -webkit-mask:radial-gradient(closest-side,transparent 92%,#000 93%,#000 99%,transparent);mask:radial-gradient(closest-side,transparent 92%,#000 93%,#000 99%,transparent);
  animation:ws-spin 14s linear infinite}
@keyframes ws-spin{to{rotate:360deg}}
.ws-badge{position:absolute;z-index:4;display:inline-flex;gap:6px;align-items:baseline;padding:10px 16px;border-radius:999px;font-size:15px;white-space:nowrap;color:var(--deep);
  background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(255,255,255,.72));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 18px 34px -18px rgba(0,0,0,.7),inset 0 1px 0 #fff}
.ws-badge b{font-family:var(--display);font-size:21px;font-weight:400;color:var(--gold-t)}
.ws-badge-a{top:14%;inset-inline-end:-12%}
.ws-badge-b{top:50%;inset-inline-start:-14%}
.ws-badge-c{bottom:10%;inset-inline-end:-6%}
.ws-portrait figcaption{position:absolute;inset:auto 0 -44px;text-align:center;font-size:14px;color:rgba(255,255,255,.7);letter-spacing:.02em}

/* the circle: a dark room, the participants drawn live */
.ws-circle{padding:clamp(70px,9vw,120px) var(--pad);background:linear-gradient(180deg,#082625,#0E3B3A);color:#fff;overflow:clip}
.ws-circle-in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.ws-circle .eyebrow{color:var(--gold-l)}
.ws-circle h2{color:#fff}
.ws-circle-copy>p{color:rgba(255,255,255,.8);font-weight:300;margin-bottom:26px}
.ws-range-l{display:block;font-size:17px;margin-bottom:10px}
.ws-range-l output{font-family:var(--display);font-size:30px;color:var(--gold-l);margin:0 4px}
.ws-range{width:100%;height:44px;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;touch-action:pan-y}
.ws-range::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(270deg,var(--gold-l) var(--fill,9%),rgba(255,255,255,.18) var(--fill,9%))}
.ws-range::-moz-range-track{height:6px;border-radius:6px;background:rgba(255,255,255,.18)}
.ws-range::-moz-range-progress{height:6px;border-radius:6px;background:var(--gold-l)}
.ws-range::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;margin-top:-12px;border-radius:50%;border:0;
  background:radial-gradient(circle at 35% 30%,#fff,var(--gold-l) 40%,var(--gold));box-shadow:0 6px 16px -4px rgba(0,0,0,.6)}
.ws-range::-moz-range-thumb{width:30px;height:30px;border-radius:50%;border:0;background:radial-gradient(circle at 35% 30%,#fff,var(--gold-l) 40%,var(--gold))}
[dir=rtl] .ws-range{direction:rtl}
.ws-scale{display:flex;justify-content:space-between;font-size:13px;color:rgba(255,255,255,.6);margin:2px 2px 24px}
.ws-fit{padding:22px 26px;color:var(--ink);background:linear-gradient(150deg,rgba(255,255,255,.96),rgba(240,250,247,.9))}
.ws-fit-k{font-size:14px;color:var(--gold-t);font-weight:500;margin-bottom:4px}
.ws-fit-v{font-family:var(--display);font-size:clamp(21px,1.9vw,26px);line-height:1.3;color:var(--lagoon)}
.ws-stage{position:relative;aspect-ratio:1;width:100%;max-width:560px;justify-self:center;border-radius:50%}
@supports (animation-timeline:view()){
  .p3-live .ws-stage{animation:ws-tilt linear both;animation-timeline:view()}
  @keyframes ws-tilt{from{transform:perspective(1200px) rotateX(18deg) scale(.92)}50%{transform:perspective(1200px) rotateX(0deg) scale(1)}to{transform:perspective(1200px) rotateX(-12deg) scale(.95)}}
}
.ws-gl{position:absolute;inset:0;width:100%;height:100%;display:block;border-radius:50%}
.ws-core{position:absolute;inset:37%;display:grid;place-items:center;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.95),rgba(228,199,126,.95) 30%,#B8893A 70%,#684A16);
  box-shadow:0 0 60px rgba(228,199,126,.45),inset 0 -8px 20px rgba(0,0,0,.25),inset 0 3px 2px rgba(255,255,255,.7);overflow:hidden;clip-path:circle(50%)}
.ws-core span{font-family:var(--display);font-size:clamp(20px,2.4vw,30px);color:var(--deep);letter-spacing:.04em}
.ws-core:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.6) 46%,transparent 60%);animation:ws-glint 5s ease-in-out infinite}
@keyframes ws-glint{0%,100%{transform:translateX(-70%)}50%{transform:translateX(70%)}}

/* formats: glass cards on a soft field */
.ws-formats{padding:clamp(80px,9vw,130px) var(--pad);background:
  radial-gradient(40% 50% at 85% 20%,rgba(169,221,208,.55),transparent 70%),radial-gradient(40% 50% at 10% 80%,rgba(228,199,126,.3),transparent 70%),var(--mist)}
.ws-cards{--p3-solid:#F4FAF8;max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:26px;perspective:1200px}
.ws-card{padding:34px 30px 30px;display:flex;flex-direction:column;gap:12px}
.ws-card h3{color:var(--lagoon)}
.ws-card .tag{font-size:14px;color:var(--gold-t);font-weight:500}
.ws-card .link{margin-top:auto}
.ws-card-lecture{border-top:3px solid var(--gold)}
.ws-card-evening{border-top:3px solid #7FBFAE}
.ws-card-mil{border-top:3px solid var(--lagoon)}
.ws-facts{display:grid;gap:8px;margin:6px 0 4px;padding:14px 16px;border-radius:16px;background:rgba(14,59,58,.05)}
.ws-facts div{display:flex;gap:10px;justify-content:space-between;font-size:15px}
.ws-facts dt{color:var(--muted)}
.ws-facts dd{font-weight:500;color:var(--lagoon);text-align:end}
.ws-card .small{font-size:14px;color:var(--muted)}
.ws-card .ticks li{color:var(--ink)}
.ws-card .ticks li:before{color:var(--gold)}

/* who it is for */
.ws-who{padding:clamp(80px,9vw,120px) var(--pad)}
.ws-who-grid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ws-pane{padding:30px 28px}
.ws-pane h3{color:var(--lagoon);margin:14px 0 8px}
.ws-pane p{color:var(--muted)}
.ws-ico{display:grid;place-items:center;width:62px;height:62px;border-radius:20px;background:linear-gradient(145deg,var(--lagoon),var(--deep));box-shadow:0 14px 26px -14px rgba(8,38,37,.8)}
.ws-ico svg{width:30px;height:30px;fill:none;stroke:var(--gold-l);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* take-aways: a numbered ribbon of glass */
.ws-take{padding:clamp(80px,9vw,120px) var(--pad);background:linear-gradient(180deg,var(--pearl),var(--mist))}
.ws-take-in{max-width:980px;margin:0 auto}
.ws-take-list{list-style:none;counter-reset:t;display:grid;gap:18px}
.ws-take-list li{counter-increment:t;position:relative;padding:26px 30px;padding-inline-start:104px}
.ws-take-list li:before{content:counter(t);position:absolute;inset-inline-start:28px;top:50%;translate:0 -50%;width:54px;height:54px;border-radius:50%;
  display:grid;place-items:center;font-family:var(--display);font-size:26px;color:var(--deep);
  background:radial-gradient(circle at 35% 30%,#fff,var(--gold-l) 45%,var(--gold));box-shadow:0 10px 20px -10px rgba(104,74,22,.8)}
.ws-take-list h3{color:var(--lagoon);font-size:clamp(22px,2vw,27px);margin-bottom:4px}
.ws-take-list p{color:var(--muted)}

/* the film */
.ws-film{padding:clamp(80px,9vw,120px) var(--pad);background:linear-gradient(160deg,#0E3B3A,#082625);color:#fff;overflow:clip}
.ws-film-in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,5vw,70px);align-items:center}
.ws-film .eyebrow{color:var(--gold-l)}
.ws-film h2{color:#fff}
.ws-film-copy p{color:rgba(255,255,255,.82);font-weight:300;margin-bottom:12px}
.ws-film .link{color:#fff}
.ws-yt{position:relative;display:block;width:100%;aspect-ratio:16/10;padding:0;border:0;border-radius:var(--r);overflow:hidden;cursor:pointer;background:#000;
  box-shadow:0 0 0 1px rgba(228,199,126,.5),0 40px 80px -40px rgba(0,0,0,.9)}
.ws-yt img{width:100%;height:100%;object-fit:cover;opacity:.88}
.ws-yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ws-play{position:absolute;inset:50% auto auto 50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff,var(--gold-l) 45%,var(--gold));box-shadow:0 0 0 12px rgba(228,199,126,.25),0 20px 40px -10px rgba(0,0,0,.7)}
.ws-play:after{content:"";position:absolute;inset:50% auto auto 50%;margin:-14px 0 0 -9px;border-style:solid;border-width:14px 0 14px 24px;border-color:transparent transparent transparent var(--deep)}
.ws-yt-l{position:absolute;inset:auto 0 0;padding:16px 20px;font-size:15px;color:#fff;text-align:start;background:linear-gradient(transparent,rgba(0,0,0,.7))}

/* three stages, equal coins */
.ws-stages{padding:clamp(80px,9vw,120px) var(--pad)}
.ws-orbs{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:30px;text-align:center}
.ws-orb-item .p3-orb{display:block;margin:0 auto 22px}
.ws-orb-item h3{color:var(--lagoon);margin-bottom:6px}
.ws-orb-item p{color:var(--muted);max-width:30ch;margin:0 auto}

/* about */
.ws-me{padding:clamp(40px,6vw,80px) var(--pad) clamp(80px,9vw,120px);background:radial-gradient(50% 60% at 20% 50%,rgba(169,221,208,.45),transparent 70%)}
.ws-me-in{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:300px 1fr;gap:clamp(24px,4vw,50px);align-items:center;padding:clamp(22px,3vw,36px)}
.ws-me-in img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:180px 180px 22px 22px;box-shadow:0 30px 60px -30px rgba(8,38,37,.6)}
.ws-me-in h2{color:var(--lagoon)}
.ws-me-in p{color:var(--muted)}
.ws-me-links{display:flex;flex-wrap:wrap;gap:6px 22px}

/* booking path: a gold thread through three glass steps */
.ws-book{padding:clamp(80px,9vw,120px) var(--pad);background:var(--mist)}
.ws-book-track{position:relative;max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.ws-book-track:before{content:"";position:absolute;inset:44px 8% auto;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.ws-book-step{padding:30px 26px;text-align:center}
.ws-dot{display:block;width:26px;height:26px;margin:0 auto 16px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,var(--gold-l) 45%,var(--gold));box-shadow:0 0 0 8px rgba(228,199,126,.25)}
.ws-book-step h3{color:var(--lagoon);margin-bottom:6px;font-size:clamp(22px,2vw,27px)}
.ws-book-step p{color:var(--muted)}
.ws-book-cta{text-align:center;margin-top:40px}

.ws-faq{padding-top:clamp(80px,9vw,120px)}

@media (max-width:980px){
  .ws-cards{grid-template-columns:1fr;max-width:620px}
  .ws-who-grid,.ws-orbs,.ws-book-track{grid-template-columns:1fr;max-width:560px}
  .ws-book-track:before{display:none}
}
@media (max-width:860px){
  .ws-hero{grid-template-columns:1fr;min-height:auto;padding-top:104px;gap:64px}
  .ws-hero-copy{justify-self:stretch}
  .ws-portrait{justify-self:center;width:min(78%,340px)}
  .ws-badge{font-size:13px;padding:8px 12px}
  .ws-badge b{font-size:18px}
  .ws-badge-a{inset-inline-end:-10%}
  .ws-badge-b{inset-inline-start:-16%}
  .ws-badge-c{inset-inline-end:-8%}
  .ws-circle-in,.ws-film-in{grid-template-columns:1fr}
  .ws-stage{max-width:420px}
  .ws-me-in{grid-template-columns:1fr;text-align:center}
  .ws-me-in img{max-width:240px;margin:0 auto}
  .ws-me-links{justify-content:center}
  .ws-take-list li{padding:22px 22px;padding-inline-start:88px}
  .ws-take-list li:before{inset-inline-start:20px;width:48px;height:48px;font-size:23px}
}
@media (prefers-reduced-motion:reduce){.ws-halo,.ws-core:after{animation:none}}
/* the 3D card entries (rotateY) and the halos reach a few px past the edge; clip them per section so a phone never
   gets a wider layout viewport (390 -> 394 zoomed the whole page out). clip, not hidden: the sticky stack still works. */
.ws-formats,.ws-who,.ws-take,.ws-stages,.ws-me,.ws-book,.ws-faq{overflow-x:clip}