:root {
    --font-heading:"Fraunces", ui-serif, Georgia, serif;
    --font-body: "Inter", ui-sans-serif, system-ui, sans-serif;
    --font-display:"Fraunces", ui-serif, Georgia, serif;
    --font-mono: "JetBrains Mono", ui-monospace, monospace;
    --spacing:30px;
}
body {
    font-family:var(--font-body);
    margin:0;
    background-color:var(--bg-col);
}
a {
    text-decoration: none;
}
main a {
    color:#fff;
    border-bottom: 1px dashed #888;
    transition:0.2s;
}
main a:hover {
    border-bottom: 1px solid #fff;
}
button {
    background-color:var(--bg-darker-col);
    color:#fff;
    border:2px solid var(--bg-very-dark-col);
    cursor:pointer;
    font-size:18px;
    font-family: var(--font-mono);
    padding:6px 15px;
    transition:0.2s;
}
button:hover {
    background-color:#000;
}

header.site-header {
    background-size:cover;
    background-repeat: no-repeat;
    background-position: 100% 0%;
    min-height: 80px;
}

header.site-header .site-c {
    display:inline-block;
    position:absolute;
    left:4%;
    top:1%;
}
header.site-header .site-name {
    font-size:2rem;
    font-family:var(--font-heading);
    color:#000000;
    letter-spacing: -0.1rem;
    display:inline-block;
    margin-bottom:-1.5rem;
}
main h1 {
    font-size:3.5rem;
    font-family:var(--font-heading);
    margin:0;
    color:#fff;
}

main section>div {
    max-width:952px;
    margin:0 auto;
    color:#fff;
    padding-bottom:var(--spacing);
}

main section:not(.cols)>div {
    padding-bottom:var(--spacing);
}

main section.cols>div>* {
    display:block;
    padding-bottom:var(--spacing);
}
main section.cols>div>*>p:last-child {
    margin-bottom:0;
}

main section.cols>div {
    display:grid;
    gap:var(--spacing);
    min-height:200px;
    padding-top:var(--spacing);
}

main section.fixed-top {
    position:sticky;
    top:0;
    z-index:100;
}

main section ul {
    margin-block-start:0;
    margin-block-end:0;
    padding-inline-start:30px;
}

.horizontal {
    display:flex;
    gap:10px;
}

.padding-20 {
    padding:var(--spacing);
}

section.fixed-top {
    background-color:var(--bg-col);
}

main section.darker {
    background-color:var(--bg-darker-col);
}
main section.lighter {
    background-color:var(--bg-light-col);
}
main section.lighter>div * {
    color:var(--bg-darker-col);
}

main section.c2c1>div {
    grid-template-columns:2fr 1fr;
}

main section.c1c2>div {
    grid-template-columns:1fr 2fr;
}

main section.c1c1c1>div {
    grid-template-columns:1fr 1fr 1fr;
}

main section h2 {
    font-size:2rem;
    font-family:var(--font-heading);
    margin:0 0 var(--spacing) 0;
    color:#fff;
    margin-bottom:15px;
}

main section:not(.cols)>div {
    padding-top:var(--spacing);
}

main section .text {
    text-align:justify;
}

main section .text ul {
    text-align:left;
}

main .img-c {
    background-size:cover;
    background-repeat: no-repeat;
    background-position: center center;
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

main a.block {
    border-bottom:none;
}

main a.block:hover {
    border-bottom:none;
}

.img-c.img-loaded {
    opacity: 1;
}

.img-c.hover-zoom {
    transition: transform 0.45s ease, opacity 0.3s ease;
}

.img-c.hover-zoom:hover {
    transform: scale(1.08);
}

header.site-header .strap-line {
    font-size:1.1em;
    letter-spacing: -0.1rem;
    font-family:var(--font-heading);
    color:#fff;
    text-align:right;
}

body.tall-header header.site-header {
    min-height: 450px;
    background-position: 100% 20%;
}
body.tall-header header .site-name {
    font-size:6.5rem;
    letter-spacing: -0.3rem;
}
body.tall-header header .site-c {
    top:8%;
}
body.tall-header header .strap-line {
    font-size:3em;
    letter-spacing: -0.2rem;
}



header.site-header .hamburger-btn {
    display:none;
}

.nav {
    display:flex;
    font-family:var(--font-mono);
    font-feature-settings:"ss01", "ss02";
}

.nav ul {
    margin-left:auto;
    margin-right:1rem;
    display:flex;
    gap:var(--spacing);
    list-style-type:none;
}

.nav ul a {
    letter-spacing: -0.07rem;
    color:var(--bg-darker-col);
    padding:4px 10px;
    display:inline-block;
    transition:0.2s;
    border-radius:10px;
}

.av ul a:hover {
    background-color:var(--bg-light-col);
}

.footer-bottom {
    text-align:center;
    font-size:0.7rem;
}

#mobile-nav-overlay {
    position:fixed;
    left:0;
    right:0;
    top:0;
    bottom:0;
    background-color:var(--bg-light-col);
    opacity:0.4;
    display:none;
}

section .img-c {
    transition:0.2s;
    border-radius:20px;
}

section.cols .img-c {
    aspect-ratio: 600/355;
}

section .block {
    padding:var(--spacing) 0;
    transition: transform 0.45s ease, opacity 0.3s ease;
    opacity:0.8;
}

section .block:hover {
    opacity:1;
}

section .block:hover .img-c {
    transform: scale(1.08);
}

main select,main textarea,main input[type=text],main input[type=email],main input[type=password],main input[type=date] {
    background-color: var(--bg-light-col);
    color: var(--bg-darker-col);
    font-family: var(--font-body);
    font-size:18px;
    padding:3px 8px;
    border:1px solid var(--bg-col);
}

main .border {
    border:4px solid var(--bg-light-col);
    padding:var(--spacing);
}

table.display {
    width:100%;
    border-collapse: collapse;
    border:4px solid var(--bg-light-col);
}

table.display th {
    font-family: var(--font-heading);
}

table.display th,table.display td {
    padding:5px 10px;
}

table.display thead {
    background-color:var(--bg-light-col);
    color:var(--bg-darker-col);
}

table.display tbody tr {
    transition:0.2s;
}

table.display tbody tr:hover {
    background-color:var(--bg-very-dark-col);
}
