/* Work pages: builder B. Tokens come from site.css; each page sets its world with data-world. */
.wk{--a1:var(--purple);--a2:var(--pink);--a3:var(--gold);--tint:#7460E3;overflow-x:clip}
.wk[data-world=pharaohs]{--a1:#E9B93D;--a2:#D6342C;--a3:#4A6FE0;--tint:#C9962A}
.wk[data-world=calligraphy]{--a1:#C9A27A;--a2:#D2607A;--a3:#E9DCC8;--tint:#B58B62}
.wk[data-world=elysian]{--a1:#4AB7CD;--a2:#A854E0;--a3:#F06AA8;--tint:#2C8FB0}
.wk[data-world=tutankhamun]{--a1:#E7A24B;--a2:#4AB7CD;--a3:#C4653A;--tint:#C9792E}
.wk[data-world=darkart]{--a1:#4AB7CD;--a2:#9B8BFF;--a3:#EE792A;--tint:#2C7D92}
.wk[data-world=index]{--a1:var(--purple);--a2:var(--pink);--a3:var(--orange)}
[data-theme=light] .wk[data-world=pharaohs]{--a1:#A8740C;--a2:#B6261F;--a3:#2F4FBF}
[data-theme=light] .wk[data-world=calligraphy]{--a1:#8E6A45;--a2:#B53F5C;--a3:#6D5A44}
[data-theme=light] .wk[data-world=elysian]{--a1:#1F7F96;--a2:#7F34BC;--a3:#C23F80}
[data-theme=light] .wk[data-world=tutankhamun]{--a1:#A8640F;--a2:#1F7F96;--a3:#9A4521}
[data-theme=light] .wk[data-world=darkart]{--a1:#1F7F96;--a2:#5847C4;--a3:#C2570F}

/* hero */
.wk-hero{position:relative;overflow:hidden;padding:128px 0 72px;min-height:min(100svh,980px);display:flex;align-items:center}
.wk-bg{position:absolute;inset:-6%;z-index:0;pointer-events:none}
.wk-bg img{width:100%;height:100%;object-fit:cover;filter:blur(46px) saturate(1.25);opacity:.42;transform:scale(1.1)}
[data-theme=light] .wk-bg img{opacity:.22}
.wk-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,var(--bg) 100%),radial-gradient(60% 70% at 78% 40%,transparent,var(--bg) 100%)}
.wk-floor{position:absolute;left:0;right:0;bottom:0;width:100%;height:46%;z-index:0;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent,#000 55%);mask-image:linear-gradient(180deg,transparent,#000 55%)}
.wk-floor g{fill:none;stroke:var(--a1);stroke-width:1;vector-effect:non-scaling-stroke;opacity:.34}
.wk-floor .rungs{opacity:.26}
.wk-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,5vw,72px);align-items:center;width:100%}
.wk-copy{min-width:0}
.wk-back{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink-dim);text-decoration:none;margin-bottom:26px}
.wk-back:hover{color:var(--ink)}
.wk-back svg{width:14px;height:14px}
.wk-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.wk-chip{font-size:13px;font-weight:600;padding:5px 12px;border-radius:999px;border:1px solid var(--line);color:var(--ink-dim)}
.wk-chip.st{color:var(--ink);border-color:var(--a1);background:color-mix(in srgb,var(--a1) 14%,transparent)}
.wk-copy h1{font-size:clamp(40px,5.6vw,80px);margin-bottom:20px}
.wk-copy .sub{margin-bottom:32px;font-size:clamp(17px,1.5vw,21px)}
.wk-btns{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.wk .btn.w{background:linear-gradient(120deg,var(--a1),var(--a2));color:#fff}
[data-world=pharaohs].wk .btn.w,[data-world=calligraphy].wk .btn.w,[data-world=tutankhamun].wk .btn.w{color:#fff}
.wk .btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.wk .btn.ghost:hover{box-shadow:inset 0 0 0 1px var(--a1),0 12px 40px color-mix(in srgb,var(--a1) 30%,transparent)}
.wk-art{position:relative;margin:0 auto;width:min(100%,calc(74vh * var(--ar,1)));justify-self:center}
.wk-art::before{content:"";position:absolute;inset:-10% -8%;background:radial-gradient(60% 60% at 50% 50%,color-mix(in srgb,var(--a1) 42%,transparent),transparent 70%);filter:blur(30px);z-index:0}
.wk-art img{position:relative;z-index:1;width:100%;height:auto;border-radius:22px;border:1px solid var(--cardline);box-shadow:0 40px 100px #0000006b,0 0 0 1px #ffffff10 inset}
[data-theme=light] .wk-art img{box-shadow:0 30px 80px #0b0c1033}
.wk-art .rim{position:absolute;left:8%;right:8%;bottom:-18px;height:2px;z-index:0;background:linear-gradient(90deg,transparent,var(--a1),var(--a2),transparent)}

/* about */
.wk-about{padding:96px 0 40px}
.wk-about .row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,5vw,72px);align-items:start}
.wk-about h2{max-width:14ch}
.wk-about p{color:var(--ink-dim);font-size:clamp(17px,1.4vw,19px);line-height:1.6;max-width:60ch;margin-bottom:18px;text-wrap:pretty}
.wk-about p:first-child{color:var(--ink)}
.wk-facts{margin-top:30px;border-top:1px solid var(--line);display:grid}
.wk-facts div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:15px}
.wk-facts dt{color:var(--ink-dim)}
.wk-facts dd{font-weight:600}
.wk-facts a{color:var(--uibold);text-underline-offset:3px}

/* gallery */
.wk-gallery{padding:64px 0 96px}
.wk-gallery .head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:34px;flex-wrap:wrap}
.wk-gallery .head p{color:var(--ink-dim);max-width:46ch;font-size:16px}
.wk-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
.wk-grid figure{position:relative;grid-column:span 2;border-radius:20px;overflow:hidden;border:1px solid var(--cardline);background:var(--bg2);aspect-ratio:var(--ar,1)}
.wk-grid .s3{grid-column:span 3}.wk-grid .s4{grid-column:span 4}.wk-grid .s6{grid-column:span 6}
.wk-grid .tall{grid-row:span 2;aspect-ratio:auto}
.wk-grid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.wk-grid figure:hover img{transform:scale(1.04)}
.wk-grid figcaption{position:absolute;left:12px;bottom:12px;font-size:13px;font-weight:600;color:#EDF0FA;background:#0A0E1DCC;backdrop-filter:blur(8px);padding:5px 12px;border-radius:999px}
.wk-grid figure.pad img{object-fit:contain;padding:6%}
.wk-grid figure.lt{background:#F4F4F7}

/* link band */
.wk-band{padding:0 0 96px}
.wk-band .panel{position:relative;overflow:hidden;border-radius:28px;border:1px solid var(--cardline);padding:clamp(32px,5vw,64px);background:linear-gradient(135deg,color-mix(in srgb,var(--a1) 16%,var(--bg2)),var(--bg2) 60%);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:center}
.wk-band .panel::after{content:"";position:absolute;right:-8%;top:-40%;width:50%;aspect-ratio:1;border-radius:50%;border:1px solid color-mix(in srgb,var(--a1) 40%,transparent);box-shadow:0 0 0 40px color-mix(in srgb,var(--a1) 6%,transparent),0 0 0 90px color-mix(in srgb,var(--a1) 4%,transparent);pointer-events:none}
.wk-band h2{font-size:clamp(28px,3.4vw,44px);margin-bottom:10px}
.wk-band p{color:var(--ink-dim);max-width:52ch}
.wk-band .panel>*{position:relative;z-index:1}

/* previous / next */
.wk-pn{padding:0 0 110px}
.wk-pn .two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.wk-pn a{display:grid;grid-template-columns:96px 1fr;gap:18px;align-items:center;border-radius:20px;border:1px solid var(--cardline);background:var(--card);padding:14px;text-decoration:none;transition:border-color .3s,transform .3s}
.wk-pn a:hover{border-color:var(--a1);transform:translateY(-2px)}
.wk-pn a.nx{grid-template-columns:1fr 96px;text-align:right}
.wk-pn a.nx img{order:2}
.wk-pn img{width:96px;height:96px;object-fit:cover;border-radius:14px}
.wk-pn small{display:block;font-size:13px;color:var(--ink-dim);font-weight:600}
.wk-pn b{font-size:clamp(17px,1.8vw,22px);line-height:1.2}

/* index */
.wk-ihero{position:relative;overflow:hidden;padding:150px 0 40px}
.wk-ihero .wk-floor{height:70%;opacity:.8}
.wk-ihero h1{max-width:14ch;margin-bottom:22px}
.wk-ihero .wrap{position:relative;z-index:1}
.wk-glow{position:absolute;left:50%;top:-30%;width:90%;height:90%;transform:translateX(-50%);background:radial-gradient(50% 50% at 50% 50%,#7460E340,#ED427C22 45%,transparent 70%);filter:blur(30px);z-index:0;pointer-events:none}
.wk-list{padding:48px 0 110px}
.wk-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}
.wk-card{position:relative;grid-column:span 3;display:flex;flex-direction:column;border-radius:26px;border:1px solid var(--cardline);background:var(--card);overflow:hidden;text-decoration:none;transition:border-color .3s,transform .4s}
[data-theme=dark] .wk-card{background:#12172680}
.wk-card:hover{transform:translateY(-4px);border-color:var(--a1)}
.wk-card .im{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--bg2)}
.wk-card .im img{width:100%;height:100%;object-fit:cover;transition:transform .9s ease}
.wk-card:hover .im img{transform:scale(1.05)}
.wk-card .im::after{content:"";position:absolute;inset:auto 0 0 0;height:40%;background:linear-gradient(180deg,transparent,#0A0E1D66)}
.wk-card .tx{padding:24px 26px 28px;display:flex;flex-direction:column;gap:10px;flex:1}
.wk-card h2{font-size:clamp(26px,2.6vw,36px)}
.wk-card p{color:var(--ink-dim);font-size:16px;max-width:52ch;text-wrap:pretty}
.wk-card .go{margin-top:auto;padding-top:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:700;font-size:15px}
.wk-card .go svg{width:18px;height:18px;flex:none;transition:transform .3s}
.wk-card:hover .go svg{transform:translateX(4px)}
.wk-card.wide{grid-column:span 6;flex-direction:row}
.wk-card.wide .im{flex:1 1 56%;aspect-ratio:auto;min-height:360px}
.wk-card.wide .tx{flex:1 1 44%;justify-content:center;padding:clamp(26px,4vw,56px)}
.wk-card.wide h2{font-size:clamp(32px,4vw,56px)}
.wk-card.rev{flex-direction:row-reverse}
.wk-card .wk-chips{margin-bottom:0}

@media (max-width:960px){
  .wk-hero{padding:104px 0 56px;min-height:0}
  .wk-in,.wk-about .row{grid-template-columns:1fr}
  .wk-art{width:min(100%,calc(62vh * var(--ar,1)))}
  .wk-about{padding-top:64px}
  .wk-about h2{max-width:none}
  .wk-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .wk-grid figure,.wk-grid .s3,.wk-grid .s4{grid-column:span 1}
  .wk-grid .s6,.wk-grid .m2{grid-column:span 2}
  .wk-grid .tall{grid-row:auto;aspect-ratio:var(--ar,1)}
  .wk-grid figure:last-child:nth-child(odd){grid-column:span 2;aspect-ratio:calc(var(--ar,1)*2)}
  .wk-band .panel{grid-template-columns:1fr}
  .wk-cards{grid-template-columns:1fr}
  .wk-card,.wk-card.wide{grid-column:auto}
  .wk-card.wide,.wk-card.wide.rev{flex-direction:column}
  .wk-card.wide .im{flex:none;aspect-ratio:4/3;min-height:0}
}
@media (max-width:600px){
  .wk-hero{padding:92px 0 48px}
  .wk-pn .two{grid-template-columns:1fr}
  .wk-facts div{grid-template-columns:1fr;gap:2px}
  .wk-pn a,.wk-pn a.nx{grid-template-columns:72px 1fr;text-align:left}
  .wk-pn a.nx img{order:0}
  .wk-pn img{width:72px;height:72px}
  .wk-copy h1{font-size:clamp(38px,11vw,52px)}
  .wk-btns .btn{width:100%;justify-content:center}
  .wk-grid figcaption{font-size:12px;left:8px;bottom:8px}
}