/* Esser Vitae — styles communs (polices, nav, footer, boutons, responsive) */

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

*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
:root { --green:#0D2B26; --orange:#E8562A; --cream:#F5F4F0; --border:#D5D3CB; --white:#fff; }
html { scroll-behavior:smooth; }
body { font-family:'Jost',sans-serif; background:#fff; color:#333; overflow-x:hidden; }
/* Pas de ligatures décoratives (« Th » de Cormorant) */
body { font-variant-ligatures:no-common-ligatures no-discretionary-ligatures; }
img { display:block; max-width:100%; }

/* NAV */
nav { background:var(--green); display:flex; align-items:center; justify-content:space-between; padding:0 48px; height:68px; position:sticky; top:0; z-index:100; }
.brand { text-decoration:none; display:flex; flex-direction:column; line-height:1; }
.nav-logo { font-family:'Cormorant Garamond',serif; font-size:24px; font-weight:500; color:#fff; letter-spacing:.04em; }
.nav-logo em { font-style:italic; font-weight:300; }
.brand-sub { font-size:8.5px; letter-spacing:.24em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-top:5px; }
.nav-links { display:flex; gap:36px; list-style:none; }
.nav-links a { color:rgba(255,255,255,.72); font-size:12px; letter-spacing:.12em; text-transform:uppercase; text-decoration:none; transition:color .2s; }
.nav-links a:hover, .nav-links a.active { color:var(--orange); }
.nav-toggle { display:none; }
.nav-burger { display:none; cursor:pointer; width:26px; height:18px; position:relative; }
.nav-burger span, .nav-burger::before, .nav-burger::after { content:''; position:absolute; left:0; width:100%; height:1.5px; background:#fff; }
.nav-burger::before { top:0; } .nav-burger span { top:8px; } .nav-burger::after { bottom:0; }

/* BOUTONS */
.btn-primary { background:var(--orange); color:#fff; font-family:'Jost',sans-serif; font-size:11px; letter-spacing:.14em; text-transform:uppercase; padding:15px 36px; border:none; cursor:pointer; text-decoration:none; display:inline-block; transition:background .2s; }
.btn-primary:hover { background:#c9431d; }
.btn-outline { background:transparent; color:#fff; font-family:'Jost',sans-serif; font-size:11px; letter-spacing:.14em; text-transform:uppercase; padding:14px 28px; border:1.5px solid rgba(255,255,255,.45); cursor:pointer; text-decoration:none; display:inline-block; transition:border-color .2s, color .2s; }
.btn-outline:hover { border-color:var(--orange); color:var(--orange); }

/* FOOTER */
footer { background:var(--green); padding:48px 48px 28px; border-top:.5px solid rgba(255,255,255,.06); }
.footer-top { display:flex; justify-content:space-between; align-items:flex-start; gap:32px; padding-bottom:36px; border-bottom:.5px solid rgba(255,255,255,.1); }
.footer-logo { font-family:'Cormorant Garamond',serif; font-size:20px; font-weight:500; color:#fff; letter-spacing:.04em; }
.footer-logo em { font-style:italic; font-weight:300; }
.footer-sub { font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-top:6px; }
.footer-tagline { font-size:11px; color:rgba(255,255,255,.3); margin-top:12px; font-weight:300; }
.footer-contact { font-size:13px; color:rgba(255,255,255,.5); text-align:right; font-weight:300; }
.footer-contact a { color:var(--orange); text-decoration:none; display:block; margin-top:5px; }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:16px; padding-top:24px; }
.footer-copy, .footer-links a { font-size:10px; color:rgba(255,255,255,.3); letter-spacing:.05em; font-weight:300; text-decoration:none; }
.footer-links { display:flex; gap:24px; }
.footer-links a:hover { color:var(--orange); }

.lang-switch { padding-left:28px; border-left:.5px solid rgba(255,255,255,.2); }
.lang-switch a { color:rgba(255,255,255,.45); margin-left:10px; }
.lang-switch a:first-child { margin-left:0; }
.lang-switch a.active { color:#fff; }

/* RESPONSIVE COMMUN */
.nav-links a, .lang-switch { white-space:nowrap; }
@media (max-width:1280px) {
  body nav .nav-links { gap:24px; }
  body nav .nav-links a { font-size:11px; letter-spacing:.1em; }
  .lang-switch { padding-left:20px; }
}
@media (max-width:1100px) {
  body nav { padding:0 24px; }
  body nav .nav-burger { display:block; }
  body nav .nav-links { display:none; position:absolute; top:68px; left:0; right:0; background:var(--green); flex-direction:column; gap:0; padding:8px 24px 20px; border-top:.5px solid rgba(255,255,255,.1); }
  body nav .nav-links a { display:block; padding:14px 0; border-bottom:.5px solid rgba(255,255,255,.08); font-size:12px; }
  body nav .nav-toggle:checked ~ .nav-links { display:flex; }
  body nav .lang-switch { padding-left:0; border-left:none; padding-top:12px; }
  body nav .nav-links .lang-switch a { display:inline-block; padding:8px 0; margin:0 18px 0 0; border:none; }
}
@media (max-width:767px) {
  body nav { padding:0 16px; }
  body nav .nav-links { padding:8px 16px 20px; }
  footer { padding-left:16px; padding-right:16px; }
  .footer-top, .footer-bottom { flex-direction:column; align-items:flex-start; }
  .footer-contact { text-align:left; }
}