*,
        :after,
        :before {
            --tw-border-spacing-x: 0;
            --tw-border-spacing-y: 0;
            --tw-translate-x: 0;
            --tw-translate-y: 0;
            --tw-rotate: 0;
            --tw-skew-x: 0;
            --tw-skew-y: 0;
            --tw-scale-x: 1;
            --tw-scale-y: 1;
            --tw-pan-x: ;
            --tw-pan-y: ;
            --tw-pinch-zoom: ;
            --tw-scroll-snap-strictness: proximity;
            --tw-gradient-from-position: ;
            --tw-gradient-via-position: ;
            --tw-gradient-to-position: ;
            --tw-ordinal: ;
            --tw-slashed-zero: ;
            --tw-numeric-figure: ;
            --tw-numeric-spacing: ;
            --tw-numeric-fraction: ;
            --tw-ring-inset: ;
            --tw-ring-offset-width: 0px;
            --tw-ring-offset-color: #fff;
            --tw-ring-color: rgba(59, 130, 246, .5);
            --tw-ring-offset-shadow: 0 0 #0000;
            --tw-ring-shadow: 0 0 #0000;
            --tw-shadow: 0 0 #0000;
            --tw-shadow-colored: 0 0 #0000;
            --tw-blur: ;
            --tw-brightness: ;
            --tw-contrast: ;
            --tw-grayscale: ;
            --tw-hue-rotate: ;
            --tw-invert: ;
            --tw-saturate: ;
            --tw-sepia: ;
            --tw-drop-shadow: ;
            --tw-backdrop-blur: ;
            --tw-backdrop-brightness: ;
            --tw-backdrop-contrast: ;
            --tw-backdrop-grayscale: ;
            --tw-backdrop-hue-rotate: ;
            --tw-backdrop-invert: ;
            --tw-backdrop-opacity: ;
            --tw-backdrop-saturate: ;
            --tw-backdrop-sepia: ;
            --tw-contain-size: ;
            --tw-contain-layout: ;
            --tw-contain-paint: ;
            --tw-contain-style:
        }

        ::backdrop {
            --tw-border-spacing-x: 0;
            --tw-border-spacing-y: 0;
            --tw-translate-x: 0;
            --tw-translate-y: 0;
            --tw-rotate: 0;
            --tw-skew-x: 0;
            --tw-skew-y: 0;
            --tw-scale-x: 1;
            --tw-scale-y: 1;
            --tw-pan-x: ;
            --tw-pan-y: ;
            --tw-pinch-zoom: ;
            --tw-scroll-snap-strictness: proximity;
            --tw-gradient-from-position: ;
            --tw-gradient-via-position: ;
            --tw-gradient-to-position: ;
            --tw-ordinal: ;
            --tw-slashed-zero: ;
            --tw-numeric-figure: ;
            --tw-numeric-spacing: ;
            --tw-numeric-fraction: ;
            --tw-ring-inset: ;
            --tw-ring-offset-width: 0px;
            --tw-ring-offset-color: #fff;
            --tw-ring-color: rgba(59, 130, 246, .5);
            --tw-ring-offset-shadow: 0 0 #0000;
            --tw-ring-shadow: 0 0 #0000;
            --tw-shadow: 0 0 #0000;
            --tw-shadow-colored: 0 0 #0000;
            --tw-blur: ;
            --tw-brightness: ;
            --tw-contrast: ;
            --tw-grayscale: ;
            --tw-hue-rotate: ;
            --tw-invert: ;
            --tw-saturate: ;
            --tw-sepia: ;
            --tw-drop-shadow: ;
            --tw-backdrop-blur: ;
            --tw-backdrop-brightness: ;
            --tw-backdrop-contrast: ;
            --tw-backdrop-grayscale: ;
            --tw-backdrop-hue-rotate: ;
            --tw-backdrop-invert: ;
            --tw-backdrop-opacity: ;
            --tw-backdrop-saturate: ;
            --tw-backdrop-sepia: ;
            --tw-contain-size: ;
            --tw-contain-layout: ;
            --tw-contain-paint: ;
            --tw-contain-style:
        }

        *,
        :after,
        :before {
            box-sizing: border-box;
            border: 0 solid #e5e7eb
        }

        :after,
        :before {
            --tw-content: ""
        }

        :host,
        html {
            line-height: 1.5;
            -webkit-text-size-adjust: 100%;
            -moz-tab-size: 4;
            -o-tab-size: 4;
            tab-size: 4;
            font-family: Nunito, system-ui, sans-serif;
            font-feature-settings: normal;
            font-variation-settings: normal;
            -webkit-tap-highlight-color: transparent
        }

        body {
            margin: 0;
            line-height: inherit
        }

        hr {
            height: 0;
            color: inherit;
            border-top-width: 1px
        }

        abbr:where([title]) {
            -webkit-text-decoration: underline dotted;
            text-decoration: underline dotted
        }

        h1,
        h2,
        h3,
        h4,
        h5,
        h6 {
            font-size: inherit;
            font-weight: inherit
        }

        a {
            color: inherit;
            text-decoration: inherit
        }

        b,
        strong {
            font-weight: bolder
        }

        code,
        kbd,
        pre,
        samp {
            font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
            font-feature-settings: normal;
            font-variation-settings: normal;
            font-size: 1em
        }

        small {
            font-size: 80%
        }

        sub,
        sup {
            font-size: 75%;
            line-height: 0;
            position: relative;
            vertical-align: baseline
        }

        sub {
            bottom: -.25em
        }

        sup {
            top: -.5em
        }

        table {
            text-indent: 0;
            border-color: inherit;
            border-collapse: collapse
        }

        button,
        input,
        optgroup,
        select,
        textarea {
            font-family: inherit;
            font-feature-settings: inherit;
            font-variation-settings: inherit;
            font-size: 100%;
            font-weight: inherit;
            line-height: inherit;
            letter-spacing: inherit;
            color: inherit;
            margin: 0;
            padding: 0
        }

        button,
        select {
            text-transform: none
        }

        button,
        input:where([type=button]),
        input:where([type=reset]),
        input:where([type=submit]) {
            -webkit-appearance: button;
            background-color: transparent;
            background-image: none
        }

        :-moz-focusring {
            outline: auto
        }

        :-moz-ui-invalid {
            box-shadow: none
        }

        progress {
            vertical-align: baseline
        }

        ::-webkit-inner-spin-button,
        ::-webkit-outer-spin-button {
            height: auto
        }

        [type=search] {
            -webkit-appearance: textfield;
            outline-offset: -2px
        }

        ::-webkit-search-decoration {
            -webkit-appearance: none
        }

        ::-webkit-file-upload-button {
            -webkit-appearance: button;
            font: inherit
        }

        summary {
            display: list-item
        }

        blockquote,
        dd,
        dl,
        figure,
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        hr,
        p,
        pre {
            margin: 0
        }

        fieldset {
            margin: 0
        }

        fieldset,
        legend {
            padding: 0
        }

        menu,
        ol,
        ul {
            list-style: none;
            margin: 0;
            padding: 0
        }

        dialog {
            padding: 0
        }

        textarea {
            resize: vertical
        }

        input::-moz-placeholder,
        textarea::-moz-placeholder {
            opacity: 1;
            color: #9ca3af
        }

        input::placeholder,
        textarea::placeholder {
            opacity: 1;
            color: #9ca3af
        }

        [role=button],
        button {
            cursor: pointer
        }

        :disabled {
            cursor: default
        }

        audio,
        canvas,
        embed,
        iframe,
        img,
        object,
        svg,
        video {
            display: block;
            vertical-align: middle
        }

        img,
        video {
            max-width: 100%;
            height: auto
        }

        [hidden]:where(:not([hidden=until-found])) {
            display: none
        }

        :root {
            --canvas: #f7f4ec;
            --surface: #fff;
            --sage: #7c8c6a;
            --sage-bright: #8fa878;
            --sage-deep: #4c5b3f;
            --sage-tint: #e7edda;
            --clay: #b0876b;
            --clay-deep: #93694e;
            --blush: #e8c6ad;
            --blush-tint: #f6e4d7;
            --butter: #f0dfa8;
            --butter-tint: #f8eecb;
            --sand: #e7decf;
            --ink: #2b2e24;
            --muted: #5c6350;
            --line: #e8e4d6
        }

        html {
            scroll-behavior: smooth;
            scroll-padding-top: 104px;
            -webkit-text-size-adjust: 100%
        }

        body {
            background-color: var(--canvas);
            color: var(--ink);
            font-family: Nunito, system-ui, sans-serif;
            font-size: 1.075rem;
            line-height: 1.7;
            -webkit-font-smoothing: antialiased;
            text-rendering: optimizeLegibility;
            overflow-x: hidden
        }

        i[class^="fa-"],
        i[class*=" fa-"] {
            display: inline-block;
            min-width: 1em;
            line-height: 1
        }

        ::-moz-selection {
            background: var(--sage-deep);
            color: #fff
        }

        ::selection {
            background: var(--sage-deep);
            color: #fff
        }

        :focus-visible {
            outline: 2px solid var(--sage-deep);
            outline-offset: 3px;
            border-radius: 10px
        }

        .wrap {
            margin-inline: auto;
            width: 100%;
            max-width: 1200px;
            padding-inline: 1.5rem
        }

        @media (min-width:640px) {
            .wrap {
                padding-inline: 2rem
            }
        }

        .section {
            position: relative;
            padding-block: clamp(4rem, 8vw, 7rem)
        }

        .section-tight {
            position: relative;
            padding-block: clamp(2.5rem, 5vw, 3.5rem)
        }

        .section-head {
            margin-inline: auto;
            max-width: 46rem;
            text-align: center
        }

        .display {
            font-family: Fraunces, Georgia, serif;
            color: var(--ink);
            font-weight: 600;
            font-size: clamp(3rem, 6.6vw, 5rem);
            line-height: 1.02;
            letter-spacing: -.02em
        }

        .display em {
            font-style: italic;
            font-weight: 500;
            color: var(--sage-deep)
        }

        .h2 {
            font-family: Fraunces, Georgia, serif;
            color: var(--ink);
            font-weight: 600;
            font-size: clamp(2.1rem, 3.8vw, 3rem);
            line-height: 1.12;
            letter-spacing: -.015em
        }

        .h2 em {
            font-style: italic;
            color: var(--sage-deep)
        }

        .h3 {
            font-family: Fraunces, Georgia, serif;
            color: var(--ink);
            font-weight: 600;
            font-size: 1.5rem;
            line-height: 1.25;
            letter-spacing: -.01em
        }

        .lead {
            color: var(--muted);
            font-size: clamp(1.12rem, 1.5vw, 1.3rem);
            line-height: 1.62;
            font-weight: 500
        }

        .squiggle {
            position: relative;
            display: inline-block
        }

        .squiggle:after {
            content: "";
            position: absolute;
            left: -2%;
            right: -2%;
            bottom: -.24em;
            height: .55em;
            background: no-repeat 50%/100% 100% url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='22' viewBox='0 -2 120 24' fill='none'%3E%3Cpath stroke='%23B0876B' stroke-linecap='round' stroke-width='4' d='M2 8Q23-2.5 44 8c21 10.5 28 7 42 0s22-6 32-2'/%3E%3C/svg%3E");
            z-index: -1
        }

        .eyebrow {
            display: inline-flex;
            align-items: center;
            gap: .6rem;
            border-radius: 999px;
            background: var(--butter-tint);
            border: 2px solid var(--butter);
            padding: .45rem 1rem;
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .12em;
            color: var(--clay-deep)
        }

        .eyebrow i {
            color: var(--clay)
        }

        .navlink {
            position: relative;
            font-weight: 700;
            font-size: 1rem;
            color: var(--muted);
            border-radius: 999px;
            padding: .4rem .9rem;
            transition: color .2s ease, background-color .2s ease
        }

        .navlink:hover {
            color: var(--sage-deep);
            background: var(--sage-tint)
        }

        #site-header {
            transition: background-color .3s ease, box-shadow .3s ease
        }

        #site-header.is-solid {
            background: hsla(44, 41%, 95%, .92);
            box-shadow: 0 6px 24px -12px rgba(43, 46, 32, .28);
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px)
        }

        #site-header.is-light .navlink {
            color: hsla(0, 0%, 100%, .86)
        }

        #site-header.is-light .navlink:hover {
            color: #fff;
            background: hsla(0, 0%, 100%, .16)
        }

        #site-header.is-light .header-phone {
            color: #fff
        }

        #site-header.is-light .header-phone i {
            color: var(--butter)
        }

        #site-header.is-light #menu-toggle {
            border-color: hsla(0, 0%, 100%, .45);
            color: #fff;
            background: hsla(0, 0%, 100%, .14)
        }

        .glass {
            background: hsla(0, 0%, 100%, .14);
            border: 1px solid hsla(0, 0%, 100%, .28);
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px)
        }

        .btn-glass {
            border: 2px solid hsla(0, 0%, 100%, .55);
            background: hsla(0, 0%, 100%, .1);
            color: #fff
        }

        .btn-glass:hover {
            background: hsla(0, 0%, 100%, .2);
            transform: translateY(-3px) rotate(1deg)
        }

        .hero-video {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
            object-fit: cover
        }

        .hero-poster,
        .hero-video {
            position: absolute;
            inset: 0;
            z-index: 0
        }

        .hero-poster {
            background: radial-gradient(120% 90% at 78% 8%, hsla(46, 71%, 80%, .35), hsla(46, 71%, 80%, 0) 55%), linear-gradient(155deg, #6f8358, #556646 45%, #3d4a34)
        }

        .hero-overlay {
            position: absolute;
            inset: 0;
            z-index: 1;
            background: linear-gradient(180deg, rgba(35, 42, 27, .55), rgba(38, 46, 30, .34) 38%, rgba(43, 52, 34, .72))
        }

        .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .6rem;
            border-radius: 999px;
            font-weight: 800;
            font-size: 1.02rem;
            line-height: 1;
            min-height: 3.4rem;
            padding-inline: 1.9rem;
            transition: transform .25s cubic-bezier(.2, .7, .2, 1), background-color .25s ease, color .25s ease, box-shadow .25s ease, border-color .25s ease;
            will-change: transform
        }

        .btn-primary {
            background: var(--sage-deep);
            color: #fff;
            box-shadow: 0 12px 26px -12px rgba(76, 91, 63, .85)
        }

        .btn-primary:hover {
            background: var(--ink);
            transform: translateY(-3px) rotate(-1deg);
            box-shadow: 0 18px 34px -14px rgba(43, 46, 36, .6)
        }

        .btn-clay {
            background: var(--clay);
            color: #fff;
            box-shadow: 0 12px 26px -12px rgba(147, 105, 78, .8)
        }

        .btn-clay:hover {
            background: var(--clay-deep);
            transform: translateY(-3px) rotate(1deg)
        }

        .btn-outline {
            border: 2.5px solid var(--sage-deep);
            background: transparent;
            color: var(--sage-deep)
        }

        .btn-outline:hover {
            background: var(--sage-deep);
            color: #fff;
            transform: translateY(-3px) rotate(-1deg)
        }

        .btn-light {
            background: #fff;
            color: var(--ink);
            box-shadow: 0 12px 30px -14px rgba(0, 0, 0, .35)
        }

        .btn-light:hover {
            background: var(--butter-tint);
            transform: translateY(-3px) rotate(1deg)
        }

        .blob-1 {
            border-radius: 42% 58% 63% 37%/42% 45% 55% 58%
        }

        .blob-2 {
            border-radius: 63% 37% 47% 53%/58% 52% 48% 42%
        }

        .blob-3 {
            border-radius: 50% 50% 42% 58%/55% 45% 60% 40%
        }

        .soft-blob {
            position: absolute;
            border-radius: 50%;
            filter: blur(8px);
            pointer-events: none;
            z-index: 0
        }

        .card {
            position: relative;
            border-radius: 2rem;
            border: 2px solid var(--line);
            background: #fff;
            box-shadow: 0 2px 4px rgba(43, 46, 32, .03), 0 22px 44px -28px rgba(43, 46, 32, .24);
            transition: transform .4s cubic-bezier(.2, .7, .2, 1), box-shadow .4s ease, border-color .4s ease
        }

        .card:hover {
            transform: translateY(-8px) rotate(-1.2deg);
            box-shadow: 0 4px 8px rgba(43, 46, 32, .05), 0 40px 66px -30px rgba(43, 46, 32, .32);
            border-color: var(--sage-bright)
        }

        .icon-blob {
            display: inline-flex;
            height: 4.25rem;
            width: 4.25rem;
            flex-shrink: 0;
            align-items: center;
            justify-content: center;
            font-size: 1.7rem;
            border-radius: 42% 58% 63% 37%/42% 45% 55% 58%;
            transition: transform .4s cubic-bezier(.2, .7, .2, 1), border-radius .4s ease
        }

        .icon-blob--sage {
            background: var(--sage-tint);
            color: var(--sage-deep)
        }

        .icon-blob--clay {
            background: var(--blush-tint);
            color: var(--clay-deep)
        }

        .icon-blob--butter {
            background: var(--butter-tint);
            color: #a98527
        }

        .card:hover .icon-blob {
            transform: rotate(8deg) scale(1.05);
            border-radius: 58% 42% 37% 63%/55% 58% 42% 45%
        }

        .chip {
            display: inline-flex;
            align-items: center;
            gap: .6rem;
            border-radius: 999px;
            border: 2px solid var(--line);
            background: #fff;
            padding: .7rem 1.2rem;
            font-weight: 700;
            color: var(--ink);
            box-shadow: 0 2px 3px rgba(43, 46, 32, .04);
            transition: transform .3s ease, border-color .3s ease, background .3s ease
        }

        .chip:hover {
            transform: translateY(-3px) rotate(-1.5deg);
            border-color: var(--sage-bright);
            background: var(--sage-tint)
        }

        .chip i {
            color: var(--clay)
        }

        .tag {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            border-radius: 999px;
            background: #fff;
            border: 2px solid var(--line);
            padding: .55rem 1.05rem;
            font-size: .92rem;
            font-weight: 800;
            color: var(--sage-deep)
        }

        .stars {
            color: #e0a83e;
            letter-spacing: .12em
        }

        .bubble {
            position: relative;
            border-radius: 1.75rem;
            border: 2px solid var(--line);
            background: #fff
        }

        .bubble:after {
            content: "";
            position: absolute;
            left: 2.4rem;
            bottom: -.85rem;
            width: 1.5rem;
            height: 1.5rem;
            background: #fff;
            border-right: 2px solid var(--line);
            border-bottom: 2px solid var(--line);
            transform: rotate(45deg)
        }

        .step-num {
            font-family: Fraunces, Georgia, serif;
            font-style: italic;
            font-size: 2.2rem;
            font-weight: 600;
            color: var(--clay);
            line-height: 1
        }

        .faq-item {
            border-radius: 1.4rem;
            border: 2px solid var(--line);
            background: #fff;
            margin-bottom: 1rem;
            transition: border-color .3s ease, box-shadow .3s ease
        }

        .faq-item.is-open {
            border-color: var(--sage-bright);
            box-shadow: 0 20px 40px -26px rgba(43, 46, 32, .28)
        }

        .faq-q {
            justify-content: space-between;
            gap: 1rem;
            width: 100%;
            text-align: left;
            padding: 1.3rem 1.5rem;
            font-family: Fraunces, Georgia, serif;
            font-weight: 600;
            font-size: 1.2rem;
            color: var(--ink)
        }

        .faq-chevron,
        .faq-q {
            display: flex;
            align-items: center
        }

        .faq-chevron {
            justify-content: center;
            height: 2.4rem;
            width: 2.4rem;
            flex-shrink: 0;
            border-radius: 999px;
            background: var(--sage-tint);
            color: var(--sage-deep);
            transition: transform .35s ease, background-color .35s ease, color .35s ease
        }

        .faq-item.is-open .faq-chevron {
            transform: rotate(180deg);
            background: var(--sage-deep);
            color: #fff
        }

        .faq-a {
            overflow: hidden;
            max-height: 0;
            transition: max-height .4s ease
        }

        .faq-a-inner {
            padding: 0 1.5rem 1.4rem;
            color: var(--muted);
            font-weight: 500
        }

        .reveal {
            opacity: 0;
            transform: translateY(26px);
            transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1)
        }

        .reveal.is-visible {
            opacity: 1;
            transform: none
        }

        .stagger>.reveal:nth-child(2) {
            transition-delay: .09s
        }

        .stagger>.reveal:nth-child(3) {
            transition-delay: .18s
        }

        .stagger>.reveal:nth-child(4) {
            transition-delay: .27s
        }

        .stagger>.reveal:nth-child(5) {
            transition-delay: .36s
        }

        .stagger>.reveal:nth-child(6) {
            transition-delay: .45s
        }

        .doodle {
            position: absolute;
            pointer-events: none;
            color: var(--sage-bright);
            z-index: 0
        }

        .float-slow {
            animation: floaty 7s ease-in-out infinite
        }

        .float-slower {
            animation: floaty 10s ease-in-out infinite
        }

        .wiggle {
            animation: wiggle 6s ease-in-out infinite
        }

        .marquee {
            display: flex;
            gap: 2.5rem;
            width: -moz-max-content;
            width: max-content;
            animation: marquee 34s linear infinite
        }

        .marquee-track:hover .marquee {
            animation-play-state: paused
        }

        .drawer {
            position: fixed;
            inset: 0;
            z-index: 60;
            visibility: hidden
        }

        .drawer.is-open {
            visibility: visible
        }

        .drawer__overlay {
            position: absolute;
            inset: 0;
            background: rgba(43, 46, 32, .5);
            opacity: 0;
            transition: opacity .3s ease
        }

        .drawer.is-open .drawer__overlay {
            opacity: 1
        }

        .drawer__panel {
            position: absolute;
            top: 0;
            right: 0;
            display: flex;
            flex-direction: column;
            height: 100%;
            width: min(86%, 350px);
            background: var(--canvas);
            box-shadow: -20px 0 60px -20px rgba(43, 46, 32, .4);
            transform: translateX(100%);
            transition: transform .4s cubic-bezier(.22, .7, .2, 1)
        }

        .drawer.is-open .drawer__panel {
            transform: translateX(0)
        }

        .zoom img {
            transition: transform .6s cubic-bezier(.2, .7, .2, 1)
        }

        .zoom:hover img {
            transform: scale(1.06)
        }

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

        .absolute {
            position: absolute
        }

        .relative {
            position: relative
        }

        .sticky {
            position: sticky
        }

        .inset-0 {
            inset: 0
        }

        .inset-x-0 {
            left: 0;
            right: 0
        }

        .-bottom-4 {
            bottom: -1rem
        }

        .-left-3 {
            left: -.75rem
        }

        .-right-2 {
            right: -.5rem
        }

        .bottom-0 {
            bottom: 0
        }

        .right-4 {
            right: 1rem
        }

        .top-0 {
            top: 0
        }

        .top-3 {
            top: .75rem
        }

        .top-6 {
            top: 1.5rem
        }

        .z-10 {
            z-index: 10
        }

        .z-40 {
            z-index: 40
        }

        .z-\[3\] {
            z-index: 3
        }

        .order-1 {
            order: 1
        }

        .order-2 {
            order: 2
        }

        .mx-auto {
            margin-left: auto;
            margin-right: auto
        }

        .-mt-8 {
            margin-top: -2rem
        }

        .-mt-\[78px\] {
            margin-top: -92px
        }

        .mb-10 {
            margin-bottom: 2.5rem
        }

        .ml-6 {
            margin-left: 1.5rem
        }

        .mt-1 {
            margin-top: .25rem
        }

        .mt-10 {
            margin-top: 2.5rem
        }

        .mt-12 {
            margin-top: 3rem
        }

        .mt-14 {
            margin-top: 3.5rem
        }

        .mt-3 {
            margin-top: .75rem
        }

        .mt-4 {
            margin-top: 1rem
        }

        .mt-5 {
            margin-top: 1.25rem
        }

        .mt-6 {
            margin-top: 1.5rem
        }

        .mt-8 {
            margin-top: 2rem
        }

        .mt-9 {
            margin-top: 2.25rem
        }

        .mt-auto {
            margin-top: auto
        }

        .block {
            display: block
        }

        .flex {
            display: flex
        }

        .inline-flex {
            display: inline-flex
        }

        .table {
            display: table
        }

        .grid {
            display: grid
        }

        .hidden {
            display: none
        }

        .aspect-\[16\/10\] {
            aspect-ratio: 16/10
        }

        .aspect-\[16\/6\] {
            aspect-ratio: 16/6
        }

        .aspect-\[4\/3\] {
            aspect-ratio: 4/3
        }

        .aspect-square {
            aspect-ratio: 1/1
        }

        .h-10 {
            height: 2.5rem
        }

        .h-11 {
            height: 2.75rem
        }

        .h-12 {
            height: 3rem
        }

        .h-14 {
            height: 4rem
        }

        .h-28 {
            height: 7rem
        }

        .h-4 {
            height: 1rem
        }

        .h-\[78px\] {
            height: 92px
        }

        .h-full {
            height: 100%
        }

        .min-h-\[92svh\] {
            min-height: 92svh
        }

        .w-10 {
            width: 2.5rem
        }

        .w-12 {
            width: 3rem
        }

        .w-auto {
            width: auto
        }

        .w-full {
            width: 100%
        }

        .w-px {
            width: 1px
        }

        .max-w-2xl {
            max-width: 42rem
        }

        .max-w-3xl {
            max-width: 48rem
        }

        .max-w-lg {
            max-width: 32rem
        }

        .max-w-md {
            max-width: 28rem
        }

        .max-w-xl {
            max-width: 36rem
        }

        .max-w-xs {
            max-width: 20rem
        }

        .flex-1 {
            flex: 1 1 0%
        }

        .transform {
            transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
        }

        .resize {
            resize: both
        }

        .grid-cols-2 {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }

        .flex-col {
            flex-direction: column
        }

        .flex-wrap {
            flex-wrap: wrap
        }

        .items-start {
            align-items: flex-start
        }

        .items-center {
            align-items: center
        }

        .justify-center {
            justify-content: center
        }

        .justify-between {
            justify-content: space-between
        }

        .gap-1 {
            gap: .25rem
        }

        .gap-1\.5 {
            gap: .375rem
        }

        .gap-10 {
            gap: 2.5rem
        }

        .gap-12 {
            gap: 3rem
        }

        .gap-14 {
            gap: 3.5rem
        }

        .gap-2 {
            gap: .5rem
        }

        .gap-2\.5 {
            gap: .625rem
        }

        .gap-3 {
            gap: .75rem
        }

        .gap-3\.5 {
            gap: .875rem
        }

        .gap-4 {
            gap: 1rem
        }

        .gap-5 {
            gap: 1.25rem
        }

        .gap-6 {
            gap: 1.5rem
        }

        .gap-7 {
            gap: 1.75rem
        }

        .gap-8 {
            gap: 2rem
        }

        .gap-x-3 {
            -moz-column-gap: .75rem;
            column-gap: .75rem
        }

        .gap-y-3 {
            row-gap: .75rem
        }

        .space-y-2>:not([hidden])~:not([hidden]) {
            --tw-space-y-reverse: 0;
            margin-top: calc(.5rem*(1 - var(--tw-space-y-reverse)));
            margin-bottom: calc(.5rem*var(--tw-space-y-reverse))
        }

        .space-y-3>:not([hidden])~:not([hidden]) {
            --tw-space-y-reverse: 0;
            margin-top: calc(.75rem*(1 - var(--tw-space-y-reverse)));
            margin-bottom: calc(.75rem*var(--tw-space-y-reverse))
        }

        .overflow-hidden {
            overflow: hidden
        }

        .break-all {
            word-break: break-all
        }

        .rounded-2xl {
            border-radius: 1rem
        }

        .rounded-3xl {
            border-radius: 1.5rem
        }

        .rounded-full {
            border-radius: 9999px
        }

        .rounded-xl {
            border-radius: .75rem
        }

        .border-2 {
            border-width: 2px
        }

        .border-b-2 {
            border-bottom-width: 2px
        }

        .border-t {
            border-top-width: 1px
        }

        .border-t-2 {
            border-top-width: 2px
        }

        .border-line {
            --tw-border-opacity: 1;
            border-color: rgb(232 228 214/var(--tw-border-opacity, 1))
        }

        .border-line\/70 {
            border-color: hsla(47, 28%, 87%, .7)
        }

        .border-sage {
            --tw-border-opacity: 1;
            border-color: rgb(124 140 106/var(--tw-border-opacity, 1))
        }

        .border-sage\/25 {
            border-color: hsla(88, 14%, 48%, .25)
        }

        .border-white {
            --tw-border-opacity: 1;
            border-color: rgb(255 255 255/var(--tw-border-opacity, 1))
        }

        .border-white\/15 {
            border-color: hsla(0, 0%, 100%, .15)
        }

        .border-white\/25 {
            border-color: hsla(0, 0%, 100%, .25)
        }

        .border-white\/50 {
            border-color: hsla(0, 0%, 100%, .5)
        }

        .bg-butter-tint {
            --tw-bg-opacity: 1;
            background-color: rgb(248 238 203/var(--tw-bg-opacity, 1))
        }

        .bg-canvas {
            --tw-bg-opacity: 1;
            background-color: rgb(247 244 236/var(--tw-bg-opacity, 1))
        }

        .bg-sage-deep {
            --tw-bg-opacity: 1;
            background-color: rgb(76 91 63/var(--tw-bg-opacity, 1))
        }

        .bg-sage-tint {
            --tw-bg-opacity: 1;
            background-color: rgb(231 237 218/var(--tw-bg-opacity, 1))
        }

        .bg-white {
            --tw-bg-opacity: 1;
            background-color: rgb(255 255 255/var(--tw-bg-opacity, 1))
        }

        .bg-white\/15 {
            background-color: hsla(0, 0%, 100%, .15)
        }

        .bg-white\/25 {
            background-color: hsla(0, 0%, 100%, .25)
        }

        .object-cover {
            -o-object-fit: cover;
            object-fit: cover
        }

        .p-2 {
            padding: .5rem
        }

        .p-2\.5 {
            padding: .625rem
        }

        .p-3 {
            padding: .75rem
        }

        .p-4 {
            padding: 1rem
        }

        .p-6 {
            padding: 1.5rem
        }

        .p-7 {
            padding: 1.75rem
        }

        .p-8 {
            padding: 2rem
        }

        .px-3 {
            padding-left: .75rem;
            padding-right: .75rem
        }

        .px-5 {
            padding-left: 1.25rem;
            padding-right: 1.25rem
        }

        .px-6 {
            padding-left: 1.5rem;
            padding-right: 1.5rem
        }

        .px-8 {
            padding-left: 2rem;
            padding-right: 2rem
        }

        .py-1 {
            padding-top: .25rem;
            padding-bottom: .25rem
        }

        .py-16 {
            padding-top: 4rem;
            padding-bottom: 4rem
        }

        .py-24 {
            padding-top: 6rem;
            padding-bottom: 6rem
        }

        .py-3 {
            padding-top: .75rem;
            padding-bottom: .75rem
        }

        .py-3\.5 {
            padding-top: .875rem;
            padding-bottom: .875rem
        }

        .py-4 {
            padding-top: 1rem;
            padding-bottom: 1rem
        }

        .py-6 {
            padding-top: 1.5rem;
            padding-bottom: 1.5rem
        }

        .pb-4 {
            padding-bottom: 1rem
        }

        .pb-8 {
            padding-bottom: 2rem
        }

        .pl-4 {
            padding-left: 1rem
        }

        .pt-12 {
            padding-top: 3rem
        }

        .pt-\[78px\] {
            padding-top: 92px
        }

        .text-center {
            text-align: center
        }

        .font-display {
            font-family: Fraunces, Georgia, serif
        }

        .font-sans {
            font-family: Nunito, system-ui, sans-serif
        }

        .text-2xl {
            font-size: 1.5rem;
            line-height: 2rem
        }

        .text-3xl {
            font-size: 1.875rem;
            line-height: 2.25rem
        }

        .text-5xl {
            font-size: 3rem;
            line-height: 1
        }

        .text-lg {
            font-size: 1.125rem;
            line-height: 1.75rem
        }

        .text-sm {
            font-size: .875rem;
            line-height: 1.25rem
        }

        .text-xl {
            font-size: 1.25rem;
            line-height: 1.75rem
        }

        .text-xs {
            font-size: .75rem;
            line-height: 1rem
        }

        .font-bold {
            font-weight: 700
        }

        .font-extrabold {
            font-weight: 800
        }

        .font-medium {
            font-weight: 500
        }

        .font-semibold {
            font-weight: 600
        }

        .uppercase {
            text-transform: uppercase
        }

        .italic {
            font-style: italic
        }

        .leading-none {
            line-height: 1
        }

        .leading-tight {
            line-height: 1.25
        }

        .tracking-tight {
            letter-spacing: -.025em
        }

        .tracking-wider {
            letter-spacing: .05em
        }

        .\!text-butter {
            --tw-text-opacity: 1 !important;
            color: rgb(240 223 168/var(--tw-text-opacity, 1)) !important
        }

        .\!text-white {
            --tw-text-opacity: 1 !important;
            color: rgb(255 255 255/var(--tw-text-opacity, 1)) !important
        }

        .\!text-white\/90 {
            color: hsla(0, 0%, 100%, .9) !important
        }

        .text-butter {
            --tw-text-opacity: 1;
            color: rgb(240 223 168/var(--tw-text-opacity, 1))
        }

        .text-clay {
            --tw-text-opacity: 1;
            color: rgb(176 135 107/var(--tw-text-opacity, 1))
        }

        .text-ink {
            --tw-text-opacity: 1;
            color: rgb(43 46 36/var(--tw-text-opacity, 1))
        }

        .text-muted {
            --tw-text-opacity: 1;
            color: rgb(92 99 80/var(--tw-text-opacity, 1))
        }

        .text-sage {
            --tw-text-opacity: 1;
            color: rgb(124 140 106/var(--tw-text-opacity, 1))
        }

        .text-sage-deep {
            --tw-text-opacity: 1;
            color: rgb(76 91 63/var(--tw-text-opacity, 1))
        }

        .text-white {
            --tw-text-opacity: 1;
            color: rgb(255 255 255/var(--tw-text-opacity, 1))
        }

        .text-white\/70 {
            color: hsla(0, 0%, 100%, .7)
        }

        .text-white\/75 {
            color: hsla(0, 0%, 100%, .75)
        }

        .text-white\/80 {
            color: hsla(0, 0%, 100%, .8)
        }

        .text-white\/85 {
            color: hsla(0, 0%, 100%, .85)
        }

        .underline {
            text-decoration-line: underline
        }

        .decoration-clay {
            text-decoration-color: #b0876b
        }

        .decoration-2 {
            text-decoration-thickness: 2px
        }

        .underline-offset-4 {
            text-underline-offset: 4px
        }

        .antialiased {
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale
        }

        .opacity-30 {
            opacity: .3
        }

        .opacity-90 {
            opacity: .9
        }

        .shadow-lg {
            --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);
            --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color)
        }

        .shadow-lg,
        .shadow-sm {
            box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
        }

        .shadow-sm {
            --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
            --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color)
        }

        .shadow-xl {
            --tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);
            --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
            box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
        }

        .transition-all {
            transition-property: all;
            transition-timing-function: cubic-bezier(.4, 0, .2, 1);
            transition-duration: .15s
        }

        .ease-in-out {
            transition-timing-function: cubic-bezier(.4, 0, .2, 1)
        }

        @keyframes marquee {
            to {
                transform: translateX(-50%)
            }
        }

        @keyframes floaty {

            0%,
            to {
                transform: translateY(0)
            }

            50% {
                transform: translateY(-14px)
            }
        }

        @keyframes wiggle {

            0%,
            to {
                transform: rotate(-4deg)
            }

            50% {
                transform: rotate(4deg)
            }
        }

        @keyframes spin {
            to {
                transform: rotate(1turn)
            }
        }

        @media (prefers-reduced-motion:reduce) {
            html {
                scroll-behavior: auto
            }

            .reveal {
                opacity: 1;
                transform: none;
                transition: none
            }

            .float-slow,
            .float-slower,
            .marquee,
            .spin-slow,
            .wiggle {
                animation: none !important
            }

            .btn,
            .card,
            .chip,
            .icon-blob {
                transition: none !important
            }

            .btn:hover,
            .card:hover,
            .chip:hover {
                transform: none !important
            }
        }

        .hover\:gap-3:hover {
            gap: .75rem
        }

        .hover\:bg-white\/10:hover {
            background-color: hsla(0, 0%, 100%, .1)
        }

        .hover\:bg-white\/15:hover {
            background-color: hsla(0, 0%, 100%, .15)
        }

        .hover\:text-sage-deep:hover {
            --tw-text-opacity: 1;
            color: rgb(76 91 63/var(--tw-text-opacity, 1))
        }

        .hover\:text-white:hover {
            --tw-text-opacity: 1;
            color: rgb(255 255 255/var(--tw-text-opacity, 1))
        }

        .hover\:opacity-100:hover {
            opacity: 1
        }

        .focus\:not-sr-only:focus {
            position: static;
            width: auto;
            height: auto;
            padding: 0;
            margin: 0;
            overflow: visible;
            clip: auto;
            white-space: normal
        }

        .focus\:absolute:focus {
            position: absolute
        }

        .focus\:left-4:focus {
            left: 1rem
        }

        .focus\:top-4:focus {
            top: 1rem
        }

        .focus\:z-\[70\]:focus {
            z-index: 70
        }

        .focus\:rounded-full:focus {
            border-radius: 9999px
        }

        .focus\:bg-sage-deep:focus {
            --tw-bg-opacity: 1;
            background-color: rgb(76 91 63/var(--tw-bg-opacity, 1))
        }

        .focus\:px-5:focus {
            padding-left: 1.25rem;
            padding-right: 1.25rem
        }

        .focus\:py-2:focus {
            padding-top: .5rem;
            padding-bottom: .5rem
        }

        .focus\:text-sm:focus {
            font-size: .875rem;
            line-height: 1.25rem
        }

        .focus\:text-white:focus {
            --tw-text-opacity: 1;
            color: rgb(255 255 255/var(--tw-text-opacity, 1))
        }

        @media (min-width:640px) {
            .sm\:block {
                display: block
            }

            .sm\:inline-flex {
                display: inline-flex
            }

            .sm\:h-\[68px\] {
                height: 82px
            }

            .sm\:grid-cols-2 {
                grid-template-columns: repeat(2, minmax(0, 1fr))
            }

            .sm\:grid-cols-3 {
                grid-template-columns: repeat(3, minmax(0, 1fr))
            }

            .sm\:flex-row {
                flex-direction: row
            }

            .sm\:w-auto {
                width: auto
            }
        }

        @media (min-width:768px) {
            .md\:mx-0 {
                margin-left: 0;
                margin-right: 0
            }

            .md\:block {
                display: block
            }

            .md\:grid-cols-2 {
                grid-template-columns: repeat(2, minmax(0, 1fr))
            }

            .md\:grid-cols-3 {
                grid-template-columns: repeat(3, minmax(0, 1fr))
            }

            .md\:flex-row {
                flex-direction: row
            }

            .md\:items-end {
                align-items: flex-end
            }

            .md\:items-center {
                align-items: center
            }

            .md\:justify-between {
                justify-content: space-between
            }

            .md\:p-14 {
                padding: 3.5rem
            }

            .md\:px-16 {
                padding-left: 4rem;
                padding-right: 4rem
            }

            .md\:py-20 {
                padding-top: 5rem;
                padding-bottom: 5rem
            }

            .md\:py-32 {
                padding-top: 8rem;
                padding-bottom: 8rem
            }

            .md\:text-left {
                text-align: left
            }
        }

        @media (min-width:1024px) {
            .lg\:sticky {
                position: sticky
            }

            .lg\:top-28 {
                top: 7rem
            }

            .lg\:order-1 {
                order: 1
            }

            .lg\:order-2 {
                order: 2
            }

            .lg\:flex {
                display: flex
            }

            .lg\:hidden {
                display: none
            }

            .lg\:grid-cols-2 {
                grid-template-columns: repeat(2, minmax(0, 1fr))
            }

            .lg\:grid-cols-\[0\.9fr_1\.1fr\] {
                grid-template-columns: .9fr 1.1fr
            }

            .lg\:items-start {
                align-items: flex-start
            }

            .lg\:items-center {
                align-items: center
            }
        }

        @media (min-width:1280px) {
            .xl\:inline-flex {
                display: inline-flex
            }
        }

        @media (min-width:1024px) {
            .lg\:block {
                display: block
            }
        }

        .cta-mobile {
            display: none
        }

        @media (max-width:639px) {
            .cta-mobile {
                display: inline-flex
            }
        }

/* ============================================================
   Interior page system — added for multi-page build
   ============================================================ */

.navlink.is-current {
    color: var(--sage-deep);
    background: var(--sage-tint)
}

#site-header.is-light .navlink.is-current {
    color: #fff;
    background: hsla(0, 0%, 100%, .18)
}

/* --- Page hero --- */
.page-hero {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-top: -78px;
    padding-top: 78px;
    min-height: 60svh
}

.page-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.page-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(35, 42, 27, .62), rgba(38, 46, 30, .42) 40%, rgba(43, 52, 34, .78))
}

.page-hero__inner {
    position: relative;
    z-index: 2;
    padding-block: clamp(3.5rem, 8vw, 6rem)
}

.eyebrow--light {
    background: hsla(0, 0%, 100%, .16);
    border-color: hsla(0, 0%, 100%, .42);
    color: #fff;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px)
}

.eyebrow--light i {
    color: var(--butter)
}

.crumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    font-size: .82rem;
    font-weight: 700;
    color: hsla(0, 0%, 100%, .72)
}

.crumb a:hover {
    color: #fff;
    text-decoration: underline
}

.crumb i {
    font-size: .6rem;
    opacity: .7
}

/* --- Check lists --- */
.check-list {
    display: grid;
    gap: .8rem
}

.check-list li {
    position: relative;
    padding-left: 2rem;
    font-weight: 600;
    color: var(--muted)
}

.check-list li:before {
    content: "\f00c";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    top: .1em;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 1.35rem;
    width: 1.35rem;
    border-radius: 999px;
    background: var(--sage-tint);
    color: var(--sage-deep);
    font-size: .7rem
}

.check-list--light li {
    color: hsla(0, 0%, 100%, .86)
}

.check-list--light li:before {
    background: hsla(0, 0%, 100%, .2);
    color: var(--butter)
}

/* --- Alternating service block --- */
.svc-block {
    scroll-margin-top: 108px
}

.svc-media {
    position: relative;
    aspect-ratio: 4/3;
    width: 100%;
    overflow: hidden;
    border: 2px solid rgba(124, 140, 106, .25);
    box-shadow: 0 24px 48px -28px rgba(43, 46, 32, .45)
}

.svc-media img {
    height: 100%;
    width: 100%;
    object-fit: cover
}

.svc-tag {
    position: absolute;
    left: 1.25rem;
    bottom: 1.25rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    border-radius: 999px;
    background: hsla(0, 0%, 100%, .94);
    padding: .5rem 1.05rem;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--sage-deep);
    box-shadow: 0 10px 24px -12px rgba(43, 46, 32, .5)
}

/* --- Frequency / info tiles --- */
.tile {
    border-radius: 1.75rem;
    border: 2px solid var(--line);
    background: #fff;
    padding: 1.75rem;
    transition: transform .35s cubic-bezier(.2, .7, .2, 1), border-color .35s ease, box-shadow .35s ease
}

.tile:hover {
    transform: translateY(-6px);
    border-color: var(--sage-bright);
    box-shadow: 0 30px 54px -30px rgba(43, 46, 32, .34)
}

.tile--feature {
    background: var(--sage-deep);
    border-color: var(--sage-deep);
    color: #fff
}

.tile--feature .h3,
.tile--feature .tile__label {
    color: #fff
}

.tile__label {
    display: block;
    font-size: .74rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--clay-deep)
}

/* --- CTA band --- */
.cta-band {
    position: relative;
    overflow: hidden;
    background: var(--sage-deep);
    color: #fff
}

.cta-band .h2 {
    color: #fff
}

.cta-band .h2 em {
    color: var(--butter)
}

/* --- small utilities the compiled build lacks --- */
.text-left {
    text-align: left
}

.pt-2 {
    padding-top: .5rem
}

.mt-2 {
    margin-top: .5rem
}

@media (min-width:1024px) {
    .lg\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .lg\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .lg\:text-left {
        text-align: left
    }
}

.max-w-4xl {
    max-width: 56rem
}

.max-w-5xl {
    max-width: 64rem
}

.mt-7 {
    margin-top: 1.75rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-4 {
    margin-bottom: 1rem
}

.p-5 {
    padding: 1.25rem
}

.grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr))
}

.leading-relaxed {
    line-height: 1.625
}

@media (min-width:640px) {
    .sm\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }
}

@media (min-width:768px) {
    .md\:col-span-2 {
        grid-column: span 2 / span 2
    }
}

@media (min-width:640px) {
    .sm\:flex-wrap {
        flex-wrap: wrap
    }
}

/* hero + CTA band typography on dark grounds */
.page-hero .display {
    color: #fff
}

.page-hero .display em {
    color: var(--butter)
}

.page-hero .lead {
    color: hsla(0, 0%, 100%, .88)
}

.cta-band .lead {
    color: hsla(0, 0%, 100%, .85)
}

.cta-band__fine {
    color: hsla(0, 0%, 100%, .7)
}

/* ============================================================
   Dropdown navigation (desktop) + drawer submenus (mobile)
   ============================================================ */

.navitem {
    position: relative
}

.navitem>.navlink {
    display: inline-flex;
    align-items: center;
    gap: .4rem
}

.navitem>.navlink .nav-chev {
    font-size: .62rem;
    transition: transform .25s ease
}

.navitem:hover>.navlink .nav-chev,
.navitem:focus-within>.navlink .nav-chev {
    transform: rotate(180deg)
}

.drop {
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%) translateY(10px);
    min-width: 18rem;
    padding: .6rem;
    background: #fff;
    border: 2px solid var(--line);
    border-radius: 1.35rem;
    box-shadow: 0 4px 8px rgba(43, 46, 32, .05), 0 28px 52px -26px rgba(43, 46, 32, .42);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .22s ease, transform .22s ease, visibility .22s;
    z-index: 60
}

.drop:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -14px;
    height: 14px
}

.navitem:hover>.drop,
.navitem:focus-within>.drop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0)
}

.drop a {
    display: block;
    border-radius: .95rem;
    padding: .62rem .9rem;
    font-size: .95rem;
    font-weight: 700;
    color: var(--muted);
    transition: background-color .2s ease, color .2s ease
}

.drop a small {
    display: block;
    font-size: .76rem;
    font-weight: 600;
    color: var(--muted);
    opacity: .75;
    margin-top: .1rem
}

.drop a:hover,
.drop a.is-current {
    background: var(--sage-tint);
    color: var(--sage-deep)
}

.drop a:hover small,
.drop a.is-current small {
    color: var(--sage-deep)
}

.drop__sep {
    height: 2px;
    margin: .45rem .6rem;
    background: var(--line)
}

/* --- mobile drawer groups --- */
.drawer-group__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    padding: .875rem 0;
    text-align: left;
    font-weight: 700;
    color: var(--ink)
}

.drawer-group__chev {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 1.9rem;
    width: 1.9rem;
    flex-shrink: 0;
    border-radius: 999px;
    background: var(--sage-tint);
    color: var(--sage-deep);
    font-size: .7rem;
    transition: transform .3s ease, background-color .3s ease, color .3s ease
}

.drawer-group.is-open .drawer-group__chev {
    transform: rotate(180deg);
    background: var(--sage-deep);
    color: #fff
}

.drawer-group__panel {
    overflow: hidden;
    max-height: 0;
    transition: max-height .35s ease
}

.drawer-group__panel a {
    display: block;
    padding: .55rem 0 .55rem 1.1rem;
    font-size: .95rem;
    font-weight: 600;
    color: var(--muted);
    border-left: 2px solid var(--line);
    margin-left: .25rem
}

.drawer-group__panel a:last-child {
    padding-bottom: .9rem
}

.drawer-group__panel a.is-current {
    color: var(--sage-deep);
    border-left-color: var(--sage-bright)
}

.py-2 {
    padding-top: .5rem;
    padding-bottom: .5rem
}

/* WFP honeypot — off-screen, not display:none (some bots skip hidden fields) */
.hp-field {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden
}
:root {
    --c2s-header-h: 78px
}

#site-header>.wrap {
    height: var(--c2s-header-h)
}

#site-header .wrap img {
    height: 56px;
    width: auto
}

@media (min-width:640px) {
    #site-header .wrap img {
        height: 68px
    }
}

/* Both heroes sit under the transparent header by exactly its height. */
#top,
.page-hero {
    margin-top: calc(var(--c2s-header-h) * -1);
    padding-top: var(--c2s-header-h)
}