:root {
  --lnl-bg: #ffffff;
  --lnl-paper: #ffffff;
  --lnl-ink: #1c2432;
  --lnl-muted: #54617a;
  --lnl-line: #c5ccd7;
  --lnl-accent: #98621f;
  --lnl-accent-deep: #734a18;
  --lnl-panel-head: #dce2ea;
  --lnl-shadow: 0 10px 24px rgba(12, 22, 40, 0.07);
  --lnl-box-shadow: 0 2px 8px rgba(12, 22, 40, 0.08);
  --lnl-sidebar-width: 304px;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  background: #ffffff; /* radial-gradient(circle at 10% -10%, #f9fafb 0%, var(--lnl-bg) 42%, #eef1f5 100%); */
  color: var(--lnl-ink);
  font-family: "Source Sans 3", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 1.45;
}

/* Ensure body text settings cascade through all Drupal markup layers */
.lnl-content,
.lnl-content-wrap,
.lnl-content-wrap .block__content,
.lnl-content-wrap article > .content,
.lnl-content-wrap .field--name-body,
.lnl-content-wrap .view-content,
.layout__region {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

.innerCell {
  display: block;
  margin: 0 auto;
  border: #BFB8AF solid 1px;
  box-shadow: var(--lnl-box-shadow);
}

.innerCell.header {
  padding: 10px 10px 10px 10px;
  background-color:#DCE9EE;
  border-bottom:2px solid #BFB8AF;
  color:Black;
  font-style: oblique;
}

.innerCell.body {
  padding: 10px 10px 10px 10px;
  background-color:white;
}

.innerCell > .header {
  padding: 8px 10px;
  background: #dce9ee;
  border-bottom: 2px solid #bfb8af;
  font-weight: 600;
  font-size: 0.98rem;
  color: #000;
}

.innerCell > .body {
  padding: 10px;
  background: #fff;
}

.innerCell > .body h4 {
  margin: 0.8em 0 0.3em;
  font-size: 0.95rem;
  font-weight: 700;
  color: #1f2a3d;
}

.innerCell > .body h4:first-child {
  margin-top: 0;
}

.innerCell > .body ul,
.innerCell > .body ol {
  margin: 0.25em 0 0.5em;
  padding-left: 1.5em;
}

.innerCell > .body li {
  margin-bottom: 0.15em;
}

.innerCell > .body p {
  margin: 0.4em 0;
}

td, th {
  vertical-align: top;
}

a {
  color: #0b4ea9;
  text-decoration: none;
}

a:hover,
a:focus {
  text-decoration: underline;
}

/* Drupal local task tabs (Measurements / Graphs / Input Data) */
ul.tabs,
.tabs {
  list-style: none;
  margin: 0 0 0.9rem;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

ul.tabs li,
.tabs li {
  list-style: none;
  margin: 0;
  padding: 0;
}

ul.tabs li a,
.tabs li a {
  display: inline-block;
  padding: 0.42rem 0.78rem;
  border: 1px solid #cfd8e4;
  border-radius: 999px;
  background: #f6f8fb;
  color: #203047;
  text-decoration: none;
  font-weight: 600;
  line-height: 1.1;
}

ul.tabs li a:hover,
ul.tabs li a:focus,
.tabs li a:hover,
.tabs li a:focus {
  background: #e8edf5;
  border-color: #b8c5d8;
  text-decoration: none;
}

ul.tabs li.is-active a,
ul.tabs li a.is-active,
.tabs li.is-active a,
.tabs li a.is-active {
  background: #dce8fb;
  border-color: #8ea9d0;
  color: #0f2d54;
}

.lnl-shell {
  display: block;
  min-height: 100vh;
}

.lnl-body-grid {
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: var(--lnl-sidebar-width) minmax(0, 1fr);
  gap: 1.1rem;
  align-items: start;
}

.lnl-body-grid.no-sidebar {
  grid-template-columns: minmax(0, 1fr);
}

.block {
  border: 1px solid #d7e0ec;
  /* background: linear-gradient(180deg, #f7fafd 0%, #edf2f8 100%);
  box-shadow: var(--lnl-shadow); 
  border-radius: 12px; */
  position: sticky;
  top: 1rem;
  align-self: start;
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
}

.lnl-sidebar {
  position: sticky;
  top: 1rem;
  align-self: start;
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
}

.lnl-sidebar-inner {
  padding: 1.5rem 0.9rem 1rem 0.5rem;
}

.lnl-sidebar-title,
.lnl-sidebar .block > h2 {
  display: none;
}

.lnl-sidebar ul {
  list-style: none !important;
  margin: 0;
  padding-left: 0;
}

.lnl-sidebar li {
  list-style: none !important;
}

.lnl-sidebar .menu {
  margin: 0;
  padding: 0.45rem;
  list-style: none;
  background: rgba(255, 255, 255, 0.8);
}

.lnl-sidebar .lnl-modern-tree {
  margin: 0;
  padding: 0.45rem 0rem 1rem 0rem
}

.lnl-sidebar .menu-item,
.lnl-sidebar .menu li {
  margin: 0;
  position: relative;
}

.lnl-sidebar .menu-item > a,
.lnl-sidebar .menu li > a {
  display: block;
  margin: 0.1rem 0;
  padding: 0.44rem 0.65rem;
  padding-left: calc(0.9rem + (var(--lnl-depth, 0) * 0.92rem) + 1.25rem);
  color: #44546f;
  font-size: 0.92rem;
  line-height: 1.3;
}

.lnl-sidebar .lnl-modern-tree li > a {
  display: block;
  padding: 0.44rem 0.65rem;
  padding-left: calc(0.2rem + (var(--lnl-depth, 0) * 0.92rem) + 1.25rem);
  color: #44546f;
  font-size: 0.92rem;
  line-height: 1.3;
  transition: background-color 0.18s ease, color 0.18s ease;
}

.lnl-sidebar .lnl-menu-item--branch > a,
.lnl-sidebar .lnl-dhtml-branch > a {
  font-weight: 600;
}

.lnl-sidebar .lnl-menu-item--leaf > a {
  padding-left: calc(0.95rem + (var(--lnl-depth, 0) * 0.92rem) + 0.35rem);
  font-weight: 500;
}

.lnl-sidebar .lnl-menu-toggle {
  display: none;
}

.lnl-sidebar.lnl-tree-enhanced .menu-item > .menu[hidden],
.lnl-sidebar.lnl-tree-enhanced li > ul[hidden] {
  display: none;
}

.lnl-sidebar .menu-item > a:hover,
.lnl-sidebar .menu-item > a:focus,
.lnl-sidebar .menu-item--active-trail > a {
  background: #dce8fb;
  color: #0f2d54;
  text-decoration: none;
}

.lnl-sidebar .is-active {
  font-weight: bold;
  text-decoration: none;
  color: #172b4c;
  background: #dce8fb;
}

.lnl-sidebar .menu .menu,
.lnl-sidebar .lnl-modern-tree li > ul { 
  display: none;
  margin: 0;
  padding: 0;
}

.lnl-sidebar .menu-item--active-trail > .menu,
.lnl-sidebar .lnl-menu-item--open > .menu,
.lnl-sidebar .lnl-dhtml-branch.lnl-menu-item--open > ul,
.lnl-sidebar .menu-item--active-trail > ul,
.lnl-sidebar .lnl-modern-tree li.lnl-menu-item--open > ul,
.lnl-sidebar .lnl-modern-tree li.menu-item--active-trail > ul {
  display: block;
}

.lnl-main {
  padding: 1.15rem clamp(1rem, 2vw, 2rem) 2.25rem;
}

.lnl-header {
  max-width: none;
  margin: 0 0 1rem;
  background: var(--lnl-paper);
  border: 1px solid var(--lnl-line);
  box-shadow: var(--lnl-shadow);
}

.lnl-title-group {
  min-width: 0;
}

.lnl-site-name {
  margin: 0;
  font-family: "Cormorant Garamond", "Times New Roman", serif;
  font-size: clamp(2rem, 5vw, 4rem);
  font-weight: 600;
  line-height: 0.95;
  letter-spacing: 0.005em;
  color: var(--lnl-accent);
}

.lnl-site-name a {
  color: inherit;
  text-decoration: none;
}

.lnl-site-slogan {
  margin: 0.4rem 0 0;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.72rem;
  color: var(--lnl-accent-deep);
}

.lnl-header-brand {
  display: block;
  width: 100%;
}

.lnl-site-logo-link {
  display: inline-block;
  max-width: 100%;
}

.lnl-site-logo {
  display: block;
  width: min(288px, 100%);
  height: auto;
}

.lnl-utility-row {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: fit-content;
  margin: 0.55rem 1.25rem 0 auto;
  padding: 0.35rem 0.75rem;
  border: 1px solid var(--lnl-line);
  border-radius: 10px;
  background: #f8fafd;
  gap: 0.5rem;
}

.lnl-breadcrumb,
.lnl-highlighted,
.lnl-content-wrap,
.lnl-footer {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}

/* ── Responsible staff block ─────────────────────────────────────────────── */
.lnl-responsible-staff {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding: 0.75rem 0.85rem;
}

.lnl-staff-card {
  flex: 1 1 200px;
  min-width: 180px;
  border: 1px solid #d7e0ec;
  background: #f7fafd;
  padding: 0.65rem 0.85rem;
  font-size: 0.9rem;
}

.lnl-staff-card__name {
  font-weight: 700;
  margin-bottom: 0.35rem;
}

.lnl-staff-card__name a {
  color: #172b4c;
  text-decoration: none;
}

.lnl-staff-card__name a:hover {
  text-decoration: underline;
}

.lnl-staff-card__details {
  margin: 0;
  padding: 0;
}

.lnl-staff-card__details dd {
  margin: 0.1rem 0;
  color: #44546f;
}

.lnl-staff-role {
  display: block;
  font-style: italic;
  color: #44546f;
}

.lnl-staff-email a {
  color: #0b4ea9;
}

.lnl-breadcrumb {
  margin-bottom: 0.8rem;
}

.lnl-highlighted {
  margin-bottom: 1rem;
}

.lnl-content-wrap {
  background: transparent;
  max-width: none;
  width: 100%;
  margin: 0;
}

.lnl-content-wrap .layout--onecol,
.lnl-content-wrap .layout--twocol,
.lnl-content-wrap .layout--twocol-section,
.lnl-content-wrap .layout--threecol-section,
.lnl-content-wrap .layout--fourcol-section {
  margin-bottom: 1rem;
  align-items: flex-start;
}

.lnl-content-wrap .layout--onecol > .layout__region,
.lnl-content-wrap .layout--twocol > .layout__region,
.lnl-content-wrap .layout--twocol-section > .layout__region,
.lnl-content-wrap .layout--threecol-section > .layout__region,
.lnl-content-wrap .layout--fourcol-section > .layout__region {
  padding: 0.85rem;
}

/* Remove extra margin/padding from nested layouts inside two-col regions */
.lnl-content-wrap .layout--twocol-section > .layout__region .layout--onecol {
  margin-bottom: 0;
}
.lnl-content-wrap .layout--twocol-section > .layout__region .layout--onecol > .layout__region {
  padding: 0;
}

.lnl-content-top,
.lnl-content,
.lnl-content-bottom {
  margin-bottom: 1rem;
}

.lnl-content-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.2rem;
}

.lnl-content-top .block + .block {
  margin-top: 0;
}

#block-lnl-pagetitle {
  grid-column: 1 / -1;
  border: none;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.lnl-content-wrap .block,
.lnl-content-wrap article,
.lnl-content-wrap .views-element-container {
  /*border: 1px solid var(--lnl-line);
  background: var(--lnl-paper);
  box-shadow: var(--lnl-shadow);*/LNL FAQ/Knowledge Base
}

.lnl-content-wrap .block + .block,
.lnl-content-wrap .views-element-container + .views-element-container,
.lnl-content-wrap article + article:not(.lnl-tool-card) {
  margin-top: 1rem;
}

.lnl-content-wrap .block > h2,
.lnl-content-wrap .views-element-container > h2,
.lnl-content-wrap article > h2,
.lnl-content-wrap .field--name-title {
  margin: 0;
  padding: 0.58rem 0.85rem;
  background: var(--lnl-panel-head);
  border-bottom: 1px solid var(--lnl-line);
  font-family: "Source Sans 3", "Segoe UI", sans-serif;
  font-size: 1.03rem;
  font-weight: 700;
  color: #1f2a3d;
}

.lnl-content-wrap .block__content,
.lnl-content-wrap article > .content,
.lnl-content-wrap .field--name-body,
.lnl-content-wrap .view-content {
  padding: 0.95rem 0.85rem 1.1rem;
}

.lnl-content-wrap h1,
.lnl-content-wrap h2,
.lnl-content-wrap h3 {
  /*font-family: "Cormorant Garamond", "Times New Roman", serif;*/
  color: var(--lnl-accent);
  letter-spacing: 0.01em;
}

.lnl-content-wrap h2 {
  font-size: clamp(2rem, 5vw, 3.05rem);
  text-align: left;
  margin: 1.15rem 0 0.65rem;
}

.lnl-content-wrap h3 {
  font-size: clamp(1.4rem, 2.8vw, 2rem);
  margin: 0.9rem 0 0.45rem;
}

.lnl-content-wrap img {
  max-width: 100%;
  height: auto;
}

.lnl-content-wrap .lnl-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem;
}

.lnl-content-wrap .lnl-feature-card {
  border: 1px solid var(--lnl-line);
  background: var(--lnl-paper);
}

.lnl-content-wrap .lnl-feature-card img {
  display: block;
  width: 100%;
}

.lnl-content-wrap .lnl-feature-card h3 {
  margin: 0;
  padding: 0.75rem;
  text-align: center;
  border-top: 3px solid var(--lnl-accent);
  border-bottom: 3px solid var(--lnl-accent);
  font-size: clamp(2rem, 4vw, 2.9rem);
}

.lnl-content-wrap .lnl-section-landing {
  padding: 0.2rem 0.15rem;
}

.lnl-content-wrap .lnl-section-landing > p:first-child {
  margin-top: 0;
}

.lnl-content-wrap .lnl-tool-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 300px;
  gap: 1rem;
  margin: 1rem 0 0.75rem;
}

.lnl-content-wrap .lnl-home-category-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 500px;
  margin-top: 1.5rem;
}
.lnl-content-wrap .lnl-home-category-grid .lnl-tool-card h3 {
  display: none;
}
.lnl-content-wrap .lnl-home-category-grid .lnl-tool-card-image {
  height: 100%;
}

.lnl-content-wrap .lnl-tool-card {
  border: 1px solid var(--lnl-line);
  background: #fff;
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  height: 100%;
  box-shadow: var(--lnl-box-shadow);
}

.lnl-content-wrap .lnl-tool-card h3 {
  margin: 0;
  padding: 0.65rem 0.65rem 0.5rem;
  font-size: 1.05rem;
  line-height: 1.2;
  text-align: center;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.lnl-content-wrap .lnl-tool-card h3 a {
  color: #1f2e45;
  text-decoration: none;
}

.lnl-content-wrap .lnl-tool-card .lnl-tool-card-link::after {
  content: "";
  position: absolute;
  inset: 0;
}

.lnl-content-wrap .lnl-tool-card h3 a:hover,
.lnl-content-wrap .lnl-tool-card h3 a:focus {
  text-decoration: underline;
}

.lnl-content-wrap .lnl-tool-card-image {
  display: block;
  padding: 0.45rem 0.65rem 0.75rem;
  position: relative;
  z-index: 1;
  height: 240px;
  flex-shrink: 0;
  overflow: hidden;
}

.lnl-content-wrap .lnl-tool-card-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.lnl-content-wrap .lnl-tool-detail-template {
  padding: 0.2rem 0.15rem;
}

.lnl-content-wrap .lnl-tool-detail-template h2 {
  text-align: left;
  font-size: clamp(1.25rem, 2.2vw, 1.7rem);
  margin: 1rem 0 0.55rem;
  padding: 0.35rem 0.5rem;
  border-left: 4px solid var(--lnl-accent);
  background: #f6f8fb;
}

.lnl-content-wrap .lnl-tool-detail-template ul {
  margin-top: 0.35rem; 
}

.lnl-content-wrap .lnl-tool-detail-template p,
.lnl-content-wrap .lnl-tool-detail-template li {
  font-size: 0.98rem;
}

.lnl-shell.layout-home .lnl-content-wrap {
  max-width: 1180px;
  margin: 0 auto;
  /* padding-left: 20px; */
  /* padding-right: 20px; */
}

.lnl-shell.layout-home .lnl-content {
  /*background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  border: 1px solid var(--lnl-line);
  border-radius: 12px;*/
  /* padding: 1.25rem 1.5rem; */
}
.lnl-shell.layout-home .lnl-content-wrap article,
.lnl-shell.layout-home .lnl-content-wrap .block {
  border: none;
  background: transparent;
  box-shadow: none;
}
.lnl-shell.layout-home .lnl-content-wrap article > .content {
  padding: 0;
}
.lnl-shell.layout-home .lnl-home-top-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(260px, 1fr);
  gap: 1.15rem;
  align-items: start;
}
.lnl-shell.layout-home .lnl-home-main-copy,
.lnl-shell.layout-home .lnl-home-news-column,
.lnl-shell.layout-home .lnl-home-links-row > div {
  border: 1px solid var(--lnl-line);
  background: #fff;
}
.lnl-shell.layout-home .lnl-home-news-column .block > h2,
.lnl-shell.layout-home .lnl-home-news-column .views-element-container > h2,
.lnl-shell.layout-home .lnl-home-news-column .field--name-title {
  margin: 0;
  padding: 0.58rem 0.85rem;
  background: var(--lnl-panel-head);
  border-bottom: 1px solid var(--lnl-line);
  font-family: "Source Sans 3", "Segoe UI", sans-serif;
  font-size: 1.03rem;
  font-weight: 700;
  color: #1f2a3d;
}
.lnl-shell.layout-home .lnl-home-links-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1.15rem;
  margin-top: 1.15rem;
}

.lnl-shell.layout-section .lnl-content-wrap {
  max-width: 1180px;
  margin: 0 auto;
  
}

.lnl-shell.bundle-lnl-tool-category .contentLayout2 .lnl-tool-grid:not(.lnl-subsection-grid) {
  display: none;
}

.lnl-shell.layout-documentation .lnl-content-wrap {
  max-width: 1180px;
  margin: 0 auto;
}

.lnl-shell.layout-documentation .lnl-content {
  border-left: 5px solid var(--lnl-accent);
  padding-left: 1.25rem;
}

/* Tool detail, document, and FAQ pages: no left accent border. */
.lnl-shell.bundle-lnl-tool-detail .lnl-content,
.lnl-shell.bundle-lnl-document .lnl-content,
.lnl-shell.bundle-lnl-faq .lnl-content {
  border-left: 0;
  padding: 0;
}

.lnl-shell.bundle-lnl-tool-detail .contentLayout2 {
  display: block;
}

.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region,
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .layout--onecol > .layout__region {
  display: grid;
  grid-template-columns: minmax(300px, 1.15fr) minmax(320px, 1fr);
  grid-template-rows: auto 1fr;
  grid-auto-rows: auto;
  gap: 1rem;
  align-items: start;
}

.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div,
.lnl-shell.bundle-lnl-tool-detail .lnl-innercell-wrapper,
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell,
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell\.header,
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell\.body {
  margin: 0;
}

.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(1),
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell:nth-of-type(1) {
  grid-column: 1;
  grid-row: 1 / span 2;
}

.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(2),
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell:nth-of-type(2) {
  grid-column: 2;
  grid-row: 1;
}

.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(3),
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell:nth-of-type(3) {
  grid-column: 2;
  grid-row: 2;
}

.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(4) {
  grid-column: 1;
  grid-row: 3;
}

.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(5) {
  grid-column: 2;
  grid-row: 3;
}

.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(6) {
  grid-column: 1 / -1;
  grid-row: 4;
}

.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(7) {
  grid-column: 1 / -1;
  grid-row: 5;
}

.lnl-shell.bundle-lnl-tool-detail .lnl-innercell-wrapper > .innerCell,
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell,
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell\.header,
.lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell\.body {
  border: 1px solid #bfb8af;
  background: #fff;
}

.lnl-shell.bundle-lnl-tool-detail .lnl-innercell-wrapper:nth-of-type(1) .innerCell {
  border: 0;
  background: transparent;
}

.lnl-shell.bundle-lnl-tool-detail .lnl-tool-image-wrapper,
.lnl-shell.bundle-lnl-tool-detail .lnl-tool-image-wrapper.innerCell {
  border: 0;
  background: transparent;
}

.lnl-shell.bundle-lnl-tool-detail .lnl-innercell-wrapper:nth-of-type(1) img,
.lnl-shell.bundle-lnl-tool-detail .lnl-tool-image-wrapper img,
.lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(1) img {
  display: block;
  width: min(100%, 420px);
  height: auto;
  margin: 0 auto;
}

.lnl-shell.bundle-lnl-tool-detail .innerCell.header,
.lnl-shell.bundle-lnl-tool-detail .innerCell .header,
.lnl-shell.bundle-lnl-tool-detail .innerCell\.header {
  padding: 0.65rem 0.85rem;
  background: #c8d3db;
  border-bottom: 1px solid #bfb8af;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  color: #172232;
  font-size: 1.03rem;
  font-weight: 700;
}

.lnl-shell.bundle-lnl-tool-detail .innerCell.body,
.lnl-shell.bundle-lnl-tool-detail .innerCell .body,
.lnl-shell.bundle-lnl-tool-detail .innerCell\.body {
  padding: 0.9rem;
  background: #fff;
}

.lnl-shell.bundle-lnl-tool-detail .lnl-innercell-wrapper .innerCell > .body > :first-child {
  margin-top: 0;
}

.lnl-shell.bundle-lnl-tool-detail .lnl-innercell-wrapper .innerCell > .body > :last-child {
  margin-bottom: 0;
}

.lnl-shell.bundle-lnl-tool-detail .lnl-innercell-wrapper .innerCell > .body ul {
  margin-top: 0.35rem;
}

.lnl-shell.bundle-lnl-tool-detail .innerCell img {
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 980px) {
  .lnl-shell.bundle-lnl-tool-detail .contentLayout2 {
    grid-template-columns: minmax(0, 1fr);
  }

  .lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region,
  .lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .layout--onecol > .layout__region {
    grid-template-columns: minmax(0, 1fr);
  }

  .lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(1),
  .lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(2),
  .lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(3),
  .lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(4),
  .lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(5),
  .lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(6),
  .lnl-shell.bundle-lnl-tool-detail #block-lnl-content > article > div > .layout--onecol > .layout__region > div:nth-of-type(7),
  .lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell:nth-of-type(1),
  .lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell:nth-of-type(2),
  .lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell:nth-of-type(3),
  .lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .innerCell:nth-of-type(n + 4) {
    grid-column: 1;
    grid-row: auto;
  }

  .lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .layout--onecol > .layout__region > .block:nth-of-type(n),
  .lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .layout--onecol > .layout__region > .views-element-container:nth-of-type(n),
  .lnl-shell.bundle-lnl-tool-detail .contentLayout2 > .layout--onecol > .layout__region > article:nth-of-type(n) {
    grid-column: 1;
    grid-row: auto;
  }
}

.lnl-footer {
  margin-top: 1rem;
  padding: 0.75rem 0.25rem;
  color: #4a576f;
  font-size: 0.88rem;
}

.lnl-reveal {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

html.js .lnl-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 1080px) {
  .lnl-body-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .lnl-sidebar {
    position: relative;
    top: 0;
    max-height: none;
  }
}

@media (max-width: 820px) {
  .lnl-brand-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .lnl-brand-right {
    justify-self: start;
  }

  .lnl-site-name {
    line-height: 1;
  }

  .lnl-content-wrap .lnl-feature-grid {
    grid-template-columns: 1fr;
  }

  .lnl-content-wrap .lnl-tool-grid {
    grid-template-columns: 1fr;
  }

  .lnl-home-category-grid {
    grid-template-columns: 1fr;
  }

  .lnl-content-top {
    grid-template-columns: 1fr;
  }

  .lnl-content-wrap .layout--onecol > .layout__region,
  .lnl-content-wrap .layout--twocol > .layout__region,
  .lnl-content-wrap .layout--twocol-section > .layout__region,
  .lnl-content-wrap .layout--threecol-section > .layout__region,
  .lnl-content-wrap .layout--fourcol-section > .layout__region {
    padding: 0.5rem;
  }
.lnl-shell.layout-home .lnl-home-top-grid,
.lnl-shell.layout-home .lnl-home-links-row {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ========================================
   LNL Tool Category Template Styles
   ======================================== */
.lnl-tool-category-template {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding: 1.5rem;
  background-color: var(--lnl-light-bg, #f9f9f9);
  border-radius: 8px;
  border-left: 4px solid var(--lnl-accent, #0066cc);
}

.lnl-tool-category-template h3 {
  margin-top: 0;
  margin-bottom: 1rem;
  color: var(--lnl-text, #222);
  font-size: 1.3rem;
  font-weight: 700;
}

.lnl-tool-category-template p {
  margin: 0.5rem 0;
  line-height: 1.6;
}

/* ========================================
   LNL Method/Procedure Template Styles
   ======================================== */
.lnl-method-template {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem;
  background-color: var(--lnl-light-bg, #f9f9f9);
  border-radius: 8px;
  border-left: 4px solid var(--lnl-accent, #0066cc);
}

.lnl-method-template h3 {
  margin-top: 0;
  margin-bottom: 0.75rem;
  color: var(--lnl-text, #222);
  font-size: 1.2rem;
  font-weight: 700;
}

.lnl-method-template ol {
  margin: 0;
  padding-left: 2rem;
}

.lnl-method-template li {
  margin-bottom: 0.75rem;
  line-height: 1.6;
}

.lnl-method-template ul {
  margin: 0.5rem 0;
  padding-left: 1.5rem;
}

/* ========================================
   LNL FAQ/Knowledge Base Styles
   ======================================== */
.lnl-faq-template {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem;
  background-color: var(--lnl-light-bg, #f9f9f9);
  border-radius: 8px;
}

.lnl-faq-item {
  padding: 1rem;
  background-color: white;
  border: 1px solid var(--lnl-line, #e0e0e0);
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.lnl-faq-question {
  margin: 0 0 0.5rem 0;
  padding: 0.5rem;
  color: var(--lnl-text, #222);
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
}

.lnl-faq-question::before {
  content: '▼ ';
  margin-right: 0.5rem;
  color: var(--lnl-accent, #0066cc);
  font-size: 0.8em;
}

.lnl-faq-item.collapsible .lnl-faq-question::before {
  content: '▶ ';
}

.lnl-faq-answer {
  margin: 0;
  padding: 0.75rem 0.5rem;
  color: var(--lnl-text, #222);
  line-height: 1.6;
}

.lnl-faq-answer p {
  margin: 0.5rem 0;
}

/* ========================================
   LNL Team Profile Styles
   ======================================== */
.lnl-team-profile {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem;
  background-color: var(--lnl-light-bg, #f9f9f9);
  border: 1px solid var(--lnl-line, #e0e0e0);
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.lnl-team-profile h3 {
  margin: 0 0 0.75rem 0;
  color: var(--lnl-text, #222);
  font-size: 1.2rem;
  font-weight: 700;
}

.lnl-team-profile p {
  margin: 0.5rem 0;
  line-height: 1.6;
}

.lnl-team-profile strong {
  color: var(--lnl-accent, #0066cc);
  font-weight: 700;
}

.lnl-team-profile ul {
  margin: 0.75rem 0;
  padding-left: 1.5rem;
}

.lnl-team-profile li {
  margin-bottom: 0.5rem;
}

/* ========================================
   LNL News/Blog Post Styles
   ======================================== */
.lnl-news-post {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem;
  background-color: var(--lnl-light-bg, #f9f9f9);
  border-left: 4px solid var(--lnl-accent, #0066cc);
  border-radius: 6px;
}

.lnl-news-post h2 {
  margin: 0 0 1rem 0;
  color: var(--lnl-text, #222);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
}

.lnl-news-post h3 {
  margin: 1.5rem 0 0.75rem 0;
  color: var(--lnl-text, #222);
  font-size: 1.1rem;
  font-weight: 700;
}

.lnl-news-post p {
  margin: 0.75rem 0;
  line-height: 1.7;
}

.lnl-news-post ul,
.lnl-news-post ol {
  margin: 0.75rem 0;
  padding-left: 2rem;
}

.lnl-news-post li {
  margin-bottom: 0.5rem;
}

/* ========================================
   LNL Document Library Styles
   ======================================== */
.lnl-document {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem;
  background-color: var(--lnl-light-bg, #f9f9f9);
  border: 1px solid var(--lnl-line, #ddd);
  border-radius: 8px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}

.lnl-document h2 {
  margin: 0 0 0.75rem 0;
  color: var(--lnl-text, #222);
  font-size: 1.5rem;
  font-weight: 700;
}

.lnl-document h3 {
  margin: 1.5rem 0 0.75rem 0;
  color: var(--lnl-accent, #0066cc);
  font-size: 1.1rem;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.9rem;
  letter-spacing: 0.5px;
  margin-bottom: 1rem;
}

.lnl-document p {
  margin: 0.5rem 0;
  line-height: 1.6;
}

.lnl-document strong {
  font-weight: 700;
  color: var(--lnl-text, #222);
}

/* File list styling within documents */
.lnl-document ul {
  margin: 1rem 0;
  padding-left: 1.5rem;
  list-style: none;
}

.lnl-document li {
  margin-bottom: 0.75rem;
  padding-left: 1.5rem;
  position: relative;
}

.lnl-document li::before {
  content: '📎';
  position: absolute;
  left: 0;
  top: 0;
}

.lnl-document a {
  color: var(--lnl-accent, #0066cc);
  text-decoration: none;
  transition: color 0.2s ease;
}

.lnl-document a:hover {
  text-decoration: underline;
  color: var(--lnl-accent-dark, #0052a3);
}

/* ========================================
   LNL Document — PDF / file card grid
   Replicates the Confluence attachment-card
   layout: heading + inline preview + badge.
   ======================================== */

.lnl-doc-description {
  margin-bottom: 1.5rem;
}

/* Three-column card grid */
.lnl-doc-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem 1.5rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}

/* Each column item */
.lnl-doc-grid__item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

/* Heading above the card (file description / filename) */
.lnl-doc-grid__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  color: var(--lnl-text, #222);
  text-align: center;
  line-height: 1.3;
  font-family: "Source Sans 3", "Segoe UI", sans-serif;
}

/* The card link wraps the whole preview area */
.lnl-doc-grid__card {
  display: block;
  text-decoration: none;
  color: inherit;
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
  background: #fff;
  transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.lnl-doc-grid__card:hover,
.lnl-doc-grid__card:focus-visible {
  box-shadow: 0 5px 18px rgba(0, 0, 0, 0.26);
  transform: translateY(-2px);
  outline: 2px solid var(--lnl-accent, #0066cc);
  outline-offset: 2px;
}

/* Preview container — fixed height, clips the PDF/icon */
.lnl-doc-grid__preview {
  position: relative;
  height: 290px;
  overflow: hidden;
  background: #f0f0f0;
}

/* Native browser PDF embed — fills the preview area.
   pointer-events: none ensures the parent <a> receives clicks. */
.lnl-doc-grid__embed {
  display: block;
  width: 100%;
  height: 100%;
  border: none;
  pointer-events: none;
}

/* Transparent overlay that captures pointer events above the <object>,
   forwarding clicks to the parent <a> element. */
.lnl-doc-grid__overlay {
  position: absolute;
  inset: 0;
  background: transparent;
  cursor: pointer;
}

/* Fallback shown when PDF embed is not supported */
.lnl-doc-grid__nopreview {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  background: #e8edf5;
}

.lnl-doc-grid__nopreview-ext {
  font-size: 2rem;
  font-weight: 700;
  color: var(--lnl-accent, #0066cc);
  letter-spacing: 1px;
}

/* File-type badge — lower-left corner of the preview */
.lnl-doc-grid__badge {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 9px;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: #fff;
  background: #c0392b; /* default: PDF red */
  border-top-right-radius: 3px;
}

/* Per-extension badge colours */
.lnl-doc-grid__badge--pdf  { background: #c0392b; }
.lnl-doc-grid__badge--doc,
.lnl-doc-grid__badge--docx { background: #2b5eb8; }
.lnl-doc-grid__badge--xls,
.lnl-doc-grid__badge--xlsx { background: #1e7e40; }
.lnl-doc-grid__badge--ppt,
.lnl-doc-grid__badge--pptx { background: #b7440b; }
.lnl-doc-grid__badge--txt  { background: #555; }

.lnl-doc-grid__badge-icon {
  width: 13px;
  height: 15px;
  flex-shrink: 0;
}

/* ---- Responsive tweaks ---- */
@media (max-width: 640px) {
  .lnl-doc-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 1.25rem 1rem;
  }

  .lnl-doc-grid__preview {
    height: 210px;
  }
}

@media (max-width: 380px) {
  .lnl-doc-grid {
    grid-template-columns: 1fr;
  }
}

/* ========================================
   LNL Document — child-page icon grid
   (e.g. "Staff Documents" container pages)
   Matches Confluence 3-col icon layout:
   blue link title above, large icon below,
   no border / shadow on cards.
   ======================================== */

/* Override the default bordered card style for this variant */
.lnl-tool-grid.lnl-doc-icon-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem 1.5rem;
  margin-top: 1.5rem;
}

.lnl-tool-grid.lnl-doc-icon-grid .lnl-tool-card {
  border: none;
  background: transparent;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Title: blue link, centred, no underline unless hovered */
.lnl-tool-grid.lnl-doc-icon-grid .lnl-tool-card h3 {
  order: 1;
  padding: 0 0.25rem 0.6rem;
  font-size: 1rem;
  font-weight: 600;
}

.lnl-tool-grid.lnl-doc-icon-grid .lnl-tool-card h3 a {
  color: var(--lnl-accent, #0066cc);
  text-decoration: none;
}

.lnl-tool-grid.lnl-doc-icon-grid .lnl-tool-card h3 a:hover,
.lnl-tool-grid.lnl-doc-icon-grid .lnl-tool-card h3 a:focus-visible {
  text-decoration: underline;
}

/* Image: comes second (below title), large and centred */
.lnl-tool-grid.lnl-doc-icon-grid .lnl-tool-card .lnl-tool-card-image {
  order: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0;
}

.lnl-tool-grid.lnl-doc-icon-grid .lnl-tool-card .lnl-tool-card-image img {
  width: auto;
  max-width: 100%;
  max-height: 100px;
  height: auto;
  object-fit: contain;
}

/* Placeholder icon when no image is available */
.lnl-tool-grid.lnl-doc-icon-grid .lnl-tool-card:not(:has(.lnl-tool-card-image))::after {
  order: 2;
  content: '📄';
  font-size: 3rem;
  display: block;
}

/* Stretch the invisible overlay link across the full card */
.lnl-tool-grid.lnl-doc-icon-grid .lnl-tool-card .lnl-tool-card-link::after {
  content: "";
  position: absolute;
  inset: 0;
}

@media (max-width: 640px) {
  .lnl-tool-grid.lnl-doc-icon-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem 1rem;
  }
}

@media (max-width: 380px) {
  .lnl-tool-grid.lnl-doc-icon-grid {
    grid-template-columns: 1fr;
  }
}

/* ─── Confluence layout conversion ─────────────────────────────────────────── */
/* Styles for divs produced by lnl_migrate_update_9010 when converting raw
   Confluence <ac:layout> / <ac:layout-section> / <ac:layout-cell> tags. */

.confluence-layout {
  width: 100%;
}

.confluence-columns {
  display: grid;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
}

.confluence-columns.three-equal {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.confluence-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.confluence-cell h3 {
  margin-bottom: 0.75rem;
}

.confluence-cell img {
  max-width: 140px;
  height: auto;
  display: block;
  margin: 0 auto 0.5rem;
}

@media (max-width: 820px) {
  .confluence-columns.three-equal {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .confluence-columns.three-equal {
    grid-template-columns: 1fr;
  }
}

/* ── Tool detail panel fields — align left, valign top ─────────── */
.lnl-panel-body .field,
.lnl-panel-body .field__label,
.lnl-panel-body .field__item,
.lnl-panel-body p,
.lnl-panel-body td,
.lnl-panel-body th {
  text-align: left;
  vertical-align: top;
}

.lnl-tech-info-staff-wrap {
  margin-top: 1rem;
  border-top: 1px solid #dce2ea;
  padding-top: 0.75rem;
}

.lnl-tech-info-staff-wrap ul {
  margin: 0.25rem 0 0 1.25rem;
  padding: 0;
}

.lnl-hidden { display: none !important; }

/* ── Team Profile pages ─────────────────────────────────────────── */
.lnl-profile {
  max-width: 780px;
}

.lnl-profile__photo {
  float: right;
  margin: 0 0 1.25rem 1.75rem;
  flex-shrink: 0;
}

.lnl-profile__photo img {
  display: block;
  border-radius: 4px;
  max-width: 180px;
  height: auto;
}

.lnl-profile__role {
  font-size: 1.05rem;
  margin-bottom: 1.25rem;
}

.lnl-profile__section-title {
  font-size: 1rem;
  font-weight: 700;
  text-decoration: underline;
  border: none;
  margin: 1.5rem 0 0.5rem;
  padding: 0;
  color: inherit;
}

.lnl-profile__contact-list,
.lnl-profile__tools-list {
  list-style: disc;
  padding-left: 1.5rem;
  margin: 0 0 1rem;
}

.lnl-profile__contact-list li,
.lnl-profile__tools-list li {
  margin-bottom: 0.25rem;
}

.lnl-profile__info {
  clear: both;
  margin-top: 1.5rem;
}

@media (max-width: 560px) {
  .lnl-profile__photo {
    float: none;
    margin: 0 0 1rem 0;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   Consolidated from modules/custom/lundnanolab_starter/style.css
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Tool Detail – Confluence-style panels ───────────────────────────────── */
.bundle-lnl-tool-detail .layout__region--content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.25rem;
  align-items: start;
}

.bundle-lnl-tool-detail .lnl-tool-image-wrapper {
  grid-column: 1;
  grid-row: 1 / 4;
}

.bundle-lnl-tool-detail .lnl-tool-image-wrapper img {
  width: 100%;
  height: auto;
  display: block;
}

.bundle-lnl-tool-detail .lnl-innercell-panel:not(.lnl-bottom-panel) {
  grid-column: 2;
}

.bundle-lnl-tool-detail .lnl-bottom-panel {
  grid-row: 4;
  align-self: start;
}

.bundle-lnl-tool-detail .lnl-bottom-panel--doc {
  grid-column: 1;
}

.bundle-lnl-tool-detail .lnl-bottom-panel--links {
  grid-column: 2;
}

.bundle-lnl-tool-detail .lnl-hidden {
  display: none;
}

/* Override generic block styling inside tool-detail panels */
.bundle-lnl-tool-detail .lnl-content .innerCell {
  box-shadow: none;
}

.bundle-lnl-tool-detail .lnl-content .lnl-innercell-wrapper:not(.lnl-tool-image-wrapper) {
  background: none;
  box-shadow: var(--lnl-box-shadow);
}

.bundle-lnl-tool-detail .lnl-content .lnl-innercell-wrapper.lnl-tool-image-wrapper {
  background: none;
  border: none;
  box-shadow: none;
}

.bundle-lnl-tool-detail .lnl-content-wrap article,
.bundle-lnl-tool-detail .lnl-content-wrap .block {
  border: none;
  box-shadow: none;
}

.bundle-lnl-tool-detail .lnl-tool-image-wrapper img {
  width: 100%;
  height: auto;
  display: block;
  background: transparent;
}

.bundle-lnl-tool-detail .lnl-innercell-wrapper > h2 {
  display: none;
}

/* Extra Information – plain section, no panel decoration, left column below image */
.bundle-lnl-tool-detail .lnl-extra-information {
  grid-column: 1;
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
}

.bundle-lnl-tool-detail .lnl-content .lnl-innercell-wrapper.lnl-extra-information {
  box-shadow: none;
  border: none;
  background: none;
}

@media (max-width: 720px) {
  .bundle-lnl-tool-detail .layout__region--content {
    grid-template-columns: 1fr;
  }

  .bundle-lnl-tool-detail .lnl-tool-image-wrapper {
    grid-column: auto;
    grid-row: auto;
  }

  .bundle-lnl-tool-detail .lnl-innercell-panel:not(.lnl-bottom-panel) {
    grid-column: auto;
  }
}

/* ── Process Instructions – Confluence-style grid ────────────────────────── */
.lnl-process-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}

.lnl-process-col {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.lnl-process-bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}

.lnl-info-box {
  margin: 0.75em 0;
  padding: 10px 12px 10px 36px;
  background: #deebff;
  border-left: 3px solid #2684ff;
  border-radius: 3px;
  font-size: 0.93rem;
  line-height: 1.45;
  position: relative;
}

.lnl-info-box::before {
  content: "\2139";
  position: absolute;
  left: 12px;
  top: 10px;
  color: #2684ff;
  font-weight: 700;
  font-size: 1rem;
}

.lnl-warning-box {
  margin: 0.75em 0;
  padding: 10px 12px 10px 36px;
  background: #fffae6;
  border-left: 3px solid #ffab00;
  border-radius: 3px;
  font-size: 0.93rem;
  line-height: 1.45;
  position: relative;
}

.lnl-warning-box::before {
  content: "\26A0";
  position: absolute;
  left: 10px;
  top: 9px;
  color: #ff8b00;
  font-weight: 700;
  font-size: 1.1rem;
}

@media (max-width: 720px) {
  .lnl-process-grid,
  .lnl-process-bottom {
    grid-template-columns: 1fr;
  }
}

/* ── Top bar — search + user actions ─────────────────────────────────────── */
.lnl-topbar {
  background: #1c2432;
  color: #cfd8e8;
  font-size: 0.82rem;
  line-height: 1;
  position: sticky;
  top: 0;
  z-index: 1000;
}

.lnl-topbar__inner {
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem;
  padding: 0.4rem 1.25rem;
}

.lnl-topbar__search {
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 4px;
  overflow: hidden;
}

.lnl-topbar__search-input {
  border: none;
  background: transparent;
  color: #fff;
  padding: 0.32rem 0.55rem;
  font-size: 0.82rem;
  width: 180px;
  outline: none;
}

.lnl-topbar__search-input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.lnl-topbar__search-btn {
  border: none;
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  padding: 0.3rem 0.45rem;
  cursor: pointer;
  display: flex;
  align-items: center;
}

.lnl-topbar__search-btn:hover {
  color: #fff;
}

.lnl-topbar__user {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  white-space: nowrap;
}

.lnl-topbar__greeting {
  color: #e0e6f0;
  font-weight: 600;
}

.lnl-topbar__link {
  color: #a8b8d0;
  text-decoration: none;
  padding: 0.25rem 0.5rem;
  border-radius: 3px;
  transition: background 0.15s, color 0.15s;
}

.lnl-topbar__link:hover,
.lnl-topbar__link:focus {
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
  text-decoration: none;
}

.lnl-topbar__link--login {
  background: var(--lnl-accent);
  color: #fff;
  font-weight: 600;
}

.lnl-topbar__link--login:hover,
.lnl-topbar__link--login:focus {
  background: var(--lnl-accent-deep);
  color: #fff;
}

.lnl-topbar__link--edit {
  background: #28a745;
  color: #fff;
  font-weight: 600;
}

.lnl-topbar__link--edit:hover,
.lnl-topbar__link--edit:focus {
  background: #218838;
  color: #fff;
}

@media (max-width: 560px) {
  .lnl-topbar__inner {
    flex-wrap: wrap;
    padding: 0.35rem 0.65rem;
    gap: 0.5rem;
  }

  .lnl-topbar__search-input {
    width: 120px;
  }
}

/* ── User profile page ── */
.profile {
  max-width: 640px;
}

.profile .field {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid #e8e8e8;
}

.profile .field:last-child {
  border-bottom: none;
}

.profile .field__label {
  font-weight: 600;
  min-width: 120px;
  color: #555;
  flex-shrink: 0;
}

.profile .field__item {
  color: #222;
}

/* ── Status badge (shared between profile and board) ── */
.lnl-status-badge {
  display: inline-block;
  padding: 0.2em 0.7em;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
}

.lnl-status--available {
  background: #d4edda;
  color: #155724;
}

.lnl-status--wfh {
  background: #d1ecf1;
  color: #0c5460;
}

.lnl-status--away {
  background: #f8d7da;
  color: #721c24;
}

/* ── Staff board ── */
.lnl-staff-board__toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.75rem;
}

.lnl-staff-board__calendar-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.35rem 0.85rem;
  background: #1c2432;
  color: #fff;
  border-radius: 4px;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
}

.lnl-staff-board__calendar-link:hover {
  background: #2a3a52;
  text-decoration: none;
}

.lnl-staff-board__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}

.lnl-staff-board__table th {
  text-align: left;
  padding: 0.6rem 0.75rem;
  background: #f4f6f9;
  border-bottom: 2px solid #d0d5dd;
  font-weight: 600;
  color: #333;
}

.lnl-staff-board__table td {
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid #eaeaea;
  vertical-align: middle;
}

.lnl-staff-board__table tbody tr:hover {
  background: #f9fafb;
}

.lnl-staff-board__table a {
  color: #1a4d8f;
  text-decoration: none;
}

.lnl-staff-board__table a:hover {
  text-decoration: underline;
}

.lnl-staff-board__note {
  font-size: 0.85rem;
  color: #555;
  font-style: italic;
  max-width: 220px;
}

@media (max-width: 640px) {
  .lnl-staff-board__table th:nth-child(n+5),
  .lnl-staff-board__table td:nth-child(n+5) {
    display: none;
  }
}

/* ── Staff directory (LNL Staff page) ── */
.lnl-staff-directory {
  text-align: left;
}
.lnl-staff-directory__toolbar {
  display: flex;
  justify-content: flex-start;
  gap: 0.6rem;
  margin: 0 0 0.8rem;
}
.lnl-staff-directory__edit-link {
  display: inline-flex;
  align-items: center;
  padding: 0.35rem 0.85rem;
  background: #1c2432;
  color: #fff;
  border-radius: 4px;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
}
.lnl-staff-directory__edit-link:hover {
  background: #2a3a52;
  text-decoration: none;
}
.lnl-staff-directory__admin-link,
.lnl-staff-board__admin-link {
  font-size: 0.82rem;
  color: #666;
  text-decoration: none;
}
.lnl-staff-directory__admin-link:hover,
.lnl-staff-board__admin-link:hover {
  color: #333;
  text-decoration: underline;
}
.lnl-staff-board__admin-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.5rem;
}
.lnl-staff-directory__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}
.lnl-staff-directory__table th {
  background: #f4f6f9;
  text-align: left;
  padding: 0.6rem 0.75rem;
  border-bottom: 2px solid #d0d5dd;
  font-weight: 600;
}
.lnl-staff-directory__table td {
  text-align: left;
  padding: 0.6rem 0.75rem;
  border-bottom: 1px solid #eaeaea;
  vertical-align: middle;
}
.lnl-staff-directory__table tbody tr:hover {
  background: #f9fafb;
}
.lnl-staff-directory__table a {
  color: #1a4d8f;
  text-decoration: none;
}
.lnl-staff-directory__table a:hover {
  text-decoration: underline;
}
.lnl-staff-directory__photo-cell {
  width: 50px;
  padding: 0.35rem 0.5rem;
}
.lnl-staff-directory__photo {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}
.lnl-staff-directory__section {
  border: 1px solid var(--lnl-line);
  background: var(--lnl-paper);
  box-shadow: var(--lnl-shadow);
  margin-bottom: 1.5rem;
}
.lnl-staff-directory__section-title {
  margin: 0;
  padding: 0.58rem 0.85rem;
  background: var(--lnl-panel-head);
  border-bottom: 1px solid var(--lnl-line);
  font-family: "Source Sans 3", "Segoe UI", sans-serif;
  font-size: 1.03rem;
  font-weight: 600;
  color: #1f2a3d;
}
@media (max-width: 640px) {
  .lnl-staff-directory__table th:nth-child(n+4),
  .lnl-staff-directory__table td:nth-child(n+4) {
    display: none;
  }
  .lnl-staff-directory__photo-cell {
    width: 36px;
  }
  .lnl-staff-directory__photo {
    width: 32px;
    height: 32px;
  }
}

/* ── Staff profile card (team profile page) ── */
.lnl-profile-card {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
  margin-bottom: 1.5rem;
}

.lnl-profile-card__photo {
  flex-shrink: 0;
  width: 150px;
}

.lnl-profile-card__photo img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  object-fit: cover;
}

.lnl-profile-card__name {
  margin: 0 0 0.25rem;
  font-size: 1.6rem;
  line-height: 1.2;
}

.lnl-profile-card__role {
  margin: 0 0 0.15rem;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--lnl-accent);
}

.lnl-profile-card__dept {
  margin: 0 0 0.5rem;
  color: #555;
}

.lnl-profile-edit-link {
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 0.85rem;
  color: var(--lnl-accent, #0c1628);
  text-decoration: underline;
}

.lnl-profile-fields {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.35rem 1rem;
  max-width: 600px;
  margin-bottom: 1.5rem;
}

.lnl-profile-fields dt {
  font-weight: 600;
  color: #555;
  padding: 0.3rem 0;
}

.lnl-profile-fields dd {
  margin: 0;
  padding: 0.3rem 0;
}

.lnl-profile-fields a {
  color: var(--lnl-accent);
  text-decoration: none;
}

.lnl-profile-fields a:hover {
  text-decoration: underline;
}

.lnl-profile-info {
  padding: 1rem;
  background: #f6f8fb;
  border-left: 4px solid var(--lnl-accent);
  border-radius: 4px;
}

@media (max-width: 560px) {
  .lnl-profile-card {
    flex-direction: column;
    gap: 1rem;
  }

  .lnl-profile-card__photo {
    width: 120px;
  }

  .lnl-profile-fields {
    grid-template-columns: 1fr;
  }
}

/* =====================================================
   Callout blocks (Warning / Info / Panel)
   ===================================================== */
.lnl-callout {
  margin: 1.25rem 0;
  padding: 1rem 1rem 1rem 3rem;
  border-radius: 4px;
  position: relative;
  line-height: 1.55;
}

.lnl-callout::before {
  position: absolute;
  left: 0.85rem;
  top: 1rem;
  font-size: 1.15rem;
  line-height: 1;
}

.lnl-callout p:first-child { margin-top: 0; }
.lnl-callout p:last-child  { margin-bottom: 0; }

/* — Warning (red) — */
.lnl-callout--warning {
  background: #fdf0f0;
  border-left: 4px solid #d04040;
  color: #5a1a1a;
}

.lnl-callout--warning::before {
  content: "\26A0\FE0F";
}

/* — Info (blue) — */
.lnl-callout--info {
  background: #eef4fb;
  border-left: 4px solid #3574b8;
  color: #1a3050;
}

.lnl-callout--info::before {
  content: "\2139\FE0F";
}

/* — Panel (header bar + body) — */
.lnl-callout--panel {
  padding: 0;
  border: 1px solid #c8d3db;
  background: #fff;
  overflow: hidden;
}

.lnl-callout--panel::before {
  display: none;
}

.lnl-callout--panel .lnl-callout__header {
  margin: 0;
  padding: 0.6rem 1rem;
  background: #dfe6ed;
  font-weight: 600;
  font-size: 0.95rem;
  color: #2c3e50;
  border-bottom: 1px solid #c8d3db;
}

.lnl-callout--panel > p:not(.lnl-callout__header) {
  padding: 0.75rem 1rem;
  margin: 0;
}

/* CKEditor 5 in-editor preview (same look) */
.ck-editor .lnl-callout,
.ck-content .lnl-callout {
  margin: 0.75rem 0;
}

.ck-content .lnl-callout--warning {
  background: #fdf0f0;
  border-left: 4px solid #d04040;
  color: #5a1a1a;
}

.ck-content .lnl-callout--info {
  background: #eef4fb;
  border-left: 4px solid #3574b8;
  color: #1a3050;
}

.ck-content .lnl-callout--panel {
  border: 1px solid #c8d3db;
  background: #fff;
}

.ck-content .lnl-callout--panel .lnl-callout__header {
  background: #dfe6ed;
  font-weight: 600;
  border-bottom: 1px solid #c8d3db;
}

/* =====================================================
   Embedded file media — render as plain links
   ===================================================== */
.lnl-content span.file {
  display: inline;
  padding: 0;
  background: none;
}

.lnl-content span.file::before {
  display: none !important;
}

.lnl-content span.file a {
  color: var(--lnl-accent, #2a6496);
  text-decoration: none;
}

.lnl-content span.file a:hover {
  text-decoration: underline;
}

/* Hide the file-size span that follows the file link */
.lnl-content span.file + span {
  display: none;
}

/* =====================================================
   Function role tokens
   ===================================================== */
.lnl-function-ref {
  background: #eef0fb;
  border-radius: 3px;
  padding: 0 4px;
  font-weight: 600;
  white-space: nowrap;
}

.lnl-function-ref a {
  color: var(--lnl-accent, #2a6496);
  text-decoration: none;
}

.lnl-function-ref a:hover {
  text-decoration: underline;
}

/* Responsible staff in Tool Overview */
.lnl-tech-info-staff {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid #e0e0e0;
}

.lnl-tech-info-staff .item-list ul {
  margin: 0;
  padding-left: 0;
  list-style: none;
}

.lnl-tech-info-staff .item-list li {
  display: inline;
}

.lnl-tech-info-staff .item-list li + li::before {
  content: ', ';
}

/* =====================================================
   RSS News panel (home page)
   ===================================================== */
.lnl-rss-news {
  border: 1px solid var(--lnl-line, #bfb8af);
  background: #fff;
  box-shadow: var(--lnl-box-shadow, 0 1px 3px rgba(0,0,0,.08));
}

.lnl-rss-news__header {
  padding: 8px 12px;
  background: var(--lnl-panel-head, #dce9ee);
  border-bottom: 2px solid var(--lnl-line, #bfb8af);
  font-style: oblique;
  font-size: 0.98rem;
  color: #000;
}

.lnl-rss-news__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.lnl-rss-news__item {
  padding: 8px 12px;
  border-bottom: 1px solid #eee;
  font-size: 0.92rem;
  line-height: 1.4;
}

.lnl-rss-news__item:last-child {
  border-bottom: none;
}

.lnl-rss-news__date {
  color: #888;
  margin-right: 0.4em;
  font-size: 0.85rem;
  white-space: nowrap;
}

.lnl-rss-news__link {
  color: var(--lnl-accent, #2a6496);
  text-decoration: none;
}

.lnl-rss-news__link:hover {
  text-decoration: underline;
}

.lnl-rss-news__more {
  padding: 8px 12px;
  text-align: right;
  font-size: 0.85rem;
}

.lnl-rss-news__more a {
  color: var(--lnl-accent, #2a6496);
  text-decoration: none;
}

.lnl-rss-news__more a:hover {
  text-decoration: underline;
}

/* =====================================================
   PDF attachment card (inline preview — doc-grid style)
   ===================================================== */
.lnl-pdf-card {
  display: inline-block;
  width: 210px;
  margin: 0.8em 0;
  position: relative;
  vertical-align: top;
}

.lnl-pdf-card p {
  display: block;
  margin: 0;
  border-radius: 3px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
  transition: box-shadow 0.18s ease, transform 0.18s ease;
  position: relative;
}

.lnl-pdf-card:hover p {
  box-shadow: 0 5px 18px rgba(0,0,0,.26);
  transform: translateY(-2px);
}

/* Thumbnail fills the card preview area */
.lnl-pdf-card__thumb,
.lnl-pdf-card p img {
  display: block;
  width: 100%;
  height: 290px;
  object-fit: cover;
  object-position: top;
  background: #f0f0f0;
}

/* Make the link fill the card */
.lnl-pdf-card p a {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* PDF badge via pseudo-element — lower-left corner */
.lnl-pdf-card p::after {
  content: 'PDF';
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 9px;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: #fff;
  background: #c0392b;
  border-top-right-radius: 3px;
  pointer-events: none;
}

/* ---- Rotation variants ---- */
.lnl-pdf-card--r90 p img {
  transform: rotate(90deg) scale(0.724);
}
.lnl-pdf-card--r180 p img {
  transform: rotate(180deg);
}
.lnl-pdf-card--r270 p img {
  transform: rotate(270deg) scale(0.724);
}

/* PPTX badge variant — orange */
.lnl-pdf-card--pptx p::after {
  content: 'PPTX';
  background: #d35400;
}

@media (max-width: 480px) {
  .lnl-pdf-card {
    width: 160px;
  }
  .lnl-pdf-card__thumb,
  .lnl-pdf-card p img {
    height: 210px;
  }
}
