:root {
  --v-color-brand-primary: #0F2B46;
  --v-color-brand-accent: #3BA7A6;
  --v-color-brand-gold: #FFC24A;
  --v-color-brand-terra: #8A6448;
  --v-color-surface: #FFFFFF;
  --v-color-surface-soft: #F6F7F8;
  --v-color-text: #17212B;
  --v-color-text-muted: #65707C;
  --v-color-border: #E2E6E9;
  --v-radius-sm: 8px;
  --v-radius-md: 12px;
  --v-radius-lg: 20px;
  --v-radius-xl: 28px;
  --v-radius-full: 999px;
  --v-space-1: 4px;
  --v-space-2: 8px;
  --v-space-3: 12px;
  --v-space-4: 16px;
  --v-space-5: 24px;
  --v-space-6: 32px;
  --v-space-7: 40px;
  --v-space-8: 48px;
  --v-space-9: 64px;
  --v-space-10: 80px;
  --v-shadow-1: 0 10px 30px rgb(15 43 70 / 8%);
  --v-motion-fast: 180ms;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--v-color-text); background: var(--v-color-surface); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .18em; }
img { max-width: 100%; height: auto; }
:focus-visible { outline: 3px solid var(--v-color-brand-accent); outline-offset: 3px; }

.viviare-container { width: min(1320px, calc(100% - 40px)); margin-inline: auto; }
.viviare-container--narrow { width: min(780px, calc(100% - 40px)); }
.viviare-main { min-height: 60vh; }
.viviare-section { padding-block: clamp(48px, 7vw, 100px); }
.viviare-eyebrow { margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--v-color-brand-accent); }

.viviare-header { position: sticky; top: 0; z-index: 100; background: rgb(255 255 255 / 92%); border-bottom: 1px solid var(--v-color-border); backdrop-filter: blur(12px); }
.viviare-header__inner { min-height: 76px; display: flex; align-items: center; gap: 28px; }
.viviare-brand { display: inline-flex; align-items: center; font-weight: 750; letter-spacing: .08em; color: var(--v-color-brand-primary); text-decoration: none; }
.viviare-brand .custom-logo { max-height: 46px; width: auto; }
.viviare-nav { margin-left: auto; }
.viviare-nav__menu, .viviare-footer__menu { display: flex; gap: 22px; margin: 0; padding: 0; list-style: none; }
.viviare-nav a { text-decoration: none; font-size: 15px; font-weight: 600; }
.viviare-button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 0 22px; border: 1px solid var(--v-color-brand-primary); border-radius: var(--v-radius-full); background: var(--v-color-brand-primary); color: #fff; font-weight: 650; text-decoration: none; transition: transform var(--v-motion-fast), box-shadow var(--v-motion-fast); }
.viviare-button:hover { transform: translateY(-1px); box-shadow: var(--v-shadow-1); }
.viviare-button--small { min-height: 42px; padding-inline: 18px; font-size: 14px; }

.viviare-footer { padding: 56px 0; color: #fff; background: var(--v-color-brand-primary); }
.viviare-footer__inner { display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: start; }
.viviare-footer__brand { font-size: 22px; letter-spacing: .08em; }
.viviare-footer__menu { flex-wrap: wrap; justify-content: end; }
.viviare-footer a { color: #fff; }

.viviare-content-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.viviare-editorial-card { overflow: hidden; border: 1px solid var(--v-color-border); border-radius: var(--v-radius-lg); background: #fff; transition: transform var(--v-motion-fast), box-shadow var(--v-motion-fast); }
.viviare-editorial-card:hover { transform: translateY(-2px); box-shadow: var(--v-shadow-1); }
.viviare-editorial-card__link { display: block; height: 100%; text-decoration: none; }
.viviare-editorial-card__media { aspect-ratio: 4/3; overflow: hidden; background: var(--v-color-surface-soft); }
.viviare-editorial-card__media img { width: 100%; height: 100%; object-fit: cover; }
.viviare-editorial-card__body { padding: 22px; }
.viviare-editorial-card__title { margin: 0 0 10px; font-size: 24px; color: var(--v-color-brand-primary); }
.viviare-page-header { margin-bottom: 40px; }
.viviare-page-header h1, .viviare-article__header h1 { font-size: clamp(34px, 5vw, 54px); line-height: 1.08; color: var(--v-color-brand-primary); }
.viviare-article { padding-block: 56px 96px; }
.viviare-article__media { margin: 32px 0; overflow: hidden; border-radius: var(--v-radius-xl); }
.viviare-prose { font-size: 17px; line-height: 1.7; }
.viviare-empty-state { text-align: center; }

@media (max-width: 1023px) {
  .viviare-nav { display: none; }
  .viviare-header__inner { min-height: 68px; }
  .viviare-header__inner > .viviare-button { margin-left: auto; }
  .viviare-content-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .viviare-container, .viviare-container--narrow { width: min(100% - 28px, 1320px); }
  .viviare-header__inner > .viviare-button { display: none; }
  .viviare-content-grid { grid-template-columns: 1fr; }
  .viviare-footer__inner { grid-template-columns: 1fr; }
  .viviare-footer__menu { display: grid; grid-template-columns: 1fr 1fr; justify-content: start; }
}
