/* Bröllopsinbjudan Timur & Nazife */

@font-face {
  font-family: "EB Garamond";
  src: url("typsnitt/eb-garamond.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "EB Garamond";
  src: url("typsnitt/eb-garamond-kursiv.woff2") format("woff2");
  font-weight: 400 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Hanken Grotesk";
  src: url("typsnitt/hanken-grotesk.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --papper: #f8f3ea;
  --kuvert: #eee4d2;
  --blaeck: #2a2320;
  --text: #4e443d;
  --dampad: #6b5f55;
  --guld: #b08d4c;
  --guld-linje: rgba(176, 141, 76, .5);
  --guld-text: #7d5f2e;
  --guld-ljus: #dcc38c;
  --gron: #22382e;
  --gron-djup: #1b2e25;
  --elfenben: #f4ecdf;
  --vax: #7a1e26;
  --serif: "EB Garamond", Garamond, "Times New Roman", serif;
  --sans: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
  --mjuk: cubic-bezier(.22, .61, .36, 1);
  --ut: cubic-bezier(.16, 1, .3, 1);
  --kant: 1.25rem;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  background: var(--papper);
}
html.las { overflow: hidden; }

body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--sans);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--text);
  background: var(--papper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img { display: block; max-width: 100%; }
p { margin: 0; }
[hidden] { display: none !important; }

/* ------------------------------------------------------------------ */
/* Kuvertet                                                            */
/* ------------------------------------------------------------------ */

.kuvert {
  position: fixed;
  inset: 0;
  z-index: 50;
  background: var(--papper);
  overflow: hidden;
  transition: opacity .75s var(--mjuk) 1.95s, visibility 0s linear 2.7s;
}

.kuvert-knapp {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}
.kuvert-knapp:focus { outline: none; }

.kuvert-kropp {
  --flik: 53%;
  --sigill: clamp(96px, min(33vw, 17vh), 148px);
  position: absolute;
  inset: 0;
  display: block;
  perspective: 1500px;
  perspective-origin: 50% 20%;
}

.kuvert-kropp > span { position: absolute; display: block; }

.kuvert-insida {
  inset: 0;
  z-index: 1;
  background: #b9c3ae url("bilder/foder.svg") repeat;
  background-size: 56px 56px;
}
.kuvert-insida,
.kuvert-ficka {
  transition: transform 1.05s cubic-bezier(.55, 0, .3, 1) 1.2s;
}

.kuvert-kort {
  left: 7%;
  right: 7%;
  top: 7%;
  height: 58%;
  z-index: 2;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.5rem 1rem 2rem;
  text-align: center;
  background: var(--papper);
  box-shadow: 0 1px 3px rgba(60, 40, 20, .16), 0 22px 40px -24px rgba(60, 40, 20, .35);
  transition: transform 1.25s var(--ut) 1.15s;
}
.kuvert-kort::after {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid var(--guld-linje);
  pointer-events: none;
}
.kort-krans { width: min(64%, 250px, 40vh); height: auto; }
.kort-etikett {
  margin-top: .9rem;
  font-weight: 600;
  font-size: .68rem;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--guld-text);
}
.kort-namn {
  display: flex;
  flex-direction: column;
  margin-top: .5rem;
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(2.1rem, min(12.5vw, 7.5vh), 4.4rem);
  line-height: 1;
  color: var(--blaeck);
}
.kort-namn em { font-size: .5em; line-height: 1.4; color: var(--guld); }

.kuvert-ficka { inset: 0; z-index: 3; }
.kuvert-ficka svg, .flik-form svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.kuvert-flik {
  left: 0;
  right: 0;
  top: 0;
  height: var(--flik);
  z-index: 4;
  transform-origin: 50% 0;
  transform-style: preserve-3d;
  transition: transform 1s cubic-bezier(.5, .05, .3, 1) .32s, z-index 0s linear .8s;
}
.flik-yta {
  position: absolute;
  inset: 0;
  display: block;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.flik-fram { filter: drop-shadow(0 3px 5px rgba(84, 60, 32, .2)); }
.flik-form {
  position: absolute;
  inset: 0;
  display: block;
  background: linear-gradient(180deg, #f3eadb 0%, #ece1cd 100%);
  clip-path: polygon(0 0, 100% 0, 52.5% 97.2%, 51.2% 99.3%, 50% 100%, 48.8% 99.3%, 47.5% 97.2%);
}
.flik-bak {
  transform: rotateX(180deg);
  background: #b9c3ae url("bilder/foder.svg") repeat;
  background-size: 56px 56px;
  clip-path: polygon(0 100%, 100% 100%, 52.5% 2.8%, 51.2% .7%, 50% 0, 48.8% .7%, 47.5% 2.8%);
}

.sigill {
  left: 50%;
  top: var(--flik);
  z-index: 6;
  width: var(--sigill);
  height: var(--sigill);
  margin-left: calc(var(--sigill) / -2);
  margin-top: calc(var(--sigill) * -.55);
}
.sigill::before {
  content: "";
  position: absolute;
  inset: -10px;
  border-radius: 50%;
  border: 1px solid var(--guld);
  opacity: 0;
  transform: scale(.94);
  transition: opacity .3s, transform .3s var(--mjuk);
}
.kuvert-knapp:focus-visible .sigill::before { opacity: 1; transform: none; }
.sigill-halva { position: absolute; inset: 0; display: block; }
.sigill-halva img { width: 100%; height: 100%; }
.sigill-v { clip-path: polygon(0 0, 52% 0, 47% 21%, 54% 38%, 46% 55%, 53% 71%, 48% 87%, 51% 100%, 0 100%); }
.sigill-h { clip-path: polygon(52% 0, 100% 0, 100% 100%, 51% 100%, 48% 87%, 53% 71%, 46% 55%, 54% 38%, 47% 21%); }
/* Det hela sigillet ligger överst tills det brister, så att skarven inte syns */
.sigill-hel { z-index: 1; }

.kuvert-text {
  left: 0;
  right: 0;
  bottom: max(7%, calc(env(safe-area-inset-bottom) + 1.5rem));
  z-index: 6;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: .55rem;
  text-align: center;
  transition: opacity .35s var(--mjuk);
}
.kuvert-fran {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.35rem;
  color: #5a4c3f;
}
.kuvert-uppmaning {
  font-weight: 600;
  font-size: .7rem;
  letter-spacing: .3em;
  padding-left: .3em;
  text-transform: uppercase;
  color: var(--guld-text);
  animation: puls 2.8s ease-in-out infinite;
}
@keyframes puls { 50% { opacity: .45; } }

.kuvert-korn {
  inset: 0;
  z-index: 7;
  pointer-events: none;
  background: url("bilder/papper.svg") repeat;
  background-size: 220px 220px;
  opacity: .32;
  transition: opacity .3s var(--mjuk);
}

/* Öppningen: sigillet brister, fliken viks upp, kortet glider fram */
.oppnas .kuvert-text,
.oppnas .kuvert-korn { opacity: 0; }
.oppnas .sigill-v { animation: brist-v .8s var(--mjuk) forwards; }
.oppnas .sigill-h { animation: brist-h .8s var(--mjuk) forwards; }
.oppnas .sigill-hel { animation: brist-hel .8s var(--mjuk) forwards; }
@keyframes brist-hel {
  0% { transform: none; }
  20% { transform: scale(.95); opacity: 1; }
  21%, 100% { transform: scale(.95); opacity: 0; }
}
@keyframes brist-v {
  0% { transform: none; }
  20% { transform: scale(.95); opacity: 1; }
  34% { transform: translate(-5%, 1%) rotate(-4deg) scale(.96); opacity: 1; }
  62% { opacity: 1; }
  100% { transform: translate(-34%, 40%) rotate(-20deg) scale(.94); opacity: 0; }
}
@keyframes brist-h {
  0% { transform: none; }
  20% { transform: scale(.95); opacity: 1; }
  34% { transform: translate(5%, 1%) rotate(4deg) scale(.96); opacity: 1; }
  62% { opacity: 1; }
  100% { transform: translate(34%, 44%) rotate(18deg) scale(.94); opacity: 0; }
}
.oppnas .kuvert-flik { transform: rotateX(178deg); z-index: 1; }
.oppnas .kuvert-insida,
.oppnas .kuvert-ficka { transform: translate3d(0, 102%, 0); }
.oppnas .kuvert-kort { transform: translate3d(0, 24%, 0) scale(1.04); }
.oppnas,
.oppnas-lugnt { opacity: 0; visibility: hidden; pointer-events: none; }
.oppnas-lugnt { transition: opacity .5s ease, visibility 0s linear .5s; }
.oppnas-lugnt .kuvert-uppmaning { animation: none; }

/* Bara transform här: opacity i will-change plattar till flikens 3D-rum */
.kuvert.oppnas .kuvert-flik,
.kuvert.oppnas .kuvert-kort,
.kuvert.oppnas .kuvert-ficka,
.kuvert.oppnas .kuvert-insida,
.kuvert.oppnas .sigill-halva { will-change: transform; }

/* Dator: kuvertet ligger på ett grönt underlag */
@media (min-width: 900px) and (min-aspect-ratio: 5/4) {
  .kuvert {
    background:
      linear-gradient(rgba(27, 46, 37, .84), rgba(27, 46, 37, .84)),
      var(--gron) url("bilder/monster.svg") repeat;
    background-size: auto, 56px 56px;
  }
  .kuvert-kropp {
    --flik: 55%;
    --sigill: clamp(130px, 17vh, 168px);
    position: relative;
    inset: auto;
    width: min(84vw, 130vh, 980px);
    aspect-ratio: 3 / 2;
    box-shadow: 0 50px 90px -30px rgba(0, 0, 0, .6), 0 18px 30px -18px rgba(0, 0, 0, .45);
  }
  .kuvert-kort { top: 6%; height: auto; bottom: 3%; justify-content: flex-start; padding-top: 2.5rem; }
  .kort-namn { font-size: clamp(3rem, 7vh, 4.4rem); }
  .kuvert-text { bottom: 8%; }
  .oppnas .kuvert-insida,
  .oppnas .kuvert-ficka { transform: none; }
  .oppnas .kuvert-kort { transform: translate3d(0, -34%, 0); }
}

/* ------------------------------------------------------------------ */
/* Inbjudan                                                            */
/* ------------------------------------------------------------------ */

.ark {
  position: relative;
  display: block;
  max-width: 40rem;
  margin: 0 auto;
  padding: 0 var(--kant) 1rem;
  background: var(--papper);
  overflow: hidden;
  opacity: 0;
  transform: translate3d(0, 56px, 0);
}
.oppnad .ark {
  opacity: 1;
  transform: none;
  transition: opacity 1s var(--mjuk), transform 1.3s var(--ut);
}
.ark::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("bilder/papper.svg") repeat;
  background-size: 220px 220px;
  opacity: .22;
  pointer-events: none;
}
.ark::after {
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px solid var(--guld-linje);
  outline: 1px solid rgba(176, 141, 76, .26);
  outline-offset: -6px;
  pointer-events: none;
}

.hjalte {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  min-height: 100svh;
  padding: 4.5rem 0 3.5rem;
  text-align: center;
}
.hjalte > * { opacity: 0; transform: translate3d(0, 18px, 0); }
.oppnad .hjalte > * {
  opacity: 1;
  transform: none;
  transition: opacity .9s var(--mjuk), transform 1.1s var(--ut);
}
.oppnad .hjalte > :nth-child(1) { transition-delay: .25s; }
.oppnad .hjalte > :nth-child(2) { transition-delay: .4s; }
.oppnad .hjalte > :nth-child(3) { transition-delay: .55s; }
.oppnad .hjalte > :nth-child(4) { transition-delay: .75s; }
.oppnad .hjalte > :nth-child(n+5) { transition-delay: .9s; }

.krans { width: min(80%, 300px); height: auto; }

.vidare {
  position: absolute;
  left: 50%;
  bottom: 1.6rem;
  width: 1px;
  height: 2.6rem;
  background: linear-gradient(var(--guld-linje), rgba(176, 141, 76, 0));
}

.etikett {
  margin: 0;
  font-weight: 600;
  font-size: .72rem;
  line-height: 1.4;
  letter-spacing: .32em;
  padding-left: .32em;
  text-transform: uppercase;
  color: var(--guld-text);
}
.hjalte .etikett { margin-top: 1.6rem; }

.namn {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 1.1rem 0 1.6rem;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(3.6rem, 18vw, 6.4rem);
  line-height: .98;
  letter-spacing: -.01em;
  color: var(--blaeck);
}
.namn:focus { outline: none; }
.namn-forst { padding-right: .55em; }
.namn-sist { padding-left: .55em; }
.och {
  font-size: .52em;
  line-height: 1.25;
  color: var(--guld);
}

.delare {
  display: flex;
  align-items: center;
  gap: .7rem;
  width: 8.5rem;
  margin: 0 auto;
  color: var(--guld);
}
.delare::before,
.delare::after {
  content: "";
  flex: 1;
  height: 1px;
  background: currentColor;
  opacity: .65;
}
.delare i {
  width: 6px;
  height: 6px;
  border: 1px solid currentColor;
  transform: rotate(45deg);
}
.delare-liten { width: 5rem; margin: 1.6rem auto; }

.hjalte-datum {
  margin-top: 1.5rem;
  font-family: var(--serif);
  font-size: clamp(1.35rem, 5.6vw, 1.6rem);
  line-height: 1.3;
  color: var(--blaeck);
}
.hjalte-datum em { color: var(--text); }
.hjalte-plats {
  margin-top: .35rem;
  font-weight: 500;
  font-size: .78rem;
  letter-spacing: .24em;
  padding-left: .24em;
  text-transform: uppercase;
  color: var(--dampad);
}

/* Sektioner */
.del {
  position: relative;
  max-width: 30rem;
  margin: 0 auto;
  padding: 3.75rem 0;
  text-align: center;
}
.del + .del::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 2.25rem;
  margin-top: -1.125rem;
  background: var(--guld-linje);
}
.halsning { padding-top: 1rem; }
.halsning::before { display: none; }

.rubrik {
  margin: .7rem 0 1.1rem;
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.9rem, 7.6vw, 2.6rem);
  line-height: 1.1;
  letter-spacing: -.005em;
  color: var(--blaeck);
  text-wrap: balance;
  max-width: 10.5em;
  margin-left: auto;
  margin-right: auto;
}
.halsning .rubrik { margin-top: 0; }
.brodtext { max-width: 29ch; margin: 0 auto; text-wrap: pretty; }
.brodtext + .brodtext { margin-top: .8rem; }

.liten-rubrik {
  margin: 0 0 .35rem;
  font-weight: 600;
  font-size: .7rem;
  letter-spacing: .28em;
  padding-left: .28em;
  text-transform: uppercase;
  color: var(--guld-text);
}

/* Nedräkning */
.rakna {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 24rem;
  margin: 1.8rem auto 0;
}
.enhet {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: .2rem 0 .1rem;
  border-left: 1px solid var(--guld-linje);
}
.enhet:first-child { border-left: 0; }
.siffra {
  font-family: var(--serif);
  font-size: clamp(2.3rem, 10.5vw, 3.1rem);
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--blaeck);
}
.enhet-namn {
  margin-top: .55rem;
  font-weight: 500;
  font-size: .62rem;
  letter-spacing: .16em;
  padding-left: .16em;
  text-transform: uppercase;
  color: var(--dampad);
}
.rakna-klar {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.5rem;
  color: var(--blaeck);
}

/* När och var */
.dagen-kort {
  position: relative;
  margin-top: 1.8rem;
  padding: 2.25rem 1.25rem 2.1rem;
  background: rgba(176, 141, 76, .08);
}
.dagen-varde {
  font-family: var(--serif);
  font-size: 1.6rem;
  line-height: 1.25;
  color: var(--blaeck);
  text-wrap: balance;
}
.dagen-varde.vantar { font-style: italic; color: var(--text); font-size: 1.35rem; }
.dagen-detalj { margin-top: .3rem; color: var(--text); }

.knappar {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: .7rem;
  max-width: 20rem;
  margin: 1.9rem auto 0;
}
.knapp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.1rem;
  padding: .8rem 1.4rem;
  border: 1px solid var(--gron);
  border-radius: 2px;
  background: var(--gron);
  color: var(--elfenben);
  font-weight: 600;
  font-size: .76rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color .25s var(--mjuk), color .25s var(--mjuk), border-color .25s var(--mjuk);
}
.knapp:hover { background: #2f4a3d; border-color: #2f4a3d; }
.knapp-kontur { background: transparent; color: var(--gron); }
.knapp-kontur:hover { background: var(--gron); color: var(--elfenben); }
.knapp:focus-visible,
a:focus-visible {
  outline: 2px solid var(--guld);
  outline-offset: 3px;
}
.kalender-alt {
  position: relative;
  z-index: 1;
  margin-top: 1rem;
  font-size: .9rem;
  color: var(--dampad);
}
.kalender-alt a, .osa-alt a, .kontakt-lista a {
  color: var(--blaeck);
  text-decoration-color: var(--guld);
  text-underline-offset: 3px;
}

/* Program */
.program {
  max-width: none;
  margin: 3.5rem calc(var(--kant) * -1) 0;
  padding: 1.25rem;
  z-index: 1;
  background:
    linear-gradient(rgba(34, 56, 46, .9), rgba(34, 56, 46, .9)),
    var(--gron) url("bilder/monster.svg") repeat;
  background-size: auto, 56px 56px;
  color: var(--elfenben);
}
.program::before { display: none; }
.program:not([hidden]) + .del::before { display: none; }
.program-ram {
  position: relative;
  max-width: 30rem;
  margin: 0 auto;
  padding: 3rem 1.25rem 2.25rem;
  border: 1px solid rgba(220, 195, 140, .55);
}
.program-ram::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(220, 195, 140, .22);
  pointer-events: none;
}
.etikett-ljus { color: var(--guld-ljus); }
.rubrik-ljus { color: var(--elfenben); }
.program-lista {
  margin: 2rem 0 0;
  padding: 0;
  list-style: none;
  text-align: left;
}
.program-punkt {
  display: grid;
  grid-template-columns: 4.4rem minmax(0, 1fr);
  gap: 0 1.1rem;
  padding: 1.15rem 0;
  border-top: 1px solid rgba(220, 195, 140, .25);
}
.program-punkt:last-child { padding-bottom: .4rem; }
.program-tid {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.45rem;
  line-height: 1.2;
  color: var(--guld-ljus);
  font-variant-numeric: tabular-nums;
}
.program-titel {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.32rem;
  line-height: 1.25;
  color: var(--elfenben);
}
.program-text {
  margin-top: .25rem;
  font-size: .95rem;
  line-height: 1.55;
  color: rgba(244, 236, 223, .8);
}

/* Bra att veta */
.bra-lista { margin: 1.6rem 0 0; }
.bra-lista dt {
  margin-top: 1.5rem;
  font-family: var(--serif);
  font-size: 1.35rem;
  line-height: 1.25;
  color: var(--blaeck);
}
.bra-lista dt:first-child { margin-top: 0; }
.bra-lista dd {
  max-width: 30ch;
  margin: .3rem auto 0;
}

/* OSA och kontakt */
.osa-alt { margin-top: 1rem; font-size: .9rem; color: var(--dampad); }
.kontakt { padding-top: 0; }
.kontakt::before { display: none; }
.kontakt-lista {
  margin: .6rem 0 0;
  padding: 0;
  list-style: none;
}
.kontakt-lista li + li { margin-top: 1rem; }
.kontakt-namn {
  display: block;
  font-family: var(--serif);
  font-size: 1.3rem;
  color: var(--blaeck);
}
.kontakt-roll { display: block; font-size: .9rem; color: var(--dampad); }
.kontakt-vagar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .2rem 1.2rem;
  margin-top: .25rem;
}

/* Avslutning */
.avslut {
  position: relative;
  max-width: 30rem;
  margin: 0 auto;
  padding: 2.5rem 0 4.5rem;
  text-align: center;
}
.avslut-sigill {
  width: 104px;
  height: 104px;
  margin: 0 auto 1.4rem;
}
.avslut-text {
  font-family: var(--serif);
  font-size: clamp(1.6rem, 6.6vw, 2rem);
  line-height: 1.2;
  color: var(--blaeck);
  text-wrap: balance;
}
.avslut-halsning {
  margin-top: 1.4rem;
  font-weight: 500;
  font-size: .72rem;
  letter-spacing: .28em;
  padding-left: .28em;
  text-transform: uppercase;
  color: var(--dampad);
}
.avslut-namn {
  margin-top: .35rem;
  font-family: var(--serif);
  font-style: italic;
  font-size: 2rem;
  color: var(--blaeck);
}
.avslut-namn em { color: var(--guld); }

/* Större skärmar: inbjudan ligger som ett kort på det gröna */
@media (min-width: 700px) {
  :root { --kant: 3rem; }
  html { background: var(--gron-djup); }
  body {
    background:
      linear-gradient(rgba(27, 46, 37, .86), rgba(27, 46, 37, .86)),
      var(--gron) url("bilder/monster.svg") repeat;
    background-size: auto, 56px 56px;
  }
  .ark {
    margin: 3.5rem auto;
    box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .55), 0 10px 24px -12px rgba(0, 0, 0, .35);
  }
  .ark::after { inset: 14px; }
  .hjalte { min-height: min(100svh, 900px); }
  .program { margin-left: 0; margin-right: 0; padding: 1.5rem; }
}

/* Minskad rörelse: bara en enkel toning */
@media (prefers-reduced-motion: reduce) {
  .kuvert-uppmaning { animation: none; }
  .kuvert-kort, .kuvert-flik, .kuvert-text, .kuvert-korn { transition: none; }
  .oppnas .sigill-v, .oppnas .sigill-h, .oppnas .sigill-hel { animation: none; }
  .oppnas .kuvert-flik, .oppnas .kuvert-kort { transform: none; }
  .kuvert { transition: opacity .5s ease, visibility 0s linear .5s; }
  .ark, .hjalte > * { transform: none; }
  .oppnad .ark, .oppnad .hjalte > * { transition: opacity .5s ease; transition-delay: 0s !important; }
}