/* BK Studio — modernisering (lag ovenpå style.css og v2.css).
   Beholder logoet, blobben, topografi-linjerne, kortet og båndene, men strammer det hele op:
   små "(01) Sektion"-etiketter i mono, bedre læsbar brødtekst, en rolig pille som "Start et projekt"-knap,
   status + lokal tid (header, kontakt og footer) og et kæmpe ordmærke nederst i footeren. Elementerne bygges af modern.js. */

:root{
  --mono:ui-monospace,'SF Mono','JetBrains Mono',Menlo,Consolas,'Liberation Mono',monospace;
  --ink-soft:#4a4a4a;
  --live:#3ecf6e;
}

/* ---------- små etiketter: "(01) Ydelser" ---------- */
.m-idx,.eyebrow,.section-head .head-title .eyebrow{display:flex;align-items:center;gap:.9em;margin-bottom:clamp(14px,1.6vw,22px);font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--grey-500);}
.m-idx b{font-weight:500;color:var(--black);}
.m-idx::after{content:'';flex:0 0 clamp(28px,4vw,56px);height:1px;background:currentColor;opacity:.45;}
.faq .eyebrow{justify-content:center;}
.faq .eyebrow::before,.faq .eyebrow::after{content:'';flex:0 0 28px;height:1px;background:currentColor;opacity:.45;}
.cta-big .m-idx,.w3d .m-idx,.strip .m-idx{color:var(--grey-300);}
.cta-big .m-idx b,.w3d .m-idx b{color:var(--white);}

/* ---------- læsbar brødtekst (før lille og lysegrå) ---------- */
.section-head p,.pns .section-head p,.ct-copy>p,.w3d-foot p,.page-hero p,.burst-copy p{color:var(--ink-soft);font-size:clamp(15px,1.15vw,17px);line-height:1.6;max-width:40ch;}
.w3d-foot p,.cta-big p{color:rgba(247,247,245,.78);}
.faq-answer p{color:var(--ink-soft);font-size:16px;line-height:1.65;}
.faq-item summary{font-size:clamp(16px,1.3vw,19px);font-weight:500;}

/* ---------- "Start et projekt" som rolig pille, der ikke lægger sig hen over teksten ---------- */
.cta-float{left:auto!important;right:clamp(16px,2.4vw,36px)!important;bottom:clamp(16px,2.4vw,32px)!important;gap:12px;padding:14px 22px 14px 16px!important;
  background:var(--black)!important;border:1px solid rgba(247,247,245,.16)!important;border-radius:999px!important;mix-blend-mode:normal!important;
  box-shadow:0 10px 30px -12px rgba(0,0,0,.45);transform:translateY(16px);transition:opacity .35s,transform .55s var(--ease-out),background .3s,visibility 0s .35s;}
.cta-float.show{transform:none;transition:opacity .35s,transform .55s var(--ease-out),background .3s,visibility 0s;}
.cta-float::before{content:'';flex:none;width:22px;height:19px;background:var(--white);-webkit-mask:url(images/logo/bk-blob.svg) no-repeat center/contain;mask:url(images/logo/bk-blob.svg) no-repeat center/contain;transition:transform .6s var(--ease-out),background .3s;}
.cta-float img{height:14px!important;filter:brightness(0) invert(1)!important;transform:none!important;}
.cta-float:hover{background:var(--white)!important;border-color:var(--black)!important;}
.cta-float:hover::before{background:var(--black);transform:rotate(-20deg) scale(1.08);}
.cta-float:hover img{filter:brightness(0) invert(.08)!important;}
.cta-float:focus-visible{outline:2px solid var(--black);outline-offset:3px;}
@media(max-width:820px){.cta-float{padding:12px 18px 12px 14px!important;}.cta-float img{height:12px!important;}.cta-float::before{width:19px;height:16px;}}

/* ---------- status (ledig/optaget efter åbningstiderne) + lokal tid ---------- */
.m-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--live);box-shadow:0 0 0 0 rgba(62,207,110,.55);animation:mlive 2.4s ease-out infinite;}
.m-dot.off{background:#e3a03c;animation:none;box-shadow:none;}
@keyframes mlive{0%{box-shadow:0 0 0 0 rgba(62,207,110,.55)}70%,100%{box-shadow:0 0 0 9px rgba(62,207,110,0)}}
.m-clock{font-variant-numeric:tabular-nums;}
.hs-sep{opacity:.5;}
@media(prefers-reduced-motion:reduce){.m-dot{animation:none}}

/* i headeren, til venstre for DA / EN (følger headerens farve) */
.hdr-status{display:flex;align-items:center;gap:8px;margin-right:clamp(18px,2.2vw,34px);font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:var(--hc,inherit);}
@media(max-width:1000px){.hdr-status{display:none}}
/* headeren inverterer farverne (mix-blend-mode), så prikken her er sort/hvid: fyldt med puls = ledig, hul ring = optaget */
.hdr-status .m-dot{position:relative;background:currentColor;animation:none;box-shadow:none;}
.hdr-status .m-dot.off{background:transparent;border:1.5px solid currentColor;}
.hdr-status .m-dot:not(.off)::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:1px solid currentColor;animation:hring 2.4s ease-out infinite;}
@keyframes hring{0%{transform:scale(.5);opacity:.9}100%{transform:scale(1.5);opacity:0}}
@media(prefers-reduced-motion:reduce){.hdr-status .m-dot::after{animation:none;opacity:0}}

/* åbningstider ved kontaktoplysningerne: et kort i sidens stil (sort ramme, skæve hjørner, fede versaler) */
.hours{max-width:440px;margin-top:clamp(26px,3vw,38px);padding:clamp(18px,1.8vw,24px);border:1.5px solid var(--black);border-radius:var(--r3,18px);background:var(--white);}
.hours-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 16px;margin-bottom:14px;}
.hours-lab{font-size:clamp(18px,1.5vw,22px);font-weight:800;letter-spacing:-.02em;text-transform:uppercase;line-height:1;color:var(--black);}
.hours-now{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1.5px solid var(--black);border-radius:var(--r1,999px);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--black);}
.hours-sub{display:block;margin:-4px 0 12px;font-size:13px;color:var(--grey-500);}
.hours ul{list-style:none;margin:0;padding:0;}
.hours li{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;margin:0 -12px;border-top:1px solid var(--line-light);font-size:15px;color:var(--grey-700);}
.hours li:first-child{border-top:0;}
.hours li.today{background:var(--black);color:var(--white);border-color:transparent;border-radius:var(--r1,12px);font-weight:700;}
.hours li.today+li{border-top-color:transparent;}
.hours li.today span:first-child::after{content:'  i dag';font-weight:400;opacity:.6;font-size:12px;letter-spacing:.08em;text-transform:uppercase;}
.hours-t{font-variant-numeric:tabular-nums;font-weight:600;}
html[lang="en"] .hours li.today span:first-child::after{content:'  today';}

/* ---------- ydelser: renere kort ---------- */
.sv-img{position:relative;}
.sv-num{position:absolute;left:12px;top:12px;z-index:2;padding:4px 8px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--white);background:rgba(20,20,20,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px;}
.sv h3{letter-spacing:-.03em;}
.sv .sc-link{font-family:var(--mono);letter-spacing:.06em;}

/* ---------- links: understregning der tegnes ind ---------- */
.ct-lines a,.footer-legal a{background:linear-gradient(currentColor,currentColor) no-repeat 0 100%/0 1px;transition:background-size .45s var(--ease-out),color .3s;}
.ct-lines a:hover,.footer-legal a:hover{background-size:100% 1px;}

/* ---------- footer: kæmpe ordmærke + lokal tid ---------- */
.footer-heading{font-family:var(--mono);letter-spacing:.08em!important;}
.foot-mega{position:relative;display:flex;align-items:flex-end;gap:clamp(10px,1.6vw,28px);margin-top:clamp(28px,4vw,56px);}
.foot-mega .fm-blob{flex:none;width:17.5%;height:auto;filter:brightness(0) invert(1);transform-origin:50% 60%;transition:transform 1s var(--ease-out);}
.foot-mega .fm-word{flex:1 1 auto;width:auto;min-width:0;height:auto;filter:brightness(0) invert(1);}
.foot-mega:hover .fm-blob{transform:rotate(-10deg) scale(1.04);}
.foot-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;margin:clamp(14px,1.6vw,20px) 0 clamp(22px,2.6vw,36px);padding-bottom:clamp(18px,2vw,26px);border-bottom:1px solid var(--line-dark);font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey-300);}
.foot-meta span{display:flex;align-items:center;gap:8px;}
.foot-meta .m-clock{color:var(--white);}
@media(max-width:600px){.foot-mega{gap:8px}.foot-meta{flex-direction:column}}

/* ---------- blækstreger fra sektionsetiketterne (ink.js) ---------- */
.m-idx.ink-on{position:relative;}
.m-idx.ink-on::after{visibility:hidden;}
.ink-line{position:absolute;left:0;z-index:3;overflow:visible;pointer-events:none;}
.ink-stroke{fill:none;stroke:var(--black);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.ink-tip,.ink-blot{fill:var(--black);}
.ink-tip{transition:opacity .3s;}
.ink-blot{transform:scale(0);transition:transform .55s cubic-bezier(.2,1.6,.4,1);}
.ink-blot.on{transform:scale(1);}
@media(max-width:820px){.ink-stroke{stroke-width:2;}}
@media(prefers-reduced-motion:reduce){.ink-blot{transition:none;}}

/* ---------- billedbåndet som filmstrimmel ---------- */
.strip-track{--film:#262626;position:relative;padding:34px 0 34px var(--gut);margin-left:0;background-color:var(--film);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='12'%3E%3Crect x='7' y='0' width='12' height='12' rx='2.5' fill='%23141414'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='12'%3E%3Crect x='7' y='0' width='12' height='12' rx='2.5' fill='%23141414'/%3E%3C/svg%3E");
  background-repeat:repeat-x;background-position:0 7px,0 calc(100% - 7px);counter-reset:frame;}
.strip-track>div{position:relative;overflow:visible!important;counter-increment:frame;}
.strip-track>div img{border-radius:2px;}
.strip-track>div::before,.strip-track>div::after{position:absolute;left:2px;font-family:var(--mono);font-size:9px;line-height:1;letter-spacing:.12em;color:var(--grey-300);opacity:.7;white-space:nowrap;pointer-events:none;}
.strip-track>div::before{content:'BK 400';top:-14px;}
.strip-track>div::after{content:'\25B8 ' counter(frame) 'A';bottom:-14px;}
.strip-track>div:nth-child(even)::before{content:'BK 400 \2022 ' counter(frame);}
@media(max-width:820px){.strip-track{padding:28px 0 28px var(--gut);background-size:20px 9px,20px 9px;background-position:0 6px,0 calc(100% - 6px);}.strip-track>div::before{top:-12px}.strip-track>div::after{bottom:-12px}}

/* ---------- cursoren er BK-logoet ----------
   Hvidt logo med farve-inversion (mix-blend-mode: difference): sort på lyse flader og det modsatte på billeder og mørke flader.
   script.js flytter #cursor med musen; over links og knapper bliver logoet lidt større. */
@media(hover:hover) and (pointer:fine){
  html,body,:is(a,button,summary,label,select,[role=button],.cursor-target,.work-item,.w3c){cursor:none;}
  :is(input:not([type=checkbox]):not([type=radio]),textarea){cursor:text;}
  html body .cursor{display:block!important;width:26px;height:23px;border-radius:0;background:#fff;mix-blend-mode:difference;
    -webkit-mask:url(images/logo/bk-blob.svg) no-repeat center/contain;mask:url(images/logo/bk-blob.svg) no-repeat center/contain;
    transition:width .35s var(--ease-out),height .35s var(--ease-out),opacity .3s;}
  /* markøren venter uden for skærmen og er skjult, indtil musen er på siden (ingen BK i øverste venstre hjørne) */
  html body .cursor{left:-200px;top:-200px;visibility:hidden;}
  html body .cursor.show{visibility:visible;}
  html body .cursor.shrink{width:46px;height:40px;}
  html body .cursor.label{width:46px;height:40px;}
}

/* ---------- BK-logoet i 3D (logo3d.min.js) ---------- */
.l3d{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:clamp(40px,6vw,90px) var(--gut);background:var(--paper);overflow:hidden;}
.logo3d{position:relative;width:min(84vw,760px);aspect-ratio:1.35;touch-action:pan-y;cursor:grab;}
.logo3d.grabbing{cursor:grabbing;}
.logo3d-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;transition:filter .2s linear;}
.logo3d-shadow{position:absolute;left:50%;bottom:6%;width:46%;height:9%;transform:translateX(-50%);border-radius:50%;opacity:0;
  background:radial-gradient(closest-side,rgba(20,20,20,.28),rgba(20,20,20,0));filter:blur(6px);pointer-events:none;}
.logo3d::before{content:'';position:absolute;inset:18%;background:url(images/logo/bk-blob.svg) no-repeat center/contain;opacity:0;transition:opacity .4s;}
.logo3d.logo3d-fallback::before{opacity:1;}
.l3d-cap{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--grey-500);}

/* ---------- åbningen: 3D-logoet (logo3d.min.js) renderes på et skjult lærred; thru.js tegner det ind bag logo-vinduet ---------- */
.thru-3d{position:absolute;inset:0;z-index:0;opacity:0;pointer-events:none;}
.thru-3d canvas{display:block;width:100%;height:100%;}