@font-face {
    font-family: "Playfair Display";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("playfair-400.ttf") format("truetype");
}

@font-face {
    font-family: "Playfair Display";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("playfair-700.ttf") format("truetype");
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url("roboto-300.ttf") format("truetype");
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("roboto-400.ttf") format("truetype");
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("roboto-500.ttf") format("truetype");
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("roboto-700.ttf") format("truetype");
}

:root {
    color-scheme: light;
    --novens-bg: #fdfdfd;
    --novens-bg-soft: #f5f5f5;
    --novens-line: #e4e8e6;
    --novens-mint: #9fd8c2;
    --novens-mint-soft: #bce7d7;
    --novens-mint-pale: #e8f5f0;
    --novens-teal: #45aab8;
    --novens-teal-dark: #3a8f9b;
    --novens-navy: #3a6b75;
    --novens-ink: #333333;
    --novens-muted: #707a76;
    --novens-white: #ffffff;
    --novens-danger: #a83d48;
    --novens-success: #176b4d;
    --novens-shadow: 0 16px 50px rgba(51, 51, 51, .10);
    --novens-radius: 8px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; background: var(--novens-bg); color: var(--novens-ink); font-family: "Roboto", Arial, sans-serif; font-weight: 400; }
::selection { background: var(--novens-teal); color: #fff; }

.novens-nav { position: relative; z-index: 20; display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 28px; padding: 8px max(5%, calc((100% - 1200px) / 2)); background: rgba(159, 216, 194, .97); border-bottom: 1px solid rgba(58, 107, 117, .13); box-shadow: 0 1px 18px rgba(58, 107, 117, .10); }
.novens-logo { display: inline-flex; flex: 0 0 auto; align-items: center; }
.novens-logo img { display: block; width: 160px; height: 58px; object-fit: contain; object-position: left center; }
.novens-nav-links { display: flex; align-items: center; justify-content: flex-end; gap: 24px; margin-left: auto; }
.novens-nav-links a, .novens-nav-links span { color: #163239; font-size: .72rem; font-weight: 500; letter-spacing: .10em; text-decoration: none; text-transform: uppercase; }
.novens-nav-links a { position: relative; }
.novens-nav-links a::after { position: absolute; right: 0; bottom: -5px; left: 0; height: 1px; background: #163239; content: ""; transform: scaleX(0); transition: transform .2s ease; }
.novens-nav-links a:hover::after, .novens-nav-links a[aria-current="page"]::after { transform: scaleX(1); }
.novens-account { display: flex; align-items: center; gap: 10px; padding-left: 22px; border-left: 1px solid rgba(22, 50, 57, .16); }
.novens-account a:last-child { padding: 10px 16px; border: 1px solid rgba(22, 50, 57, .28); background: rgba(255, 255, 255, .38); }

.novens-footer { display: grid; grid-template-columns: 1fr auto; gap: 32px; align-items: end; padding: 48px max(5%, calc((100% - 1200px) / 2)); background: var(--novens-ink); color: rgba(255, 255, 255, .68); }
.novens-footer img { width: 150px; filter: invert(1); }
.novens-footer p { max-width: 520px; margin: 14px 0 0; font-size: .84rem; line-height: 1.65; }
.novens-footer a { color: #fff; font-size: .75rem; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }

@media (max-width: 820px) {
    .novens-nav { align-items: flex-start; flex-wrap: wrap; padding: 10px 18px 14px; }
    .novens-logo img { width: 132px; height: 48px; }
    .novens-nav-links { order: 3; width: 100%; justify-content: flex-start; gap: 18px; overflow-x: auto; padding-top: 4px; }
    .novens-nav-links a, .novens-nav-links span { white-space: nowrap; font-size: .66rem; }
    .novens-account { margin-left: auto; padding-left: 0; border-left: 0; }
    .novens-account span { display: none; }
    .novens-footer { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .novens-nav-links > a:not([aria-current="page"]) { display: none; }
    .novens-account a:first-of-type:not(:last-child) { display: none; }
}