/* ─── TOKENS ─── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --ink:    #0D0D0B;
    --sky:    #BDD5E8;
    --lime:   #f0e89e;
    --lime-d: #d8cf84;
    --white:  #FFFFFF;
    --bg:     #F0EFEA;
    --grey:   #E0DFD8;
    --mid:    #7A7872;

    --ff-ser:  'Instrument Serif', serif;
    --ff-body: 'Manrope', sans-serif;
    --ff-cnd:  'Manrope', sans-serif;

    --px: clamp(24px, 5vw, 80px);
    --mw: 1280px;
}

html { scroll-behavior: smooth; }
body {
    background: var(--bg);
    color: var(--ink);
    font-family: var(--ff-body);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
a { text-decoration: none; color: inherit; }

/* ─── BUTTONS ─── */
.btn {
    display: inline-flex; align-items: center; justify-content: center;
    font-family: var(--ff-cnd); font-size: 12px; font-weight: 700;
    letter-spacing: .15em; text-transform: uppercase;
    padding: 14px 28px; border-radius: 2px; border: 1.5px solid transparent;
    cursor: pointer; transition: background .2s, color .2s, border-color .2s;
    white-space: nowrap; line-height: 1;
}
.btn-dark         { background: var(--ink);  color: var(--white); border-color: var(--ink); }
.btn-dark:hover   { background: #2a2a28; border-color: #2a2a28; }
.btn-outline      { background: transparent; color: var(--ink); border-color: var(--ink); }
.btn-outline:hover{ background: var(--ink); color: var(--white); }
.btn-lg { font-size: 13px; padding: 16px 34px; }

/* ─── NAV ─── */
nav {
    position: fixed; inset: 0 0 auto; z-index: 100;
    display: flex; align-items: center; justify-content: space-between;
    padding: 18px var(--px);
    background: rgba(240,239,234,.94);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-bottom: 1.5px solid transparent;
    transition: border-color .3s;
}
nav.scrolled { border-bottom-color: var(--grey); }
.nav-brand {
    font-family: var(--ff-cnd); font-size: 20px; font-weight: 800;
    letter-spacing: .22em; text-transform: uppercase; color: var(--ink);
}
.nav-links { list-style: none; display: flex; gap: 28px; align-items: center; }
.nav-links a {
    font-family: var(--ff-cnd); font-size: 13px; font-weight: 700;
    letter-spacing: .15em; text-transform: uppercase;
    color: var(--ink); opacity: .45; transition: opacity .2s;
}
.nav-links a:hover { opacity: 1; }
.nav-right { display: flex; align-items: center; gap: 20px; }
.nav-icons { display: flex; align-items: center; gap: 14px; }
.nav-icon {
    display: flex; align-items: center; justify-content: center;
    color: var(--ink); opacity: .45; transition: opacity .2s;
}
.nav-icon:hover { opacity: 1; }

/* ─── FOOTER ─── */
footer {
    background: var(--ink); color: var(--white);
    padding: 36px var(--px);
    display: flex; flex-direction: column; gap: 16px;
}
.foot-top {
    display: flex; align-items: center;
    justify-content: space-between; flex-wrap: wrap; gap: 16px;
}
.foot-legal { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.foot-brand, .foot-name, .foot-info {
    font-family: var(--ff-cnd); font-size: 11px; font-weight: 800;
    letter-spacing: .22em; text-transform: uppercase;
    color: rgba(255,255,255,.4); text-decoration: none; transition: opacity .2s;
}
a.foot-info:hover { opacity: 1; color: rgba(255,255,255,1); }

/* ─── COOKIE BANNER ─── */
#cookie-banner {
    position: fixed; inset: auto 0 0; z-index: 999;
    background: rgba(13,13,11,.97); backdrop-filter: blur(10px);
    border-top: 1px solid rgba(255,255,255,.08);
    padding: 16px var(--px);
    display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
    transform: translateY(100%);
    transition: transform .35s cubic-bezier(.4,0,.2,1);
}
#cookie-banner.visible { transform: translateY(0); }
#cookie-banner p {
    font-family: var(--ff-cnd); font-size: 12px; font-weight: 500;
    letter-spacing: .08em; text-transform: uppercase;
    color: rgba(255,255,255,.55); flex: 1; min-width: 200px; line-height: 1.5;
}
#cookie-banner p a { color: rgba(255,255,255,.85); border-bottom: 1px solid rgba(255,255,255,.3); }
.cookie-btns { display: flex; gap: 10px; flex-shrink: 0; }
.cookie-btn {
    font-family: var(--ff-cnd); font-size: 11px; font-weight: 700;
    letter-spacing: .13em; text-transform: uppercase;
    padding: 9px 20px; border-radius: 2px; border: 1.5px solid transparent;
    cursor: pointer; transition: background .2s, color .2s, border-color .2s; line-height: 1;
}
.cookie-btn-accept        { background: var(--lime); color: var(--ink); border-color: var(--lime); }
.cookie-btn-accept:hover  { background: var(--lime-d); border-color: var(--lime-d); }
.cookie-btn-decline       { background: transparent; color: rgba(255,255,255,.5); border-color: rgba(255,255,255,.2); }
.cookie-btn-decline:hover { color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.5); }

/* ─── SCROLL REVEAL ─── */
.r {
    opacity: 0; transform: translateY(20px);
    transition: opacity .75s cubic-bezier(.16,1,.3,1),
                transform .75s cubic-bezier(.16,1,.3,1);
}
.r.on { opacity: 1; transform: none; }
.d1 { transition-delay: .07s; }
.d2 { transition-delay: .14s; }
.d3 { transition-delay: .21s; }
.d4 { transition-delay: .28s; }

@media (max-width: 960px) { .nav-links { display: none; } }