:root {
    --color-border: #35463a;
    --color-link: #63e98f;
    --color-bg: #121c15;
    --color-accent: #3cdd71;
    --color-heading: #ffffff;
    --color-text: #dde4df;
    --color-surface: #1b281f;
    --color-accent-text: #121c15;
    --color-muted: #94a89b;
}

.banner {
    margin-bottom: 2em;
    box-sizing: border-box;
    overflow-wrap: break-word;
}

.banner .heading {
    line-height: 1.15;
    margin: 0 0 0.5em;
    font-size: 2em;
}

.banner .text {
    max-width: 60ch;
    margin: 0 0 1em;
    font-size: 1.08em;
}

.banner img {
    max-width: 100%;
}

.banner-ck > .container {
    padding-bottom: 2.5em;
    padding-top: 2em;
    position: relative;
}

.banner-ck .media {
    background: linear-gradient(160deg, var(--color-accent), var(--color-surface));
    transform: rotate(-1.5deg);
    min-height: 8em;
    border-radius: 1.5em;
    overflow: hidden;
}

.banner-ck .media img {
    width: 100%;
    display: block;
    object-fit: cover;
    max-height: 20em;
}

.banner-ck .stage {
    margin-top: -2em;
    background: var(--color-bg);
    transform: rotate(0.6deg);
    margin-left: 0.5em;
    border-radius: 1.5em;
    margin-right: 0.5em;
    padding: 1.25em;
    box-shadow: 0 8px 30px rgba(0,0,0,.15);
    position: relative;
}

.title-b h1 {
    margin: 0 0 1.25em;
    color: var(--color-heading);
    font-size: 1.5em;
}

.container {
    max-width: 78em;
    box-sizing: border-box;
    margin: 0 auto;
    padding-right: 1em;
    padding-left: 1em;
}

.row {
    padding-bottom: 2.5em;
    padding-top: 1.5em;
}

.main {
    min-width: 0;
}

.a, .rail {
    margin-top: 2em;
    min-width: 0;
}

ul.entries, ol.entries {
    margin: 0;
    padding: 0;
    list-style: none;
}

.headline {
    line-height: 1.25;
    font-family: "Outfit", system-ui, sans-serif;
    margin: 0 0 0.4em;
    font-size: 1.55em;
}

.headline a {
    text-decoration: none;
    color: var(--color-heading);
}

.headline a:hover {
    text-decoration: underline;
    color: var(--color-link);
}

.meta {
    margin: 0 0 0.9em;
    color: var(--color-muted);
    font-size: 0.85em;
}

.meta a {
    color: var(--color-muted);
}

.body img {
    max-width: 100%;
    height: auto;
}

.body h2:not(.headline), .excerpt h2 {
    margin: 1.25em 0 0.5em;
    font-size: 1.15em;
}

.body h3, .excerpt h3 {
    font-size: 1.02em;
}

.media-aux {
    margin: 0 0 1em;
}

.media-aux img {
    width: 100%;
    border-radius: 0.5em;
    display: block;
    height: auto;
}

.featured .headline {
    line-height: 1.15;
    font-size: 2.1em;
}

.featured {
    padding-bottom: 1.5em;
    margin-bottom: 2em;
    border-bottom: 3px solid var(--color-heading);
}

.minor {
    margin-bottom: 2em;
    grid-template-columns: minmax(0,1fr);
    display: grid;
    gap: 2em;
}

.entries {
    margin: 0;
    padding: 0;
    list-style: none;
}

.entries .entry {
    padding-bottom: 2em;
    grid-template-columns: minmax(0,1fr);
    display: grid;
    gap: 0.5em;
}

.marker {
    font-weight: 700;
    color: var(--color-accent);
    font-size: 0.85em;
}

.panel {
    margin-bottom: 1.75em;
    font-size: 0.92em;
}

.title {
    padding-bottom: 0.35em;
    font-family: "Outfit", system-ui, sans-serif;
    margin: 0 0 0.6em;
    color: var(--color-heading);
    font-size: 1em;
    border-bottom: 2px solid var(--color-accent);
    text-transform: none;
}

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

.list li, .list > div {
    padding: 0.3em 0;
    border-bottom: 1px solid var(--color-border);
}

.panel a {
    text-decoration: none;
    color: var(--color-link);
}

.panel a:hover {
    text-decoration: underline;
}

.heading-alt {
    line-height: 1.2;
    font-family: "Outfit", system-ui, sans-serif;
    margin: 0 0 0.5em;
    color: var(--color-heading);
    font-size: 2.1em;
}

.meta-alt {
    margin: 0 0 1.5em;
    color: var(--color-muted);
    font-size: 0.88em;
}

.meta-alt a {
    color: var(--color-muted);
}

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

.footer {
    margin-top: 2.5em;
    border-top: 1px solid var(--color-border);
    padding-top: 1.5em;
}

.page {
    background: var(--color-surface);
    margin-bottom: 1.5em;
    border-radius: 0.5em;
    padding: 1em 1.25em;
}

.page p {
    margin: 0 0 0.4em;
}

.box {
    margin-bottom: 1.5em;
    border-radius: 0.5em;
    padding: 1.25em;
    border: 1px solid var(--color-border);
}

.box p {
    margin: 0 0 0.4em;
}

.reading h2 {
    font-size: 1.15em;
}

.nav-aux {
    margin-top: 1.5em;
    justify-content: space-between;
    display: flex;
    gap: 1em;
    flex-wrap: wrap;
}

.breadcrumbs {
    margin: 0 0 1em;
    color: var(--color-muted);
    font-size: 0.82em;
}

.breadcrumbs a {
    color: var(--color-muted);
}

.footer-x-ar {
    margin-top: 2.5em;
    background: var(--color-surface);
    padding: 2em 0;
}

.footer-x-ar .list-sub {
    display: flex;
    gap: 0.5em;
    flex-wrap: wrap;
}

.footer-x-ar .list-sub span {
    background: var(--color-bg);
    border-radius: 999px;
    padding: 0.2em 0.6em;
    font-size: 0.85em;
    border: 1px solid var(--color-border);
}

.footer-x-ar ul, .footer-x-ar ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer-x-ar .list {
    display: flex;
    gap: 0.3em 1em;
    flex-wrap: wrap;
}

.footer-x-ar .credits {
    margin-top: 1.25em;
    color: var(--color-muted);
    font-size: 0.82em;
}

.footer-x-ar .credits a {
    margin-left: 0.6em;
    color: var(--color-muted);
}

.row-sub {
    margin: 1em 0 0;
    display: flex;
    padding: 0;
    gap: 0.75em;
    list-style: none;
    flex-wrap: wrap;
}

.link {
    background: var(--color-accent);
    border-radius: 1em;
    display: inline-block;
    font-weight: 700;
    padding: 0.6em 1.1em;
    text-decoration: none;
    color: var(--color-accent-text);
    border: 2px solid var(--color-accent);
}

.link-alt {
    background: var(--color-bg);
    color: var(--color-accent);
}

.row-alt {
    margin: 0.9em 0 0;
    display: flex;
    padding: 0;
    gap: 0.5em;
    list-style: none;
    flex-wrap: wrap;
    font-size: 0.85em;
}

.row-alt li, .row-alt span {
    background: var(--color-surface);
    border-radius: 2em;
    padding: 0.25em 0.65em;
    color: var(--color-text);
    border: 1px solid var(--color-border);
}

.overline {
    margin: 0 0 0.4em;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--color-muted);
    font-size: 0.8em;
    text-transform: uppercase;
}

.title-x, h2.title-x {
    margin: 0 0 1.5em;
}

.title-x h2, h2.title-x {
    margin-bottom: 0.35em;
    font-size: 1.9em;
}

.title-x p {
    margin: 0;
    color: var(--color-muted);
}

.intro {
    max-width: 70ch;
    margin: 0 0 1.5em;
}

.touch {
    max-width: 100%;
    box-sizing: border-box;
    margin: 1em 0;
}

.touch .inquiry {
    grid-template-columns: minmax(0,1fr);
    display: grid;
    gap: 0.6em;
}

.touch .control {
    min-width: 0;
    display: grid;
    gap: 0.2em;
}

.touch label {
    font-weight: 600;
    font-size: 0.85em;
}

.touch input[type=text], .touch input[type=tel], .touch textarea {
    background: var(--color-bg);
    width: 100%;
    box-sizing: border-box;
    border-radius: 0.5em;
    padding: 0.5em 0.6em;
    color: var(--color-text);
    font: inherit;
    border: 1px solid var(--color-border);
}

.touch button {
    cursor: pointer;
    background: var(--color-accent);
    border-radius: 0.5em;
    font-weight: 700;
    padding: 0.65em 1.1em;
    color: var(--color-accent-text);
    font: inherit;
    border: 0;
}

.touch .line {
    margin: 0.6em 0 0;
    font-size: 0.9em;
}

.touch .deck {
    margin: 0 0 0.6em;
}

.touch-boxed {
    background: var(--color-bg);
    border-radius: 1em;
    padding: 1.25em;
    box-shadow: 0 10px 30px rgba(0,0,0,.14);
    color: var(--color-text);
    border: 1px solid var(--color-border);
}

.touch-inline {
    background: var(--color-surface);
    border-radius: 1em;
    padding: 0.9em;
    color: var(--color-text);
}

.touch-tabbed {
    border-top: 4px solid var(--color-accent);
    background: var(--color-bg);
    padding: 1em;
    box-shadow: 0 6px 20px rgba(0,0,0,.1);
    color: var(--color-text);
}

.touch .row-sub2 {
    display: flex;
    gap: 0;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--color-border);
}

.touch .row-sub2 input {
    width: 1px;
    position: absolute;
    opacity: 0;
    height: 1px;
}

.touch .row-sub2 label {
    cursor: pointer;
    padding: 0.45em 0.9em;
    color: var(--color-muted);
    border-bottom: 3px solid transparent;
}

.touch .row-sub2 input:checked + label {
    color: var(--color-heading);
    border-bottom-color: var(--color-accent);
}

.touch-call {
    background: var(--color-surface);
    border-radius: 1em;
    text-align: center;
    padding: 1em;
    color: var(--color-text);
}

.touch .button-b {
    background: var(--color-accent);
    border-radius: 999px;
    display: inline-block;
    font-weight: 700;
    padding: 0.9em 1.6em;
    text-decoration: none;
    color: var(--color-accent-text);
    font-size: 1.25em;
}

.touch-two {
    background: var(--color-bg);
    border-radius: 1em;
    padding: 1.1em;
    color: var(--color-text);
    border: 2px dashed var(--color-border);
}

.touch fieldset {
    min-width: 0;
    margin: 0;
    display: grid;
    padding: 0;
    gap: 0.5em;
    border: 0;
}

.touch legend {
    letter-spacing: 0.08em;
    color: var(--color-muted);
    font-size: 0.75em;
}

.touch details > summary {
    cursor: pointer;
    background: var(--color-heading);
    margin: 0.3em 0;
    border-radius: 0.5em;
    display: inline-block;
    padding: 0.5em 1em;
    list-style: none;
    color: var(--color-bg);
}

.touch-compact {
    background: var(--color-surface);
    border-radius: 1em;
    padding: 1em;
    color: var(--color-text);
    border: 1px solid var(--color-border);
}

.card {
    background: var(--color-surface);
    margin: 2em 0;
    border-radius: 1em;
    display: flex;
    align-items: flex-start;
    padding: 1.25em;
    gap: 1em;
}

.card .cal {
    justify-content: center;
    background: var(--color-accent);
    width: 3em;
    border-radius: 50%;
    display: flex;
    align-items: center;
    font-weight: 700;
    color: var(--color-accent-text);
    flex: none;
    font-size: 1.3em;
    height: 3em;
}

.card p {
    margin: 0 0 0.35em;
}

.seasonal {
    background: var(--color-surface);
    margin: 0 0 2em;
    border-radius: 1em;
    padding: 1em 1.15em;
    border: 1px solid var(--color-border);
    overflow-wrap: anywhere;
}

.seasonal p {
    margin: 0 0 0.5em;
}

.seasonal ul, .seasonal ol {
    margin: 0;
    padding-left: 1.25em;
}

.seasonal li {
    margin: 0 0 0.35em;
}

.seasonal li span {
    color: var(--color-muted);
    font-size: 0.85em;
}

.block .meta-alt {
    margin: 0 0 1.25em;
}

.details {
    background: var(--color-surface);
    margin-bottom: 1.5em;
    border-radius: 1em;
    padding: 1em;
    font-size: 0.9em;
}

.details dl {
    grid-template-columns: auto minmax(0,1fr);
    margin: 0;
    display: grid;
    gap: 0.3em 1em;
}

.details dd {
    margin: 0;
}

.details dt {
    color: var(--color-muted);
}

.entry-alt-sm .grid-aux {
    grid-template-columns: minmax(0,1fr);
    display: grid;
    gap: 1.25em;
}

.brand::before {
    content: "P";
    background: var(--color-heading);
    line-height: 1.6;
    min-width: 1.6em;
    border-radius: 50%;
    margin-right: 0.45em;
    display: inline-block;
    text-align: center;
    color: var(--color-bg);
    font-size: 0.8em;
}

.body a, .content a {
    text-decoration: none;
    border-bottom: 1px solid var(--color-accent);
}

.media-aux img, .content img, .body img {
    border-radius: 0.5em;
}

.body p, .content p {
    margin: 0 0 0.6em;
}

body {
    line-height: 1.45;
}

.breadcrumbs {
    border-radius: 0.5em;
    padding: 0.35em 0.7em;
    border: 1px solid var(--color-border);
}

.page li {
    list-style: decimal inside;
}

.body blockquote, .content blockquote {
    font-family: "Outfit", system-ui, sans-serif;
    border-left: 0;
    text-align: center;
    font-size: 1.2em;
}

.body ul, .content ul {
    list-style-type: square;
}

.nav-aux-top {
    margin: 0.5em 0;
    text-align: right;
}

.entry-alt-pg-card {
    background: var(--color-surface);
    border-radius: 1.5em;
    padding: 1.5em;
    border: 1px solid var(--color-border);
}

.nav-aux-more a {
    background: var(--color-surface);
    width: 100%;
    border-radius: 1em;
    display: block;
    text-align: center;
    font-weight: 700;
    padding: 0.8em;
}

@media (min-width: 600px) {
    .banner .heading {
        font-size: 2.6em;
    }
    .row {
        display: flex;
        align-items: flex-start;
        gap: 2.25em;
    }
    .main {
        order: 2;
        flex: 1 1 0;
    }
    .a {
        margin-top: 0;
        order: 1;
        flex: 0 0 11em;
    }
    .rail {
        margin-top: 0;
        order: 3;
        flex: 0 0 11em;
    }
    .entries .entry {
        grid-template-columns: 8em minmax(0,1fr);
        padding-left: 1em;
        border-left: 2px solid var(--color-border);
        gap: 1.5em;
    }
    .touch-inline .inquiry {
        grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto;
        align-items: end;
    }
    .entry-alt-sm .grid-aux {
        grid-template-columns: 11em minmax(0,1fr);
        align-items: start;
    }
}

@media (min-width: 900px) {
    .minor {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}