/* Gridvik responsive/accessibility layer — preserves the existing navy/red visual identity. */
:root {
  --gv-navy: var(--dark, #050a30);
  --gv-red: var(--red, #ff0000);
  --gv-line: var(--line, #e2e8f0);
  --gv-muted: var(--muted, #64748b);
  --gv-paper: var(--white, #f4f6fb);
  --gv-card: var(--card, #ffffff);
  --gv-radius: 16px;
  --gv-shadow: 0 14px 38px rgba(5, 10, 48, .08);
}

*, *::before, *::after { box-sizing: border-box; }
html { width: 100%; max-width: 100%; scroll-behavior: smooth; scroll-padding-top: 92px; }
body { width: 100%; min-width: 320px; max-width: 100%; overflow-x: hidden; overflow-x: clip; }
img, picture, video, canvas, iframe, svg { max-width: 100%; }
img { height: auto; }
main, section, article, header, footer, nav, form, .wrap, .card, .grid2, .grid3, .grid4, .price-grid, .stats-grid, .foot-grid { min-width: 0; }
:where(h1,h2,h3,h4,p,li,a,small,td,th,summary,figcaption) { overflow-wrap: anywhere; }
:where(button,input,select,textarea) { font: inherit; max-width: 100%; }
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible { outline: 3px solid rgba(255,0,0,.72); outline-offset: 3px; }
:target { scroll-margin-top: 100px; }

/* Keep the accessibility skip link hidden until keyboard focus. */
.skip-link { position: fixed !important; top: 12px; left: 12px; z-index: 20000; transform: translateY(calc(-100% - 18px)); display: inline-flex; align-items: center; min-height: 44px; padding: 10px 16px; background: var(--gv-navy); color: #fff !important; border-radius: 8px; box-shadow: 0 8px 24px rgba(5,10,48,.22); font-size: 14px; font-weight: 700; text-decoration: none; }
.skip-link:focus, .skip-link:focus-visible { transform: translateY(0); outline: 3px solid var(--gv-red); outline-offset: 3px; }

/* Shared header and touch-friendly controls. */
.top { z-index: 10000 !important; }
.top-inner { min-width: 0; }
.top-inner > .cta, .top-inner > a.cta { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
@media (min-width: 981px) {
  .top-inner > a.logo { flex: 0 0 auto; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
  .top-inner > a.logo img { display: block !important; width: auto !important; height: 92px !important; max-height: 92px !important; max-width: 270px; object-fit: contain; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
}
@media (min-width: 981px) and (max-width: 1199px) {
  .top-inner > a.logo img { height: 82px !important; max-height: 82px !important; }
}
#mainNav a, .cta, .read, .mobile-nav-header button { -webkit-tap-highlight-color: transparent; }
.hamburger { min-width: 46px; min-height: 46px; align-items: center; justify-content: center; cursor: pointer; color: var(--gv-navy); background: #fff; border: 1px solid var(--gv-line); border-radius: 12px; font-size: 20px; }
.mobile-nav-header button { min-width: 44px !important; min-height: 44px !important; }

/* A real off-canvas menu on compact screens; desktop navigation remains unchanged. */
@media (max-width: 980px) {
  body.gridvik-menu-open { overflow: hidden !important; }
  body.gridvik-menu-open::before {
    content: ""; position: fixed; inset: 0; z-index: 9998;
    background: rgba(4, 9, 35, .46); backdrop-filter: blur(2px);
  }
  .top { z-index: 10000 !important; }
  .top-inner { width: min(100% - 32px, 1200px); gap: 12px !important; padding-block: 10px !important; }
  .top-inner > .logo { flex: 0 1 auto; min-width: 0; }
  .top-inner > .logo img { width: auto !important; height: 52px !important; max-width: min(48vw, 190px); object-fit: contain; }
  .top-inner > a.cta { display: none !important; }
  .top-inner > .hamburger { display: inline-flex !important; margin-left: auto; position: relative; z-index: 10003 !important; flex: 0 0 auto; }
  #mainNav {
    display: flex !important; position: fixed !important; inset: 0 0 0 auto !important;
    width: min(420px, 90vw) !important; max-width: 100vw !important;
    height: 100vh !important; height: 100dvh !important; min-height: 0 !important;
    margin: 0 !important; padding: 74px 20px 22px !important;
    flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important;
    gap: 4px !important; overflow-x: hidden !important; overflow-y: auto !important;
    overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
    background: #fff !important; border-left: 1px solid var(--gv-line) !important;
    box-shadow: -18px 0 48px rgba(5,10,48,.2) !important;
    transform: translateX(104%) !important; visibility: hidden !important; opacity: 0 !important;
    transition: transform .24s ease, opacity .18s ease, visibility .24s ease !important;
    z-index: 10002 !important;
  }
  #mainNav.open { transform: translateX(0) !important; visibility: visible !important; opacity: 1 !important; }
  #mainNav .mobile-nav-header { display: flex !important; position: absolute !important; inset: 12px 14px auto auto !important; z-index: 2 !important; }
  #mainNav .mobile-nav-header button { align-self: auto !important; }
  #mainNav > a:not(.cta), #mainNav .dropdown > .dropbtn {
    display: flex !important; align-items: center; width: 100% !important; min-height: 46px;
    padding: 11px 10px !important; margin: 0 !important; white-space: normal !important;
    border-bottom: 1px solid #edf0f5 !important; border-radius: 8px; font-size: 15px !important;
  }
  #mainNav .dropdown { display: block !important; position: relative !important; width: 100% !important; margin: 0 !important; }
  #mainNav .dropdown > .dropbtn { cursor: pointer !important; }
  #mainNav .dropdown > .drop {
    display: none !important; position: static !important; inset: auto !important; width: 100% !important;
    min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 6px 0 8px 12px !important;
    background: #f8fafc !important; border: 0 !important; border-radius: 10px !important;
    box-shadow: none !important; transform: none !important; z-index: auto !important;
  }
  #mainNav .dropdown.open > .drop { display: block !important; }
  #mainNav .dropdown .drop a { display: block !important; width: 100% !important; min-height: 42px; padding: 9px 10px !important; white-space: normal !important; border: 0 !important; border-radius: 8px !important; }
  #mainNav .dropdown .drop a b { font-size: 13px !important; }
  #mainNav .dropdown .drop a small { display: block; font-size: 11px !important; line-height: 1.45; }
  #mainNav .mobile-cta { display: flex !important; margin-top: auto !important; padding-top: 16px !important; width: 100% !important; }
  #mainNav .mobile-cta .cta { display: flex !important; justify-content: center; width: 100% !important; min-height: 48px; margin: 0 !important; }
  .hero-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .grid3, .grid4, .price-grid, .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; align-items: stretch; }
  .foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .hero { padding-top: 34px !important; }
  .cta-band-inner { gap: 16px !important; }
}

/* Layout safety for cards, data tables, and long labels. */
.grid2, .grid3, .grid4, .price-grid, .stats-grid, .foot-grid, .blog-list { align-items: stretch; }
.grid2 > *, .grid3 > *, .grid4 > *, .price-grid > *, .stats-grid > *, .foot-grid > *, .blog-list > * { min-width: 0; }
.card, .blog-card, .mini-row, .stats-grid > *, .price-grid > * { max-width: 100%; }
table { max-width: 100%; border-collapse: collapse; }
pre, code, .code, [class*="code"] { max-width: 100%; }
pre, .code { overflow-x: auto; overscroll-behavior-x: contain; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea { min-width: 0; }

/* Legal pages: clear hierarchy and a consistent, readable document column. */
body.legal-page { background: var(--gv-paper); }
body.legal-page > h1 { max-width: 940px; margin: 52px auto 12px !important; padding: 0 28px; color: var(--gv-navy); font-size: clamp(31px, 4.8vw, 48px) !important; line-height: 1.08 !important; letter-spacing: -.035em; }
body.legal-page > p.sub { max-width: 940px; margin: 0 auto 24px !important; padding: 0 28px; color: var(--gv-muted); font-size: 13px; }
body.legal-page > h2 { max-width: 940px; margin: 32px auto 10px !important; padding: 0 28px; color: var(--gv-navy); font-size: clamp(21px, 2.6vw, 27px) !important; line-height: 1.25; }
body.legal-page > p:not(.sub):not(.footer):not(.note) { max-width: 940px; margin: 12px auto !important; padding: 0 28px; color: #334155; font-size: 14.5px; line-height: 1.82; }
body.legal-page > ul, body.legal-page > ol { max-width: 940px; margin: 12px auto !important; padding: 0 28px 0 50px; color: #334155; font-size: 14px; line-height: 1.8; }
body.legal-page > .card { max-width: 940px; margin: 20px auto 24px !important; padding: clamp(20px, 4vw, 32px) !important; background: #fff; border: 1px solid var(--gv-line); border-radius: 18px; box-shadow: var(--gv-shadow); }
body.legal-page > .note { max-width: 940px; margin: 18px auto !important; padding: 16px 20px !important; background: #fff; border: 1px solid var(--gv-line); border-left: 4px solid var(--gv-red); border-radius: 12px; line-height: 1.75; }
body.legal-page > .footer { max-width: 940px; margin: 28px auto 34px !important; padding: 14px 22px !important; background: #fff; border: 1px solid var(--gv-line); border-radius: 12px; color: var(--gv-muted); font-size: 12px; line-height: 1.8; }
body.legal-page > .footer a { color: var(--gv-navy); text-decoration: none; }
body.legal-page > .footer a:hover { color: var(--gv-red); }
body.legal-page table { width: 100%; font-size: 12.5px; }
body.legal-page th { color: var(--gv-navy); background: #f8fafc; text-align: left; }
body.legal-page th, body.legal-page td { padding: 11px 12px; border-bottom: 1px solid var(--gv-line); vertical-align: top; }

/* Insights library: wider editorial layout, image-led cards using only supplied Drive graphics. */
body.insights-index .article-head {
  width: min(1600px, calc(100% - 48px)) !important; max-width: 1600px !important;
  margin: 0 auto !important; padding: 36px 24px 18px !important;
}
body.insights-index .blog-intro { max-width: 1160px; }
body.insights-index .blog-list {
  width: min(1600px, calc(100% - 48px)); max-width: 1600px; margin: 28px auto 60px !important;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 22px !important;
}
body.insights-index .blog-card {
  display: flex; flex-direction: column; padding: 0 !important; overflow: hidden;
  background: #fff; border: 1px solid var(--gv-line); border-radius: 18px;
  box-shadow: 0 6px 22px rgba(5,10,48,.045); transition: transform .18s ease, box-shadow .18s ease;
}
body.insights-index .blog-card:hover, body.insights-index .blog-card:focus-within { transform: translateY(-3px); box-shadow: var(--gv-shadow); }
body.insights-index .blog-card-media { display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: linear-gradient(135deg,#071037,#1d5968); }
body.insights-index .blog-card-media img { display: block; width: 100%; height: 100% !important; object-fit: cover; transition: transform .25s ease; }
body.insights-index .blog-card:hover .blog-card-media img { transform: scale(1.025); }
body.insights-index .blog-card-copy { display: flex; flex: 1; flex-direction: column; gap: 11px; padding: 20px 21px 22px; }
body.insights-index .blog-card .num { width: fit-content; padding: 5px 9px; border-radius: 999px; background: #fff3f3; color: #bd0000; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
body.insights-index .blog-card h2 { margin: 0; color: var(--gv-navy); font-size: clamp(18px, 1.65vw, 21px); line-height: 1.25; letter-spacing: -.015em; }
body.insights-index .blog-card h2 a { color: inherit; text-decoration: none; }
body.insights-index .blog-card h2 a:hover { color: #c40000; }
body.insights-index .blog-card p { margin: 0; color: #526174; font-size: 13.5px; line-height: 1.65; }
body.insights-index .blog-card p.meta { margin-top: auto; padding-top: 12px; border-top: 1px solid #edf0f5; color: var(--gv-muted); font-size: 11px; }
body.insights-index .blog-card a.read { display: inline-flex; align-self: flex-start; align-items: center; min-height: 40px; margin-top: 1px; color: #b50000; font-size: 13px; font-weight: 800; text-decoration: none; }
body.insights-index .blog-card a.read:hover { text-decoration: underline; }

/* Article typography, wider media column and evidence tables. */
body.insight-article .breadcrumbs { width: min(1200px, calc(100% - 48px)); max-width: 1200px !important; }
body.insight-article .article-head { width: min(1200px, calc(100% - 48px)); max-width: 1200px !important; padding: 36px 28px 18px !important; }
body.insight-article .article-head h1 { font-size: clamp(30px, 5vw, 46px) !important; line-height: 1.1 !important; letter-spacing: -.035em !important; }
body.insight-article .dek { max-width: 980px; font-size: clamp(16px, 2vw, 18px) !important; }
body.insight-article .cover { width: min(1240px, calc(100% - 48px)); max-width: 1240px !important; margin: 22px auto 30px !important; }
body.insight-article .cover img { display: block; width: 100%; height: auto !important; }
body.insight-article .article-body { width: min(1100px, calc(100% - 48px)); max-width: 1100px !important; padding: 26px 32px 42px !important; font-size: 16px !important; line-height: 1.82 !important; }
body.insight-article .article-body img, body.insight-article .article-body svg { display: block; max-width: 100% !important; height: auto !important; margin-inline: auto; }
body.insight-article .article-body table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
body.insight-article .article-body th, body.insight-article .article-body td { min-width: 112px; }
body.insight-article .article-body blockquote { border-radius: 0 12px 12px 0; }

/* A clear, non-ambiguous product availability notice on preview pages. */
.release-status { max-width: 900px; margin: 14px auto 22px !important; padding: 13px 16px; background: #fff9e9; border: 1px solid #f3ddb0; border-left: 4px solid #d28b00; border-radius: 12px; color: #463711; font-size: 13px; line-height: 1.65; }
.illustration-caption { margin: 9px 0 0; color: var(--gv-muted); font-size: 11.5px; line-height: 1.55; text-align: center; }
#gridvik-filter-count { min-height: 1.4em; margin: 8px 0 12px; color: var(--gv-muted); font-size: 12px; }
#gridvik-no-results td { padding: 18px 12px; color: var(--gv-muted); text-align: center; }
#cookie-consent { width: min(380px, calc(100vw - 24px)); max-width: calc(100vw - 24px) !important; right: 12px !important; bottom: 12px !important; box-shadow: 0 18px 54px rgba(5,10,48,.2) !important; }

@media (max-width: 980px) {
  body.insights-index .blog-list { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body.legal-page > h1, body.legal-page > p.sub, body.legal-page > h2, body.legal-page > p:not(.sub):not(.footer):not(.note), body.legal-page > ul, body.legal-page > ol, body.legal-page > .card, body.legal-page > .note, body.legal-page > .footer { width: min(100% - 32px, 940px); }
}
@media (max-width: 640px) {
  html { scroll-padding-top: 74px; }
  .wrap { width: min(100% - 32px, 1200px); }
  .hero-grid, .grid2, .grid3, .grid4, .price-grid, .stats-grid, .foot-grid, .cta-band-inner { grid-template-columns: minmax(0, 1fr) !important; }
  .cta-band-inner { flex-direction: column !important; align-items: stretch !important; }
  .grid3, .grid4, .price-grid, .stats-grid { gap: 14px !important; }
  .foot-grid { gap: 18px !important; }
  .hero { padding: 30px 0 24px !important; }
  .hero h1, body h1 { font-size: clamp(28px, 8.2vw, 36px) !important; line-height: 1.12 !important; }
  body h2 { line-height: 1.22; }
  .card { padding: 18px !important; border-radius: 14px; }
  .cta, button, input[type="submit"] { min-height: 44px; }
  .cta { margin-left: 0; }
  form { max-width: 100%; flex-wrap: wrap; }
  form input[type="email"], form input[type="text"], form select, form textarea { width: 100%; }
  table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  th, td { min-width: 108px; }
  body.insights-index .article-head { width: calc(100% - 32px) !important; padding: 26px 16px 14px !important; }
  body.insights-index .blog-list { width: calc(100% - 32px) !important; margin-top: 20px !important; grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
  body.insights-index .blog-card-copy { padding: 17px 18px 19px; }
  body.insights-index .blog-card h2 { font-size: 19px; }
  body.insight-article .breadcrumbs, body.insight-article .article-head { width: calc(100% - 32px); }
  body.insight-article .article-head { padding: 26px 18px 14px !important; }
  body.insight-article .cover { width: calc(100% - 32px); margin: 16px auto 22px !important; }
  body.insight-article .article-body { width: calc(100% - 32px); max-width: none !important; padding: 20px 18px 32px !important; font-size: 15px !important; }
  body.legal-page > h1 { margin-top: 34px !important; }
  body.legal-page > .card { padding: 18px !important; }
  body.legal-page > p.sub, body.legal-page > p:not(.sub):not(.footer):not(.note), body.legal-page > h2 { padding-inline: 4px; }
  body.legal-page > ul, body.legal-page > ol { padding-left: 24px; padding-right: 4px; }
  body.legal-page > .footer { padding: 12px 14px !important; }
  #cookie-consent { padding: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Robust focus-only skip link: hidden on screen until keyboard focus. */
.skip-link:not(:focus):not(:focus-visible) {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important; clip-path: inset(50%) !important;
  white-space: nowrap !important; border: 0 !important; transform: none !important;
}
.skip-link:focus, .skip-link:focus-visible {
  position: fixed !important; top: 12px !important; left: 12px !important;
  width: auto !important; height: auto !important; padding: 10px 16px !important;
  margin: 0 !important; overflow: visible !important; clip: auto !important;
  clip-path: none !important; white-space: normal !important; z-index: 20001 !important;
  background: var(--gv-navy, #050a30) !important; color: #fff !important;
  border-radius: 8px !important; transform: none !important;
}