/* Presentation deck on the AI page (from legacy/ai-daglig-produktion.html).
   Generic class names are scoped to .stage so they cannot leak into the site. */

.stage,.slide{overscroll-behavior:contain}
.stage{position:relative;aspect-ratio:16/9;width:100%;max-width:900px;margin:0 auto;background:#0D1728;border:1px solid var(--line);
  border-radius:16px;overflow:hidden;box-shadow:0 26px 70px -34px rgba(0,0,0,.9);cursor:pointer}
.slide{position:absolute;inset:0;padding:4.4%;display:none;flex-direction:column}
.slide.on{display:flex;animation:fade .3s ease}
@keyframes fade{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.slide.light{background:#F4F7FB;color:#0B1220}
.slide.dark{background:#0B1220;color:#EAF0FA}
.s-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:3.6%;flex:none}
.s-brand{display:flex;align-items:center;gap:9px;font-size:.62rem;font-weight:700;letter-spacing:.15em}
.s-brand svg{flex:none}
.s-kicker{font-size:.6rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#0F7A70}
.slide.dark .s-kicker{color:#2FD4C4}
.stage .eyebrow{font-size:.6rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#0F7A70;margin-bottom:1.4%}
.slide.dark .eyebrow{color:#2FD4C4}
.s-h1{font-size:clamp(1.05rem,2.6vw,2rem);line-height:1.14;letter-spacing:-.03em;font-weight:800}
.s-title-body{flex:1;display:flex;flex-direction:column;justify-content:center}
.s-rule{width:70px;height:3px;background:#2FD4C4;border-radius:2px;margin:3.4% 0}
.s-sub{font-size:clamp(.68rem,1.15vw,.86rem);color:#A9B8CC;max-width:52ch;line-height:1.55}
.s-foot-teal{font-size:.62rem;font-weight:700;letter-spacing:.18em;color:#2FD4C4;margin-top:5%}
.slide h3.big{font-size:clamp(.92rem,2.05vw,1.5rem);line-height:1.22;letter-spacing:-.028em;font-weight:800;max-width:23ch}
.slide p.body{font-size:clamp(.62rem,1.06vw,.8rem);color:#33415C;margin-top:2.2%;line-height:1.55}
.slide.dark p.body{color:#A9B8CC}
.stage .cols{display:grid;grid-template-columns:1fr 1fr;gap:4.4%;flex:1;min-height:0}
.stage .cols.narrow{grid-template-columns:46% 1fr}
.rowof-list{display:flex;flex-direction:column;justify-content:center;gap:0}
.rowof{padding:2.4% 0;border-bottom:1px solid #DCE3ED;font-size:clamp(.62rem,1.02vw,.79rem);color:#33415C;
  position:relative;padding-left:16px}
.rowof:last-child{border-bottom:0}
.rowof::before{content:'';position:absolute;left:0;top:48%;width:3px;height:34%;background:#2FD4C4;border-radius:2px}
.rowof.alt::before{background:#3B82F6}
.s-bottom{margin-top:auto;padding-top:4%}
.muted-line{font-size:.78rem;color:#6B7C96}
.strong-line{font-size:clamp(.95rem,2vw,1.35rem);font-weight:800;letter-spacing:-.025em;margin-top:.5%}
.slide.dark .strong-line{color:#fff}
.stage .quote{font-size:clamp(2.4rem,9vw,6rem);font-weight:800;letter-spacing:-.05em;color:#2FD4C4;line-height:.95}
.stage .src{display:flex;gap:22px;align-items:center;justify-content:flex-end}
.src-line{width:2px;height:120px;background:#24354F}
.stage .src b{display:block;font-size:clamp(.66rem,1.1vw,.82rem);color:#C9D6E6}
.stage .src span{font-size:clamp(.6rem,1vw,.75rem);color:#6E86A2}
.stage .mini{display:flex;flex-direction:column;gap:2.6%;justify-content:center}
.stage .mini .mhead{font-size:.6rem;font-weight:700;letter-spacing:.16em;color:#0F7A70;margin-bottom:2.4%}
.slide.dark .mini .mhead{color:#2FD4C4}
.stage .step{display:flex;gap:3.2%;align-items:center;background:#fff;border:1px solid #DCE3ED;
  border-radius:12px;padding:2.6% 3.2%;flex:1}
.slide.dark .step{background:#131F35;border-color:#22314A}
.stage .step .n{flex:none;width:2.4em;height:2.4em;border-radius:50%;display:grid;place-items:center;
  background:#E4F6F4;border:1px solid #B9E7E2;color:#0F7A70;font-weight:700;font-size:.78em}
.slide.dark .step .n{background:#1B2E48;border-color:#2D4A66;color:#2FD4C4}
.stage .step span{font-size:clamp(.6rem,1vw,.78rem);color:#33415C;line-height:1.42}
.slide.dark .step span{color:#DCE6F2}
.stage .result{background:#EAF7F5;border:1px solid #BEE9E3;border-top:3px solid #2FD4C4;border-radius:12px;
  padding:3.4% 4%;margin-top:auto}
.slide.dark .result{background:#16263F;border-color:#24405C;border-top-color:#2FD4C4}
.stage .result .lbl{font-size:.58rem;font-weight:700;letter-spacing:.16em;color:#0F7A70;margin-bottom:2.4%}
.slide.dark .result .lbl{color:#2FD4C4}
.stage .result p{font-size:clamp(.6rem,1vw,.78rem);color:#33415C;line-height:1.5}
.slide.dark .result p{color:#D6E2F0}
.stage .chips{display:flex;gap:7%;margin-top:4%}
.stage .chips b{display:block;font-size:clamp(.74rem,1.4vw,1.08rem);font-weight:800;color:#0F7A70;letter-spacing:-.03em}
.slide.dark .chips b{color:#2FD4C4}
.stage .chips i{font-style:normal;font-size:clamp(.54rem,.82vw,.66rem);color:#6B7C96;display:block;line-height:1.3;margin-top:2px}
.stage .method{display:grid;grid-template-columns:repeat(4,1fr);gap:2.2%;flex:1}
.mcard{background:#fff;border:1px solid #DCE3ED;border-top:3px solid #2FD4C4;border-radius:12px;padding:6% 7%}
.mcard.alt{border-top-color:#3B82F6}
.mn{font-size:clamp(1rem,2.2vw,1.6rem);font-weight:800;color:#0F7A70;letter-spacing:-.04em}
.mcard.alt .mn{color:#3B82F6}
.mt{font-size:clamp(.63rem,1.08vw,.84rem);font-weight:800;letter-spacing:-.02em;margin:3% 0 5%}
.mcard p{font-size:clamp(.55rem,.9vw,.68rem);color:#33415C;line-height:1.5}
.stage .timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:2.4%;flex:1;position:relative;padding-top:5%;margin-top:2%}
.stage .timeline::before{content:'';position:absolute;left:2%;right:2%;top:6.4%;height:2px;background:#DCE3ED}
.tl{position:relative;text-align:center}
.tl .dot{width:11px;height:11px;border-radius:50%;margin:0 auto 9%;position:relative;z-index:2;box-shadow:0 0 0 4px #F4F7FB}
.tl .ph{font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.tl .tt{font-size:clamp(.62rem,1.05vw,.81rem);font-weight:800;margin:4% 0;letter-spacing:-.015em}
.tl .td{font-size:clamp(.58rem,.92vw,.72rem);color:#6B7C96;line-height:1.45}

/* Controls under the stage */
.deck-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:20px}
.arrow{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.03);
  display:grid;place-items:center;cursor:pointer;transition:.2s;flex:none}
.arrow:hover{border-color:var(--brand);background:rgba(47,212,196,.1)}
.arrow svg{stroke:var(--txt);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.arrow:disabled{opacity:.28;cursor:default}
.dots{display:flex;gap:7px;justify-content:center;flex-wrap:wrap}
.dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.16);cursor:pointer;transition:.2s}
.dots button.on{background:var(--brand);transform:scale(1.25)}
.note{font-size:.82rem;color:var(--muted);margin-top:14px;text-align:center}

/* Without JavaScript all slides are shown stacked. */
.no-js .stage{aspect-ratio:auto;cursor:default}
.no-js .slide{position:relative;display:flex;aspect-ratio:16/9}
.no-js .deck-controls,.no-js .note{display:none}

@media(max-width:860px){
  .stage{max-width:100%}
  .slide{padding:5%}
  .s-h1{font-size:1.5rem}
  .slide h3.big{font-size:1.15rem}
  .slide p.body,.stage .step span,.stage .result p{font-size:.82rem}
  .stage .quote{font-size:3.4rem}
  .stage .cols,.stage .cols.narrow{grid-template-columns:1fr;gap:5%}
  .stage .method,.stage .timeline{grid-template-columns:1fr 1fr;gap:4%}
  .stage .timeline::before{display:none}
  .src-line{height:60px}
}
@media(max-width:600px){
  .stage .method,.stage .timeline{grid-template-columns:1fr;gap:5%}
  .stage .chips{gap:10%}
  .deck-controls{gap:12px}
}
