/* Let It GrO-Week 2026 - Lorax / Watercolor / Cream + Purple Pastels */

.groweek-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.groweek {
    --gw-cream: #fdf6ec;
    --gw-cream-warm: #f5ead6;
    --gw-purple: #8b6aad;
    --gw-purple-light: #c4aeda;
    --gw-purple-dark: #5e3d7a;
    --gw-pink: #e8a4c8;
    --gw-pink-light: #f3d0e3;
    --gw-orange: #e8985a;
    --gw-orange-light: #f5c89a;
    --gw-yellow: #f0d86e;
    --gw-green: #7db87a;
    --gw-green-light: #b5d8a3;
    --gw-sky: #c8e2f0;
    --gw-ink: #3d2f4a;
    --gw-ink-soft: #5e4a6e;

    font-family: 'DM Sans', 'Georgia', serif;
    color: var(--gw-ink);
    min-height: 100vh;
    padding-bottom: 0;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;

    background-color: #faf5eb;
    background-image: url('/static/oweek/2026/watercolor-paper.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: fixed;
    background-blend-mode: multiply;
    position: relative;
    /* 'hidden' forces overflow-y to compute to 'auto', turning the wrapper
     * into a second scroll container (double scrollbar). 'clip' cuts off
     * the decorative blotches without creating a scroll container. */
    overflow-x: hidden; /* fallback for browsers without 'clip' */
    overflow-x: clip;
}

/* Push footer to bottom */
.groweek-page {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.groweek-page main {
    flex: 1;
}

/* Paper grain overlay - disabled, was causing scroll glitches */

.groweek > * {
    position: relative;
    z-index: 1;
}

/* Watercolor blotch elements - real paint look via SVG displacement */
.watercolor-blotch {
    position: absolute;
    border-radius: 42% 58% 63% 37% / 45% 55% 45% 55%;
    opacity: 0.35;
    pointer-events: none;
    z-index: 0;
    filter: url(#watercolor-blotch);
    transform: translateZ(0);
    mix-blend-mode: multiply;
}

/* Watercolor divider */
.groweek-wc-divider {
    position: relative;
    height: 20px;
    margin: 2.5rem auto;
    max-width: 500px;
    overflow: visible;
}

.groweek-wc-divider::before {
    content: '';
    position: absolute;
    left: 10%;
    right: 10%;
    top: 50%;
    height: 4px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(139, 106, 173, 0.5) 15%,
        rgba(232, 164, 200, 0.6) 35%,
        rgba(232, 152, 90, 0.5) 55%,
        rgba(240, 216, 110, 0.5) 75%,
        rgba(125, 184, 122, 0.4) 90%,
        transparent 100%
    );
    filter: url(#watercolor-edge);
    border-radius: 50%;
}

/* Compact hero for subpages */
.groweek-hero-compact {
    padding: 2.5rem 2rem 1rem;
}

.groweek-logo-small {
    max-width: 280px;
    animation: none;
}

/* ---- Hero - Photo with logo overlay ---- */
.groweek-hero-photo {
    position: relative;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 2rem 2rem 0;
}

.groweek-hero-bg {
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: 20px;
    filter: url(#watercolor-edge);
    box-shadow: 0 4px 30px rgba(139, 106, 173, 0.15);
}

.groweek-hero-photo-overlay {
    position: absolute;
    inset: 2rem 2rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    background: rgba(252, 249, 243, 0.65);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.groweek-hero-photo-overlay .groweek-logo {
    max-width: 340px;
    margin-bottom: 1rem;
}

.groweek-hero-photo-overlay .groweek-countdown-wrap {
    margin: 0;
}

@media (max-width: 768px) {
    .groweek-hero-photo {
        padding: 1rem;
    }
    .groweek-hero-bg {
        height: 300px;
    }
    .groweek-hero-photo-overlay {
        inset: 1rem;
    }
    .groweek-hero-photo-overlay .groweek-logo {
        max-width: 240px;
    }
}

@media (max-width: 480px) {
    .groweek-hero-bg {
        height: 250px;
        border-radius: 16px;
    }
    .groweek-hero-photo-overlay {
        border-radius: 16px;
    }
    .groweek-hero-photo-overlay .groweek-logo {
        max-width: 180px;
    }
}

/* Hero bar - logo left, countdown right, quad bg full width */
.groweek-hero-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2rem 3rem;
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    overflow: visible;
}

.groweek-hero-bar .groweek-hero-bg-photo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100vw;
    height: 140%;
    object-fit: cover;
    opacity: 0.1;
    filter: grayscale(30%) blur(1.5px);
    z-index: 0;
    pointer-events: none;
}

.groweek-hero-bar-logo {
    width: 220px;
    height: auto;
    position: relative;
    z-index: 1;
    filter: drop-shadow(0 2px 10px rgba(139, 106, 173, 0.15));
}

.groweek-countdown-lilac {
    background: rgba(169, 140, 200, 0.85) !important;
    border: 2px solid rgba(139, 106, 173, 0.4) !important;
    color: white;
    position: relative;
    z-index: 1;
}

.groweek-countdown-lilac .groweek-countdown-time {
    color: white !important;
}

.groweek-countdown-lilac p {
    color: rgba(255, 255, 255, 0.9) !important;
}

@media (max-width: 768px) {
    .groweek-hero-bar {
        flex-direction: column;
        gap: 1rem;
        padding: 1.5rem;
    }
    .groweek-hero-bar-logo {
        width: 180px;
    }
}

@media (max-width: 480px) {
    .groweek-hero-bar-logo {
        width: 150px;
    }
}

/* Decorated sections with Lorax illustrations */
.groweek-decorated-section {
    position: relative;
    overflow: visible;
}

.groweek-decor {
    position: absolute;
    pointer-events: none;
    z-index: 2;
    opacity: 0.85;
    filter: drop-shadow(0 2px 8px rgba(94, 61, 122, 0.1));
}

.groweek-last-section {
    margin-bottom: 0 !important;
    padding-bottom: 3.5rem !important;
}

@media (max-width: 768px) {
    .groweek-last-section {
        padding-bottom: 2.5rem !important;
    }
}

.groweek-last-section .groweek-info-grid {
    margin-bottom: 0 !important;
}

/* Tree panorama footer - locked to bottom, no gaps */
.groweek-tree-footer {
    width: 100%;
    margin: -1px 0 -1px;
    padding: 0;
    line-height: 0;
    font-size: 0;
}

.groweek-tree-footer img {
    width: 100%;
    height: auto;
    display: block;
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

/* Site-wide footer, re-themed for O-Week pages only (scoped by the
   .groweek-page wrapper class - every other page keeps the plain
   purple footer). Truffula forest sits behind the existing Commons/
   Yurt silhouette as a second background layer. */
.groweek-page .mc-footer {
    /* The footer is a sibling of .groweek, not a child, so the page's parchment
       background does not reach it - a transparent footer just exposed the plain
       white page beneath. Painting the SAME fixed, cover-fit watercolor texture
       here makes it align to the viewport identically to the content above, so
       the two meet with no visible seam. */
    background-color: #faf5eb;
    background-image: url('/static/oweek/2026/watercolor-paper.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: fixed;
    background-blend-mode: multiply;
}

.groweek-page .mc-footer::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url('/static/oweek/2026/decor/tree-panorama.png');
    background-repeat: no-repeat;
    /* Anchored to the top so the image's transparent upper band (above the
       treetops) stays inside the visible crop at wide/short desktop aspect
       ratios instead of being cropped away by cover-fit - that's what lets
       the parchment texture behind it show through. */
    background-position: center top;
    background-size: cover;
    /* The source illustration has opaque white watercolor "splatter"
       blotches baked into its sky area (not transparency), which read as
       flat white rectangles against the cream page. Multiply blends those
       white pixels down to whatever's behind (the cream/paper footer
       background), matching the multiply treatment already used on the
       page's own paper texture, while only lightly darkening the painted
       trees. */
    mix-blend-mode: multiply;
    z-index: 0;
}

.groweek-page .mc-footer-silhouette {
    display: none;
}

.groweek-page .mc-footer-wordmark,
.groweek-page .mc-footer-contact,
.groweek-page .mc-footer-contact p,
.groweek-page .mc-footer-contact a {
    color: var(--mc-purple-700);
    /* A light halo instead of a dark shadow - the tree illustration has both
       light sky and dark foliage bands, and dark purple text needs
       consistent contrast against either. */
    text-shadow: 0 0 6px rgba(255, 255, 255, 0.85), 0 0 14px rgba(255, 255, 255, 0.6);
}

.groweek-page .mc-footer-wordmark {
    line-height: 0.9;
}

/* The wordmark is a big two-line script logo, much taller than the small
   contact block beside it. Both start at the same top offset in the base
   Footer.css, which leaves the contact text sitting near the wordmark's top
   line instead of reading as level with it. Push it down so its block is
   vertically centered against the full wordmark, desktop only - the mobile
   layout below 1024px stacks them and needs the base top:auto. */
@media (min-width: 1025px) {
    .groweek-page .mc-footer-contact {
        top: calc(133px * var(--s));
    }
}

@media (max-width: 768px) {

    .groweek-decor {
        display: none;
    }
}

/* ---- Hero (subpage centered) ---- */
.groweek-hero {
    text-align: center;
    padding: 4rem 2rem 2rem;
    max-width: 900px;
    margin: 0 auto;
}

.groweek-logo {
    width: 100%;
    max-width: 480px;
    height: auto;
    margin: 0 auto 1.5rem;
    display: block;
    filter: drop-shadow(0 4px 20px rgba(139, 106, 173, 0.2));
}

/* ---- Hero - Seuss book layout: illustration + quote, countdown centered below ---- */
.groweek-hero-seuss {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 1100px;
    margin: 0 auto;
    padding: 3.5rem 2.5rem 2rem;
    position: relative;
    overflow: visible;
}

.groweek-hero-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3.5rem;
    position: relative;
    z-index: 1;
}

.groweek-hero-seuss > .groweek-countdown-wrap {
    margin: 1.5rem auto 0;
    position: relative;
    z-index: 1;
}

.groweek-hero-illustration {
    flex: 0 0 auto;
    display: flex;
    justify-content: center;
}

.groweek-hero-illustration .groweek-logo {
    width: 320px;
    max-width: 320px;
    margin: 0;
    filter: drop-shadow(0 6px 24px rgba(139, 106, 173, 0.25));
}

.groweek-hero-text {
    flex: 1;
    min-width: 0;
    position: relative;
}

.groweek-hero-quote {
    font-family: 'Playfair Display', 'Instrument Serif', Georgia, serif;
    font-size: clamp(1.2rem, 2.8vw, 1.55rem);
    color: var(--gw-purple-dark);
    font-weight: 400;
    font-style: italic;
    line-height: 1.55;
    margin: 0 0 0.75rem;
    padding: 0 0 0 1.25rem;
    border: none;
    border-left: 3px solid var(--gw-purple-light);
}

.groweek-hero-cite {
    display: block;
    font-family: 'Instrument Sans', 'DM Sans', sans-serif;
    font-size: 0.85rem;
    font-style: normal;
    color: var(--gw-purple);
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
    padding-left: 1.25rem;
}

.groweek-hero-welcome {
    font-family: 'Instrument Serif', Georgia, serif;
    font-size: 1.15rem;
    color: var(--gw-ink);
    font-weight: 400;
    margin: 0 0 1.5rem;
    line-height: 1.5;
}

.groweek-hero-text .groweek-countdown-wrap {
    margin: 0;
}

.groweek-hero-seuss > .groweek-countdown-wrap.groweek-countdown-lilac {
    margin: 1.5rem auto 0;
}

/* ---- Countdown ---- */
.groweek-countdown-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 2rem auto 0;
    padding: 1.25rem 2.5rem;
    background: linear-gradient(135deg, rgba(139, 106, 173, 0.1) 0%, rgba(196, 174, 218, 0.15) 100%);
    border: 2px solid var(--gw-purple-light);
    border-radius: 20px;
    width: min(620px, calc(100vw - 4rem));
    flex-shrink: 0;
    box-sizing: border-box;
}

.groweek-countdown-wrap .groweek-countdown-time {
    font-family: 'DM Sans', sans-serif;
    font-size: 1.25rem;
    color: var(--gw-purple-dark);
    margin: 0;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: normal;
    text-align: center;
    width: 100%;
}

.groweek-countdown-wrap p {
    font-size: 0.9rem;
    color: var(--gw-purple);
    margin: 0.25rem 0 0;
    font-weight: 500;
}

/* ---- Section Divider (Truffula swirl) ---- */
.groweek-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin: 3rem auto;
    max-width: 400px;
    padding: 0 2rem;
}

.groweek-divider::before,
.groweek-divider::after {
    content: '';
    flex: 1;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--gw-purple-light), transparent);
}

.groweek-divider-icon {
    font-size: 1.6rem;
    line-height: 1;
}

/* ---- Section layout ---- */
.groweek-section {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto 3.5rem;
    padding: 0 2rem;
    box-sizing: border-box;
}

.groweek-section + .groweek-section {
    margin-top: 1rem;
}

/* A page with genuinely one thing to say still needs to fill the frame —
   center it in the space rather than let it sit top-aligned over a long
   stretch of empty parchment texture. */
.groweek-letter-pending {
    min-height: calc(100vh - 220px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 0.5rem;
}

.groweek-letter-pending-icon {
    font-size: 2.75rem;
    color: var(--gw-purple);
    opacity: 0.8;
    margin-bottom: 0.25rem;
}

.groweek-letter-pending-body {
    max-width: 46ch;
    font-size: 1.05rem;
    color: var(--gw-ink-soft);
    line-height: 1.6;
}

.groweek-letter-pending-contact {
    font-size: 0.95rem;
    color: var(--gw-ink-soft);
}

.groweek-letter-pending-contact a {
    color: var(--gw-purple-dark);
}

@media (max-width: 640px) {
    .groweek-letter-pending {
        min-height: calc(100vh - 320px);
    }
}

.groweek-section-title {
    font-family: 'Playfair Display', 'Instrument Serif', Georgia, serif;
    font-size: clamp(1.8rem, 4.5vw, 2.6rem);
    color: var(--gw-purple-dark);
    text-align: center;
    margin-bottom: 2rem;
    font-weight: 400;
    position: relative;
}

.groweek-section-title::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, var(--gw-purple-light), var(--gw-pink-light));
    margin: 0.75rem auto 0;
    border-radius: 2px;
}

/* ---- Accented cards (colored left border) ---- */
.groweek-card-accented {
    border-left: 4px solid var(--card-accent, var(--gw-purple));
    border-radius: 4px 16px 16px 4px;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.groweek-card-accented:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(139, 106, 173, 0.12);
}

/* ---- "What to Expect" grid - icon + text rows ---- */
.groweek-expect-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-top: 1.5rem;
}

.groweek-expect-item {
    display: flex;
    gap: 1rem;
    background: white;
    border-radius: 16px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(139, 106, 173, 0.06);
    border: 1px solid rgba(139, 106, 173, 0.1);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.groweek-expect-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(139, 106, 173, 0.12);
}

.groweek-expect-icon {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gw-purple);
}

.groweek-expect-icon i {
    font-size: 1.8rem;
    line-height: 1;
}

.groweek-info-card h3 i {
    font-size: 1.1rem;
    vertical-align: middle;
    margin-right: 0.3rem;
    color: var(--card-accent, var(--gw-purple));
}

.groweek-expect-item h3 {
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: 1.15rem;
    color: var(--gw-purple-dark);
    margin: 0 0 0.4rem;
    font-weight: 400;
}

.groweek-expect-item p {
    font-size: 0.92rem;
    line-height: 1.6;
    color: var(--gw-ink-soft);
    margin: 0;
}

/* ---- Mission ---- */
.groweek-mission-section {
    margin-top: 2rem;
}

.groweek-mission {
    background: rgba(255, 255, 255, 0.85);
    border-radius: 20px;
    padding: 2.5rem 3rem;
    box-shadow: 0 4px 30px rgba(139, 106, 173, 0.08);
    border: 1px solid rgba(139, 106, 173, 0.12);
    position: relative;
}

.groweek-mission p {
    font-size: 1.05rem;
    line-height: 1.8;
    color: var(--gw-ink);
    margin-bottom: 1rem;
}

/* Exact colors from the 2026 Advisor Application's Mission Statement -
   sampled directly from the doc, not the site's own softer palette. */
.groweek-mission-pink {
    color: #ffb5f6;
}

.groweek-mission-blue {
    color: #a7def2;
}

.groweek-mission-orange {
    color: #ffa32c;
}

.groweek-mission p:last-child {
    margin-bottom: 0;
}

/* Furniture measurements table */
.groweek-measurements-table {
    width: 100%;
    max-width: 480px;
    margin: 1.25rem 0 1.5rem;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(139, 106, 173, 0.18);
}

.groweek-measurements-table caption {
    caption-side: top;
    text-align: left;
    font-family: 'DM Sans', sans-serif;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 600;
    color: var(--gw-ink-soft);
    margin-bottom: 0.6rem;
}

.groweek-measurements-table th,
.groweek-measurements-table td {
    padding: 0.65rem 1rem;
    text-align: left;
    font-size: 0.92rem;
    line-height: 1.4;
}

.groweek-measurements-table thead th {
    background: var(--gw-purple-light);
    color: var(--gw-purple-dark);
    font-family: 'DM Sans', sans-serif;
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.groweek-measurements-table tbody th {
    background: rgba(196, 174, 218, 0.12);
    color: var(--gw-purple-dark);
    font-weight: 600;
    white-space: nowrap;
}

.groweek-measurements-table tbody td {
    color: var(--gw-ink);
    background: white;
}

.groweek-measurements-table tbody tr:not(:last-child) th,
.groweek-measurements-table tbody tr:not(:last-child) td {
    border-bottom: 1px solid rgba(139, 106, 173, 0.12);
}

/* Pull quote - subtle inline emphasis */
.groweek-pull-quote {
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: 1.1rem;
    font-style: italic;
    color: var(--gw-purple);
    text-align: center;
    margin: 1.25rem 0;
    padding: 0.75rem 1.5rem;
    border: none;
    border-left: 3px solid var(--gw-purple-light);
    text-align: left;
    line-height: 1.5;
}

.groweek-mission-tagline {
    text-align: center !important;
    font-family: 'Instrument Serif', Georgia, serif !important;
    font-size: 1.3rem !important;
    font-weight: 700;
    color: #ffb5f6 !important;
    margin-top: 1.75rem !important;
    letter-spacing: 0.02em;
}

/* ---- Coordinator Cards ---- */
.groweek-coords {
    max-width: 1300px;
    margin: 0 auto 3rem;
    padding: 0 2rem;
}

.groweek-coords-contact-note {
    text-align: center;
}

/* Group photo, all three at a glance, names overlapping the image */
.groweek-coord-group-photo-wrap {
    position: relative;
    max-width: 800px;
    margin: 1.5rem auto 3rem;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 30px rgba(139, 106, 173, 0.15);
}

.groweek-coord-group-photo {
    width: 100%;
    height: auto;
    display: block;
}

.groweek-coord-group-name {
    position: absolute;
    top: 80%;
    transform: translateX(-50%);
    background: rgba(253, 246, 236, 0.9);
    color: var(--gw-purple-dark);
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: 1.15rem;
    padding: 0.3rem 0.9rem;
    border-radius: 999px;
    box-shadow: 0 2px 10px rgba(139, 106, 173, 0.25);
    white-space: nowrap;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.groweek-coord-group-name:hover {
    transform: translateX(-50%) translateY(-3px);
    box-shadow: 0 4px 16px rgba(139, 106, 173, 0.35);
}

/* Full-width bio, photo floated alternating sides */
.groweek-coord-bio {
    padding-top: 2.5rem;
    margin-bottom: 2.5rem;
    border-top: 1px solid rgba(139, 106, 173, 0.15);
    overflow: hidden;
    scroll-margin-top: 90px;
}

.groweek-coord-bio-title {
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: 2.75rem;
    color: var(--gw-purple-dark);
    font-weight: 400;
    margin: 0 0 0.5rem;
}

.groweek-coord-bio-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 0 0 1.25rem;
}

.groweek-coord-bio-badge {
    display: inline-block;
    font-size: 0.8rem;
    color: var(--gw-purple-dark);
    background: var(--gw-cream-warm);
    border: 1.5px solid var(--gw-purple-light);
    padding: 0.25rem 0.85rem;
    border-radius: 999px;
    line-height: 1.3;
}

.groweek-float-img {
    width: 230px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center 45%;
    border-radius: 10px;
    box-shadow: 0 2px 16px rgba(139, 106, 173, 0.15);
}

.groweek-float-left {
    float: left;
    margin: 0 1.25rem 1rem 0;
}

.groweek-float-right {
    float: right;
    margin: 0 0 1rem 1.25rem;
}

.groweek-letter-photo {
    width: 260px;
    aspect-ratio: auto;
    object-position: center;
}

@media (max-width: 640px) {
    .groweek-letter-photo {
        width: 100%;
        max-width: 320px;
    }
}

.groweek-coord-bio-p {
    font-size: 0.95rem;
    line-height: 1.7;
    color: var(--gw-ink);
    margin: 0 0 1rem;
}

.groweek-coord-bio-by {
    display: block;
    font-size: 1.05rem;
    font-style: italic;
    color: var(--gw-purple);
    clear: both;
}

@media (max-width: 768px) {
    .groweek-coord-group-name {
        font-size: 0.75rem;
        padding: 0.2rem 0.6rem;
    }
    .groweek-float-img {
        float: none;
        display: block;
        width: 100%;
        max-width: 260px;
        margin: 0 auto 1.25rem;
    }
}

/* ---- Carousel ---- */
.groweek-carousel-section {
    margin: 0;
}

/* ---- Side-by-side maps (Housing page) ---- */
.groweek-maps-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
    max-width: 900px;
    margin: 0 auto;
}

/* ---- Maps row: map on left, spaces on right ---- */
.groweek-maps-row {
    display: grid;
    grid-template-columns: minmax(280px, 2fr) 3fr;
    gap: 2.5rem;
    align-items: start;
    margin-bottom: 2rem;
}

.groweek-maps-col {
    text-align: center;
}

.groweek-maps-spaces .groweek-expect-grid {
    grid-template-columns: 1fr;
}

.groweek-maps-img {
    width: 100%;
    display: block;
}

.groweek-maps-caption {
    margin-top: 0.75rem;
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: 1.1rem;
    color: var(--gw-purple-dark);
}

.groweek-subsection-title {
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: 1.4rem;
    color: var(--gw-purple-dark);
    font-weight: 400;
    text-align: center;
    margin: 0 0 1.25rem;
}

.groweek-room-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: center;
    max-width: 800px;
    margin: 0 auto;
}

.groweek-room-map-img {
    width: 100%;
    display: block;
}

.groweek-furniture-title {
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: 1.4rem;
    color: var(--gw-purple-dark);
    font-weight: 400;
    text-align: center;
    margin: 0 0 1rem;
}

.groweek-furniture-gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.75rem;
    justify-items: center;
    align-items: end;
    overflow: visible;
}

.groweek-furniture-item {
    overflow: visible;
}

.groweek-furniture-gallery img {
    width: 168px;
    height: 168px;
    object-fit: contain;
    /* transparent — no background, no box, no shadow */
    background: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    display: block;
}

.groweek-furniture-item {
    text-align: center;
}

.groweek-furniture-caption {
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: 0.9rem;
    color: var(--gw-purple-dark);
    margin-top: 0.35rem;
}

/* ---- Space card with watercolor image ---- */
.groweek-space-card {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}

.groweek-space-img {
    width: 120px;
    height: 90px;
    object-fit: cover;
    border-radius: 10px;
    flex-shrink: 0;
    box-shadow: 0 2px 10px rgba(139, 106, 173, 0.1);
    border: 1px solid rgba(139, 106, 173, 0.08);
}

@media (max-width: 768px) {
    .groweek-maps-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    .groweek-room-grid {
        grid-template-columns: 1fr;
    }
    .groweek-space-card {
        flex-direction: column;
    }
    .groweek-space-img {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
    }
}

/* ---- Tab switch (Your Room page) ---- */
.groweek-tab-switch {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    max-width: 1100px;
    margin: 0 auto 1rem;
    padding: 0 2rem;
}

.groweek-tab-btn {
    background: white;
    border: 1px solid rgba(139, 106, 173, 0.2);
    color: var(--gw-ink-soft);
    font-family: 'DM Sans', sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    padding: 0.7rem 1.5rem;
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
    box-shadow: 0 2px 10px rgba(139, 106, 173, 0.06);
}

.groweek-tab-btn:hover {
    color: var(--gw-purple-dark);
}

.groweek-tab-btn-active {
    background: var(--gw-purple);
    border-color: var(--gw-purple);
    color: white;
    box-shadow: 0 4px 16px rgba(139, 106, 173, 0.25);
}

@media (max-width: 480px) {
    .groweek-tab-switch {
        gap: 0.5rem;
    }
    .groweek-tab-btn {
        padding: 0.6rem 1.1rem;
        font-size: 0.85rem;
    }
}

/* ---- Quick Info callout ---- */
.groweek-quickinfo-grid {
    grid-template-columns: 1fr 1fr;
}

/* ---- Contact / Info ---- */
.groweek-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-top: 1.5rem;
}

.groweek-info-card {
    background: white;
    border-radius: 16px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(139, 106, 173, 0.06);
    border: 1px solid rgba(139, 106, 173, 0.1);
}

.groweek-info-card h3 {
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: 1.2rem;
    color: var(--gw-purple-dark);
    margin: 0 0 0.75rem;
    font-weight: 400;
}

.groweek-info-card p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--gw-ink-soft);
    margin: 0;
}

.groweek-info-card a {
    color: var(--gw-purple);
    text-decoration: none;
    font-weight: 500;
}

.groweek-info-card a:hover {
    color: var(--gw-purple-dark);
    text-decoration: underline;
}

.groweek-info-card ul {
    margin: 0;
    padding-left: 1.1rem;
    list-style: disc;
}

.groweek-info-card li {
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--gw-ink-soft);
    margin-bottom: 0.25rem;
}

.groweek-info-card p + p {
    margin-top: 0.9rem;
}

/* ---- Footer Quote ---- */
.groweek-footer-quote {
    text-align: center;
    padding: 3rem 2rem 4rem;
    max-width: 600px;
    margin: 0 auto;
}

.groweek-footer-quote blockquote {
    font-family: 'Instrument Serif', 'Playfair Display', Georgia, serif;
    font-size: clamp(1.1rem, 3vw, 1.5rem);
    font-style: italic;
    color: var(--gw-purple);
    line-height: 1.6;
    margin: 0;
    padding: 0;
    border: none;
}

.groweek-footer-quote cite {
    display: block;
    margin-top: 0.75rem;
    font-size: 0.9rem;
    font-style: normal;
    color: var(--gw-ink-soft);
    font-weight: 500;
}

/* ---- Scroll to Top ---- */
.groweek-scroll-top {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(169, 140, 200, 0.9);
    color: white;
    border: 2px solid rgba(255, 255, 255, 0.4);
    font-size: 1.4rem;
    font-weight: 700;
    cursor: pointer;
    z-index: 9999;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    pointer-events: none;
    box-shadow: 0 4px 16px rgba(139, 106, 173, 0.3);
}

.groweek-scroll-top-visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.groweek-scroll-top:hover {
    background: rgba(139, 106, 173, 1);
    transform: translateY(-2px);
}

/* ---- Top nav bar ---- */
.groweek-topnav {
    position: sticky;
    top: 0;
    z-index: 40;
    width: 100%;
    background: rgba(253, 246, 236, 0.97);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 3px solid transparent;
    border-image: linear-gradient(
        90deg,
        var(--gw-purple-light) 0%,
        var(--gw-pink)         25%,
        var(--gw-orange-light) 50%,
        var(--gw-yellow)       72%,
        var(--gw-green-light)  100%
    ) 1;
    box-shadow: 0 2px 18px rgba(94, 61, 122, 0.10);
}

.groweek-topnav-inner-wrap {
    display: flex;
    align-items: stretch;
    padding: 0 clamp(8px, 2vw, 24px);
    max-width: 1100px;
    margin: 0 auto;
}

.groweek-topnav-arrow {
    display: none;
    background: none;
    border: none;
    color: rgba(94, 61, 122, 0.5);
    font-size: 1.6rem;
    line-height: 1;
    padding: 0 4px;
    cursor: pointer;
    flex-shrink: 0;
    align-self: center;
}

.groweek-topnav-list {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex: 1;
    list-style: none;
    margin: 0;
    padding: 0;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.groweek-topnav-list::-webkit-scrollbar {
    display: none;
}

.groweek-topnav-list li {
    flex-shrink: 0;
}

.groweek-topnav-link {
    display: flex;
    align-items: center;
    padding: 0.8rem 1.1rem;
    color: rgba(94, 74, 110, 0.45);
    text-decoration: none;
    font-family: 'DM Sans', sans-serif;
    font-size: 0.88rem;
    font-weight: 500;
    letter-spacing: 0.015em;
    white-space: nowrap;
    position: relative;
    transition: color 0.5s ease;
}

.groweek-topnav-link:hover {
    color: var(--gw-ink-soft);
}

.groweek-topnav-link-active {
    color: var(--gw-purple-dark);
    font-weight: 700;
}

.groweek-topnav-link::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0.5rem;
    right: 0.5rem;
    height: 3px;
    border-radius: 0 0 3px 3px;
    background: var(--gw-purple);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.groweek-topnav-link-active::before {
    opacity: 1;
}

@media (max-width: 768px) {
    .groweek-topnav-arrow {
        display: block;
    }
    .groweek-topnav-list {
        justify-content: flex-start;
    }
}

/* ---- Responsive ---- */
@media (max-width: 1100px) {
    .groweek-unless-decor {
        display: none;
    }
}

@media (max-width: 768px) {
    .groweek-hero-seuss {
        padding: 1.5rem 1rem 1rem;
    }

    .groweek-hero-row {
        flex-direction: column;
        align-items: center;
        gap: 1rem;
        text-align: center;
    }

    .groweek-hero-illustration .groweek-logo {
        width: 220px;
        max-width: 220px;
    }

    .groweek-hero-quote {
        font-size: 1rem;
        line-height: 1.5;
        margin-bottom: 0.5rem;
        border-left: none;
        padding-left: 0;
        text-align: center;
    }

    .groweek-hero-cite {
        font-size: 0.8rem;
        margin-bottom: 0.75rem;
        padding-left: 0;
        text-align: center;
    }

    .groweek-hero-welcome {
        font-size: 1rem;
        text-align: center;
        margin-bottom: 0;
    }

    .groweek-countdown-wrap {
        padding: 0.75rem 1rem;
        width: calc(100vw - 2rem);
        margin-top: 1rem;
        border-radius: 14px;
    }

    .groweek-countdown-wrap .groweek-countdown-time {
        font-size: 1rem;
    }

    .groweek-section {
        margin-bottom: 2rem;
        padding: 0 1rem;
    }

    .groweek-section-title {
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .groweek-info-grid {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .groweek-info-card {
        padding: 1.25rem;
    }

    .groweek-expect-grid {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .groweek-expect-item {
        padding: 1rem;
    }

    .groweek-mission {
        padding: 1.25rem 1rem;
    }

    .groweek-mission p {
        font-size: 0.95rem;
        line-height: 1.65;
    }

    .groweek-pull-quote {
        font-size: 1rem;
        padding: 0.75rem 1rem;
        margin: 1rem 0;
    }

    .groweek-quickinfo-grid {
        grid-template-columns: 1fr;
    }

    .groweek-decor {
        display: none;
    }
}

@media (max-width: 480px) {
    .groweek-hero-seuss {
        padding: 1rem 0.875rem 0.75rem;
    }

    .groweek-hero-illustration .groweek-logo {
        width: 180px;
        max-width: 180px;
    }

    .groweek-hero-quote {
        font-size: 0.95rem;
    }

    .groweek-section {
        padding: 0 0.875rem;
        margin-bottom: 1.75rem;
    }

    .groweek-expect-item {
        gap: 0.75rem;
    }

    .groweek-expect-icon {
        width: 2rem;
        height: 2rem;
    }

    .groweek-expect-icon i {
        font-size: 1.4rem;
    }
}

/* iOS Safari: background-attachment:fixed causes scroll glitches */
@supports (-webkit-touch-callout: none) {
    .groweek {
        background-attachment: scroll;
    }
}

/* Hide oversized blotches on narrow screens to prevent horizontal overflow */
@media (max-width: 600px) {
    .watercolor-blotch {
        display: none;
    }
}

/* ---- Bottom page navigation (prev/next through the O-Week pages) ---- */
.groweek-pagenav {
    display: flex;
    align-items: stretch;
    gap: 1rem;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto 3.5rem;
    padding: 0 2rem;
    box-sizing: border-box;
}

.groweek-pagenav-link {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    max-width: 46%;
    padding: 0.85rem 1.3rem;
    background: white;
    border: 1px solid rgba(139, 106, 173, 0.15);
    border-radius: 16px;
    box-shadow: 0 2px 12px rgba(139, 106, 173, 0.08);
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.groweek-pagenav-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(139, 106, 173, 0.16);
}

.groweek-pagenav-next {
    margin-left: auto;
}

.groweek-pagenav-spacer {
    flex: 1;
}

.groweek-pagenav-arrow {
    font-size: 1.7rem;
    line-height: 1;
    color: var(--gw-purple);
    flex-shrink: 0;
}

.groweek-pagenav-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.groweek-pagenav-next .groweek-pagenav-text {
    align-items: flex-end;
    text-align: right;
}

.groweek-pagenav-label {
    font-family: 'DM Sans', sans-serif;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--gw-ink-soft);
    font-weight: 600;
}

.groweek-pagenav-name {
    font-family: 'Playfair Display', 'Instrument Serif', Georgia, serif;
    font-style: italic;
    font-size: 1.05rem;
    color: var(--gw-purple-dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

@media (max-width: 640px) {
    .groweek-pagenav {
        padding: 0 1rem;
        margin-bottom: 2.5rem;
        gap: 0.6rem;
    }
    .groweek-pagenav-link {
        max-width: 48%;
        padding: 0.65rem 0.9rem;
        gap: 0.4rem;
    }
    .groweek-pagenav-arrow {
        font-size: 1.4rem;
    }
    .groweek-pagenav-label {
        font-size: 0.62rem;
    }
    .groweek-pagenav-name {
        font-size: 0.88rem;
    }
}

/* ---- O-Week Book: flipbook + jump-to-page rail ---- */
.groweek-book-layout {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
    max-width: 1400px;
    margin: 0 auto;
}

.groweek-book-nav {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 0 0 210px;
    position: sticky;
    top: 5.5rem;
    max-height: calc(100vh - 7rem);
    overflow-y: auto;
    padding-right: 0.25rem;
}

.groweek-book-nav-group {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.groweek-book-nav-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    text-align: left;
    padding: 0.7rem 1rem;
    border-radius: 4px 14px 14px 4px;
    border: none;
    border-left: 4px solid var(--gw-purple-light);
    background: white;
    color: var(--gw-ink-soft);
    font-family: 'DM Sans', sans-serif;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(139, 106, 173, 0.06);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    width: 100%;
}

.groweek-book-nav-btn:hover {
    transform: translateX(3px);
    border-left-color: var(--gw-purple);
    box-shadow: 0 4px 16px rgba(139, 106, 173, 0.12);
    color: var(--gw-purple-dark);
}

.groweek-book-nav-caret {
    flex-shrink: 0;
    color: var(--gw-purple-light);
    font-weight: 700;
}

.groweek-book-nav-sublist {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding-left: 0.85rem;
}

.groweek-book-nav-subbtn {
    text-align: left;
    padding: 0.45rem 0.75rem;
    border-radius: 3px 10px 10px 3px;
    border: none;
    border-left: 2px solid var(--gw-pink-light);
    background: rgba(255, 255, 255, 0.65);
    color: var(--gw-ink-soft);
    font-family: 'DM Sans', sans-serif;
    font-size: 0.78rem;
    font-weight: 400;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.groweek-book-nav-subbtn:hover {
    background: white;
    border-left-color: var(--gw-pink);
    color: var(--gw-purple-dark);
}

/* Mobile "side tab": collapses the nav into an off-canvas drawer opened by a
   small tab fixed to the screen edge, so it doesn't eat vertical space next
   to the book on short phone-landscape viewports. Hidden on desktop. */
.groweek-book-nav-tab {
    display: none;
}

.groweek-book-nav-scrim {
    display: none;
}

.groweek-book-rotate-notice {
    display: none;
}

.groweek-book-download-row {
    display: flex;
    justify-content: center;
    margin: 0 0 1.25rem;
}

.groweek-book-download-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 1.25rem;
    border-radius: 999px;
    background: var(--gw-purple);
    color: white;
    font-family: 'DM Sans', sans-serif;
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    transition: background 0.2s ease;
}

.groweek-book-download-btn:hover {
    background: var(--gw-purple-dark);
}

/* Heyzine renders its own "flipbook-title" chrome (white box, book title) as
   a fixed-position overlay baked into the embedded page - cross-origin, so we
   can't reach in and hide it. Cropping it off the top of the iframe instead:
   the wrap clips to the visible height, the iframe renders taller and shifts
   up by the crop amount so the hidden strip is the title bar, not the book. */
.groweek-book-frame-wrap {
    flex: 1;
    min-width: 0;
    height: 820px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 30px rgba(139, 106, 173, 0.12);
}

.groweek-book-frame {
    width: 100%;
    height: calc(820px + 120px);
    margin-top: -120px;
    border: none;
    display: block;
}

/* Phones in portrait: the book needs spread width, so ask for landscape
   instead of squeezing a two-page spread into a narrow column. */
@media (max-width: 900px) and (orientation: portrait) {
    .groweek-book-layout {
        display: none;
    }
    .groweek-book-rotate-notice {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1rem;
        text-align: center;
        max-width: 420px;
        margin: 1rem auto 2rem;
        padding: 2.5rem 2rem;
        background: white;
        border-radius: 20px;
        box-shadow: 0 4px 30px rgba(139, 106, 173, 0.1);
        border: 1px solid rgba(139, 106, 173, 0.1);
    }
    .groweek-book-rotate-icon {
        font-size: 2.5rem;
    }
    .groweek-book-rotate-notice p {
        font-size: 0.95rem;
        line-height: 1.6;
        color: var(--gw-ink-soft);
        margin: 0;
    }
}

/* Phones in landscape: short viewport, so the nav becomes a slide-out drawer
   (tab on the left edge) instead of a fixed sidebar competing for width. */
@media (max-height: 500px) and (orientation: landscape) {
    .groweek-book-nav-tab {
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 26px;
        height: 60px;
        background: var(--gw-purple);
        color: white;
        border: none;
        border-radius: 0 12px 12px 0;
        font-size: 1.2rem;
        z-index: 60;
        cursor: pointer;
        box-shadow: 2px 0 10px rgba(0, 0, 0, 0.2);
    }
    .groweek-book-nav-scrim {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(61, 47, 74, 0.35);
        z-index: 55;
    }
    .groweek-book-nav {
        position: fixed;
        left: 0;
        top: 0;
        bottom: 0;
        width: 230px;
        max-height: none;
        background: var(--gw-cream);
        padding: 1rem;
        gap: 0.4rem;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        z-index: 56;
        overflow-y: auto;
        box-shadow: 4px 0 20px rgba(0, 0, 0, 0.2);
    }
    .groweek-book-nav-drawer-open {
        transform: translateX(0);
    }
    .groweek-section-title,
    .groweek-topnav {
        display: none;
    }
    .groweek-book-layout .groweek-section,
    .groweek-book-layout {
        margin: 0 auto;
    }
    section.groweek-section {
        padding-top: 0.5rem !important;
        margin-bottom: 0.5rem;
    }
    .groweek-book-frame-wrap {
        /* Measured against the actual chrome above it (site navbar + download
           button, ~136px at this breakpoint) so the whole frame lands inside
           one screen instead of running past the fold. */
        height: calc(100vh - 8.75rem);
    }
    .groweek-book-frame {
        /* Unlike the desktop rule, this viewport is too short to spare 120px
           for hiding Heyzine's title bar - at this scale the bar itself is only
           ~40-50px tall, so a 120px crop was eating into the actual page
           spread instead of just the chrome. Show the title rather than crop. */
        height: calc(100vh - 8.75rem);
        margin-top: 0;
    }
}



/* ---------------- TOP NAVBAR (193:78) ---------------- */

.mc-navbar {
    position: relative;
    z-index: 50;
    width: 100%;
    height: calc(80px * var(--s));
    background: var(--mc-purple-700);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 40px;
    padding: 0 40px 0 30px;
    box-sizing: border-box;
}

.mc-navbar-brand {
    display: flex;
    align-items: center;
    gap: calc(13px * var(--s));
    color: var(--mc-paper);
    text-decoration: none;
}

.mc-navbar-crest {
    width: calc(57px * var(--s));
    height: calc(74px * var(--s));
    object-fit: contain;
    filter: drop-shadow(0 0 calc(18px * var(--s)) rgba(0, 0, 0, 0.25));
}

.mc-navbar-wordmark {
    font-family: var(--mc-font-display);
    font-style: italic;
    font-weight: 400;
    font-size: calc(34px * var(--s));
    line-height: 1;
    color: var(--mc-paper);
    text-shadow: 0 0 calc(17px * var(--s)) rgba(0, 0, 0, 0.35);
    white-space: nowrap;
}

.mc-navbar-links {
    display: flex;
    align-items: center;
    gap: 56px;
    white-space: nowrap;
    margin-left: auto;
}

.mc-navbar-link {
    font-family: var(--mc-font-display);
    font-style: italic;
    font-weight: 400;
    font-size: calc(24px * var(--s));
    line-height: 1;
    letter-spacing: 0.04em;
    color: var(--mc-paper);
    text-decoration: none;
    transition: opacity 180ms ease;
    white-space: nowrap;
}

.mc-navbar-link:hover,
.mc-navbar-link:focus-visible {
    color: var(--mc-paper);
    opacity: 0.75;
}

.mc-navbar-trigger {
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: calc(6px * var(--s));
    font-family: var(--mc-font-display);
    /* font-style: italic; */
    font-weight: 400;
    letter-spacing: 0.04em;
}


.mc-navbar-item {
    position: relative;
    display: flex;
    align-items: center;
}


.mc-navbar-links .mc-navbar-item:last-child .mc-navbar-dropdown {
    left: auto;
    right: 0;
    transform: translateX(0) translateY(-8px) scale(0.96);
}

.mc-navbar-links .mc-navbar-item:last-child .mc-navbar-dropdown-open {
    transform: translateX(0) translateY(0) scale(1);
}

.mc-navbar-links .mc-navbar-item:last-child .mc-navbar-dropdown::after {
    left: auto;
    right: 24px;
    transform: rotate(45deg);
}

.mc-navbar-dropdown {
    position: absolute;
    top: calc(100% + 14px);
    left: 50%;
    transform: translateX(-50%) translateY(-8px) scale(0.96);
    transform-origin: top center;
    min-width: 260px;
    max-width: 360px;
    background: rgba(255, 255, 255, 0.97);
    color: var(--mc-purple-700);
    border-radius: 14px;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.7) inset,
        0 18px 48px -10px rgba(20, 12, 38, 0.32),
        0 4px 12px rgba(20, 12, 38, 0.12);
    backdrop-filter: blur(12px) saturate(140%);
    -webkit-backdrop-filter: blur(12px) saturate(140%);
    padding: 10px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
        opacity 220ms cubic-bezier(0.2, 0.8, 0.2, 1),
        transform 260ms cubic-bezier(0.2, 0.8, 0.2, 1),
        visibility 260ms;
    z-index: 60;
    border: 1px solid rgba(74, 52, 112, 0.08);
}

.mc-navbar-dropdown-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0) scale(1);
}

.mc-navbar-dropdown::after {
    content: '';
    position: absolute;
    top: -7px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    width: 12px;
    height: 12px;
    background: rgba(255, 255, 255, 0.97);
    border-top: 1px solid rgba(74, 52, 112, 0.08);
    border-left: 1px solid rgba(74, 52, 112, 0.08);
}

.mc-navbar-dropdown::before {
    content: '';
    position: absolute;
    inset: -16px -8px 100% -8px;
    background: transparent;
}

.mc-navbar-dropdown-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px 10px 28px;
    font-family: var(--mc-font-body);
    font-size: 0.96rem;
    font-weight: 500;
    color: var(--mc-purple-700);
    text-decoration: none;
    border-radius: 8px;
    transition:
        background 160ms ease,
        color 160ms ease;
    white-space: nowrap;
    position: relative;
}

.mc-navbar-dropdown-link::before {
    content: '\203A';
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translate(-6px, -50%);
    color: var(--mc-purple-500);
    font-size: 1.1em;
    line-height: 1;
    opacity: 0;
    transition: opacity 160ms ease, transform 200ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.mc-navbar-dropdown-link:hover,
.mc-navbar-dropdown-link:focus-visible {
    background: linear-gradient(
        to right,
        rgba(74, 52, 112, 0.10),
        rgba(160, 124, 180, 0.04)
    );
    color: var(--mc-purple-700);
}

.mc-navbar-dropdown-link:hover::before,
.mc-navbar-dropdown-link:focus-visible::before {
    opacity: 1;
    transform: translate(0, -50%);
}

/* ----- Nested submenu ----- */
.mc-navbar-submenu {
    position: relative;
    cursor: default;
}

.mc-navbar-submenu .mc-navbar-submenu-label {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 10px;
}

.mc-navbar-submenu-panel {
    position: absolute;
    top: -4px;
    right: 100%;
    margin-right: 8px;
    min-width: 220px;
    background: var(--mc-paper);
    border: 1px solid rgba(74, 52, 112, 0.18);
    border-radius: 14px;
    box-shadow:
        0 20px 50px -16px rgba(74, 52, 112, 0.32),
        0 4px 12px rgba(20, 12, 38, 0.08);
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    opacity: 0;
    transform: translateX(6px);
    pointer-events: none;
    transition: opacity 180ms ease, transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
    z-index: 1;
}

.mc-navbar-submenu::before {
    content: '';
    position: absolute;
    top: -4px;
    bottom: -4px;
    right: 100%;
    width: 16px;
    background: transparent;
    pointer-events: none;
}

.mc-navbar-submenu:hover::before,
.mc-navbar-submenu:focus-within::before {
    pointer-events: auto;
}

.mc-navbar-submenu:hover .mc-navbar-submenu-panel,
.mc-navbar-submenu:focus-within .mc-navbar-submenu-panel {
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
}

.mc-navbar-submenu-panel:hover {
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
}


/* ---------- Main navbar caret ---------- */

.mc-navbar-caret {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 0.8em;
    height: 0.8em;
}

.mc-navbar-caret::before {
    content: "";
    width: 0;
    height: 0;
    border-left: .28em solid transparent;
    border-right: .28em solid transparent;
    border-top: .34em solid currentColor;
    transition: transform .22s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.mc-navbar-item:hover .mc-navbar-caret::before,
.mc-navbar-caret-open::before {
    transform: rotate(180deg);
}

/* ---------- Nested submenu caret ---------- */

.mc-navbar-submenu-caret {
    display: inline-flex;
    width: .75em;
    height: .75em;
    align-items: center;
    justify-content: center;
}

.mc-navbar-submenu-caret::before {
    content: "";
    width: .4em;
    height: .4em;
    border-top: 2px solid var(--mc-purple-500);
    border-left: 2px solid var(--mc-purple-500);
    transform: rotate(-135deg);
    transition: transform .2s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.mc-navbar-submenu:hover .mc-navbar-submenu-caret::before,
.mc-navbar-submenu:focus-within .mc-navbar-submenu-caret::before {
    transform: rotate(-45deg);
}

/* ---------- Mobile drawer caret ---------- */

.mc-mobile-drawer-caret {
    display: inline-flex;
    width: 1em;
    height: 1em;
    align-items: center;
    justify-content: center;
}

.mc-mobile-drawer-caret::before {
    content: "";
    width: 0;
    height: 0;
    border-left: .3em solid transparent;
    border-right: .3em solid transparent;
    border-top: .38em solid rgba(255,255,255,.75);
    transition: transform .22s cubic-bezier(.2,.8,.2,1);
}

.mc-mobile-drawer-caret-open::before {
    transform: rotate(180deg);
}

/* ---------- Drawer close button ---------- */

.mc-mobile-drawer-close {
    position: relative;
    align-self: flex-end;
    width: 40px;
    height: 40px;
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 0;
    margin-bottom: 24px;
}

.mc-mobile-drawer-close::before,
.mc-mobile-drawer-close::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 24px;
    height: 2px;
    background: var(--mc-paper);
    border-radius: 2px;
}

.mc-mobile-drawer-close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.mc-mobile-drawer-close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

/* ----- Mobile drawer ----- */
.mc-mobile-drawer-subsection {
    font-family: var(--mc-font-body);
    font-weight: 700;
    font-size: 0.74rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mc-purple-500);
    padding: 14px 16px 6px;
    margin-top: 4px;
}

.mc-mobile-drawer-sublink-nested {
    padding-left: 32px !important;
}

.mc-navbar-brand:hover,
.mc-mobile-drawer-link:hover,
.mc-mobile-drawer-link:focus-visible {
    color: var(--mc-paper);
}

/* ---------------- MOBILE HAMBURGER + DRAWER ---------------- */

.mc-navbar-hamburger {
    display: none;
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 8px;
    flex-direction: column;
    gap: 5px;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    margin-left: auto;
}

.mc-hamburger-line {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--mc-paper);
    border-radius: 2px;
}

.mc-mobile-scrim {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    visibility: hidden;
    transition: opacity 220ms ease, visibility 220ms ease;
    z-index: 90;
}

.mc-mobile-scrim-open {
    opacity: 1;
    visibility: visible;
}

/* The off-canvas drawer parks beyond the right edge via translateX(100%);
 * Chromium still counts it toward the document's horizontal scroll range,
 * so clip the viewport's x-axis (body overflow propagates to the viewport,
 * so this doesn't create an inner scroll container). */
body {
    overflow-x: hidden;
}

.mc-mobile-drawer {
    position: fixed;
    top: 0;
    right: 0;
    width: min(82vw, 320px);
    height: 100vh;
    background: var(--mc-purple-700);
    color: var(--mc-paper);
    display: flex;
    flex-direction: column;
    padding: 28px 24px;
    overflow-y: auto;
    transform: translateX(100%);
    transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 100;
    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.25);
}

.mc-mobile-drawer-open {
    transform: translateX(0);
}

.mc-mobile-drawer-links {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.mc-mobile-drawer-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 10px 4px;
    font-family: var(--mc-font-display);
    font-style: italic;
    font-size: 1.2rem;
    color: var(--mc-paper);
    text-decoration: none;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    background: transparent;
    box-shadow: none;
    cursor: pointer;
    text-align: left;
    transition: padding-left 180ms ease, background 180ms ease;
    box-sizing: border-box;
}

.mc-mobile-drawer-link:hover,
.mc-mobile-drawer-link:focus,
.mc-mobile-drawer-link:focus-visible {
    padding-left: 12px;
    background: rgba(255, 255, 255, 0.06);
    color: var(--mc-paper);
}

.mc-mobile-drawer-trigger {
    font-family: var(--mc-font-display);
    font-style: italic;
}

.mc-mobile-drawer-sublinks {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition:
        grid-template-rows 320ms cubic-bezier(0.2, 0.8, 0.2, 1),
        opacity 240ms ease,
        border-color 320ms ease;
    border-bottom: 1px solid rgba(255, 255, 255, 0);
}

.mc-mobile-drawer-sublinks-inner {
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 0 0 0 18px;
}

.mc-mobile-drawer-sublinks-open {
    grid-template-rows: 1fr;
    opacity: 1;
    border-bottom-color: rgba(255, 255, 255, 0.15);
}

.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublinks-inner {
    padding: 4px 0 12px 18px;
}

.mc-mobile-drawer-sublink {
    display: block;
    padding: 10px 4px;
    font-family: var(--mc-font-body);
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    transition: padding-left 180ms ease, color 180ms ease, transform 200ms ease;
    transform: translateX(-6px);
    opacity: 0;
}

.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink {
    transform: translateX(0);
    opacity: 1;
    transition:
        padding-left 180ms ease,
        color 180ms ease,
        transform 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
        opacity 280ms ease;
}

.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(1)  { transition-delay: 40ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(2)  { transition-delay: 80ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(3)  { transition-delay: 120ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(4)  { transition-delay: 160ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(5)  { transition-delay: 180ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(6)  { transition-delay: 200ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(7)  { transition-delay: 220ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(8)  { transition-delay: 240ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(9)  { transition-delay: 260ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(10) { transition-delay: 280ms; }
.mc-mobile-drawer-sublinks-open .mc-mobile-drawer-sublink:nth-child(11) { transition-delay: 300ms; }

.mc-mobile-drawer-sublink:hover,
.mc-mobile-drawer-sublink:focus-visible {
    padding-left: 10px;
    color: var(--mc-paper);
}

.mc-mobile-drawer-section {
    display: flex;
    flex-direction: column;
}

@media (max-width: 1100px) {
    .mc-navbar {
        height: 64px;
        padding: 0 20px;
        gap: 20px;
    }
    .mc-navbar-crest {
        width: 36px;
        height: 46px;
    }
    .mc-navbar-wordmark {
        font-size: 1.25rem;
    }
    .mc-navbar-links {
        gap: 36px;
    }
    .mc-navbar-link {
        font-size: 1rem;
    }
}

@media (max-width: 900px) {
    .mc-navbar {
        padding: 0 16px;
    }
    .mc-navbar-wordmark {
        font-size: 1.05rem;
    }
    .mc-navbar-links {
        display: none;
    }
    .mc-navbar-hamburger {
        display: flex;
    }
}



/* 1767x378 purple block, wordmark + contact + faded yurt silhouette */

.mc-footer {
    position: relative;
    width: 100%;
    height: calc(378px * var(--s));
    background: var(--mc-purple-700);
    overflow: hidden;
    isolation: isolate;
}

.mc-footer-silhouette {
    position: absolute;
    top: calc(82px * var(--s));
    left: calc(311px * var(--s));
    width: calc(1143px * var(--s));
    height: calc(336px * var(--s));
    opacity: 0.2;
    pointer-events: none;
    z-index: 0;
}

.mc-footer-wordmark {
    position: absolute;
    top: calc(93px * var(--s));
    left: calc(94px * var(--s));
    width: calc(465px * var(--s));
    color: var(--mc-paper-warm);
    font-family: var(--mc-font-display);
    font-style: italic;
    font-weight: 400;
    font-size: calc(122.382px * var(--s));
    line-height: 0.6822;
    display: flex;
    flex-direction: column;
    gap: 0;
    z-index: 2;
}

.mc-footer-wordmark span {
    display: block;
}

.mc-footer-contact {
    position: absolute;
    top: calc(94px * var(--s));
    left: calc(1291px * var(--s));
    width: calc(393px * var(--s));
    font-family: var(--mc-font-body);
    font-style: normal;
    font-weight: 400;
    font-size: calc(20px * var(--s));
    line-height: 2.81;
    color: var(--mc-paper);
    z-index: 2;
}

.mc-footer-contact p {
    margin: 0;
    color: var(--mc-paper);
}

.mc-footer-contact a {
    color: var(--mc-paper);
    text-decoration: none;
}

.mc-footer-contact a:hover,
.mc-footer-contact a:focus-visible {
    color: var(--mc-paper);
    text-decoration: underline;
}

.mc-footer-row {
    display: flex;
    align-items: center;
    gap: calc(20px * var(--s));
}

.mc-footer-icon {
    display: inline-flex;
    width: calc(24px * var(--s));
    height: calc(24px * var(--s));
    align-items: center;
    justify-content: center;
    font-size: calc(20px * var(--s));
}

@media (max-width: 1024px) {
    .mc-footer {
        height: auto;
        padding: 36px 24px;
    }
    .mc-footer-silhouette {
        opacity: 0.08;
        top: auto;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 90%;
        height: auto;
    }
    .mc-footer-wordmark {
        /* z-index only applies to positioned elements - static would drop
           this behind the absolutely-positioned background layers (e.g. the
           O-Week tree panorama), so keep it positioned via `relative`, and
           reset the desktop rule's top/left offsets (inert under `static`,
           but relative would otherwise apply them as real offsets). */
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        font-size: clamp(2.5rem, 10vw, 4.5rem);
        line-height: 0.85;
        margin-bottom: 24px;
    }
    .mc-footer-contact {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        line-height: 1.7;
        font-size: 0.95rem;
    }
    .mc-footer-icon {
        width: 22px;
        height: 22px;
        font-size: 18px;
    }
}

@media (max-width: 640px) {
    .mc-footer {
        padding: 28px 18px;
    }
    .mc-footer-wordmark {
        font-size: clamp(2.25rem, 13vw, 3.4rem);
        margin-bottom: 18px;
    }
    .mc-footer-contact {
        font-size: 0.9rem;
        line-height: 1.7;
    }
}