@font-face {
  font-family: "Great Vibes";
  src: url("fonts/great_vibes/GreatVibes-Regular.ttf")
    format("truetype");
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Playfair Display";
  src: url("fonts/playfair_display/PlayfairDisplay-VariableFont_wght.ttf")
    format("truetype-variations");
  font-weight: 400 700;
  font-stretch: normal;
  font-style: normal;
  font-display: swap;
}

/* libre-franklin-regular (latin) */
@font-face {
  ascent-override: 100%;
  font-display: swap;
  font-family: 'Libre Franklin';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-regular.eot');
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-regular.eot?#iefix') format('embedded-opentype'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-regular.woff2') format('woff2'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-regular.woff') format('woff'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-regular.ttf') format('truetype');
}
/* libre-franklin-italic (latin) */
@font-face {
  ascent-override: 100%;
  font-display: swap;
  font-family: 'Libre Franklin';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-italic.eot');
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-italic.eot?#iefix') format('embedded-opentype'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-italic.woff2') format('woff2'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-italic.woff') format('woff'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-italic.ttf') format('truetype');
       }
/* libre-franklin-500 (latin) */
@font-face {
  ascent-override: 100%;
  font-display: swap;
  font-family: 'Libre Franklin';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-500.eot');
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-500.eot?#iefix') format('embedded-opentype'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-500.woff2') format('woff2'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-500.woff') format('woff'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-500.ttf') format('truetype');
}
/* libre-franklin-500italic (latin) */
@font-face {
  ascent-override: 100%;
  font-display: swap;
  font-family: 'Libre Franklin';
  font-style: italic;
  font-weight: 500;
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-500italic.eot');
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-500italic.eot?#iefix') format('embedded-opentype'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-500italic.woff2') format('woff2'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-500italic.woff') format('woff'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-500italic.ttf') format('truetype');
}
/* libre-franklin-600 (latin) */
@font-face {
  ascent-override: 100%;
  font-display: swap;
  font-family: 'Libre Franklin';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-600.eot'); /* IE9 Compat Modes */
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/libre_franklin/libre-franklin-v19-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/libre_franklin/libre-franklin-v19-latin-600.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/libre_franklin/libre-franklin-v19-latin-600.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* libre-franklin-600italic (latin) */
@font-face {
  ascent-override: 100%;
  font-display: swap;
  font-family: 'Libre Franklin';
  font-style: italic;
  font-weight: 600;
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-600italic.eot');
  src: url('fonts/libre_franklin/libre-franklin-v19-latin-600italic.eot?#iefix') format('embedded-opentype'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-600italic.woff2') format('woff2'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-600italic.woff') format('woff'),
       url('fonts/libre_franklin/libre-franklin-v19-latin-600italic.ttf') format('truetype');
}

/* Base styles */

html {
    scroll-behavior: smooth;
    overflow-x: hidden; /* Prevent horizontal scrolling */
}

body {
    font-family: 'Libre Franklin', Roboto, Arial, 'Helvetica Neue', Helvetica, 'Nimbus Sans L', 'Liberation Sans', 'FreeSans', 'Nimbus Sans', sans-serif;
    line-height: 1.5;
    color: #1e1e1e;
    background-color: #fff7f7; /* Light pink */
    margin: 0rem;
    padding: 0rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 100vh; /* fallback */
    min-height: 100svh;
    overflow-x: hidden;
}

/* Header */
header {
    background-color: #1e1e1e; /* Black */
    color: #ffffff; /* White */
    padding: 1.25rem;
    text-align: center;
    width: 100%;
/*    border-bottom: 5px solid #991F34; */
}

/* First set fallback content for older browsers */
.salutation::after {
  display: inline;
  content: none;
  alt: ''; /* Safari-only property */
}
/* Now use modern syntax to set blank alt text for bots and screen readers
   (NOTE: CSS should ignore this if the syntax is not supported) */
.salutation::after {
  content: '.' / '';
}

/* Titles */
.author-title {
    font-size: clamp(1.3125rem, 13.5vw, 3.375rem); /* fallback */
    font-size: clamp(1.3125rem, 13.5svw, 3.375rem);
    font-family: 'Great Vibes', 'Brush Script MT', serif;
    letter-spacing: 0.03125rem;
    margin-bottom: -0.5em;
    margin-top: 0.5em;
    line-height: 1.35;
}
.brand-title {
    font-size: clamp(1.75rem, 17.5vw, 4.375rem); /* fallback */
    font-size: clamp(1.75rem, 17.5svw, 4.375rem);
    font-family: 'Playfair Display', serif;
    letter-spacing: 0.0625rem;
    margin-bottom: -0.5em;
    margin-top: -0.5em;
    line-height: 1.35;
}
.page-title {
    font-size: clamp(0.875rem, 9vw, 2.25rem); /* fallback */
    font-size: clamp(0.875rem, 9svw, 2.25rem);
    font-family: 'Playfair Display', serif;
    color: #dd3F69; /* Lighter pink */
    letter-spacing: 0.0625rem;
    margin-top: 1em;
    line-height: 1.35;
}

abbr {
    text-decoration: none;
}

/* Navigation */
nav {
    background-color: #991F34; /* Custom Pink */
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 0.75rem 0rem;
}

nav a, .menu-toggle-label span {
    font-size: 1.25rem; /* fallback */
    font-size: clamp(0.75rem, 5.5svw, 1.25rem);
}

nav a {
    color: #ffffff; /* White */
    transition: color 0.3s ease;
    text-decoration: none;
    margin: 0rem 1rem;
}

nav a.active {
    border-bottom: 2px solid;
}

nav a:hover {
    color: #dd3F69; /* Lighter pink */
}

.menu-toggle {
    display: none;
}

.menu-toggle-label {
    display: none;
    background-color: #991F34; /* Custom Pink */
    color: #ffffff; /* White */
    padding: 0.75rem 0rem;
    cursor: pointer;
    text-align: center;
    width: 100%;
}

/* Main Content */
main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0.5rem;
    background-color: #ffffff; /* White */
    box-shadow: 0 0 15px rgba(0,0,0,0.1);
    margin: 1.25rem 0rem;
    border-top: 3px solid #1e1e1e; /* Black */
    border-bottom: 3px solid #1e1e1e; /* Black */
    flex: 1;
    min-height: 400px; /* fallback */
    min-height: max(400px, 25rem);
}

/* Sections */
section, footer p {
    max-width: 800px; /* fallback */
    max-width: min(800px, 50rem);
    padding: 0rem 2rem;
    margin: 0rem auto;
}
section h1 {
    font-size: 1.75rem;
    color: #991F34; /* Custom Pink */
    text-align: center;
    line-height: 1.2;
}
section h2 {
    font-size: 1.5rem; /* Decreased size */
    color: #991F34; /* Custom Pink */
    text-align: center;
    line-height: 1.2;
}
section h3 {
    font-size: 1.25rem; /* Decreased size */
    color: #991F34; /* Custom Pink */
    text-align: center;
    line-height: 1.2;
}

section p {
    font-size: 1rem;
    color: #1e1e1e;
    text-align: left;
}

/* Calendar Container */

.calendar-container {
    display: none;
}

.js .calendar-container {
    display: block;
/*    width: 100vw;
    width: 100svw; */
    width: 100%;
    flex: 1;
    position: relative;
    border: 3px solid #991F34; /* Custom Pink */
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    background-color: #fff7f7; /* Light pink */
    min-height: 88svh;
    max-height: 88svh;
    overflow: auto;
}

.js .calendar-container iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    border: 0rem;
}

/* Footer */
footer {
    background-color: #1e1e1e; /* Black */
    color: #ffffff; /* White */
    padding: 1.25rem;
    text-align: center;
    width: 100%;
    border-top: 5px solid #991F34; /* Custom Pink */
    font-size: 1rem;
    word-spacing: 0.2rem;
}
footer a {
    color: #ffffff; /* White */
    text-decoration: underline;
    transition: color 0.3s ease;
}
.footer-link {
    display: inline-block;
}

.centred-text {
  text-align: center;
}

/* Mobile Adjustments */
@media (max-width: 750px) {
    section p {
        font-size: 1rem;
        padding: 0rem 0.75rem;
    }
    header, footer {
        padding: 1rem;
    }
    main {
        padding: 0.25rem;
        min-height: 100vh; /* fallback */
        min-height: 100svh;
    }
    .js .calendar-container {
        min-height: 75vh; /* fallback */
        max-height: 75vh; /* fallback */
        min-height: 75svh;
        max-height: 75svh;
    }
    /* Responsive Navigation */
    nav {
        display: none;
        flex-direction: column;
        gap: 1em;
        align-items: center;
        width: 100%;
    }
    .menu-toggle:checked + nav {
        display: flex;
    }
    .menu-toggle-label {
        display: block;
    }
}

/* Small Mobile Adjustments */
@media (max-width: 600px) {
    section p {
        padding: 0rem 0.5rem;
    }
}
