:root {
    --modern-bg: #eef4ff;
    --modern-surface: rgba(255, 255, 255, 0.92);
    --modern-surface-strong: #ffffff;
    --modern-text: #142033;
    --modern-muted: #5f6f86;
    --modern-line: rgba(53, 94, 252, 0.12);
    --modern-brand: #2f6bff;
    --modern-brand-dark: #1747c9;
    --modern-accent: #00b8a9;
    --modern-shadow: 0 24px 60px rgba(23, 37, 84, 0.12);
    --modern-radius: 24px;
    --modern-radius-sm: 16px;
    --modern-container: 1560px;
}

html {
    scroll-behavior: smooth;
}

body {
    background:
        radial-gradient(circle at top left, rgba(47, 107, 255, 0.18), transparent 28%),
        radial-gradient(circle at top right, rgba(0, 184, 169, 0.14), transparent 32%),
        linear-gradient(180deg, #0b1220 0%, #111a2d 44%, #0a1020 100%);
    color: var(--modern-text);
    font-family: "Manrope", "Segoe UI", sans-serif;
}

body,
.site-main,
.widget-area,
.widget,
.entry-content,
.entry-summary {
    color: var(--modern-text);
}

body:before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.45) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.45) 1px, transparent 1px);
    background-size: 32px 32px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.2), transparent 80%);
    opacity: 0.18;
}

body,
button,
input,
select,
textarea {
    color: var(--modern-text);
}

h1,
h2,
h3,
h4,
h5,
h6,
.site-title,
.entry-title,
.page-title,
.widget-title {
    font-family: "Cormorant Garamond", Georgia, serif;
    letter-spacing: -0.03em;
    color: #182230;
}

a,
a:visited {
    color: var(--modern-brand);
    transition: color 180ms ease, opacity 180ms ease, transform 180ms ease;
}

a:hover,
a:focus {
    color: var(--modern-brand-dark);
}

#page.site {
    max-width: min(100%, calc(var(--modern-container) + 28px));
    margin: 0 auto;
    padding: 14px 14px 56px;
}

.site-header {
    background: transparent;
    margin-bottom: 24px;
}

.site-header .row,
.site-content.row,
.site-footer .row {
    max-width: var(--modern-container);
    width: 100%;
}

.site-header-shell {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(239, 246, 255, 0.92));
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 28px;
    box-shadow: var(--modern-shadow);
    backdrop-filter: blur(14px);
}

.site-header-shell:before,
.site-header-shell:after {
    content: "";
    position: absolute;
    border-radius: 999px;
    filter: blur(4px);
}

.site-header-shell:before {
    width: 240px;
    height: 240px;
    top: -110px;
    right: -70px;
    background: radial-gradient(circle, rgba(47, 107, 255, 0.22), transparent 68%);
}

.site-header-shell:after {
    width: 220px;
    height: 220px;
    left: -60px;
    bottom: -130px;
    background: radial-gradient(circle, rgba(0, 184, 169, 0.18), transparent 68%);
}

.top-bar {
    background: transparent;
    min-height: auto;
    line-height: 1.2;
    padding: 24px 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.top-bar ul {
    background: transparent;
    min-height: auto;
    line-height: 1.2;
}

.top-bar-title {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 0;
    position: relative;
    z-index: 1;
}

.custom-logo-link img {
    max-height: 56px;
    width: auto;
}

.site-branding {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.site-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--modern-accent);
}

.site-kicker:before {
    content: "";
    width: 34px;
    height: 1px;
    background: currentColor;
}

.top-bar-title .site-title,
.top-bar-title p.site-title {
    margin: 0;
    line-height: 0.95;
}

.top-bar-title .site-title a {
    top: 0;
    color: #101828;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(2rem, 3.2vw, 3.25rem);
    font-weight: 700;
}

.site-tagline {
    max-width: 46ch;
    margin: 0;
    color: #52637d;
    font-size: 0.98rem;
    line-height: 1.6;
}

.top-bar-right {
    position: relative;
    z-index: 1;
}

.top-bar-menu .menu {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
}

.site-header .main-navigation ul li,
.site-header .main-navigation ul li a {
    background: transparent;
}

.site-header .main-navigation ul li a,
.site-header .main-navigation ul li a:active,
.site-header .main-navigation ul li a:focus,
.site-header .main-navigation ul li a:hover,
.site-header .main-navigation ul li a:visited {
    color: #20314d;
    font-family: "Manrope", "Segoe UI", sans-serif;
    font-size: 0.92rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    padding: 12px 16px;
    border-radius: 999px;
}

.site-header .main-navigation ul li a:hover,
.site-header .main-navigation ul li.current-menu-item > a,
.site-header .main-navigation ul li.current_page_item > a {
    color: #fff;
    background: linear-gradient(135deg, var(--modern-brand), var(--modern-brand-dark));
    box-shadow: 0 14px 24px rgba(23, 71, 201, 0.22);
}

button.menu-toggle.navicon {
    border: 1px solid rgba(16, 24, 40, 0.08);
    background: rgba(255, 255, 255, 0.9);
    border-radius: 999px;
    padding: 12px 18px;
    box-shadow: 0 10px 22px rgba(16, 24, 40, 0.08);
}

.site-hero {
    position: relative;
    z-index: 1;
    padding: 18px 38px 38px;
}

.site-hero-inner {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(260px, 0.9fr);
    gap: 24px;
    align-items: end;
}

.site-hero-copy h2 {
    margin: 0 0 12px;
    font-size: clamp(2.5rem, 6vw, 5rem);
    line-height: 0.92;
}

.site-hero-copy p {
    margin: 0;
    max-width: 56ch;
    font-size: 1.05rem;
    line-height: 1.75;
    color: #475467;
}

.site-hero-meta {
    display: grid;
    gap: 14px;
    justify-items: start;
}

.site-hero-meta-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #344054;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.site-hero-meta-label:before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--modern-brand), var(--modern-accent));
    box-shadow: 0 0 0 8px rgba(47, 107, 255, 0.12);
}

.site-hero-button,
.button,
button,
input[type=button],
input[type=reset],
input[type=submit] {
    border: none;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--modern-brand), var(--modern-brand-dark));
    color: #fff;
    font-family: "Manrope", "Segoe UI", sans-serif;
    font-weight: 800;
    letter-spacing: 0.03em;
    box-shadow: 0 14px 30px rgba(23, 71, 201, 0.24);
}

.site-hero-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 15px 24px;
}

.site-content {
    position: relative;
    z-index: 1;
    background: rgba(255, 255, 255, 0.56);
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 30px;
    box-shadow: var(--modern-shadow);
    padding: 30px 24px;
    backdrop-filter: blur(10px);
}

#primary,
#secondary {
    padding-top: 6px;
}

article.hentry,
.not-found,
.page .hentry,
.single .hentry {
    background: var(--modern-surface);
    border: 1px solid var(--modern-line);
    border-radius: var(--modern-radius);
    box-shadow: 0 18px 42px rgba(24, 34, 48, 0.08);
    overflow: hidden;
}

article.hentry {
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

article.hentry:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 46px rgba(24, 34, 48, 0.12);
    border-color: rgba(47, 107, 255, 0.22);
}

.index-post-thumbnail img {
    display: block;
    width: 100%;
    height: auto;
    max-height: none;
    aspect-ratio: auto;
    object-fit: contain;
    min-width: 0;
    margin: 0 !important;
}

.index-post-thumbnail {
    margin-top: -30px;
    margin-left: -30px;
    margin-right: -30px;
    overflow: hidden;
    background: #eef3fb;
    line-height: 0;
}

.index-post-thumbnail a {
    display: block;
}

.index-post-thumbnail.is-landscape img,
.index-post-thumbnail.is-square img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: center center;
}

.index-post-thumbnail.is-portrait img {
    max-height: 720px;
    width: 100%;
    object-fit: contain;
    object-position: center top;
}

.post-content {
    padding: 26px 28px 28px;
}

.entry-header {
    margin-bottom: 16px;
}

.entry-title,
h1.entry-title {
    margin: 0 0 10px;
    font-size: clamp(2rem, 3vw, 3rem);
    line-height: 0.98;
}

h2.entry-title a {
    color: #101828;
}

.entry-content,
.entry-summary,
.site-main p,
.widget p,
.widget li {
    color: #334155;
    font-size: 1rem;
    line-height: 1.8;
}

.entry-content a,
.entry-summary a,
.widget a,
.widget li a {
    color: #2f6bff;
}

.entry-content a:hover,
.entry-summary a:hover,
.widget a:hover,
.widget li a:hover {
    color: #1747c9;
}

.entry-content > :last-child,
.widget > :last-child {
    margin-bottom: 0;
}

.lead-in {
    margin-bottom: 20px;
    padding: 18px 20px;
    background: rgba(47, 107, 255, 0.07);
    border-left: 4px solid var(--modern-brand);
    border-radius: 0 var(--modern-radius-sm) var(--modern-radius-sm) 0;
}

.widget-area .widget,
.secondary-container {
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(47, 107, 255, 0.12);
    border-radius: var(--modern-radius-sm);
    box-shadow: 0 18px 36px rgba(24, 34, 48, 0.08);
}

.widget-area .widget {
    padding: 22px;
    margin-bottom: 22px;
}

.widget-title {
    font-size: 1.8rem;
    margin-bottom: 16px;
    color: #122033;
}

.widget-title:after {
    display: block;
    width: 56px;
    height: 3px;
    margin-top: 10px;
    content: "";
    background: linear-gradient(90deg, var(--modern-brand), rgba(47, 107, 255, 0.08));
    border-radius: 999px;
}

blockquote {
    margin: 28px 0;
    padding: 22px 24px;
    background: rgba(0, 184, 169, 0.08);
    border-left: 4px solid var(--modern-accent);
    border-radius: 0 var(--modern-radius-sm) var(--modern-radius-sm) 0;
}

input[type=text],
input[type=email],
input[type=url],
input[type=password],
input[type=search],
textarea,
select {
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(16, 24, 40, 0.12);
    border-radius: 16px;
    box-shadow: inset 0 1px 2px rgba(16, 24, 40, 0.03);
    padding: 14px 16px;
    color: var(--modern-text);
}

input[type=text]::placeholder,
input[type=email]::placeholder,
input[type=url]::placeholder,
input[type=password]::placeholder,
input[type=search]::placeholder,
textarea::placeholder {
    color: #6b7b93;
}

.site-footer {
    margin-top: 30px;
    background: transparent;
}

.site-footer .footer-panel {
    background: linear-gradient(135deg, #0f172a, #162447 56%, #0f3d56);
    border-radius: 30px;
    padding: 30px 24px 22px;
    box-shadow: 0 28px 60px rgba(8, 15, 24, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.site-footer .widget,
.site-footer {
    background: transparent;
}

.site-footer .widget-area-intro {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    padding: 0 10px 22px;
    margin-bottom: 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.site-footer .widget-area-intro h2 {
    color: #fff;
    margin: 0;
    font-size: clamp(2rem, 4vw, 3rem);
}

.site-footer .widget-area-intro p {
    margin: 0;
    color: rgba(255, 255, 255, 0.72);
    max-width: 42ch;
}

.site-footer .widget-title,
.site-footer h2 {
    color: #fff;
}

.site-footer .widget-title:after,
.site-footer h2:after {
    background: linear-gradient(90deg, #7dd3fc, rgba(125, 211, 252, 0.12));
    width: 52px;
}

.site-footer .widget,
.site-footer .widget li,
.site-footer .widget p,
.site-footer abbr,
.site-footer cite,
.site-footer table caption {
    color: rgba(255, 255, 255, 0.86);
}

.site-footer .widget a,
.site-footer .widget li a,
.site-footer .widget ul li a {
    color: #fff;
}

.copyright {
    margin-top: 16px;
    padding-top: 22px;
    color: rgba(255, 255, 255, 0.8);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.footer-info-right {
    color: rgba(255, 255, 255, 0.78);
}

#secondary h2,
#secondary h3,
#secondary .widget-title,
#secondary .widget p,
#secondary .widget li,
#secondary .widget a {
    color: #20314d !important;
}

#secondary .widget ul li {
    margin-bottom: 12px;
}

#secondary .search-form,
#secondary form {
    background: rgba(248, 251, 255, 0.98);
    border: 1px solid rgba(47, 107, 255, 0.1);
    border-radius: 18px;
    padding: 14px;
}

.topbutton {
    right: 22px;
    bottom: 22px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--modern-brand), var(--modern-brand-dark));
    box-shadow: 0 16px 28px rgba(23, 71, 201, 0.25);
}

.cookie-banner {
    position: fixed;
    left: 24px;
    right: 24px;
    bottom: 24px;
    z-index: 9999;
}

.cookie-banner[hidden] {
    display: none !important;
}

.cookie-banner.is-hiding {
    opacity: 0;
    transform: translateY(12px);
}

.cookie-banner__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    max-width: 1120px;
    margin: 0 auto;
    padding: 18px 20px;
    background: rgba(15, 23, 42, 0.94);
    color: #eef4ff;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.24);
    backdrop-filter: blur(16px);
    transition: opacity 180ms ease, transform 180ms ease;
}

.cookie-banner__copy strong {
    display: block;
    margin-bottom: 4px;
    font-size: 1rem;
    color: #ffffff;
}

.cookie-banner__copy p {
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.65;
}

.cookie-banner__copy a {
    color: #8ec5ff;
    font-weight: 700;
}

.cookie-banner__button {
    flex: 0 0 auto;
    min-width: 140px;
    padding: 14px 20px;
}

@media screen and (max-width: 960px) {
    #page.site {
        padding: 16px 16px 42px;
    }

    .top-bar,
    .site-hero {
        padding-left: 20px;
        padding-right: 20px;
    }

    .site-hero-inner {
        grid-template-columns: 1fr;
    }

    .site-content {
        padding: 18px 8px;
    }
}

@media screen and (max-width: 800px) {
    .top-bar {
        align-items: flex-start;
        flex-direction: column;
    }

    .top-bar-menu .menu {
        width: 100%;
        align-items: stretch;
    }

    .site-header .main-navigation ul li a,
    .site-header .main-navigation ul li a:active,
    .site-header .main-navigation ul li a:focus,
    .site-header .main-navigation ul li a:hover,
    .site-header .main-navigation ul li a:visited {
        display: block;
    }

    .site-footer .widget-area-intro {
        display: grid;
    }
}

@media screen and (max-width: 640px) {
    .site-header-shell,
    .site-content,
    .site-footer .footer-panel,
    article.hentry,
    .not-found,
    .page .hentry,
    .single .hentry {
        border-radius: 22px;
    }

    .post-content {
        padding: 22px 20px 24px;
    }

    .index-post-thumbnail {
        margin-top: -22px;
        margin-left: -20px;
        margin-right: -20px;
    }

    .entry-title,
    h1.entry-title {
        font-size: 2rem;
    }

    .site-tagline,
    .site-hero-copy p {
        font-size: 0.96rem;
    }

    .cookie-banner {
        left: 12px;
        right: 12px;
        bottom: 12px;
    }

    .cookie-banner__inner {
        flex-direction: column;
        align-items: stretch;
        padding: 16px;
    }

    .cookie-banner__button {
        width: 100%;
    }
}
