/* ============================================================
   StuderaHP — egen sidfot (inc/site-footer.php)
   Laddas bara på sidor där footern faktiskt renderas.
   Färgerna är mörka varianter av brand-blått (--blue-600) och
   bor lokalt i .shp-footer, eftersom resten av sajten är ljus.

   OM DEN DUBBLADE KLASSEN (.shp-footer.shp-footer …):
   Flera sidmallar sätter global rubrik- och brödtextstil med
   uppskruvad specificitet — t.ex.

     body.landing-page-modern.landing-page-modern h2 { … }   (0,2,2)

   och samma mönster finns i hogskoleprovet-dyslexi.css och
   trana-pa-hogskoleprovet.css. En vanlig klassregel (0,1,0) förlorar
   mot dem, och footerns rubriker ärvde då sidans 3rem mörka display-
   typografi i stället för sin egen. Att upprepa rotklassen ger (0,3,0)
   och vinner utan !important. Det är samma trick sidorna själva
   använder, så nya sidmallar kan fortsätta göra som de alltid gjort.
   Nya regler här MÅSTE ha samma prefix, annars faller de igenom.
   ============================================================ */

/* Blocksys globala footer. Regeln lever här och inte i components.css
   just för att filen bara laddas där vår footer tar över — appsidorna
   kan alltså aldrig råka få sin sidfot bortdöljd av misstag. */
body.shp-has-site-footer .ct-footer {
  display: none !important;
}

/* Skyddsnät om Blocksy byter klassnamn i en framtida version: en <footer>
   direkt under <body> som inte är vår ska aldrig ligga kvar och ge dubbel
   sidfot. Vår egen footer skrivs ut just där, så undantaget behövs. */
body.shp-has-site-footer > footer:not(.shp-footer) {
  display: none !important;
}

/* Footern ärver inte parenttemats box-sizing i alla lägen (t.ex. i lokala
   riggar), och width:100% på CTA-knappen sprack utan den. */
.shp-footer.shp-footer,
.shp-footer.shp-footer *,
.shp-footer.shp-footer *::before,
.shp-footer.shp-footer *::after {
  box-sizing: border-box;
}

.shp-footer.shp-footer.shp-footer {
  --shpf-bg: #0a1730;
  --shpf-bg-top: #0e2149;
  --shpf-ink: #f1f5fd;
  --shpf-muted: #a9bcdd;
  --shpf-line: rgba(255, 255, 255, 0.10);
  --shpf-line-strong: rgba(255, 255, 255, 0.18);
  --shpf-accent: #7cb0ff;
  --shpf-focus: #9dc4ff;

  position: relative;
  z-index: 1;
  margin: 0;
  padding: 0;
  background: linear-gradient(180deg, var(--shpf-bg-top) 0%, var(--shpf-bg) 46%, var(--shpf-bg) 100%);
  color: var(--shpf-ink);
  font-family: var(--font-ui);
  -webkit-font-smoothing: antialiased;
}

/* Tunn ljusrand i toppen: markerar övergången från den ljusa sidan
   utan en hård kant. */
.shp-footer.shp-footer::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(124, 176, 255, 0.55), transparent);
}

.shp-footer.shp-footer .shp-footer__inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 64px 24px 36px;
}

/* ---------- CTA ---------- */
.shp-footer.shp-footer .shp-footer__cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin: 0;
  padding: 30px 34px;
  border: 1px solid var(--shpf-line-strong);
  border-radius: var(--r-xl);
  background:
    radial-gradient(120% 180% at 0% 0%, rgba(37, 99, 235, 0.38) 0%, rgba(37, 99, 235, 0) 62%),
    rgba(255, 255, 255, 0.04);
}

.shp-footer.shp-footer .shp-footer__cta-text {
  min-width: 0;
}

/* max-width nollställs uttryckligen: landningssidans h2-regel sätter 17ch,
   vilket bröt rubriken mitt i ordet. Samma gäller .shp-footer__heading. */
.shp-footer.shp-footer .shp-footer__cta-title {
  max-width: none;
  margin: 0;
  color: #fff;
  font-family: var(--font-ui);
  font-size: clamp(1.4rem, 1.15rem + 0.9vw, 1.85rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.025em;
  text-transform: none;
}

.shp-footer.shp-footer .shp-footer__cta-lead {
  max-width: 56ch;
  margin: 10px 0 0;
  color: var(--shpf-muted);
  font-family: var(--font-ui);
  font-size: 0.95rem;
  font-weight: 450;
  line-height: 1.6;
  letter-spacing: normal;
}

.shp-footer.shp-footer .shp-footer__cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  min-height: 50px;
  padding: 0 26px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--blue-600) 0%, #2f76ff 100%);
  box-shadow: 0 14px 30px rgba(9, 22, 48, 0.55);
  color: #fff;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.shp-footer.shp-footer .shp-footer__cta-btn:visited,
.shp-footer.shp-footer .shp-footer__cta-btn:hover,
.shp-footer.shp-footer .shp-footer__cta-btn:focus {
  color: #fff;
}

.shp-footer.shp-footer .shp-footer__cta-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 36px rgba(9, 22, 48, 0.65);
}

.shp-footer.shp-footer .shp-footer__cta-btn:active {
  transform: translateY(1px);
}

.shp-footer.shp-footer .shp-footer__cta-btn .shp-footer__icon {
  transition: transform 0.15s ease;
}

.shp-footer.shp-footer .shp-footer__cta-btn:hover .shp-footer__icon {
  transform: translateX(3px);
}

/* ---------- Huvudrutnät ---------- */
.shp-footer.shp-footer .shp-footer__main {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 2fr);
  gap: 48px;
  margin-top: 56px;
}

.shp-footer.shp-footer .shp-footer__nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}

/* ---------- Varumärke ---------- */
.shp-footer.shp-footer .shp-footer__wordmark {
  display: inline-block;
  color: #fff;
  font-family: var(--font-ui);
  font-size: 1.45rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.035em;
  text-decoration: none;
}

.shp-footer.shp-footer .shp-footer__wordmark:visited {
  color: #fff;
}

.shp-footer.shp-footer .shp-footer__wordmark-hp {
  color: var(--shpf-accent);
}

.shp-footer.shp-footer .shp-footer__wordmark:hover .shp-footer__wordmark-hp {
  color: #fff;
}

.shp-footer.shp-footer .shp-footer__tagline {
  max-width: 34ch;
  margin: 16px 0 0;
  color: var(--shpf-muted);
  font-family: var(--font-reading);
  font-size: 0.94rem;
  font-weight: 400;
  line-height: 1.65;
  letter-spacing: normal;
}

.shp-footer.shp-footer .shp-footer__contact {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 22px;
  color: var(--shpf-ink);
  font-size: 0.94rem;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.shp-footer.shp-footer .shp-footer__contact:visited {
  color: var(--shpf-ink);
}

.shp-footer.shp-footer .shp-footer__contact:hover {
  color: var(--shpf-accent);
  border-bottom-color: var(--shpf-accent);
}

.shp-footer.shp-footer .shp-footer__icon {
  flex-shrink: 0;
  display: block;
}

/* ---------- Sociala medier ---------- */
/* Kolumn i stället för rad: de två märkena delar handle (@studerahp.se), och
   sida vid sida blev pillren olika breda och såg ojämna ut. Staplade får de
   samma bredd, med nätverket till vänster och handlet högerställt. */
.shp-footer.shp-footer .shp-footer__social {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 320px;
  margin: 24px 0 0;
  padding: 0;
}

.shp-footer.shp-footer .shp-footer__social li {
  margin: 0;
  padding: 0;
}

.shp-footer.shp-footer .shp-footer__social a {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 16px;
  border: 1px solid var(--shpf-line);
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, 0.04);
  color: var(--shpf-ink);
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease, color 0.15s ease;
}

.shp-footer.shp-footer .shp-footer__social a:visited {
  color: var(--shpf-ink);
}

.shp-footer.shp-footer .shp-footer__social a:hover {
  transform: translateY(-1px);
  border-color: var(--shpf-line-strong);
  background: rgba(124, 176, 255, 0.14);
  color: #fff;
}

.shp-footer.shp-footer .shp-footer__handle {
  margin-left: auto;
  padding-left: 12px;
  color: var(--shpf-muted);
  font-weight: 450;
}

.shp-footer.shp-footer .shp-footer__social a:hover .shp-footer__handle {
  color: var(--shpf-accent);
}

/* ---------- Länkkolumner ---------- */
.shp-footer.shp-footer .shp-footer__heading {
  max-width: none;
  margin: 0 0 16px;
  color: #fff;
  font-family: var(--font-ui);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.shp-footer.shp-footer .shp-footer__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.shp-footer.shp-footer .shp-footer__list li {
  margin: 0;
  padding: 0;
}

.shp-footer.shp-footer .shp-footer__list li + li {
  margin-top: 11px;
}

.shp-footer.shp-footer .shp-footer__list a {
  display: inline-block;
  color: var(--shpf-muted);
  font-size: 0.94rem;
  font-weight: 450;
  line-height: 1.45;
  text-decoration: none;
  transition: color 0.15s ease, transform 0.15s ease;
}

.shp-footer.shp-footer .shp-footer__list a:visited {
  color: var(--shpf-muted);
}

.shp-footer.shp-footer .shp-footer__list a:hover {
  color: #fff;
  transform: translateX(2px);
}

/* ---------- Nedersta raden ---------- */
.shp-footer.shp-footer .shp-footer__bottom {
  margin-top: 56px;
  padding-top: 26px;
  border-top: 1px solid var(--shpf-line);
}

.shp-footer.shp-footer .shp-footer__bottom-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px 28px;
}

.shp-footer.shp-footer .shp-footer__copy {
  max-width: none;
  margin: 0;
  color: var(--shpf-muted);
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 450;
  line-height: 1.5;
  letter-spacing: normal;
}

.shp-footer.shp-footer .shp-footer__legal {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
  margin: 0;
  padding: 0;
}

.shp-footer.shp-footer .shp-footer__legal li {
  margin: 0;
  padding: 0;
}

.shp-footer.shp-footer .shp-footer__legal a {
  color: var(--shpf-muted);
  font-size: 0.85rem;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.15s ease;
}

.shp-footer.shp-footer .shp-footer__legal a:visited {
  color: var(--shpf-muted);
}

.shp-footer.shp-footer .shp-footer__legal a:hover {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.shp-footer.shp-footer .shp-footer__disclaimer {
  max-width: 78ch;
  margin: 20px 0 0;
  color: rgba(169, 188, 221, 0.72);
  font-family: var(--font-reading);
  font-size: 0.78rem;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: normal;
}

/* ---------- Fokus ---------- */
.shp-footer.shp-footer a:focus-visible {
  outline: 2px solid var(--shpf-focus);
  outline-offset: 3px;
  border-radius: var(--r-sm);
}

/* ---------- Responsivt ---------- */
@media (max-width: 1024px) {
  .shp-footer.shp-footer .shp-footer__main {
    grid-template-columns: minmax(0, 1fr);
    gap: 44px;
  }

  .shp-footer.shp-footer .shp-footer__tagline {
    max-width: 52ch;
  }
}

@media (max-width: 860px) {
  .shp-footer.shp-footer .shp-footer__cta {
    flex-direction: column;
    align-items: flex-start;
    gap: 22px;
    padding: 26px 24px;
  }

  .shp-footer.shp-footer .shp-footer__cta-btn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .shp-footer.shp-footer .shp-footer__inner {
    padding: 44px 20px 32px;
  }

  .shp-footer.shp-footer .shp-footer__cta {
    border-radius: var(--r-lg);
  }

  .shp-footer.shp-footer .shp-footer__main {
    margin-top: 40px;
    gap: 36px;
  }

  /* Kolumnerna staplas: två i bredd blir för trångt för de långa
     svenska länknamnen ("Träna på högskoleprovet"). */
  .shp-footer.shp-footer .shp-footer__nav {
    grid-template-columns: minmax(0, 1fr);
    gap: 30px;
  }

  .shp-footer.shp-footer .shp-footer__col + .shp-footer__col {
    padding-top: 28px;
    border-top: 1px solid var(--shpf-line);
  }

  .shp-footer.shp-footer .shp-footer__social {
    max-width: none;
  }

  .shp-footer.shp-footer .shp-footer__social a {
    padding: 13px 16px;
  }

  /* Tumvänliga träffytor i kolumnerna. */
  .shp-footer.shp-footer .shp-footer__list li + li {
    margin-top: 4px;
  }

  .shp-footer.shp-footer .shp-footer__list a {
    padding: 6px 0;
  }

  .shp-footer.shp-footer .shp-footer__bottom {
    margin-top: 40px;
  }

  .shp-footer.shp-footer .shp-footer__bottom-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  /* Tumvänliga träffytor även för de små länkarna. */
  .shp-footer.shp-footer .shp-footer__legal {
    flex-direction: column;
    gap: 2px;
  }

  .shp-footer.shp-footer .shp-footer__legal a,
  .shp-footer.shp-footer .shp-footer__contact {
    padding: 7px 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .shp-footer.shp-footer *,
  .shp-footer.shp-footer *::before {
    transition: none !important;
  }

  .shp-footer.shp-footer .shp-footer__cta-btn:hover,
  .shp-footer.shp-footer .shp-footer__social a:hover,
  .shp-footer.shp-footer .shp-footer__list a:hover,
  .shp-footer.shp-footer .shp-footer__cta-btn:hover .shp-footer__icon {
    transform: none;
  }
}
