/* Grantigo — shared design system */
:root {
  --dark-blue: #10396B;
  --blue: #5285FF;
  --green: #59C471;
  --yellow: #F7C74C;
  --purple: #A865EB;
  --light-blue: #B1D4E1;

  --bg: #FBFBF9;
  --bg-alt: #F2F4F8;
  --ink: #0B1B33;
  --ink-2: #2A3A52;
  --muted: #5C6B82;
  --line: #E4E8EE;
  --white: #FFFFFF;

  --radius: 12px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(16,57,107,0.06);
  --shadow-md: 0 8px 24px rgba(16,57,107,0.08);
  --shadow-lg: 0 24px 60px rgba(16,57,107,0.14);

  --container: 1200px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'DM Sans', system-ui, sans-serif;
  background: var(--bg);
  color: var(--ink);
  line-height: 1.55;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; }

h1, h2, h3, h4 {
  font-family: 'Poppins', sans-serif;
  color: var(--ink);
  margin: 0;
  letter-spacing: -0.02em;
  text-wrap: balance;
}
h1 { font-size: clamp(40px, 5.4vw, 64px); font-weight: 800; line-height: 1.05; }
h2 { font-size: clamp(30px, 3.6vw, 44px); font-weight: 700; line-height: 1.1; }
h3 { font-size: 20px; font-weight: 700; line-height: 1.25; }
p { margin: 0; text-wrap: pretty; }

.eyebrow {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--blue);
}

.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 24px;
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 22px;
  border-radius: 10px;
  font-weight: 600;
  font-size: 15px;
  transition: all .18s ease;
  white-space: nowrap;
}
.btn-primary { background: var(--dark-blue); color: var(--white); }
.btn-primary:hover { background: #0a2952; transform: translateY(-1px); box-shadow: var(--shadow-md); }
.btn-secondary { background: var(--white); color: var(--ink); border: 1px solid var(--line); }
.btn-secondary:hover { border-color: var(--ink); }
.btn-ghost { color: var(--ink); padding: 14px 16px; }
.btn-ghost:hover { color: var(--blue); }
.btn-arrow { transition: transform .2s; }
.btn:hover .btn-arrow { transform: translateX(3px); }

/* ── NAV ── */
nav.top {
  position: sticky; top: 0; z-index: 50;
  background: rgba(251,251,249,0.92);
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid var(--line);
}
.nav-inner {
  height: 76px;
  display: flex;
  align-items: center;
  gap: 36px;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 24px;
}
.nav-item { position: relative; }
.nav-item > .nav-trigger {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-2);
  cursor: pointer;
  padding: 8px 0;
  transition: color .15s;
}
.nav-item > .nav-trigger:hover, .nav-item.open > .nav-trigger { color: var(--dark-blue); }
.nav-item > .nav-trigger svg { transition: transform .2s; }
.nav-item.open > .nav-trigger svg { transform: rotate(180deg); }
.nav-dropdown {
  position: absolute;
  top: calc(100% + 14px);
  left: 0;
  transform: translateY(8px);
  width: 540px;
  max-width: calc(100vw - 32px);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow-lg);
  padding: 16px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
  z-index: 100;
}
.nav-item.open .nav-dropdown {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
/* Right-anchored variant for menus near viewport's right edge (set via JS) */
.nav-item .nav-dropdown.dd-align-right {
  left: auto;
  right: 0;
}
.nav-dropdown a.dd-item {
  display: flex;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  transition: background .15s;
  min-width: 0;
}
.nav-dropdown a.dd-item:hover { background: var(--bg-alt); }
.dd-icon {
  width: 34px; height: 34px;
  border-radius: 9px;
  display: grid; place-items: center;
  color: var(--white);
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 13px;
  flex-shrink: 0;
}
.dd-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.dd-text .dd-title {
  display: block;
  font-weight: 600;
  font-size: 13.5px;
  color: var(--ink);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dd-text .dd-sub {
  display: block;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.35;
  white-space: normal;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
@media (max-width: 1000px) {
  .nav-dropdown { grid-template-columns: 1fr; width: 320px; }
}
.logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.logo img { height: 44px; width: auto; display: block; }
/* ── Cookie consent banner ── */
.cookie-banner {
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 420px;
  max-width: calc(100vw - 32px);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: 0 24px 60px rgba(11,27,51,0.18);
  padding: 28px;
  z-index: 9500;
  animation: cookie-in .35s cubic-bezier(.2,.8,.3,1);
}
@keyframes cookie-in {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.cookie-banner.cookie-closing { animation: cookie-out .22s ease forwards; }
@keyframes cookie-out {
  to { opacity: 0; transform: translateY(20px); }
}
.cookie-banner h3 {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 8px;
  color: var(--ink);
}
.cookie-banner p {
  font-size: 14px;
  color: var(--ink-2);
  line-height: 1.5;
  margin: 0 0 16px;
}
.cookie-banner p a { color: var(--blue); text-decoration: underline; }
.cookie-banner .cookie-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.cookie-banner .cookie-actions .btn {
  flex: 1;
  justify-content: center;
  padding: 12px 16px;
  font-size: 14px;
  white-space: nowrap;
}
.cookie-banner .cookie-meta {
  margin-top: 12px;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
}

/* Mobile — full-width at bottom */
@media (max-width: 480px) {
  .cookie-banner {
    left: 12px; right: 12px; bottom: 12px;
    width: auto;
    padding: 22px;
  }
}

/* Footer Grantigo logo — same image as the header, on a small light pill so the
   dark navy "Grantigo" wordmark stays readable on the dark footer. */
.foot-logo {
  display: inline-flex;
  align-items: center;
  background: var(--white);
  padding: 10px 16px;
  border-radius: 14px;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease;
  box-shadow: 0 4px 14px rgba(0,0,0,0.12);
}
.foot-logo:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(0,0,0,0.18); }
.foot-logo img {
  height: 44px;
  width: auto;
  display: block;
}
.nav-links { display: flex; gap: 28px; align-items: center; flex-wrap: nowrap; white-space: nowrap; }
.nav-links a {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-2);
  transition: color .15s;
}
.nav-links a:hover { color: var(--dark-blue); }
.nav-links a.active { color: var(--dark-blue); font-weight: 600; }
.nav-cta { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.nav-cta .btn { padding: 10px 18px; font-size: 14px; }

/* Hamburger button — visible only ≤1024px (covers iPad portrait + mobile) */
.nav-burger {
  display: none;
  width: 44px; height: 44px;
  border: 0; background: transparent;
  cursor: pointer;
  padding: 0;
  position: relative;
  margin-left: 4px;
}
.nav-burger span {
  position: absolute;
  left: 10px; right: 10px;
  height: 2px;
  background: var(--ink);
  border-radius: 2px;
  transition: transform .25s ease, opacity .15s ease, top .25s ease;
}
.nav-burger span:nth-child(1) { top: 14px; }
.nav-burger span:nth-child(2) { top: 21px; }
.nav-burger span:nth-child(3) { top: 28px; }
.nav-burger[aria-expanded="true"] span:nth-child(1) { top: 21px; transform: rotate(45deg); }
.nav-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-burger[aria-expanded="true"] span:nth-child(3) { top: 21px; transform: rotate(-45deg); }

@media (max-width: 1024px) {
  .nav-burger { display: block; }
  .hide-md { display: none; }
}

/* Mobile panel — slides over content from below the sticky header */
.nav-mobile {
  position: fixed;
  top: 76px; left: 0; right: 0;
  height: calc(100vh - 76px);
  background: var(--white);
  z-index: 49;
  overflow-y: auto;
  padding: 8px 24px 40px;
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.nav-mobile.open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.nav-mobile-inner > a,
.nav-mobile-group > summary {
  display: block;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 18px;
  font-weight: 500;
  color: var(--ink);
  text-decoration: none;
  cursor: pointer;
  list-style: none;
  position: relative;
}
.nav-mobile-inner > a:hover { color: var(--blue); }
.nav-mobile-group { border-bottom: 1px solid var(--line); }
.nav-mobile-group > summary::-webkit-details-marker { display: none; }
.nav-mobile-group > summary { border-bottom: 0; }
.nav-mobile-group > summary::after {
  content: '';
  position: absolute;
  right: 4px; top: 50%;
  width: 8px; height: 8px;
  border-right: 2px solid var(--muted);
  border-bottom: 2px solid var(--muted);
  transform: translateY(-65%) rotate(45deg);
  transition: transform .2s ease;
}
.nav-mobile-group[open] > summary::after {
  transform: translateY(-35%) rotate(-135deg);
}
.nav-mobile-sub {
  display: grid;
  gap: 0;
  padding: 4px 0 16px 18px;
  border-left: 2px solid var(--bg-alt);
  margin-bottom: 8px;
}
.nav-mobile-sub a {
  display: block;
  padding: 12px 0;
  font-size: 15.5px;
  color: var(--ink-2);
  text-decoration: none;
}
.nav-mobile-sub a:hover { color: var(--blue); }
.nav-mobile-cta {
  margin-top: 24px;
  display: grid;
  gap: 10px;
}
.nav-mobile-cta .btn {
  width: 100%;
  justify-content: center;
  padding: 14px 22px;
  font-size: 15px;
}

/* Hide mobile panel above breakpoint regardless of state */
@media (min-width: 1025px) {
  .nav-mobile { display: none !important; }
}

/* ── Language switcher (desktop) ── */
.nav-item.lang-item { margin-right: 4px; }
.lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  color: var(--ink-2);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all .15s ease;
}
.lang-switch:hover {
  border-color: var(--ink);
  color: var(--ink);
}
.lang-switch .lang-flag { font-size: 14px; line-height: 1; }
.lang-switch svg { color: var(--muted); transition: transform .2s; }
.nav-item.lang-item.open .lang-switch svg { transform: rotate(180deg); }

/* Language dropdown is narrower than the segments dropdown */
.lang-dropdown {
  width: 240px !important;
  grid-template-columns: 1fr !important;
  left: auto !important;
  right: 0;
  transform: translateX(0) translateY(8px) !important;
}
.nav-item.lang-item.open .lang-dropdown {
  transform: translateX(0) translateY(0) !important;
}
.lang-flag-icon {
  background: var(--bg-alt) !important;
  font-size: 18px;
  color: var(--ink) !important;
}

@media (max-width: 480px) {
  .lang-switch .lang-current { display: none; }
}
@media (max-width: 1024px) {
  .nav-links { display: none; }
  .nav-item.lang-item { display: none; }
}

/* ── Language switcher (mobile) ── */
.nav-mobile-lang {
  display: flex;
  gap: 8px;
  margin-top: 24px;
  padding: 8px 0;
}
.nav-mobile-lang-btn {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--white);
  color: var(--ink-2);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: all .15s ease;
}
.nav-mobile-lang-btn:hover {
  border-color: var(--ink);
  color: var(--ink);
}
.nav-mobile-lang-btn.active {
  background: var(--dark-blue);
  color: var(--white);
  border-color: var(--dark-blue);
}
.nav-mobile-lang-btn span:first-child { font-size: 18px; line-height: 1; }

/* ── SECTIONS ── */
section { padding: 100px 0; }
.section-head { max-width: 720px; margin-bottom: 56px; }
.section-head .eyebrow { display: inline-block; margin-bottom: 14px; }
.section-head p { color: var(--ink-2); font-size: 18px; margin-top: 16px; }
.section-head.center { margin-left: auto; margin-right: auto; text-align: center; }

/* ── PAGE HERO (smaller than home hero) ── */
.page-hero {
  position: relative;
  padding: 80px 0 64px;
  overflow: hidden;
}
.page-hero::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(800px 500px at 80% 0%, rgba(82,133,255,0.08), transparent 60%),
    radial-gradient(600px 400px at 0% 100%, rgba(89,196,113,0.06), transparent 60%);
  pointer-events: none;
}
.page-hero .container { position: relative; }
.page-hero h1 { font-size: clamp(36px, 4.6vw, 56px); }
.page-hero .lede {
  font-size: 19px;
  color: var(--ink-2);
  margin: 24px 0 32px;
  max-width: 640px;
}
.page-hero .breadcrumb {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 16px;
  letter-spacing: 0.06em;
}
.page-hero .breadcrumb a { color: var(--blue); }

/* ── COMMON CARD GRID ── */
.cards-3, .cards-2, .cards-4 {
  display: grid;
  gap: 20px;
}
.cards-3 { grid-template-columns: repeat(3, 1fr); }
.cards-2 { grid-template-columns: repeat(2, 1fr); }
.cards-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 960px) { .cards-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .cards-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .cards-3, .cards-2, .cards-4 { grid-template-columns: 1fr; } }

.card {
  padding: 28px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  display: flex; flex-direction: column; gap: 12px;
  transition: all .2s;
}
.card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--blue); }
.card .tag {
  align-self: flex-start;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(82,133,255,0.1);
  color: var(--blue);
}
.card h3 { margin-bottom: 4px; }
.card p { color: var(--ink-2); font-size: 14.5px; }
.card .meta {
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  font-size: 13px;
  color: var(--muted);
}
.card .meta strong { color: var(--ink); font-weight: 600; }
.card a.more {
  color: var(--blue);
  font-weight: 600;
  font-size: 14px;
  margin-top: 8px;
}

/* ── DARK SECTIONS ── */
.dark-section {
  background: var(--ink);
  color: var(--white);
  position: relative;
  overflow: hidden;
}
.dark-section::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(2px 2px at 12% 18%, rgba(255,255,255,0.5), transparent 50%),
    radial-gradient(1.5px 1.5px at 28% 70%, rgba(255,255,255,0.4), transparent 50%),
    radial-gradient(2px 2px at 64% 32%, rgba(255,255,255,0.45), transparent 50%),
    radial-gradient(1px 1px at 82% 78%, rgba(255,255,255,0.5), transparent 50%),
    radial-gradient(1.5px 1.5px at 48% 12%, rgba(255,255,255,0.35), transparent 50%),
    radial-gradient(2px 2px at 92% 22%, rgba(255,255,255,0.4), transparent 50%),
    radial-gradient(1px 1px at 6% 60%, rgba(255,255,255,0.5), transparent 50%);
  pointer-events: none;
}
.dark-section .container { position: relative; }
.dark-section h1, .dark-section h2, .dark-section h3 { color: var(--white); }
.dark-section .eyebrow { color: var(--yellow); }
.dark-section p { color: rgba(255,255,255,0.78); }

/* ── CHECK LIST ── */
.checks { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 14px; }
.checks li {
  display: flex; align-items: flex-start; gap: 12px;
  color: var(--ink-2); font-size: 15px;
}
.checks svg { color: var(--green); flex-shrink: 0; margin-top: 3px; }
.dark-section .checks li { color: rgba(255,255,255,0.85); }

/* ── PILLS / BADGES ── */
.sec-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
  color: var(--ink-2);
  font-weight: 500;
  background: var(--white);
}
.sec-pill svg { color: var(--green); }
.pill-row { display: flex; flex-wrap: wrap; gap: 12px; }

/* ── FORMS (shared) ── */
.field { margin-bottom: 16px; }
.field label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-2);
  margin-bottom: 6px;
}
.field input, .field select, .field textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font: inherit;
  font-size: 14.5px;
  color: var(--ink);
  background: var(--white);
  transition: border-color .15s, box-shadow .15s;
}
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(82,133,255,0.15);
}
.field textarea { resize: vertical; min-height: 96px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .field-row { grid-template-columns: 1fr; } }
.form-card {
  background: var(--white);
  color: var(--ink);
  border-radius: var(--radius-lg);
  padding: 32px;
  box-shadow: var(--shadow-md);
  border: 1px solid var(--line);
}
.form-card .btn { width: 100%; justify-content: center; padding: 14px; }
.form-success, .form-error {
  margin-top: 14px; padding: 12px 14px; border-radius: 10px;
  font-size: 14px; display: none;
}
.form-success { background: rgba(89,196,113,0.12); color: #2f7a44; border: 1px solid rgba(89,196,113,0.4); }
.form-error { background: rgba(249,97,103,0.1); color: #b03a3f; border: 1px solid rgba(249,97,103,0.3); }
.form-success.show, .form-error.show { display: block; }
.form-note { font-size: 12px; color: var(--muted); margin-top: 14px; text-align: center; }
.form-title { font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 22px; margin-bottom: 4px; }
.form-sub { font-size: 14px; color: var(--muted); margin-bottom: 24px; }

/* ── STATS ── */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
@media (max-width: 760px) { .stats-grid { grid-template-columns: repeat(2, 1fr); } }
.stat .num {
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  font-size: clamp(32px, 4vw, 44px);
  color: var(--dark-blue);
  line-height: 1;
  margin-bottom: 8px;
  letter-spacing: -0.03em;
}
.stat .label { font-size: 14px; color: var(--muted); line-height: 1.45; }

/* ── CTA STRIP ── */
.cta-strip {
  background: linear-gradient(160deg, var(--dark-blue) 0%, #0a2244 100%);
  color: var(--white);
  text-align: center;
  padding: 80px 0;
  position: relative;
  overflow: hidden;
}
.cta-strip::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(2px 2px at 14% 22%, rgba(255,255,255,0.5), transparent 50%),
    radial-gradient(1.5px 1.5px at 78% 60%, rgba(255,255,255,0.4), transparent 50%),
    radial-gradient(2px 2px at 38% 78%, rgba(255,255,255,0.4), transparent 50%);
}
.cta-strip .container { position: relative; }
.cta-strip h2 { color: var(--white); }
.cta-strip p { color: rgba(255,255,255,0.78); font-size: 18px; margin: 16px auto 28px; max-width: 560px; }
.cta-strip .btn-primary { background: var(--white); color: var(--dark-blue); }
.cta-strip .btn-primary:hover { background: var(--bg); }
.cta-strip .btn-secondary { background: transparent; color: var(--white); border-color: rgba(255,255,255,0.3); }
.cta-strip .btn-secondary:hover { border-color: var(--white); }
.cta-strip .btns { display: inline-flex; gap: 12px; flex-wrap: wrap; justify-content: center; }

/* ── FOOTER ── */
footer.site {
  background: var(--ink);
  color: rgba(255,255,255,0.75);
  padding: 64px 0 32px;
  font-size: 14px;
}
.foot-newsletter {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 32px;
  align-items: center;
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
@media (max-width: 760px) { .foot-newsletter { grid-template-columns: 1fr; gap: 18px; } }
.foot-news-copy h4 {
  color: var(--white);
  font-size: 18px;
  letter-spacing: 0;
  text-transform: none;
  font-family: inherit;
  font-weight: 700;
  margin-bottom: 8px;
}
.foot-news-copy p { color: rgba(255,255,255,0.65); margin: 0; max-width: 380px; }
.foot-news-form {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 10px;
}
@media (max-width: 560px) { .foot-news-form { grid-template-columns: 1fr; } }
.foot-news-form input[type=text],
.foot-news-form input[type=email],
.foot-news-form select {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 8px;
  padding: 11px 13px;
  color: var(--white);
  font-size: 14px;
  font-family: inherit;
  width: 100%;
}
.foot-news-form input::placeholder { color: rgba(255,255,255,0.5); }
.foot-news-form select { color: rgba(255,255,255,0.7); }
.foot-news-form select option { color: #0B1B33; }
.foot-news-form input[type=email] { grid-column: span 1; }
.foot-news-form .btn { white-space: nowrap; }
.foot-news-form .form-success,
.foot-news-form .form-error {
  display: none;
  grid-column: 1 / -1;
  font-size: 13.5px;
  padding: 8px 2px 0;
}
.foot-news-form .form-success { color: #8FE3A3; }
.foot-news-form .form-error { color: #FFB4B4; }
.foot-news-form .form-success.show,
.foot-news-form .form-error.show { display: block; }
.foot-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 40px;
  margin-bottom: 48px;
}
@media (max-width: 760px) { .foot-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .foot-grid { grid-template-columns: 1fr; } }
footer.site h4 {
  color: var(--white);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 16px;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 500;
}
footer.site ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
footer.site ul a { color: rgba(255,255,255,0.7); transition: color .15s; }
footer.site ul a:hover { color: var(--white); }
.foot-tagline { color: rgba(255,255,255,0.65); margin: 14px 0 20px; max-width: 320px; }
.foot-bottom {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 24px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 13px;
  color: rgba(255,255,255,0.55);
}

/* utils */
.hide-sm { }
@media (max-width: 600px) { .hide-sm { display: none; } }
.muted { color: var(--muted); }
.center { text-align: center; }
.lede { font-size: 18px; color: var(--ink-2); max-width: 640px; }
.gap-sm { gap: 8px; }

/* split layout */
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}
@media (max-width: 900px) { .split { grid-template-columns: 1fr; gap: 40px; } }
.split.tight { gap: 40px; }

/* pretty image */
.frame {
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 4 / 3;
  box-shadow: var(--shadow-md);
}
.frame img { width: 100%; height: 100%; object-fit: cover; }

/* ── floating KPI tile (overlays segment-hero images) ── */
.frame-wrap { position: relative; }
.kpi-float {
  position: absolute;
  bottom: 24px; left: -20px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 20px;
  box-shadow: 0 16px 40px rgba(11,27,51,0.18);
  z-index: 2;
  max-width: 280px;
  display: flex; align-items: center; gap: 14px;
}
.kpi-float .icon {
  width: 38px; height: 38px;
  border-radius: 10px;
  display: grid; place-items: center;
  flex-shrink: 0;
  color: var(--white);
  font-family: 'Poppins', sans-serif; font-weight: 800; font-size: 13px;
}
.kpi-float .num {
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  font-size: 20px; line-height: 1.1;
  color: var(--dark-blue);
  letter-spacing: -0.02em;
}
.kpi-float .lab { font-size: 12px; color: var(--muted); margin-top: 3px; }
.kpi-float-tr {
  position: absolute;
  top: 22px; right: -16px;
  background: rgba(11,27,51,0.94);
  color: var(--white);
  padding: 11px 16px;
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(11,27,51,0.22);
  z-index: 2;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11.5px; letter-spacing: 0.04em;
  display: flex; align-items: center; gap: 8px;
}
.kpi-float-tr .dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 4px rgba(89,196,113,0.25);
}
@media (max-width: 600px) {
  .kpi-float { left: 8px; bottom: 8px; max-width: 240px; padding: 12px 14px; }
  .kpi-float-tr { right: 8px; top: 8px; }
}

/* prose */
.prose { max-width: 720px; }
.prose h2 { margin-top: 48px; margin-bottom: 16px; }
.prose h3 { margin-top: 32px; margin-bottom: 8px; }
.prose p { margin-bottom: 16px; color: var(--ink-2); font-size: 16px; }
.prose ul { padding-left: 20px; margin-bottom: 16px; color: var(--ink-2); }
.prose ul li { margin-bottom: 8px; }
.prose strong { color: var(--ink); }

/* ── Newsletter / lead-magnet popup ── */
.g-popup {
  position: fixed;
  bottom: 24px; right: 24px;
  width: 360px; max-width: calc(100vw - 32px);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 24px;
  z-index: 9000;
  animation: g-popup-in .35s cubic-bezier(.2,.8,.3,1);
}
@keyframes g-popup-in {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.g-popup.g-popup-closing { animation: g-popup-out .22s ease forwards; }
@keyframes g-popup-out {
  to { opacity: 0; transform: translateY(20px); }
}
.g-popup-close {
  position: absolute; top: 8px; right: 12px;
  background: transparent; border: 0;
  color: var(--muted); cursor: pointer;
  font-size: 24px; line-height: 1;
  width: 28px; height: 28px;
  border-radius: 50%;
  transition: background .15s, color .15s;
}
.g-popup-close:hover { background: var(--bg-alt); color: var(--ink); }
.g-popup-eyebrow {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--blue);
  margin-bottom: 6px;
}
.g-popup-title {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 19px;
  line-height: 1.3;
  margin: 0 0 8px;
  letter-spacing: -0.01em;
}
.g-popup-body {
  font-size: 14px; color: var(--ink-2);
  margin: 0 0 14px; line-height: 1.5;
}
.g-popup-form { display: flex; flex-direction: column; gap: 8px; }
.g-popup-form input {
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px;
  font: inherit; font-size: 14px; color: var(--ink); background: var(--white);
}
.g-popup-form input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(82,133,255,0.15); }
.g-popup-form .btn { justify-content: center; padding: 10px 16px; font-size: 14px; }

@media (max-width: 480px) {
  .g-popup { left: 16px; right: 16px; bottom: 16px; width: auto; padding: 20px; }
}

/* ── form-success / form-error / form-download (used inside any data-grantigo-form) ── */
form .form-success, form .form-error, form .form-download {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 13.5px;
  display: none;
}
form .form-success { background: rgba(89,196,113,0.12); color: #2f7a44; border: 1px solid rgba(89,196,113,0.3); }
form .form-error   { background: rgba(249,97,103,0.10); color: #b03a3f; border: 1px solid rgba(249,97,103,0.3); }
form .form-download { background: rgba(82,133,255,0.08); color: var(--ink); border: 1px solid rgba(82,133,255,0.2); }
form .form-success.show, form .form-error.show, form .form-download.show { display: block; }

/* ─────────────────────────────────────────────────────────
   KAMPANJ 2026 — nationella, indexerbara kampanjsidor.
   Hub: /kampanj/start.html  Segment: /kampanj/<segment>.html
   ───────────────────────────────────────────────────────── */

/* Per-segment accent — overridden inline per page via --kseg-accent */
.kampanj-page { --kseg-accent: var(--blue); --kseg-accent-soft: rgba(82,133,255,0.10); --kseg-ink: var(--white); }

/* "Fortsätt där du var"-pill on /kampanj/start */
[data-segment-pill] { display: flex; justify-content: center; margin: 0 0 18px; }
[data-segment-pill][data-segment-pill-active="1"] { animation: kpFadeIn .35s ease-out; }
.kampanj-pill {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--white); border: 1px solid var(--line);
  border-radius: 999px; padding: 8px 16px;
  font-size: 13.5px; color: var(--ink);
  box-shadow: var(--shadow-sm);
  transition: transform .15s ease, box-shadow .15s ease;
}
.kampanj-pill:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); border-color: var(--blue); }
.kampanj-pill-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--green); box-shadow: 0 0 0 3px rgba(89,196,113,0.22);
}
.kampanj-pill-arrow { color: var(--blue); font-weight: 700; }
.kampanj-pill-reset {
  display: inline-flex; align-items: center;
  margin-left: 10px; padding: 6px 12px;
  font-size: 12px; color: var(--muted);
  border: 1px dashed var(--line); border-radius: 999px;
  background: transparent; text-decoration: none;
  transition: color .15s ease, border-color .15s ease;
}
.kampanj-pill-reset:hover { color: var(--ink); border-color: var(--blue); }

@keyframes kpFadeIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* Selector-hub hero */
.kp-hub-hero { padding: 80px 0 50px; background: linear-gradient(180deg, var(--bg) 0%, var(--bg-alt) 100%); }
.kp-hub-hero .head { max-width: 760px; margin: 0 auto; text-align: center; }
.kp-hub-hero h1 { font-size: clamp(34px, 5vw, 56px); margin: 14px 0 18px; line-height: 1.06; }
.kp-hub-hero .lede { color: var(--ink-2); font-size: 17.5px; line-height: 1.6; }
.kp-hub-hero .trust {
  margin: 26px auto 0; display: inline-flex; flex-wrap: wrap; gap: 18px 26px; justify-content: center;
  font-size: 13.5px; color: var(--muted);
}
.kp-hub-hero .trust .ti { display: inline-flex; align-items: center; gap: 6px; }
.kp-hub-hero .trust svg { color: var(--green); flex-shrink: 0; }

/* Selector grid (4–3 responsive) */
.kp-selector { padding: 30px 0 80px; }
.kp-selector-grid {
  display: grid; gap: 18px;
  grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 1100px) { .kp-selector-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 820px)  { .kp-selector-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px)  { .kp-selector-grid { grid-template-columns: 1fr; } }
.kp-card {
  position: relative;
  display: flex; flex-direction: column; gap: 10px;
  background: var(--white); border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 22px 22px 24px;
  box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  color: inherit;
  overflow: hidden;
}
.kp-card::before {
  content: ''; position: absolute; left: 0; top: 0; right: 0; height: 5px;
  background: var(--kp-accent, var(--blue));
}
.kp-card:hover { transform: translateY(-4px); border-color: var(--kp-accent, var(--blue)); box-shadow: var(--shadow-md); }
.kp-card .kp-eyebrow {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--kp-accent, var(--blue));
  font-weight: 500;
  margin-top: 4px;
}
.kp-card h3 { font-size: 19px; line-height: 1.2; }
.kp-card p { color: var(--ink-2); font-size: 14.5px; line-height: 1.5; }
.kp-card .kp-card-cta {
  margin-top: auto; padding-top: 10px;
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--kp-accent, var(--blue));
  font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 14px;
}
.kp-card:hover .kp-card-cta { gap: 10px; }

/* Hub stats + FAQ shared */
.kp-stats { padding: 64px 0; background: var(--white); border-top: 1px solid var(--line); }
.kp-stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; text-align: center; max-width: 920px; margin: 0 auto; }
@media (max-width: 720px) { .kp-stats-grid { grid-template-columns: 1fr; gap: 18px; } }
.kp-stat .n { font-family: 'Poppins', sans-serif; font-weight: 800; font-size: clamp(32px, 4vw, 46px); color: var(--ink); letter-spacing: -0.02em; }
.kp-stat .l { color: var(--ink-2); font-size: 14.5px; margin-top: 4px; }

.kp-faq { padding: 70px 0 90px; background: var(--bg-alt); }
.kp-faq .head { text-align: center; max-width: 720px; margin: 0 auto 28px; }
.kp-faq h2 { font-size: clamp(26px, 3vw, 36px); margin-bottom: 10px; }
.kp-faq .head p { color: var(--ink-2); font-size: 16px; }
.kp-faq-list { max-width: 820px; margin: 0 auto; display: grid; gap: 10px; }
.kp-faq details {
  background: var(--white); border: 1px solid var(--line); border-radius: 12px;
  padding: 14px 18px; transition: border-color .15s;
}
.kp-faq details[open] { border-color: var(--blue); box-shadow: var(--shadow-sm); }
.kp-faq summary {
  cursor: pointer; list-style: none;
  font-family: 'Poppins', sans-serif; font-weight: 600;
  font-size: 16px; color: var(--ink);
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.kp-faq summary::-webkit-details-marker { display: none; }
.kp-faq summary::after { content: '+'; font-weight: 700; font-size: 22px; color: var(--blue); transition: transform .15s; line-height: 1; }
.kp-faq details[open] summary::after { content: '−'; }
.kp-faq details p { margin-top: 10px; color: var(--ink-2); font-size: 15px; line-height: 1.6; }

/* ── SEGMENT-PAGE: hero, steps, examples, problem/solution, final CTA ── */
.kp-seg-hero { padding: 80px 0 70px; background: linear-gradient(180deg, var(--kseg-accent-soft) 0%, var(--bg) 100%); }
.kp-seg-hero .grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 48px; align-items: center; }
@media (max-width: 900px) { .kp-seg-hero .grid { grid-template-columns: 1fr; gap: 28px; } }
.kp-seg-hero .crumb { font-family: 'JetBrains Mono', monospace; font-size: 11.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.kp-seg-hero .crumb a { color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.kp-seg-hero .eyebrow { color: var(--kseg-accent); margin-top: 16px; display: inline-block; }
.kp-seg-hero h1 { font-size: clamp(34px, 5vw, 54px); line-height: 1.05; margin: 12px 0 18px; }
.kp-seg-hero h1 .accent { color: var(--kseg-accent); }
.kp-seg-hero .lede { color: var(--ink-2); font-size: 18px; line-height: 1.6; max-width: 560px; }
.kp-seg-hero .ctas { margin-top: 28px; display: flex; gap: 12px; flex-wrap: wrap; }
.kp-seg-hero .ctas .btn-primary { background: var(--kseg-accent); color: var(--kseg-ink); }
.kp-seg-hero .ctas .btn-primary:hover { filter: brightness(0.94); }
.kp-seg-hero .seg-callout {
  background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 26px; box-shadow: var(--shadow-md);
}
.kp-seg-hero .seg-callout .label {
  font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--kseg-accent); font-weight: 500;
}
.kp-seg-hero .seg-callout h3 { font-size: 19px; margin: 6px 0 14px; }
.kp-seg-hero .seg-callout ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; font-size: 14.5px; color: var(--ink-2); }
.kp-seg-hero .seg-callout li { display: flex; gap: 10px; align-items: flex-start; line-height: 1.45; }
.kp-seg-hero .seg-callout li::before {
  content: ''; flex-shrink: 0; margin-top: 5px;
  width: 12px; height: 12px; border-radius: 50%; background: var(--kseg-accent);
  box-shadow: 0 0 0 3px var(--kseg-accent-soft);
}

.kp-strip { padding: 36px 0; background: var(--ink); color: var(--white); }
.kp-strip-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; text-align: center; max-width: 920px; margin: 0 auto; }
@media (max-width: 720px) { .kp-strip-grid { grid-template-columns: 1fr; gap: 14px; } }
.kp-strip .n { font-family: 'Poppins', sans-serif; font-weight: 800; font-size: 30px; color: var(--white); letter-spacing: -0.02em; }
.kp-strip .l { color: rgba(255,255,255,0.7); font-size: 13.5px; margin-top: 2px; }

.kp-howto { padding: 90px 0; background: var(--bg-alt); }
.kp-howto .head { text-align: center; max-width: 720px; margin: 0 auto 40px; }
.kp-howto h2 { font-size: clamp(28px, 3.2vw, 38px); margin: 10px 0 14px; }
.kp-howto .head p { color: var(--ink-2); font-size: 16.5px; line-height: 1.55; }
.kp-howto-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; counter-reset: kpstep; }
@media (max-width: 1000px) { .kp-howto-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .kp-howto-grid { grid-template-columns: 1fr; } }
.kp-howto-step { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 26px 22px; transition: transform .2s, border-color .2s, box-shadow .2s; }
.kp-howto-step:hover { transform: translateY(-3px); border-color: var(--kseg-accent); box-shadow: var(--shadow-md); }
.kp-howto-step .num {
  counter-increment: kpstep;
  width: 38px; height: 38px; border-radius: 10px;
  background: var(--kseg-accent); color: var(--kseg-ink);
  display: grid; place-items: center;
  font-family: 'Poppins', sans-serif; font-weight: 800; font-size: 16px;
  margin-bottom: 14px;
}
.kp-howto-step .num::before { content: counter(kpstep); }
.kp-howto-step h3 { font-size: 17px; margin-bottom: 8px; }
.kp-howto-step p { color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }
.kp-howto-step .meta {
  margin-top: 14px;
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--kseg-accent);
}

.kp-examples { padding: 80px 0; background: var(--white); }
.kp-examples .head { text-align: center; max-width: 720px; margin: 0 auto 30px; }
.kp-examples h2 { font-size: clamp(26px, 3vw, 34px); margin: 8px 0 12px; }
.kp-examples .head p { color: var(--ink-2); font-size: 16px; }
.kp-chips { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; max-width: 920px; margin: 0 auto; }
.kp-chip {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--bg-alt); border: 1px solid var(--line);
  padding: 10px 14px; border-radius: 999px;
  font-size: 13.5px; color: var(--ink);
}
.kp-chip-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--kseg-accent); }

.kp-ps { padding: 80px 0; background: var(--bg-alt); }
.kp-ps h2 { text-align: center; margin-bottom: 32px; font-size: clamp(24px, 2.8vw, 32px); }
.kp-ps-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; max-width: 980px; margin: 0 auto; }
@media (max-width: 760px) { .kp-ps-grid { grid-template-columns: 1fr; } }
.kp-ps-col { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 28px; }
.kp-ps-col h3 { font-size: 18px; margin-bottom: 14px; }
.kp-ps-col.bad h3 { color: #b13a35; }
.kp-ps-col.good h3 { color: #2f7a44; }
.kp-ps-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.kp-ps-col li { padding-left: 24px; position: relative; font-size: 15px; color: var(--ink-2); line-height: 1.5; }
.kp-ps-col.bad li::before  { content: '✕'; position: absolute; left: 0; color: #b13a35; font-weight: 700; }
.kp-ps-col.good li::before { content: '✓'; position: absolute; left: 0; color: #2f7a44; font-weight: 700; }

.kp-final { padding: 90px 0 70px; background: var(--white); text-align: center; }
.kp-final h2 { font-size: clamp(28px, 3.4vw, 40px); margin-bottom: 16px; }
.kp-final p.intro { color: var(--ink-2); max-width: 580px; margin: 0 auto 26px; font-size: 17px; line-height: 1.55; }
.kp-final .btn-big {
  display: inline-block;
  background: var(--kseg-accent); color: var(--kseg-ink);
  padding: 18px 36px; border-radius: 14px;
  font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 17px;
  letter-spacing: 0.01em;
  box-shadow: 0 14px 28px rgba(16,57,107,0.12);
  transition: transform .15s, box-shadow .15s, filter .15s;
}
.kp-final .btn-big:hover { transform: translateY(-2px); box-shadow: 0 18px 36px rgba(16,57,107,0.18); filter: brightness(0.95); }

.kp-news {
  background: var(--bg-alt); border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 30px 32px; max-width: 640px; margin: 38px auto 0; text-align: left;
}
.kp-news h3 { font-size: 18px; margin-bottom: 8px; text-align: center; }
.kp-news p.sub { color: var(--ink-2); font-size: 14px; text-align: center; margin-bottom: 18px; }
.kp-news form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 540px) { .kp-news form { grid-template-columns: 1fr; } }
.kp-news input {
  padding: 13px 14px; border: 1px solid var(--line); border-radius: 10px;
  font-family: 'DM Sans', sans-serif; font-size: 15px; background: var(--white); color: var(--ink);
}
.kp-news input:focus { outline: none; border-color: var(--kseg-accent); }
.kp-news button {
  grid-column: 1 / -1;
  background: var(--kseg-accent); color: var(--kseg-ink); border: 0;
  padding: 14px; border-radius: 10px;
  font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 15px;
  cursor: pointer;
}
.kp-news button:hover { filter: brightness(0.94); }
.kp-news .form-success, .kp-news .form-error { grid-column: 1 / -1; }
form .form-download a { color: var(--blue); font-weight: 600; }

/* ============================================================
   /jamfor  (comparison)  +  /trendspaning  (Bidragsspanen)
   Namespaced .jf-* and .ts-*. Added June 2026.
   ============================================================ */

/* --- Shared small bits --- */
.cmp-cta {
  margin-top: 48px; text-align: center; padding: 48px 24px;
  background: linear-gradient(100deg, var(--dark-blue), #1b4f8f);
  border-radius: var(--radius-lg); color: var(--white);
}
.cmp-cta h2 { color: var(--white); margin: 0 0 8px; font-size: 26px; }
.cmp-cta p { max-width: 540px; margin: 0 auto 20px; color: #d6e4ff; font-size: 15px; }
.cmp-cta .btn-primary { background: var(--white); color: var(--dark-blue); }
.cmp-cta .btn-primary:hover { background: #f0f4fb; }
.cmp-cta--soft { background: var(--bg-alt); color: var(--ink); }
.cmp-cta--soft h2 { color: var(--ink); }
.cmp-cta--soft p { color: var(--muted); }
.cmp-cta--soft .btn-primary { background: var(--dark-blue); color: var(--white); }
.cmp-cta--soft .btn-primary:hover { background: #0a2952; }

/* --- Jämför table --- */
.jf-fair {
  margin: 18px 0 0; padding: 14px 18px;
  background: rgba(89,196,113,0.08); border-left: 3px solid var(--green);
  border-radius: 0 10px 10px 0; font-size: 15px; line-height: 1.55; color: var(--ink-2);
}
.jf-table-wrap { margin: 8px 0 0; overflow-x: auto; }
.jf-table { width: 100%; border-collapse: collapse; min-width: 900px; font-size: 15px; }
.jf-table th, .jf-table td {
  padding: 14px 16px; text-align: center; vertical-align: top;
  border-bottom: 1px solid var(--line);
}
.jf-table thead th {
  font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 15px;
  color: var(--ink); border-bottom: 2px solid var(--line); padding-bottom: 16px;
}
.jf-table .row-label { text-align: left; font-weight: 600; color: var(--ink); width: 30%; min-width: 200px; }
.jf-table tbody .row-label { font-weight: 500; color: var(--ink-2); }
.jf-table th.hl, .jf-table td.hl { background: rgba(82,133,255,0.08); }
.jf-table thead th.hl { color: var(--dark-blue); border-bottom-color: var(--dark-blue); }
.jf-badge {
  display: block; margin-top: 4px; font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em; color: var(--blue);
}
.jf-col-link { color: var(--ink); text-decoration: none; border-bottom: 1px dotted var(--muted); }
.jf-col-link:hover { color: var(--blue); border-bottom-color: var(--blue); }
.jf-sym { display: block; font-size: 18px; font-weight: 700; line-height: 1.2; }
.jf-sym-yes { color: var(--green); }
.jf-sym-no { color: var(--muted); }
.jf-sym-partial { color: var(--blue); }
.jf-note { display: block; margin-top: 4px; font-size: 13px; line-height: 1.4; color: var(--muted); }
.cell-text .jf-note { margin-top: 0; color: var(--ink); font-weight: 500; }
.jf-legend { display: flex; flex-wrap: wrap; gap: 20px; margin: 16px 0 0; font-size: 13px; color: var(--muted); }
.jf-legend b { color: var(--ink); }
.jf-more { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; margin: 20px 0 0; font-size: 14px; }
.jf-more .lbl { font-weight: 700; color: var(--muted); text-transform: uppercase; font-size: 11px; letter-spacing: 0.05em; }
.jf-more a { color: var(--dark-blue); font-weight: 600; text-decoration: none; }
.jf-more a:hover { text-decoration: underline; }
.jf-wedge { margin: 48px 0 0; background: var(--bg-alt); border-radius: var(--radius-lg); padding: 32px; }
.jf-wedge h2 { margin: 0 0 12px; font-size: 24px; }
.jf-wedge > p { max-width: 720px; margin: 0 0 20px; color: var(--ink-2); line-height: 1.6; font-size: 15px; }
.jf-wedge ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.jf-wedge li { position: relative; padding-left: 28px; color: var(--ink-2); line-height: 1.5; font-size: 15px; }
.jf-wedge li::before { content: '✓'; position: absolute; left: 0; top: 0; color: var(--green); font-weight: 700; }
.jf-wedge li b { color: var(--ink); }

/* --- Jämför detail --- */
.jf-facts { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.jf-facts-head, .jf-facts-row { display: grid; grid-template-columns: 1fr 1.3fr 1.3fr; gap: 16px; padding: 14px 20px; }
.jf-facts-head { background: var(--bg-alt); border-bottom: 1px solid var(--line); font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 15px; }
.jf-facts-head .col.g, .jf-fval.g { color: var(--dark-blue); }
.jf-facts-row { border-bottom: 1px solid var(--line); font-size: 15px; line-height: 1.5; }
.jf-facts-row:last-child { border-bottom: 0; }
.jf-flabel { font-weight: 600; color: var(--ink-2); }
.jf-fval { color: var(--ink); }
.jf-fval.g { font-weight: 500; }
.jf-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 24px 0 0; }
.jf-card { border-radius: 16px; padding: 24px; }
.jf-card h2 { font-size: 18px; margin: 0 0 14px; }
.jf-card ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.jf-card li { position: relative; padding-left: 24px; font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.jf-card.strengths { background: var(--bg-alt); }
.jf-card.strengths li::before { content: '•'; position: absolute; left: 4px; color: var(--muted); font-weight: 700; }
.jf-card.wins { background: rgba(82,133,255,0.08); }
.jf-card.wins li::before { content: '✓'; position: absolute; left: 0; color: var(--green); font-weight: 700; }
.jf-bestfor { margin: 24px 0 0; padding: 24px 28px; border-left: 4px solid var(--green); background: rgba(89,196,113,0.08); border-radius: 0 12px 12px 0; }
.jf-bestfor .lbl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #2e8f4c; margin: 0 0 6px; }
.jf-bestfor p.t { margin: 0; font-size: 16px; line-height: 1.55; color: var(--ink); }
.jf-angle { margin: 20px 0 0; padding: 24px 28px; border-left: 4px solid var(--blue); background: var(--bg-alt); border-radius: 0 12px 12px 0; }
.jf-angle .lbl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); margin: 0 0 6px; }
.jf-angle p.t { margin: 0; font-size: 17px; line-height: 1.55; color: var(--ink); font-weight: 500; }
.jf-ext { margin: 16px 0 0; font-size: 15px; }
.jf-ext a { color: var(--dark-blue); font-weight: 600; text-decoration: none; }
.jf-ext a:hover { text-decoration: underline; }
.jf-faq { margin: 48px 0 0; }
.jf-faq > h2 { font-size: 24px; margin: 0 0 6px; }
.jf-faq > p.intro { margin: 0 0 20px; color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.jf-faq details { background: var(--white); border: 1px solid var(--line); border-radius: 14px; margin-bottom: 10px; overflow: hidden; }
.jf-faq details[open] { border-color: var(--blue); box-shadow: var(--shadow-sm); }
.jf-faq summary { padding: 17px 22px; font-weight: 600; font-family: 'Poppins', sans-serif; font-size: 15px; color: var(--ink); cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.jf-faq summary::-webkit-details-marker { display: none; }
.jf-faq summary::after { content: '+'; font-weight: 700; font-size: 22px; color: var(--blue); line-height: 1; }
.jf-faq details[open] summary::after { content: '−'; }
.jf-faq .answer { padding: 0 22px 20px; color: var(--ink-2); line-height: 1.65; font-size: 15px; }
.jf-faq .answer a { color: var(--dark-blue); font-weight: 600; text-decoration: none; }
.jf-faq .answer a:hover { text-decoration: underline; }
.jf-faq .answer p { margin: 0 0 10px; }
.jf-faq .answer p:last-child { margin-bottom: 0; }
.jf-src { margin: 14px 0 0; font-size: 13px; color: var(--muted); line-height: 1.5; }

/* --- Trendspaning --- */
.ts-best { background: linear-gradient(100deg, var(--dark-blue), #1b4f8f); color: var(--white); border-radius: var(--radius-lg); padding: 20px 24px; margin: 24px 0 32px; display: flex; gap: 16px; align-items: flex-start; box-shadow: var(--shadow-md); }
.ts-best .star { font-size: 24px; line-height: 1.2; }
.ts-best .lbl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.7; margin: 0 0 4px; }
.ts-best p { margin: 0; font-size: 15px; line-height: 1.55; color: #d6e4ff; }
.ts-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.ts-filter { font-family: 'DM Sans', sans-serif; font-size: 14px; font-weight: 500; border: 1px solid var(--line); background: var(--white); color: var(--ink-2); padding: 8px 15px; border-radius: 999px; cursor: pointer; transition: border-color .15s, background .15s, color .15s; }
.ts-filter:hover { border-color: var(--blue); }
.ts-filter.active { background: var(--dark-blue); color: var(--white); border-color: var(--dark-blue); }
.ts-filter .n { opacity: 0.6; margin-left: 4px; }
.ts-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 18px; align-items: start; }
.span-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 24px; box-shadow: var(--shadow-sm); display: flex; flex-direction: column; gap: 16px; transition: box-shadow .15s, transform .15s; }
.span-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.span-card.hot { border-color: rgba(249,97,103,0.4); }
.span-card .badges { display: flex; gap: 6px; flex-wrap: wrap; }
.span-card .badge { font-family: 'DM Sans', sans-serif; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 3px 9px; border-radius: 999px; }
.badge-nyhet { background: rgba(82,133,255,0.12); color: #2f5fd0; }
.badge-bidrag { background: rgba(89,196,113,0.16); color: #2e8f4c; }
.badge-lag { background: rgba(168,101,235,0.14); color: #7b3fc4; }
.badge-insikt { background: rgba(247,199,76,0.20); color: #9a7415; }
.badge-hot { background: rgba(249,97,103,0.14); color: #d9303d; }
.span-card .title { font-family: 'Poppins', sans-serif; font-size: 18px; font-weight: 700; line-height: 1.3; color: var(--ink); margin: 0; }
.span-card .c-meta { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; font-size: 13px; color: var(--muted); margin: 0; }
.span-card .c-meta .deadline { color: #d9303d; font-weight: 700; }
.span-card .what { font-size: 15px; color: var(--ink); margin: 0; line-height: 1.55; }
.span-card .why, .span-card .angle { border-top: 1px dashed var(--line); padding-top: 12px; }
.span-card .why p, .span-card .angle p { margin: 0; font-size: 14px; color: var(--muted); line-height: 1.55; }
.span-card .angle p { background: var(--bg-alt); border-radius: 10px; padding: 9px 11px; color: var(--ink); }
.span-card .lbl { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); margin-bottom: 4px; }
.span-card .card-cta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; margin-top: auto; padding-top: 12px; }
.span-card .portal-cta { display: inline-block; background: var(--dark-blue); color: #fff; font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 13px; text-decoration: none; padding: 8px 14px; border-radius: 8px; }
.span-card .portal-cta:hover { background: #0a2952; }
.span-card .source-link { color: var(--dark-blue); font-weight: 700; font-size: 14px; text-decoration: none; }
.span-card .source-link:hover { text-decoration: underline; }

/* --- Arkiv --- */
.ts-year { font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 15px; color: var(--muted); margin: 0 0 8px; }
.ts-weeks { list-style: none; margin: 0 0 32px; padding: 0; }
.ts-week-row { display: flex; align-items: center; gap: 16px; padding: 16px 20px; border: 1px solid var(--line); border-radius: 14px; margin-bottom: 10px; text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s, transform .15s; }
.ts-week-row:hover { border-color: var(--blue); box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.ts-week-label { font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 16px; color: var(--ink); }
.ts-week-date { font-size: 13px; color: var(--muted); margin-left: auto; }
.ts-week-row .arrow { color: var(--blue); font-weight: 700; }

@media (max-width: 640px) {
  .jf-cols { grid-template-columns: 1fr; }
  .jf-facts-head, .jf-facts-row { grid-template-columns: 1fr 1fr; }
  .jf-facts-head span:first-child, .jf-flabel { grid-column: 1 / -1; }
  .jf-flabel { font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); }
}

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* ══════════════════════════════════════════════════════════════════════════
   Målgruppsväljare — popup på startsidan
   Renderas av grantigo.js när [data-grantigo-segment-popup] finns på sidan.
   ══════════════════════════════════════════════════════════════════════════ */
.gseg-backdrop {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 24px 16px;
  background: rgba(11, 27, 51, 0.58);
  -webkit-backdrop-filter: blur(7px);
  backdrop-filter: blur(7px);
  opacity: 0;
  transition: opacity .28s ease;
  overflow-y: auto;
}
.gseg-backdrop.is-open { opacity: 1; }
.gseg-backdrop.is-closing { opacity: 0; }

.gseg-modal {
  position: relative;
  width: 100%;
  max-width: 1000px;
  margin: auto;
  background: var(--white);
  border-radius: 26px;
  box-shadow: 0 40px 110px rgba(11, 27, 51, 0.38);
  padding: 30px 34px 22px;
  transform: translateY(18px) scale(.985);
  opacity: 0;
  transition: transform .34s cubic-bezier(.2,.8,.3,1), opacity .28s ease;
}
.gseg-backdrop.is-open .gseg-modal { transform: none; opacity: 1; }

.gseg-close {
  position: absolute; top: 16px; right: 16px;
  width: 38px; height: 38px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--bg-alt); color: var(--muted);
  font-size: 20px; line-height: 1;
  transition: background .15s ease, color .15s ease, transform .15s ease;
}
.gseg-close:hover { background: var(--ink); color: #fff; transform: rotate(90deg); }

.gseg-head { text-align: center; max-width: 620px; margin: 0 auto 20px; }
.gseg-mark { display: flex; justify-content: center; margin-bottom: 10px; }
.gseg-head h2 { font-size: clamp(24px, 3vw, 32px); margin-top: 8px; }
.gseg-head p { color: var(--muted); font-size: 15px; margin-top: 8px; }

.gseg-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.gseg-card {
  display: flex; flex-direction: column; gap: 6px;
  text-align: left;
  padding: 14px 14px 13px;
  border: 1.5px solid var(--line);
  border-radius: 16px;
  background: var(--white);
  color: inherit;
  text-decoration: none;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
  opacity: 0;
  animation: gsegCardIn .42s cubic-bezier(.2,.8,.3,1) forwards;
  animation-delay: calc(120ms + var(--i) * 45ms);
}
@keyframes gsegCardIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.gseg-card:hover, .gseg-card:focus-visible {
  border-color: var(--blue);
  box-shadow: 0 14px 34px rgba(16, 57, 107, 0.14);
  transform: translateY(-3px);
  outline: none;
}
.gseg-card:focus-visible { border-color: var(--ink); }
.gseg-ico {
  width: 38px; height: 38px; border-radius: 12px;
  display: grid; place-items: center;
  margin-bottom: 2px;
}
.gseg-ico svg { width: 22px; height: 22px; }
.gseg-card h3 { font-size: 15.5px; line-height: 1.22; }
.gseg-card p { font-size: 13px; color: var(--muted); line-height: 1.42; margin-top: 3px; }
.gseg-amount {
  margin-top: auto; padding-top: 8px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.02em; color: var(--ink-2); font-weight: 500;
}
.gseg-card .gseg-arrow {
  font-weight: 700; color: var(--blue); font-size: 14px;
  opacity: 0; transform: translateX(-4px);
  transition: opacity .16s ease, transform .16s ease;
}
.gseg-card:hover .gseg-arrow, .gseg-card:focus-visible .gseg-arrow { opacity: 1; transform: none; }

.gseg-card.is-all { border-style: dashed; background: var(--bg); }
.gseg-card.is-all .gseg-ico { background: var(--bg-alt); color: var(--muted); }

.gseg-foot {
  margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
}
.gseg-foot-note { font-size: 13.5px; color: var(--muted); display: flex; align-items: center; gap: 8px; }
.gseg-foot-note svg { color: var(--green); flex-shrink: 0; }
.gseg-skip {
  font-size: 14px; font-weight: 600; color: var(--muted);
  border-bottom: 1px solid transparent; padding-bottom: 1px;
}
.gseg-skip:hover { color: var(--ink); border-bottom-color: var(--ink); }

@media (max-width: 900px) {
  .gseg-grid { grid-template-columns: repeat(2, 1fr); }
  .gseg-modal { padding: 32px 20px 20px; border-radius: 22px; }
}
/* Låga fönster: krymp så hela väljaren ryms utan att man behöver skrolla. */
@media (max-height: 800px) {
  .gseg-backdrop { padding: 14px 12px; }
  .gseg-modal { padding: 22px 26px 16px; border-radius: 20px; }
  .gseg-head { margin-bottom: 14px; }
  .gseg-head h2 { font-size: 26px; }
  .gseg-head p { font-size: 14px; margin-top: 6px; }
  .gseg-mark svg { width: 34px; height: 34px; }
  .gseg-mark { margin-bottom: 6px; }
  .gseg-card { padding: 12px; }
  .gseg-card p { font-size: 12.5px; }
  .gseg-ico { width: 34px; height: 34px; border-radius: 11px; }
  .gseg-ico svg { width: 19px; height: 19px; }
}

/* Mobil: en rad per målgrupp, komprimerad så alla åtta ryms utan skroll. */
@media (max-width: 460px) {
  .gseg-backdrop { padding: 10px 10px; }
  .gseg-modal { padding: 20px 16px 14px; border-radius: 20px; }
  .gseg-close { top: 10px; right: 10px; width: 34px; height: 34px; font-size: 18px; }
  .gseg-mark svg { width: 34px; height: 34px; }
  .gseg-mark { margin-bottom: 6px; }
  .gseg-head { margin-bottom: 14px; }
  .gseg-head h2 { font-size: 22px; margin-top: 6px; }
  .gseg-head p { font-size: 13.5px; margin-top: 6px; }
  .gseg-grid { grid-template-columns: 1fr; gap: 8px; }
  .gseg-card { flex-direction: row; align-items: center; gap: 12px; padding: 11px 12px; }
  .gseg-card .gseg-ico { margin-bottom: 0; flex-shrink: 0; width: 34px; height: 34px; border-radius: 11px; }
  .gseg-card .gseg-ico svg { width: 19px; height: 19px; }
  .gseg-card .gseg-txt { min-width: 0; }
  .gseg-card h3 { font-size: 14.5px; }
  .gseg-card p, .gseg-amount { display: none; }
  .gseg-card .gseg-arrow { margin-left: auto; opacity: 1; transform: none; font-size: 0; }
  .gseg-card .gseg-arrow::after { content: '→'; font-size: 16px; color: var(--blue); }
  .gseg-foot { margin-top: 12px; padding-top: 10px; }
  .gseg-foot-note { font-size: 12px; }
  .gseg-skip { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .gseg-backdrop, .gseg-modal, .gseg-card { transition: none; animation: none; opacity: 1; transform: none; }
}

/* ══════════════════════════════════════════════════════════════════════════
   Inbäddad produktdemo (målgruppssidorna) — [data-demo-embed]
   ══════════════════════════════════════════════════════════════════════════ */
.demo-embed {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
  background: #F4F7FC;
  cursor: pointer;
}
.demo-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; pointer-events: none; }
.demo-embed:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.demo-embed-expand {
  position: absolute; right: 12px; bottom: 12px; z-index: 3;
  display: inline-flex; align-items: center; gap: 7px;
  background: rgba(16, 57, 107, 0.82); color: #fff;
  font-weight: 600; font-size: 13px; line-height: 1;
  padding: 9px 14px; border-radius: 999px;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  box-shadow: 0 6px 18px rgba(11, 27, 51, 0.28);
  pointer-events: none;
  transition: background .15s ease, transform .15s ease;
}
.demo-embed:hover .demo-embed-expand { background: var(--blue); transform: translateY(-1px); }

.gdemo-modal {
  position: fixed; inset: 0; z-index: 10001;
  display: flex; align-items: center; justify-content: center;
  padding: 4vh 4vw;
  background: rgba(8, 18, 38, 0.80);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  opacity: 0; transition: opacity .25s ease;
}
.gdemo-modal.is-open { opacity: 1; }
.gdemo-frame {
  position: relative;
  width: min(92vw, 1240px, 160vh);
  aspect-ratio: 16 / 9;
  border-radius: 16px; overflow: hidden; background: #F4F7FC;
  box-shadow: 0 40px 120px rgba(0, 0, 0, 0.55);
  transform: scale(.96); transition: transform .25s ease;
}
.gdemo-modal.is-open .gdemo-frame { transform: scale(1); }
.gdemo-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.gdemo-close {
  position: absolute; top: -16px; right: -16px; z-index: 2;
  width: 46px; height: 46px; border-radius: 50%;
  background: #fff; color: var(--ink); font-size: 22px; line-height: 1;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.32);
  display: grid; place-items: center;
  transition: transform .15s ease;
}
.gdemo-close:hover { transform: scale(1.08); }
@media (max-width: 600px) { .gdemo-close { top: 8px; right: 8px; } }