@font-face {
font-family: "Poppins";
font-style: normal;
font-display: swap;
font-weight: 400;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/poppins-latin-ext-400-normal.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Poppins";
font-style: normal;
font-display: swap;
font-weight: 400;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/poppins-latin-400-normal.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Poppins";
font-style: normal;
font-display: swap;
font-weight: 500;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/poppins-latin-ext-500-normal.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Poppins";
font-style: normal;
font-display: swap;
font-weight: 500;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/poppins-latin-500-normal.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Poppins";
font-style: normal;
font-display: swap;
font-weight: 600;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/poppins-latin-ext-600-normal.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Poppins";
font-style: normal;
font-display: swap;
font-weight: 600;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/poppins-latin-600-normal.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Poppins";
font-style: normal;
font-display: swap;
font-weight: 700;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/poppins-latin-ext-700-normal.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Poppins";
font-style: normal;
font-display: swap;
font-weight: 700;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/poppins-latin-700-normal.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
} @font-face {
font-family: "Fredoka";
font-style: normal;
font-display: swap;
font-weight: 400;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/fredoka-latin-ext-400-normal.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Fredoka";
font-style: normal;
font-display: swap;
font-weight: 400;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/fredoka-latin-400-normal.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Fredoka";
font-style: normal;
font-display: swap;
font-weight: 500;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/fredoka-latin-ext-500-normal.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Fredoka";
font-style: normal;
font-display: swap;
font-weight: 500;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/fredoka-latin-500-normal.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Fredoka";
font-style: normal;
font-display: swap;
font-weight: 600;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/fredoka-latin-ext-600-normal.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Fredoka";
font-style: normal;
font-display: swap;
font-weight: 600;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/fredoka-latin-600-normal.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Fredoka";
font-style: normal;
font-display: swap;
font-weight: 700;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/fredoka-latin-ext-700-normal.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Fredoka";
font-style: normal;
font-display: swap;
font-weight: 700;
src: url(//www.familiengetuemmel.de/wp-content/themes/familiengetuemmel/assets/fonts/fredoka-latin-700-normal.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}:root {
--blue: #144a7f;
--blue-dark: #0e3560;
--blue-light: #e8f0f9;
--yellow: #f7c133;
--yellow-pale: #fef9ec;
--cream: #f5f0ea;
--cream-dark: #ede7de;
--text: #1a2e45;
--text-muted: #5a7191;
--white: #ffffff;
--radius-card: 1.5rem;
--radius-btn: 999px;
--content-width: 720px;
--container-width: 1100px;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
overflow-x: clip;
}
body {
margin: 0;
font-family: "Poppins", system-ui, sans-serif;
font-weight: 500;
background: var(--cream);
color: var(--text);
line-height: 1.6;
overflow-x: clip;
max-width: 100%;
-webkit-font-smoothing: antialiased;
}
img {
max-width: 100%;
height: auto;
display: block;
}
a {
color: var(--blue);
text-decoration-thickness: 1px;
text-underline-offset: 2px;
}
a:hover {
color: var(--blue-dark);
}
h1,
h2,
h3,
h4,
h5,
h6,
.display {
font-family: "Fredoka", system-ui, sans-serif;
color: var(--blue);
line-height: 1.2;
font-weight: 700;
}
h1 {
font-size: clamp(2rem, 4vw, 2.75rem);
}
h2 {
font-size: clamp(1.6rem, 3vw, 2.25rem);
}
h3 {
font-family: "Fredoka", system-ui, sans-serif;
font-size: 1.1rem;
font-weight: 600;
}
p {
color: var(--text);
}
ul,
ol {
padding-left: 1.25rem;
} .fg-container {
max-width: var(--container-width);
margin: 0 auto;
padding: 0 1.5rem;
}
.fg-content {
max-width: var(--content-width);
margin: 0 auto;
padding: 0 1.5rem;
}
.fg-content.entry-content {
max-width: var(--container-width);
}
.site-main {
padding: 3rem 0 5rem;
min-height: 50vh;
} .btn {
display: inline-flex;
align-items: center;
justify-content: center;
font-family: "Poppins", sans-serif;
font-weight: 600;
font-size: 1rem;
padding: 0.85rem 2rem;
border-radius: var(--radius-btn);
text-decoration: none;
transition: all 0.2s ease;
cursor: pointer;
border: 2px solid transparent;
min-height: 48px;
line-height: 1.2;
}
.btn:hover {
text-decoration: none;
}
.btn--primary {
background: var(--blue);
color: var(--white);
}
.btn--primary:hover {
background: var(--blue-dark);
color: var(--white);
}
.btn--outline {
background: transparent;
color: var(--blue);
border-color: var(--blue);
}
.btn--outline:hover {
background: var(--blue);
color: var(--white);
}
.btn--yellow {
background: var(--yellow);
color: var(--blue);
}
.btn--yellow:hover {
background: #e5b020;
color: var(--blue);
}
.btn--lg {
font-size: 1.15rem;
padding: 1rem 2.4rem;
}
.cta-label-short {
display: none;
} .site-header {
background: var(--cream);
padding: 1rem 1.5rem;
border-bottom: 1px solid var(--cream-dark);
max-width: 100%;
box-sizing: border-box;
}
.header-inner {
max-width: var(--container-width);
margin: 0 auto;
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
min-width: 0;
}
.site-logo {
font-family: "Fredoka", system-ui, sans-serif;
font-size: 1.45rem;
font-weight: 700;
color: var(--blue);
text-decoration: none;
letter-spacing: -0.01em;
display: inline-flex;
align-items: center;
flex: 0 1 auto;
min-width: 0;
max-width: min(200px, 46vw);
}
.site-logo:hover {
text-decoration: none;
color: var(--blue);
}
.site-logo img,
.site-logo .custom-logo {
display: block;
width: 100%;
height: auto;
max-height: 48px;
object-fit: contain;
object-position: left center;
}
.site-logo .custom-logo-link {
display: inline-flex;
text-decoration: none;
min-width: 0;
max-width: 100%;
}
.header-nav {
display: flex;
gap: 0.75rem;
align-items: center;
flex: 0 0 auto;
min-width: 0;
}
.header-nav .btn {
white-space: nowrap;
flex-shrink: 0;
} .page-hero {
background: var(--cream);
padding: 3rem 1.5rem 2rem;
border-bottom: 1px solid var(--cream-dark);
text-align: center;
}
.page-hero .page-title,
.page-hero .entry-title {
margin: 0 0 0.75rem;
}
.page-hero .archive-description,
.page-hero .page-subtitle {
color: var(--text-muted);
font-size: 1.1rem;
max-width: 36rem;
margin: 0 auto;
}
.page-hero .post-meta {
margin-top: 1rem;
color: var(--text-muted);
font-size: 0.95rem;
}
.single-post .page-hero {
max-width: var(--container-width);
width: 100%;
margin-left: auto;
margin-right: auto;
text-align: left;
box-sizing: border-box;
border-bottom: none;
}
.blog .page-hero {
border-bottom: none;
} .posts-grid {
display: grid;
grid-template-columns: 1fr;
gap: 1.75rem;
max-width: var(--container-width);
margin: 0 auto;
padding: 0 1.5rem;
}
@media (min-width: 700px) {
.posts-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1000px) {
.posts-grid {
grid-template-columns: repeat(3, 1fr);
}
}
.post-card {
background: var(--white);
border-radius: var(--radius-card);
overflow: hidden;
box-shadow: 0 2px 16px rgba(20, 74, 127, 0.07);
display: flex;
flex-direction: column;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.post-card:hover {
transform: translateY(-3px);
box-shadow: 0 8px 24px rgba(20, 74, 127, 0.1);
}
.post-card__media {
aspect-ratio: 16 / 10;
background: var(--cream-dark);
overflow: hidden;
}
.post-card__media img {
width: 100%;
height: 100%;
object-fit: cover;
}
.post-card__body {
padding: 1.35rem 1.4rem 1.5rem;
display: flex;
flex-direction: column;
flex-grow: 1;
}
.post-card__title {
font-family: "Fredoka", system-ui, sans-serif;
font-size: 1.25rem;
margin: 0 0 0.65rem;
line-height: 1.3;
}
.post-card__title a {
color: var(--blue);
text-decoration: none;
}
.post-card__title a:hover {
color: var(--blue-dark);
}
.post-card__excerpt {
color: var(--text-muted);
font-size: 0.95rem;
margin: 0 0 1.25rem;
flex-grow: 1;
}
.post-card__excerpt p {
margin: 0;
color: var(--text-muted);
}
.post-card__more {
align-self: flex-start;
font-weight: 600;
font-size: 0.9rem;
text-decoration: none;
} .entry-content,
.page-content {
font-size: 1.05rem;
line-height: 1.75;
}
.entry-content > *:first-child {
margin-top: 0;
}
.entry-content h2,
.entry-content h3,
.page-content h2,
.page-content h3 {
margin-top: 2rem;
margin-bottom: 0.75rem;
scroll-margin-top: 1.25rem;
}
.entry-content p,
.page-content p {
margin: 0 0 1.15rem;
}
.entry-content a,
.page-content a {
font-weight: 500;
}
.entry-content img,
.page-content img,
.entry-content figure,
.page-content figure {
border-radius: 0.75rem;
margin: 1.75rem 0;
}
.entry-content figcaption,
.page-content figcaption {
text-align: center;
font-size: 0.85rem;
line-height: 1.4;
color: var(--text-muted);
margin-top: 0.5rem;
font-family: "Fredoka", system-ui, sans-serif;
font-style: italic;
}
.entry-content blockquote,
.page-content blockquote {
margin: 1.75rem 0;
padding: 1.25rem 1.5rem;
background: var(--blue-light);
border-left: 4px solid var(--yellow);
border-radius: 0 0.75rem 0.75rem 0;
font-style: italic;
}
.entry-content ul,
.entry-content ol,
.page-content ul,
.page-content ol {
margin: 0 0 1.15rem;
}
.entry-content .fg-post-cta,
.page-content .fg-post-cta {
margin: 2rem 0;
}
.entry-content .fg-post-cta--center,
.page-content .fg-post-cta--center {
text-align: center;
}
.entry-content .fg-post-cta .btn,
.page-content .fg-post-cta .btn {
font-weight: 700;
text-decoration: none;
}
.entry-content .wp-block-buttons,
.page-content .wp-block-buttons {
margin: 2rem 0;
}
.entry-content .wp-block-button__link,
.page-content .wp-block-button__link {
font-family: "Poppins", sans-serif;
font-weight: 600;
font-size: 1rem;
padding: 0.85rem 2rem;
border-radius: var(--radius-btn);
background: var(--blue);
color: var(--white);
text-decoration: none;
line-height: 1.2;
}
.entry-content .wp-block-button__link:hover,
.page-content .wp-block-button__link:hover {
background: var(--blue-dark);
color: var(--white);
}
.entry-content .wp-block-button.is-style-fg-cta .wp-block-button__link,
.page-content .wp-block-button.is-style-fg-cta .wp-block-button__link,
.wp-block-button.is-style-fg-cta .wp-block-button__link {
font-family: "Poppins", sans-serif;
font-weight: 700;
font-size: 1rem;
padding: 0.85rem 2rem;
border-radius: var(--radius-btn);
background: var(--yellow) !important;
color: var(--blue) !important;
text-decoration: none;
line-height: 1.2;
}
.entry-content .wp-block-button.is-style-fg-cta .wp-block-button__link:hover,
.page-content .wp-block-button.is-style-fg-cta .wp-block-button__link:hover,
.wp-block-button.is-style-fg-cta .wp-block-button__link:hover {
background: #e5b020 !important;
color: var(--blue) !important;
}
.entry-content figure.wp-block-table {
margin: 1.75rem 0;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
background: var(--white);
border: 1px solid var(--cream-dark);
border-radius: var(--radius-card);
box-shadow: 0 2px 16px rgba(20, 74, 127, 0.08);
font-size: 0;
line-height: 0;
}
.entry-content .wp-block-table table,
.entry-content table {
border-collapse: separate;
border-spacing: 0;
width: 100%;
min-width: 32rem;
margin: 0;
border: none;
font-size: 0.95rem;
line-height: 1.45;
table-layout: auto;
}
.entry-content .wp-block-table .has-fixed-layout {
table-layout: auto;
}
.entry-content .wp-block-table thead,
.entry-content .wp-block-table tfoot,
.entry-content .wp-block-table tr,
.entry-content table thead,
.entry-content table tfoot,
.entry-content table tr {
border: none;
}
.entry-content .wp-block-table th,
.entry-content .wp-block-table td,
.entry-content table th,
.entry-content table td {
border: none;
border-right: 1px solid var(--cream-dark);
border-bottom: 1px solid var(--cream-dark);
padding: 0.8rem 1rem;
vertical-align: top;
color: var(--text);
word-break: normal;
overflow-wrap: break-word;
hyphens: auto;
-webkit-hyphens: auto;
}
.entry-content .wp-block-table .has-fixed-layout td,
.entry-content .wp-block-table .has-fixed-layout th {
word-break: normal;
}
.entry-content .wp-block-table tr > *:last-child,
.entry-content table tr > *:last-child {
border-right: none;
}
.entry-content .wp-block-table tr:last-child th,
.entry-content .wp-block-table tr:last-child td,
.entry-content table tr:last-child th,
.entry-content table tr:last-child td {
border-bottom: none;
}
.entry-content .wp-block-table thead th,
.entry-content table thead th {
background: var(--blue);
color: var(--white);
font-family: "Fredoka", system-ui, sans-serif;
font-size: 0.95rem;
font-weight: 600;
letter-spacing: 0.01em;
border-bottom: none;
border-right-color: rgba(255, 255, 255, 0.18);
padding: 0.9rem 1rem;
}
.entry-content .wp-block-table thead th:last-child,
.entry-content table thead th:last-child {
background: var(--blue-dark);
}
.entry-content .wp-block-table table:has(tr > :nth-child(4)) thead th:last-child,
.entry-content table:has(tr > :nth-child(4)) thead th:last-child {
background: var(--blue);
}
.entry-content .wp-block-table tbody td:first-child,
.entry-content table tbody td:first-child {
font-weight: 600;
color: var(--blue);
background: var(--blue-light);
white-space: nowrap;
}
.entry-content .wp-block-table tbody td:last-child,
.entry-content table tbody td:last-child {
background: var(--yellow-pale);
font-weight: 500;
}
.entry-content .wp-block-table tbody tr:nth-child(even) td,
.entry-content table tbody tr:nth-child(even) td {
background: var(--cream);
}
.entry-content .wp-block-table tbody tr:nth-child(even) td:first-child,
.entry-content table tbody tr:nth-child(even) td:first-child {
background: #d9e6f4;
}
.entry-content .wp-block-table tbody tr:nth-child(even) td:last-child,
.entry-content table tbody tr:nth-child(even) td:last-child {
background: #f8e9be;
}
.entry-content .wp-block-table table:has(tr > :nth-child(4)) tbody td:last-child,
.entry-content table:has(tr > :nth-child(4)) tbody td:last-child {
background: transparent;
font-weight: inherit;
}
.entry-content .wp-block-table table:has(tr > :nth-child(4)) tbody tr:nth-child(even) td:last-child,
.entry-content table:has(tr > :nth-child(4)) tbody tr:nth-child(even) td:last-child {
background: var(--cream);
}
.entry-content .wp-block-table table[style*="border-top-color"] > *,
.entry-content .wp-block-table table[style*="border-top-color"] tr:first-child,
.entry-content .wp-block-table table[style*="border-top-color"] tr:first-child th,
.entry-content .wp-block-table table[style*="border-top-color"] tr:first-child td {
border-top: none;
}
@media (max-width: 700px) {
.entry-content .wp-block-table table,
.entry-content table {
font-size: 0.8rem;
min-width: 28rem;
}
.entry-content .wp-block-table th,
.entry-content .wp-block-table td,
.entry-content table th,
.entry-content table td {
padding: 0.55rem 0.65rem;
}
.entry-content .wp-block-table tbody td:first-child,
.entry-content table tbody td:first-child {
white-space: normal;
}
}
.entry-featured {
max-width: var(--container-width);
margin: 0 auto 2.5rem;
padding: 0 1.5rem;
}
.single-post .entry-featured {
margin-bottom: 1.25rem;
}
.single-post .site-main {
padding-top: 1.5rem;
}
.entry-featured img {
width: 100%;
max-height: 480px;
object-fit: cover;
border-radius: var(--radius-card);
box-shadow: 0 4px 20px rgba(20, 74, 127, 0.12);
}
.fg-toc {
margin: 2.3rem 0 2rem;
padding: 1.35rem 1.5rem 1.2rem;
background: var(--white);
border-radius: var(--radius-card);
box-shadow: 0 2px 16px rgba(20, 74, 127, 0.07);
border-left: 4px solid var(--yellow);
}
.fg-toc__title {
font-family: "Fredoka", system-ui, sans-serif;
font-size: 1.15rem;
font-weight: 700;
color: var(--blue);
margin: 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
cursor: pointer;
list-style: none;
}
.fg-toc[open] .fg-toc__title {
margin-bottom: 0.75rem;
}
.fg-toc__title::-webkit-details-marker {
display: none;
}
.fg-toc__title::after {
content: "";
width: 0.5rem;
height: 0.5rem;
border-right: 2px solid var(--blue);
border-bottom: 2px solid var(--blue);
transform: rotate(45deg);
transition: transform 0.2s ease;
flex-shrink: 0;
margin-top: -0.2rem;
}
.fg-toc[open] .fg-toc__title::after {
transform: rotate(-135deg);
margin-top: 0.2rem;
}
.entry-content .fg-toc ol {
margin: 0;
padding-left: 1.25rem;
}
.fg-toc__list > li + li {
margin-top: 0.35rem;
}
.fg-toc ol ol {
margin-top: 0.35rem;
padding-left: 1.1rem;
}
.fg-toc a {
text-decoration: none;
font-weight: 600;
}
.fg-toc a:hover {
color: var(--blue-dark);
text-decoration: underline;
}
.post-tags {
margin-top: 2.5rem;
padding-top: 1.5rem;
border-top: 1px solid var(--cream-dark);
}
.post-tags .tag-links a {
display: inline-flex;
padding: 0.35rem 0.85rem;
margin: 0.25rem 0.35rem 0.25rem 0;
background: var(--blue-light);
color: var(--blue);
border-radius: var(--radius-btn);
font-size: 0.85rem;
font-weight: 600;
text-decoration: none;
}
.post-tags .tag-links a:hover {
background: var(--blue);
color: var(--white);
}
.post-navigation {
max-width: var(--content-width);
margin: 3rem auto 0;
padding: 0 1.5rem;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.post-navigation a {
display: block;
padding: 1.15rem 1.25rem;
background: var(--white);
border-radius: 0.75rem;
text-decoration: none;
box-shadow: 0 2px 12px rgba(20, 74, 127, 0.07);
color: var(--text);
}
.post-navigation .nav-subtitle {
display: block;
font-size: 0.8rem;
color: var(--text-muted);
margin-bottom: 0.35rem;
}
.post-navigation .nav-title {
font-family: "Fredoka", system-ui, sans-serif;
font-weight: 700;
color: var(--blue);
}
.post-navigation .nav-next {
text-align: right;
} .pagination,
.nav-links {
display: flex;
justify-content: center;
align-items: center;
gap: 0.5rem;
margin: 3rem auto 0;
padding: 0 1.5rem;
flex-wrap: wrap;
}
.pagination .page-numbers,
.nav-links .page-numbers,
.pagination a,
.nav-previous a,
.nav-next a {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 2.5rem;
min-height: 2.5rem;
padding: 0.4rem 0.85rem;
border-radius: var(--radius-btn);
background: var(--white);
color: var(--blue);
text-decoration: none;
font-weight: 600;
font-size: 0.95rem;
border: 1px solid var(--cream-dark);
}
.pagination .page-numbers.current,
.nav-links .page-numbers.current {
background: var(--blue);
color: var(--white);
border-color: var(--blue);
}
.pagination .page-numbers:hover,
.nav-links .page-numbers:hover {
background: var(--blue);
color: var(--white);
} .related-posts {
max-width: var(--container-width);
margin: 3rem auto 0;
padding: 0;
text-align: left;
}
.related-posts__title {
margin: 0 0 1.5rem;
padding: 0 1.5rem;
text-align: left;
}
.related-posts .posts-grid {
margin-bottom: 0;
}
.comments-area {
max-width: var(--content-width);
margin: 3rem auto 0;
padding: 2rem 1.5rem 0;
border-top: 1px solid var(--cream-dark);
text-align: left;
}
.single-post .comments-area {
max-width: var(--container-width);
}
.comments-title {
margin-bottom: 1.5rem;
text-align: left;
}
.comment-respond,
.comment-form,
.comment-form .form-submit {
text-align: left;
}
.comment-list {
list-style: none;
padding: 0;
margin: 0 0 2rem;
}
.comment-body {
background: var(--white);
border-radius: 0.75rem;
padding: 1.25rem 1.4rem;
margin-bottom: 1rem;
box-shadow: 0 2px 12px rgba(20, 74, 127, 0.06);
}
.comment-author {
font-weight: 600;
color: var(--blue);
}
.comment-meta {
font-size: 0.85rem;
color: var(--text-muted);
margin-bottom: 0.75rem;
}
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
width: 100%;
padding: 0.75rem 1rem;
border: 1px solid var(--cream-dark);
border-radius: 0.75rem;
background: var(--white);
font-family: inherit;
font-size: 1rem;
color: var(--text);
}
.comment-form input[type="submit"],
.comment-form .submit {
background: var(--blue);
color: var(--white);
border: none;
border-radius: var(--radius-btn);
padding: 0.85rem 2rem;
font-weight: 600;
cursor: pointer;
font-family: inherit;
}
.comment-form input[type="submit"]:hover {
background: var(--blue-dark);
} .empty-state {
text-align: center;
padding: 4rem 1.5rem;
max-width: 32rem;
margin: 0 auto;
}
.empty-state h1,
.empty-state h2 {
margin-bottom: 1rem;
}
.empty-state p {
color: var(--text-muted);
margin-bottom: 2rem;
}
.search-form {
display: flex;
gap: 0.75rem;
max-width: 28rem;
margin: 0 auto;
flex-wrap: wrap;
justify-content: center;
}
.search-form .search-field {
flex: 1 1 12rem;
padding: 0.75rem 1rem;
border: 1px solid var(--cream-dark);
border-radius: var(--radius-btn);
font-family: inherit;
font-size: 1rem;
background: var(--white);
}
.search-form .search-submit {
background: var(--blue);
color: var(--white);
border: none;
border-radius: var(--radius-btn);
padding: 0.75rem 1.5rem;
font-weight: 600;
cursor: pointer;
font-family: inherit;
} .blog-cta {
background: var(--blue-dark);
padding: 3.5rem 1.5rem;
text-align: center;
margin-top: 2rem;
}
.blog-cta h2 {
color: var(--white);
margin: 0 0 0.75rem;
}
.blog-cta p {
color: rgba(255, 255, 255, 0.85);
font-size: 1.1rem;
margin: 0 auto 1.75rem;
max-width: 32rem;
} .site-footer {
background: var(--cream);
border-top: 2px solid var(--blue);
padding: 2.5rem 1.5rem;
margin-top: 1.5rem;
}
.footer-inner {
max-width: var(--container-width);
margin: 0 auto;
display: grid;
grid-template-columns: max-content repeat(3, minmax(0, 1fr));
column-gap: 3rem;
row-gap: 2rem;
align-items: start;
}
.footer-brand {
text-align: left;
min-width: max-content;
}
.footer-logo a {
display: inline-flex;
text-decoration: none;
}
.footer-logo img {
display: block;
width: 199px;
max-width: 100%;
height: 40px;
object-fit: contain;
object-position: left center;
}
.footer-tagline {
font-size: 0.85rem;
color: var(--text-muted);
text-align: left;
margin-top: 0.5rem;
white-space: nowrap;
}
.footer-col h4 {
font-family: "Poppins", system-ui, sans-serif;
font-size: 1.05rem;
font-weight: 600;
color: var(--blue);
margin: 0 0 1rem;
}
.footer-col .footer-social-heading {
margin-top: 1.5rem;
}
.footer-col ul {
list-style: none;
margin: 0;
padding: 0;
}
.footer-col li {
margin-bottom: 0.5rem;
}
.footer-col a {
font-size: 0.9rem;
color: var(--text-muted);
text-decoration: none;
}
.footer-col a:hover {
color: var(--blue);
}
.footer-apps {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.5rem;
}
.footer-apps a {
display: inline-flex;
}
.footer-apps img {
display: block;
width: 12rem;
max-width: 100%;
height: auto;
}
.footer-instagram {
display: inline-flex;
align-items: center;
gap: 0.45rem;
}
.footer-instagram-icon {
display: block;
width: 20px;
height: 20px;
flex-shrink: 0;
} .alignwide {
max-width: var(--container-width);
margin-left: auto;
margin-right: auto;
}
.alignfull {
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
}
.wp-block-image img {
border-radius: 0.75rem;
}
.screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
word-wrap: normal !important;
} @media (max-width: 900px) {
.footer-inner {
grid-template-columns: 1fr 1fr;
}
.post-navigation {
grid-template-columns: 1fr;
}
.post-navigation .nav-next {
text-align: left;
}
}
@media (max-width: 700px) {
.cta-label-full {
display: none;
}
.cta-label-short {
display: inline;
}
}
@media (max-width: 600px) {
.site-header {
padding: 0.65rem 0.75rem;
}
.site-logo {
max-width: min(130px, 36vw);
}
.site-logo img,
.site-logo .custom-logo-link img {
max-height: 32px;
}
.header-nav {
gap: 0.35rem;
}
.header-nav .btn {
padding: 0.5rem 0.75rem;
font-size: 0.8rem;
min-height: 38px;
}
.footer-inner {
grid-template-columns: 1fr;
column-gap: 0;
}
.site-main {
padding: 2rem 0 3.5rem;
}
.single-post .site-main {
padding-top: 1rem;
}
}
@media (max-width: 400px) {
.site-logo {
max-width: min(110px, 32vw);
}
.site-logo img,
.site-logo .custom-logo-link img {
max-height: 28px;
}
.header-nav .btn {
padding: 0.45rem 0.65rem;
font-size: 0.75rem;
min-height: 36px;
}
}h1:where(.wp-block-heading).has-background,h2:where(.wp-block-heading).has-background,h3:where(.wp-block-heading).has-background,h4:where(.wp-block-heading).has-background,h5:where(.wp-block-heading).has-background,h6:where(.wp-block-heading).has-background{padding:1.25em 2.375em}h1.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h1.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h2.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h2.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h3.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h3.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h4.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h4.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h5.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h5.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h6.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]){rotate:180deg}.is-small-text{font-size:.875em}.is-regular-text{font-size:1em}.is-large-text{font-size:2.25em}.is-larger-text{font-size:3em}.has-drop-cap:not(:focus):first-letter{float:left;font-size:8.4em;font-style:normal;font-weight:100;line-height:.68;margin:.05em .1em 0 0;text-transform:uppercase}body.rtl .has-drop-cap:not(:focus):first-letter{float:none;margin-left:.1em}p.has-drop-cap.has-background{overflow:hidden}:root :where(p.has-background){padding:1.25em 2.375em}:where(p.has-text-color:not(.has-link-color)) a{color:inherit}p.has-text-align-left[style*="writing-mode:vertical-lr"],p.has-text-align-right[style*="writing-mode:vertical-rl"]{rotate:180deg}