body {
    color: var(--brown);
    background: radial-gradient(circle at 15% 10%, #ffffff80, transparent 28rem), var(--paper);
    text-rendering: optimizelegibility;
    -webkit-font-smoothing: antialiased;
    margin: 0;
    font-family: PingFang SC, Microsoft YaHei, Noto Sans CJK SC, system-ui, sans-serif;
    overflow-x: clip
}

* {
    font-size: inherit;
}
body:after {
    content: "";
    z-index: 100;
    pointer-events: none;
    opacity: .16;
    mix-blend-mode: multiply;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
    position: fixed;
    inset: 0
}



@layer properties {
@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {
*, :before, :after, ::backdrop {
--tw-rotate-x:initial;
--tw-rotate-y:initial;
--tw-rotate-z:initial;
--tw-skew-x:initial;
--tw-skew-y:initial;
--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-content:"";
--tw-font-weight:initial
}
}
}
@layer theme {
:root, :host {
--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, 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;
--font-weight-black:900;
--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)
}
}
@layer base {
*, :after, :before, ::backdrop {
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
}
html, :host {
-webkit-text-size-adjust:100%;
tab-size:4;
line-height:1.5;
font-family:var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, 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 {
color:inherit;
-webkit-text-decoration:inherit;
-webkit-text-decoration:inherit;
-webkit-text-decoration:inherit;
-webkit-text-decoration:inherit;
text-decoration:inherit
}
b, strong {
font-weight:bolder
}
code, kbd, samp, pre {
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:where(:not(iframe)) {
outline:auto
}
progress {
vertical-align:baseline
}
summary {
display:list-item
}
ol, ul, menu {
list-style:none
}
img, svg, video, canvas, audio, iframe, embed, object {
vertical-align:middle;
display:block
}
img, video {
max-width:100%;
height:auto
}
button, input, select, optgroup, 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 {
padding-block:0
}
::-webkit-datetime-edit-year-field {
padding-block:0
}
::-webkit-datetime-edit-month-field {
padding-block:0
}
::-webkit-datetime-edit-day-field {
padding-block:0
}
::-webkit-datetime-edit-hour-field {
padding-block:0
}
::-webkit-datetime-edit-minute-field {
padding-block:0
}
::-webkit-datetime-edit-second-field {
padding-block:0
}
::-webkit-datetime-edit-millisecond-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 {
height:auto
}
::-webkit-outer-spin-button {
height:auto
}
[hidden]:where(:not([hidden=until-found])) {
display:none!important
}
}
@layer components;
@layer utilities {
.visible {
visibility:visible
}
.sr-only {
clip-path:inset(50%);
white-space:nowrap;
border-width:0;
width:1px;
height:1px;
margin:-1px;
padding:0;
position:absolute;
overflow:hidden
}
.relative {
position:relative
}
.static {
position:static
}
.block {
display:block
}
.flex {
display:flex
}
.hidden {
display:none
}
.inline {
display:inline
}
.inline-block {
display:inline-block
}
.transform {
transform:var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, )
}
.resize {
resize:both
}
.whitespace-pre {
white-space:pre
}
.blur {
--tw-blur:blur(8px);
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, )
}
.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))
}
.after\:invisible:after {
content:var(--tw-content);
visibility:hidden
}
.after\:absolute:after {
content:var(--tw-content);
position:absolute
}
.after\:h-0:after {
content:var(--tw-content);
height:0
}
.after\:overflow-hidden:after {
content:var(--tw-content);
overflow:hidden
}
.after\:font-black:after {
content:var(--tw-content);
--tw-font-weight:var(--font-weight-black);
font-weight:var(--font-weight-black)
}
.after\:content-\[attr\(data-text\)\]:after {
--tw-content:attr(data-text);
content:var(--tw-content)
}
.after\:select-none:after {
content:var(--tw-content);
-webkit-user-select:none;
user-select:none
}
}
:root {
--paper:#ede5d9;
--paper-soft:#f5efe6;
--grain-gold:#c29b61;
--accent:#f29651;
--brown:#673a1b;
--brown-soft:#8a6245;
--line:#673a1b30;
--shadow:0 24px 70px #673a1b24;
--radius-media:14px;
--radius-input:9px;
--radius-action:999px;
--nav-layer:40;
--menu-layer:70
}
* {
    box-sizing: border-box
}
body:after {
    content: "";
    z-index: 100;
    pointer-events: none;
    opacity: .16;
    mix-blend-mode: multiply;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
    position: fixed;
    inset: 0
}
::selection {
    color: var(--paper-soft);
    background: var(--brown)
}
a {
    color: inherit;
    text-decoration: none
}
button, input {
    font: inherit
}
button, a {
    -webkit-tap-highlight-color: transparent
}
:focus-visible {
outline:3px solid var(--accent);
outline-offset:4px
}
.section {
    padding: clamp(6rem, 12vw, 10rem) 1.25rem;
    position: relative
}
.section-shell {
    width: min(100%, 1400px);
    margin-inline: auto; 
}
.section-entry {
    align-items: flex-start;
    min-height: 42px;
    margin: 0 0 clamp(2.8rem, 5vw, 2.8rem);
    display: flex
}
.section-entry .section-link {
    margin: 0
}
.section-kicker {
    letter-spacing: .15em;
    margin: 0 0 1.4rem;
    font-size: .78rem;
    font-weight: 700
}
.section h2 {
    letter-spacing: -.055em;
    max-width: 13ch;
    margin: 0;
    font-size: clamp(2.35rem, 6vw, 5rem);
    font-weight: 680;
    line-height: 1.06
}
.section-body, .section-heading p, .contact-copy>p {
    max-width: 36rem;
    color: var(--brown-soft);
    margin: 2rem 0 0;
    font-size: clamp(1rem, 1.7vw, 1.18rem);
    line-height: 1.85
}
.about-page {
    min-height: 100dvh;
    padding: clamp(5.5rem, 5vw, 11.5rem) 1.25rem clamp(5.5rem, 5vw, 10rem)
}
.about-page-shell {
    gap: clamp(5rem, 10vw, 9rem);
    display: grid;
        margin-top: 6rem;
}
.about-page-section {
grid-template-columns:minmax(18rem, .88fr) minmax(22rem, 1.12fr);
    align-items: center;
    gap: clamp(2.5rem, 7vw, 8rem);
    display: grid
}
.about-page-copy {
    max-width: 39rem
}
.about-page-kicker {
    color: var(--grain-gold);
    letter-spacing: .16em;
    margin: 0 0 1.25rem;
    font-size: .76rem;
    font-weight: 750
}
.about-page-copy h1, .about-page-copy h2 {
    letter-spacing: -.06em;
    max-width: 10ch; color: var(--brown);
    margin: 0;
    font-size: clamp(2.5rem, 4.7vw, 4.75rem);
    font-weight: 700;
    line-height: 1.08
}
.about-page-values {
    gap: 1.3rem;
    margin: clamp(2rem, 4vw, 3.25rem) 0 0;
    display: grid
}
.about-page-values div {
    border-bottom: 1px solid var(--line);
    padding-bottom: 1.15rem
}
.about-page-values dt {
    color: var(--grain-gold);
    letter-spacing: .14em;
    margin: 0 0 .5rem;
    font-size: 1.2rem;
    font-weight: 750
}
.about-page-values dd, .about-page-copy>p {
    color: var(--brown-soft);
    margin: 0;
    font-size: clamp(1rem, 1.25vw, 1.12rem);
    line-height: 1.9
}
.about-page-summary {
    margin-top: clamp(1.8rem, 3vw, 2.75rem)!important
}
.about-page-story {
    gap: 1.35rem;
    margin-top: clamp(2rem, 4vw, 3.25rem);
    display: grid
}
.about-page-story p {
    margin: 0
}
.about-page-story strong {
    color: var(--brown);
    margin-bottom: .42rem;      font-size: 1.2rem;
    font-weight: 750;
    display: block
}
.about-page-media {
    border-radius: var(--radius-media);
    min-height: clamp(27rem, 48vw, 43rem);
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden
}
.about-page-media img {
    object-fit: cover
}
.about-page-media-rice img {
    object-position: 58% center
}
.about-page-media-making img {
    object-position: 52% center
}
.site-header {
    z-index: var(--nav-layer);
    background: #ede5d9f5;
    border-bottom: 1px solid #673a1b1f;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    width: 100%;
    min-height: 72px;
    padding: .7rem clamp(1rem, 3vw, 2.8rem);
    display: grid;
    position: fixed;
    top: 0;
    left: 0;
    right: 0
}
.brand-link {
    align-items: center;
    width: clamp(125px, 13vw, 180px);
    display: inline-flex
}
.brand-link img {
    width: 100%;
    height: auto
}
.desktop-nav {
    white-space: nowrap;
    justify-content: center;
    gap: clamp(1.1rem, 2vw, 2.3rem);
    padding-inline: 1rem;
    display: flex
}
.desktop-nav a, .footer-links a {
    font-size: .86rem;
    font-weight: 650;
    position: relative
}
.desktop-nav a:after, .footer-links a:after {
    content: "";
    background: currentColor;
    height: 1px;
    transition: right .35s cubic-bezier(.16, 1, .3, 1);
    position: absolute;
    bottom: -.45rem;
    left: 0;
    right: 100%
}
.desktop-nav a:hover:after, .footer-links a:hover:after {
    right: 0
}
.header-cta, .button, .submit-button, .mobile-menu-cta {
    border-radius: var(--radius-action);
    white-space: nowrap;
    justify-content: center;
    align-items: center;
    min-height: 46px;
    transition: transform .25s, background-color .25s, color .25s;
    display: inline-flex
}
.header-cta {
    color: var(--paper-soft);
    background: var(--brown);
    padding: 0 1.35rem;
    font-size: .85rem;
    font-weight: 700
}
.header-cta-spacer {
    width: 8.25rem;
    min-height: 46px
}
.header-cta:active, .button:active, .submit-button:active, .mobile-menu-cta:active {
    transform: scale(.98)
}
.menu-button {
    border: 1px solid var(--line);
    width: 46px;
    height: 46px;
    color: var(--brown);
    background: 0 0;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: none
}
.mobile-menu {
    z-index: var(--menu-layer);
    background: var(--paper);
    grid-template-rows: auto 1fr auto;
    padding: 1rem 1.25rem 2rem;
    display: grid;
    position: fixed;
    inset: 0
}
.mobile-menu-top {
    border-bottom: 1px solid var(--line);
    justify-content: space-between;
    align-items: center;
    min-height: 58px;
    display: flex
}
.mobile-menu-top img {
    width: 138px;
    height: auto
}
.mobile-menu-top button {
    width: 46px;
    height: 46px;
    color: var(--brown);
    background: 0 0;
    border: 0;
    place-items: center;
    display: grid
}
.mobile-menu nav {
    align-content: center;
    display: grid
}
.mobile-menu nav a {
    border-bottom: 1px solid var(--line);
    letter-spacing: -.045em;
    align-items: center;
    min-height: 64px;
    font-size: clamp(1.65rem, 8vw, 2.4rem);
    font-weight: 650;
    display: flex
}
.mobile-menu-cta {
    color: var(--paper-soft);
    background: var(--brown);
    font-weight: 700
}
.hero {
    background: #d5c4ae;
    align-items: flex-end;
    width: 100%;
    max-width: 100vw;
    min-height: 100dvh;
    padding: 7.5rem clamp(1.25rem, 6vw, 6rem) clamp(3rem, 8vw, 6rem);
    display: flex;
    position: relative;
    overflow: hidden
}
.hero-media, .hero-poster, .hero-scrim {
    position: absolute;
    inset: 0
}
.hero-media video {
    z-index: 2;
    object-fit: cover;
    object-position: center;
    opacity: 1;
    width: 100%;
    height: 100%;
    transition: opacity .6s;
    position: relative
}
.hero-media video.is-ready {
    opacity: 1
}
.hero-poster {
    z-index: 1;
    background: url(/media/hero-poster.webp) 50%/cover no-repeat
}
.hero-scrim {
    z-index: 3;
    background: linear-gradient(90deg, #20140dbd, #20140d2e 62%, #0000), linear-gradient(#0000 45%, #20140d8c)
}
.hero-content {
    z-index: 4;
    width: min(100%, 680px);
    min-width: 0;
    color: var(--paper-soft);
    position: relative
}
.hero-content h1 {
    letter-spacing: -.065em;
    text-wrap: balance;
    max-width: 12ch;
    margin: 0;
    font-size: clamp(3.25rem, 7.8vw, 6.8rem);
    font-weight: 680;
    line-height: 1.02
}
.hero-subtitle {
    color: var(--paper-soft);
    letter-spacing: -.035em;
    white-space: nowrap;
    margin: 1.1rem 0 0;
    font-size: clamp(1.3rem, 2.5vw, 2rem);
    font-weight: 680;
    line-height: 1.3
}
.hero-content>p:not(.hero-subtitle) {
    color: #f5efe6e0;
    max-width: 31rem;
    margin: 1.15rem 0 0;
    font-size: clamp(1rem, 1.7vw, 1.18rem);
    line-height: 1.75
}
.hero-actions {
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 2.1rem;
    display: flex
}
.button {
    border: 1px solid var(--brown);
    border-radius: var(--radius-action);
    letter-spacing: .08em;
    align-items: center;
    gap: 1.25rem;
    min-height: 42px;
    padding: .35rem .35rem .35rem 1.05rem;
    font-size: .78rem;
    font-weight: 750;
    line-height: 1;
    transition: transform .24s, background .24s;
    display: inline-flex
}
.button-primary {
    color: var(--paper-soft);
    background: var(--brown)
}
.hero-actions .button-primary {
    gap: .85rem;
    min-height: 38px;
    padding: .28rem .28rem .28rem .9rem
}
.hero-actions .button-primary .button-action-icon {
    width: 28px;
    height: 28px
}
.button-action-icon {
    width: 30px;
    height: 30px;
    color: var(--brown);
    background: var(--paper-soft);
    border-radius: 50%;
    place-items: center;
    transition: transform .24s;
    display: grid
}
.button:hover .button-action-icon, .button:focus-visible .button-action-icon {
transform:translate(.14rem)
}
.button:active {
    transform: scale(.98)
}
.video-controls {
    z-index: 5;
    gap: .55rem;
    display: flex;
    position: absolute;
    bottom: clamp(2rem, 5vw, 4rem);
    right: clamp(1.25rem, 4vw, 4rem)
}
.video-controls button {
    width: 46px;
    height: 46px;
    color: var(--paper-soft);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background: #20140d57;
    border: 1px solid #f5efe68a;
    border-radius: 50%;
    place-items: center;
    display: grid
}
.about-grid {
grid-template-columns:minmax(280px, .7fr) minmax(0, 1.55fr);
    align-items: center;
    gap: clamp(2.5rem, 5vw, 5rem);
    display: grid
}
.section-link {
--section-link-background:var(--brown);
--section-link-foreground:var(--paper-soft);
--section-link-fill:var(--paper-soft);
--section-link-fill-foreground:var(--brown);
    border: 1px solid var(--section-link-background);
    border-radius: var(--radius-action);
    min-height: 42px;
    color: var(--section-link-foreground);
    background: var(--section-link-background);
    letter-spacing: .08em;
    white-space: nowrap;
    isolation: isolate;
    align-items: center;
    margin: 0 0 clamp(1.55rem, 3vw, 2.25rem);
    padding: .45rem 3.2rem .45rem 1.05rem;
    font-size: .78rem;
    font-weight: 750;
    line-height: 1;
    display: inline-flex;
    position: relative;
    overflow: hidden
}
.section-link-label, .section-link-icon {
    z-index: 2;
    position: relative
}
.section-link-label {
    transition: color .43s cubic-bezier(.785, .135, .15, .86)
}
.section-link-fill {
    z-index: 1;
    background: var(--section-link-fill);
    border-radius: 999px;
    width: 30px;
    transition: width .43s cubic-bezier(.785, .135, .15, .86), inset .43s cubic-bezier(.785, .135, .15, .86);
    position: absolute;
    top: .27rem;
    bottom: .27rem;
    right: .27rem
}
.section-link-icon {
    width: 18px;
    height: 18px;
    color: var(--section-link-fill-foreground);
    place-items: center;
    transition: transform .43s cubic-bezier(.785, .135, .15, .86);
    display: grid;
    position: absolute;
    top: 50%;
    right: .68rem;
    transform: translateY(-50%)
}
.section-link:hover .section-link-fill, .section-link:focus-visible .section-link-fill {
width:calc(100% - .54rem)
}
.section-link:hover .section-link-label, .section-link:focus-visible .section-link-label {
color:var(--section-link-fill-foreground)
}
.section-link:hover .section-link-icon, .section-link:focus-visible .section-link-icon {
transform:translate(.14rem, -50%)
}
.section-link:active {
    transform: scale(.98)
}
.section-link-light {
--section-link-background:var(--paper-soft);
--section-link-foreground:var(--brown);
--section-link-fill:var(--brown);
--section-link-fill-foreground:var(--paper-soft)
}
.about-copy {
    z-index: 2;
    padding-left: clamp(0rem, 3vw, 3rem);
    position: relative
}
.about-copy h2 {
    text-wrap: balance;
    max-width:16ch;
    font-size: clamp(2.55rem, 3.3vw, 3.15rem)
}
.brand-statement {
    color: var(--grain-gold);
    letter-spacing: .08em;
    margin: 3.5rem 0 0;
    font-size: clamp(1.65rem, 2.25vw, 2rem);
    font-weight: 700
}
.product-image img, .craft-image img {
    object-fit: cover
}
.journey-panel {
    min-width: 0;
    overflow: hidden
}
.about-section {
    overflow: hidden
}
.journey-toolbar {
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin: 0 0 1.15rem;
    display: flex
}
.journey-toolbar p {
    color: var(--brown-soft);
    letter-spacing: .14em;
    margin: 0;
    font-size: 1rem;
    font-weight: 700
}
.journey-rail {
    cursor: grab;
    touch-action: pan-y;
    width: 100%;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, #0000 0, #000 5% 95%, #0000 100%);
    mask-image: linear-gradient(90deg, #0000 0, #000 5% 95%, #0000 100%)
}
.journey-rail:active {
    cursor: grabbing
}
.journey-track, .journey-group {
    align-items: flex-end;
    width: max-content;
    display: flex
}
.journey-track {
    will-change: transform
}
.journey-group {
    gap: clamp(.8rem, 1.2vw, 1.1rem);
    padding-right: clamp(.8rem, 1.2vw, 1.1rem)
}
.journey-card {
    flex: none;
    margin: 0
}
.journey-card-portrait {
    width: clamp(230px, 20vw, 320px)
}
.journey-card-landscape {
    width: clamp(350px, 30vw, 480px)
}
.journey-card-media {
    border-radius: var(--radius-media);
    height: clamp(330px, 36vw, 500px);
    box-shadow: var(--shadow);
    background: #673a1b14;
    position: relative;
    overflow: hidden
}
.journey-card-media img {
    object-fit: cover;
    transition: transform .5s cubic-bezier(.16, 1, .3, 1)
}
.journey-card-media img.is-missing {
    visibility: hidden
}
.journey-card:hover .journey-card-media img {
    transform: scale(1.018)
}
.journey-card figcaption {
    color: var(--brown);
    align-items: baseline;
    gap: .65rem;
    margin-top: .85rem;
    font-size: .95rem;
    font-weight: 700;
    display: flex
}
.journey-card figcaption span {
    color: var(--grain-gold);
    letter-spacing: .08em;
    font-size: .68rem
}
.products-section {
    padding-inline: 0;
    overflow: hidden
}
.products-section .section-shell {
    padding-inline: 1.25rem
}
.product-heading {
    text-align: center;
    flex-direction: column;
    align-items: center;
    max-width: 52rem;
    margin-inline: auto;
    display: flex
}
.product-heading h2 {
    max-width: none
}
.product-heading p {
    max-width: 38rem
}
.about-copy h2 span, .product-heading h2 span, .product-heading p span {
    display: block
}
.product-track {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end;
    gap: clamp(1rem, 2.4vw, 2.6rem);
    margin-top: clamp(3.5rem, 7vw, 6.5rem);
    display: grid
}
.product-item {
    min-width: 0;
    position: relative
}
.product-item-2 {
    margin-bottom: clamp(2.2rem, 5vw, 5.75rem)
}
.product-image {
    aspect-ratio: 4/5.15;
    border-radius: var(--radius-media);
    background: #f8f4ee;
    outline: none;
    position: relative;
    overflow: hidden;
    box-shadow: 0 22px 45px #4a301d1f
}
.product-image img {
    object-fit: cover;
    transition: transform .42s cubic-bezier(.16, 1, .3, 1)
}
.product-item:hover .product-image img, .product-image:focus-visible img {
transform:scale(1.055)
}
.product-image:focus-visible {
outline:3px solid var(--orange)
}
@supports (color:color-mix(in lab, red, red)) {
.product-image:focus-visible {
outline:3px solid color-mix(in srgb, var(--orange), white 24%)
}
}
.product-image:focus-visible {
outline-offset:4px
}
.craft-section {
    border-radius: var(--radius-media);
    width: min(100% - 2.5rem, 1400px);
    min-height: min(78dvh, 800px);
    margin: 2rem auto clamp(6rem, 10vw, 10rem);
    position: relative;
    overflow: hidden
}
.craft-image, .craft-image:after {
    position: absolute;
    inset: 0
}
.craft-image {
    isolation: isolate
}
.craft-image:before {
    content: "";
    z-index: 1;
    pointer-events: none;
    opacity: .22;
    filter: blur(16px);
    background: radial-gradient(15% 32% at 21% 60%, #fff6e599, #0000 72%), radial-gradient(13% 36% at 28% 52%, #fff5e175, #0000 70%), radial-gradient(10% 28% at 16% 46%, #fffaef57, #0000 72%);
    position: absolute;
    inset: -12%
}
.craft-image:after {
    content: "";
    z-index: 2;
    background: linear-gradient(#0000 36%, #2d190dba)
}
.craft-image img {
    transition: transform .8s cubic-bezier(.16, 1, .3, 1)
}

@media (prefers-reduced-motion:no-preference) {
.craft-image:before {
    animation: 10s ease-in-out infinite alternate craft-steam-drift
}
.craft-section:hover .craft-image:before {
    opacity: .34;
    animation-duration: 6.5s
}
}
.craft-section:hover .craft-image img {
    transform: scale(1.045)
}
@keyframes craft-steam-drift {
0% {
transform:translate(-2%, 6%)scale(.94)
}
to {
transform:translate(5%, -8%)scale(1.08)
}
}
.craft-copy {
    z-index: 3;
    color: var(--paper-soft);
    position: absolute;
    bottom: clamp(1.7rem, 6vw, 5rem);
    left: clamp(1.4rem, 6vw, 6rem);
    right: 1.4rem
}
.craft-copy h2 {
    letter-spacing: -.06em;
    white-space: nowrap;
    margin: 0;
    font-size: clamp(1.4rem, 5.7vw, 5.25rem);
    line-height: 1.05
}
.craft-breathing-title {
    transform-origin: 0 100%;
    display: inline-block
}
.stores-section {
    padding-block: clamp(5.5rem, 10vw, 10rem)
}
.store-showcase {
    border: 1px solid var(--brown);
grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
    min-height: clamp(33rem, 48vw, 43rem);
    display: grid;
    overflow: hidden
}
@supports (color:color-mix(in lab, red, red)) {
.store-showcase {
border:1px solid color-mix(in srgb, var(--brown) 13%, transparent)
}
}
.store-showcase {
    border-radius: var(--radius-media);
    background: #f2ece1;
    box-shadow: 0 24px 64px #4025121c
}
.store-showcase-copy {
    background: linear-gradient(135deg, #fffdf7cc, #0000 62%), #f3ede2;
    align-items: center;
    padding: clamp(2.4rem, 6vw, 7rem);
    display: flex;
    position: relative
}
.store-showcase-copy-breathe {
    will-change: transform;
    max-width: 31rem
}
.store-showcase-copy h2 {
    max-width: none;
    color: var(--brown);
    margin: 0
}
@supports (color:color-mix(in lab, red, red)) {
.store-showcase-copy h2 {
color:color-mix(in srgb, var(--brown) 82%, var(--accent))
}
}
.store-showcase-copy h2 {
    letter-spacing: -.065em;
    white-space: nowrap;
    font-size: clamp(2.35rem, 4.5vw, 5.2rem);
    line-height: 1.04
}
.store-showcase-description {
    max-width: 27rem;
    color: var(--brown-soft);
    margin: clamp(1.7rem, 3vw, 2.7rem) 0 0;
    font-size: clamp(.96rem, 1.22vw, 1.15rem);
    line-height: 1.95
}
.store-showcase-media {
    isolation: isolate;
    background: #352317;
    min-height: 100%;
    position: relative;
    overflow: hidden
}
.store-showcase-media:after {
    content: "";
    z-index: 2;
    pointer-events: none;
    background: linear-gradient(90deg, #26160c2e, #0000 35%);
    position: absolute;
    inset: 0
}
.store-showcase-slide {
    position: absolute;
    inset: 0
}
.store-showcase-slide img {
    object-fit: cover;
    transition: transform .8s cubic-bezier(.16, 1, .3, 1)
}
.store-showcase-media:hover .store-showcase-slide img {
    transform: scale(1.055)
}
.store-showcase-status {
    z-index: 3;
    color: #fffaf3;
    letter-spacing: .11em;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    background: #21140c66;
    border: 1px solid #fffaf159;
    border-radius: 999px;
    margin: 0;
    padding: .48rem .7rem;
    font-size: .7rem;
    font-weight: 700;
    position: absolute;
    bottom: clamp(1rem, 2vw, 1.5rem);
    right: clamp(1rem, 2vw, 1.5rem)
}

@media (prefers-reduced-motion:no-preference) {
.store-showcase-copy-breathe {
    animation: 6.5s ease-in-out infinite alternate store-copy-breathe
}
}
@keyframes store-copy-breathe {
0% {
transform:translate(-.55rem)
}
to {
transform:translate(.55rem)
}
}
.cooperation-section {
    border-top: 1px solid var(--line);
    padding-top: clamp(5rem, 9vw, 8rem)
}
.brand-news-section {
    border-top: 1px solid var(--line);
    padding-block: clamp(5rem, 10vw, 10rem)
}
.brand-news-heading {
    max-width: 44rem
}
.brand-news-kicker {
    color: var(--grain-gold);
    letter-spacing: .16em;
    text-transform: uppercase;
    margin: 0 0 .9rem;
    font-size: .75rem;
    font-weight: 800
}
.brand-news-heading h2 {
    max-width: none;
    color: var(--brown);
    letter-spacing: -.07em;
    white-space: nowrap;
    margin: 0;
    font-size: clamp(2.15rem, 4.5vw, 5.2rem);
    line-height: .98
}
.brand-news-heading>p:last-child {
    max-width: none;
    color: var(--brown-soft);
    margin: 1.5rem 0 0;
    line-height: 1.85
}
.brand-news-grid {
grid-template-columns:minmax(0, 1.12fr) minmax(0, .96fr) minmax(14rem, .66fr);
    align-items: end;
    gap: clamp(1rem, 2.6vw, 2.5rem);
    margin-top: clamp(3rem, 7vw, 7rem);
    display: grid
}
.brand-news-card {
    min-width: 0
}
.brand-news-card-2 {
    margin-bottom: clamp(1.5rem, 6vw, 5.5rem)
}
.brand-news-link {
    color: inherit;
    text-decoration: none;
    display: block
}
.brand-news-media {
    aspect-ratio: 1.18;
    border-radius: var(--radius-media);
    background: #d8c8b3;
    position: relative;
    overflow: hidden
}
.brand-news-card-2 .brand-news-media {
    aspect-ratio: .96
}
.brand-news-media img {
    object-fit: cover;
    transition: transform .7s cubic-bezier(.16, 1, .3, 1)
}
.brand-news-arrow {
    z-index: 1;
    width: 2.65rem;
    height: 2.65rem;
    color: var(--brown);
    opacity: 0;
    background: #fffcf5eb;
    border-radius: 999px;
    place-items: center;
    transition: opacity .25s, transform .35s cubic-bezier(.16, 1, .3, 1);
    display: grid;
    position: absolute;
    top: 1rem;
    right: 1rem;
    transform: translate(-.4rem, .4rem)
}
.brand-news-link:hover .brand-news-media img, .brand-news-link:focus-visible .brand-news-media img {
transform:scale(1.065)
}
.brand-news-link:hover .brand-news-arrow, .brand-news-link:focus-visible .brand-news-arrow {
opacity:1;
transform:translate(0)
}
.brand-news-link:focus-visible {
outline:3px solid var(--orange)
}
@supports (color:color-mix(in lab, red, red)) {
.brand-news-link:focus-visible {
outline:3px solid color-mix(in srgb, var(--orange), white 24%)
}
}
.brand-news-link:focus-visible {
outline-offset:5px;
border-radius:var(--radius-media)
}
.brand-news-card-copy {
    padding: 1.15rem .2rem 0
}
.brand-news-meta {
    color: var(--grain-gold);
    letter-spacing: .08em;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    font-size: .72rem;
    font-weight: 800;
    display: flex
}
.brand-news-card-copy h3, .brand-news-upcoming h3 {
    color: var(--brown);
    letter-spacing: -.045em;
    margin: .7rem 0 0;
    font-size: clamp(1.35rem, 2vw, 2rem);
    line-height: 1.2
}
.brand-news-card-copy p {
    color: var(--brown-soft);
    margin: .75rem 0 0;
    font-size: .92rem;
    line-height: 1.75
}
.brand-news-upcoming {
    border: 1px solid var(--brown);
    flex-direction: column;
    justify-content: flex-end;
    min-height: clamp(19rem, 29vw, 26rem);
    padding: clamp(1.4rem, 3vw, 2.4rem);
    display: flex;
    position: relative;
    overflow: hidden
}
@supports (color:color-mix(in lab, red, red)) {
.brand-news-upcoming {
border:1px solid color-mix(in srgb, var(--brown) 13%, transparent)
}
}
.brand-news-upcoming {
    border-radius: var(--radius-media);
    color: var(--brown-soft);
    background: radial-gradient(circle at 105% -10%, var(--orange), transparent 42%), #eee5d8
}
@supports (color:color-mix(in lab, red, red)) {
.brand-news-upcoming {
background:radial-gradient(circle at 105% -10%, color-mix(in srgb, var(--orange) 20%, transparent), transparent 42%), #eee5d8
}
}
.brand-news-upcoming-mark {
    color: var(--brown);
    align-self: flex-start;
    margin-top: -.9rem;
    position: absolute
}
@supports (color:color-mix(in lab, red, red)) {
.brand-news-upcoming-mark {
color:color-mix(in srgb, var(--brown) 15%, transparent)
}
}
.brand-news-upcoming-mark {
    font-size: clamp(7rem, 13vw, 12rem);
    font-weight: 200;
    line-height: 1
}
.brand-news-upcoming-ip {
    opacity: .42;
    pointer-events: none;
    width: min(128%, 21rem);
    height: auto;
    position: absolute;
    top: -.5rem;
    right: -2.7rem;
    transform: rotate(-3deg)
}
.brand-news-upcoming p, .brand-news-upcoming>span:last-child {
    margin: 0;
    position: relative
}
.brand-news-upcoming p {
    color: var(--grain-gold);
    letter-spacing: .1em;
    text-transform: uppercase;
    font-size: .72rem;
    font-weight: 800
}
.brand-news-upcoming>span:last-child {
    margin-top: .9rem;
    font-size: .88rem;
    line-height: 1.7
}
.cooperation-showcase {
    gap: clamp(2.8rem, 6vw, 2.5rem);
    display: grid
}
.cooperation-heading {
    text-align: center;
    justify-items: center;
    max-width: 58rem;
    margin-inline: auto;
    display: grid
}
.cooperation-heading h2 {
    text-wrap: balance;
    max-width: none;
    font-size: clamp(2.5rem, 5vw, 5.8rem)
}
.cooperation-manifesto, .contact-manifesto {
    letter-spacing: -.07em;
    white-space: nowrap;
    transform-origin: 50%;
    line-height: 1.04;
    display: inline-block;
    max-width: none!important;
    font-size: clamp(2.75rem, 5.4vw, 6.2rem)!important;
    font-weight: 780!important
}

@media (prefers-reduced-motion:no-preference) {
.cooperation-manifesto, .contact-manifesto {
    animation: 3.2s ease-in-out infinite alternate manifesto-breathe
}
}
@keyframes manifesto-breathe {
0% {
font-weight:750;
transform:translate(-.35rem)scale(1)
}
to {
font-weight:820;
transform:translate(.35rem)scale(1.026)
}
}
.cooperation-ip-layout {
grid-template-columns:minmax(15rem, .72fr) minmax(25rem, 1.28fr);
    align-items: end;
    gap: clamp(1.5rem, 4vw, 5rem);
    width: min(100%, 1280px);
    margin-inline: auto;
    display: grid
}
.cooperation-partners {
    justify-self: end;
    width: min(100%, 30rem)
}
.cooperation-presenter {
    border: 1px solid var(--line);
    border-radius: var(--radius-media);
    box-shadow: var(--shadow);
    background: #f5efe68f;
    position: relative;
    overflow: hidden
}
.cooperation-partners img, .cooperation-presenter img {
    width: 100%;
    height: auto;
    transition: transform .52s cubic-bezier(.16, 1, .3, 1);
    display: block
}
.cooperation-partners:hover img, .cooperation-presenter:hover img, .cooperation-partners:focus-within img, .cooperation-presenter:focus-within img {
transform:scale(1.025)
}
.contact-section {
    background: #c29b611f;
    padding-top: clamp(6rem, 12vw, 11rem)
}
.contact-grid {
grid-template-columns:.8fr 1.2fr;
    align-items: start;
    gap: clamp(3rem, 8vw, 8rem);
    display: grid
}
.contact-copy>a {
    margin-top: 2.2rem;
    font-size: clamp(1.4rem, 3vw, 2.4rem);
    font-weight: 700;
    display: inline-block
}
.form-wrap {
    border: 1px solid var(--line);
    border-radius: var(--radius-media);
    background: #f5efe6ad;
    padding: clamp(1.4rem, 4vw, 3.2rem);
    box-shadow: 0 20px 60px #673a1b17
}
.lead-form {
    gap: 1.6rem;
    display: grid
}
.field-grid {
    grid-template-columns: 1fr 1fr;
    gap: 1.35rem;
    display: grid
}
.lead-form label {
    gap: .55rem;
    display: grid
}
.lead-form label>span {
    font-size: 1.2rem;
    font-weight: 700
}
.lead-form input:not([type=checkbox]) {
    border-radius: var(--radius-input);
    width: 100%;
    min-height: 49px;
    color: var(--brown);
    background: #ffffff8a;
    border: 1px solid #673a1b52;
    padding: 0 .85rem
}
.lead-form input:not([type=checkbox]):focus {
    border-color: var(--accent);
    outline: 3px solid #f2965147
}
.consent-row {
    grid-template-columns: auto 1fr;
    align-items: start;
    gap: .75rem!important
}
.consent-row input {
    width: 20px;
    height: 20px;
    accent-color: var(--brown);
    margin: 0
}
.consent-row span {
    line-height: 1.6;
    font-weight: 500!important
}
.form-error {
    color: #9f321f;
    margin: 0;
    font-size: .88rem;
    font-weight: 700
}
.submit-button {
    width: 100%;
    min-height: 52px;
    color: var(--paper-soft);
    background: var(--brown);
    border: 0;
    gap: .6rem;
    font-weight: 750
}
.submit-button:disabled {
    cursor: wait;
    opacity: .68
}
.form-success {
    text-align: center;
    align-content: center;
    place-items: center;
    gap: .8rem;
    min-height: 390px;
    display: grid
}
.form-success h3 {
    margin: .4rem 0 0;
    font-size: 1.7rem
}
.form-success p {
    max-width: 25rem;
    color: var(--brown-soft);
    margin: 0
}
.text-button {
    color: var(--brown);
    background: 0 0;
    border: 0;
    border-bottom: 1px solid;
    margin-top: 1rem;
    padding: 0 0 .35rem;
    font-weight: 700
}
.site-footer {
    border-top: 1px solid var(--line);
    padding: 4rem 1.25rem 3rem
}
.footer-grid {
    grid-template-columns: 1fr auto auto;
    align-items: end;
    gap: 3rem;
    display: grid
}
.footer-grid img {
    width: 150px;
    height: auto
}
.footer-grid p, .footer-contact span {
    color: var(--brown-soft);
    margin: 1rem 0 0;
    font-size: .82rem
}
.footer-links, .footer-contact {
    gap: .8rem;
    display: grid
}
.footer-contact {
    text-align: right
}
.footer-contact a {
    font-size: 1.05rem;
    font-weight: 700
}

@media (max-width:1023px) {
.desktop-nav, .header-cta, .header-cta-spacer {
    display: none
}
.site-header {
    grid-template-columns: 1fr auto
}
.menu-button {
    display: inline-flex
}
.brand-news-grid {
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    grid-template-columns: none;
    grid-auto-columns: minmax(19rem, 74vw);
    grid-auto-flow: column;
    align-items: stretch;
    gap: 1rem;
    margin-inline: -1.1rem;
    padding: 0 1.1rem 1.4rem;
    display: grid;
    overflow-x: auto
}
.brand-news-grid::-webkit-scrollbar {
display:none
}
.brand-news-card {
    scroll-snap-align: start
}
.brand-news-card-2 {
    margin-bottom: 0
}
.brand-news-media, .brand-news-card-2 .brand-news-media {
    aspect-ratio: 1.15
}
.brand-news-upcoming {
    min-height: 100%
}
}
.contact-copy h2 {
    max-width: none
}
.contact-copy>p {
    white-space: nowrap;
    max-width: none
}

@media (max-width:767px) {
.section {
    padding: 5.6rem 1.1rem
}
.section h2 {
    font-size: clamp(2.35rem, 11.5vw, 3.5rem)
}
.hero {
    min-height: 90dvh;
    padding: 7.2rem 1.1rem 2.5rem
}
.hero-media video {
    object-fit: revert-layer !important;
            object-position: 0 79px !important;
}
.hero-scrim {
    background: linear-gradient(#20140d1a 28%, #20140dc7), linear-gradient(90deg, #20140d2e, #0000)
}
.hero-content {
    padding-bottom: 0rem
}
.hero-content h1 {
    max-width: 12ch;
    font-size: clamp(2.85rem, 12.2vw, 3.75rem)
}
.hero-subtitle {
    font-size: clamp(1.05rem, 5vw, 1.35rem)
}
.hero-actions {
    grid-template-columns: 1fr;
    max-width: 18rem;
    display: grid
}
.hero-actions .button-primary {
    width: fit-content
}
.button {
    width: 100%;
    padding-inline: 1rem
}
.video-controls {
    bottom: 1.25rem;
    right: 1.1rem
}
.about-grid, .about-page-section, .contact-grid, .footer-grid {
    grid-template-columns: 1fr
}
.about-page {
    padding-inline: 1.1rem
}
.about-page-shell {
    gap: 5rem
}
.about-page-section {
    gap: 2.25rem
}
.about-page-copy h1, .about-page-copy h2 {
    font-size: clamp(2.3rem, 10.5vw, 3.55rem)
}
.about-page-media {
    min-height: min(118vw, 38rem)
}
.about-copy {
    padding-left: 0
}
.about-copy h2 {
    max-width: 10ch;
    font-size: clamp(2.35rem, 11.5vw, 3.5rem)
}
.journey-panel {
    width: calc(100% + 1.1rem);
    margin-top: 1rem
}
.journey-toolbar {
    padding-right: 1.1rem
}
.journey-rail {
    -webkit-mask-image: linear-gradient(90deg, #000 0 92%, #0000 100%);
    mask-image: linear-gradient(90deg, #000 0 92%, #0000 100%)
}
.journey-card-portrait {
    width: 68vw
}
.journey-card-landscape {
    width: 82vw
}
.journey-card-media {
    height: min(58vh, 430px)
}
.products-section .section-shell {
    padding-inline: 1.1rem
}
.product-track {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
    margin: clamp(2.4rem, 9vw, 3.5rem) 0 0;
    padding: 0;
    display: grid;
    overflow: visible
}
.product-item {
    min-width: 0
}
.product-item-2 {
    margin-bottom: 0
}
.craft-section {
    width: calc(100% - 2.2rem);
    min-height: 72dvh;
    margin-bottom: 5rem
}
.craft-copy h2 {
    font-size: clamp(1.35rem, 5.7vw, 2rem)
}
.stores-section {
    padding-block: 5rem
}
.store-showcase {
    grid-template-columns: 1fr;
    min-height: 0
}
.store-showcase-copy {
    min-height: 25rem;
    padding: clamp(2.4rem, 10vw, 4rem) clamp(1.6rem, 7vw, 3.25rem)
}
.store-showcase-copy h2 {
    font-size: clamp(2rem, 8.6vw, 3.1rem)
}
.store-showcase-description {
    line-height: 1.85
}
.store-showcase-media {
    min-height: min(69vw, 31rem)
}
.cooperation-heading h2 {
    font-size: clamp(2.1rem, 9.2vw, 3.3rem)
}
.cooperation-heading h2.cooperation-manifesto, .contact-copy h2.contact-manifesto {
    font-size: clamp(1.85rem, 8vw, 3.15rem)!important
}
.brand-news-heading h2 {
    font-size: clamp(1.62rem, 7.4vw, 2.75rem)
}
.cooperation-ip-layout {
    grid-template-columns: 1fr;
    gap: 1.6rem
}
.cooperation-partners {
    justify-self: center;
    width: min(100%, 28rem)
}
.cooperation-presenter {
    width: 100%
}
.field-grid {
    grid-template-columns: 1fr
}
.contact-copy>p {
    white-space: normal
}
.footer-grid {
    align-items: start
}
.footer-links {
    grid-template-columns: 1fr 1fr
}
.footer-contact {
    text-align: left
}
}

@media (prefers-reduced-motion:reduce) {
html {
    scroll-behavior: auto
}
*, :before, :after {
    scroll-behavior: auto!important;
    transition-duration: .01ms!important;
    animation-duration: .01ms!important;
    animation-iteration-count: 1!important
}
}

@media (prefers-reduced-transparency:reduce) {
.site-header, .video-controls button {
    -webkit-backdrop-filter: none;
    backdrop-filter: none
}
.site-header {
    background: var(--paper)
}
}
.cooperation-page {
    padding-bottom: 7.5rem
}
.cooperation-page-hero {
    border-bottom: 1px solid var(--line);
    padding: clamp(8rem, 13vw, 12rem) 1.25rem clamp(5rem, 9vw, 8rem)
}
.cooperation-page-hero-grid {
grid-template-columns:minmax(0, .9fr) minmax(20rem, 1.1fr);
    align-items: center;
    gap: clamp(2.5rem, 7vw, 8rem);
    display: grid
}
.cooperation-page-hero-copy>p, .cooperation-detail-label, .cooperation-faq-heading>p {
    color: var(--grain-gold);
    letter-spacing: .14em;
    margin: 0 0 1rem;
    font-size: .78rem;
    font-weight: 800
}
.cooperation-page-hero-copy h1 {
    max-width: 9ch;
    color: var(--brown);
    letter-spacing: -.08em;
    margin: 0;
    font-size: clamp(3.2rem, 6.2vw, 7rem);
    line-height: .98
}
.cooperation-page-hero-copy>span, .cooperation-faq-heading>span {
    max-width: 31rem;
    color: var(--brown-soft);
    margin-top: 1.6rem;
    font-size: clamp(1rem, 1.35vw, 1.16rem);
    line-height: 1.9;
    display: block
}
.cooperation-page-hero-media {
    border: 1px solid var(--line);
    border-radius: var(--radius-media);
    min-height: clamp(18rem, 34vw, 34rem);
    box-shadow: var(--shadow);
    background: #f5efe6ad;
    place-items: end center;
    display: grid;
    overflow: hidden
}
.cooperation-page-hero-media img {
    width: 100%;
    height: auto;
    transition: transform .52s cubic-bezier(.16, 1, .3, 1)
}
.cooperation-page-hero-media:hover img {
    transform: scale(1.025)
}
.cooperation-page-content {
    gap: clamp(5.5rem, 12vw, 11rem);
    padding-block: clamp(5.5rem, 12vw, 11rem);
    display: grid
}
.cooperation-detail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: clamp(2.5rem, 8vw, 9rem);
    display: grid
}
.cooperation-detail-reversed .cooperation-detail-copy {
    order: 2
}
.cooperation-detail-reversed .cooperation-detail-media {
    order: 1
}
.cooperation-detail-copy h2, .cooperation-faq-heading h2 {
    max-width: 10ch;
    color: var(--brown);
    letter-spacing: -.07em;
    margin: 0;
    font-size: clamp(2.45rem, 4.5vw, 5.25rem);
    line-height: 1.04
}
.cooperation-detail-copy>p:not(.cooperation-detail-label) {
    max-width: 31rem;
    color: var(--brown-soft);
    margin: 1.5rem 0 0;
    font-size: clamp(.98rem, 1.2vw, 1.12rem);
    line-height: 1.9
}
.cooperation-points, .cooperation-steps {
    gap: .85rem;
    margin: 2rem 0 0;
    padding: 0;
    list-style: none;
    display: grid
}
.cooperation-points li, .cooperation-steps li {
    border-bottom: 1px solid var(--line);
    min-height: 2.5rem;
    color: var(--brown);
    align-items: center;
    gap: .75rem;
    font-weight: 700;
    display: flex
}
.cooperation-points li:before {
    background: var(--accent);
    content: "";
    border-radius: 50%;
    flex: none;
    width: .45rem;
    height: .45rem
}
.cooperation-steps li span {
    color: var(--grain-gold);
    letter-spacing: .08em;
    font-size: .78rem;
    font-weight: 800
}
.cooperation-detail-media {
    border: 1px solid var(--line);
    border-radius: var(--radius-media);
    min-height: clamp(22rem, 38vw, 37rem);
    box-shadow: var(--shadow);
    background: #e4d7c7;
    position: relative;
    overflow: hidden
}
.cooperation-detail-media-cover img {
    object-fit: cover;
    transition: transform .6s cubic-bezier(.16, 1, .3, 1)
}
.cooperation-detail-media-contain {
    background: #f5efe6b3
}
.cooperation-detail-media-contain img {
    object-fit: contain;
    padding: clamp(1.2rem, 3vw, 3rem);
    transition: transform .6s cubic-bezier(.16, 1, .3, 1)
}
.cooperation-detail-media:hover img {
    transform: scale(1.03)
}
.cooperation-faq {
grid-template-columns:minmax(0, .8fr) minmax(20rem, 1.15fr);
    grid-template-areas: "heading list""media list";
    align-items: start;
    gap: clamp(2rem, 5vw, 5rem) clamp(2.5rem, 8vw, 9rem);
    padding-top: clamp(1rem, 3vw, 3rem);
    display: grid
}
.cooperation-faq-heading {
    grid-area: heading
}
.cooperation-faq-list {
    grid-area: list
}
.cooperation-faq-list details {
    border-top: 1px solid var(--line)
}
.cooperation-faq-list details:last-child {
    border-bottom: 1px solid var(--line)
}
.cooperation-faq-list summary {
    cursor: pointer;
    min-height: 5rem;
    color: var(--brown);
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    font-size: clamp(1.05rem, 1.5vw, 1.34rem);
    font-weight: 750;
    list-style: none;
    display: flex
}
.cooperation-faq-list summary::-webkit-details-marker {
display:none
}
.cooperation-faq-list summary:after {
    color: var(--grain-gold);
    content: "+";
    flex: none;
    font-size: 1.8rem;
    font-weight: 400
}
.cooperation-faq-list details[open] summary:after {
    content: "−"
}
.cooperation-faq-list details p {
    max-width: 38rem;
    color: var(--brown-soft);
    margin: -.3rem 0 1.5rem;
    line-height: 1.85
}
.cooperation-faq-media {
    border-radius: var(--radius-media);
    background: #d8c8b3;
    grid-area: media;
    min-height: 16rem;
    position: relative;
    overflow: hidden
}
.cooperation-faq-media img {
    object-fit: cover
}
.cooperation-float-cta {
    z-index: calc(var(--nav-layer) + 1);
    border-radius: var(--radius-action);
    min-height: 3.7rem;
    color: var(--paper-soft);
    background: var(--brown);
    border: 1px solid #f5efe67a;
    align-items: center;
    gap: .8rem;
    padding: .45rem .55rem .45rem 1.25rem;
    font-weight: 800;
    transition: transform .22s, background .22s;
    display: inline-flex;
    position: fixed;
    bottom: clamp(1.25rem, 3vw, 2.8rem);
    right: clamp(1.25rem, 3vw, 2.8rem);
    box-shadow: 0 16px 38px #41230f45
}
.cooperation-float-cta i {
    width: 2.7rem;
    height: 2.7rem;
    color: var(--brown);
    background: var(--paper-soft);
    border-radius: 50%;
    place-items: center;
    font-style: normal;
    display: grid
}
.cooperation-float-cta:hover, .cooperation-float-cta:focus-visible {
background:#512b12;
transform:translateY(-.2rem)
}
.cooperation-float-cta:active {
    transform: translateY(0)
}

@media (max-width:767px) {
.cooperation-page {
    padding-bottom: 6.5rem
}
.cooperation-page-hero {
    padding: 7.5rem 1.1rem 5rem
}
.cooperation-page-hero-grid, .cooperation-detail, .cooperation-faq {
    grid-template-columns: 1fr
}
.cooperation-page-hero-copy h1 {
    max-width: 10ch;
    font-size: clamp(3rem, 13vw, 4.4rem)
}
.cooperation-page-hero-media {
    min-height: 17rem
}
.cooperation-page-content {
    gap: 5.5rem;
    padding-block: 5.5rem
}
.cooperation-detail-reversed .cooperation-detail-copy, .cooperation-detail-reversed .cooperation-detail-media {
    order: initial
}
.cooperation-detail-copy h2, .cooperation-faq-heading h2 {
    max-width: 11ch;
    font-size: clamp(2.25rem, 10.2vw, 3.5rem)
}
.cooperation-detail-media {
    min-height: min(94vw, 29rem)
}
.cooperation-faq {
    grid-template-areas: "heading""list""media";
    gap: 2.5rem
}
.cooperation-faq-media {
    min-height: 14rem
}
.cooperation-float-cta {
    right: 50%;
    bottom: max(1rem, env(safe-area-inset-bottom));
    min-height: 3.35rem;
    padding-left: 1.05rem;
    transform: translate(50%)
}
.cooperation-float-cta:hover, .cooperation-float-cta:focus-visible {
transform:translate(50%)translateY(-.15rem)
}
.cooperation-float-cta:active {
    transform: translate(50%)
}
.cooperation-float-cta i {
    width: 2.35rem;
    height: 2.35rem
}
}
.return-button {
    z-index: 30;
    right: clamp(1rem, 3vw, 2.25rem);
    top: max(5.6rem, calc(env(safe-area-inset-top) + 7.75rem));
    border: 1px solid var(--brown);
    border-radius: var(--radius-action);
    min-height: 42px;
    color: var(--paper-soft);
    background: var(--brown);
    letter-spacing: .08em;
    white-space: nowrap;
    cursor: pointer;
    align-items: center;
    gap: 1.05rem;
    margin: 0;
    padding: .3rem .35rem .3rem 1.05rem;
    font-size: .78rem;
    font-weight: 750;
    line-height: 1;
    text-decoration: none;
    transition: transform .24s, background-color .24s;
    display: inline-flex;
    position: fixed;
    box-shadow: 0 12px 28px #522d1433
}
.return-button i {
    width: 30px;
    height: 30px;
    color: var(--brown);
    background: var(--paper-soft);
    border-radius: 50%;
    place-items: center;
    font-style: normal;
    transition: transform .24s;
    display: grid
}
.return-button:hover, .return-button:focus-visible {
background:#512b12
}
.cooperation-page-refined {
    padding-bottom: clamp(5rem, 10vw, 1rem)
}
.cooperation-refined-hero {
    border-bottom: 1px solid var(--line);
    padding: clamp(8rem, 13vw, 11.5rem) 1.25rem clamp(5rem, 9vw, 8rem)
}
.cooperation-refined-hero-grid {
grid-template-columns:minmax(0, .85fr) minmax(24rem, 1.15fr);
    align-items: center;
    gap: clamp(3rem, 8vw, 10rem);
    display: grid
}
.cooperation-refined-hero-copy>p, .cooperation-section-heading>p, .cooperation-conditions-copy>p, .cooperation-form-copy>p {
    color: var(--grain-gold);
    letter-spacing: .14em;
    margin: 0 0 1rem;
    font-size: .78rem;
    font-weight: 800
}
.cooperation-refined-hero-copy>p {
    color: var(--brown);
    letter-spacing: -.08em;
    margin-bottom: 1.25rem;
    font-size: clamp(3.2rem, 6.1vw, 7rem);
    line-height: .92
}
.cooperation-section-heading>p, .cooperation-conditions-copy>p {
    letter-spacing: -.065em;
    font-size: clamp(1.75rem, 3.1vw, 3.45rem);
    line-height: 1
}
.cooperation-refined-hero-copy h1, .cooperation-section-heading h2, .cooperation-conditions-copy h2, .cooperation-form-copy h2 {
    color: var(--brown);
    letter-spacing: -.075em;
    margin: 0;
    font-weight: 740;
    line-height: 1.02
}
.cooperation-refined-hero-copy h1 {
    max-width: 19ch;
    font-size: clamp(2.45rem, 3.75vw, 4.45rem)
}
.cooperation-refined-hero-copy>span, .cooperation-section-heading>span, .cooperation-conditions-copy>span, .cooperation-form-copy>span {
    max-width: 35rem;
    color: var(--brown-soft);
    margin-top: 1.5rem;
    font-size: clamp(1rem, 1.35vw, 1.16rem);
    line-height: 1.9;
    display: block
}
.cooperation-refined-hero-media {
    border-radius: var(--radius-media);
    min-height: clamp(23rem, 38vw, 38rem);
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden
}
.cooperation-refined-hero-media img, .cooperation-support-card-media img, .cooperation-conditions-media img, .cooperation-form-visual img {
    object-fit: cover;
    transition: transform .42s cubic-bezier(.16, 1, .3, 1)
}
.cooperation-refined-hero-media:hover img, .cooperation-support-card:hover img, .cooperation-conditions-media:hover img, .cooperation-form-visual:hover img {
    transform: scale(1.025)
}
.cooperation-refined-content {
    gap: clamp(6.5rem, 13vw, 12rem);
    padding-top: clamp(5.5rem, 10vw, 9rem);
    display: grid
}
.cooperation-section-heading {
    max-width: 52rem
}
.cooperation-section-heading h2, .cooperation-conditions-copy h2, .cooperation-form-copy h2 {
    max-width: 12ch;
    font-size: clamp(3.1rem, 5.5vw, 6.4rem)
}
.cooperation-advantages .cooperation-section-heading h2 {
    white-space: nowrap;
    max-width: none;
    font-size: clamp(2.75rem, 4.5vw, 5.35rem)
}
.cooperation-support-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1rem, 2.4vw, 2.4rem);
    margin-top: clamp(3rem, 6vw, 5.5rem);
    display: grid
}
.cooperation-support-card {
    border: 1px solid var(--line);
    border-radius: var(--radius-media);
    background: #f5efe67a;
    overflow: hidden;
    box-shadow: 0 18px 45px #673a1b14
}
.cooperation-support-card-media {
    aspect-ratio: 4/3;
    position: relative;
    overflow: hidden
}
.cooperation-support-card-copy {
    padding: clamp(1.25rem, 2vw, 1.8rem)
}
.cooperation-support-card h3 {
    letter-spacing: -.045em;
    margin: 0;
    font-size: clamp(1.65rem, 2.3vw, 2.25rem)
}
.cooperation-support-card p {
    color: var(--brown-soft);
    margin: .8rem 0 0;
    font-size: clamp(1.06rem, 1.35vw, 1.2rem);
    line-height: 1.8
}
.cooperation-conditions {
grid-template-columns:minmax(21rem, 1fr) minmax(18rem, .8fr);
    align-items: center;
    gap: clamp(3rem, 9vw, 11rem);
    display: grid
}
.cooperation-conditions-media {
    border-radius: var(--radius-media);
    min-height: clamp(25rem, 42vw, 41rem);
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden
}
.cooperation-conditions-copy ul {
    gap: .95rem;
    margin: 2rem 0 0;
    padding: 0;
    list-style: none;
    display: grid
}
.cooperation-conditions-copy li {
    border-bottom: 1px solid var(--line);
    min-height: 3.1rem;
    color: var(--brown);
    align-items: center;
    gap: .7rem;
    font-size: clamp(1.1rem, 1.55vw, 1.35rem);
    font-weight: 720;
    display: flex
}
.cooperation-conditions-copy li svg {
    color: var(--grain-gold);
    flex: none
}
.cooperation-process {
grid-template-columns:minmax(12rem, .45fr) minmax(36rem, 1.55fr);
    align-items: center;
    gap: clamp(3rem, 9vw, 11rem);
    display: grid
}
.cooperation-process-heading {
    align-self: start;
    padding-top: .65rem
}
.cooperation-milestones {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: start;
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid
}
.cooperation-milestones li {
    gap: 1.35rem;
    min-width: 0;
    display: grid;
    position: relative
}
.cooperation-milestones li:not(:last-child):after {
    background: var(--line);
    content: "";
    height: 1px;
    position: absolute;
    top: 2rem;
    left: calc(4rem + 1px);
    right: 0
}
.cooperation-milestones span {
    z-index: 1;
    border: 1px solid var(--brown);
    width: 4rem;
    height: 4rem;
    color: var(--paper-soft);
    background: var(--brown);
    letter-spacing: .08em;
    border-radius: 50%;
    place-items: center;
    font-size: .9rem;
    font-weight: 800;
    display: grid;
    position: relative
}
.cooperation-milestones strong {
    max-width: 7ch;
    color: var(--brown);
    font-size: clamp(1.15rem, 1.65vw, 1.45rem);
    line-height: 1.4
}
.cooperation-form-section {
    border: 1px solid var(--line);
    border-radius: var(--radius-media);
    background: #c29b611a;
grid-template-columns:minmax(18rem, .8fr) minmax(25rem, 1.2fr);
    align-items: start;
    gap: clamp(3rem, 9vw, 11rem);
    padding: clamp(2.5rem, 6vw, 5.5rem);
    display: grid
}
.cooperation-form-section .form-wrap {
    padding: clamp(1.4rem, 3vw, 2.5rem)
}
.cooperation-form-visual {
    aspect-ratio: 4/3;
    border-radius: calc(var(--radius-media) - .35rem);
    margin-top: 1.15rem;
    position: relative;
    overflow: hidden
}
.cooperation-form-visual img {
    object-fit: cover
}
.cooperation-form-copy>.cooperation-form-visual+span {
    margin-top: 1.35rem
}
.cooperation-form-copy>span {
    white-space: nowrap
}

@media (max-width:1023px) {
.cooperation-support-grid {
    grid-template-columns: 1fr
}
.cooperation-support-card {
grid-template-columns:minmax(12rem, .9fr) minmax(16rem, 1.1fr);
    display: grid
}
.cooperation-support-card-copy {
    align-self: center
}
.cooperation-process {
    grid-template-columns: 1fr
}
}

@media (max-width:767px) {
.cooperation-refined-hero {
    padding: 7.5rem 1.1rem 5rem
}
.cooperation-refined-hero-grid, .cooperation-conditions, .cooperation-form-section {
    grid-template-columns: 1fr
}
.cooperation-refined-hero-copy h1 {
    font-size: clamp(2.3rem, 9.2vw, 3.65rem)
}
.cooperation-refined-hero-copy>p {
    font-size: clamp(3rem, 13.2vw, 4.8rem)
}
.cooperation-section-heading h2, .cooperation-conditions-copy h2, .cooperation-form-copy h2 {
    font-size: clamp(2.9rem, 12vw, 4.5rem)
}
.cooperation-advantages .cooperation-section-heading h2 {
    white-space: normal;
    font-size: clamp(2.35rem, 9.7vw, 3.8rem)
}
.cooperation-refined-hero-media {
    min-height: min(102vw, 30rem)
}
.cooperation-refined-content {
    gap: 5.5rem;
    padding-top: 5rem
}
.cooperation-support-grid {
    gap: 1.1rem;
    margin-top: 2.5rem
}
.cooperation-support-card {
    grid-template-columns: 1fr
}
.cooperation-conditions-media {
    min-height: min(95vw, 31rem)
}
.cooperation-process {
    gap: 2.5rem
}
.cooperation-milestones {
    grid-template-columns: 1fr;
    gap: 1.25rem
}
.cooperation-milestones li {
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 1rem
}
.cooperation-milestones li:not(:last-child):after {
    width: 1px;
    height: auto;
    inset: 4rem auto -1.25rem 2rem
}
.cooperation-milestones strong {
    max-width: none
}
.cooperation-form-section {
    gap: 2.5rem;
    padding: 1.3rem
}
.cooperation-form-visual {
    margin-top: .9rem
}
.cooperation-form-copy>span {
    letter-spacing: -.045em;
    font-size: .86rem
}
}
.return-button:hover i, .return-button:focus-visible i {
transform:translate(-.14rem)
}
.return-button:active {
    transform: scale(.98)
}
.secondary-page {
    min-height: 100dvh;
    padding-bottom: clamp(5rem, 10vw, 9rem)
}
.secondary-page-hero {
    border-bottom: 1px solid var(--line);
    padding: clamp(10rem, 8vw, 4rem) 1.25rem clamp(4rem, 8vw, 4rem)
}
.secondary-page-heading {
    max-width: 48rem
}
.secondary-page-heading>p {
    color: var(--grain-gold);
    letter-spacing: .14em;
    margin: 0 0 1rem;
    font-size: 2rem;
    font-weight: 800
}
.secondary-page-heading h1 {
    max-width: 12ch;
    color: var(--brown);
    letter-spacing: -.07em;
    margin: 0;
    font-size: clamp(3rem, 5.8vw, 6.4rem);
    font-weight: 720;
    line-height: 1.03
}
.secondary-page-heading h1 span {
    display: block
}
.secondary-page-heading>span {
    max-width: 38rem;
    color: var(--brown-soft);
    margin-top: 1.5rem;
    font-size: clamp(1rem, 1.3vw, 1.14rem);
    line-height: 1.85;
    display: block
}
.secondary-page-content {
    padding-top: clamp(4rem, 0vw, 7rem);
    padding-bottom: 45px;
}
.products-philosophy {
    border-bottom: 1px solid var(--line);
    padding-top: 12rem !important;
    padding: clamp(4.5rem, 13vw, .5rem) 1.25rem clamp(4.5rem, 8vw, .5rem)
}
.products-philosophy-layout {
grid-template-columns:minmax(18rem, .92fr) minmax(31rem, 1.08fr);
    align-items: center;
    gap: clamp(2rem, 6vw, 6rem);
    display: grid
}
.products-philosophy-copy {
    max-width: 38rem
}
.products-philosophy-copy h1 {
    color: var(--brown);
    letter-spacing: -.07em;
    margin: 0;
    font-size: clamp(3.1rem, 5.2vw, 5.9rem);
    font-weight: 720;
    line-height: 1
}
.products-philosophy-description {
    max-width: 33rem;
    color: var(--brown-soft);
    margin: clamp(1.35rem, 2.4vw, 2rem) 0 0;
    font-size: clamp(1.02rem, 1.3vw, 1.18rem);
    line-height: 1.8
}
.products-philosophy-description span {
    display: block
}
.products-philosophy-description span+span {
    margin-top: .5rem
}
.products-philosophy-photo {
    border: 1px solid var(--line);
    border-radius: var(--radius-media);
    min-height: clamp(18rem, 34vw, 34rem);
    box-shadow: var(--shadow);
    margin: 0;
    position: relative;
    overflow: hidden
}
.products-philosophy-photo img {
    object-fit: cover
}

@media (prefers-reduced-motion:no-preference) {
.products-philosophy-photo img {
    transition: transform .42s cubic-bezier(.16, 1, .3, 1)
}
.products-philosophy-photo:hover img {
    transform: scale(1.035)
}
}
.products-catalog-section {
    padding-top: clamp(4rem, 5vw, 1.5rem)
}
.product-catalog-tabs {
    border-bottom: 1px solid var(--line);
    gap: .65rem;
    padding-bottom: 1.1rem;
    display: flex
}
.product-catalog-tabs a {
    border: 1px solid var(--brown);
    border-radius: var(--radius-action);
    min-width: 8.6rem;
    min-height: 3rem;
    color: var(--brown);
    font: inherit;
    cursor: pointer;
    background: 0 0;
    font-weight: 800;
    display: inline-table;
    text-align: center;
    line-height: 3rem;
    transition: color .18s, background .18s, transform .18s
}
.product-catalog-tabs a.sub_nav_hover{
    color: var(--paper-soft);
    background: var(--brown)
}
.product-catalog-tabs a:hover, .product-catalog-tabs a:focus-visible {
transform:translateY(-.12rem)
}
.product-catalog-tabs a:focus-visible, .product-catalog-card:focus-visible {
outline:3px solid var(--grain-gold);
outline-offset:4px
}
.product-catalog-tab:active {
    transform: scale(.98)
}
.product-catalog-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: clamp(1.25rem, 2.4vw, 2.4rem) clamp(.8rem, 1.6vw, 1.5rem);
    padding-top: clamp(2.4rem, 5vw, 4.5rem);
    display: grid;
    padding-bottom: clamp(2.4rem, 5vw, 4.5rem); 
}
.product-catalog-card {
    outline: none;
    min-width: 0
}
.product-catalog-media {
    border-radius: var(--radius-media);
    box-shadow: var(--shadow);
    background: #673a1b14;
    position: relative;
    overflow: hidden
}
.product-catalog-grid-rice-balls .product-catalog-media {
    aspect-ratio: 1
}
.product-catalog-grid-drinks .product-catalog-media {
    aspect-ratio: 4/3
}
.product-catalog-media img {
    object-fit: contain;
    transition: transform .26s cubic-bezier(.16, 1, .3, 1)
}
.product-catalog-overlay {
    min-height: 25%;
    color: var(--paper-soft);
    text-align: center;
    background: #48250fc2;
    place-items: center;
    margin: 0;
    padding: .6rem;
    font-size: clamp(.72rem, .9vw, .88rem);
    font-weight: 700;
    line-height: 1.35;
    transition: transform .26s cubic-bezier(.16, 1, .3, 1);
    display: grid;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateY(101%)
}
.product-catalog-card:hover .product-catalog-media img, .product-catalog-card:focus-visible .product-catalog-media img {
transform:scale(1.3)
}
.product-catalog-card:hover .product-catalog-overlay, .product-catalog-card:focus-visible .product-catalog-overlay {
transform:translateY(0)
}
.product-catalog-card h2 {
    color: var(--brown);
    letter-spacing: -.035em;
    margin: .85rem 0 0;
    font-size: clamp(.92rem, 1.18vw, 1.12rem);
    line-height: 1.35
}
.product-page-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end;
    gap: clamp(1rem, 2.6vw, 2.8rem);
    display: grid
}
.product-page-figure, .store-page-figure, .news-page-media {
    border-radius: var(--radius-media);
    box-shadow: var(--shadow);
    background: #673a1b14;
    margin: 0;
    position: relative;
    overflow: hidden
}

.store-page-figure img{}

.product-page-figure {
    aspect-ratio: 4/5.15
}
.product-page-figure:nth-child(2) {
    margin-bottom: clamp(1.5rem, 4vw, 4rem)
}
.product-page-figure img, .store-page-figure img, .news-page-media img {
    object-fit: cover;    width: 100%;
    height: 100%;
    transition: transform .32s cubic-bezier(.16, 1, .3, 1)
}
.product-page-figure:hover img, .store-page-figure:hover img, .news-page-card a:hover .news-page-media img, .news-page-card a:focus-visible .news-page-media img {
transform:scale(1.025)
}
.store-page-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(1rem, 2.3vw, 2.2rem);
    display: grid
}
.store-page-figure {
    aspect-ratio: 1.35
}
.news-page-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: clamp(1.1rem, 2.4vw, 2.5rem);
    display: grid
}
.news-page-card a {
    display: block
}
.news-page-media {
    aspect-ratio: 1/1.12
}
.news-page-media>span {
    width: 2.8rem;
    height: 2.8rem;
    color: var(--brown);
    background: var(--paper-soft);
    border-radius: 50%;
    place-items: center;
    display: grid;
    position: absolute;
    bottom: 1rem;
    right: 1rem
}
.news-page-card a>div:last-child {
    padding: 1.05rem .2rem 0
}
.news-page-card p, .news-page-upcoming>p {
    color: var(--grain-gold);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin: 0;
    font-size: 1rem;
    font-weight: 800
}
.news-page-card time {
    color: var(--brown-soft);
    margin-top: .45rem;
    font-size: .78rem;
    font-weight: 700;
    display: block
}
.news-page-card h2, .news-page-upcoming h2 {
    color: var(--brown);
    letter-spacing: -.045em;
    margin: .75rem 0 0;
    font-size: clamp(1.45rem, 2vw, 2rem);
    line-height: 1.2
}
.news-page-card div:last-child>span, .news-page-upcoming>span {
    color: var(--brown-soft);
    margin-top: .75rem;
    font-size: .92rem;
    line-height: 1.75;
    display: block
}
.news-page-upcoming {
    border: 1px solid var(--line);
    border-radius: var(--radius-media);
    background: #f5efe699;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 100%;
    padding: clamp(1.4rem, 3vw, 2.3rem);
    display: flex;
    position: relative;
    overflow: hidden
}
.news-page-upcoming img {
    opacity: .36;
    pointer-events: none;
    width: 125%;
    height: auto;
    position: absolute;
    top: 0;
    right: -2rem
}
.news-page-upcoming>p, .news-page-upcoming h2, .news-page-upcoming>span {
    position: relative
}
.contact-page-grid {
grid-template-columns:minmax(14rem, .72fr) minmax(22rem, 1.28fr);
    align-items: start;
    gap: clamp(2.5rem, 8vw, 8rem);
    display: grid
}
.contact-page-details {
    padding-top: clamp(1.5rem, 5vw, 4rem)
}
.contact-page-details a {
    letter-spacing: -.05em;
    font-size: clamp(1.8rem, 3.4vw, 3.1rem);
    font-weight: 750;
    display: block
}
.contact-page-details p, .contact-page-details span {
    color: var(--brown-soft);
    margin: 1rem 0 0;
    line-height: 1.75;
    display: block
}

@media (max-width:767px) {
.secondary-page-hero {
    padding: 7.5rem 1.1rem 4.5rem
}
.secondary-page-heading h1 {
    max-width: 12ch;
    font-size: clamp(2.7rem, 11.6vw, 4rem)
}
.secondary-page-content {
    padding-inline: 1.1rem;
    padding-top: 4rem
}
.products-philosophy {
    padding: 7.5rem 1.1rem 4.5rem
}
.products-philosophy-layout {
    grid-template-columns: 1fr;
    gap: 2.4rem
}
.products-philosophy-copy h1 {
    font-size: clamp(2.7rem, 12vw, 4rem)
}
.products-philosophy-description {
    margin-top: 1.15rem;
    font-size: clamp(.95rem, 4.1vw, 1.08rem)
}
.products-philosophy-description span+span {
    margin-top: .35rem
}
.products-philosophy-photo {
    aspect-ratio: 3/2;
    min-height: 0
}
.products-catalog-section {
    padding-inline: 1.1rem;
    padding-top: 3dvh !important;
}
.product-catalog-tabs {
    gap: .5rem
}
.product-catalog-tab {
    flex: 1;
    min-width: 0
}
.product-catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.7rem .75rem;
    padding-top: 2.3rem
}
.product-catalog-card h2 {
    margin-top: .65rem;
    font-size: .92rem
}
.product-catalog-overlay {
    padding: .45rem;
    font-size: .7rem
}
.product-page-gallery {
    gap: .65rem
}
.product-page-figure:nth-child(2) {
    margin-bottom: 0
}
.store-page-gallery, .news-page-grid, .contact-page-grid {
    grid-template-columns: 1fr
}
.store-page-gallery {
    gap: 1rem
}
.store-page-figure {
    aspect-ratio: 1.22
}
.news-page-grid {
    gap: 3rem
}
.news-page-upcoming {
    min-height: 23rem
}
.contact-page-details {
    padding-top: 0
}
.return-button {
    right: 1rem;
    top: max(5.4rem, calc(env(safe-area-inset-top) + 4.5rem))
}
}
@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-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-content {
syntax:"*";
inherits:false;
initial-value:""
}
@property --tw-font-weight {
syntax:"*";
inherits:false
}