:root {
  --navy: #031426;
  --navy-2: #061c32;
  --navy-3: #0a2947;

  --gold: #e9b44c;
  --gold-light: #f8d58a;

  --cream: #f3efe7;

  --white: #ffffff;
  --muted: #aab8c7;

  --shell: 1480px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;

  background: var(--navy);

  color: var(--white);

  font-family:
    Inter,
    Arial,
    Helvetica,
    sans-serif;

  -webkit-font-smoothing: antialiased;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

.shell {
  width:
    min(
      calc(100% - 48px),
      var(--shell)
    );

  margin-inline: auto;
}


/* HEADER */

.site-header {
  position: absolute;

  inset:
    0
    0
    auto;

  z-index: 40;
}

.header-inner {
  min-height: 100px;

  display: grid;

  grid-template-columns:
    310px
    1fr
    auto;

  align-items: center;

  gap: 35px;
}

.brand {
  display: flex;
  align-items: center;

  gap: 15px;
}

.brand img {
  width: 58px;
  height: 58px;

  object-fit: contain;
}

.brand strong {
  display: block;

  font-family:
    Georgia,
    serif;

  font-size: 27px;
  font-weight: 500;

  letter-spacing: .13em;
}

.brand span {
  display: block;

  margin-top: 5px;

  color: var(--gold);

  font-size: 12px;

  letter-spacing: .35em;
}

.desktop-nav {
  display: flex;
  justify-content: center;

  gap: 43px;
}

.desktop-nav a {
  position: relative;

  font-size: 14px;

  color:
    rgba(
      255,
      255,
      255,
      .9
    );
}

.desktop-nav a.active::after {
  content: "";

  position: absolute;

  left: 0;
  right: 0;
  bottom: -16px;

  width: 32px;
  height: 3px;

  margin: auto;

  border-radius: 3px;

  background: var(--gold);
}

.header-actions {
  display: flex;
  align-items: center;

  gap: 14px;
}

.login,
.meeting {
  min-height: 48px;

  padding:
    0
    23px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 999px;
}

.login {
  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .3
    );

  font-size: 13px;
}

.meeting {
  gap: 14px;

  border:
    1px solid
    var(--gold);

  color: var(--gold-light);

  font-family:
    Georgia,
    serif;
}

.menu-button,
.mobile-nav {
  display: none;
}


/* EXACT DESKTOP HERO REFERENCE */

.desktop-hero {
  position: relative;

  width: 100%;

  overflow: hidden;

  background: var(--navy);
}

.desktop-hero-image {
  width: 100%;

  height: auto;

  display: block;
}

.hero-hotspots {
  position: absolute;

  inset: 0;

  z-index: 10;

  pointer-events: none;
}

.hotspot {
  position: absolute;

  display: block;

  pointer-events: auto;

  border-radius: 999px;
}

.hotspot-meeting {
  left: 5.8%;
  top: 57%;

  width: 22.5%;
  height: 7%;
}

.hotspot-services {
  left: 29.2%;
  top: 57%;

  width: 14.5%;
  height: 7%;
}

.hotspot-top-meeting {
  right: 5.4%;
  top: 3.2%;

  width: 12.8%;
  height: 6.4%;
}


/* MOBILE HERO */

.mobile-hero {
  display: none;
}


/* SERVICES */

.services {
  padding:
    105px
    0
    120px;

  background: var(--cream);

  color: #071b31;
}

.section-label {
  margin-bottom: 20px;

  color: #9b6b24;

  font-size: 11px;
  font-weight: 700;

  letter-spacing: .25em;
}

.section-heading {
  max-width: 950px;

  margin-bottom: 65px;
}

.section-heading h2,
.about h2 {
  margin:
    0
    0
    18px;

  font-family:
    Georgia,
    serif;

  font-size:
    clamp(
      45px,
      4vw,
      68px
    );

  font-weight: 500;

  line-height: 1.04;
}

.section-heading p {
  max-width: 700px;

  margin: 0;

  color: #46576a;

  font-size: 18px;

  line-height: 1.65;
}

.service-grid {
  display: grid;

  grid-template-columns:
    repeat(
      5,
      minmax(
        0,
        1fr
      )
    );

  gap: 22px;
}

.service-grid article {
  min-height: 255px;

  padding:
    30px
    27px;

  border:
    1px solid
    rgba(
      9,
      35,
      58,
      .12
    );

  border-radius: 20px;

  background: #fff;

  box-shadow:
    0 14px 32px
    rgba(
      20,
      40,
      60,
      .055
    );
}

.service-number {
  color: #b17b27;

  font-size: 12px;
  font-weight: 700;

  letter-spacing: .12em;
}

.service-grid h3 {
  margin:
    40px
    0
    13px;

  font-family:
    Georgia,
    serif;

  font-size: 23px;
}

.service-grid p {
  margin: 0;

  color: #5a6877;

  line-height: 1.65;
}


/* ABOUT */

.about {
  padding:
    115px
    0;

  background:
    linear-gradient(
      120deg,
      #041729,
      #08233b
    );
}

.about-grid {
  display: grid;

  grid-template-columns:
    1fr
    .8fr;

  gap: 100px;
}

.about h2 {
  color: white;
}

.about-copy {
  padding-top: 42px;
}

.about-copy p {
  margin:
    0
    0
    22px;

  color: #bdc9d5;

  font-size: 18px;
  line-height: 1.7;
}

.system-link {
  margin-top: 20px;

  display: inline-flex;

  gap: 15px;

  color: var(--gold-light);

  font-weight: 700;
}


/* FOOTER */

.footer {
  padding:
    70px
    0
    25px;

  background: #020e1a;
}

.footer-grid {
  display: grid;

  grid-template-columns:
    1.5fr
    1fr
    1fr
    1fr;

  gap: 60px;
}

.footer-logo {
  display: flex;
  align-items: center;

  gap: 14px;
}

.footer-logo img {
  width: 48px;
}

.footer-logo strong {
  display: block;

  font-family:
    Georgia,
    serif;

  font-size: 23px;

  letter-spacing: .12em;
}

.footer-logo span {
  display: block;

  margin-top: 4px;

  color: var(--gold);

  letter-spacing: .30em;
}

.footer-brand p {
  max-width: 380px;

  color: #91a3b7;

  line-height: 1.65;
}

.footer h3 {
  margin:
    0
    0
    18px;

  color: var(--gold-light);

  font-family:
    Georgia,
    serif;
}

.footer-grid > div:not(.footer-brand) {
  display: flex;
  flex-direction: column;

  gap: 11px;
}

.footer-grid a,
.footer-grid span {
  color: #a6b5c6;

  font-size: 14px;
}

.footer-grid a:hover {
  color: white;
}

.footer-bottom {
  margin-top: 55px;

  padding-top: 22px;

  display: flex;
  justify-content: space-between;

  border-top:
    1px solid
    rgba(
      255,
      255,
      255,
      .08
    );

  color: #718296;

  font-size: 12px;
}


/* RESPONSIVE */

@media (
  max-width: 980px
) {

  .site-header {
    position: relative;

    background: var(--navy);
  }

  .header-inner {
    min-height: 86px;

    grid-template-columns:
      1fr
      auto;
  }

  .desktop-nav,
  .login,
  .meeting {
    display: none;
  }

  .menu-button {
    width: 46px;
    height: 46px;

    display: block;

    border:
      1px solid
      rgba(
        255,
        255,
        255,
        .23
      );

    border-radius: 13px;

    background: transparent;

    color: white;

    font-size: 20px;
  }

  .mobile-nav {
    position: absolute;

    z-index: 80;

    top: 80px;
    left: 18px;
    right: 18px;

    padding: 19px;

    flex-direction: column;

    border-radius: 18px;

    background: #08233b;

    box-shadow:
      0 22px 50px
      rgba(
        0,
        0,
        0,
        .38
      );
  }

  .mobile-nav.open {
    display: flex;
  }

  .mobile-nav a {
    padding: 13px;

    border-bottom:
      1px solid
      rgba(
        255,
        255,
        255,
        .08
      );
  }

  .mobile-system {
    margin-top: 8px;

    border:
      1px solid
      var(--gold) !important;

    border-radius: 12px;

    color: var(--gold-light) !important;

    text-align: center;
  }

  .desktop-hero {
    display: none;
  }

  .mobile-hero {
    display: block;

    background:
      linear-gradient(
        180deg,
        #031426,
        #061c31
      );
  }

  .mobile-hero-image-wrap {
    position: relative;

    height: 390px;

    overflow: hidden;
  }

  .mobile-hero-image-wrap img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position: 69% center;
  }

  .mobile-hero-image-wrap::after {
    content: "";

    position: absolute;

    inset: 0;

    background:
      linear-gradient(
        0deg,
        #031426 0%,
        transparent 55%
      );
  }

  .mobile-copy {
    padding:
      12px
      0
      65px;
  }

  .eyebrow {
    margin-bottom: 19px;

    color: var(--gold);

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .17em;
  }

  .mobile-copy h1 {
    margin:
      0
      0
      22px;

    font-family:
      Georgia,
      serif;

    font-size:
      clamp(
        45px,
        11vw,
        64px
      );

    font-weight: 500;

    line-height: .98;
  }

  .mobile-copy h1 span {
    display: block;

    margin-top: 7px;

    color: var(--gold-light);
  }

  .mobile-copy p {
    max-width: 680px;

    margin:
      0
      0
      28px;

    color: #c0ccd7;

    font-size: 16px;
    line-height: 1.65;
  }

  .mobile-actions {
    display: grid;

    gap: 13px;
  }

  .primary-button,
  .secondary-button {
    min-height: 57px;

    padding:
      0
      23px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-radius: 999px;

    font-family:
      Georgia,
      serif;

    font-weight: 600;
  }

  .primary-button {
    color: #071727;

    background:
      linear-gradient(
        135deg,
        #ffdc91,
        #eaae42
      );
  }

  .secondary-button {
    border:
      1px solid
      var(--gold);

    color: white;
  }

  .service-grid {
    grid-template-columns:
      1fr
      1fr;
  }

  .about-grid {
    grid-template-columns: 1fr;

    gap: 20px;
  }

  .about-copy {
    padding-top: 0;
  }

  .footer-grid {
    grid-template-columns:
      1fr
      1fr;
  }
}


@media (
  max-width: 620px
) {

  .shell {
    width:
      calc(
        100% - 30px
      );
  }

  .brand img {
    width: 45px;
    height: 45px;
  }

  .brand strong {
    font-size: 19px;
  }

  .brand span {
    font-size: 9px;
  }

  .mobile-hero-image-wrap {
    height: 335px;
  }

  .service-grid {
    grid-template-columns: 1fr;
  }

  .service-grid article {
    min-height: auto;
  }

  .footer-grid {
    grid-template-columns: 1fr;

    gap: 35px;
  }

  .footer-bottom {
    flex-direction: column;

    gap: 8px;
  }
}

/* ============================================================
   PUBLIC HOME V3.1 - EXACT DESKTOP REFERENCE MODE
   ============================================================ */

/*
   Desktop reference image already contains:
   - SWESUND logo
   - navigation
   - login
   - meeting CTA

   Therefore the live HTML header must not render over it.
*/

@media (min-width: 981px) {

  .site-header {
    display: none;
  }

  .desktop-hero {
    margin: 0;
    padding: 0;
  }

  .desktop-hero-image {
    width: 100%;
    height: auto;
    object-fit: contain;
  }

}


/* ============================================================
   DESKTOP CLICKABLE HOTSPOTS
   Percentages correspond to the approved hero artwork.
   ============================================================ */

.hotspot-home {
  left: 31.5%;
  top: 2.7%;
  width: 4.5%;
  height: 6%;
}

.hotspot-nav-services {
  left: 36.7%;
  top: 2.7%;
  width: 6%;
  height: 6%;
}

.hotspot-nav-about {
  left: 43.2%;
  top: 2.7%;
  width: 5%;
  height: 6%;
}

.hotspot-nav-ai {
  left: 48.8%;
  top: 2.7%;
  width: 10.2%;
  height: 6%;
}

.hotspot-nav-case {
  left: 59.5%;
  top: 2.7%;
  width: 6.8%;
  height: 6%;
}

.hotspot-nav-contact {
  left: 66.7%;
  top: 2.7%;
  width: 6.5%;
  height: 6%;
}

.hotspot-login {
  right: 18.4%;
  top: 2.3%;
  width: 7%;
  height: 6.2%;
}

.hotspot-top-meeting {
  right: 4.5%;
  top: 2.3%;
  width: 12.5%;
  height: 6.2%;
}


/* Existing hero CTAs */

.hotspot-meeting {
  left: 5.3%;
  top: 57.5%;
  width: 22.5%;
  height: 7.5%;
}

.hotspot-services {
  left: 28.9%;
  top: 57.5%;
  width: 14.5%;
  height: 7.5%;
}


/* Optional visual debug:
   uncomment temporarily if hotspot locations need inspection.

.hotspot {
  background: rgba(255,0,0,.15);
  outline: 1px solid rgba(255,0,0,.7);
}
*/


/* ============================================================
   PUBLIC HOME V3.2 - MOBILE HERO FIX
   Desktop artwork contains text/navigation already.
   On mobile we crop the artwork to show portrait only.
   ============================================================ */

@media (max-width: 980px) {

  .mobile-hero {
    position: relative;

    overflow: hidden;

    background:
      linear-gradient(
        180deg,
        #031426 0%,
        #04192d 100%
      );
  }

  .mobile-hero-image-wrap {
    position: relative;

    width: 100%;
    height: 390px;

    overflow: hidden;

    background: #031426;
  }

  .mobile-hero-image-wrap img {
    position: absolute;

    top: 0;
    right: -2%;

    width: 168%;
    max-width: none;

    height: 100%;

    object-fit: cover;
    object-position: 87% center;
  }

  .mobile-hero-image-wrap::before {
    content: "";

    position: absolute;

    z-index: 2;

    inset: 0;

    background:
      linear-gradient(
        90deg,
        #031426 0%,
        rgba(3,20,38,.55) 18%,
        rgba(3,20,38,.05) 48%,
        transparent 72%
      );
  }

  .mobile-hero-image-wrap::after {
    content: "";

    position: absolute;

    z-index: 3;

    inset: 0;

    background:
      linear-gradient(
        0deg,
        #031426 0%,
        rgba(3,20,38,.68) 16%,
        rgba(3,20,38,.12) 48%,
        transparent 72%
      );
  }

  .mobile-copy {
    position: relative;

    z-index: 5;

    margin-top: -24px;

    padding:
      0
      0
      66px;
  }

  .mobile-copy .eyebrow {
    margin-bottom: 18px;

    color: #e9b44c;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .17em;

    line-height: 1.6;
  }

  .mobile-copy h1 {
    max-width: 760px;

    margin:
      0
      0
      24px;

    font-family:
      Georgia,
      "Times New Roman",
      serif;

    font-size:
      clamp(
        48px,
        10vw,
        67px
      );

    font-weight: 500;

    line-height: .99;

    letter-spacing: -.025em;
  }

  .mobile-copy h1 span {
    display: block;

    margin-top: 7px;

    color: #f8d58a;
  }

  .mobile-copy p {
    max-width: 720px;

    margin:
      0
      0
      30px;

    color:
      rgba(
        255,
        255,
        255,
        .87
      );

    font-size: 16px;

    line-height: 1.65;
  }

  .mobile-actions {
    display: grid;

    grid-template-columns:
      1fr
      1fr;

    gap: 13px;
  }

  .primary-button,
  .secondary-button {
    min-height: 58px;

    padding:
      0
      24px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-radius: 999px;

    font-family:
      Georgia,
      serif;

    font-size: 15px;

    font-weight: 600;
  }

}


/* ============================================================
   SMALL MOBILE
   ============================================================ */

@media (max-width: 620px) {

  .mobile-hero-image-wrap {
    height: 320px;
  }

  .mobile-hero-image-wrap img {
    right: -25%;

    width: 205%;

    object-position: 88% center;
  }

  .mobile-copy {
    margin-top: -8px;

    padding-bottom: 55px;
  }

  .mobile-copy h1 {
    font-size:
      clamp(
        43px,
        13vw,
        58px
      );
  }

  .mobile-actions {
    grid-template-columns: 1fr;
  }

}


/* ============================================================
   PUBLIC HOME V3.3
   MOBILE PORTRAIT CROP FINAL
   ============================================================ */

@media (max-width: 980px) {

  .mobile-hero-image-wrap {
    height: 385px;

    background: #031426;
  }

  .mobile-hero-image-wrap img {
    position: absolute;

    top: 0;
    right: 0;

    width: 178%;
    max-width: none;

    height: 100%;

    object-fit: cover;

    /*
      Show the portrait/right side of the approved desktop artwork.
      This prevents baked-in desktop headline/CTA from appearing.
    */
    object-position: right center;
  }

  .mobile-hero-image-wrap::before {
    content: "";

    position: absolute;

    z-index: 2;

    inset: 0;

    background:
      linear-gradient(
        90deg,
        #031426 0%,
        #031426 12%,
        rgba(3,20,38,.92) 24%,
        rgba(3,20,38,.55) 38%,
        rgba(3,20,38,.10) 58%,
        transparent 78%
      );

    pointer-events: none;
  }

  .mobile-hero-image-wrap::after {
    content: "";

    position: absolute;

    z-index: 3;

    inset: 0;

    background:
      linear-gradient(
        0deg,
        #031426 0%,
        rgba(3,20,38,.80) 10%,
        rgba(3,20,38,.30) 25%,
        transparent 48%
      );

    pointer-events: none;
  }

  .mobile-copy {
    margin-top: -12px;
  }

}


/* Real phone */

@media (max-width: 620px) {

  .mobile-hero-image-wrap {
    height: 330px;
  }

  .mobile-hero-image-wrap img {
    right: 0;

    width: 188%;

    object-position: right center;
  }

  .mobile-hero-image-wrap::before {
    background:
      linear-gradient(
        90deg,
        #031426 0%,
        rgba(3,20,38,.96) 17%,
        rgba(3,20,38,.63) 34%,
        rgba(3,20,38,.12) 59%,
        transparent 79%
      );
  }

  .mobile-copy {
    margin-top: -4px;
  }

}


/* ============================================================
   PUBLIC HOME V3.4 - MOBILE FINAL POLISH
   ============================================================ */

@media (max-width: 980px) {

  .mobile-hero-image-wrap {
    height: 360px;
  }

  .mobile-hero-image-wrap img {
    right: -5%;

    width: 164%;

    object-position: 84% center;
  }

  .mobile-copy {
    margin-top: -6px;

    padding-bottom: 62px;
  }

  .mobile-copy .eyebrow {
    margin-bottom: 16px;

    font-size: 9px;

    letter-spacing: .16em;
  }

  .mobile-copy h1 {
    max-width: 760px;

    margin-bottom: 22px;

    font-size:
      clamp(
        45px,
        8.4vw,
        62px
      );

    line-height: 1.01;
  }

  .mobile-copy p {
    max-width: 690px;

    margin-bottom: 28px;

    font-size: 15px;

    line-height: 1.6;
  }

  .mobile-actions {
    gap: 12px;
  }

  .primary-button,
  .secondary-button {
    min-height: 56px;

    padding-inline: 22px;

    font-size: 15px;
  }

}


/* Normal phone */

@media (max-width: 700px) {

  .mobile-hero-image-wrap {
    height: 330px;
  }

  .mobile-hero-image-wrap img {
    right: -8%;

    width: 176%;

    object-position: 86% center;
  }

  .mobile-copy h1 {
    font-size:
      clamp(
        43px,
        10vw,
        57px
      );
  }

}


/* Narrow phone */

@media (max-width: 520px) {

  .mobile-hero-image-wrap {
    height: 300px;
  }

  .mobile-hero-image-wrap img {
    right: -14%;

    width: 190%;

    object-position: 87% center;
  }

  .mobile-copy {
    padding-bottom: 50px;
  }

  .mobile-copy h1 {
    font-size:
      clamp(
        41px,
        12vw,
        53px
      );
  }

  .mobile-actions {
    grid-template-columns: 1fr;
  }

}


/* ============================================================
   PUBLIC HOME V3.5 - MOBILE GHOST TEXT CLEANUP
   ============================================================ */

@media (max-width: 980px) {

  .mobile-hero-image-wrap::before {
    background:
      linear-gradient(
        90deg,
        #031426 0%,
        #031426 18%,
        rgba(3,20,38,.98) 28%,
        rgba(3,20,38,.77) 40%,
        rgba(3,20,38,.28) 56%,
        rgba(3,20,38,.05) 70%,
        transparent 82%
      );
  }

}

@media (max-width: 620px) {

  .mobile-hero-image-wrap::before {
    background:
      linear-gradient(
        90deg,
        #031426 0%,
        #031426 22%,
        rgba(3,20,38,.98) 31%,
        rgba(3,20,38,.72) 43%,
        rgba(3,20,38,.22) 58%,
        transparent 78%
      );
  }

}


/* ============================================================
   PUBLIC HOME V3.6
   DEDICATED MOBILE HERO IMAGE
   ============================================================ */

@media (max-width: 980px) {

  .mobile-hero-image-wrap {
    position: relative;

    height: 420px;

    overflow: hidden;

    background: #031426;
  }

  .mobile-hero-image-wrap img {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    max-width: none;

    object-fit: cover;

    object-position:
      center
      32%;
  }

  .mobile-hero-image-wrap::before {
    content: "";

    position: absolute;

    z-index: 2;

    inset: 0;

    background:
      linear-gradient(
        90deg,
        rgba(3,20,38,.30) 0%,
        rgba(3,20,38,.10) 35%,
        transparent 65%
      );

    pointer-events: none;
  }

  .mobile-hero-image-wrap::after {
    content: "";

    position: absolute;

    z-index: 3;

    inset: 0;

    background:
      linear-gradient(
        0deg,
        #031426 0%,
        rgba(3,20,38,.85) 8%,
        rgba(3,20,38,.34) 22%,
        transparent 48%
      );

    pointer-events: none;
  }

  .mobile-copy {
    margin-top: -8px;

    padding-bottom: 62px;
  }

}


/* Normal phone */

@media (max-width: 700px) {

  .mobile-hero-image-wrap {
    height: 370px;
  }

  .mobile-hero-image-wrap img {
    object-position:
      center
      30%;
  }

}


/* Narrow phone */

@media (max-width: 520px) {

  .mobile-hero-image-wrap {
    height: 335px;
  }

  .mobile-hero-image-wrap img {
    object-position:
      center
      28%;
  }

}


/* ============================================================
   SWESUND EKONOMI - PUBLIC HOME V4
   ============================================================ */

.section-kicker {
  margin-bottom: 20px;

  color: #a97426;

  font-size: 11px;
  font-weight: 800;

  letter-spacing: .24em;
}

.section-kicker-gold {
  color: #efbd58;
}

.v4-heading-grid {
  display: grid;

  grid-template-columns:
    minmax(0, 1.05fr)
    minmax(340px, .75fr);

  align-items: end;

  gap: 90px;

  margin-bottom: 60px;
}

.v4-heading-grid h2,
.process-section h2,
.system-showcase h2,
.ai-section h2,
.industries-section h2,
.why-section h2,
.faq-section h2,
.final-cta h2 {
  margin: 0;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size:
    clamp(
      44px,
      4vw,
      66px
    );

  font-weight: 500;

  line-height: 1.04;

  letter-spacing: -.025em;
}

.v4-heading-grid p {
  margin: 0;

  color: #4b5b6d;

  font-size: 17px;

  line-height: 1.7;
}


/* SERVICES */

.services-v4 {
  padding:
    115px
    0
    125px;
}

.v4-service-grid {
  display: grid;

  grid-template-columns:
    repeat(
      4,
      minmax(
        0,
        1fr
      )
    );

  gap: 20px;
}

.v4-service-card {
  position: relative;

  min-height: 285px;

  padding:
    30px
    28px;

  display: flex;
  flex-direction: column;

  border:
    1px solid
    rgba(
      8,
      35,
      59,
      .11
    );

  border-radius: 20px;

  background: white;

  box-shadow:
    0
    15px
    40px
    rgba(
      10,
      30,
      50,
      .05
    );
}

.v4-service-card-featured {
  color: white;

  border-color:
    rgba(
      239,
      189,
      88,
      .27
    );

  background:
    linear-gradient(
      140deg,
      #082640,
      #031728
    );
}

.v4-number {
  color: #a97528;

  font-size: 11px;
  font-weight: 800;

  letter-spacing: .14em;
}

.v4-service-card-featured .v4-number {
  color: #efbd58;
}

.v4-service-card h3 {
  margin:
    40px
    0
    14px;

  font-family:
    Georgia,
    serif;

  font-size: 25px;

  font-weight: 500;
}

.v4-service-card p {
  margin: 0;

  color: #607081;

  font-size: 14px;

  line-height: 1.7;
}

.v4-service-card-featured p {
  color: #becbd7;
}

.v4-card-link {
  margin-top: auto;

  padding-top: 26px;

  color: #9b6923;

  font-size: 12px;

  font-weight: 700;
}

.v4-service-card-featured .v4-card-link {
  color: #f2c56c;
}


/* PROCESS */

.process-section {
  padding:
    115px
    0;

  color: #071b31;

  background: #fff;
}

.process-section .v4-heading-grid {
  align-items: start;
}

.process-grid {
  display: grid;

  grid-template-columns:
    repeat(
      3,
      1fr
    );

  gap: 1px;

  overflow: hidden;

  border:
    1px solid
    #e1e5e8;

  border-radius: 22px;

  background: #e1e5e8;
}

.process-grid article {
  min-height: 310px;

  padding:
    38px;

  background: #f9f8f4;
}

.process-grid article > span {
  color: #a9772b;

  font-size: 12px;

  font-weight: 800;
}

.process-grid h3 {
  margin:
    65px
    0
    15px;

  font-family:
    Georgia,
    serif;

  font-size: 30px;

  font-weight: 500;

  line-height: 1.1;
}

.process-grid p {
  margin: 0;

  max-width: 330px;

  color: #667486;

  line-height: 1.65;
}


/* SYSTEM SHOWCASE */

.system-showcase {
  padding:
    125px
    0;

  overflow: hidden;

  background:
    radial-gradient(
      circle at 80% 30%,
      rgba(
        45,
        118,
        196,
        .16
      ),
      transparent 28%
    ),
    linear-gradient(
      120deg,
      #031426,
      #07243d
    );
}

.system-showcase-grid {
  display: grid;

  grid-template-columns:
    .78fr
    1.22fr;

  gap: 85px;

  align-items: center;
}

.system-copy h2 {
  color: white;
}

.system-copy > p {
  max-width: 600px;

  color: #bdc9d6;

  font-size: 17px;

  line-height: 1.75;
}

.system-feature-list {
  margin:
    35px
    0;

  display: grid;

  gap: 13px;
}

.system-feature-list span {
  position: relative;

  padding-left: 27px;

  color: #d5dee7;

  font-size: 14px;
}

.system-feature-list span::before {
  content: "✓";

  position: absolute;

  left: 0;

  color: #efbd58;

  font-weight: 800;
}

.v4-gold-button,
.v4-outline-button {
  min-height: 58px;

  padding:
    0
    27px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 22px;

  border-radius: 999px;

  font-family:
    Georgia,
    serif;

  font-weight: 700;
}

.v4-gold-button {
  color: #061726;

  background:
    linear-gradient(
      135deg,
      #ffdc91,
      #e9ad41
    );
}

.v4-outline-button {
  border:
    1px solid
    #dca644;

  color: white;
}

.system-window {
  overflow: hidden;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .14
    );

  border-radius: 24px;

  background: #eef3f7;

  box-shadow:
    0
    38px
    90px
    rgba(
      0,
      0,
      0,
      .38
    );
}

.system-window-top {
  height: 54px;

  padding:
    0
    22px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  background: #09223a;

  color: #dce6ef;

  font-size: 10px;

  letter-spacing: .19em;
}

.system-dots {
  display: flex;
  gap: 7px;
}

.system-dots i {
  width: 8px;
  height: 8px;

  border-radius: 50%;

  background: #58748e;
}

.system-dots i:first-child {
  background: #e1aa45;
}

.system-window-body {
  min-height: 465px;

  display: grid;

  grid-template-columns:
    155px
    1fr;
}

.system-demo-nav {
  padding:
    25px
    19px;

  display: flex;
  flex-direction: column;

  gap: 13px;

  background: #061b30;

  color: #aebdca;
}

.system-demo-nav strong {
  width: 38px;
  height: 38px;

  margin-bottom: 17px;

  display: grid;
  place-items: center;

  border-radius: 10px;

  background:
    linear-gradient(
      135deg,
      #2f8fff,
      #0d4f9c
    );

  color: white;

  font-family:
    Georgia,
    serif;

  font-size: 20px;
}

.system-demo-nav span {
  padding:
    9px
    10px;

  border-radius: 9px;

  font-size: 11px;
}

.system-demo-nav span:first-of-type {
  color: white;

  background:
    rgba(
      255,
      255,
      255,
      .07
    );
}

.system-demo-main {
  padding: 31px;

  color: #092039;
}

.system-demo-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.system-demo-head small {
  color: #8796a5;

  font-size: 9px;

  letter-spacing: .18em;
}

.system-demo-head h3 {
  margin:
    7px
    0
    0;

  font-family:
    Georgia,
    serif;

  font-size: 24px;

  font-weight: 500;
}

.system-demo-period {
  padding:
    9px
    13px;

  border:
    1px solid
    #d7dfe6;

  border-radius: 9px;

  color: #617183;

  font-size: 10px;
}

.system-demo-kpis {
  margin-top: 27px;

  display: grid;

  grid-template-columns:
    repeat(
      3,
      1fr
    );

  gap: 12px;
}

.system-demo-kpis > div {
  padding:
    17px;

  border:
    1px solid
    #dde5eb;

  border-radius: 13px;

  background: white;
}

.system-demo-kpis span,
.system-demo-kpis strong {
  display: block;
}

.system-demo-kpis span {
  color: #758494;

  font-size: 9px;
}

.system-demo-kpis strong {
  margin-top: 8px;

  font-size: 19px;
}

.system-demo-chart {
  position: relative;

  height: 155px;

  margin-top: 17px;

  overflow: hidden;

  border:
    1px solid
    #dde5eb;

  border-radius: 14px;

  background: white;
}

.chart-bars {
  position: absolute;

  left: 30px;
  right: 30px;
  bottom: 23px;
  top: 23px;

  display: flex;
  align-items: flex-end;
  justify-content: space-around;

  gap: 14px;
}

.chart-bars i {
  flex: 1;

  max-width: 35px;

  border-radius:
    6px
    6px
    2px
    2px;

  background:
    linear-gradient(
      180deg,
      #3e9aff,
      #0f5db5
    );
}

.system-demo-bottom {
  margin-top: 15px;

  display: grid;

  grid-template-columns:
    1fr
    1fr;

  gap: 12px;
}

.system-demo-bottom > div {
  padding:
    15px;

  border:
    1px solid
    #dde5eb;

  border-radius: 12px;

  background: white;
}

.system-demo-bottom strong,
.system-demo-bottom span {
  display: block;
}

.system-demo-bottom strong {
  font-size: 11px;
}

.system-demo-bottom span {
  margin-top: 6px;

  color: #788697;

  font-size: 9px;
}


/* AI */

.ai-section {
  padding:
    115px
    0;

  color: #071b31;

  background: #f4f0e8;
}

.ai-grid {
  display: grid;

  grid-template-columns:
    1fr
    .85fr;

  gap: 100px;
}

.ai-copy > p {
  margin-top: 9px;

  color: #526173;

  font-size: 18px;

  line-height: 1.7;
}

.ai-points {
  margin-top: 39px;

  display: grid;

  gap: 1px;

  overflow: hidden;

  border:
    1px solid
    #d8ddd9;

  border-radius: 17px;

  background: #d8ddd9;
}

.ai-points > div {
  padding:
    23px;

  background:
    rgba(
      255,
      255,
      255,
      .65
    );
}

.ai-points strong,
.ai-points span {
  display: block;
}

.ai-points strong {
  font-family:
    Georgia,
    serif;

  font-size: 19px;
}

.ai-points span {
  margin-top: 8px;

  color: #657486;

  font-size: 13px;

  line-height: 1.55;
}


/* INDUSTRIES */

.industries-section {
  padding:
    115px
    0;

  color: #071b31;

  background: white;
}

.industries-grid {
  display: grid;

  grid-template-columns:
    repeat(
      4,
      1fr
    );

  border-top:
    1px solid
    #dfe4e7;

  border-left:
    1px solid
    #dfe4e7;
}

.industries-grid > div {
  min-height: 150px;

  padding:
    27px;

  display: flex;
  flex-direction: column;
  justify-content: space-between;

  border-right:
    1px solid
    #dfe4e7;

  border-bottom:
    1px solid
    #dfe4e7;
}

.industries-grid span {
  color: #a8752a;

  font-size: 10px;

  font-weight: 800;
}

.industries-grid strong {
  font-family:
    Georgia,
    serif;

  font-size: 19px;
}


/* WHY */

.why-section {
  padding:
    120px
    0;

  color: white;

  background:
    linear-gradient(
      120deg,
      #031321,
      #08253f
    );
}

.why-section > .shell > h2 {
  max-width: 900px;
}

.why-grid {
  margin-top: 70px;

  display: grid;

  grid-template-columns:
    repeat(
      4,
      1fr
    );

  gap: 20px;
}

.why-grid article {
  min-height: 250px;

  padding:
    28px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .11
    );

  border-radius: 18px;

  background:
    rgba(
      255,
      255,
      255,
      .035
    );
}

.why-grid article > span {
  color: #efbd58;

  font-size: 10px;

  font-weight: 800;
}

.why-grid h3 {
  margin:
    54px
    0
    12px;

  font-family:
    Georgia,
    serif;

  font-size: 23px;

  font-weight: 500;
}

.why-grid p {
  margin: 0;

  color: #afbecd;

  font-size: 13px;

  line-height: 1.7;
}


/* FAQ */

.faq-section {
  padding:
    120px
    0;

  color: #071b31;

  background: #f7f5ef;
}

.faq-grid {
  display: grid;

  grid-template-columns:
    .8fr
    1.2fr;

  gap: 110px;
}

.faq-list {
  border-top:
    1px solid
    #ccd4da;
}

.faq-list details {
  border-bottom:
    1px solid
    #ccd4da;
}

.faq-list summary {
  position: relative;

  padding:
    23px
    45px
    23px
    0;

  cursor: pointer;

  list-style: none;

  font-family:
    Georgia,
    serif;

  font-size: 18px;
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary::after {
  content: "+";

  position: absolute;

  right: 4px;
  top: 20px;

  color: #9f6e27;

  font-family:
    Arial,
    sans-serif;

  font-size: 24px;
}

.faq-list details[open] summary::after {
  content: "–";
}

.faq-list details p {
  max-width: 700px;

  margin:
    0
    0
    24px;

  color: #596a7c;

  font-size: 14px;

  line-height: 1.7;
}


/* FINAL CTA */

.final-cta {
  padding:
    100px
    0;

  background:
    linear-gradient(
      120deg,
      #c99132,
      #efbd58
    );

  color: #061726;
}

.final-cta-inner {
  display: grid;

  grid-template-columns:
    1fr
    auto;

  align-items: center;

  gap: 70px;
}

.final-cta-inner > div:first-child > span {
  display: block;

  margin-bottom: 17px;

  font-size: 10px;

  font-weight: 800;

  letter-spacing: .24em;
}

.final-cta h2 {
  max-width: 800px;
}

.final-cta-actions {
  display: grid;

  gap: 12px;
}

.final-cta .v4-gold-button {
  background: #061726;

  color: white;
}

.final-cta .v4-outline-button {
  border-color:
    rgba(
      6,
      23,
      38,
      .55
    );

  color: #061726;
}


/* RESPONSIVE V4 */

@media (max-width: 1100px) {

  .v4-service-grid,
  .why-grid {
    grid-template-columns:
      1fr
      1fr;
  }

  .industries-grid {
    grid-template-columns:
      1fr
      1fr;
  }

  .system-showcase-grid,
  .ai-grid,
  .faq-grid {
    grid-template-columns: 1fr;

    gap: 60px;
  }

  .system-window {
    max-width: 850px;
  }

}


@media (max-width: 760px) {

  .v4-heading-grid {
    grid-template-columns: 1fr;

    gap: 25px;

    margin-bottom: 45px;
  }

  .v4-service-grid,
  .process-grid,
  .why-grid,
  .industries-grid {
    grid-template-columns: 1fr;
  }

  .v4-service-card {
    min-height: auto;
  }

  .process-grid article {
    min-height: 245px;
  }

  .process-grid h3 {
    margin-top: 45px;
  }

  .system-showcase,
  .services-v4,
  .process-section,
  .ai-section,
  .industries-section,
  .why-section,
  .faq-section {
    padding:
      80px
      0;
  }

  .system-window-body {
    grid-template-columns: 75px 1fr;
  }

  .system-demo-nav {
    padding:
      20px
      10px;

    align-items: center;
  }

  .system-demo-nav span {
    width: 9px;

    overflow: hidden;

    color: transparent;
  }

  .system-demo-main {
    padding: 20px;
  }

  .system-demo-kpis {
    grid-template-columns: 1fr;
  }

  .system-demo-chart {
    height: 125px;
  }

  .system-demo-bottom {
    grid-template-columns: 1fr;
  }

  .final-cta-inner {
    grid-template-columns: 1fr;

    gap: 38px;
  }

  .final-cta-actions {
    width: 100%;
  }

  .v4-gold-button,
  .v4-outline-button {
    width: 100%;
  }

}


@media (max-width: 520px) {

  .v4-service-grid {
    gap: 13px;
  }

  .v4-service-card {
    padding: 25px;
  }

  .system-window {
    margin-inline: -5px;

    border-radius: 16px;
  }

  .system-window-body {
    min-height: 410px;
  }

  .system-demo-head {
    align-items: flex-start;

    gap: 12px;
  }

  .system-demo-period {
    display: none;
  }

}


/* ============================================================
   SWESUND EKONOMI - MODULES V4.1
   ============================================================ */

.modules-section {
  padding: 120px 0 125px;
  color: #071b31;

  background:
    linear-gradient(
      180deg,
      #f7f4ed,
      #efeae1
    );
}

.modules-grid {
  display: grid;

  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap: 18px;
}

.module-card {
  min-height: 285px;

  padding: 27px;

  display: flex;
  flex-direction: column;

  border:
    1px solid
    rgba(11,39,65,.10);

  border-radius: 19px;

  background:
    rgba(255,255,255,.82);

  box-shadow:
    0 14px 35px
    rgba(17,39,59,.045);

  transition:
    transform .2s ease,
    box-shadow .2s ease,
    border-color .2s ease;
}

.module-card:hover {
  transform: translateY(-3px);

  border-color:
    rgba(176,122,38,.26);

  box-shadow:
    0 22px 50px
    rgba(17,39,59,.08);
}

.module-card-ai {
  color: white;

  border-color:
    rgba(238,187,82,.30);

  background:
    radial-gradient(
      circle at 80% 10%,
      rgba(44,117,200,.22),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #082945,
      #031728
    );
}

.module-top {
  min-height: 43px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 12px;
}

.module-icon {
  width: 42px;
  height: 42px;

  display: grid;
  place-items: center;

  border:
    1px solid
    rgba(164,112,33,.22);

  border-radius: 12px;

  color: #a87225;

  background:
    rgba(248,240,223,.7);

  font-family: Georgia, serif;

  font-size: 19px;
  font-weight: 700;
}

.module-card-ai .module-icon {
  color: #f0bf5d;

  border-color:
    rgba(239,189,88,.28);

  background:
    rgba(239,189,88,.07);
}

.module-badge {
  padding: 7px 9px;

  border:
    1px solid
    rgba(11,39,65,.10);

  border-radius: 999px;

  color: #7b8794;

  background:
    rgba(255,255,255,.6);

  font-size: 8px;
  font-weight: 800;

  letter-spacing: .11em;
}

.module-badge-ai {
  color: #f2c368;

  border-color:
    rgba(239,189,88,.26);

  background:
    rgba(239,189,88,.06);
}

.module-card h3 {
  margin: 39px 0 13px;

  font-family: Georgia, serif;

  font-size: 23px;
  font-weight: 500;

  line-height: 1.12;
}

.module-card p {
  margin: 0;

  color: #5d6d7e;

  font-size: 13px;

  line-height: 1.68;
}

.module-card-ai p {
  color: #b9c8d7;
}

.module-link {
  margin-top: auto;

  padding-top: 25px;

  color: #956522;

  font-size: 11px;
  font-weight: 700;
}

.module-card-ai .module-link {
  color: #efbd58;
}

.modules-footer {
  margin-top: 28px;

  padding: 25px 28px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 30px;

  border:
    1px solid
    rgba(13,44,70,.10);

  border-radius: 18px;

  background:
    rgba(255,255,255,.62);
}

.modules-footer strong,
.modules-footer span {
  display: block;
}

.modules-footer strong {
  font-family: Georgia, serif;

  font-size: 18px;
}

.modules-footer span {
  margin-top: 5px;

  color: #667587;

  font-size: 12px;
}


@media (max-width: 1100px) {

  .modules-grid {
    grid-template-columns:
      1fr
      1fr;
  }

}


@media (max-width: 700px) {

  .modules-section {
    padding: 80px 0;
  }

  .modules-grid {
    grid-template-columns: 1fr;

    gap: 13px;
  }

  .module-card {
    min-height: auto;

    padding: 24px;
  }

  .module-card h3 {
    margin-top: 30px;
  }

  .modules-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .modules-footer .v4-gold-button {
    width: 100%;
  }

}


/* =============================================================
   SWESUND EKONOMI PUBLIC HOME V5
   SYSTEM PALETTE
   Based on live V9 tokens.css
   ============================================================= */

:root {
  --public-bg: #f4f7fa;
  --public-surface: #ffffff;
  --public-surface-soft: #f8fafc;

  --public-ink: #0b3658;
  --public-ink-strong: #062d4b;
  --public-muted: #71869a;

  --public-line: #dce5ed;
  --public-line-soft: #edf2f6;

  --public-navy: #0b3658;
  --public-navy-dark: #082a45;

  --public-gold: #c99a3d;
  --public-gold-soft: #f6ecd3;

  --public-success: #2e9f69;
  --public-warning: #c8952c;
  --public-danger: #c94b4b;
}


/* =============================================================
   BODY / GLOBAL
   ============================================================= */

html,
body {
  background:
    var(--public-bg);
}

body {
  color:
    var(--public-ink);
}

body::selection {
  color:
    #ffffff;

  background:
    var(--public-navy);
}


/* =============================================================
   PUBLIC HEADER - MOBILE / REAL HTML HEADER
   ============================================================= */

.site-header {
  color:
    var(--public-ink);

  border-bottom:
    1px solid
    var(--public-line);

  background:
    rgba(
      255,
      255,
      255,
      .96
    );

  box-shadow:
    0 1px 2px
    rgba(
      9,
      43,
      70,
      .04
    );
}

.site-header a {
  color:
    var(--public-ink);
}

.site-header nav a {
  color:
    #5f7589;
}

.site-header nav a:hover {
  color:
    var(--public-navy);
}

.site-header .brand,
.site-header .brand strong {
  color:
    var(--public-ink-strong);
}


/* =============================================================
   HERO FRAME
   Desktop artwork is intentionally preserved.
   ============================================================= */

.desktop-hero {
  background:
    var(--public-bg);
}

.desktop-hero-image {
  display:
    block;

  box-shadow:
    0 14px 42px
    rgba(
      9,
      43,
      70,
      .08
    );
}


/* =============================================================
   MOBILE HERO
   ============================================================= */

@media (max-width: 980px) {

  .mobile-hero {
    color:
      var(--public-ink);

    background:
      var(--public-bg);
  }

  .mobile-hero-image-wrap {
    background:
      var(--public-bg);
  }

  .mobile-copy {
    color:
      var(--public-ink);

    background:
      var(--public-bg);
  }

  .mobile-copy .section-kicker,
  .mobile-copy [class*="eyebrow"] {
    color:
      #b77a05;
  }

  .mobile-copy h1,
  .mobile-copy h2 {
    color:
      var(--public-ink-strong);
  }

  .mobile-copy h1 em,
  .mobile-copy h1 span,
  .mobile-copy h2 em,
  .mobile-copy h2 span {
    color:
      var(--public-gold);
  }

  .mobile-copy p {
    color:
      var(--public-muted);
  }

}


/* =============================================================
   TYPOGRAPHY
   ============================================================= */

.section-kicker {
  color:
    #b77a05 !important;
}

.section-kicker-gold {
  color:
    var(--public-gold) !important;
}

.v4-heading-grid h2,
.process-section h2,
.system-showcase h2,
.ai-section h2,
.industries-section h2,
.why-section h2,
.faq-section h2,
.final-cta h2,
.modules-section h2 {
  color:
    var(--public-ink-strong);
}

.v4-heading-grid p,
.process-section p,
.ai-section p,
.industries-section p,
.faq-section p,
.modules-section p {
  color:
    var(--public-muted);
}


/* =============================================================
   SERVICES
   ============================================================= */

.services-v4 {
  color:
    var(--public-ink);

  background:
    var(--public-bg);
}

.v4-service-card {
  color:
    var(--public-ink);

  border:
    1px solid
    var(--public-line);

  background:
    var(--public-surface);

  box-shadow:
    0 8px 24px
    rgba(
      9,
      43,
      70,
      .045
    );
}

.v4-service-card:hover {
  border-color:
    #c8d7e2;

  box-shadow:
    0 12px 30px
    rgba(
      9,
      43,
      70,
      .07
    );
}

.v4-service-card h3 {
  color:
    var(--public-ink-strong);
}

.v4-service-card p {
  color:
    var(--public-muted);
}

.v4-number,
.v4-card-link {
  color:
    #b77a05;
}


/* AI featured card in system palette */

.v4-service-card-featured {
  color:
    var(--public-ink);

  border:
    1px solid
    #d8e3ec;

  background:
    linear-gradient(
      145deg,
      #ffffff,
      #f8fafc
    );
}

.v4-service-card-featured h3 {
  color:
    var(--public-ink-strong);
}

.v4-service-card-featured p {
  color:
    var(--public-muted);
}

.v4-service-card-featured .v4-number,
.v4-service-card-featured .v4-card-link {
  color:
    #b77a05;
}


/* =============================================================
   PROCESS
   ============================================================= */

.process-section {
  color:
    var(--public-ink);

  background:
    var(--public-surface);
}

.process-grid {
  border-color:
    var(--public-line);

  background:
    var(--public-line);
}

.process-grid article {
  color:
    var(--public-ink);

  background:
    var(--public-surface-soft);
}

.process-grid article > span {
  color:
    #b77a05;
}

.process-grid h3 {
  color:
    var(--public-ink-strong);
}

.process-grid p {
  color:
    var(--public-muted);
}


/* =============================================================
   SYSTEM SHOWCASE
   Keep a branded navy block, but use the real system navy.
   ============================================================= */

.system-showcase {
  color:
    white;

  background:
    radial-gradient(
      circle at 82% 20%,
      rgba(
        201,
        154,
        61,
        .10
      ),
      transparent 27%
    ),
    linear-gradient(
      130deg,
      var(--public-navy-dark),
      var(--public-navy)
    );
}

.system-showcase h2 {
  color:
    #ffffff;
}

.system-showcase .section-kicker {
  color:
    #e8c26f !important;
}

.system-copy > p {
  color:
    #c4d0da;
}

.system-feature-list span {
  color:
    #e0e7ed;
}

.system-feature-list span::before {
  color:
    var(--public-gold);
}


/* system mockup */

.system-window {
  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .15
    );

  background:
    var(--public-bg);

  box-shadow:
    0 28px 68px
    rgba(
      4,
      28,
      47,
      .28
    );
}

.system-window-top {
  color:
    #dce5ed;

  background:
    var(--public-navy-dark);
}

.system-demo-nav {
  color:
    #bac8d3;

  background:
    var(--public-navy);
}

.system-demo-nav strong {
  color:
    white;

  background:
    var(--public-navy-dark);
}

.system-demo-main {
  color:
    var(--public-ink);

  background:
    var(--public-bg);
}

.system-demo-kpis > div,
.system-demo-chart,
.system-demo-bottom > div {
  border-color:
    var(--public-line);

  background:
    var(--public-surface);
}

.chart-bars i {
  background:
    linear-gradient(
      180deg,
      #3d6f95,
      var(--public-navy)
    );
}


/* =============================================================
   MODULES
   ============================================================= */

.modules-section {
  color:
    var(--public-ink);

  background:
    var(--public-bg);
}

.module-card {
  color:
    var(--public-ink);

  border:
    1px solid
    var(--public-line);

  background:
    var(--public-surface);

  box-shadow:
    var(--v9-shadow, 0 8px 24px rgba(9,43,70,.06));
}

.module-card:hover {
  border-color:
    #c8d7e2;

  box-shadow:
    0 12px 30px
    rgba(
      9,
      43,
      70,
      .075
    );
}

.module-icon {
  color:
    var(--public-navy);

  border-color:
    #d8e3ec;

  background:
    #edf4f9;
}

.module-badge {
  color:
    #607487;

  border-color:
    var(--public-line);

  background:
    var(--public-surface-soft);
}

.module-card h3 {
  color:
    var(--public-ink-strong);
}

.module-card p {
  color:
    var(--public-muted);
}

.module-link {
  color:
    #b77a05;
}


/* AI module */

.module-card-ai {
  color:
    var(--public-ink);

  border:
    1px solid
    #d8e3ec;

  background:
    linear-gradient(
      145deg,
      #ffffff,
      #f8fafc
    );
}

.module-card-ai h3 {
  color:
    var(--public-ink-strong);
}

.module-card-ai p {
  color:
    var(--public-muted);
}

.module-card-ai .module-icon {
  color:
    var(--public-navy);

  border-color:
    #d8e3ec;

  background:
    #edf4f9;
}

.module-badge-ai {
  color:
    #886200;

  border-color:
    #e7d39f;

  background:
    var(--public-gold-soft);
}

.module-card-ai .module-link {
  color:
    #b77a05;
}


/* footer under modules */

.modules-footer {
  border:
    1px solid
    var(--public-line);

  background:
    var(--public-surface);
}

.modules-footer strong {
  color:
    var(--public-ink-strong);
}

.modules-footer span {
  color:
    var(--public-muted);
}


/* =============================================================
   AI SECTION
   ============================================================= */

.ai-section {
  color:
    var(--public-ink);

  background:
    var(--public-surface-soft);
}

.ai-section h2 {
  color:
    var(--public-ink-strong);
}

.ai-copy > p {
  color:
    var(--public-muted);
}

.ai-points {
  border-color:
    var(--public-line);

  background:
    var(--public-line);
}

.ai-points > div {
  background:
    var(--public-surface);
}

.ai-points strong {
  color:
    var(--public-ink-strong);
}

.ai-points span {
  color:
    var(--public-muted);
}


/* =============================================================
   INDUSTRIES
   ============================================================= */

.industries-section {
  color:
    var(--public-ink);

  background:
    var(--public-surface);
}

.industries-grid {
  border-color:
    var(--public-line);
}

.industries-grid > div {
  border-color:
    var(--public-line);

  background:
    var(--public-surface);
}

.industries-grid > div:nth-child(even) {
  background:
    var(--public-surface-soft);
}

.industries-grid span {
  color:
    #b77a05;
}

.industries-grid strong {
  color:
    var(--public-ink-strong);
}


/* =============================================================
   WHY SWESUND
   Change dark section to system-light section.
   ============================================================= */

.why-section {
  color:
    var(--public-ink);

  background:
    #edf4f9;
}

.why-section .section-kicker {
  color:
    #b77a05 !important;
}

.why-section h2 {
  color:
    var(--public-ink-strong);
}

.why-grid article {
  color:
    var(--public-ink);

  border:
    1px solid
    #d8e3ec;

  background:
    var(--public-surface);

  box-shadow:
    0 8px 24px
    rgba(
      9,
      43,
      70,
      .04
    );
}

.why-grid article > span {
  color:
    #b77a05;
}

.why-grid h3 {
  color:
    var(--public-ink-strong);
}

.why-grid p {
  color:
    var(--public-muted);
}


/* =============================================================
   FAQ
   ============================================================= */

.faq-section {
  color:
    var(--public-ink);

  background:
    var(--public-bg);
}

.faq-list {
  border-color:
    var(--public-line);
}

.faq-list details {
  border-color:
    var(--public-line);
}

.faq-list summary {
  color:
    var(--public-ink-strong);
}

.faq-list summary::after {
  color:
    #b77a05;
}

.faq-list details p {
  color:
    var(--public-muted);
}


/* =============================================================
   BUTTONS / CTA
   ============================================================= */

.v4-gold-button {
  color:
    #ffffff !important;

  border:
    1px solid
    var(--public-navy-dark);

  background:
    linear-gradient(
      135deg,
      var(--public-navy),
      var(--public-navy-dark)
    ) !important;

  box-shadow:
    0 7px 20px
    rgba(
      5,
      35,
      57,
      .14
    );
}

.v4-gold-button:hover {
  filter:
    brightness(.96);
}

.v4-outline-button {
  color:
    var(--public-navy) !important;

  border:
    1px solid
    #aec3d4 !important;

  background:
    #ffffff !important;
}


/* =============================================================
   FINAL CTA
   ============================================================= */

.final-cta {
  color:
    var(--public-ink);

  border-top:
    1px solid
    var(--public-line);

  background:
    linear-gradient(
      135deg,
      #edf4f9,
      #f8fafc
    );
}

.final-cta-inner > div:first-child > span {
  color:
    #b77a05;
}

.final-cta h2 {
  color:
    var(--public-ink-strong);
}

.final-cta .v4-gold-button {
  color:
    white !important;

  background:
    linear-gradient(
      135deg,
      var(--public-navy),
      var(--public-navy-dark)
    ) !important;
}

.final-cta .v4-outline-button {
  color:
    var(--public-navy) !important;

  border-color:
    #aec3d4 !important;

  background:
    white !important;
}


/* =============================================================
   FOOTER
   ============================================================= */

footer,
.site-footer {
  color:
    #dfe7ed;

  background:
    var(--public-navy-dark);
}

footer a,
.site-footer a {
  color:
    #dfe7ed;
}

footer a:hover,
.site-footer a:hover {
  color:
    #ffffff;
}


/* =============================================================
   MOBILE V5
   ============================================================= */

@media (max-width: 700px) {

  body {
    background:
      var(--public-bg);
  }

  .site-header {
    background:
      rgba(
        255,
        255,
        255,
        .98
      );
  }

  .mobile-copy {
    background:
      var(--public-bg);
  }

  .services-v4,
  .modules-section,
  .faq-section {
    background:
      var(--public-bg);
  }

  .process-section,
  .industries-section {
    background:
      var(--public-surface);
  }

  .ai-section {
    background:
      var(--public-surface-soft);
  }

  .why-section {
    background:
      #edf4f9;
  }

}


/* =============================================================
   SWESUND EKONOMI PUBLIC HOME V5.1
   PREMIUM FOOTER
   ============================================================= */

footer,
.site-footer {
  position: relative;

  overflow: hidden;

  color: #d8e4ed;

  border-top:
    1px solid
    rgba(201,154,61,.18);

  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(29,102,157,.15),
      transparent 30%
    ),
    radial-gradient(
      circle at 90% 30%,
      rgba(201,154,61,.08),
      transparent 26%
    ),
    linear-gradient(
      135deg,
      #041a2b 0%,
      #062d4b 48%,
      #082a45 100%
    ) !important;
}


/* subtle decorative glow */

footer::before,
.site-footer::before {
  content: "";

  position: absolute;

  width: 520px;
  height: 520px;

  top: -340px;
  right: -120px;

  border-radius: 50%;

  border:
    1px solid
    rgba(201,154,61,.13);

  pointer-events: none;
}


footer::after,
.site-footer::after {
  content: "";

  position: absolute;

  width: 340px;
  height: 340px;

  left: -170px;
  bottom: -240px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(28,103,158,.14),
      transparent 68%
    );

  pointer-events: none;
}


/* inner container */

footer .shell,
.site-footer .shell {
  position: relative;

  z-index: 2;
}


/* footer columns */

footer > .shell,
.site-footer > .shell {
  padding-top: 72px;
  padding-bottom: 26px;
}


footer h2,
footer h3,
footer h4,
.site-footer h2,
.site-footer h3,
.site-footer h4 {
  margin-top: 0;

  color: #e7b95c !important;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-weight: 600;

  letter-spacing: -.01em;
}


footer p,
.site-footer p {
  color: #aebfcd;

  line-height: 1.75;
}


/* brand section */

footer .brand,
.site-footer .brand {
  color: #ffffff;
}


footer .brand strong,
.site-footer .brand strong {
  color: #ffffff;
}


footer .brand small,
.site-footer .brand small {
  color: #d7a73f;
}


/* links */

footer a,
.site-footer a {
  position: relative;

  display: inline-block;

  color: #c3d2de !important;

  text-decoration: none;

  transition:
    color .18s ease,
    transform .18s ease;
}


footer a:hover,
.site-footer a:hover {
  color: #ffffff !important;

  transform: translateX(2px);
}


/* contact email highlight */

footer a[href^="mailto:"],
.site-footer a[href^="mailto:"] {
  color: #f0c76f !important;

  font-weight: 600;
}


footer a[href^="mailto:"]:hover,
.site-footer a[href^="mailto:"]:hover {
  color: #ffffff !important;
}


/* telephone */

footer a[href^="tel:"],
.site-footer a[href^="tel:"] {
  color: #d8e4ed !important;
}


/* spacing between rows */

footer ul,
.site-footer ul {
  margin: 0;
  padding: 0;

  list-style: none;
}


footer li,
.site-footer li {
  margin-bottom: 11px;
}


/* bottom divider */

footer hr,
.site-footer hr {
  margin:
    42px
    0
    22px;

  height: 1px;

  border: 0;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.12) 12%,
      rgba(201,154,61,.20) 50%,
      rgba(255,255,255,.12) 88%,
      transparent
    );
}


/* copyright / footer bottom */

footer .footer-bottom,
.site-footer .footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 30px;

  color: #7890a3;

  font-size: 12px;
}


footer .footer-bottom a,
.site-footer .footer-bottom a {
  color: #8fa5b6 !important;
}


footer .footer-bottom a:hover,
.site-footer .footer-bottom a:hover {
  color: #ffffff !important;
}


/* brand tagline */

footer .footer-tagline,
.site-footer .footer-tagline {
  max-width: 320px;

  color: #9db0bf;

  font-size: 14px;

  line-height: 1.7;
}


/* mobile */

@media (max-width: 760px) {

  footer > .shell,
  .site-footer > .shell {
    padding-top: 54px;
  }

  footer h3,
  .site-footer h3 {
    margin-top: 22px;
  }

  footer .footer-bottom,
  .site-footer .footer-bottom {
    align-items: flex-start;
    flex-direction: column;

    gap: 8px;
  }

}


/* =============================================================
   SWESUND PUBLIC HOME V5.2
   FOOTER READABILITY
   ============================================================= */

footer,
.site-footer {
  color: #eef4f8 !important;
}


/* MORE AIR */

footer > .shell,
.site-footer > .shell {
  padding-top: 78px !important;
  padding-bottom: 34px !important;
}


/* BRAND */

footer .brand,
.site-footer .brand {
  margin-bottom: 18px;
}

footer .brand strong,
.site-footer .brand strong {
  color: #ffffff !important;

  font-size: 27px !important;

  letter-spacing: .12em;
}

footer .brand small,
.site-footer .brand small {
  color: #e9b957 !important;

  font-size: 12px !important;

  letter-spacing: .26em;
}


/* TAGLINE */

footer p,
.site-footer p,
footer .footer-tagline,
.site-footer .footer-tagline {
  color: #c5d3df !important;

  font-size: 15px !important;

  line-height: 1.75 !important;
}


/* COLUMN HEADINGS */

footer h2,
footer h3,
footer h4,
.site-footer h2,
.site-footer h3,
.site-footer h4 {
  color: #f0bd56 !important;

  font-size: 22px !important;

  font-weight: 700 !important;

  margin-bottom: 22px !important;
}


/* LINKS */

footer a,
.site-footer a {
  color: #edf3f7 !important;

  font-size: 15px !important;

  line-height: 1.6 !important;

  font-weight: 500 !important;
}

footer a:hover,
.site-footer a:hover {
  color: #f2c96f !important;
}


/* EMAIL MORE VISIBLE */

footer a[href^="mailto:"],
.site-footer a[href^="mailto:"] {
  color: #f4c55f !important;

  font-weight: 800 !important;
}


/* PHONE */

footer a[href^="tel:"],
.site-footer a[href^="tel:"] {
  color: #ffffff !important;

  font-weight: 600 !important;
}


/* LIST SPACING */

footer li,
.site-footer li {
  margin-bottom: 13px !important;
}


/* DIVIDER */

footer hr,
.site-footer hr {
  margin-top: 52px !important;
  margin-bottom: 28px !important;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.04),
      rgba(255,255,255,.22) 20%,
      rgba(201,154,61,.34) 50%,
      rgba(255,255,255,.22) 80%,
      rgba(255,255,255,.04)
    ) !important;
}


/* FOOTER BOTTOM */

footer .footer-bottom,
.site-footer .footer-bottom {
  color: #a9bdcc !important;

  font-size: 13px !important;
}

footer .footer-bottom a,
.site-footer .footer-bottom a {
  color: #b9cad7 !important;

  font-size: 13px !important;
}


/* CONTACT COLUMN */

footer [class*="contact"],
.site-footer [class*="contact"] {
  color: #eef4f8;
}


/* MOBILE */

@media (max-width: 760px) {

  footer > .shell,
  .site-footer > .shell {
    padding-top: 58px !important;
  }

  footer h3,
  .site-footer h3 {
    font-size: 20px !important;

    margin-top: 28px !important;
  }

  footer a,
  .site-footer a {
    font-size: 16px !important;
  }

  footer p,
  .site-footer p {
    font-size: 15px !important;
  }

}


/* =============================================================
   SWESUND PUBLIC HOME V5.3
   STRUCTURED FOOTER
   ============================================================= */

.site-footer-v53 {
  position: relative;

  overflow: hidden;

  padding: 0 !important;

  color: #eaf1f6;

  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201,154,61,.08),
      transparent 27%
    ),
    linear-gradient(
      135deg,
      #062d4b,
      #082a45
    ) !important;
}


.footer-v53-shell {
  position: relative;

  z-index: 2;

  padding-top: 64px !important;
  padding-bottom: 28px !important;
}


.footer-v53-top {
  display: grid;

  grid-template-columns:
    minmax(320px, 1.1fr)
    minmax(0, 1.7fr);

  gap: 90px;

  align-items: start;

  padding-bottom: 54px;
}


/* BRAND */

.footer-v53-brand {
  max-width: 430px;
}

.footer-v53-logo {
  display: flex;
  align-items: center;

  gap: 14px;

  margin-bottom: 20px;
}

.footer-v53-logo img {
  width: 38px;
  height: 38px;

  object-fit: contain;
}

.footer-v53-logo > div {
  display: grid;

  gap: 3px;
}

.footer-v53-logo strong {
  color: #ffffff;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: 27px;

  letter-spacing: .12em;
}

.footer-v53-logo span {
  color: #e3b14a;

  font-size: 11px;
  font-weight: 700;

  letter-spacing: .28em;
}


.footer-v53-brand p {
  max-width: 380px;

  margin:
    0
    0
    28px;

  color: #b9c9d5 !important;

  font-size: 15px !important;

  line-height: 1.75;
}


.footer-v53-cta {
  min-height: 48px;

  padding:
    0
    21px;

  display: inline-flex !important;
  align-items: center;

  gap: 20px;

  border:
    1px solid
    rgba(201,154,61,.55);

  border-radius: 999px;

  color: #ffffff !important;

  background:
    rgba(255,255,255,.035);

  font-size: 14px !important;
  font-weight: 700 !important;
}

.footer-v53-cta span {
  color: #efc56d;
}

.footer-v53-cta:hover {
  color: #ffffff !important;

  background:
    rgba(201,154,61,.11);
}


/* RIGHT NAV */

.footer-v53-nav {
  display: grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0, 1fr)
    );

  gap: 56px;
}


.footer-v53-column {
  display: flex;
  flex-direction: column;

  align-items: flex-start;
}


.footer-v53-column h3 {
  margin:
    0
    0
    23px !important;

  color: #eebd58 !important;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: 20px !important;

  font-weight: 700;
}


.footer-v53-column a,
.footer-v53-column > span {
  margin-bottom: 12px;

  color: #e6eef4 !important;

  font-size: 14px !important;

  line-height: 1.55;
}


.footer-v53-column a {
  transition:
    color .16s ease,
    transform .16s ease;
}


.footer-v53-column a:hover {
  color: #f0c66d !important;

  transform:
    translateX(3px);
}


.footer-v53-contact a[href^="mailto:"] {
  color: #f1c563 !important;

  font-weight: 700 !important;
}


.footer-v53-contact a[href^="tel:"] {
  color: #ffffff !important;

  font-weight: 650 !important;
}


.footer-v53-contact > span {
  color: #aebfcb !important;
}


/* BOTTOM */

.footer-v53-bottom {
  min-height: 72px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 30px;

  border-top:
    1px solid
    rgba(255,255,255,.10);

  color: #89a0b2;

  font-size: 12px;
}


.footer-v53-bottom > div {
  display: flex;
  align-items: center;

  gap: 9px;
}


.footer-v53-dot {
  color: #c99a3d;
}


/* REMOVE OLD FOOTER SPACING */

.site-footer-v53 hr {
  display: none !important;
}


/* RESPONSIVE */

@media (max-width: 900px) {

  .footer-v53-top {
    grid-template-columns: 1fr;

    gap: 52px;
  }

  .footer-v53-brand {
    max-width: 620px;
  }

}


@media (max-width: 700px) {

  .footer-v53-shell {
    padding-top: 48px !important;
  }

  .footer-v53-nav {
    grid-template-columns:
      1fr
      1fr;

    gap:
      36px
      28px;
  }

  .footer-v53-contact {
    grid-column:
      1 / -1;
  }

  .footer-v53-bottom {
    padding:
      22px
      0;

    align-items: flex-start;
    flex-direction: column;

    gap: 8px;
  }

}


@media (max-width: 480px) {

  .footer-v53-nav {
    grid-template-columns: 1fr;
  }

  .footer-v53-contact {
    grid-column: auto;
  }

  .footer-v53-logo strong {
    font-size: 23px;
  }

}


/* =============================================================
   SWESUND PUBLIC HOME V5.4
   MOBILE HERO FIX FOR LIGHT SYSTEM PALETTE
   ============================================================= */

@media (max-width: 980px) {

  .mobile-hero {
    background: #f4f7fa !important;
  }

  .mobile-hero-image-wrap {
    position: relative;

    height: 390px !important;

    overflow: hidden;

    background: #f4f7fa !important;
  }

  .mobile-hero-image-wrap img {
    position: absolute;

    inset: 0;

    width: 100% !important;
    height: 100% !important;

    max-width: none !important;

    object-fit: cover !important;

    object-position:
      center
      30% !important;
  }

  .mobile-hero-image-wrap::before {
    content: "";

    position: absolute;

    z-index: 2;

    inset: 0;

    background:
      linear-gradient(
        90deg,
        rgba(11,54,88,.10) 0%,
        rgba(11,54,88,.03) 38%,
        transparent 72%
      ) !important;

    pointer-events: none;
  }

  .mobile-hero-image-wrap::after {
    content: "";

    position: absolute;

    z-index: 3;

    left: 0;
    right: 0;
    bottom: 0;

    height: 135px;

    background:
      linear-gradient(
        180deg,
        rgba(244,247,250,0) 0%,
        rgba(244,247,250,.30) 26%,
        rgba(244,247,250,.80) 66%,
        #f4f7fa 100%
      ) !important;

    pointer-events: none;
  }

  .mobile-copy {
    position: relative;

    z-index: 4;

    margin-top: 0 !important;

    padding:
      10px
      20px
      54px !important;

    color: #0b3658 !important;

    background: #f4f7fa !important;
  }

  .mobile-copy .section-kicker,
  .mobile-copy [class*="eyebrow"] {
    display: block;

    margin:
      0
      0
      16px !important;

    color: #b77a05 !important;

    font-size: 10px !important;

    font-weight: 800 !important;

    letter-spacing: .18em !important;
  }

  .mobile-copy h1,
  .mobile-copy h2 {
    margin-top: 0 !important;

    color: #062d4b !important;
  }

  .mobile-copy h1 em,
  .mobile-copy h1 span,
  .mobile-copy h2 em,
  .mobile-copy h2 span {
    color: #c99a3d !important;
  }

  .mobile-copy p {
    color: #71869a !important;
  }

  .mobile-copy .hero-actions,
  .mobile-copy [class*="hero-actions"] {
    margin-top: 28px !important;
  }

  .mobile-copy a[href="#contact"],
  .mobile-copy a[href*="#contact"] {
    color: #082a45 !important;

    border:
      1px solid
      #c99a3d !important;

    background:
      linear-gradient(
        135deg,
        #f6d883,
        #e7b84f
      ) !important;
  }

  .mobile-copy a[href="/sakacc-v9.html"] {
    color: #0b3658 !important;

    border:
      1px solid
      #aec3d4 !important;

    background:
      #ffffff !important;
  }

  .mobile-copy a[href="/sakacc-v9.html"] span,
  .mobile-copy a[href="#contact"] span {
    color: inherit !important;
  }

}


@media (max-width: 700px) {

  .mobile-hero-image-wrap {
    height: 365px !important;
  }

  .mobile-copy {
    padding:
      8px
      18px
      48px !important;
  }

}


@media (max-width: 520px) {

  .mobile-hero-image-wrap {
    height: 340px !important;
  }

  .mobile-hero-image-wrap img {
    object-position:
      center
      28% !important;
  }

  .mobile-copy {
    padding-bottom:
      42px !important;
  }

}


/* =============================================================
   SWESUND PUBLIC HOME V5.4.1
   MOBILE HERO GRADIENT POSITION FIX
   ============================================================= */

@media (max-width: 980px) {

  .mobile-hero-image-wrap::after {
    inset: auto 0 0 0 !important;

    top: auto !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    width: 100% !important;
    height: 105px !important;

    background:
      linear-gradient(
        180deg,
        rgba(244,247,250,0) 0%,
        rgba(244,247,250,.12) 32%,
        rgba(244,247,250,.55) 68%,
        #f4f7fa 100%
      ) !important;

    pointer-events: none;
  }

}



/* ============================================================
   SWESUND PLATFORM NAVIGATION
   ============================================================ */

.swesund-platforms{
  position:relative;
  overflow:hidden;

  padding:66px 0 74px;

  background:
    linear-gradient(
      180deg,
      #06192b 0%,
      #08233b 52%,
      #06192b 100%
    );

  border-top:
    1px solid rgba(214,166,81,.22);

  color:#fff;
}


.swesund-platforms::before{
  content:"";

  position:absolute;

  width:730px;
  height:730px;

  left:-410px;
  top:-570px;

  border:
    1px solid rgba(217,169,84,.22);

  border-radius:50%;

  pointer-events:none;
}


.swesund-platforms-inner{
  position:relative;
  z-index:2;

  width:min(
    1540px,
    calc(100% - 96px)
  );

  margin:0 auto;
}


.swesund-platforms-header{
  max-width:760px;

  margin-bottom:34px;
}


.swesund-platforms-label{
  display:block;

  margin-bottom:11px;

  color:#d6a75a;

  font-size:12px;
  font-weight:700;

  letter-spacing:.24em;
}


.swesund-platforms-header h2{
  margin:0;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size:clamp(
    40px,
    3.4vw,
    58px
  );

  font-weight:500;

  line-height:1.03;

  color:#fff;
}


.swesund-platforms-header h2 span{
  color:#dfb363;
}


.swesund-platforms-header p{
  margin:16px 0 0;

  font-size:16px;

  color:
    rgba(229,237,243,.74);
}


.swesund-platform-grid{
  display:grid;

  grid-template-columns:
    repeat(4,1fr);

  gap:18px;
}


.swesund-platform-card{
  min-height:300px;

  position:relative;

  display:flex;
  flex-direction:column;

  padding:28px 27px 24px;

  color:#fff;

  background:
    linear-gradient(
      145deg,
      rgba(15,51,81,.96),
      rgba(5,25,43,.98)
    );

  border:
    1px solid rgba(218,170,88,.25);

  border-radius:17px;

  box-shadow:
    0 18px 42px rgba(0,0,0,.2);

  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}


.swesund-platform-card:hover{
  transform:translateY(-6px);

  border-color:
    rgba(227,184,106,.62);

  box-shadow:
    0 26px 55px rgba(0,0,0,.27);
}


.swesund-platform-card-main{
  border-color:
    rgba(228,183,101,.55);

  background:
    linear-gradient(
      145deg,
      #123e61,
      #061b30
    );
}


.swesund-platform-icon{
  width:58px;
  height:58px;

  display:flex;
  align-items:center;
  justify-content:center;

  margin-bottom:23px;

  color:#dfb261;

  background:
    rgba(3,20,35,.48);

  border:
    1px solid rgba(225,179,96,.48);

  border-radius:14px;
}


.swesund-platform-icon svg{
  width:29px;
  height:29px;

  fill:none;

  stroke:currentColor;

  stroke-width:1.65;

  stroke-linecap:round;
  stroke-linejoin:round;
}


.swesund-platform-brand{
  margin-bottom:6px;

  color:#d9aa5b;

  font-size:10px;
  font-weight:700;

  letter-spacing:.22em;
}


.swesund-platform-card h3{
  margin:0 0 11px;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size:27px;

  font-weight:500;

  color:#fff;
}


.swesund-platform-card p{
  margin:0;

  color:
    rgba(225,234,241,.72);

  font-size:14px;

  line-height:1.58;
}


.swesund-platform-open{
  margin-top:auto;

  padding-top:22px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  color:#e2b766;

  font-size:13px;
  font-weight:700;

  border-top:
    1px solid rgba(255,255,255,.09);
}


.swesund-platform-open span{
  width:32px;
  height:32px;

  display:flex;
  align-items:center;
  justify-content:center;

  border:
    1px solid rgba(225,180,99,.44);

  border-radius:50%;
}


/* TABLET */

@media(max-width:1100px){

  .swesund-platform-grid{
    grid-template-columns:
      repeat(2,1fr);
  }

}


/* MOBILE */

@media(max-width:650px){

  .swesund-platforms{
    padding:
      48px 0 54px;
  }


  .swesund-platforms-inner{
    width:
      calc(100% - 30px);
  }


  .swesund-platform-grid{
    grid-template-columns:1fr;
  }


  .swesund-platform-card{
    min-height:245px;
  }


  .swesund-platforms-header h2{
    font-size:38px;
  }

}