@charset "utf-8";

@font-face{
    font-family: "Cormorant Garamond";
    font-style: normal;
    font-weight: 500 600;
    font-display: swap;
    src: url("../fonts/cormorant-garamond-latin.woff2") format("woff2");
}

@font-face{
    font-family: "Cormorant Garamond";
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/cormorant-garamond-italic-latin.woff2") format("woff2");
}

@font-face{
    font-family: "Jost";
    font-style: normal;
    font-weight: 300 600;
    font-display: swap;
    src: url("../fonts/jost-latin.woff2") format("woff2");
}

:root{
    --cream: #f7f2e7;
    --cream_2: #f3ecdd;
    --cream_3: #eee4cf;
    --paper: #fbf7ee;
    --ink: #2b2a24;
    --ink_60: rgba(43,42,36,.6);
    --ink_80: rgba(43,42,36,.82);
    --olive: #6d7256;
    --olive_deep: #565a44;
    --lavender: #8f88ac;
    --cream_text: #f5efe0;
    --hairline: rgba(43,42,36,.16);
    --font_serif: "Cormorant Garamond", Georgia, serif;
    --font_sans: "Jost", "Segoe UI", sans-serif;
}

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html{
    scroll-behavior: auto;
}

body{
    background: var(--cream);
    color: var(--ink);
    font-family: var(--font_sans);
    font-size: 18px;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

img{
    display: block;
    max-width: 100%;
}

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

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

em{
    font-style: italic;
    font-weight: 400;
}

p{
    color: var(--ink_80);
}

.pad_page{
    width: min(1400px, calc(100% - 48px));
    margin: auto;
}

.eyebrow{
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: var(--olive);
}

.eyebrow::before{
    content: "";
    width: 44px;
    height: 1.5px;
    background: currentColor;
    flex: none;
}

.eyebrow.center{
    justify-content: center;
}

.eyebrow.center::after{
    content: "";
    width: 44px;
    height: 1.5px;
    background: currentColor;
    flex: none;
}

.btn,
.btn_ghost,
.link_u{
    display: inline-block;
    font-size: 14px;
    letter-spacing: .22em;
    text-transform: uppercase;
    transition: background .3s, color .3s, transform .3s, border-color .3s;
}

.btn{
    background: var(--olive);
    color: var(--cream_text);
    font-weight: 500;
    border-radius: 44px;
    padding: 16px 34px;
}

.btn:hover{
    background: var(--olive_deep);
    transform: translateY(-2px);
}

.btn_ghost{
    border: 1.5px solid var(--cream_text);
    color: var(--cream_text);
    border-radius: 44px;
    padding: 15px 32px;
}

.btn_ghost:hover{
    background: var(--cream_text);
    color: var(--ink);
}

.link_u{
    padding-bottom: 6px;
    border-bottom: 1.5px solid currentColor;
}

.link_u:hover{
    color: var(--olive);
}

.rv{
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .8s ease, transform .8s ease;
}

.rv.in{
    opacity: 1;
    transform: none;
}

.rv.d1{
    transition-delay: .12s;
}

.rv.d2{
    transition-delay: .24s;
}

.rv.d3{
    transition-delay: .36s;
}