/* Home-page editorial panels. Images always use the full original files. */
.lisk-home-panels { margin-top: 56px; }
.lisk-home-panels .lh-panel {
    --lh-bg: #f3eee8;
    --lh-lines: #9c7961;
    position: relative;
    background: var(--lh-bg);
    box-shadow: 0 0 0 100vmax var(--lh-bg);
    clip-path: inset(0 -100vmax);
    color: #303030;
}
.lisk-home-panels .lh-panel--choose { --lh-bg: #e4eeed; --lh-lines: #427d7d; }
.lisk-home-panels .lh-panel--support { --lh-bg: #4c4c4c; --lh-lines: #7eb5b5; color: #ededed; }
.lisk-home-panels .lh-visual { position: relative; }
.lisk-home-panels .lh-visual::before {
    content: "";
    position: absolute;
    inset: -45px -64px;
    pointer-events: none;
    opacity: .34;
    background: var(--lh-lines);
    mask: url("drawing-discrete.svg?v=2") center / 100% 100% no-repeat;
}
.lisk-home-panels .lh-panel--choose .lh-visual::before { mask-image: url("drawing-enclosure.svg?v=2"); }
.lisk-home-panels .lh-panel--support .lh-visual::before { mask-image: url("drawing-control.svg?v=2"); opacity: .38; }
.lisk-home-panels .lh-visual img { position: relative; }

.lisk-home-panels .lh-inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(32px, 5vw, 76px);
    align-items: center;
    min-height: 460px;
    padding: 60px 0;
    box-sizing: border-box;
}
.lisk-home-panels .lh-copy, .lisk-home-panels .lh-visual { min-width: 0; }
.lisk-home-panels .lh-eyebrow {
    margin: 0 0 14px;
    font: 500 14px/1.4 "Roboto Condensed", sans-serif;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #7e4129;
}
.lisk-home-panels .lh-panel--choose .lh-eyebrow { color: #115960; }
.lisk-home-panels .lh-panel--support .lh-eyebrow { color: #b6d8d8; }
.lisk-home-panels h2 {
    font: 500 clamp(32px, 3.5vw, 46px)/1.12 "Roboto Condensed", sans-serif;
    color: inherit;
    letter-spacing: normal;
    text-transform: none;
    margin: 0 0 22px;
}
.lisk-home-panels .lh-copy > p:not(.lh-eyebrow) {
    color: inherit;
    font-size: 19px;
    line-height: 1.65;
    margin: 0 0 26px;
}
.lisk-home-panels .lh-actions { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; }
.lisk-home-panels a.lh-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    box-sizing: border-box;
    padding: 12px 24px;
    border: 1px solid transparent;
    border-radius: 28px;
    background: #303030;
    color: #f5f5f5;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.3;
    text-decoration: none;
    transition: background-color .2s, color .2s;
}
.lisk-home-panels a.lh-button:hover { background: #7e4129; color: #fff; }
.lisk-home-panels .lh-panel--support a.lh-button { background: #ededed; color: #202b30; }
.lisk-home-panels .lh-panel--support a.lh-button:hover { background: #7e4129; color: #fff; }
.lisk-home-panels a.lh-text-link { color: #ededed; font-size: 17px; font-weight: 500; padding: 12px 0; }
.lisk-home-panels a.lh-text-link:hover { color: #ef9b48; }
.lisk-home-panels a:focus-visible { outline: 3px solid #e07000; outline-offset: 4px; }
.lisk-home-panels .lh-visual img { display: block; max-width: 100%; height: auto; margin: 0; }
.lisk-home-panels .lh-art img { width: 100%; border-radius: 8px; }
.lisk-home-panels .lh-panel--choose .lh-visual { grid-column: 1; grid-row: 1; }
.lisk-home-panels .lh-panel--choose .lh-copy { grid-column: 2; grid-row: 1; }
body.lisk-headings-home .content:has(.lisk-home-panels) > .content_inner > .container > .container_inner { padding-bottom: 0; }
@media (min-width: 768px) {
    .lisk-home-panels .lh-visual { transform: scale(.85); }
}
@media (max-width: 767px) {
    .lisk-home-panels { margin-top: 36px; }
    .lisk-home-panels .lh-inner { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: 30px; padding: 38px 0; }
    .lisk-home-panels .lh-panel--choose .lh-copy,
    .lisk-home-panels .lh-panel--choose .lh-visual { grid-column: auto; grid-row: auto; }
    .lisk-home-panels h2 { font-size: 34px; margin-bottom: 18px; }
    .lisk-home-panels .lh-copy > p:not(.lh-eyebrow) { font-size: 18px; line-height: 1.6; margin-bottom: 22px; }
    .lisk-home-panels .lh-visual::before { inset: -24px -20px; opacity: .24; }
}
@media (prefers-reduced-motion: reduce) {
    .lisk-home-panels a.lh-button { transition: none; }
}