

/* Start:/local/templates/textile_design/styles.css?179300635654186*/
@font-face {
    font-family:Cormorant Garamond;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/5df2c4de2f58cfb3-s.woff2) format("woff2");
    unicode-range:u+0460-052f,
    u+1c80-1c8a,
    u+20b4,
    u+2de0-2dff,
    u+a640-a69f,
    u+fe2e-fe2f
}
@font-face {
    font-family:Cormorant Garamond;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/12a1dde4187545ae-s.woff2) format("woff2");
    unicode-range:u+0301,
    u+0400-045f,
    u+0490-0491,
    u+04b0-04b1,
    u+2116
}
@font-face {
    font-family:Cormorant Garamond;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/74310ce3beca545c-s.woff2) format("woff2");
    unicode-range:u+0102-0103,
    u+0110-0111,
    u+0128-0129,
    u+0168-0169,
    u+01a0-01a1,
    u+01af-01b0,
    u+0300-0301,
    u+0303-0304,
    u+0308-0309,
    u+0323,
    u+0329,
    u+1ea0-1ef9,
    u+20ab
}
@font-face {
    font-family:Cormorant Garamond;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/e78433f876ea8e1e-s.woff2) format("woff2");
    unicode-range:u+0100-02ba,
    u+02bd-02c5,
    u+02c7-02cc,
    u+02ce-02d7,
    u+02dd-02ff,
    u+0304,
    u+0308,
    u+0329,
    u+1d00-1dbf,
    u+1e00-1e9f,
    u+1ef2-1eff,
    u+2020,
    u+20a0-20ab,
    u+20ad-20c0,
    u+2113,
    u+2c60-2c7f,
    u+a720-a7ff
}
@font-face {
    font-family:Cormorant Garamond;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/1ecca39927ee9e6f-s.woff2) format("woff2");
    unicode-range:u+00??,
    u+0131,
    u+0152-0153,
    u+02bb-02bc,
    u+02c6,
    u+02da,
    u+02dc,
    u+0304,
    u+0308,
    u+0329,
    u+2000-206f,
    u+20ac,
    u+2122,
    u+2191,
    u+2193,
    u+2212,
    u+2215,
    u+feff,
    u+fffd
}
@font-face {
    font-family:Cormorant Garamond Fallback;
    src:local("Times New Roman");
    ascent-override:95.27%;
    descent-override:29.59%;
    line-gap-override:0.00%;
    size-adjust:96.98%
}
.__className_e19d42 {
    font-family:Cormorant Garamond,Cormorant Garamond Fallback;
    font-weight:400;
    font-style:normal
}
.__variable_e19d42 {
    --font-display:"Cormorant Garamond","Cormorant Garamond Fallback"
}
@font-face {
    font-family:Nunito;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/7aee33724f9914b8-s.woff2) format("woff2");
    unicode-range:u+0460-052f,
    u+1c80-1c8a,
    u+20b4,
    u+2de0-2dff,
    u+a640-a69f,
    u+fe2e-fe2f
}
@font-face {
    font-family:Nunito;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/d5f73098666dfe7c-s.woff2) format("woff2");
    unicode-range:u+0301,
    u+0400-045f,
    u+0490-0491,
    u+04b0-04b1,
    u+2116
}
@font-face {
    font-family:Nunito;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/f068115fe49eff41-s.woff2) format("woff2");
    unicode-range:u+0102-0103,
    u+0110-0111,
    u+0128-0129,
    u+0168-0169,
    u+01a0-01a1,
    u+01af-01b0,
    u+0300-0301,
    u+0303-0304,
    u+0308-0309,
    u+0323,
    u+0329,
    u+1ea0-1ef9,
    u+20ab
}
@font-face {
    font-family:Nunito;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/d998f6ec04a76178-s.woff2) format("woff2");
    unicode-range:u+0100-02ba,
    u+02bd-02c5,
    u+02c7-02cc,
    u+02ce-02d7,
    u+02dd-02ff,
    u+0304,
    u+0308,
    u+0329,
    u+1d00-1dbf,
    u+1e00-1e9f,
    u+1ef2-1eff,
    u+2020,
    u+20a0-20ab,
    u+20ad-20c0,
    u+2113,
    u+2c60-2c7f,
    u+a720-a7ff
}
@font-face {
    font-family:Nunito;
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/static/media/21e3314edf876f32-s.woff2) format("woff2");
    unicode-range:u+00??,
    u+0131,
    u+0152-0153,
    u+02bb-02bc,
    u+02c6,
    u+02da,
    u+02dc,
    u+0304,
    u+0308,
    u+0329,
    u+2000-206f,
    u+20ac,
    u+2122,
    u+2191,
    u+2193,
    u+2212,
    u+2215,
    u+feff,
    u+fffd
}
@font-face {
    font-family:Nunito Fallback;
    src:local("Arial");
    ascent-override:99.71%;
    descent-override:34.82%;
    line-gap-override:0.00%;
    size-adjust:101.39%
}
.__className_665ebc {
    font-family:Nunito,Nunito Fallback;
    font-weight:400;
    font-style:normal
}
.__variable_665ebc {
    --font-body:"Nunito","Nunito Fallback"
}

/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
@layer properties {
    @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {
        *,
        ::backdrop,
        :after,
        :before {
            --tw-translate-x:0;
            --tw-translate-y:0;
            --tw-translate-z:0;
            --tw-rotate-x:initial;
            --tw-rotate-y:initial;
            --tw-rotate-z:initial;
            --tw-skew-x:initial;
            --tw-skew-y:initial;
            --tw-leading:initial;
            --tw-font-weight:initial;
            --tw-tracking:initial;
            --tw-shadow:0 0 #0000;
            --tw-shadow-color:initial;
            --tw-shadow-alpha:100%;
            --tw-inset-shadow:0 0 #0000;
            --tw-inset-shadow-color:initial;
            --tw-inset-shadow-alpha:100%;
            --tw-ring-color:initial;
            --tw-ring-shadow:0 0 #0000;
            --tw-inset-ring-color:initial;
            --tw-inset-ring-shadow:0 0 #0000;
            --tw-ring-inset:initial;
            --tw-ring-offset-width:0px;
            --tw-ring-offset-color:#fff;
            --tw-ring-offset-shadow:0 0 #0000;
            --tw-outline-style:solid;
            --tw-blur:initial;
            --tw-brightness:initial;
            --tw-contrast:initial;
            --tw-grayscale:initial;
            --tw-hue-rotate:initial;
            --tw-invert:initial;
            --tw-opacity:initial;
            --tw-saturate:initial;
            --tw-sepia:initial;
            --tw-drop-shadow:initial;
            --tw-drop-shadow-color:initial;
            --tw-drop-shadow-alpha:100%;
            --tw-drop-shadow-size:initial;
            --tw-duration:initial;
            --tw-content:"";
            --tw-ease:initial;
            --tw-scale-x:1;
            --tw-scale-y:1;
            --tw-scale-z:1
        }
    }
}
@layer theme {
    :host,
    :root {
        --font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
        --font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
        --spacing:.25rem;
        --container-2xl:42rem;
        --tracking-wide:.025em;
        --radius-sm:.375rem;
        --radius-md:.75rem;
        --radius-lg:1.25rem;
        --default-transition-duration:.15s;
        --default-transition-timing-function:cubic-bezier(.4,0,.2,1);
        --default-font-family:var(--font-sans);
        --default-mono-font-family:var(--font-mono);
        --color-primary:#8b6f5e;
        --color-secondary:#c9aa8e;
        --color-accent:#d4956a;
        --color-background:#faf7f2;
        --color-foreground:#2e2218;
        --color-muted:#e8ddd3;
        --color-surface:#faf7f2;
        --color-surface-dark:#2e2218;
        --color-surface-muted:#e8ddd3;
        --color-border:#ddd0c4;
        --color-border-strong:#c9aa8e;
        --color-text-light:#faf7f2;
        --color-text-subdued:#a08878;
        --font-display:"Cormorant Garamond","Georgia",serif;
        --font-body:"Nunito","Helvetica Neue",sans-serif;
        --spacing-section:clamp(5rem,10vw,8rem);
        --spacing-section-sm:clamp(3rem,6vw,5rem);
        --spacing-block:clamp(1.5rem,3vw,2.5rem);
        --container-max:1200px;
        --container-narrow:740px;
        --shadow-soft:0 4px 24px #8b6f5e1a;
        --shadow-medium:0 8px 40px #8b6f5e29;
        --shadow-strong:0 16px 56px #8b6f5e38;
        --shadow-card:0 2px 12px #2e221814;
        --z-base:1;
        --z-raised:10;
        --z-overlay:50;
        --z-header:100;
        --z-modal:200;
        --radius-full:9999px;
        --ease-gentle:cubic-bezier(.25,.46,.45,.94);
        --ease-spring:cubic-bezier(.34,1.56,.64,1);
        --ease-out-soft:cubic-bezier(.16,1,.3,1)
    }
}
@layer base {
    *,
    ::backdrop,
    :after,
    :before {
        box-sizing:border-box;
        border:0 solid;
        margin:0;
        padding:0
    }
    ::file-selector-button {
        box-sizing:border-box;
        border:0 solid;
        margin:0;
        padding:0
    }
    :host,
    html {
        -webkit-text-size-adjust:100%;
        tab-size:4;
        line-height:1.5;
        font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");
        font-feature-settings:var(--default-font-feature-settings,normal);
        font-variation-settings:var(--default-font-variation-settings,normal);
        -webkit-tap-highlight-color:transparent
    }
    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 {
        -webkit-text-decoration:inherit;
        text-decoration:inherit
    }
    b,
    strong {
        font-weight:bolder
    }
    code,
    kbd,
    pre,
    samp {
        font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);
        font-feature-settings:var(--default-mono-font-feature-settings,normal);
        font-variation-settings:var(--default-mono-font-variation-settings,normal);
        font-size:1em
    }
    small {
        font-size:80%
    }
    sub,
    sup {
        vertical-align:baseline;
        font-size:75%;
        line-height:0;
        position:relative
    }
    sub {
        bottom:-.25em
    }
    sup {
        top:-.5em
    }
    table {
        text-indent:0;
        border-color:inherit;
        border-collapse:collapse
    }
    :-moz-focusring {
        outline:auto
    }
    progress {
        vertical-align:baseline
    }
    summary {
        display:list-item
    }
    menu,
    ol,
    ul {
        list-style:none
    }
    audio,
    canvas,
    embed,
    iframe,
    img,
    object,
    svg,
    video {
        vertical-align:middle;
        display:block
    }
    button,
    input,
    optgroup,
    select,
    textarea {
        font:inherit;
        font-feature-settings:inherit;
        font-variation-settings:inherit;
        letter-spacing:inherit;
        color:inherit;
        opacity:1;
        background-color:#0000;
        border-radius:0
    }
    ::file-selector-button {
        font:inherit;
        font-feature-settings:inherit;
        font-variation-settings:inherit;
        letter-spacing:inherit;
        color:inherit;
        opacity:1;
        background-color:#0000;
        border-radius:0
    }
    :where(select:is([multiple],
  [size])) optgroup {
        font-weight:bolder
    }
    :where(select:is([multiple],
  [size])) optgroup option {
        padding-inline-start:20px
    }
    ::file-selector-button {
        margin-inline-end:4px
    }
    ::placeholder {
        opacity:1
    }
    @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
        ::placeholder {
            color:currentColor
        }
        @supports (color:color-mix(in lab,red,red)) {
            ::placeholder {
                color:color-mix(in oklab,currentcolor 50%,transparent)
            }
        }
    }
    textarea {
        resize:vertical
    }
    ::-webkit-search-decoration {
        -webkit-appearance:none
    }
    ::-webkit-date-and-time-value {
        min-height:1lh;
        text-align:inherit
    }
    ::-webkit-datetime-edit {
        display:inline-flex
    }
    ::-webkit-datetime-edit-fields-wrapper {
        padding:0
    }
    ::-webkit-datetime-edit,
    ::-webkit-datetime-edit-year-field {
        padding-block:0
    }
    ::-webkit-datetime-edit-day-field,
    ::-webkit-datetime-edit-month-field {
        padding-block:0
    }
    ::-webkit-datetime-edit-hour-field,
    ::-webkit-datetime-edit-minute-field {
        padding-block:0
    }
    ::-webkit-datetime-edit-millisecond-field,
    ::-webkit-datetime-edit-second-field {
        padding-block:0
    }
    ::-webkit-datetime-edit-meridiem-field {
        padding-block:0
    }
    ::-webkit-calendar-picker-indicator {
        line-height:1
    }
    :-moz-ui-invalid {
        box-shadow:none
    }
    button,
    input:where([type=button],
  [type=reset],
  [type=submit]) {
        appearance:button
    }
    ::file-selector-button {
        appearance:button
    }
    ::-webkit-inner-spin-button,
    ::-webkit-outer-spin-button {
        height:auto
    }
    [hidden]:where(:not([hidden=until-found])) {
        display:none!important
    }
    *,
    :after,
    :before {
        box-sizing:border-box
    }
    html {
        scroll-behavior:smooth;
        -webkit-font-smoothing:antialiased;
        -moz-osx-font-smoothing:grayscale;
        text-rendering:optimizeLegibility
    }
    body {
        font-family:var(--font-body);
        background-color:var(--color-background);
        color:var(--color-foreground);
        font-size:1rem;
        font-weight:400;
        line-height:1.7;
        overflow-x:hidden
    }
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-family:var(--font-display);
        margin:0;
        font-weight:400;
        line-height:1.15
    }
    p {
        margin:0
    }
    a {
        color:inherit;
        text-decoration:none
    }
    img,
    video {
        max-width:100%;
        height:auto;
        display:block
    }
    button {
        cursor:pointer;
        background:0 0;
        border:none
    }
    button,
    input,
    select,
    textarea {
        font-family:var(--font-body)
    }
    ::selection {
        background-color:var(--color-secondary);
        color:var(--color-foreground)
    }
}
@layer components {
    .bg-surface {
        background-color:var(--color-surface);
        color:var(--color-foreground)
    }
    .bg-surface-dark {
        background-color:var(--color-surface-dark);
        color:var(--color-text-light)
    }
    .bg-surface-muted {
        background-color:var(--color-surface-muted);
        color:var(--color-foreground)
    }
    .bg-surface-accent {
        background-color:var(--color-accent);
        color:var(--color-text-light)
    }
    .bg-surface-secondary {
        background-color:var(--color-secondary);
        color:var(--color-foreground)
    }
    .texture-weave {
        position:relative
    }
    .texture-weave:before {
        content:"";
        pointer-events:none;
        z-index:0;
        background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Crect width='12' height='12' fill='none'/%3E%3Cpath d='M0 3h3v3H0zM3 0h3v3H3zM6 3h3v3H6zM9 0h3v3H9zM0 9h3v3H0zM3 6h3v3H3zM6 9h3v3H6zM9 6h3v3H9z' fill='%238B6F5E' opacity='0.07'/%3E%3C/svg%3E");
        background-repeat:repeat;
        background-size:12px 12px;
        position:absolute;
        inset:0
    }
    .texture-weave>* {
        z-index:1
    }
    .texture-weave-dark,
    .texture-weave>* {
        position:relative
    }
    .texture-weave-dark:before {
        content:"";
        pointer-events:none;
        z-index:0;
        background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Crect width='12' height='12' fill='none'/%3E%3Cpath d='M0 3h3v3H0zM3 0h3v3H3zM6 3h3v3H6zM9 0h3v3H9zM0 9h3v3H0zM3 6h3v3H3zM6 9h3v3H6zM9 6h3v3H9z' fill='%23C9AA8E' opacity='0.06'/%3E%3C/svg%3E");
        background-repeat:repeat;
        background-size:12px 12px;
        position:absolute;
        inset:0
    }
    .texture-weave-dark>* {
        z-index:1;
        position:relative
    }
    .texture-grain {
        position:relative
    }
    .texture-grain:after {
        content:"";
        opacity:.5;
        pointer-events:none;
        mix-blend-mode:multiply;
        z-index:0;
        background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
        background-repeat:repeat;
        background-size:200px 200px;
        position:absolute;
        inset:0
    }
    .texture-grain>* {
        z-index:1;
        position:relative
    }
    .text-hero {
        font-size:clamp(2.6rem,6vw,4.5rem);
        line-height:1.1
    }
    .text-display,
    .text-hero {
        font-family:var(--font-display);
        letter-spacing:-.01em;
        font-weight:400
    }
    .text-display {
        font-size:clamp(2rem,4vw,3.5rem);
        line-height:1.12
    }
    .text-section {
        font-size:clamp(1.75rem,3.5vw,2.75rem);
        line-height:1.2
    }
    .text-section,
    .text-subsection {
        font-family:var(--font-display);
        font-weight:400
    }
    .text-subsection {
        font-size:clamp(1.25rem,2.5vw,1.75rem);
        line-height:1.3
    }
    .text-eyebrow {
        color:var(--color-accent)
    }
    .text-eyebrow,
    .text-eyebrow-light {
        font-family:var(--font-body);
        letter-spacing:.18em;
        text-transform:uppercase;
        font-size:.75rem;
        font-weight:600
    }
    .text-eyebrow-light {
        color:var(--color-secondary)
    }
    .text-body {
        color:var(--color-foreground);
        font-size:1rem;
        line-height:1.75
    }
    .text-body,
    .text-lead {
        font-family:var(--font-body);
        font-weight:400
    }
    .text-lead {
        color:var(--color-text-subdued);
        font-size:clamp(1rem,1.5vw,1.125rem);
        line-height:1.8
    }
    .text-small {
        font-family:var(--font-body);
        font-size:.8125rem;
        line-height:1.6
    }
    .text-subdued {
        color:var(--color-text-subdued)
    }
    .text-on-dark {
        color:var(--color-text-light)
    }
    .text-on-dark-subdued {
        color:var(--color-secondary);
        opacity:.8
    }
    .text-quote {
        font-family:var(--font-display);
        font-size:clamp(1.1rem,2vw,1.35rem);
        font-style:italic;
        font-weight:400;
        line-height:1.65
    }
    .text-contact {
        font-family:var(--font-body);
        color:var(--color-text-subdued);
        font-size:.9375rem;
        font-weight:500;
        line-height:1.6
    }
    .section-padding {
        padding-block:var(--spacing-section)
    }
    .section-padding-sm {
        padding-block:var(--spacing-section-sm)
    }
    .block-spacing {
        margin-bottom:var(--spacing-block)
    }
    .container-main {
        max-width:var(--container-max);
        width:100%;
        margin-inline:auto;
        padding-inline:clamp(1.25rem,5vw,4rem)
    }
    .container-narrow {
        max-width:var(--container-narrow);
        width:100%;
        margin-inline:auto;
        padding-inline:clamp(1.25rem,5vw,3rem)
    }
    .grid-2 {
        grid-template-columns:1fr;
        gap:clamp(1.25rem,3vw,2rem);
        display:grid
    }
    @media (min-width:640px) {
        .grid-2 {
            grid-template-columns:repeat(2,1fr)
        }
    }
    .grid-3 {
        grid-template-columns:1fr;
        gap:clamp(1.25rem,3vw,2rem);
        display:grid
    }
    @media (min-width:640px) {
        .grid-3 {
            grid-template-columns:repeat(2,1fr)
        }
    }
    @media (min-width:1024px) {
        .grid-3 {
            grid-template-columns:repeat(3,1fr)
        }
    }
    .grid-4 {
        grid-template-columns:1fr;
        gap:clamp(1.25rem,3vw,1.75rem);
        display:grid
    }
    @media (min-width:640px) {
        .grid-4 {
            grid-template-columns:repeat(2,1fr)
        }
    }
    @media (min-width:1024px) {
        .grid-4 {
            grid-template-columns:repeat(4,1fr)
        }
    }
    .split {
        grid-template-columns:1fr;
        align-items:center;
        gap:clamp(2rem,5vw,4rem);
        display:grid
    }
    @media (min-width:768px) {
        .split {
            grid-template-columns:1fr 1fr
        }
    }
    .split-hero {
        grid-template-columns:1fr;
        align-items:center;
        gap:clamp(2rem,5vw,4rem);
        display:grid
    }
    @media (min-width:1024px) {
        .split-hero {
            grid-template-columns:55fr 45fr
        }
    }
    .split-feature {
        grid-template-columns:1fr;
        align-items:center;
        gap:clamp(2rem,5vw,4rem);
        display:grid
    }
    @media (min-width:1024px) {
        .split-feature {
            grid-template-columns:45fr 55fr
        }
    }
    .split-contact {
        grid-template-columns:1fr;
        align-items:start;
        gap:clamp(2rem,5vw,4rem);
        display:grid
    }
    @media (min-width:1024px) {
        .split-contact {
            grid-template-columns:40fr 60fr
        }
    }
    .card {
        border-radius:var(--radius-md);
        background-color:var(--color-surface);
        box-shadow:var(--shadow-card);
        overflow:hidden
    }
    .card-body {
        padding:clamp(1.25rem,3vw,2rem)
    }
    .btn {
        font-family:var(--font-body);
        letter-spacing:.06em;
        text-transform:uppercase;
        border-radius:var(--radius-full);
        cursor:pointer;
        transition:transform .25s var(--ease-spring),box-shadow .25s var(--ease-gentle),background-color .2s ease,opacity .2s ease;
        white-space:nowrap;
        border:none;
        justify-content:center;
        align-items:center;
        gap:.5rem;
        padding:.875rem 2.25rem;
        font-size:.875rem;
        font-weight:600;
        display:inline-flex
    }
    .btn-primary {
        background-color:var(--color-accent);
        color:var(--color-text-light);
        box-shadow:0 2px 12px #d4956a59
    }
    .btn-primary:hover {
        background-color:#c88558;
        transform:translateY(-3px);
        box-shadow:0 8px 28px #d4956a73
    }
    .btn-primary:active {
        transform:translateY(-1px)
    }
    .btn-outline {
        color:var(--color-foreground);
        border:1.5px solid var(--color-border-strong);
        background-color:#0000
    }
    .btn-outline:hover {
        background-color:var(--color-muted);
        box-shadow:var(--shadow-soft);
        transform:translateY(-2px)
    }
    .btn-outline-light {
        color:var(--color-text-light);
        background-color:#0000;
        border:1.5px solid #c9aa8e80
    }
    .btn-outline-light:hover {
        border-color:var(--color-secondary);
        background-color:#c9aa8e1f;
        transform:translateY(-2px)
    }
    .form-field {
        flex-direction:column;
        gap:.375rem;
        display:flex
    }
    .form-label {
        letter-spacing:.06em;
        text-transform:uppercase;
        color:var(--color-text-subdued);
        font-size:.8125rem;
        font-weight:600
    }
    .form-input,
    .form-label {
        font-family:var(--font-body)
    }
    .form-input {
        width:100%;
        color:var(--color-foreground);
        background-color:var(--color-surface);
        border:1.5px solid var(--color-border);
        border-radius:var(--radius-sm);
        outline:none;
        padding:.875rem 1.125rem;
        font-size:.9375rem;
        transition:border-color .2s,box-shadow .2s
    }
    .form-input::placeholder {
        color:var(--color-text-subdued);
        opacity:.7
    }
    .form-input:focus {
        border-color:var(--color-secondary);
        box-shadow:0 0 0 3px #c9aa8e33
    }
    .form-textarea {
        resize:vertical;
        min-height:130px
    }
    .divider-accent {
        background-color:var(--color-accent);
        border:none;
        border-radius:1px;
        width:3rem;
        height:2px
    }
    .divider-wide {
        background:linear-gradient(90deg,var(--color-accent),transparent);
        border:none;
        width:6rem;
        height:1px
    }
    .divider-full {
        background-color:var(--color-border)
    }
    .divider-full,
    .divider-full-dark {
        border:none;
        width:100%;
        height:1px
    }
    .divider-full-dark {
        background-color:#c9aa8e26
    }
    .hover-lift {
        transition:transform .3s var(--ease-spring),box-shadow .3s var(--ease-gentle)
    }
    .hover-lift:hover {
        box-shadow:var(--shadow-medium);
        transform:translateY(-6px)
    }
    .hover-lift-sm {
        transition:transform .25s var(--ease-spring)
    }
    .hover-lift-sm:hover {
        transform:translateY(-3px)
    }
    .hover-glow {
        transition:box-shadow .3s var(--ease-gentle)
    }
    .hover-glow:hover {
        box-shadow:var(--shadow-strong)
    }
    .hover-scale {
        transition:transform .3s var(--ease-spring)
    }
    .hover-scale:hover {
        transform:scale(1.03)
    }
    .hover-zoom {
        transition:transform .5s var(--ease-gentle)
    }
    .hover-zoom:hover {
        transform:scale(1.06)
    }
    .transition-fast {
        transition:all .15s
    }
    .transition-default {
        transition:all .3s var(--ease-gentle)
    }
    .transition-slow {
        transition:all .55s var(--ease-out-soft)
    }
    .border-subtle {
        border:1px solid var(--color-border)
    }
    .border-medium {
        border:1.5px solid var(--color-border-strong)
    }
    .border-strong {
        border:2px solid var(--color-secondary)
    }
    .border-accent-line {
        border:2px solid var(--color-accent)
    }
    .radius-sm {
        border-radius:var(--radius-sm)
    }
    .radius-md {
        border-radius:var(--radius-md)
    }
    .radius-lg {
        border-radius:var(--radius-lg)
    }
    .radius-full {
        border-radius:var(--radius-full)
    }
    .z-base {
        z-index:var(--z-base)
    }
    .z-raised {
        z-index:var(--z-raised)
    }
    .z-overlay {
        z-index:var(--z-overlay)
    }
    .z-header {
        z-index:var(--z-header)
    }
    .z-modal {
        z-index:var(--z-modal)
    }
    .animate-fade-in {
        animation:fadeIn .6s var(--ease-gentle)both
    }
    .animate-slide-up {
        animation:slideUp .7s var(--ease-out-soft)both
    }
    .animate-slide-down {
        animation:slideDown .6s var(--ease-out-soft)both
    }
    .animate-slide-left {
        animation:slideLeft .7s var(--ease-out-soft)both
    }
    .animate-slide-right {
        animation:slideRight .7s var(--ease-out-soft)both
    }
    .animate-scale-in {
        animation:scaleFadeIn .6s var(--ease-spring)both
    }
    .animate-pulse-subtle {
        animation:pulseSubtle 2.5s ease-in-out infinite
    }
    .animate-dot-grow {
        animation:dotGrow .4s var(--ease-spring)both
    }
    .delay-100 {
        animation-delay:.1s
    }
    .delay-200 {
        animation-delay:.2s
    }
    .delay-300 {
        animation-delay:.3s
    }
    .delay-400 {
        animation-delay:.4s
    }
    .delay-500 {
        animation-delay:.5s
    }
    .delay-600 {
        animation-delay:.6s
    }
    .delay-700 {
        animation-delay:.7s
    }
    .delay-800 {
        animation-delay:.8s
    }
    .is-hidden {
        opacity:0;
        pointer-events:none
    }
    .is-visible {
        opacity:1;
        pointer-events:auto
    }
    .is-hidden.cross-fade,
    .is-visible.cross-fade {
        transition:opacity .6s var(--ease-gentle);
        position:absolute;
        inset:0
    }
    .img-wrapper {
        border-radius:inherit;
        overflow:hidden
    }
    .aspect-card {
        aspect-ratio:5/4
    }
    .aspect-portrait {
        aspect-ratio:4/5
    }
    .aspect-square {
        aspect-ratio:1
    }
    .aspect-hero {
        aspect-ratio:16/9
    }
    .img-cover {
        object-fit:cover;
        object-position:center
    }
    .img-cover,
    .img-fill {
        width:100%;
        height:100%
    }
    .img-fill {
        object-fit:fill
    }
    .deco-quote {
        font-family:var(--font-display);
        color:var(--color-secondary);
        opacity:.45;
        -webkit-user-select:none;
        user-select:none;
        pointer-events:none;
        font-size:clamp(5rem,10vw,8rem);
        font-weight:300;
        line-height:.8
    }
    .deco-dot {
        background-color:var(--color-border-strong);
        width:8px;
        height:8px;
        transition:all .3s var(--ease-spring);
        border-radius:50%
    }
    .deco-dot.is-active {
        background-color:var(--color-accent);
        border-radius:4px;
        width:24px
    }
    .avatar-ring {
        border:2.5px solid var(--color-secondary);
        border-radius:50%;
        padding:2px;
        overflow:hidden
    }
    .social-icon {
        width:2.25rem;
        height:2.25rem;
        color:var(--color-secondary);
        border:1.5px solid #c9aa8e4d;
        border-radius:50%;
        justify-content:center;
        align-items:center;
        transition:border-color .25s,color .25s,background-color .25s;
        display:inline-flex
    }
    .social-icon:hover {
        border-color:var(--color-accent);
        color:var(--color-accent);
        background-color:#d4956a1a
    }
    .check-item {
        font-family:var(--font-body);
        color:var(--color-foreground);
        align-items:flex-start;
        gap:.875rem;
        font-size:.9375rem;
        line-height:1.65;
        display:flex
    }
    .check-icon {
        width:1.25rem;
        height:1.25rem;
        color:var(--color-accent);
        flex-shrink:0;
        margin-top:.15em
    }
    .scroll-target {
        scroll-margin-top:5rem
    }
}
@layer utilities {
    .pointer-events-auto {
        pointer-events:auto
    }
    .pointer-events-none {
        pointer-events:none
    }
    .visible {
        visibility:visible
    }
    .absolute {
        position:absolute
    }
    .fixed {
        position:fixed
    }
    .relative {
        position:relative
    }
    .inset-0 {
        inset:calc(var(--spacing)*0)
    }
    .top-0 {
        top:calc(var(--spacing)*0)
    }
    .top-5 {
        top:calc(var(--spacing)*5)
    }
    .right-0 {
        right:calc(var(--spacing)*0)
    }
    .right-6 {
        right:calc(var(--spacing)*6)
    }
    .bottom-0 {
        bottom:calc(var(--spacing)*0)
    }
    .bottom-6 {
        bottom:calc(var(--spacing)*6)
    }
    .left-0 {
        left:calc(var(--spacing)*0)
    }
    .left-6 {
        left:calc(var(--spacing)*6)
    }
    .z-\[var\(--z-modal\)\] {
        z-index:var(--z-modal)
    }
    .z-\[var\(--z-overlay\)\] {
        z-index:var(--z-overlay)
    }
    .container {
        width:100%
    }
    @media (min-width:40rem) {
        .container {
            max-width:40rem
        }
    }
    @media (min-width:48rem) {
        .container {
            max-width:48rem
        }
    }
    @media (min-width:64rem) {
        .container {
            max-width:64rem
        }
    }
    @media (min-width:80rem) {
        .container {
            max-width:80rem
        }
    }
    @media (min-width:96rem) {
        .container {
            max-width:96rem
        }
    }
    .mx-auto {
        margin-inline:auto
    }
    .mt-0\.5 {
        margin-top:calc(var(--spacing)*.5)
    }
    .mt-1 {
        margin-top:calc(var(--spacing)*1)
    }
    .mt-2 {
        margin-top:calc(var(--spacing)*2)
    }
    .mt-6 {
        margin-top:calc(var(--spacing)*6)
    }
    .mt-10 {
        margin-top:calc(var(--spacing)*10)
    }
    .mb-2 {
        margin-bottom:calc(var(--spacing)*2)
    }
    .mb-3 {
        margin-bottom:calc(var(--spacing)*3)
    }
    .mb-6 {
        margin-bottom:calc(var(--spacing)*6)
    }
    .mb-12 {
        margin-bottom:calc(var(--spacing)*12)
    }
    .mb-\[-1rem\] {
        margin-bottom:-1rem
    }
    .block {
        display:block
    }
    .flex {
        display:flex
    }
    .hidden {
        display:none
    }
    .inline-block {
        display:inline-block
    }
    .inline-flex {
        display:inline-flex
    }
    .list-item {
        display:list-item
    }
    .h-10 {
        height:calc(var(--spacing)*10)
    }
    .h-16 {
        height:calc(var(--spacing)*16)
    }
    .h-\[64px\] {
        height:64px
    }
    .h-full {
        height:100%
    }
    .w-10 {
        width:calc(var(--spacing)*10)
    }
    .w-16 {
        width:calc(var(--spacing)*16)
    }
    .w-\[64px\] {
        width:64px
    }
    .w-\[min\(320px\,90vw\)\] {
        width:min(320px,90vw)
    }
    .w-full {
        width:100%
    }
    .max-w-2xl {
        max-width:var(--container-2xl)
    }
    .flex-1 {
        flex:1
    }
    .flex-shrink-0 {
        flex-shrink:0
    }
    .translate-x-0 {
        --tw-translate-x:calc(var(--spacing)*0)
    }
    .translate-x-0,
    .translate-x-full {
        translate:var(--tw-translate-x)var(--tw-translate-y)
    }
    .translate-x-full {
        --tw-translate-x:100%
    }
    .transform {
        transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)
    }
    .cursor-default {
        cursor:default
    }
    .cursor-pointer {
        cursor:pointer
    }
    .flex-col {
        flex-direction:column
    }
    .flex-wrap {
        flex-wrap:wrap
    }
    .items-center {
        align-items:center
    }
    .items-start {
        align-items:flex-start
    }
    .justify-between {
        justify-content:space-between
    }
    .justify-center {
        justify-content:center
    }
    .gap-1 {
        gap:calc(var(--spacing)*1)
    }
    .gap-2 {
        gap:calc(var(--spacing)*2)
    }
    .gap-3 {
        gap:calc(var(--spacing)*3)
    }
    .gap-4 {
        gap:calc(var(--spacing)*4)
    }
    .gap-5 {
        gap:calc(var(--spacing)*5)
    }
    .gap-6 {
        gap:calc(var(--spacing)*6)
    }
    .gap-7 {
        gap:calc(var(--spacing)*7)
    }
    .gap-8 {
        gap:calc(var(--spacing)*8)
    }
    .overflow-hidden {
        overflow:hidden
    }
    .rounded-full {
        border-radius:var(--radius-full)
    }
    .border-none {
        --tw-border-style:none;
        border-style:none
    }
    .bg-\[var\(--color-background\)\] {
        background-color:var(--color-background)
    }
    .bg-\[var\(--color-foreground\)\] {
        background-color:var(--color-foreground)
    }
    .bg-surface {
        background-color:var(--color-surface)
    }
    .bg-surface-dark {
        background-color:var(--color-surface-dark)
    }
    .bg-surface-muted {
        background-color:var(--color-surface-muted)
    }
    .bg-transparent {
        background-color:#0000
    }
    .p-0 {
        padding:calc(var(--spacing)*0)
    }
    .p-5 {
        padding:calc(var(--spacing)*5)
    }
    .p-6 {
        padding:calc(var(--spacing)*6)
    }
    .p-8 {
        padding:calc(var(--spacing)*8)
    }
    .px-4 {
        padding-inline:calc(var(--spacing)*4)
    }
    .px-8 {
        padding-inline:calc(var(--spacing)*8)
    }
    .pt-20 {
        padding-top:calc(var(--spacing)*20)
    }
    .pb-10 {
        padding-bottom:calc(var(--spacing)*10)
    }
    .text-center {
        text-align:center
    }
    .text-\[0\.875rem\] {
        font-size:.875rem
    }
    .text-\[0\.9375rem\] {
        font-size:.9375rem
    }
    .text-\[1\.35rem\] {
        font-size:1.35rem
    }
    .text-\[1\.125rem\]\! {
        font-size:1.125rem!important
    }
    .leading-none {
        --tw-leading:1;
        line-height:1
    }
    .font-\[400\] {
        --tw-font-weight:400;
        font-weight:400
    }
    .font-\[500\] {
        --tw-font-weight:500;
        font-weight:500
    }
    .font-\[var\(--font-display\)\] {
        --tw-font-weight:var(--font-display);
        font-weight:var(--font-display)
    }
    .tracking-wide {
        --tw-tracking:var(--tracking-wide);
        letter-spacing:var(--tracking-wide)
    }
    .text-\[var\(--color-accent\)\] {
        color:var(--color-accent)
    }
    .text-\[var\(--color-foreground\)\] {
        color:var(--color-foreground)
    }
    .text-\[var\(--color-secondary\)\] {
        color:var(--color-secondary)
    }
    .text-\[var\(--color-text-subdued\)\] {
        color:var(--color-text-subdued)
    }
    .uppercase {
        text-transform:uppercase
    }
    .underline {
        text-decoration-line:underline
    }
    .opacity-0 {
        opacity:0
    }
    .opacity-40 {
        opacity:.4
    }
    .opacity-80 {
        opacity:.8
    }
    .opacity-100 {
        opacity:1
    }
    .shadow {
        --tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a)
    }
    .shadow,
    .shadow-\[0_2px_24px_rgba\(139\,111\,94\,0\.10\)\] {
        box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }
    .shadow-\[0_2px_24px_rgba\(139\,111\,94\,0\.10\)\] {
        --tw-shadow:0 2px 24px var(--tw-shadow-color,#8b6f5e1a)
    }
    .outline {
        outline-style:var(--tw-outline-style);
        outline-width:1px
    }
    .filter {
        filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)
    }
    .transition {
        transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;
        transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));
        transition-duration:var(--tw-duration,var(--default-transition-duration))
    }
    .transition-all {
        transition-property:all;
        transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));
        transition-duration:var(--tw-duration,var(--default-transition-duration))
    }
    .transition-opacity {
        transition-property:opacity;
        transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));
        transition-duration:var(--tw-duration,var(--default-transition-duration))
    }
    .duration-500 {
        --tw-duration:.5s;
        transition-duration:.5s
    }
    .select-none {
        -webkit-user-select:none;
        user-select:none
    }
    .after\:absolute:after {
        content:var(--tw-content);
        position:absolute
    }
    .after\:bottom-\[-2px\]:after {
        content:var(--tw-content);
        bottom:-2px
    }
    .after\:left-0:after {
        content:var(--tw-content);
        left:calc(var(--spacing)*0)
    }
    .after\:h-\[1\.5px\]:after {
        content:var(--tw-content);
        height:1.5px
    }
    .after\:w-0:after {
        content:var(--tw-content);
        width:calc(var(--spacing)*0)
    }
    .after\:bg-\[var\(--color-accent\)\]:after {
        content:var(--tw-content);
        background-color:var(--color-accent)
    }
    .after\:transition-\[width\]:after {
        content:var(--tw-content);
        transition-property:width;
        transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));
        transition-duration:var(--tw-duration,var(--default-transition-duration))
    }
    .after\:duration-300:after {
        content:var(--tw-content);
        --tw-duration:.3s;
        transition-duration:.3s
    }
    .after\:ease-\[var\(--ease-gentle\)\]:after {
        content:var(--tw-content);
        --tw-ease:var(--ease-gentle);
        transition-timing-function:var(--ease-gentle)
    }
    .after\:content-\[\'\'\]:after {
        --tw-content:"";
        content:var(--tw-content)
    }
    @media (hover:hover) {
        .hover\:bg-\[var\(--color-muted\)\]:hover {
            background-color:var(--color-muted)
        }
        .hover\:text-\[var\(--color-accent\)\]:hover {
            color:var(--color-accent)
        }
        .hover\:text-\[var\(--color-foreground\)\]:hover {
            color:var(--color-foreground)
        }
        .hover\:text-\[var\(--color-text-light\)\]:hover {
            color:var(--color-text-light)
        }
        .hover\:opacity-100:hover {
            opacity:1
        }
        .hover\:after\:w-full:hover:after {
            content:var(--tw-content);
            width:100%
        }
    }
    .active\:scale-95:active {
        --tw-scale-x:95%;
        --tw-scale-y:95%;
        --tw-scale-z:95%;
        scale:var(--tw-scale-x)var(--tw-scale-y)
    }
    @media (min-width:40rem) {
        .sm\:flex-row {
            flex-direction:row
        }
        .sm\:justify-between {
            justify-content:space-between
        }
    }
    @media (min-width:48rem) {
        .md\:flex {
            display:flex
        }
        .md\:hidden {
            display:none
        }
        .md\:h-20 {
            height:calc(var(--spacing)*20)
        }
    }
}
@keyframes fadeIn {
    0% {
        opacity:0
    }
    to {
        opacity:1
    }
}
@keyframes slideUp {
    0% {
        opacity:0;
        transform:translateY(28px)
    }
    to {
        opacity:1;
        transform:translateY(0)
    }
}
@keyframes slideDown {
    0% {
        opacity:0;
        transform:translateY(-20px)
    }
    to {
        opacity:1;
        transform:translateY(0)
    }
}
@keyframes slideLeft {
    0% {
        opacity:0;
        transform:translate(36px)
    }
    to {
        opacity:1;
        transform:translate(0)
    }
}
@keyframes slideRight {
    0% {
        opacity:0;
        transform:translate(-36px)
    }
    to {
        opacity:1;
        transform:translate(0)
    }
}
@keyframes scaleFadeIn {
    0% {
        opacity:0;
        transform:scale(.96)
    }
    to {
        opacity:1;
        transform:scale(1)
    }
}
@keyframes pulseSubtle {
    0%,
    to {
        opacity:1
    }
    50% {
        opacity:.65
    }
}
@keyframes dotGrow {
    0%,
    to {
        transform:scale(1)
    }
    50% {
        transform:scale(1.4)
    }
}
@keyframes weaveSway {
    0%,
    to {
        transform:translate(0)translateY(0)
    }
    33% {
        transform:translate(1px)translateY(-1px)
    }
    66% {
        transform:translate(-1px)translateY(1px)
    }
}
@property --tw-translate-x {
    syntax:"*";
    inherits:false;
    initial-value:0
}
@property --tw-translate-y {
    syntax:"*";
    inherits:false;
    initial-value:0
}
@property --tw-translate-z {
    syntax:"*";
    inherits:false;
    initial-value:0
}
@property --tw-rotate-x {
    syntax:"*";
    inherits:false
}
@property --tw-rotate-y {
    syntax:"*";
    inherits:false
}
@property --tw-rotate-z {
    syntax:"*";
    inherits:false
}
@property --tw-skew-x {
    syntax:"*";
    inherits:false
}
@property --tw-skew-y {
    syntax:"*";
    inherits:false
}
@property --tw-leading {
    syntax:"*";
    inherits:false
}
@property --tw-font-weight {
    syntax:"*";
    inherits:false
}
@property --tw-tracking {
    syntax:"*";
    inherits:false
}
@property --tw-shadow {
    syntax:"*";
    inherits:false;
    initial-value:0 0 #0000
}
@property --tw-shadow-color {
    syntax:"*";
    inherits:false
}
@property --tw-shadow-alpha {
    syntax:"<percentage>";
    inherits:false;
    initial-value:100%
}
@property --tw-inset-shadow {
    syntax:"*";
    inherits:false;
    initial-value:0 0 #0000
}
@property --tw-inset-shadow-color {
    syntax:"*";
    inherits:false
}
@property --tw-inset-shadow-alpha {
    syntax:"<percentage>";
    inherits:false;
    initial-value:100%
}
@property --tw-ring-color {
    syntax:"*";
    inherits:false
}
@property --tw-ring-shadow {
    syntax:"*";
    inherits:false;
    initial-value:0 0 #0000
}
@property --tw-inset-ring-color {
    syntax:"*";
    inherits:false
}
@property --tw-inset-ring-shadow {
    syntax:"*";
    inherits:false;
    initial-value:0 0 #0000
}
@property --tw-ring-inset {
    syntax:"*";
    inherits:false
}
@property --tw-ring-offset-width {
    syntax:"<length>";
    inherits:false;
    initial-value:0
}
@property --tw-ring-offset-color {
    syntax:"*";
    inherits:false;
    initial-value:#fff
}
@property --tw-ring-offset-shadow {
    syntax:"*";
    inherits:false;
    initial-value:0 0 #0000
}
@property --tw-outline-style {
    syntax:"*";
    inherits:false;
    initial-value:solid
}
@property --tw-blur {
    syntax:"*";
    inherits:false
}
@property --tw-brightness {
    syntax:"*";
    inherits:false
}
@property --tw-contrast {
    syntax:"*";
    inherits:false
}
@property --tw-grayscale {
    syntax:"*";
    inherits:false
}
@property --tw-hue-rotate {
    syntax:"*";
    inherits:false
}
@property --tw-invert {
    syntax:"*";
    inherits:false
}
@property --tw-opacity {
    syntax:"*";
    inherits:false
}
@property --tw-saturate {
    syntax:"*";
    inherits:false
}
@property --tw-sepia {
    syntax:"*";
    inherits:false
}
@property --tw-drop-shadow {
    syntax:"*";
    inherits:false
}
@property --tw-drop-shadow-color {
    syntax:"*";
    inherits:false
}
@property --tw-drop-shadow-alpha {
    syntax:"<percentage>";
    inherits:false;
    initial-value:100%
}
@property --tw-drop-shadow-size {
    syntax:"*";
    inherits:false
}
@property --tw-duration {
    syntax:"*";
    inherits:false
}
@property --tw-content {
    syntax:"*";
    inherits:false;
    initial-value:""
}
@property --tw-ease {
    syntax:"*";
    inherits:false
}
@property --tw-scale-x {
    syntax:"*";
    inherits:false;
    initial-value:1
}
@property --tw-scale-y {
    syntax:"*";
    inherits:false;
    initial-value:1
}
@property --tw-scale-z {
    syntax:"*";
    inherits:false;
    initial-value:1
}
/* Базовый класс для всех анимируемых элементов */
[data-aos] {
    opacity: 0;
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

/* Специфические направления смещения */
[data-aos="fade-up"]    { transform: translateY(36px); }
[data-aos="fade-right"] { transform: translateX(-44px); }
[data-aos="fade-left"]  { transform: translateX(44px); }

/* Класс, который наш JS добавит при скролле для запуска анимации */
[data-aos].aos-animate {
    opacity: 1;
    transform: translate(0, 0) !important;
}
/* 1. БАЗОВЫЕ КЛАССЫ ОТОБРАЖЕНИЯ */
.hidden { display: none !important; }
.block { display: block !important; }

/* 2. СТИЛИ ВЕРХНЕГО МЕНЮ (Header.tsx) */
#scroll-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 100 !important;
    width: 100% !important;
    transition: all 0.4s ease-in-out !important;
}

/* Исправляем скрытие меню на мобильных (убираем конфликт hidden) */
@media (min-width: 768px) {
    #scroll-header nav.hidden, #scroll-header div.hidden {
        display: flex !important;
    }
}

/* Анимация плавного подчеркивания пунктов меню */
#scroll-header nav a {
    position: relative;
    text-decoration: none;
    transition: color 0.3s ease;
}
#scroll-header nav a::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1.5px;
    background-color: var(--color-accent, #8b6f5e);
    transition: width 0.3s ease;
}
#scroll-header nav a:hover::after {
    width: 100%;
}

/* Состояния шапки при скролле */
#scroll-header.header-transparent {
    background-color: transparent !important;
}
#scroll-header.header-transparent .font-\[var\(--font-display\)\] { color: #ffffff !important; }
#scroll-header.header-transparent nav a { color: rgba(255, 255, 255, 0.9) !important; }
#scroll-header.header-transparent .btn-outline-light {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
    background-color: transparent !important;
}

#scroll-header.header-scrolled {
    background-color: #faf7f2 !important; /* Тёплый фон Битрикс-лендинга */
    box-shadow: 0 2px 24px rgba(139, 111, 94, 0.15) !important;
}
#scroll-header.header-scrolled .font-\[var\(--font-display\)\] { color: #2e2218 !important; }
#scroll-header.header-scrolled nav a { color: #2e2218 !important; }

/* ИСПРАВЛЕНИЕ: Кнопка "Связаться" больше не сливается с фоном при скролле */
#scroll-header.header-scrolled .btn-outline-light {
    color: #ffffff !important;
    border-color: var(--color-accent, #8b6f5e) !important;
    background-color: var(--color-accent, #8b6f5e) !important; /* Заливаем кнопку цветом */
}

/* 3. СТИЛИ ДЛЯ КАРУСЕЛИ ОТЗЫВОВ (ВМЕСТО ABSOLUTE И HIDDEN) */
.testimonials-wrapper {
    width: 100% !important;
}

/* Контейнер на гридах: все дочерние элементы складываются в одну ячейку */
.testimonials-container {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: 1fr !important;
    width: 100% !important;
    position: relative !important;
}

/* Все слайды лежат в одной и той же сетке, накладываясь друг на друга */
.testimonial-slide {
    grid-column: 1 !important;
    grid-row: 1 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 1s ease-in-out, visibility 1s ease-in-out !important;
    will-change: opacity, visibility;
}

/* Активный слайд плавно проявляется и задает высоту всему контейнеру */
.testimonial-slide.is-active-slide {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Блок пагинации ЖЕСТКО привязан к низу грид-контейнера */
#testimonials-dots {
    display: flex !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-top: 40px !important; /* Увеличили отступ от текста */
    position: relative !important;
    z-index: 10 !important;
}

/* 4. СТИЛИ СКРОЛЛ-АНИМАЦИЙ БЛОКОВ */
[data-aos] {
    opacity: 0;
    transition: opacity 0.8s cubic-bezier(0.25, 1, 0.5, 1), transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: opacity, transform;
}
[data-aos="fade-up"]    { transform: translateY(30px); }
[data-aos="fade-right"] { transform: translateX(-40px); }
[data-aos="fade-left"]  { transform: translateX(40px); }
[data-aos].aos-animate {
    opacity: 1;
    transform: translate(0, 0);
}

/* Затемняющий фон-оверлей */
#mobile-menu-overlay {
    position: fixed !important;
    inset: 0 !important;
    background-color: #2e2218 !important;
    z-index: 1500 !important;
    transition: opacity 0.35s ease-in-out !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
#mobile-menu-overlay.is-open {
    opacity: 0.4 !important;
    pointer-events: auto !important;
}

/* Сама выезжающая шторка меню */
#mobile-menu {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 1600 !important;
    width: min(300px, 85vw) !important;
    background-color: #faf7f2 !important;
    box-shadow: -4px 0 24px rgba(46, 34, 24, 0.15) !important;
    padding: 80px 32px 40px 32px !important;

    /* Принудительно включаем блочный тип отображения и сбрасываем прозрачность */
    display: flex !important;
    flex-direction: column !important;
    opacity: 0 !important; /* В скрытом состоянии пусть будет прозрачным */
    visibility: hidden !important;

    /* Изначально меню скрыто за пределами экрана справа */
    transform: translateX(100%) !important;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease !important;

    /* Оптимизация скролла для мобильных */
    will-change: transform, opacity;
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
}

/* ИСПРАВЛЕНИЕ: Когда меню открыто — оно гарантированно становится видимым */
#mobile-menu.is-open {
    transform: translateX(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Ссылки внутри мобильного меню */
#mobile-menu nav {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.5rem !important;
}
#mobile-menu nav a {
    display: block !important;
    padding: 12px 0 !important;
    font-size: 1.125rem !important;
    color: #2e2218 !important;
    border-bottom: 1px solid rgba(139, 111, 94, 0.1) !important;
    text-decoration: none !important;
}
#mobile-menu nav a:last-child {
    border-bottom: none !important;
}
.adv-icon {
    color: #c5a880; /* Поменяй этот HEX-код на любой нужный цвет темы AromaFormula */
    transition: color 0.3s ease;
}

/* Эффект при наведении на блок */
.adv-item:hover .adv-icon {
    color: #a38458; /* Цвет иконки при наведении */
}
/* End */
/* /local/templates/textile_design/styles.css?179300635654186 */
