/* Formverk Cases: den enkelte case-side */
.fv-case-page,.fv-case-cta,.fv-case-band{
  --c-ink:#1f1f1c;--c-muted:#5b5a52;--c-line:#d6cc95;--c-cream:#fbf9ee;--c-green:#5f6b45;--c-pill:#a99d5f;
  color:var(--c-ink);
}
.fv-case-page h2,.fv-case-cta h2{font-size:clamp(1.6rem,3vw,2.1rem);font-weight:700;letter-spacing:-.03em;line-height:1.15;margin:0 0 12px;text-wrap:balance}
.fv-case-page p,.fv-case-cta p{font-weight:300;line-height:1.65}

/* Grønt bånd i fuld bredde med kundens navn syet i guldtråd */
.fv-case-band{position:relative;overflow:hidden;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  background:radial-gradient(ellipse at 75% 20%,rgba(160,170,110,.45),transparent 60%),linear-gradient(160deg,#5d6d3f,#3f4c29)}
.fv-case-band::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(255,255,240,.06) 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,rgba(0,0,0,.08) 0 1px,transparent 1px 4px)}
.fv-case-band__inner{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:56px 20px 60px;display:grid;justify-items:center;text-align:center;gap:6px}
.fv-case-band__meta{margin:0;color:#fff;font-weight:300;letter-spacing:.12em;text-transform:uppercase;font-size:.8rem;opacity:.9}
.fv-case-band__title{color:#f3e3a3;font-size:clamp(3rem,8vw,6rem)}
.fv-case-band__plain{margin:0;color:#f3e3a3;font-size:clamp(2.4rem,6vw,4.2rem);font-weight:700;letter-spacing:-.03em}

/* Opgaven og løsningen side om side */
.fv-case-intro{max-width:1080px;margin:0 auto;padding:72px 20px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:20px 56px;align-items:start}
.fv-case-intro__col{min-width:0}
.fv-case-page .fv-case-intro h2{text-align:left;font-size:1.5rem}
.fv-case-intro p{margin:0 0 18px;color:var(--c-muted);font-size:1.05rem}
.fv-case-intro__link{grid-column:1/-1;margin:0!important}

/* Sektioner */
.fv-case-sec{max-width:1080px;margin:0 auto;padding:80px 20px 0;text-align:center}
.fv-case-sec__sub{color:var(--c-muted);margin:0 auto 32px;max-width:50ch}
.fv-case-content{text-align:left;max-width:760px}
.fv-case-content img{border-radius:14px;height:auto}

/* Galleri */
.fv-case-gallery{display:grid;gap:18px}
.fv-case-gallery--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.fv-case-gallery--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:700px){.fv-case-gallery--2,.fv-case-gallery--3{grid-template-columns:1fr}}
.fv-case-gallery figure{margin:0;overflow:hidden;border-radius:14px;background:var(--c-cream)}
.fv-case-gallery img{display:block;width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .6s ease}
.fv-case-gallery figure:hover img{transform:scale(1.03)}

/* Før/efter med saks */
.fv-ba{position:relative;overflow:hidden;border-radius:14px;max-width:1000px;margin:0 auto;user-select:none;box-shadow:0 18px 40px rgba(40,40,20,.14)}
.fv-ba__layer img{display:block;width:100%;height:auto}
.fv-ba__before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--x,50%)) 0 0)}
.fv-ba__before img{width:100%;height:100%;object-fit:cover}
.fv-ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:ew-resize;z-index:5}
.fv-ba__handle{position:absolute;inset:0;z-index:4;pointer-events:none}
.fv-ba__handle::before{content:"";position:absolute;top:0;bottom:0;left:calc(var(--x,50%) - 1px);width:2px;background:repeating-linear-gradient(180deg,#fff 0 8px,transparent 8px 13px);filter:drop-shadow(0 0 2px rgba(0,0,0,.4))}
.fv-ba__scissor{position:absolute;top:50%;left:clamp(28px,var(--x,50%),calc(100% - 28px));width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:#fff;box-shadow:0 4px 14px rgba(0,0,0,.2);display:grid;place-items:center}
.fv-ba__scissor svg{width:30px;height:30px}
.fv-ba.is-cutting .fv-ba__scissor svg{animation:fv-snip .25s ease-in-out infinite alternate}
@keyframes fv-snip{to{transform:rotate(-14deg) scale(.94)}}
.fv-ba__lbl{position:absolute;top:14px;z-index:3;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;background:rgba(0,0,0,.5);color:#fff;padding:4px 10px;border-radius:999px}
.fv-ba__lbl--l{left:14px}.fv-ba__lbl--r{right:14px}

/* Garnnøgler */
.fv-yarns{display:flex;flex-wrap:wrap;gap:22px;justify-content:center}
.fv-yarn{background:none;border:0;padding:0;display:grid;justify-items:center;gap:6px;font:inherit;font-size:.85rem;color:var(--c-muted);cursor:pointer}
.fv-yarn__ball{width:74px;height:74px;border-radius:50%;position:relative;box-shadow:inset -7px -9px 0 rgba(0,0,0,.12),0 4px 10px rgba(0,0,0,.08);transition:transform .45s cubic-bezier(.3,1.6,.5,1)}
.fv-yarn__ball::before{content:"";position:absolute;inset:0;border-radius:50%;background:repeating-linear-gradient(35deg,rgba(255,255,255,.18) 0 2px,transparent 2px 7px)}
.fv-yarn__ball::after{content:"";position:absolute;inset:0;border-radius:50%;background:repeating-linear-gradient(-40deg,rgba(0,0,0,.08) 0 2px,transparent 2px 9px)}
.fv-yarn:hover .fv-yarn__ball,.fv-yarn:focus-visible .fv-yarn__ball{transform:rotate(40deg) translateY(-4px)}
.fv-yarn code{font-family:ui-monospace,Menlo,monospace;font-size:.74rem;color:var(--c-ink);background:none}
.fv-yarn.is-copied code::after{content:" ✓";color:var(--c-green)}

/* Citat */
.fv-case-quote{position:relative;max-width:760px;margin:0 auto;padding:44px 40px;border:0;background:var(--c-cream);border-radius:20px;text-align:center}
.fv-case-quote::before{content:"";position:absolute;inset:10px;border-radius:14px;border:1.5px dashed var(--c-line);pointer-events:none}
.fv-case-quote p{font-size:clamp(1.15rem,2.2vw,1.45rem);font-weight:300;letter-spacing:-.01em;line-height:1.5;margin:0 0 12px;color:var(--c-ink)}
.fv-case-quote cite{font-style:normal;font-size:.9rem;color:var(--c-muted)}

/* Knapper */
.fv-case-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 32px;border-radius:999px;border:1px solid var(--c-green);background:var(--c-green);color:var(--c-cream)!important;text-decoration:none!important;font-weight:400;letter-spacing:-.02em;transition:background .25s,transform .25s}
.fv-case-btn:hover{background:#4c5737;transform:translateY(-2px)}
.fv-case-btn--ghost{background:var(--c-cream);border-color:var(--c-line);color:var(--c-pill)!important}
.fv-case-btn--ghost:hover{background:var(--c-green);border-color:var(--c-green);color:var(--c-cream)!important}

/* Forrige/næste */
.fv-case-nav{max-width:1080px;margin:88px auto 0;padding:28px 20px 0;border-top:1px solid #efe9cf;display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center}
.fv-case-nav a{text-decoration:none;color:var(--c-ink);font-weight:600;letter-spacing:-.02em}
.fv-case-nav a span{display:block;font-weight:300;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--c-muted)}
.fv-case-nav__next{text-align:right}
.fv-case-nav__all{border:1px solid var(--c-line);background:var(--c-cream);color:var(--c-pill)!important;border-radius:999px;padding:8px 20px;font-weight:300!important}
@media (max-width:600px){.fv-case-nav{grid-template-columns:1fr 1fr}.fv-case-nav__all{grid-column:1/-1;justify-self:center;order:3}}

@media (prefers-reduced-motion:reduce){.fv-case-page *{animation:none!important;transition:none!important}}

/* Processen: baggrundsbillede, boks og casens motiv syet trin for trin (som på Bag om) */
.fv-case-page .fv-case-proc{box-sizing:border-box;position:relative;overflow:hidden;width:100vw;max-width:100vw;margin:72px calc(50% - 50vw) 0;padding:110px 20px;background:#817e6a;text-align:center}
html:has(.fv-case-proc),body:has(.fv-case-proc){overflow-x:clip}
.fv-case-proc>*{position:relative;z-index:2}
.fv-case-proc--photo{background:#59603f}
.fv-case-proc>.fv-case-proc__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;margin:0;max-width:none}
.fv-case-proc--photo::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(rgba(40,38,28,.45),rgba(40,38,28,.55))}
.fv-case-proc__box{box-sizing:border-box;max-width:980px;margin:0 auto;padding:56px 48px 52px;background:rgba(251,250,243,.96);border-radius:6px;box-shadow:0 18px 50px rgba(0,0,0,.28)}
.fv-case-proc__box::before{content:"";position:absolute;inset:12px;border:2px dashed rgba(191,178,105,.55);border-radius:3px;pointer-events:none}
.fv-case-page .fv-case-proc__h{margin:0 0 34px;font-weight:400;font-size:clamp(30px,3vw,40px);letter-spacing:-2px;color:#111;text-align:center}
.fv-case-page .fv-case-proc__sub{margin:-24px 0 30px;color:#5b5a52;text-align:center}
.fv-case-proc__pills{display:flex;justify-content:center;gap:22px;flex-wrap:wrap}
.fv-case-proc__pill{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:14px 35px;border-radius:999px;background:#fbfaf3;border:1px solid #bfb269;color:#bfb269;font:inherit;font-size:18px;font-weight:300;cursor:pointer;white-space:nowrap;box-sizing:border-box;transition:background .3s,color .3s,border-color .3s,transform .3s}
.fv-case-proc__pill:hover{transform:translateY(-2px)}
.fv-case-proc__pill[aria-selected="true"]{background:#5f6b45;border-color:#5f6b45;color:#fbfaf3}
.fv-case-proc__pill:focus-visible{outline:2px dashed #5f6b45;outline-offset:3px}
.fv-case-proc__body{display:grid;grid-template-columns:auto minmax(0,40ch);gap:56px;align-items:center;justify-content:center;max-width:900px;margin:40px auto 0;text-align:left}
.fv-case-proc__cv{display:block;width:300px;height:auto}
.fv-case-proc__txt{min-height:96px}
.fv-case-proc__panel{animation:fv-case-in .5s ease both}
.fv-case-proc__panel[hidden]{display:none}
.fv-case-proc__txt b{display:block;font-weight:400;font-size:22px;letter-spacing:-.8px;color:#5f6b45;margin-bottom:4px}
.fv-case-page .fv-case-proc__txt p{margin:0;color:#5b5a52;font-weight:300;font-size:18px;line-height:1.6}
.fv-case-page .fv-case-proc__txt .fv-case-proc__next{margin-top:16px;font-size:14px;opacity:.75}
@keyframes fv-case-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (max-width:1000px){.fv-case-proc__box{padding:48px 28px 44px}.fv-case-proc__pills{gap:12px}.fv-case-proc__pill{padding:12px 24px;font-size:17px}}
@media (max-width:760px){.fv-case-proc__body{grid-template-columns:1fr;gap:18px;text-align:center;justify-items:center}.fv-case-proc__cv{width:250px}}
@media (max-width:560px){.fv-case-page .fv-case-proc{padding:56px 12px}.fv-case-proc__box{padding:40px 18px 36px}.fv-case-proc__pills{gap:10px}.fv-case-proc__pill{font-size:16px;padding:10px 20px;min-height:48px}}