.review-slide .review-slide-stars {
  display: inline-flex;
  width: fit-content;
  gap: 2px;
  margin-bottom: 13px;
  color: inherit;
  font-size: inherit;
  letter-spacing: 0;
}

.review-slide .review-slide-stars b {
  width: 17px;
  height: 17px;
  font-size: 11px;
}

.review-score .review-score-stars {
  display: inline-flex;
  width: fit-content;
  gap: 2px;
  margin: 11px 0 10px;
  color: inherit;
  font-size: inherit;
  letter-spacing: 0;
}

.review-score .review-score-stars b {
  width: 22px;
  height: 22px;
  font-size: 15px;
}

.wizard-progress-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.wizard-progress-copy em {
  overflow: hidden;
  color: #8793a6;
  font-size: 9px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wizard-progress > span.active .wizard-progress-copy em {
  color: #68768b;
}

@media (max-width: 560px) {
  .wizard-progress-copy {
    display: none;
  }
}

/* Samlet hover-tempo: farve, gradient, ikon og løft bevæger sig som én effekt. */
.button {
  transition:
    transform 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    filter 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    border-color 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    background-position 0.82s cubic-bezier(0.16, 1, 0.3, 1);
}

.button i {
  transition:
    color 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.76s cubic-bezier(0.16, 1, 0.3, 1);
}

.button:hover {
  filter: brightness(1.008);
  transform: translateY(-1px);
  box-shadow: 0 9px 20px rgba(14, 32, 62, 0.12);
}

.button:hover i.bi-arrow-right,
.button:hover i.bi-box-arrow-up-right {
  transform: translateX(1px);
}

.button-primary:hover {
  background-position: 72% 50%;
  box-shadow: 0 12px 25px rgba(11, 87, 227, 0.24);
}

/* Fælles interaktiv flade til kort og medier på alle sider. */
.ui-lift {
  --ui-lift-y: -1px;
  --ui-lift-border: rgba(20, 99, 229, 0.36);
  --ui-lift-shadow: 0 13px 27px rgba(14, 32, 62, 0.13);
  --ui-lift-filter: brightness(1.015);
  transform: translateY(0);
  transition:
    transform 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    border-color 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    background-color 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    filter 0.76s cubic-bezier(0.16, 1, 0.3, 1);
}

.ui-lift:hover,
.ui-lift:focus-visible,
.ui-lift:focus-within,
.ui-lift.is-visible:hover,
.ui-lift.is-visible:focus-visible,
.ui-lift.is-visible:focus-within {
  transform: translateY(var(--ui-lift-y));
  border-color: var(--ui-lift-border);
  box-shadow: var(--ui-lift-shadow);
  filter: var(--ui-lift-filter);
}

.ui-lift-dark {
  --ui-lift-border: rgba(116, 168, 247, 0.46);
  --ui-lift-shadow: 0 12px 28px rgba(0, 17, 48, 0.18);
  --ui-lift-filter: brightness(1.045);
}

/* Fælles indholdsflader – bruges af både forside og undersider. */
.content-panel {
  border: 1px solid #d8e2ee;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(15, 48, 98, 0.09);
}

.content-panel-pad {
  padding: clamp(30px, 4vw, 54px);
}

.content-panel-dark {
  color: #fff;
  border-color: rgba(121, 174, 255, 0.18);
  background: #071a38;
  box-shadow: 0 24px 58px rgba(15, 48, 98, 0.14);
}

@media (max-width: 760px) {
  .content-panel {
    border-radius: 22px;
  }

  .content-panel-pad {
    padding: 26px 20px;
  }
}

.service-list > a,
.review-slide,
.contact-socials a,
.footer-contact-row,
.footer-socials a,
.wizard-choice,
.wizard-back {
  transition-duration: 0.52s;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.service-list > a > i,
.trust-panel-action,
.reviews-carousel-arrows button,
.review-slide-link,
.wizard-choice-icon {
  background-image: linear-gradient(135deg, #edf3ff 0%, #edf3ff 44%, #084bc9 56%, #2f7cff 100%);
  background-size: 240% 240%;
  background-position: 0% 0%;
  transition:
    color 0.52s cubic-bezier(0.22, 1, 0.36, 1),
    border-color 0.52s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.52s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.52s cubic-bezier(0.22, 1, 0.36, 1),
    background-position 0.52s cubic-bezier(0.22, 1, 0.36, 1);
}

.service-list > a:hover > i,
.trust-panel:hover .trust-panel-action,
.trust-panel:focus-visible .trust-panel-action,
.reviews-carousel-arrows button:hover:not(:disabled),
.review-slide:hover .review-slide-link,
.review-slide:focus-visible .review-slide-link,
.wizard-choice:hover .wizard-choice-icon {
  background-image: linear-gradient(135deg, #edf3ff 0%, #edf3ff 44%, #084bc9 56%, #2f7cff 100%);
  background-size: 240% 240%;
  background-position: 100% 100%;
}

.panel-heading a,
.quick-field,
.quick-options > button,
.contact-card .address-link,
.footer-nav a,
.footer-nav a i,
.modal-close {
  transition-duration: 0.48s;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.quick-options > button:hover {
  background: linear-gradient(90deg, #fbfdff 0%, #f4f8ff 100%);
}

.quick-options > button > i,
.quick-option-icon {
  border: 1px solid transparent;
  transition:
    background-color 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    border-color 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.76s cubic-bezier(0.16, 1, 0.3, 1);
}

.quick-options > button:hover > i,
.quick-options > button:hover .quick-option-icon {
  border-color: #cbdcfa;
  background-color: #dfeaff;
  box-shadow: 0 4px 10px rgba(11, 87, 227, 0.08);
}

.site-footer::before {
  top: 12px;
  right: -35px;
  width: 720px;
  height: 350px;
  border: 0;
  border-radius: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 720 350' fill='none' stroke='%2379a8ff' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg opacity='.34'%3E%3Cpath d='M420 228h164l-13-47c-4-14-16-23-30-23h-73c-13 0-25 8-30 21l-18 49Z'/%3E%3Cpath d='M397 228h207v51H397zM438 279a25 25 0 1 0 0 .1M564 279a25 25 0 1 0 0 .1M447 199h115'/%3E%3Cpath d='M254 109a72 72 0 0 1 144 0M326 109l38-44M274 109h105'/%3E%3Ccircle cx='632' cy='86' r='47'/%3E%3Ccircle cx='632' cy='86' r='16'/%3E%3Cpath d='M632 25v20M632 127v20M571 86h20M673 86h20M589 43l14 14M661 115l14 14M675 43l-14 14M603 115l-14 14'/%3E%3Cpath d='m282 246 89-89M274 217l28 28M351 156l22 22M236 294l46-48 23 23-48 46-28 5 7-26Z'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
  box-shadow: none;
  content: "";
  opacity: 0.7;
}

@media (max-width: 720px) {
  .site-footer::before {
    top: 70px;
    right: -220px;
    width: 600px;
    opacity: 0.48;
  }
}

.service-detail-section {
  padding-bottom: 52px;
}

.service-detail-section + .about-section {
  padding-top: 72px;
}

.service-detail-card {
  padding: 34px;
}

.service-detail-card::before {
  width: 49%;
  height: 58%;
  background:
    linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0.88) 15%, rgba(255, 255, 255, 0.2) 64%, rgba(255, 255, 255, 0.04) 100%),
    linear-gradient(0deg, #fff 0%, rgba(255, 255, 255, 0.05) 54%),
    url("./assets/img/diagnostic.jpg") center 48% / cover no-repeat;
  opacity: 0.72;
}

.service-detail-intro {
  display: block;
  min-height: 235px;
  margin-bottom: 0;
}

.service-detail-copy {
  width: min(58%, 650px);
  padding: 18px 0 28px;
}

.service-detail-intro h2 {
  max-width: 630px;
  margin: 9px 0 18px;
  font-size: clamp(32px, 3.15vw, 45px);
  line-height: 1.06;
  letter-spacing: -1.9px;
}

.service-detail-intro .service-detail-copy > p {
  max-width: 610px;
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
}

.service-detail-grid {
  gap: 0;
  border-top: 1px solid var(--line);
}

.service-detail-grid article {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  column-gap: 15px;
  align-content: start;
  padding: 25px 24px 4px 0;
}

.service-detail-grid article + article {
  padding-left: 24px;
}

.service-detail-grid article > i {
  grid-row: 1 / span 2;
  margin: 0;
}

.service-detail-grid h3 {
  margin: 1px 0 7px;
  font-size: 16px;
  line-height: 1.25;
}

.service-detail-grid p {
  font-size: 12.5px;
  line-height: 1.58;
}

@media (max-width: 980px) {
  .service-detail-card::before {
    width: 52%;
    height: 42%;
    opacity: 0.48;
  }

  .service-detail-copy {
    width: 64%;
  }

  .service-detail-intro {
    min-height: 225px;
  }

  .service-detail-grid article,
  .service-detail-grid article + article {
    padding: 22px 0;
  }
}

@media (max-width: 720px) {
  .service-detail-card {
    padding: 26px 22px;
  }

  .service-detail-card::before {
    width: 100%;
    height: 230px;
    opacity: 0.2;
  }

  .service-detail-intro {
    min-height: 0;
  }

  .service-detail-copy {
    width: 100%;
    padding: 8px 0 26px;
  }

  .service-detail-intro h2 {
    font-size: 31px;
  }

  .service-detail-grid article {
    grid-template-columns: 40px minmax(0, 1fr);
    column-gap: 14px;
  }
}

/* Visuel finpudsning efter gendannelse. Holdt samlet her, så hovedstilen forbliver urørt. */
html {
  scroll-behavior: auto;
}

/* Rolig editor-lignende udfyldning af kontaktfelterne i guiden. */
.wizard-final-grid input,
.wizard-final-grid textarea {
  background-color: #fff;
  background-image: linear-gradient(
    100deg,
    #fff 0%,
    #fff 48%,
    #f4f8ff 52%,
    #e8f1ff 100%
  );
  background-size: 210% 100%;
  background-position: 0 0;
  caret-color: var(--blue);
  transition:
    background-position 0.68s cubic-bezier(0.16, 1, 0.3, 1),
    border-color 0.42s ease,
    box-shadow 0.58s cubic-bezier(0.16, 1, 0.3, 1);
}

.wizard-stage {
  overflow: visible;
}

.wizard-stage.is-transitioning {
  overflow: hidden;
}

@keyframes editor-caret-pulse {
  0%, 100% { caret-color: rgba(11, 87, 227, 0.32); }
  50% { caret-color: rgba(11, 87, 227, 1); }
}

.wizard-final-grid input:focus,
.wizard-final-grid textarea:focus,
.wizard-final-grid input.has-value,
.wizard-final-grid textarea.has-value {
  background-position: 100% 0;
}

.wizard-final-grid input:focus,
.wizard-final-grid textarea:focus {
  border-color: rgba(11, 87, 227, 0.72);
  animation: editor-caret-pulse 1.05s ease-in-out infinite;
  box-shadow:
    0 0 0 3px rgba(11, 87, 227, 0.09),
    0 8px 22px rgba(14, 32, 62, 0.07);
}

.wizard-final-grid label > span {
  transition: color 0.36s ease;
}

.wizard-final-grid label:focus-within > span {
  color: var(--blue);
}

/* Kvittering efter en sendt forespørgsel. */
.booking-success {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 26px 10px 8px;
  text-align: center;
}

.booking-success::before,
.booking-success::after {
  position: absolute;
  z-index: -1;
  width: 230px;
  height: 230px;
  border: 1px solid rgba(11, 87, 227, 0.08);
  border-radius: 50%;
  content: "";
}

.booking-success::before {
  top: -155px;
  left: -95px;
}

.booking-success::after {
  right: -115px;
  bottom: -175px;
}

.success-mark {
  position: relative;
  width: 86px;
  height: 86px;
  margin: 0 auto 14px;
}

.booking-success .success-ring {
  position: absolute;
  inset: 0;
  border: 1px solid rgba(16, 173, 112, 0.2);
  border-radius: 50%;
  background: rgba(16, 173, 112, 0.07);
}

.booking-success .success-icon {
  position: absolute;
  inset: 11px;
  display: grid;
  width: auto;
  height: auto;
  margin: 0;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, #079b63, #19bd7c);
  box-shadow: 0 13px 30px rgba(7, 155, 99, 0.24);
  font-size: 30px;
}

.booking-success .kicker {
  justify-content: center;
  margin-bottom: 7px;
}

.booking-success h2 {
  margin: 0;
  font-size: 34px;
  letter-spacing: -1.5px;
}

.booking-success > p {
  max-width: 540px;
  margin: 12px auto 22px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
}

.success-steps {
  display: grid;
  max-width: 570px;
  grid-template-columns: repeat(3, 1fr);
  margin: 0 auto 23px;
  border: 1px solid #dce5f2;
  border-radius: 13px;
  background: rgba(248, 251, 255, 0.82);
}

.success-steps > span {
  position: relative;
  display: flex;
  min-height: 60px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #59677a;
  font-size: 12px;
}

.success-steps > span + span {
  border-left: 1px solid #dce5f2;
}

.success-steps i {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border-radius: 8px;
  color: var(--blue);
  background: #eaf1ff;
  font-size: 13px;
}

.success-steps .is-done {
  color: #08794f;
}

.success-steps .is-done i {
  color: #fff;
  background: linear-gradient(135deg, #079b63, #19bd7c);
}

.booking-success .success-close {
  min-width: 220px;
}

.booking-success > small {
  display: block;
  margin-top: 15px;
  color: var(--muted);
  font-size: 11px;
}

.booking-success:not([hidden]) .success-mark {
  animation: success-mark-in 0.72s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.booking-success:not([hidden]) .success-ring {
  animation: success-ring-in 0.9s 0.08s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.booking-success:not([hidden]) .success-icon {
  animation: success-icon-pop 0.68s 0.06s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.booking-success:not([hidden]) .kicker,
.booking-success:not([hidden]) h2,
.booking-success:not([hidden]) > p,
.booking-success:not([hidden]) .success-steps,
.booking-success:not([hidden]) .success-close,
.booking-success:not([hidden]) > small {
  animation: success-content-in 0.72s cubic-bezier(0.16, 1, 0.3, 1) backwards;
}

.booking-success:not([hidden]) .kicker { animation-delay: 0.12s; }
.booking-success:not([hidden]) h2 { animation-delay: 0.18s; }
.booking-success:not([hidden]) > p { animation-delay: 0.24s; }
.booking-success:not([hidden]) .success-steps { animation-delay: 0.31s; }
.booking-success:not([hidden]) .success-close { animation-delay: 0.39s; }
.booking-success:not([hidden]) > small { animation-delay: 0.46s; }

.booking-success:not([hidden]) .success-steps > span {
  animation: success-step-in 0.58s cubic-bezier(0.16, 1, 0.3, 1) backwards;
}

.booking-success:not([hidden]) .success-steps > span:nth-child(1) { animation-delay: 0.38s; }
.booking-success:not([hidden]) .success-steps > span:nth-child(2) { animation-delay: 0.46s; }
.booking-success:not([hidden]) .success-steps > span:nth-child(3) { animation-delay: 0.54s; }

/* Compact opening-hours overview */
.opening-panel {
  min-height: 168px;
  gap: 0;
  padding: 20px;
}

.opening-panel::after {
  background: linear-gradient(90deg, var(--navy) 0%, rgba(7, 26, 58, .96) 34%, rgba(7, 26, 58, .72) 52%, rgba(7, 26, 58, .38) 70%, rgba(7, 26, 58, .3) 82%);
}

.opening-panel img {
  opacity: .54;
  filter: saturate(.66) contrast(1.06) brightness(.82);
}

.opening-panel .opening-icon {
  display: none;
}

.opening-panel .opening-content-compact {
  display: flex;
  align-self: stretch;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  gap: 6px;
}

.opening-panel .opening-content-compact > span {
  color: #8db8ff;
  background: linear-gradient(90deg, #4f91ff 0%, #8db8ff 52%, #d5e4ff 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 15px;
  font-weight: 850;
  letter-spacing: .45px;
  line-height: 1;
  text-transform: uppercase;
  transform: translateY(-3px);
}

.opening-panel .opening-weekend {
  margin: 0;
  color: rgba(198, 213, 235, .72);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .15px;
  line-height: 1;
  text-align: left;
}

.opening-panel div.hours-compact {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}

.opening-panel .hours-compact > div {
  display: flex;
  position: relative;
  z-index: 0;
  align-items: flex-start;
  flex-direction: column;
  gap: 4px;
  isolation: isolate;
  min-width: 0;
  padding: 2px 13px;
}

.opening-panel .hours-compact > div:first-child {
  padding-left: 0;
}

.opening-panel .hours-compact > div + div {
  border-left: 1px solid rgba(157, 184, 220, .18);
}

.opening-panel .hours-compact > div.is-today {
  background: transparent;
}

.opening-panel .hours-compact > div.is-today::before {
  position: absolute;
  z-index: -1;
  inset: -5px 4px -5px -5px;
  border-radius: 9px;
  background: linear-gradient(90deg, rgba(47, 124, 255, .18), rgba(47, 124, 255, .07) 76%, transparent);
  animation: opening-active-in .55s cubic-bezier(.22, 1, .36, 1) both;
  content: '';
}

.opening-panel .hours-compact > div.is-today strong {
  color: #8eb5ff;
  font-weight: 800;
}

.opening-panel .hours-compact > div.is-today strong::after {
  margin-left: 4px;
  color: #b9d0ff;
  content: '• I dag';
  font-size: 7px;
  font-weight: 800;
  letter-spacing: .15px;
  text-transform: uppercase;
}

.opening-panel .hours-compact > div:first-child.is-today {
  background: transparent;
}

.opening-panel .hours-compact > div + div.is-today {
  background: transparent;
}

.opening-panel .hours-compact > div + div.is-today::before {
  inset: -5px -5px -5px 4px;
  background: linear-gradient(270deg, rgba(47, 124, 255, .3), rgba(47, 124, 255, .13) 76%, transparent);
}

.opening-panel .hours-compact strong {
  color: #c3d2e7;
  font-size: 11px;
  font-weight: 700;
}

.opening-panel .hours-compact b {
  color: #fff;
  font-size: 19px;
  letter-spacing: -.4px;
  line-height: 1.1;
  white-space: nowrap;
}

.opening-panel .hours-compact small {
  overflow: hidden;
  color: #c1d0e4;
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.opening-panel .opening-content-compact > .opening-status {
  box-sizing: border-box;
  width: 100%;
  justify-content: center;
  min-height: 25px;
  border-radius: 9px;
  transform: translateY(3px);
}

.opening-status.is-closed {
  animation: opening-closed-breathe 2.6s ease-in-out infinite;
}

.opening-status.is-closed::before {
  animation: opening-status-pulse 1.8s ease-out infinite;
}

@keyframes opening-closed-breathe {
  0%, 100% { border-color: rgba(239, 68, 68, .22); background: rgba(239, 68, 68, .1); box-shadow: 0 0 0 rgba(239, 68, 68, 0); }
  50% { border-color: rgba(248, 113, 113, .38); background: rgba(239, 68, 68, .15); box-shadow: 0 0 14px rgba(239, 68, 68, .12); }
}

@keyframes opening-status-pulse {
  0% { box-shadow: 0 0 0 0 rgba(252, 165, 165, .35); }
  70%, 100% { box-shadow: 0 0 0 5px rgba(252, 165, 165, 0); }
}

@keyframes opening-active-in {
  from { opacity: 0; transform: scale(.96); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes success-mark-in {
  from { opacity: 0; transform: translateY(10px) scale(0.78); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes success-ring-in {
  0% { opacity: 0; transform: scale(0.68); }
  68% { opacity: 1; transform: scale(1.08); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes success-icon-pop {
  0% { opacity: 0; transform: scale(0.55) rotate(-9deg); }
  72% { opacity: 1; transform: scale(1.06) rotate(2deg); }
  100% { opacity: 1; transform: scale(1) rotate(0); }
}

@keyframes success-content-in {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes success-step-in {
  from { opacity: 0; transform: translateX(-8px); }
  to { opacity: 1; transform: translateX(0); }
}

@media (max-width: 620px) {
  .booking-success {
    padding-inline: 0;
  }

  .booking-success h2 {
    font-size: 29px;
  }

  .success-steps {
    grid-template-columns: 1fr;
  }

  .success-steps > span {
    min-height: 48px;
  }

  .success-steps > span + span {
    border-top: 1px solid #dce5f2;
    border-left: 0;
  }

  .booking-success .success-close {
    width: 100%;
  }
}

.dashboard-grid {
  margin-top: 0;
  border-color: #d5dfec;
  box-shadow: 0 24px 64px rgba(14, 32, 62, 0.13);
}

.dashboard-band {
  position: relative;
  padding-top: 10px;
  background: linear-gradient(
    180deg,
    rgba(243, 246, 250, 0) 0,
    rgba(243, 246, 250, 0.28) 18px,
    rgba(243, 246, 250, 0.76) 37px,
    #f3f6fa 54px,
    #f3f6fa 100%
  );
}

.dashboard-band::before {
  content: none;
}

.hero-media,
.hero-shade {
  bottom: -54px;
}

.hero-shade::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 88px;
  background: linear-gradient(
    181deg,
    rgba(243, 246, 250, 0) 0%,
    rgba(243, 246, 250, 0) 25%,
    rgba(243, 246, 250, 0.12) 43%,
    rgba(243, 246, 250, 0.58) 76%,
    rgba(243, 246, 250, 0.9) 93%,
    #f3f6fa 100%
  );
  content: "";
  pointer-events: none;
}

.trust-panel {
  cursor: pointer;
  transition:
    transform 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    border-color 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    background-color 0.76s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.76s cubic-bezier(0.16, 1, 0.3, 1);
}

.trust-panel:hover,
.trust-panel:focus-visible {
  border-color: rgba(11, 87, 227, 0.38);
  background-color: #f5f8ff;
  box-shadow: 0 13px 27px rgba(14, 32, 62, 0.13);
  outline: none;
  transform: translateY(-1px);
}

.trust-panel-action {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid #dce7fb;
  border-radius: 50%;
  color: var(--blue);
  background-color: #f2f6ff;
}

.panel,
.service-detail-card,
.why-block,
.reviews-carousel,
.directions-card {
  border-color: #d5dfec;
}

.services-panel {
  box-shadow: 0 10px 28px rgba(14, 32, 62, 0.08);
}

.service-list > a {
  border-color: #d4dfed;
  background: linear-gradient(135deg, #ffffff 0%, #ffffff 68%, #f7faff 100%);
  box-shadow: 0 3px 9px rgba(14, 32, 62, 0.035);
}

.service-list > a:hover {
  border-color: rgba(11, 87, 227, 0.38);
  box-shadow: 0 9px 20px rgba(14, 32, 62, 0.09);
}

.button-ghost,
.button-light,
.button-white {
  border-color: #d7e2f1;
  background-color: #ffffff;
  background-image: linear-gradient(122deg, #ffffff 0%, #ffffff 52%, #f5f9ff 64%, #e7f0ff 100%);
  background-size: 220% 100%;
  background-position: 0% 50%;
  box-shadow: 0 7px 17px rgba(14, 32, 62, 0.09);
}

.button-ghost:hover,
.button-light:hover,
.button-white:hover {
  border-color: #c7d8ee;
  background-position: 100% 50%;
  box-shadow: 0 10px 22px rgba(14, 32, 62, 0.12);
}

.reviews-carousel-viewport {
  margin: -18px 0 -25px;
  padding: 18px 0 38px;
}

.review-slide {
  border-color: #d4dfed;
  background: linear-gradient(145deg, #fbfcfe 0%, #f7faff 100%);
  box-shadow: 0 8px 20px rgba(14, 32, 62, 0.075);
}

.review-slide:hover,
.review-slide:focus-visible {
  box-shadow: 0 13px 27px rgba(14, 32, 62, 0.13);
}

.service-detail-card::before {
  background:
    linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, 0.9) 11%, rgba(255, 255, 255, 0.34) 36%, rgba(255, 255, 255, 0.07) 61%, rgba(255, 255, 255, 0) 82%),
    linear-gradient(0deg, #ffffff 0%, rgba(255, 255, 255, 0.86) 11%, rgba(255, 255, 255, 0.3) 36%, rgba(255, 255, 255, 0) 64%),
    url("./assets/img/diagnostic.jpg") center calc(70% + 110px) / cover no-repeat;
  opacity: 0.95;
}

@media (max-width: 980px) {
  .service-detail-card::before {
    opacity: 0.7;
  }
}

@media (max-width: 720px) {
  .service-detail-card::before {
    opacity: 0.42;
  }

  .panel-heading > a {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    line-height: 1;
  }
}

/* Ét roligt hover-tempo på samtlige klikbare kontroller og kort. */
.button,
.panel-heading a,
.quick-field,
.quick-options > button,
.service-list > a,
.service-list > a > i,
.trust-panel,
.trust-panel-action,
.reviews-carousel-arrows button,
.review-slide,
.review-slide-link,
.work-card,
.contact-socials a,
.footer-nav a,
.footer-nav a i,
.footer-contact-row,
.footer-socials a,
.contact-card .address-link,
.modal-close,
.wizard-choice,
.wizard-choice-icon,
.wizard-back,
.menu-toggle {
  transition-duration: 0.76s;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

.service-list > a:hover,
.contact-socials a:hover,
.footer-socials a:hover,
.wizard-choice:hover {
  transform: translateY(-1px);
}

.trust-panel:hover .trust-panel-action,
.trust-panel:focus-visible .trust-panel-action,
.service-list > a:hover > i,
.reviews-carousel-arrows button:hover:not(:disabled),
.review-slide:hover .review-slide-link,
.review-slide:focus-visible .review-slide-link {
  transform: translateY(-1px);
}

.trust-panel:hover .trust-panel-action,
.trust-panel:focus-visible .trust-panel-action {
  color: #ffffff;
  border-color: var(--blue);
  box-shadow: 0 8px 18px rgba(11, 87, 227, 0.22);
}
/* Road racing and performance */
.motorsport-section {
  padding-top: 58px;
  padding-bottom: 58px;
  background: linear-gradient(180deg, #fff 0%, #f5f8fd 100%);
}

.motorsport-card {
  --motorsport-radius: 28px;
  position: relative;
  display: block;
  overflow: hidden;
  height: clamp(580px, 44vw, 630px);
  min-height: 580px;
  border: 0;
  border-radius: var(--motorsport-radius);
  color: #fff;
  background: linear-gradient(135deg, #06142e 0%, #082351 100%);
  background-clip: padding-box;
  box-shadow: 0 28px 70px rgba(7, 26, 58, .2);
  isolation: isolate;
  -webkit-mask-image: -webkit-radial-gradient(#fff, #000);
}

.motorsport-card::after {
  position: absolute;
  z-index: 6;
  inset: 0;
  border: 1px solid rgba(112, 163, 255, .16);
  border-radius: inherit;
  content: "";
  pointer-events: none;
}

.motorsport-media {
  position: relative;
  overflow: hidden;
  height: 100%;
  min-height: 100%;
  background: #050d1d;
}

.motorsport-media::after {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(0deg, #06142e 0%, rgba(6, 20, 46, .72) 18%, rgba(6, 20, 46, .14) 48%, transparent 68%),
    linear-gradient(90deg, rgba(6, 20, 46, .08), transparent 42%, rgba(6, 20, 46, .18));
  content: "";
  pointer-events: none;
}

.motorsport-media video {
  position: absolute;
  top: -128px;
  right: 0;
  bottom: auto;
  left: 0;
  display: block;
  width: 100%;
  height: calc(100% + 128px);
  object-fit: cover;
  object-position: 50% 50%;
  filter: saturate(.88) contrast(1.08);
}

.motorsport-media-label {
  position: absolute;
  z-index: 1;
  top: 24px;
  bottom: auto;
  left: 26px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 13px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 10px;
  color: #e9f1ff;
  background: rgba(6, 20, 46, .66);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .22);
  backdrop-filter: blur(10px);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .15px;
}

.motorsport-media-label i { color: #69a2ff; }

.motorsport-copy {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
  align-items: center;
  gap: 52px;
  margin-top: 0;
  padding: 100px 48px 34px;
  background: linear-gradient(0deg, rgba(6, 20, 46, .99) 0%, rgba(7, 31, 72, .95) 66%, rgba(6, 20, 46, 0) 100%);
}

.motorsport-copy::after {
  position: absolute;
  right: -90px;
  bottom: -120px;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(100, 157, 255, .13);
  border-radius: 50%;
  content: "";
  box-shadow: 0 0 0 55px rgba(100, 157, 255, .035);
  pointer-events: none;
}

.motorsport-copy > * { position: relative; z-index: 1; }
.motorsport-intro,
.motorsport-details { min-width: 0; }
.motorsport-copy .kicker { color: #78aaff; }

.motorsport-copy h2 {
  margin: 10px 0 18px;
  font-size: clamp(36px, 3.6vw, 52px);
  letter-spacing: -2.4px;
  line-height: .98;
}

.motorsport-copy h2 em { color: #7eacff; font-style: normal; }

.motorsport-lead {
  max-width: 590px;
  margin: 0;
  color: #c3d0e3;
  font-size: 15px;
  line-height: 1.7;
}

.motorsport-services {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 0 0 22px;
}

.motorsport-services > div {
  position: relative;
  isolation: isolate;
  display: grid;
  min-width: 0;
  grid-template-columns: 36px 1fr;
  align-items: center;
  gap: 11px;
  overflow: hidden;
  padding: 12px 13px;
  border: 1px solid rgba(151, 184, 231, .18);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .075), rgba(47, 124, 255, .055));
}

.motorsport-services > div::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(135deg, rgba(255, 255, 255, .055), rgba(47, 124, 255, .12));
  content: "";
  opacity: 0;
}

.motorsport-services > div > i {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  color: #fff;
  border: 1px solid rgba(155, 192, 255, .2) !important;
  border-radius: 50% !important;
  background: linear-gradient(145deg, rgba(53, 126, 246, .5), rgba(29, 74, 151, .38)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .13), 0 5px 14px rgba(0, 18, 52, .2) !important;
  font-size: 17px;
  filter: none;
  transform: none;
  transition: none;
}

.motorsport-services > div:hover { border-color: rgba(151, 184, 231, .18); box-shadow: none; }
.motorsport-services > div:hover::before { opacity: 0; }
.motorsport-services > div:hover > i { filter: none; transform: none; }

.motorsport-services span { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.motorsport-services strong { font-size: 12px; }
.motorsport-services small { overflow: hidden; color: #9fb0c8; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }

.motorsport-actions { display: flex; align-items: center; gap: 18px; }
.motorsport-read-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 2px;
  color: #b9c9df;
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
  transition: color .42s ease;
}
.motorsport-read-more i { color: #72a8ff; transition: transform .42s cubic-bezier(.22, 1, .36, 1); }
.motorsport-read-more:hover { color: #fff; }
.motorsport-read-more:hover i { transform: translateX(3px); }
.motorsport-actions .button-primary {
  overflow: hidden;
  border-color: rgba(133, 176, 255, .22);
  background-clip: border-box;
}
.motorsport-actions .button-primary:focus { outline: none; }
.motorsport-actions .button-primary:focus-visible {
  box-shadow: 0 0 0 3px rgba(77, 142, 255, .24), 0 12px 25px rgba(11, 87, 227, .24);
}

@media (max-width: 980px) {
  .motorsport-card { height: auto; min-height: 0; }
  .motorsport-media { height: 390px; min-height: 0; }
  .motorsport-media video { top: -32px; height: calc(100% + 32px); }
  .motorsport-media-label { top: auto; bottom: 22px; }
  .motorsport-copy { position: relative; inset: auto; grid-template-columns: 1fr; gap: 30px; margin-top: -1px; padding: 40px; background: linear-gradient(135deg, #06142e 0%, #082351 100%); }
}

@media (max-width: 620px) {
  .motorsport-section { padding-top: 56px; padding-bottom: 56px; }
  .motorsport-card { --motorsport-radius: 20px; }
  .motorsport-media { height: 300px; min-height: 0; }
  .motorsport-media video { top: 0; height: 100%; }
  .motorsport-media-label { right: 18px; bottom: 18px; left: 18px; justify-content: center; }
  .motorsport-copy { padding: 32px 22px 28px; }
  .motorsport-copy h2 { font-size: 38px; letter-spacing: -1.8px; }
  .motorsport-services { grid-template-columns: 1fr; }
  .motorsport-actions { align-items: stretch; flex-direction: column; }
  .motorsport-actions .button { width: 100%; }
  .motorsport-read-more { justify-content: center; }
}
