/* ==========================================================
   HØJMANN DIGITAL – PROCESS
   Scrollfortælling fra kompleksitet til klarhed.
   Animationer forklarer processen og respekterer reduced motion.
   ========================================================== */
.process-page{overflow:clip}.process-page h1,.process-page h2,.process-page h3{margin:0;font-family:var(--serif);font-weight:500;letter-spacing:-.045em}.process-hero{min-height:calc(100vh - 104px);display:flex;align-items:center;padding:92px 0 110px;background:linear-gradient(rgba(245,239,228,.95),rgba(245,239,228,.95)),repeating-linear-gradient(0deg,transparent 0 31px,rgba(41,39,32,.04) 31px 32px)}.process-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:80px;align-items:end}.process-hero h1{max-width:1080px;font-size:clamp(4.4rem,8.2vw,9rem);line-height:.91}.process-hero__grid>div>p:last-child{max-width:70ch;margin:36px 0 0;color:var(--body-text);font-size:1.15rem;line-height:1.82}.process-scroll-hint{display:grid;justify-items:center;gap:18px;color:var(--secondary-text);font-size:.78rem;font-weight:750;letter-spacing:.06em;text-align:center}.process-scroll-hint i{width:1px;height:78px;background:var(--terracotta);animation:processPulse 2s ease-in-out infinite}@keyframes processPulse{0%,100%{transform:scaleY(.5);transform-origin:top;opacity:.3}50%{transform:scaleY(1);opacity:1}}
.process-desk{position:relative;background:radial-gradient(circle at 15% 18%,rgba(173,86,51,.1),transparent 28%),radial-gradient(circle at 84% 46%,rgba(40,72,62,.1),transparent 32%),var(--sand)}.process-desk__surface{position:relative;width:min(1500px,100%);margin:auto;padding:10vh 32px 16vh}.process-desk__surface:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.2;background:repeating-linear-gradient(90deg,rgba(41,39,32,.05) 0 1px,transparent 1px 84px)}.process-scene{position:relative;min-height:105vh;display:grid;grid-template-columns:minmax(0,1.06fr) minmax(340px,.78fr);gap:92px;align-items:center;opacity:.14;transform:translateY(80px);transition:opacity .75s ease,transform .95s cubic-bezier(.2,.8,.2,1)}.process-scene.is-visible{opacity:1;transform:none}.process-scene:nth-child(even){grid-template-columns:minmax(340px,.78fr) minmax(0,1.06fr)}.process-scene:nth-child(even) .process-scene__object{order:2}.process-scene__object{position:relative;min-height:580px}.process-scene__copy{position:relative;z-index:8;max-width:600px}.process-scene__copy h2{font-size:clamp(3.4rem,5.4vw,6.2rem);line-height:.97}.process-scene__copy>p:not(.eyebrow){margin:28px 0 0;color:var(--body-text);font-size:1.08rem;line-height:1.82}
.process-postit{position:absolute;z-index:8;top:6%;left:4%;width:250px;min-height:210px;padding:28px;color:var(--paper);background:var(--terracotta);box-shadow:0 24px 48px rgba(41,39,32,.22);transform:rotate(-7deg) translate(-45px,-30px);transition:transform .9s cubic-bezier(.2,.8,.2,1)}.is-visible .process-postit{transform:rotate(-3deg)}.process-postit small,.process-paper small,.process-board small,.process-label small,.process-result-card small{display:block;color:var(--terracotta-dark);font-size:.68rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.process-postit small,.process-label small{color:#fff1e9}.process-postit strong{display:block;margin-top:45px;font-family:var(--serif);font-size:2rem;font-weight:500;line-height:1.08}.process-phone{position:absolute;top:19%;right:8%;width:min(430px,72%);aspect-ratio:1/.72;border:18px solid var(--forest-dark);border-radius:44px;background:var(--paper);box-shadow:0 34px 70px rgba(41,39,32,.24);transform:rotate(9deg) translateX(-90px);transition:transform 1s cubic-bezier(.2,.8,.2,1)}.is-visible .process-phone{transform:rotate(4deg)}.process-phone i{position:absolute;top:18px;left:50%;width:84px;height:10px;border-radius:99px;background:var(--forest-dark);transform:translateX(-50%)}.process-phone b{position:absolute;inset:65px 38px auto;height:24px;background:var(--sand)}.process-phone span{position:relative;display:block;width:74%;height:22px;margin:120px 38px -95px;background:var(--sand-light)}.process-phone span:nth-of-type(2){width:58%}.process-phone span:nth-of-type(3){width:68%}
.process-paper,.process-board{position:absolute;inset:7% 5%;padding:46px;background:var(--paper);box-shadow:0 30px 70px rgba(41,39,32,.2);transform:rotate(-3deg) scale(.94);transition:transform .9s cubic-bezier(.2,.8,.2,1)}.is-visible .process-paper,.is-visible .process-board{transform:rotate(-1deg) scale(1)}.process-paper h3{margin-top:16px;font-size:clamp(2.35rem,4vw,4.5rem);line-height:1}.process-paper--questions div{display:grid;grid-template-columns:48px 1fr;gap:16px;padding:18px 0;border-bottom:1px solid var(--line);font-family:var(--serif);font-size:1.35rem;transform:translateX(-28px);opacity:.1;transition:.5s ease}.is-visible .process-paper--questions div{transform:none;opacity:1}.is-visible .process-paper--questions div:nth-of-type(2){transition-delay:.12s}.is-visible .process-paper--questions div:nth-of-type(3){transition-delay:.24s}.is-visible .process-paper--questions div:nth-of-type(4){transition-delay:.36s}.process-paper--questions div span{color:var(--terracotta-dark);font-family:var(--sans);font-size:.72rem;font-weight:850}.process-paper--analysis{inset:9% 4%;transform:rotate(3deg)}.process-crossed,.process-replacement{margin:60px 0 0;font-family:var(--serif);font-size:clamp(2.7rem,4.8vw,5rem);line-height:1}.process-crossed{position:relative;color:var(--secondary-text)}.process-crossed:after{content:"";position:absolute;left:-2%;right:8%;top:53%;height:6px;background:var(--terracotta);transform:scaleX(0) rotate(-3deg);transform-origin:left;transition:transform .8s .25s ease}.is-visible .process-crossed:after{transform:scaleX(1) rotate(-3deg)}.process-replacement{margin-top:28px;color:var(--forest-dark);opacity:0;transform:translateY(24px);transition:.65s .8s ease}.is-visible .process-replacement{opacity:1;transform:none}.process-paper--analysis svg{width:100%;margin-top:32px;overflow:visible}.process-paper--analysis path{fill:none;stroke:var(--terracotta);stroke-width:7;stroke-linecap:round;stroke-dasharray:900;stroke-dashoffset:900;transition:stroke-dashoffset 1.4s .5s ease}.is-visible .process-paper--analysis path{stroke-dashoffset:0}
.process-board{inset:12% 4%;color:var(--paper);background:var(--forest-dark)}.process-board small{color:#e8cbbb}.process-board ul,.process-paper--test ul{display:grid;gap:15px;margin:42px 0 0;padding:0;list-style:none}.process-board li,.process-paper--test li{display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:center;padding:17px 0;border-bottom:1px solid rgba(255,255,255,.16);font-size:1.05rem;opacity:.1;transform:translateY(18px);transition:.45s ease}.is-visible .process-board li,.is-visible .process-paper--test li{opacity:1;transform:none}.is-visible li:nth-child(2){transition-delay:.12s}.is-visible li:nth-child(3){transition-delay:.24s}.is-visible li:nth-child(4){transition-delay:.36s}.process-board li span,.process-paper--test li span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:var(--forest-dark);background:var(--paper);font-weight:900}
.process-browser{position:absolute;inset:7% 5% 16%;overflow:hidden;background:var(--paper);border:10px solid var(--paper);box-shadow:0 30px 70px rgba(41,39,32,.22);transform:rotate(-3deg) translateY(55px);transition:transform .9s cubic-bezier(.2,.8,.2,1)}.is-visible .process-browser{transform:rotate(-1deg)}.process-browser header{height:54px;display:flex;align-items:center;gap:9px;padding:0 18px;background:var(--forest-dark)}.process-browser header i{width:10px;height:10px;border-radius:50%;background:var(--terracotta)}.process-browser aside{position:absolute;top:54px;bottom:0;left:0;width:24%;background:var(--sand-light)}.process-browser main{position:absolute;top:100px;right:44px;left:31%}.process-browser main>b{display:block;width:86%;height:24px;margin-bottom:22px;background:var(--sand)}.process-browser main>b:nth-child(2){width:58%}.process-browser main div{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:55px}.process-browser main span{min-height:160px;background:var(--warm-white);border:1px solid var(--line)}.process-label{position:absolute;z-index:6;right:0;bottom:3%;width:300px;padding:24px;color:var(--paper);background:var(--terracotta);box-shadow:0 20px 44px rgba(41,39,32,.22);transform:rotate(4deg)}.process-label strong{display:block;margin-top:12px;font-family:var(--serif);font-size:1.7rem;font-weight:500;line-height:1.08}
.process-paper--test{inset:6% 12% 12% 0;transform:rotate(2deg)}.process-paper--test li{color:var(--ink);border-bottom-color:var(--line)}.process-paper--test li span{color:var(--paper);background:var(--terracotta)}.process-mobile{position:absolute;z-index:7;right:1%;bottom:5%;width:170px;height:330px;padding:48px 20px 28px;border:12px solid var(--forest-dark);border-radius:34px;background:var(--paper);box-shadow:0 24px 54px rgba(41,39,32,.22);transform:rotate(9deg) translateY(60px);transition:transform .9s cubic-bezier(.2,.8,.2,1)}.is-visible .process-mobile{transform:rotate(4deg)}.process-mobile i{position:absolute;top:14px;left:50%;width:62px;height:10px;border-radius:99px;background:var(--forest-dark);transform:translateX(-50%)}.process-mobile b{display:block;height:20px;background:var(--sand)}.process-mobile span{display:block;height:19px;margin-top:18px;background:var(--sand-light)}.process-mobile span:nth-of-type(2){width:72%}.process-mobile span:nth-of-type(3){width:88%}
.process-debris i{position:absolute;width:180px;height:130px;background:var(--paper);box-shadow:0 16px 32px rgba(41,39,32,.14);transition:transform 1.1s ease,opacity .9s ease}.process-debris i:nth-child(1){top:9%;left:0;transform:rotate(-11deg)}.process-debris i:nth-child(2){top:3%;right:7%;background:var(--terracotta);transform:rotate(9deg)}.process-debris i:nth-child(3){bottom:5%;left:5%;background:var(--forest);transform:rotate(7deg)}.process-debris i:nth-child(4){bottom:11%;right:0;transform:rotate(-8deg)}.is-visible .process-debris i:nth-child(1){transform:translate(-230px,-140px) rotate(-25deg);opacity:0}.is-visible .process-debris i:nth-child(2){transform:translate(230px,-150px) rotate(28deg);opacity:0}.is-visible .process-debris i:nth-child(3){transform:translate(-240px,170px) rotate(24deg);opacity:0}.is-visible .process-debris i:nth-child(4){transform:translate(240px,160px) rotate(-24deg);opacity:0}.process-result-card{position:absolute;z-index:4;inset:12% 7%;display:flex;flex-direction:column;justify-content:center;padding:60px;background:var(--paper);box-shadow:0 34px 78px rgba(41,39,32,.2);transform:scale(.9) rotate(3deg);transition:transform 1s .25s cubic-bezier(.2,.8,.2,1)}.is-visible .process-result-card{transform:scale(1)}.process-result-card strong{margin-top:24px;font-family:var(--serif);font-size:clamp(3.4rem,6vw,6.6rem);font-weight:500;line-height:.95}.process-result-card p{max-width:42ch;margin:28px 0 0;color:var(--body-text);line-height:1.75}
.process-closing{padding:124px 0;color:var(--paper);background:var(--forest-dark)}.process-closing__inner{max-width:980px}.process-closing h2{max-width:16ch;font-size:clamp(3.5rem,6vw,6.5rem);line-height:.96}.process-closing__inner>p:not(.eyebrow){max-width:68ch;margin:32px 0 38px;color:#f3eee6;font-size:1.08rem;line-height:1.8}
@media(prefers-reduced-motion:reduce){.process-page *,.process-page *:before,.process-page *:after{animation:none!important;transition:none!important}.process-scene,.process-scene *{opacity:1!important;transform:none!important}.process-crossed:after{transform:scaleX(1) rotate(-3deg)!important}.process-paper--analysis path{stroke-dashoffset:0!important}.process-debris{display:none}}
@media(max-width:1020px){.process-hero__grid,.process-scene,.process-scene:nth-child(even){grid-template-columns:1fr}.process-scene:nth-child(even) .process-scene__object{order:0}.process-scene{gap:54px;padding:90px 0}.process-scroll-hint{justify-self:start}}
@media(max-width:760px){.process-hero{min-height:auto;padding:74px 0 88px}.process-hero h1{font-size:clamp(3.2rem,15vw,5.3rem)}.process-desk__surface{padding:40px 20px 90px}.process-scene{min-height:auto;padding:78px 0}.process-scene__object{min-height:500px}.process-scene__copy h2{font-size:clamp(3rem,13vw,4.8rem)}.process-postit{width:210px;min-height:170px}.process-phone{top:28%;right:0;width:80%}.process-paper,.process-board{inset:5% 0;padding:28px}.process-label{width:min(280px,88%)}.process-mobile{width:145px;height:285px}.process-result-card{inset:12% 2%;padding:34px 28px}.process-closing{padding:86px 0}}


/* ==========================================================
   VERSION 2 – STÆRKERE ÅBNING OG STRAMMERE RYTME
   ========================================================== */

.process-hero--story {
  position: relative;
  min-height: calc(88vh - 104px);
  overflow: hidden;
  padding: 76px 0 86px;
  background:
    radial-gradient(circle at 82% 50%, rgba(173,86,51,.10), transparent 30%),
    linear-gradient(rgba(245,239,228,.96), rgba(245,239,228,.96)),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(41,39,32,.04) 31px 32px);
}

.process-hero--story .process-hero__grid {
  grid-template-columns: minmax(0,.92fr) minmax(430px,1.08fr);
  align-items: center;
  gap: 48px;
}

.process-hero--story h1 {
  max-width: 780px;
  font-size: clamp(4rem,7.2vw,7.8rem);
}

.process-hero__copy {
  position: relative;
  z-index: 5;
}

.process-hero__copy > p:last-of-type {
  max-width: 52ch;
  margin-top: 28px;
}

.process-hero--story .process-scroll-hint {
  justify-items: start;
  margin-top: 34px;
  text-align: left;
}

.process-hero--story .process-scroll-hint i {
  width: 72px;
  height: 1px;
  transform-origin: left;
  animation: processPulseHorizontal 2s ease-in-out infinite;
}

@keyframes processPulseHorizontal {
  0%,100% { transform:scaleX(.45); opacity:.3; }
  50% { transform:scaleX(1); opacity:1; }
}

.process-hero__object {
  position: relative;
  min-height: 540px;
}

.process-phone--hero {
  top: 25%;
  right: 2%;
  width: min(500px,78%);
  transform: rotate(8deg) translate(70px,35px);
}

.process-hero--story.is-visible .process-phone--hero {
  transform: rotate(3deg) translate(0,0);
}

.process-postit--hero {
  top: 7%;
  left: 2%;
  width: 245px;
  min-height: 200px;
  transform: rotate(-8deg) translate(-35px,-30px);
}

.process-hero--story.is-visible .process-postit--hero {
  transform: rotate(-3deg) translate(0,0);
}

.process-hero__scribble {
  position: absolute;
  right: 12%;
  bottom: 2%;
  width: 280px;
}

.process-hero__scribble svg {
  width: 100%;
  overflow: visible;
}

.process-hero__scribble path {
  fill: none;
  stroke: var(--terracotta);
  stroke-width: 6;
  stroke-linecap: round;
  stroke-dasharray: 700;
  stroke-dashoffset: 700;
  transition: stroke-dashoffset 1.35s .65s ease;
}

.process-hero--story.is-visible .process-hero__scribble path {
  stroke-dashoffset: 0;
}

.process-desk__surface {
  padding-top: 4vh;
  padding-bottom: 9vh;
}

.process-scene {
  min-height: 78vh;
  gap: 66px;
}

.process-scene--2,
.process-scene--3,
.process-scene--4 {
  min-height: 72vh;
}

.process-scene--5,
.process-scene--6 {
  min-height: 82vh;
}

.process-scene--7 {
  min-height: 96vh;
}

.process-scene__object {
  min-height: 500px;
}

.process-scene__copy h2 {
  font-size: clamp(3.1rem,4.7vw,5.5rem);
}

.process-scene__copy>p:not(.eyebrow) {
  margin-top: 22px;
  line-height: 1.72;
}

.process-paper,
.process-board {
  inset: 5% 4%;
}

.process-paper--questions {
  inset: 3% 5%;
}

.process-paper--analysis {
  inset: 5% 4%;
}

.process-browser {
  inset: 5% 5% 13%;
}

.process-paper--test {
  inset: 4% 11% 8% 0;
}

.process-result-card {
  inset: 10% 7%;
}

.process-closing {
  padding-top: 98px;
  padding-bottom: 98px;
}

@media(max-width:1020px) {
  .process-hero--story .process-hero__grid {
    grid-template-columns: 1fr;
  }

  .process-hero__object {
    min-height: 500px;
    margin-top: -20px;
  }

  .process-scene {
    min-height: auto;
    padding: 72px 0;
  }
}

@media(max-width:760px) {
  .process-hero--story {
    min-height: auto;
    padding: 62px 0 54px;
  }

  .process-hero--story h1 {
    font-size: clamp(3.4rem,15vw,5.4rem);
  }

  .process-hero__object {
    min-height: 420px;
    margin-top: 10px;
  }

  .process-phone--hero {
    top: 28%;
    right: 0;
    width: 78%;
  }

  .process-postit--hero {
    top: 4%;
    left: 0;
    width: 190px;
    min-height: 155px;
    padding: 22px;
  }

  .process-postit--hero strong {
    margin-top: 28px;
    font-size: 1.55rem;
  }

  .process-hero__scribble {
    right: 3%;
    bottom: 0;
    width: 210px;
  }

  .process-desk__surface {
    padding-top: 20px;
  }

  .process-scene {
    padding: 62px 0;
  }

  .process-scene__object {
    min-height: 450px;
  }
}


/* ==========================================================
   VERSION 3 – KORTENES INDHOLD HOLDES INDEN FOR FLADEN
   Kun lokale højde- og placeringsrettelser.
   ========================================================== */

/* Spørgearket har fire linjer og skal kunne vokse med indholdet. */
.process-scene--2 .process-scene__object {
  min-height: 560px;
}

.process-paper--questions {
  top: 3%;
  right: 5%;
  bottom: auto;
  left: 5%;
  min-height: 500px;
}

/* Analysearket får lidt ekstra højde til kurve og tekst. */
.process-scene--3 .process-scene__object {
  min-height: 540px;
}

.process-paper--analysis {
  top: 5%;
  right: 4%;
  bottom: auto;
  left: 4%;
  min-height: 490px;
}

/* Løsningskortet beholder sin rytme, men får en sikker minimumshøjde. */
.process-scene--4 .process-scene__object {
  min-height: 520px;
}

.process-board {
  top: 8%;
  right: 4%;
  bottom: auto;
  left: 4%;
  min-height: 430px;
}

/* Testarket har fire punkter samt overskrift og må derfor ikke bindes af inset. */
.process-scene--6 .process-scene__object {
  min-height: 590px;
}

.process-paper--test {
  top: 4%;
  right: 11%;
  bottom: auto;
  left: 0;
  min-height: 520px;
}

.process-mobile {
  bottom: 2%;
}

/* Resultatkortet må ikke beskære den store serif-overskrift. */
.process-scene--7 .process-scene__object {
  min-height: 620px;
}

.process-result-card {
  top: 10%;
  right: 7%;
  bottom: auto;
  left: 7%;
  min-height: 500px;
  justify-content: center;
}

@media (max-width: 1020px) {
  .process-paper--questions,
  .process-paper--analysis,
  .process-board,
  .process-paper--test,
  .process-result-card {
    position: absolute;
  }
}

@media (max-width: 760px) {
  .process-scene--2 .process-scene__object {
    min-height: 600px;
  }

  .process-paper--questions {
    min-height: 550px;
  }

  .process-scene--3 .process-scene__object {
    min-height: 530px;
  }

  .process-paper--analysis {
    min-height: 470px;
  }

  .process-scene--4 .process-scene__object {
    min-height: 500px;
  }

  .process-board {
    min-height: 420px;
  }

  .process-scene--6 .process-scene__object {
    min-height: 650px;
  }

  .process-paper--test {
    right: 4%;
    min-height: 560px;
  }

  .process-mobile {
    right: 0;
    bottom: 0;
  }

  .process-scene--7 .process-scene__object {
    min-height: 570px;
  }

  .process-result-card {
    right: 2%;
    left: 2%;
    min-height: 470px;
  }
}