/* Hjemmesiden for LiveEvent Hub (templates/hubside/) – på toppen av static/liveevent/le.css, så den hører til samme familie som
   liveeventnordic.no. Aksenten er plattformens overgang (oransje → bringebær) fra den godkjente logoen static/plattform/mark.svg.
   Mobil først (320–1920 px). Kort og bokser side om side er like høye, og knapper på rad har samme høyde (Christian 6.11.2026).
   Kontrast: tekst på aksentflater er #1a0a10 (≥ 5.8:1 mot #ff4f6d), all annen tekst bruker fargene i le.css (≥ 4.5:1). */
.hs-body {
  --hs-grad: linear-gradient(135deg, #ffa25c 0%, #ff6a5c 55%, #ff4f6d 100%);
  --hs-ink: #1a0a10;
  --hs-pink: #ff8fa3;          /* 8.8:1 mot --le-bg */
  --hs-glow: rgba(255, 79, 109, .26);
  background: radial-gradient(120% 50% at 100% 0%, rgba(255, 79, 109, .08), transparent 60%) no-repeat, var(--le-bg);
}
.hs-body ::selection { background: #ff6a5c; color: var(--hs-ink); }
.hs-body :focus-visible { outline-color: var(--hs-pink); }

/* Knapper og merker i plattformens farger */
.hs-body .le-btn:not(.le-btn--ghost) { background: var(--hs-grad); color: var(--hs-ink); box-shadow: 0 8px 28px var(--hs-glow); }
.hs-body .le-btn:not(.le-btn--ghost):hover { color: var(--hs-ink); box-shadow: 0 12px 36px rgba(255, 79, 109, .38); }
.hs-body .le-eyebrow { color: var(--hs-pink); }
.hs-body .le-hero h1 em { background: var(--hs-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hs-body .le-card-icon { color: var(--hs-pink); background: radial-gradient(circle at 30% 20%, rgba(255, 106, 92, .28), rgba(255, 79, 109, .06));
  border-color: rgba(255, 79, 109, .3); }
.hs-body .le-feature-list svg, .hs-body .le-box li svg, .hs-body .le-contact-list svg { color: var(--hs-pink); }
.hs-body .le-faq summary::after { color: var(--hs-pink); }
.hs-body .le-box--accent { border-color: rgba(255, 79, 109, .38); background: linear-gradient(180deg, rgba(255, 79, 109, .1), rgba(255, 79, 109, .02)), var(--le-surface); }
.hs-body .le-hero--plain::before { background: radial-gradient(90% 80% at 85% 0%, rgba(255, 79, 109, .22), transparent 60%),
  radial-gradient(70% 60% at 0% 100%, rgba(255, 162, 92, .14), transparent 60%), var(--le-bg); }
.hs-body .le-check:has(input:checked) { border-color: #ff6a5c; background: rgba(255, 79, 109, .09); }
.hs-body .le-check input { accent-color: #ff6a5c; }
.hs-body .le-form input:focus, .hs-body .le-form select:focus, .hs-body .le-form textarea:focus { border-color: #ff6a5c; box-shadow: 0 0 0 3px rgba(255, 79, 109, .25); }
.hs-body .le-word span { letter-spacing: .9em; }

/* Toppen: kortere meny enn liveeventnordic.no, så den får plass fra 1040 px */
@media (min-width: 1040px) { .hs-body .hs-nav { display: flex; } .hs-body .hs-menu { display: none; } }
.hs-nav .le-btn { margin-left: 10px; }
.hs-nav .hs-sub > details > summary { color: var(--le-muted); font-weight: 600; font-size: .93rem; padding: .55em .7em; border-radius: 999px; }
.hs-nav .hs-sub > details > summary:hover, .hs-nav .hs-sub > details[open] > summary, .hs-nav .hs-sub > details > summary[aria-current] {
  color: var(--le-text); background: rgba(255, 255, 255, .06); }
/* Undermenyene (Funksjoner, For hvem, Arrangementer, Ressurser): grupper i kolonner, som i sidekartet */
.hs-body .hs-sub-panel { width: min(320px, 92vw); grid-template-columns: 1fr; gap: 6px 18px; padding: 16px; }
.hs-body .hs-sub-panel--2 { width: min(560px, 92vw); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hs-body .hs-sub-panel--4 { width: min(980px, 94vw); grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hs-sub-group { display: grid; gap: 2px; align-content: start; }
.hs-sub-h { margin: 0 0 4px; padding: 0 12px; font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--hs-pink); }
.hs-sub-panel a { display: block; padding: 9px 12px; border-radius: 10px; color: var(--le-text); text-decoration: none; white-space: normal;
  font-size: .93rem; font-weight: 600; line-height: 1.3; }
.hs-sub-panel a:hover, .hs-sub-panel a[aria-current] { background: rgba(255, 79, 109, .1); color: #fff; }
.le-menu-panel .hs-sub-h { padding: 10px 0 2px 12px; }

/* Hero med illustrasjon */
.hs-hero { min-height: 0; align-items: center; padding-bottom: clamp(48px, 7vw, 96px); }
.hs-hero--page { padding-top: calc(132px + env(safe-area-inset-top)); padding-bottom: clamp(40px, 6vw, 80px); }
.hs-hero--page h1 { font-size: clamp(2rem, 4.4vw, 3.4rem); max-width: 26ch; hyphens: manual; }
.hs-hero .le-crumbs { margin-bottom: 1rem; }
.hs-hero-in { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.hs-hero h1 { max-width: 16ch; }
.hs-hero .le-lead { margin-bottom: 1.6rem; }
.hs-hero-art, .hs-art { display: flex; justify-content: center; }
@media (max-width: 900px) { .hs-hero-in { grid-template-columns: 1fr; } .hs-hero-art { order: 2; } }
.hs-split-rev > :first-child { order: 0; }
@media (max-width: 900px) { .hs-split-rev > .hs-art { order: 2; } }
.hs-actions { gap: 12px; }
.hs-actions .le-btn { min-height: 52px; }
.hs-note { margin: 18px 0 0; padding: 12px 16px; border-radius: var(--le-radius-sm); border: 1px solid rgba(255, 162, 92, .45); background: rgba(255, 162, 92, .08);
  color: #f3e6da; font-size: .95rem; max-width: 52ch; }
.hs-mt { margin-top: 24px; }
.hs-first { padding-top: 8px; }
.hs-anchor { scroll-margin-top: 80px; }

/* Butikkmerker: like høye og like brede, side om side */
.hs-stores { list-style: none; padding: 0; margin: 24px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 12px; }
.hs-stores li { margin: 0; display: flex; }
.hs-store { flex: 1; display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 10px 16px; border-radius: 14px; border: 1px solid var(--le-line-2);
  background: rgba(255, 255, 255, .04); color: var(--le-text); text-decoration: none; line-height: 1.15; }
a.hs-store:hover { color: #fff; border-color: rgba(255, 79, 109, .55); background: rgba(255, 79, 109, .08); }
.hs-store svg { width: 26px; height: 26px; flex: none; color: var(--hs-pink); }
.hs-store small { display: block; font-size: .78rem; color: var(--le-muted); font-weight: 600; }
.hs-store b { display: block; font-size: 1.02rem; font-weight: 750; }
.hs-store.is-soon { border-style: dashed; }
@media (max-width: 420px) { .hs-stores { grid-template-columns: 1fr; } }

/* Funksjoner: like høye kort i rutenettet (le-grid strekker radene) */
.hs-feature p { margin-bottom: 0; }
.hs-feature h3 { overflow-wrap: anywhere; hyphens: auto; }
/* Kort side om side: overskriftene får samme høyde (to linjer), så brødteksten starter på samme linje i hele raden. */
@media (min-width: 641px) { .hs-feature h3, .hs-step h3 { min-height: 2.24em; } }

/* Innganger, kort og blokker: like høye i hver rad (le-grid strekker), knappene nederst */
.hs-entry, .hs-block, .hs-card { height: 100%; }
.hs-entry .le-feature-list { margin-bottom: 1.4em; }
.hs-entry-actions { margin-top: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.hs-entry-actions .le-btn { min-height: 52px; white-space: normal; text-align: center; }
@media (max-width: 520px) { .hs-entry-actions { grid-template-columns: 1fr; } }
.hs-block .le-feature-list { margin: 0; }
.hs-block p { margin-bottom: 0; }
.hs-card p { flex: 1; }
.hs-intro { margin-top: -.2em; margin-bottom: 1.6rem; }
.hs-more { margin: 22px 0 0; }
.hs-list li { color: #e7e1d8; }
.hs-h2-sm { font-size: clamp(1.3rem, 2vw, 1.6rem); margin-bottom: 1rem; }
.hs-related { padding-bottom: 0; }
.hs-cta { padding: clamp(28px, 5vw, 64px); border-color: rgba(255, 79, 109, .38);
  background: radial-gradient(80% 120% at 50% 0%, rgba(255, 79, 109, .26), transparent 60%), linear-gradient(180deg, #1a0e12, #0d0a0b); }
.hs-foot-contact { margin-top: 16px; }
.hs-foot-contact a { font-weight: 600; }

/* Steg */
.hs-steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--le-gap); counter-reset: none; }
.hs-steps--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hs-steps--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hs-step { margin: 0; display: flex; flex-direction: column; padding: clamp(22px, 2.4vw, 30px); border-radius: var(--le-radius-lg); border: 1px solid var(--le-line);
  background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .015)); }
.hs-step + .hs-step { margin-top: 0; }
.hs-step-no { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 18px; border-radius: 50%; background: var(--hs-grad); color: var(--hs-ink);
  font-weight: 850; font-size: 1.1rem; }
.hs-step h3 { font-size: 1.12rem; }
.hs-step p { color: var(--le-muted); margin: 0; font-size: .98rem; }
@media (max-width: 1040px) { .hs-steps, .hs-steps--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .hs-steps--3 { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .hs-steps, .hs-steps--2 { grid-template-columns: 1fr; } }

/* Innlogging: to like kort, knappen nederst */
.hs-login .le-card p { flex: 1; }
.hs-login .le-btn { margin-top: 8px; }

/* Skjemaet */
.hs-form fieldset { gap: 18px; }
.hs-submit { justify-self: start; }
@media (max-width: 520px) { .hs-submit { justify-self: stretch; } }
.hs-form .le-check { align-items: flex-start; }
.hs-form .le-check input { margin-top: 2px; }
.le-alert ul { margin: .5em 0 0; }
/* Den faste «Be om demo»-knappen på mobil dekker ikke feltene mens skjemaet på siden fylles ut. */
.hs-body:has(.hs-form:focus-within) .le-sticky-cta { display: none; }
.le-alert + .hs-form { margin-top: 18px; }

/* Illustrasjoner av appen (tegnet, uten ekte data) */
.hs-phone { position: relative; width: min(100%, 300px); margin: 0; padding: 11px; border-radius: 44px; aspect-ratio: 9 / 18.6;
  background: linear-gradient(160deg, #24242d, #0d0d12); border: 1px solid var(--le-line-2);
  box-shadow: 0 40px 90px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .03) inset, 0 0 120px rgba(255, 79, 109, .12); }
.hs-screen { position: relative; height: 100%; display: flex; flex-direction: column; gap: 10px; padding: 40px 14px 12px; border-radius: 34px; overflow: hidden;
  background: radial-gradient(120% 60% at 100% 0%, rgba(255, 79, 109, .16), transparent 60%), #0b0b10; font-size: 13px; line-height: 1.3; color: #f5f5f7; }
.hs-screen::before { content: ""; position: absolute; top: 11px; left: 50%; width: 86px; height: 22px; transform: translateX(-50%); border-radius: 14px; background: #000; }
.hs-bar { display: flex; align-items: center; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid rgba(255, 255, 255, .1); font-size: 14px; }
.hs-bar img { width: 20px; height: 20px; }
.hs-ui-eyebrow { margin: 4px 0 0; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; background: var(--hs-grad);
  -webkit-background-clip: text; background-clip: text; color: transparent; }
.hs-ui-card { display: grid; gap: 8px; padding: 11px; border-radius: 14px; background: #16161d; border: 1px solid rgba(255, 255, 255, .12); }
.hs-ui-card--dim { opacity: .55; }
.hs-ui-row { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 10px; align-items: start; }
.hs-ui-date { width: 38px; height: 42px; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(#16161d, #16161d) padding-box, var(--hs-grad) border-box; }
.hs-ui-lines { display: grid; gap: 6px; align-content: start; justify-items: start; }
.hs-line { display: block; width: 100%; height: 7px; border-radius: 6px; background: rgba(255, 255, 255, .16); }
.hs-line.w30 { width: 30%; } .hs-line.w40 { width: 40%; } .hs-line.w50 { width: 50%; } .hs-line.w60 { width: 60%; } .hs-line.w70 { width: 70%; } .hs-line.w80 { width: 80%; }
.hs-chip { display: inline-flex; align-items: center; justify-self: start; padding: 2px 9px; border-radius: 999px; background: var(--hs-grad); color: var(--hs-ink);
  font-size: 10.5px; font-weight: 800; }
.hs-chip--soft { background: rgba(255, 199, 100, .14); color: #ffd79a; border: 1px solid rgba(255, 199, 100, .4); }
.hs-ui-main { display: flex; align-items: center; justify-content: center; min-height: 34px; border-radius: 10px; background: var(--hs-grad); color: var(--hs-ink);
  font-weight: 800; font-size: 12.5px; }
.hs-ui-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.hs-ui-tiles span { display: grid; justify-items: center; gap: 3px; padding: 8px 2px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .14); font-size: 11px; font-weight: 650; }
.hs-ui-tiles svg { width: 17px; height: 17px; color: var(--hs-pink); }
.hs-ui-scan { position: relative; display: grid; place-items: center; aspect-ratio: 1; border-radius: 16px; color: #ff8fa3;
  background: radial-gradient(60% 60% at 50% 50%, rgba(255, 255, 255, .06), transparent 70%), #111117; border: 1px solid rgba(255, 255, 255, .1); }
.hs-ui-scan svg { width: 76%; height: 76%; }
.hs-ui-check { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 10px; align-items: center; }
.hs-ui-ok { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: rgba(95, 211, 154, .16); color: #5fd39a; }
.hs-ui-ok svg { width: 14px; height: 14px; }
.hs-ui-bubble { display: grid; gap: 6px; max-width: 78%; padding: 10px 12px; border-radius: 14px 14px 14px 4px; background: #1d1d26;
  border: 1px solid rgba(255, 255, 255, .1); }
.hs-ui-bubble--me { justify-self: end; border-radius: 14px 14px 4px 14px; background: rgba(255, 79, 109, .18); border-color: rgba(255, 79, 109, .35); }
.hs-ui-input { margin-top: auto; display: grid; grid-template-columns: minmax(0, 1fr) 30px; gap: 8px; align-items: center; padding: 6px 6px 6px 12px;
  border-radius: 999px; border: 1px solid rgba(255, 255, 255, .14); }
.hs-ui-send { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--hs-grad); color: var(--hs-ink); }
.hs-ui-send svg { width: 16px; height: 16px; }
.hs-ui-input + .hs-ui-tabbar { margin-top: 0; }
.hs-ui-msg { grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: 10px; }
.hs-ui-ok--msg { background: rgba(255, 79, 109, .16); color: var(--hs-pink); }
.hs-ui-ok--wait { background: rgba(255, 255, 255, .08); border: 1px dashed rgba(255, 255, 255, .3); }
.hs-ui-ticket { justify-items: center; text-align: center; padding: 14px; }
.hs-ui-ticket .hs-line { justify-self: center; }
.hs-ui-qr { width: 70%; height: auto; margin: 6px 0; border-radius: 8px; }
.hs-ui-ticket .hs-ui-main { width: 100%; }
.hs-ui-now { border-color: rgba(255, 79, 109, .5); background: linear-gradient(180deg, rgba(255, 79, 109, .14), rgba(255, 79, 109, .03)), #16161d; }
.hs-ui-progress { display: block; height: 5px; border-radius: 4px; background: rgba(255, 255, 255, .12); overflow: hidden; }
.hs-ui-progress i { display: block; width: 45%; height: 100%; background: var(--hs-grad); }
.hs-ui-tabbar { margin-top: auto; display: grid; grid-template-columns: repeat(3, 1fr); padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .1); }
.hs-ui-tabbar span { display: grid; place-items: center; min-height: 30px; color: rgba(245, 245, 247, .55); }
.hs-ui-tabbar span.on { color: var(--hs-pink); }
.hs-ui-tabbar svg { width: 19px; height: 19px; }
@media (max-width: 420px) { .hs-phone { width: min(100%, 270px); } }

/* 404 og lukket nettside */
.hs-404 { min-height: 0; }
.hs-footer-min { margin-top: 0; padding: 28px 0; }
.hs-footer-min .le-footer-bottom { margin-top: 0; padding-top: 0; border-top: 0; }

@media print { .hs-phone, .hs-stores { display: none !important; } }

/* Tekstsidene (SEO-sidekartet 10.11.2026): tabeller, maler, «Greit å vite», innholdsfortegnelse og forfatterlinje */
.hs-meta { margin: -.6rem 0 1.4rem; font-size: .9rem; color: var(--le-faint); }
.hs-sec .le-prose > :last-child { margin-bottom: 0; }
.hs-sec .le-prose h3 { font-size: 1.15rem; margin-top: 1.4em; }
.hs-table-wrap { overflow-x: auto; border: 1px solid var(--le-line); border-radius: var(--le-radius); background: var(--le-surface); }
.hs-table-wrap:focus-visible { outline-offset: 2px; }
.hs-table { width: 100%; border-collapse: collapse; font-size: .97rem; }
.hs-table th, .hs-table td { text-align: left; vertical-align: top; padding: 12px 14px; border-bottom: 1px solid var(--le-line); }
.hs-table thead th { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--le-faint); font-weight: 700; background: rgba(255, 255, 255, .02); }
.hs-table tbody th { font-weight: 650; color: var(--le-text); }
.hs-table td { color: #ddd7cd; }
.hs-table tr:last-child th, .hs-table tr:last-child td { border-bottom: 0; }
@media (max-width: 560px) { .hs-table { font-size: .92rem; } .hs-table th, .hs-table td { padding: 10px; } }
.hs-note-sm { margin-top: 12px; font-size: .95rem; }
/* Malene står som de skal kopieres: ingen linjebryting (tabellmalen blir ellers uleselig på mobil), men rulling inne i boksen. */
.hs-pre { margin: 0; padding: 18px 20px; border-radius: var(--le-radius); border: 1px dashed var(--le-line-2); background: #0d0d10; color: #e9e4dc;
  font: .88rem/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: pre; overflow-x: auto; max-width: 100%; }
.hs-callout { padding: clamp(20px, 3vw, 30px); border-radius: var(--le-radius-lg); border: 1px solid rgba(255, 162, 92, .4);
  background: linear-gradient(180deg, rgba(255, 162, 92, .08), rgba(255, 162, 92, .02)), var(--le-surface); }
.hs-callout h2 { font-size: clamp(1.25rem, 2vw, 1.55rem); }
.hs-toc-wrap { padding-bottom: 0; }
.hs-toc { padding: 20px 24px; border-radius: var(--le-radius); border: 1px solid var(--le-line); background: var(--le-surface); }
.hs-toc ol { margin: 0; padding-left: 1.3em; columns: 2 240px; column-gap: 32px; }
.hs-toc li { break-inside: avoid; }
.hs-toc a { color: var(--le-text); text-decoration: none; }
.hs-toc a:hover { color: var(--hs-pink); text-decoration: underline; }
.hs-sec h2 { scroll-margin-top: 90px; }
.le-grid-1 { grid-template-columns: 1fr; }
.hs-form-grid { align-items: start; }

/* =====================================================================================================================
   Designrunden 10.11.2026 (runde 3 del 2, Christian: «bedre oversikt, bedre design»). Bare oppstilling og lesbarhet:
   logo, farger, navn og slagord er urørt. Før- og etterbilder: docs/revisjon-1011/data/hub-del2.md.
   ===================================================================================================================== */

/* 1. Én venstrekant. Før sto overskriftene vekselvis på venstrekanten (kort, steg, toppen av siden) og 210 px lenger inn
      (tekst, tabeller, spørsmål), så øyet måtte hoppe for hver seksjon. Nå begynner alt på samme linje som H1 og brødsmulene.
      Teksten holder samme lesebredde som før (780 px); tabeller og maler får litt mer plass. */
@media (min-width: 900px) {
  .hs-body .hs-sec > .le-narrow { width: min(100% - 2 * var(--le-gap), var(--le-max)); }
  .hs-body .hs-sec > .le-narrow > * { max-width: 780px; }
  .hs-body .hs-sec > .le-narrow > .hs-table-wrap, .hs-body .hs-sec > .le-narrow > .hs-pre { max-width: 900px; }
}

/* 2. Guidene: innholdsfortegnelsen står ved siden av ingressen i toppen (før: egen boks under en halvtom topp), så leseren ser
      med én gang hva guiden dekker. På smale skjermer står den under ingressen, som før. */
.hs-hero .hs-toc { width: 100%; background: rgba(21, 21, 24, .78); backdrop-filter: blur(6px); }
.hs-hero .hs-toc ol { columns: 2 220px; }
.hs-hero .hs-toc li { margin-top: 0; padding: 5px 0; }
@media (min-width: 901px) {
  .hs-hero-in--toc { align-items: start; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
  .hs-hero-in--toc .hs-toc { margin-top: 2.2rem; }
  .hs-hero .hs-toc ol { columns: 1; }
}
@media (max-width: 900px) { .hs-hero .hs-toc { margin-top: 8px; } }

/* 3. Kort og steg i samme rad: ikon, overskrift, tekst og lenke står på samme linjer i hele raden (subgrid). Før startet teksten
      høyere i kort med overskrift på én linje enn i nabokortet med to, og stegene satte alltid av plass til to linjer. */
@supports (grid-template-rows: subgrid) {
  .hs-cards > .le-card { display: grid; grid-template-rows: subgrid; grid-row: span 4; row-gap: 0; align-content: start; }
  .hs-cards > .le-card > p { margin-bottom: 1em; }
  .hs-cards > .le-card > .le-link-arrow { align-self: end; justify-self: start; margin-top: 0; }
  .hs-steps > .hs-step { display: grid; grid-template-rows: subgrid; grid-row: span 3; row-gap: 0; align-content: start; }
  .hs-steps > .hs-step > h3 { min-height: 0; }
}

/* 4. Ingen kort alene på siste rad. Fem kort står 3 + 2 og sju steg 4 + 3, og de siste fyller raden (før: ett kort alene med
      resten av raden tom). Tolv kolonner: s3 = fire i bredden, s4 = tre, s6 = to. Nettbrett: to i bredden, mobil: én. */
.hs-grid12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.hs-grid12 > * { grid-column: span 12; }
@media (min-width: 641px) { .hs-grid12 > * { grid-column: span 6; } .hs-grid12 > .hs-odd-last { grid-column: span 12; } }
@media (min-width: 1041px) {
  .hs-grid12 > .hs-s3 { grid-column: span 3; } .hs-grid12 > .hs-s4 { grid-column: span 4; } .hs-grid12 > .hs-s6, .hs-grid12 > .hs-s6.hs-odd-last { grid-column: span 6; }
  .hs-grid12 > .hs-s4.hs-odd-last { grid-column: span 4; } .hs-grid12 > .hs-s3.hs-odd-last { grid-column: span 3; }
}
.hs-steps.hs-grid12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }

/* 5. Kort som er lenker sier hva som skjer («Les mer») i stedet for bare en pil. */
.hs-card .le-link-arrow { font-size: .95rem; }

/* 6. Mobil: knapper under hverandre er like brede (før: to knapper med ulik bredde under hverandre), og linjen over H1
      («ARRANGEMENTSPLATTFORM OG APP») får plass på én linje. */
@media (max-width: 520px) {
  .hs-body .hs-actions { display: grid; grid-template-columns: 1fr; }
  .hs-body .hs-actions .le-btn { width: 100%; }
  .hs-body .le-eyebrow { letter-spacing: .16em; }
}

/* 7. Tabeller og maler som er bredere enn skjermen: en svak skygge i kanten viser at det går an å rulle sideveis
      (skyggen forsvinner når man har rullet helt ut til den siden). */
.hs-table-wrap { background:
  linear-gradient(to right, var(--le-surface) 30%, rgba(21, 21, 24, 0)) left center / 36px 100% no-repeat local,
  linear-gradient(to left, var(--le-surface) 30%, rgba(21, 21, 24, 0)) right center / 36px 100% no-repeat local,
  radial-gradient(farthest-side at 0 50%, rgba(255, 143, 163, .34), rgba(255, 143, 163, 0)) left center / 12px 100% no-repeat scroll,
  radial-gradient(farthest-side at 100% 50%, rgba(255, 143, 163, .34), rgba(255, 143, 163, 0)) right center / 12px 100% no-repeat scroll,
  var(--le-surface); }
.hs-pre { background:
  linear-gradient(to right, #0d0d10 30%, rgba(13, 13, 16, 0)) left center / 36px 100% no-repeat local,
  linear-gradient(to left, #0d0d10 30%, rgba(13, 13, 16, 0)) right center / 36px 100% no-repeat local,
  radial-gradient(farthest-side at 0 50%, rgba(255, 143, 163, .34), rgba(255, 143, 163, 0)) left center / 12px 100% no-repeat scroll,
  radial-gradient(farthest-side at 100% 50%, rgba(255, 143, 163, .34), rgba(255, 143, 163, 0)) right center / 12px 100% no-repeat scroll,
  #0d0d10; }

/* 8. Undermenyen «Funksjoner»: gruppeoverskriftene står på én linje, så første lenke i hver kolonne står på samme høyde
      (før brøt «Underveis og etterpå» over to linjer og skjøv den kolonnen ned). */
@media (min-width: 1040px) { .hs-sub-panel--4 .hs-sub-h { white-space: nowrap; letter-spacing: .1em; } }

/* 9. Kontaktskjemaet: datofeltet er like høyt som nedtrekket ved siden av, og kontaktboksen til høyre begynner på samme linje
      som rammen rundt skjemaet (rammen står midt på overskriften «Fortell kort om arrangementet»). */
.hs-form input[type="text"], .hs-form input[type="email"], .hs-form input[type="tel"], .hs-form input[type="date"], .hs-form select { height: 52px; }
@media (min-width: 981px) { .hs-form-grid > .le-aside { margin-top: .82em; } }

/* 10. Bunnteksten: «For hvem og arrangementer» går over to linjer i fire kolonner. Alle overskriftene får plass til to linjer, så
       første lenke i hver kolonne står på samme høyde (før sto den midterste kolonnen én linje lavere enn de andre). */
@media (min-width: 901px) { .hs-body .le-footer-grid h2 { min-height: 2.5em; } }