/* Fra verkstedet — Sidesystem V3 (page-fra-verkstedet.php 1.0, 27.10.2026)
   Pakkens styles.css («Fra verkstedet», v2 showcase) 1:1: samme regler, verdier og rekkefølge. Klassene har fv-prefiks og
   alt er scopet på body.wd-fv, fordi temaets og Storefronts stilark også lastes (wp_head). Fargene er V3-tokenene (style.css
   §24); tonene, fullskjermens flate og tittelfargene på de mørke tonene finnes ikke som tokener og står som --fv-* her.
   Rekkefølge: tokener · nullstilling · bokstavsplitt · intro · topp · rutenett · markør · visningsknapper · fullskjerm · flip ·
   mobil · redusert bevegelse · uten JavaScript (lista). */

.wd-fv{
  --fv-bg:var(--wd-bg,#F5F3EF); --fv-surface:var(--wd-surface,#FFFDF9); --fv-paper:var(--wd-paper,#F4EDE2); --fv-ink:var(--wd-ink,#261F18);
  --fv-muted:var(--wd-muted,#675D51); --fv-line:var(--wd-line,#DED8CE); --fv-accent:var(--wd-accent,#785321); --fv-accent-soft:var(--wd-accent-soft,#EEE4D2);
  --fv-sand:var(--wd-sand,#C9B9A3);
  --fv-t-night:#2E261E; --fv-t-ink:var(--wd-glow,#3A3026); --fv-t-paper:var(--wd-night-text,#E9E1D3); --fv-t-sand:#E7DFD1; --fv-t-cream:var(--wd-img,#F6F2E9);
  --fv-stage:#16120E;
  --fv-serif:var(--wd-font-head,"Cormorant Garamond"),Georgia,serif;
  --fv-sans:var(--wd-font-ui,"Source Sans 3"),system-ui,sans-serif;
  --fv-mark:var(--wd-font-mark,"Cinzel"),Georgia,serif;
  --fv-ease:cubic-bezier(.76,0,.24,1);
  --fv-ease-out:cubic-bezier(.16,1,.3,1);
  --fv-pad:clamp(16px,2.2vw,40px);
}
.fv-splash :where(*),.fv-top :where(*),.fv-main :where(*){box-sizing:border-box;margin:0;padding:0}
.fv-splash,.fv-top,.fv-main{box-sizing:border-box;margin:0;padding:0}
.wd-fv .fv-main [hidden]{display:none!important}
html.fv-side{background:var(--wd-bg,#F5F3EF)}
html.fv-side.fv-klar,html.fv-side.fv-klar body.wd-fv{height:100%;overflow:hidden}
body.wd-fv{margin:0;padding:0;background:var(--fv-bg);color:var(--fv-ink);font-family:var(--fv-sans);font-size:15px;font-weight:400;line-height:normal;letter-spacing:normal;-webkit-font-smoothing:antialiased;overscroll-behavior:none}
.wd-fv .fv-top a,.wd-fv .fv-main a,.wd-fv .fv-top a:hover,.wd-fv .fv-main a:hover,.wd-fv .fv-top a:focus,.wd-fv .fv-main a:focus,.wd-fv .fv-top a:visited,.wd-fv .fv-main a:visited{color:inherit;text-decoration:none}
.wd-fv .fv-main button{font:inherit;color:inherit;background-color:transparent;background-image:none;border:0;border-radius:0;padding:0;margin:0;box-shadow:none;text-shadow:none;cursor:pointer;-webkit-appearance:none;appearance:none;letter-spacing:normal;text-transform:none;word-spacing:normal;min-height:0;min-width:0;line-height:normal;text-align:center;display:inline-block}
.wd-fv .fv-main button:hover,.wd-fv .fv-main button:focus,.wd-fv .fv-main button:active{color:inherit;background-color:transparent;border:0;box-shadow:none}
.wd-fv :focus-visible{outline:2px solid var(--fv-accent);outline-offset:3px}
.wd-fv .fv-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- bokstavsplitt ---------- */
.wd-fv .fv-ch{display:inline-block;transform:translateY(105%);transition:transform 1s var(--fv-ease-out);transition-delay:calc(var(--i)*35ms)}
.wd-fv .fv-split-wrap{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em}
.wd-fv .is-in .fv-ch{transform:none}

/* ---------- intro ---------- */
.wd-fv .fv-splash{position:fixed;inset:0;z-index:50;background:var(--fv-ink);color:var(--fv-paper);display:grid;place-items:center;
  clip-path:inset(0 0 0 0);transition:clip-path 1.1s var(--fv-ease)}
.wd-fv .fv-splash.is-out{clip-path:inset(0 0 100% 0)}
.wd-fv .fv-splash__inner{text-align:center;display:grid;justify-items:center;gap:22px}
.wd-fv .fv-splash__mark{font-family:var(--fv-mark);font-weight:400;letter-spacing:.32em;font-size:clamp(13px,1.1vw,16px);padding-left:.32em}
.wd-fv .fv-splash__line{display:block;width:min(240px,50vw);height:1px;background:var(--fv-sand);transform:scaleX(0);transition:transform 1.2s var(--fv-ease) .35s}
.wd-fv .fv-splash.is-in .fv-splash__line{transform:scaleX(1)}
.wd-fv .fv-splash__title{font-family:var(--fv-serif);font-weight:600;font-size:clamp(44px,7vw,112px);line-height:1;letter-spacing:-.01em}
.wd-fv .fv-splash__title .fv-ch{transition-delay:calc(.45s + var(--i)*40ms)}

/* ---------- topp ---------- */
.wd-fv .fv-top{position:fixed;z-index:20;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;
  padding:calc(var(--fv-pad)*.75) var(--fv-pad);pointer-events:none;transition:color .6s}
.wd-fv .fv-top a{pointer-events:auto}
.wd-fv .fv-wordmark{font-family:var(--fv-mark);font-weight:500;letter-spacing:.12em;font-size:15px}
.wd-fv .fv-top__nav{display:flex;gap:0;font-weight:500;font-size:15px}
.wd-fv .fv-top__nav span{margin-right:.35em}
.wd-fv .fv-top__nav a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .4s var(--fv-ease)}
.wd-fv .fv-top__nav a:hover{background-size:100% 1px}
.wd-fv.fv-mode-full .fv-top{color:var(--fv-paper)}
.admin-bar.wd-fv .fv-top{top:32px}
@media (max-width:782px){.admin-bar.wd-fv .fv-top{top:46px}}

/* ---------- rutenett ---------- */
.wd-fv .fv-grid{position:fixed;inset:0;overflow:hidden;cursor:none;touch-action:none;user-select:none;-webkit-user-select:none}
.wd-fv .fv-grid__track{position:absolute;inset:0}
.wd-fv .fv-col{position:absolute;top:0;left:0;will-change:transform,opacity}
.wd-fv .fv-main button.fv-tile{position:absolute;left:0;display:grid;place-items:center;will-change:transform}
.wd-fv .fv-tile__media{position:relative;overflow:hidden;display:grid;place-items:center;background:var(--tone);color:var(--tone-ink);
  transition:transform .6s var(--fv-ease-out),filter .5s}
.wd-fv .fv-tile__media img{width:100%;height:100%;object-fit:cover;display:block;max-width:none}
.wd-fv .fv-tile__media svg{width:46%;height:46%;stroke:currentColor;fill:none;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.wd-fv .fv-col.is-dim .fv-tile__media{filter:saturate(.35)}
.wd-fv .fv-tile:hover .fv-tile__media{filter:none;transform:scale(1.06)}
.wd-fv .fv-tile.is-enter .fv-tile__media{transform:scale(.4);opacity:0}
.wd-fv .fv-tile__media{opacity:1}
.wd-fv .fv-tile.is-enter-go .fv-tile__media{transition:transform 1.2s var(--fv-ease-out),opacity .9s,filter .5s}
.wd-fv .fv-grid.is-dragging .fv-tile:hover .fv-tile__media{transform:none}

.wd-fv .fv-tone-night{--tone:var(--fv-t-night);--tone-ink:#E9DDCB}
.wd-fv .fv-tone-ink{--tone:var(--fv-t-ink);--tone-ink:#D8C6AB}
.wd-fv .fv-tone-paper{--tone:var(--fv-t-paper);--tone-ink:var(--fv-ink)}
.wd-fv .fv-tone-sand{--tone:var(--fv-t-sand);--tone-ink:var(--fv-accent)}
.wd-fv .fv-tone-cream{--tone:var(--fv-t-cream);--tone-ink:#4A3D30;box-shadow:inset 0 0 0 1px #DBD0BE}

.wd-fv .fv-scope{position:absolute;left:50%;width:calc(var(--cw)*2);transform:translate(-50%,-50%);pointer-events:none}
.wd-fv .fv-scope{top:calc(var(--gtop) + (100% - var(--gtop) - var(--gbot))/2);height:calc(100% - var(--gtop) - var(--gbot))}
.wd-fv .fv-scope i{position:absolute;width:14px;height:14px;border:1px solid var(--fv-muted);border-style:solid;opacity:.55}
.wd-fv .fv-scope i:nth-child(1){left:-8px;top:-8px;border-width:1px 0 0 1px}
.wd-fv .fv-scope i:nth-child(2){right:-8px;top:-8px;border-width:1px 1px 0 0}
.wd-fv .fv-scope i:nth-child(3){left:-8px;bottom:-8px;border-width:0 0 1px 1px}
.wd-fv .fv-scope i:nth-child(4){right:-8px;bottom:-8px;border-width:0 1px 1px 0}

.wd-fv .fv-caption{position:absolute;left:50%;bottom:calc(var(--fv-pad)*.9);transform:translateX(-50%);text-align:center;pointer-events:none;width:min(90vw,900px)}
.wd-fv .fv-caption__cat{display:grid;justify-items:center;font-family:var(--fv-serif);font-weight:600;font-size:clamp(46px,6vw,92px);line-height:.95;letter-spacing:-.015em;overflow:hidden;padding-bottom:.08em}
.wd-fv .fv-caption__cat span,.wd-fv .fv-full__cat span{grid-area:1/1;white-space:nowrap}
.wd-fv .fv-caption__cat span{display:inline-block;transition:transform .7s var(--fv-ease),opacity .7s}
.wd-fv .fv-caption__cat span.is-out{transform:translateY(-100%);opacity:0}
.wd-fv .fv-caption__cat span.is-pre{transform:translateY(100%);opacity:0;transition:none}
.wd-fv .fv-caption__work{margin-top:6px;font-size:14px;font-weight:500;color:var(--fv-muted);min-height:1.4em;letter-spacing:.02em;transition:opacity .3s}
.wd-fv .fv-hint{position:absolute;left:var(--fv-pad);bottom:calc(var(--fv-pad)*.9 + 6px);font-size:13px;color:var(--fv-muted);letter-spacing:.04em;transition:opacity .8s}
.wd-fv .fv-hint::before{content:"";display:inline-block;width:28px;height:1px;background:currentColor;vertical-align:middle;margin-right:10px}
.wd-fv .fv-hint.is-gone{opacity:0}
.wd-fv .fv-bar{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--fv-pad)*.45);width:min(220px,40vw);height:1px;background:var(--fv-line)}
.wd-fv .fv-bar span{position:absolute;top:-1px;height:3px;width:22%;background:var(--fv-ink);left:0}

/* markør */
.wd-fv .fv-cursor{position:fixed;z-index:40;left:0;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;pointer-events:none;
  display:grid;place-items:center;transition:width .35s var(--fv-ease-out),height .35s var(--fv-ease-out),margin .35s var(--fv-ease-out),background .3s,opacity .3s}
.wd-fv .fv-cursor::before,.wd-fv .fv-cursor::after{content:"";position:absolute;background:var(--fv-ink)}
.wd-fv .fv-cursor::before{width:11px;height:1px}.wd-fv .fv-cursor::after{width:1px;height:11px}
.wd-fv .fv-cursor span{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--fv-paper);opacity:0;transition:opacity .2s}
.wd-fv .fv-cursor.is-big{width:68px;height:68px;margin:-34px 0 0 -34px;background:var(--fv-ink);border-radius:50%}
.wd-fv .fv-cursor.is-big::before,.wd-fv .fv-cursor.is-big::after{opacity:0}
.wd-fv .fv-cursor.is-big span{opacity:1}
.wd-fv.fv-mode-full .fv-cursor,.wd-fv.fv-no-hover .fv-cursor{opacity:0}

/* ---------- visningsknapper ---------- */
.wd-fv .fv-modes{position:fixed;z-index:25;right:var(--fv-pad);bottom:calc(var(--fv-pad)*.9 + 4px);display:flex;gap:12px}
.wd-fv .fv-main button.fv-modes__btn{width:22px;height:22px;opacity:.35;transition:opacity .3s,color .6s}
.wd-fv .fv-modes__btn svg{width:100%;height:100%;display:block}
.wd-fv .fv-main button.fv-modes__btn.is-on,.wd-fv .fv-main button.fv-modes__btn:hover{opacity:1}
.wd-fv.fv-mode-full .fv-main button.fv-modes__btn{color:var(--fv-paper)}

/* ---------- fullskjerm ---------- */
.wd-fv .fv-full{position:fixed;inset:0;z-index:10;background:var(--fv-stage);color:var(--fv-paper);overflow:hidden;touch-action:none;
  opacity:0;transition:opacity .7s var(--fv-ease)}
.wd-fv .fv-full.is-open{opacity:1}
.wd-fv .fv-full__bg{position:absolute;inset:-6%}
.wd-fv .fv-bg-layer{position:absolute;inset:0;display:grid;place-items:center;background:var(--tone);color:var(--tone-ink);
  transition:opacity 1.2s var(--fv-ease),transform 1.6s var(--fv-ease-out)}
.wd-fv .fv-bg-layer svg{width:120vmin;height:120vmin;stroke:currentColor;fill:none;stroke-width:.35;opacity:.18;filter:blur(1.5px)}
.wd-fv .fv-bg-layer img{width:100%;height:100%;object-fit:cover;filter:blur(18px) saturate(.8);max-width:none}
.wd-fv .fv-bg-layer.is-pre{opacity:0;transform:scale(1.12)}
.wd-fv .fv-full__veil{position:absolute;inset:0;background:radial-gradient(ellipse 60% 55% at 50% 48%,#78532133 0%,#16120E00 60%),radial-gradient(ellipse at center,#261F1822 0%,#16120Ebb 80%),linear-gradient(#16120E99,#16120E33 30%,#16120E33 70%,#16120Eaa)}
.wd-fv .fv-full__side{position:absolute;left:var(--fv-pad);top:clamp(88px,14vh,140px)}
.wd-fv .fv-full__kicker{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--fv-sand)}
.wd-fv .fv-full__cat{display:grid;justify-items:start;font-family:var(--fv-serif);font-weight:600;font-size:clamp(34px,3.4vw,56px);line-height:1;margin-top:10px;overflow:hidden;padding-bottom:.08em}
.wd-fv .fv-full__cat span{display:inline-block;transition:transform .8s var(--fv-ease),opacity .8s}
.wd-fv .fv-full__cat span.is-out{transform:translateY(-100%);opacity:0}
.wd-fv .fv-full__cat span.is-pre{transform:translateY(100%);opacity:0;transition:none}

.wd-fv .fv-full__stage{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin-top:-3vh}
.wd-fv .fv-full__card{position:relative;box-shadow:0 40px 90px -30px #000c;width:min(29vw,calc(66vh*.75),calc((100vh - 360px)*.75));aspect-ratio:3/4;overflow:hidden;background:#000}
.wd-fv .fv-card-layer{position:absolute;inset:0;display:grid;place-items:center;background:var(--tone);color:var(--tone-ink);
  clip-path:inset(0 0 0 0);transition:clip-path 1.1s var(--fv-ease)}
.wd-fv .fv-card-layer svg{width:44%;height:44%;stroke:currentColor;fill:none;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;transition:transform 1.6s var(--fv-ease-out)}
.wd-fv .fv-card-layer img{width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--fv-ease-out);max-width:none}
.wd-fv .fv-card-layer.is-pre{clip-path:inset(100% 0 0 0)}
.wd-fv .fv-card-layer.is-pre.from-top{clip-path:inset(0 0 100% 0)}
.wd-fv .fv-card-layer.is-pre svg,.wd-fv .fv-card-layer.is-pre img{transform:scale(1.25)}
.wd-fv .fv-card-layer.is-old svg,.wd-fv .fv-card-layer.is-old img{transform:scale(.92)}

.wd-fv .fv-full__title{position:absolute;left:0;top:calc(100% + 18px);width:max(100%,min(46vw,640px));
  font-family:var(--fv-serif);font-weight:600;font-size:clamp(30px,3.4vw,58px);line-height:.98;letter-spacing:-.005em}
.wd-fv .fv-full__title .fv-ch{transition-duration:.9s}
.wd-fv .fv-full__title.is-leaving .fv-ch{transform:translateY(-105%);transition:transform .5s var(--fv-ease);transition-delay:calc(var(--i)*12ms)}

.wd-fv .fv-full__nav{position:absolute;left:var(--fv-pad);bottom:calc(var(--fv-pad)*.9 + 4px);display:flex;gap:28px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.wd-fv .fv-main .fv-full__nav button{padding:6px 0;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .4s var(--fv-ease)}
@media (hover:hover){.wd-fv .fv-main .fv-full__nav button:hover{background-size:100% 1px}}
.wd-fv .fv-full__ticks{position:absolute;right:calc(var(--fv-pad) + 76px);bottom:calc(var(--fv-pad)*.9 + 4px);display:flex;align-items:flex-end;gap:7px;height:30px}
.wd-fv .fv-full__ticks i{display:block;width:2px;height:18px;background:#F4EDE255;transition:height .6s var(--fv-ease),background .6s}
.wd-fv .fv-full__ticks i.is-on{height:30px;background:var(--fv-paper)}
.wd-fv .fv-main .fv-full__cta{position:absolute;right:var(--fv-pad);top:clamp(88px,14vh,140px);font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid #F4EDE266;padding:12px 18px;transition:background .3s,color .3s,border-color .3s}
.wd-fv .fv-main .fv-full__cta:hover{background:var(--fv-paper);color:var(--fv-ink);border-color:var(--fv-paper)}

/* flip-klone (fra flisen til kortet) */
.wd-fv .fv-flip{position:fixed;z-index:30;pointer-events:none;overflow:hidden;display:grid;place-items:center;background:var(--tone);color:var(--tone-ink)}
.wd-fv .fv-flip svg{width:44%;height:44%;stroke:currentColor;fill:none;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.wd-fv .fv-flip img{width:100%;height:100%;object-fit:cover;max-width:none}

/* ---------- mobil ---------- */
@media (max-width:760px){
  .wd-fv .fv-caption__cat{font-size:clamp(40px,12vw,60px)}
  .wd-fv .fv-hint{display:none}
  .wd-fv .fv-full__stage{top:calc(var(--fv-pad)*.75 + 118px);transform:translateX(-50%);margin-top:0}
  .wd-fv .fv-full__card{width:min(68vw,calc((100svh - 118px - 300px)*.75))}
  .wd-fv .fv-full__title{top:calc(100% + 14px)}
  .wd-fv .fv-full__title{font-size:clamp(28px,8.4vw,40px);width:min(86vw,100%);width:84vw}
  /* tillegg: tittelen starter ved kortets venstrekant, så 84vw går forbi skjermkanten — lange ekte titler brytes før kanten */
  .wd-fv .fv-full__title{max-width:calc(50vw + min(68vw,calc((100svh - 118px - 300px)*.75))/2 - var(--fv-pad))}
  .wd-fv .fv-full__side{top:calc(var(--fv-pad)*.75 + 44px)}
  .wd-fv .fv-full__cat{font-size:28px;margin-top:6px}
  .wd-fv .fv-main .fv-full__cta{top:auto;bottom:calc(var(--fv-pad)*.9 + 44px);right:var(--fv-pad);padding:10px 14px;font-size:12px}
  .wd-fv .fv-full__ticks{display:none}
  .wd-fv .fv-top__nav{font-size:14px}
  .wd-fv .fv-wordmark{font-size:13px}
}
@media (max-height:560px) and (min-width:761px){.wd-fv .fv-full__title{font-size:30px}}

@media (prefers-reduced-motion:reduce){
  .wd-fv *,.wd-fv *::before,.wd-fv *::after{transition-duration:.01ms!important;transition-delay:0s!important;animation:none!important}
}

/* ---------- før skriptet / uten JavaScript ----------
   Introen dekker bare når siden har fv-js (satt straks i body). Bokstavene skjules til skriptet har splittet dem, og introen
   tas bort av seg selv etter 6 s om skriptet aldri kommer. Rutenettet, fullskjermen og knappene vises først når skriptet har
   bygget rutenettet (fv-klar); til da — og uten JavaScript — er arbeidene en vanlig liste. */
html.fv-side:not(.fv-js) .wd-fv .fv-splash{display:none}
html.fv-js .wd-fv .fv-splash [data-split]:not(.is-split){visibility:hidden}
html.fv-js:not(.fv-klar) .wd-fv .fv-splash{animation:fv-splash-ut .01s linear 6s forwards}
@keyframes fv-splash-ut{to{visibility:hidden;opacity:0}}
html.fv-side:not(.fv-klar) .wd-fv .fv-grid,html.fv-side:not(.fv-klar) .wd-fv .fv-full,html.fv-side:not(.fv-klar) .wd-fv .fv-modes,html.fv-side:not(.fv-klar) .wd-fv .fv-cursor{display:none}
html.fv-klar .wd-fv .fv-liste{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html.fv-side:not(.fv-klar) .wd-fv .fv-liste{padding:calc(var(--fv-pad)*.75 + 64px) var(--fv-pad) var(--fv-pad)}
.wd-fv .fv-liste__kat{font-family:var(--fv-serif);font-weight:600;font-size:clamp(34px,3.4vw,56px);line-height:1;letter-spacing:-.005em;margin:28px 0 16px}
.wd-fv .fv-liste__rad{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:16px}
.wd-fv .fv-liste figure{margin:0}
.wd-fv .fv-liste img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;background:var(--fv-t-cream);border-radius:0}
.wd-fv .fv-liste figcaption{margin-top:6px;font-size:14px;font-weight:500;color:var(--fv-muted);letter-spacing:.02em}
.wd-fv .fv-liste__tom{font-size:17px;color:var(--fv-muted)}
.wd-fv .fv-liste__tom a{text-decoration:underline}