/* ==================================================
   Design tokens
   ================================================== */

:root {
    --cream: #fff8dd;
    --cream-soft: #f4edcf;
    --green-dark: #102817;
    --green-ink: #17321d;
    --green-button: #2f5631;
    --gold-light: #fff7c9;
}

/* ==================================================
   Base / WordPress resets
   ================================================== */

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

#content {
    padding: 0;
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: #142516;
}

/* Hide WP comments */
#comments {
    display: none;
}

/* ==================================================
   Hero
   ================================================== */

.wriwoods-hero {
    position: relative;
    height: 100vh;
    min-height: 760px;
    overflow: hidden;
    color: var(--cream);
    isolation: isolate;
}

.wriwoods-hero__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.04);
    transform-origin: 50% 48%;
    transition: transform 8s cubic-bezier(.16,1,.3,1);
    z-index: 0;
    will-change: transform;
}

/* Hero overlays */

.wriwoods-overlay-horizontal,
.wriwoods-overlay-vertical,
.wriwoods-overlay-ground {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}

.wriwoods-overlay-horizontal {
    background: linear-gradient(
    to right,
    rgba(8, 22, 12, 0.56),
    rgba(8, 22, 12, 0.18) 24%,
    rgba(8, 22, 12, 0.08) 50%,
    rgba(8, 22, 12, 0.26) 76%,
    rgba(8, 22, 12, 0.62)
    );
}

.wriwoods-overlay-vertical {
    background: linear-gradient(
    to bottom,
    rgba(8, 22, 12, 0.26),
    rgba(8, 22, 12, 0.02) 28%,
    rgba(8, 22, 12, 0.26)
    );
}

.wriwoods-overlay-ground {
    top: auto;
    height: 34%;
    background: linear-gradient(to top, rgba(10, 24, 12, 0.72), rgba(10, 24, 12, 0));
}

/* Hero atmosphere */

.wriwoods-atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 2;
}

.wriwoods-atmosphere::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
    circle at 50% 42%,
    rgba(255, 246, 205, 0.18) 0%,
    rgba(255, 246, 205, 0.05) 28%,
    rgba(18, 45, 22, 0.42) 100%
    );
}

.wriwoods-glow {
    position: absolute;
    left: 50%;
    top: 19%;
    width: 52rem;
    height: 34rem;
    transform: translateX(-50%);
    border-radius: 999px;
    background: rgba(255, 243, 186, 0.18);
    filter: blur(60px);
    animation: glow-pulse 7s ease-in-out infinite;
}

.wriwoods-dust {
    position: absolute;
    border-radius: 999px;
    background: var(--gold-light);
    box-shadow: 0 0 16px rgba(255, 247, 201, 0.75);
    animation: dust-float var(--duration) ease-in-out infinite;
    animation-delay: var(--delay);
    opacity: 0;
}

.wriwoods-leaf {
    position: absolute;
    width: 28px;
    height: 28px;
    color: rgba(243, 239, 207, 0.78);
    filter: drop-shadow(0 0 10px rgba(255, 248, 212, 0.35));
    animation: leaf-drift var(--duration) linear infinite;
    animation-delay: var(--delay);
    opacity: 0;
}

.wriwoods-leaf svg {
    width: 100%;
    height: 100%;
}

/* Hero navigation */

.wriwoods-return-link {
    position: absolute;
    right: 3rem;
    top: 2.5rem;
    z-index: 5;
    color: rgba(247,240,216,.92);
    font-family: Georgia, serif;
    font-size: 1.02rem;
    font-style: italic;
    letter-spacing: .01em;
    text-decoration: none;
    text-shadow: 0 2px 14px rgba(0,0,0,.62),
    0 0 18px rgba(255,244,194,.12);
    transition: opacity 4s ease,
    color .35s ease,
    transform .35s ease,
    text-shadow .35s ease;
}

.wriwoods-return-link:hover {
    color: rgba(255,248,221,1);
    transform: translateX(3px);
    text-shadow: 0 2px 14px rgba(0,0,0,.65),
    0 0 24px rgba(255,244,194,.28);
}

.wriwoods-hero--approaching .wriwoods-return-link {
    opacity: 0;
}

/* Hero logo */

.wriwoods-logo {
    position: absolute;
    left: 3rem;
    top: 2.25rem;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #f7f0d8;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
    animation: fade-down 0.9s ease both;
    transition: opacity 5.8s ease;
}

.wriwoods-logo__badge {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: rgba(18, 48, 25, 0.55);
    backdrop-filter: blur(8px);
    box-shadow: 0 8px 24px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.08);
    overflow: hidden;
}

.wriwoods-logo__badge img {
    width: 72%;
    height: 72%;
    object-fit: contain;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,.22));
}

.wriwoods-logo__text {
    font-family: Georgia, serif;
    font-size: 1.5rem;
    font-style: italic;
    line-height: 0.84;
    letter-spacing: -0.02em;
}

/* Hero content panel */

.wriwoods-hero__content {
    position: relative;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 0 1.5rem;
    text-align: center;
}

.wriwoods-hero__panel {
    max-width: 56rem;
    padding: 2.5rem 3.5rem;
    border-radius: 3rem;
    background: radial-gradient(circle at 50% 34%, rgba(255,248,221,.13), transparent 58%),
    linear-gradient(to bottom, rgba(255,248,221,.045), rgba(16,40,23,.18)),
    rgba(16, 40, 23, 0.16);
    box-shadow: 0 34px 120px rgba(0, 0, 0, 0.26),
    inset 0 1px 0 rgba(255,248,221,.08),
    inset 0 -28px 70px rgba(8,22,12,.16);
    backdrop-filter: blur(3px) saturate(1.05);
    -webkit-backdrop-filter: blur(3px) saturate(1.05);
    transition: background 4.5s ease,
    box-shadow 4.5s ease,
    backdrop-filter 4.5s ease,
    -webkit-backdrop-filter 4.5s ease,
    transform 5.5s cubic-bezier(.16,1,.3,1),
    opacity 3s ease;
    animation: rise-in 1.1s ease both;
    animation-delay: 0.25s;
}

.wriwoods-hero__panel > *:not(.wriwoods-actions) {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 5.8s ease,
    transform 6.8s cubic-bezier(.16,1,.3,1);
}

.wriwoods-eyebrow {
    margin: 0 0 1.25rem;
    font-family: Georgia, serif;
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-style: italic;
    color: #f1e8c7;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

.wriwoods-title {
    margin: 0;
    font-family: Georgia, serif;
    font-size: clamp(2.6rem, 5.5vw, 4.8rem);
    line-height: 0.95;
    letter-spacing: -0.04em;
    color: #fff7dc;
    text-shadow: 0 4px 24px rgba(0, 0, 0, 0.45);
}

.wriwoods-title span.title {
    letter-spacing: 0.0em;
}

.wriwoods-body {
    max-width: 42rem;
    margin: 2rem auto 0;
    font-size: clamp(1.15rem, 2vw, 1.5rem);
    line-height: 1.55;
    color: var(--cream-soft);
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

.wriwoods-actions {
    display: flex;
    justify-content: center;
    margin-top: 3rem;
}

/* Hero entry path */

.wriwoods-entry-wrap {
    position: relative;
    margin-top: 3.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.wriwoods-entry-zone {
    position: absolute;
    left: 50%;
    top: -150px;
    width: 560px;
    height: 560px;
    transform: translateX(-50%);
    z-index: 3;
    cursor: pointer;
    background: transparent;
}

.wriwoods-entry-path {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    border: 0;
    background: none;
    padding: 0;
    color: #fff6d6;
    cursor: pointer;
    font-family: Georgia, serif;
    font-size: 1.6rem;
    font-style: italic;
    letter-spacing: -.02em;
    text-shadow: 0 2px 14px rgba(0,0,0,.45);
    transition: transform 6.5s cubic-bezier(.16,1,.3,1), opacity 5.8s ease;
    z-index: 4;
    pointer-events: none;
}

.wriwoods-entry-label {
    position: relative;
}

.wriwoods-entry-label::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 100%;
    height: 1px;
    background: linear-gradient(to right, rgba(255,246,214,.1), rgba(255,246,214,.85), rgba(255,246,214,.1));
    transform: scaleX(.6);
    transform-origin: center;
    opacity: .7;
    transition: transform 5.8s cubic-bezier(.16,1,.3,1), opacity 5.8s ease;
}

.wriwoods-entry-arrow {
    opacity: .7;
    transition: transform 5.8s cubic-bezier(.16,1,.3,1), opacity 5.8s ease;
}

.wriwoods-entry-trail {
    position: absolute;
    left: 50%;
    top: -140px;
    width: 520px;
    height: 520px;
    transform: translateX(-50%);
    pointer-events: none;
    overflow: visible;
    opacity: .22;
    transition: opacity 7.5s ease, transform 8s cubic-bezier(.16,1,.3,1);
}

.wriwoods-entry-trail::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 100%;
    height: 100%;
    transform: translateX(-50%);
    background: radial-gradient(ellipse at center, rgba(255,232,164,.34), rgba(255,232,164,0) 72%);
    filter: blur(24px);
}

.wriwoods-entry-particle {
    position: absolute;
    bottom: 0;
    width: 4px;
    height: 4px;
    border-radius: 999px;
    background: rgba(255,244,204,.95);
    box-shadow: 0 0 14px rgba(255,236,170,.8);
    opacity: 0;
    animation: trail-flow linear infinite;
    animation-duration: var(--duration);
    animation-delay: var(--delay);
    will-change: transform, opacity;
}

.wriwoods-entry-wrap:hover .wriwoods-entry-path {
    transform: translateY(-2px);
}

.wriwoods-hero--approaching .wriwoods-entry-wrap:hover .wriwoods-entry-path {
    transform: translateY(-72px) scale(1.08);
}

.wriwoods-entry-wrap:hover .wriwoods-entry-label::after {
    transform: scaleX(1);
    opacity: 1;
}

.wriwoods-entry-wrap:hover .wriwoods-entry-arrow {
    transform: translateX(6px);
    opacity: 1;
}

.wriwoods-entry-wrap:hover .wriwoods-entry-trail {
    opacity: .72;
    transform: translateX(-50%) scale(1.03);
}

.wriwoods-entry-wrap:hover ~ .wriwoods-scroll-note {
    opacity: 0;
}

.wriwoods-entry-wrap:hover ~ * {
    transition: opacity 1.2s ease;
}

/* Hero approach state */

.wriwoods-hero--approaching .wriwoods-hero__image {
    transform: scale(1.24) translateY(3.5%) translateX(.8%);
}

.wriwoods-hero--approaching .wriwoods-hero__panel > *:not(.wriwoods-actions) {
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 2.4s ease,
    transform 2.4s ease;
}

.wriwoods-hero--approaching .wriwoods-logo,
.wriwoods-hero--approaching .wriwoods-scroll-note {
    opacity: 0;
    transition: opacity 2s ease;
}

.wriwoods-hero--approaching .wriwoods-entry-path {
    transform: translateY(-72px) scale(1.08);
    transition: transform 5s cubic-bezier(.16,1,.3,1);
}

.wriwoods-hero--approaching .wriwoods-entry-label {
    text-shadow: 0 0 34px rgba(255,244,194,.44),
    0 0 12px rgba(255,244,194,.26),
    0 2px 14px rgba(0,0,0,.45);
    transition: text-shadow 3.5s ease;
}

.wriwoods-hero--approaching .wriwoods-entry-label::after {
    transform: scaleX(1.35);
    opacity: 1;
    transition: transform 3.5s cubic-bezier(.16,1,.3,1), opacity 2s ease;
}

.wriwoods-hero--approaching .wriwoods-entry-arrow {
    transform: translateX(12px);
    opacity: 1;
    transition: transform 4s cubic-bezier(.16,1,.3,1), opacity 2s ease;
}

.wriwoods-hero--approaching .wriwoods-entry-trail {
    opacity: .95;
    transform: translateX(-50%) scale(1.12);
    transition: opacity 4s ease,
    transform 6s cubic-bezier(.16,1,.3,1);
}

.wriwoods-hero--approaching .wriwoods-hero__panel {
    background: radial-gradient(circle at 50% 34%, rgba(255,248,221,.07), transparent 64%),
    linear-gradient(to bottom, rgba(255,248,221,.018), rgba(16,40,23,.07)),
    rgba(16,40,23,.055);
    box-shadow: 0 42px 140px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,248,221,.035);
    backdrop-filter: blur(1.5px) saturate(1.02);
    -webkit-backdrop-filter: blur(1.5px) saturate(1.02);
    transform: translateY(-8px) scale(1.01);
}

/* Distant light */

.wriwoods-distant-light {
    position: absolute;
    left: 50%;
    top: 58%;
    width: 120px;
    height: 120px;
    transform: translateX(-50%);
    border-radius: 999px;
    background: radial-gradient(circle at center,
    rgba(255,252,232,.98) 0%,
    rgba(255,246,204,.92) 10%,
    rgba(255,244,194,.55) 24%,
    rgba(255,244,194,.18) 46%,
    rgba(255,244,194,0) 74%);
    box-shadow: 0 0 22px rgba(255,250,225,.45),
    0 0 80px rgba(255,236,170,.18);
    filter: blur(16px);
    opacity: 0;
    transition: opacity 4.5s ease,
    transform 6s cubic-bezier(.16,1,.3,1),
    width 6s ease,
    height 6s ease;
    pointer-events: none;
}

.wriwoods-hero--approaching .wriwoods-distant-light {
    opacity: .95;
    width: 320px;
    height: 320px;
    transform: translateX(-50%) translateY(-36px);
}

/* Hero entering state */

.wriwoods-hero--entering .wriwoods-hero__image {
    transition: transform 2.4s ease;
    transform: scale(1.28) translateY(4%) translateX(1%);
}

.wriwoods-hero--entering .wriwoods-hero__panel,
.wriwoods-hero--entering .wriwoods-logo,
.wriwoods-hero--entering .wriwoods-scroll-note {
    transition: opacity 1.2s ease, transform 1.8s ease;
    opacity: 0;
    transform: translateY(20px);
}

/* Buttons */

.wriwoods-button {
    border: 0;
    border-radius: 999px;
    padding: 1rem 2.25rem;
    font: inherit;
    font-size: 1.1rem;
    font-weight: 700;
    cursor: pointer;
    transition: transform 0.25s ease, background 0.25s ease;
}

.wriwoods-button:hover {
    transform: translateY(-4px);
}

.wriwoods-button--primary {
    background: #f5ebc8;
    color: var(--green-ink);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.28);
}

.wriwoods-button--primary:hover {
    background: #fff4cf;
}

.wriwoods-button--secondary {
    border: 1px solid rgba(255, 244, 207, 0.65);
    background: rgba(23, 50, 29, 0.38);
    color: #fff4cf;
    backdrop-filter: blur(8px);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18);
}

.wriwoods-button--secondary:hover {
    background: rgba(23, 50, 29, 0.52);
}

/* Scroll cue */

.wriwoods-scroll-note {
    position: absolute;
    left: 50%;
    bottom: 2rem;
    z-index: 5;
    transform: translateX(-50%);
    font-family: Georgia, serif;
    font-size: 0.95rem;
    font-style: italic;
    color: var(--cream-soft);
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
    animation: scroll-note 2.4s ease-in-out infinite;
    transition: opacity 5.8s ease;
}

/* ==================================================
   Animations
   ================================================== */

@keyframes image-breathe {
    from {
        transform: scale(1.06);
    }

    to {
        transform: scale(1.02);
    }

}

@keyframes glow-pulse {
    0%, 100% {
        opacity: 0.7;
        transform: translateX(-50%) scale(1);
    }

    50% {
        opacity: 1;
        transform: translateX(-50%) scale(1.08);
    }

}

@keyframes dust-float {
    0%, 100% {
        transform: translate(0, 0);
        opacity: 0.05;
    }

    35% {
        opacity: 0.65;
    }

    55% {
        transform: translate(12px, -28px);
        opacity: 0.18;
    }

    75% {
        transform: translate(-8px, 4px);
    }

}

@keyframes leaf-drift {
    0% {
        transform: translate(0, 0) rotate(var(--rotate)) scale(var(--scale));
        opacity: 0;
    }

    14% {
        opacity: 0.8;
    }

    55% {
        opacity: 0.5;
    }

    100% {
        transform: translate(70px, 760px) rotate(calc(var(--rotate) + 260deg)) scale(var(--scale));
        opacity: 0;
    }

}

@keyframes fade-down {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}

@keyframes rise-in {
    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}

@keyframes scroll-note {
    0%, 100% {
        transform: translate(-50%, 0);
        opacity: 0.5;
    }

    50% {
        transform: translate(-50%, 8px);
        opacity: 0.95;
    }

}

@keyframes trail-flow {
    0% {
        transform: translate(0, 0) scale(.35);
        opacity: 0;
    }

    12% {
        opacity: .95;
    }

    72% {
        opacity: .7;
    }

    100% {
        transform: translate(var(--drift-x), -520px) scale(1.15);
        opacity: 0;
    }

}

@keyframes spring-float {
    0% {
        transform: translate(0, 40px) scale(.7);
        opacity: 0;
    }

    20% {
        opacity: .85;
    }

    100% {
        transform: translate(40px, -220px) scale(1);
        opacity: 0;
    }

}

@keyframes summer-firefly {
    0%, 100% {
        transform: translate(0, 0) scale(.8);
        opacity: .15;
    }

    50% {
        transform: translate(12px, -18px) scale(1.2);
        opacity: 1;
    }

}

@keyframes autumn-leaf {
    0% {
        transform: translate(0, -20px) rotate(0deg);
        opacity: 0;
    }

    15% {
        opacity: .9;
    }

    100% {
        transform: translate(60px, 240px) rotate(260deg);
        opacity: 0;
    }

}

@keyframes winter-snow {
    0% {
        transform: translate(0, -20px);
        opacity: 0;
    }

    15% {
        opacity: .75;
    }

    100% {
        transform: translate(18px, 260px);
        opacity: 0;
    }

}

/* ==================================================
   Below-hero page sections
   ================================================== */

.wriwoods-below {
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at 15% 8%, rgba(255,244,194,.13), transparent 28rem),
    radial-gradient(circle at 88% 24%, rgba(150,190,125,.14), transparent 30rem),
    linear-gradient(to bottom, #142516 0%, #182e1b 36%, #102216 100%);
    color: var(--cream-soft);
}

.wriwoods-below::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 80px 80px;
    mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
    pointer-events: none;
}

.wriwoods-below::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 2px;
    height: 100%;
    transform: translateX(-50%);
    background: linear-gradient(to bottom, rgba(255,244,194,.34), rgba(255,244,194,.08) 20%, rgba(255,244,194,.14) 60%, transparent);
    opacity: .45;
    pointer-events: none;
}

.wriwoods-section {
    position: relative;
    z-index: 1;
    padding: 8rem 1.5rem;
}

.wriwoods-section__inner {
    max-width: 1180px;
    margin: 0 auto;
}

.wriwoods-section__inner--narrow {
    max-width: 820px;
    text-align: center;
}

.wriwoods-clearing {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: 5rem;
    align-items: center;
}

.wriwoods-clearing__copy {
    position: relative;
    padding: 3rem;
    border-radius: 3rem;
    background: rgba(255,248,221,.055);
    border: 1px solid rgba(255,248,221,.08);
    box-shadow: 0 40px 120px rgba(0,0,0,.18);
    backdrop-filter: blur(8px);
}

.wriwoods-clearing__copy::before {
    content: "";
    position: absolute;
    inset: -5rem;
    background: radial-gradient(circle, rgba(255,244,194,.10), transparent 62%);
    z-index: -1;
}

.wriwoods-kicker {
    margin: 0 0 1rem;
    font-family: Georgia, serif;
    font-style: italic;
    color: rgba(255,244,214,.68);
}

.wriwoods-section-title {
    margin: 0;
    font-family: Georgia, serif;
    font-size: clamp(2.7rem, 5vw, 5rem);
    line-height: .96;
    letter-spacing: -.045em;
    color: #fff8df;
    text-shadow: 0 3px 24px rgba(0,0,0,.24);
}

.wriwoods-section-text {
    margin: 1.75rem 0 0;
    font-size: 1.17rem;
    line-height: 1.9;
    color: rgba(244,237,207,.82);
}

/* Trail notes */

.wriwoods-trail-notes--featured {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}

.wriwoods-trail-notes-more {
    margin-top: 4rem;
    columns: 3 260px;
    column-gap: 1.5rem;
}

.wriwoods-trail-notes-more .wriwoods-note {
    break-inside: avoid;
    margin: 0 0 1.5rem;
}

.wriwoods-note {
    break-inside: avoid;
    display: inline-block;
    width: 100%;
    margin: 0 0 1.5rem;
    padding: 1.4rem;
    border-radius: 1.6rem;
    background: rgba(255,250,230,.88);
    color: #20321f;
    box-shadow: 0 28px 80px rgba(0,0,0,.24);
    transform: rotate(var(--rotate, 0deg));
}

.wriwoods-note:nth-child(6n+1) {
    --rotate: -2deg;
}

.wriwoods-note:nth-child(6n+2) {
    --rotate: 1.3deg;
}

.wriwoods-note:nth-child(6n+3) {
    --rotate: -0.7deg;
}

.wriwoods-note:nth-child(6n+4) {
    --rotate: 2deg;
}

.wriwoods-note:nth-child(6n+5) {
    --rotate: -1.4deg;
}

.wriwoods-note:nth-child(6n+6) {
    --rotate: 0.8deg;
}

/* ==================================================
   Responsive adjustments
   ================================================== */

@media (max-width: 900px) {
    .wriwoods-trail-notes {
        column-count: 2;
    }

}

@media (max-width: 600px) {
    .wriwoods-trail-notes {
        column-count: 1;
    }

}

.wriwoods-note::before {
    content: "";
    position: absolute;
    top: -.55rem;
    left: 2rem;
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 999px;
    background: rgba(92,123,76,.75);
    box-shadow: inset 0 2px 4px rgba(0,0,0,.18);
}

.wriwoods-note__name {
    margin: 0;
    font-family: Georgia, serif;
    font-size: 1.08rem;
    font-style: italic;
    font-weight: 600;
    color: rgba(23,50,29,.92);
}

.wriwoods-note__header {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin: 0 0 .65rem;
}

.wriwoods-note__avatar {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    object-fit: cover;
    filter: saturate(.82) contrast(.95);
    opacity: .88;
    box-shadow: 0 2px 8px rgba(0,0,0,.18),
    0 0 0 2px rgba(92,123,76,.18);
}

.wriwoods-note__actions {
    margin: .9rem 0 0;
    font-size: .85rem;
}

.wriwoods-note__actions a {
    color: rgba(23,50,29,.48);
    text-decoration: none;
    font-style: italic;
}

.wriwoods-note__actions a:hover {
    color: rgba(23,50,29,.82);
}

.wriwoods-note p:last-child {
    margin: 0;
    line-height: 1.65;
    color: rgba(32,50,31,.82);
}

/* Path signs */

.wriwoods-path-signs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.4rem;
    margin-top: 4rem;
}

.wriwoods-sign {
    position: relative;
    min-height: 260px;
    padding: 2rem;
    border-radius: 2.4rem;
    background: radial-gradient(circle at 30% 0%, rgba(255,244,194,.11), transparent 56%),
    rgba(255,255,255,.035);
    border: 1px solid rgba(255,248,221,.08);
    box-shadow: 0 24px 80px rgba(0,0,0,.18);
    overflow: hidden;
}

.wriwoods-sign::after {
    content: "";
    position: absolute;
    right: -4rem;
    bottom: -5rem;
    width: 12rem;
    height: 12rem;
    border-radius: 999px;
    background: rgba(142,177,114,.11);
    filter: blur(24px);
}

.wriwoods-sign__marker {
    width: 3.5rem;
    height: 1px;

    margin-bottom: 1.75rem;

    background:
        linear-gradient(
            to right,
            rgba(255,248,221,0),
            rgba(255,248,221,.22),
            rgba(255,248,221,0)
        );

    opacity: .9;
}

.wriwoods-sign h3 {
    margin: 0;
    font-family: Georgia, serif;
    font-size: 1.75rem;
    color: #fff8df;
    letter-spacing: -.025em;
}

.wriwoods-sign p {
    margin: 1rem 0 0;
    line-height: 1.75;
    color: rgba(244,237,207,.76);
}

/* Seasons panel */

.wriwoods-season-panel {
    position: relative;
    overflow: hidden;
    border-radius: 3.4rem;
    padding: 4rem;
    background: radial-gradient(circle at 18% 20%, rgba(255,244,194,.15), transparent 23rem),
    radial-gradient(circle at 80% 22%, rgba(168,197,138,.14), transparent 24rem),
    rgba(255,255,255,.035);
    border: 1px solid rgba(255,248,221,.08);
    box-shadow: 0 40px 120px rgba(0,0,0,.22);
    text-align: center;
}

.wriwoods-season-color {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity 2.2s ease;
}

.wriwoods-season-color--spring {
    background: radial-gradient(circle at 18% 20%, rgba(219,255,190,.18), transparent 23rem),
    radial-gradient(circle at 80% 22%, rgba(255,244,194,.14), transparent 24rem),
    rgba(210,245,188,.045);
}

.wriwoods-season-color--summer {
    background: radial-gradient(circle at 18% 20%, rgba(255,244,168,.18), transparent 23rem),
    radial-gradient(circle at 80% 22%, rgba(122,192,96,.18), transparent 24rem),
    rgba(117,175,92,.05);
}

.wriwoods-season-color--autumn {
    background: radial-gradient(circle at 18% 20%, rgba(255,189,104,.20), transparent 23rem),
    radial-gradient(circle at 80% 22%, rgba(173,93,45,.16), transparent 24rem),
    rgba(174,98,42,.06);
}

.wriwoods-season-color--winter {
    background: radial-gradient(circle at 18% 20%, rgba(214,238,255,.18), transparent 23rem),
    radial-gradient(circle at 80% 22%, rgba(205,218,230,.14), transparent 24rem),
    rgba(210,228,240,.045);
}

.wriwoods-season-panel[data-season="spring"] .wriwoods-season-color--spring,
.wriwoods-season-panel[data-season="summer"] .wriwoods-season-color--summer,
.wriwoods-season-panel[data-season="autumn"] .wriwoods-season-color--autumn,
.wriwoods-season-panel[data-season="winter"] .wriwoods-season-color--winter {
    opacity: 1;
}

.wriwoods-season-atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .9;
    transition: opacity 1.4s ease;
    overflow: hidden;
}

.wriwoods-season-particles {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1.4s ease;
}

.wriwoods-season-panel[data-season="spring"] .wriwoods-season-particles--spring,
.wriwoods-season-panel[data-season="summer"] .wriwoods-season-particles--summer,
.wriwoods-season-panel[data-season="autumn"] .wriwoods-season-particles--autumn,
.wriwoods-season-panel[data-season="winter"] .wriwoods-season-particles--winter {
    opacity: 1;
}

.wriwoods-season-particle {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}

.wriwoods-season-particle--spring {
    width: 5px;
    height: 5px;
    background: rgba(235,255,214,.85);
    box-shadow: 0 0 12px rgba(235,255,214,.45);
    animation: spring-float linear infinite;
    opacity: .0;
}

.wriwoods-season-particle--summer {
    width: 4px;
    height: 4px;
    background: rgba(255,236,146,.92);
    box-shadow: 0 0 18px rgba(255,236,146,.85);
    animation: summer-firefly ease-in-out infinite;
    opacity: 0;
}

.wriwoods-season-particle--autumn {
    width: 14px;
    height: 14px;
    color: rgba(255,196,118,.75);
    animation: autumn-leaf linear infinite;
    opacity: 0;
}

.wriwoods-season-particle--winter {
    width: 4px;
    height: 4px;
    background: rgba(235,245,255,.9);
    box-shadow: 0 0 12px rgba(235,245,255,.45);
    animation: winter-snow linear infinite;
    opacity: 0;
}

.wriwoods-season-panel[data-season="spring"] .wriwoods-season-particle--spring,
.wriwoods-season-panel[data-season="summer"] .wriwoods-season-particle--summer,
.wriwoods-season-panel[data-season="autumn"] .wriwoods-season-particle--autumn,
.wriwoods-season-panel[data-season="winter"] .wriwoods-season-particle--winter {
    opacity: .85;
}

.wriwoods-season-panel::before,
.wriwoods-season-panel::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}

.wriwoods-season-panel::before {
    width: 18rem;
    height: 18rem;
    left: -8rem;
    bottom: -8rem;
    background: rgba(255,232,164,.09);
    filter: blur(22px);
}

.wriwoods-season-panel::after {
    width: 24rem;
    height: 24rem;
    right: -10rem;
    top: -10rem;
    background: rgba(142,177,114,.11);
    filter: blur(26px);
}

.wriwoods-season-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-top: 3rem;
    text-align: left;
}

.wriwoods-season {
    padding: 1.25rem;
    border-radius: 1.4rem;
    background: rgba(0,0,0,.12);
    border: 1px solid rgba(255,248,221,.06);
    cursor: default;
    transition: transform .45s ease,
    background .9s ease,
    border-color .9s ease,
    box-shadow .9s ease;
}

.wriwoods-season:hover {
    transform: translateY(-4px);
    background: rgba(255,255,255,.055);
    border-color: rgba(255,248,221,.16);
    box-shadow: 0 20px 60px rgba(0,0,0,.16);
}

.wriwoods-season strong {
    display: block;
    font-family: Georgia, serif;
    color: #fff8df;
    margin-bottom: .45rem;
}

.wriwoods-season span {
    color: rgba(244,237,207,.68);
    line-height: 1.5;
    font-size: .95rem;
}

/* Final invite */

.wriwoods-final-invite {
    padding-bottom: 10rem;
    text-align: center;
}

.wriwoods-final-link {
    position: relative;
    display: inline-block;
    margin-top: 2.5rem;
    padding: .75rem 1.25rem;
    color: #fff8df;
    font-family: Georgia, serif;
    font-size: 1.6rem;
    font-style: italic;
    text-decoration: none;
    text-shadow: 0 0 24px rgba(255,244,194,.18);
    transition: transform 1.8s cubic-bezier(.16,1,.3,1),
    text-shadow 1.8s ease,
    color 1.2s ease;
    z-index: 2;
    will-change: transform;
}

.wriwoods-final-link:hover {
    transform: translateY(-4px)
    scale(1.02);
    color: #fffef4;
    text-shadow: 0 0 32px rgba(255,244,194,.28),
    0 0 80px rgba(255,236,170,.16);
}

.wriwoods-final-link::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 140%;
    height: 220%;
    transform: translate(-50%, -50%)
    scale(.7);
    border-radius: 999px;
    background: radial-gradient(
    ellipse at center,
    rgba(255,236,170,.22),
    rgba(255,236,170,.06) 42%,
    transparent 50%
    );
    filter: blur(24px);
    opacity: 0;
    transition: opacity 2.6s ease,
    transform 3.8s cubic-bezier(.16,1,.3,1);
    pointer-events: none;
}

.wriwoods-final-link::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 160%;
    height: 1px;
    transform: translateX(-50%)
    scaleX(.4);
    background: linear-gradient(
    to right,
    transparent,
    rgba(255,248,221,.85),
    transparent
    );
    opacity: .45;
    transition: transform 2.8s cubic-bezier(.16,1,.3,1),
    opacity 1.8s ease;
}

.wriwoods-final-link:hover::before {
    opacity: 1;
    transform: translate(-50%, -50%)
    scale(1.25);
}

.wriwoods-final-link:hover::after {
    transform: translateX(-50%)
    scaleX(1.1);
    opacity: 1;
}

@media (max-width: 900px) {
    .wriwoods-clearing,
.wriwoods-path-signs,
.wriwoods-season-list {
        grid-template-columns: 1fr;
    }

    .wriwoods-trail-notes {
        min-height: auto;
        display: grid;
        gap: 1.25rem;
    }

    .wriwoods-note {
        position: relative;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        width: 100%;
    }

}

@media (max-width: 700px) {
    .wriwoods-logo {
        left: 1.5rem;
        top: 1.5rem;
    }

    .wriwoods-hero__panel {
        padding: 2rem 1.25rem;
        border-radius: 2rem;
    }

    .wriwoods-actions {
        flex-direction: column;
    }

    .wriwoods-button {
        width: 100%;
    }

}

/* ==================================================
   WordPress theme overrides
   ================================================== */

.header-search-wrap {
    display: none !important;
}

/* ==================================================
   Comments
   ================================================== */

.wriwoods-comment-area {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 760px;
    margin: 5rem auto 0;
}

.wriwoods-comment-form {
    padding: 2rem;
    border-radius: 2rem;
    background: radial-gradient(circle at 20% 0%, rgba(255,244,194,.12), transparent 55%),
    rgba(255,255,255,.045);
    border: 1px solid rgba(255,248,221,.10);
    box-shadow: 0 30px 90px rgba(0,0,0,.20);
    backdrop-filter: blur(8px);
    margin-top: 2rem;
}

.wriwoods-comment-form h3 {
    margin: 0 0 1rem;
    font-family: Georgia, serif;
    font-size: 1.8rem;
    font-style: italic;
    color: #fff8df;
}

.wriwoods-comment-form textarea {
    width: 100%;
    min-height: 150px;
    resize: vertical;
    padding: 1rem;
    border-radius: 1.25rem;
    border: 1px solid rgba(255,248,221,.14);
    background: rgba(12,26,16,.45);
    color: #fff8df;
    font: inherit;
    line-height: 1.6;
    outline: none;
}

.wriwoods-comment-form textarea::placeholder {
    color: rgba(244,237,207,.48);
}

.wriwoods-comment-form textarea:focus {
    border-color: rgba(255,244,194,.45);
    box-shadow: 0 0 0 4px rgba(255,244,194,.08);
}

.wriwoods-comment-form button {
    margin-top: 1rem;
    border: 0;
    border-radius: 999px;
    padding: .9rem 1.4rem;
    background: rgba(255,248,223,.92);
    color: #17321d;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 16px 40px rgba(0,0,0,.22);
}

.wriwoods-comment-form button:hover {
    background: #fff4cf;
    transform: translateY(-2px);
}

/* Comment Login message */
/* Comment login message */

.wriwoods-comment-login {
    grid-column: 1 / -1;
    margin: 5rem auto 0;
    text-align: center;
}

.wriwoods-comment-login a {
    display: inline-block;
    padding: 1rem 1.4rem;
    border-radius: 999px;
    background: radial-gradient(circle at 20% 0%, rgba(255,244,194,.10), transparent 55%),
    rgba(255,255,255,.04);
    border: 1px solid rgba(255,248,221,.10);
    color: #fff8df;
    font-family: Georgia, serif;
    font-size: 1.15rem;
    font-style: italic;
    text-decoration: none;
    box-shadow: 0 20px 60px rgba(0,0,0,.18);
    transition: transform .35s ease,
    border-color .35s ease,
    background .35s ease,
    color .35s ease;
}

.wriwoods-comment-login a:hover {
    transform: translateY(-3px);
    border-color: rgba(255,248,221,.22);
    background: radial-gradient(circle at 20% 0%, rgba(255,244,194,.16), transparent 55%),
    rgba(255,255,255,.06);
    color: #fffef4;
}

/* ==================================================
   Footer
   ================================================== */

.site-footer {
    position: relative;
    padding: 24px 24px 28px;
    background: radial-gradient(circle at 50% 0%, rgba(255,244,194,.06), transparent 32rem),
    linear-gradient(
    to bottom,
    #102216 0%,
    #0b170f 100%
    );
    text-align: center;
    border-top: 1px solid rgba(255,248,221,.06);
    overflow: hidden;
}

.site-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px);
    background-size: 80px 80px;
    mask-image: linear-gradient(to bottom, transparent, black 18%, black 82%, transparent);
    pointer-events: none;
    opacity: .55;
}

.site-footer-mark {
    position: relative;
    margin: 0 0 18px;
    font-family: Georgia, serif;
    font-size: .95rem;
    font-style: italic;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(245,232,207,.52);
    text-shadow: 0 2px 12px rgba(0,0,0,.24);
}

.site-footer p {
    position: relative;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    font-size: .9rem;
    line-height: 1.6;
    color: rgba(244,237,207,.34);
}

.site-footer span {
    color: rgba(244,237,207,.48);
    letter-spacing: .05em;
}

.site-footer a {
    color: rgba(244,237,207,.40);
    text-decoration: none;
    transition: color .3s ease,
    opacity .3s ease;
}

.site-footer a:hover {
    color: rgba(255,248,221,.82);
}

/* Entering state refinements */

.wriwoods-hero--entering .wriwoods-distant-light {
    opacity: 1;
    transform: translateX(-50%) translateY(-52px) scale(1.35);
    filter: blur(10px);
}

.wriwoods-hero--entering .wriwoods-entry-trail {
    opacity: 1;
    transform: translateX(-50%) scale(1.18);
}

.wriwoods-hero--entering .wriwoods-entry-particle {
    animation-duration: calc(var(--duration) * .55);
}

.wriwoods-hero--entering .wriwoods-entry-path {
    opacity: .72;
    letter-spacing: .03em;
}