/* ============================================================
   OFFRIVA.CH — CSS COMMUN — header + footer + global
   ============================================================ */

/* GLOBAL */
html{overflow-x:hidden;width:100%;}
body{overflow-x:hidden;max-width:100%;width:100%;}
*,*::before,*::after{box-sizing:border-box;}

/* HEADER */
header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,0.96);backdrop-filter:blur(12px);border-bottom:1px solid rgba(26,107,60,0.08);}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px;max-width:1100px;margin:0 auto;padding:0 24px;overflow:hidden;}
.logo{display:flex;align-items:center;gap:12px;flex-shrink:0;text-decoration:none;}
.logo img{height:40px;width:auto;display:block;}
header nav{display:flex;align-items:center;gap:2px;flex:1;justify-content:center;}
header nav a{font-size:13px;font-weight:500;color:#374151;padding:7px 12px;border-radius:8px;transition:all .15s;text-decoration:none;white-space:nowrap;}
header nav a:hover{background:#E8F5EE;color:#1A6B3C;}
header nav a.active{color:#1A6B3C;font-weight:600;background:#E8F5EE;}
.header-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.lang-switcher{display:flex;gap:2px;background:#F3F4F6;border-radius:8px;padding:3px;}
.lang-switcher button{font-size:11px;font-weight:600;padding:4px 7px;border:none;background:none;cursor:pointer;border-radius:6px;color:#6B7280;transition:all .15s;}
.lang-switcher button.active{background:#FFFFFF;color:#1A6B3C;box-shadow:0 1px 4px rgba(0,0,0,0.1);}
.btn-commercant{font-size:12px;font-weight:700;padding:8px 14px;border-radius:8px;background:#1A6B3C;color:#FFFFFF;border:none;cursor:pointer;transition:all .15s;white-space:nowrap;text-decoration:none;display:inline-block;}
.btn-commercant:hover{background:#2A8A52;}

/* HAMBURGER */
.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;background:none;border:none;cursor:pointer;padding:4px;border-radius:8px;transition:background .15s;flex-shrink:0;}
.hamburger:hover{background:#E8F5EE;}
.hamburger span{display:block;width:22px;height:2px;background:#374151;border-radius:2px;transition:all .25s cubic-bezier(.4,0,.2,1);transform-origin:center;}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0);}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* MOBILE NAV */
.mobile-nav-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.3);z-index:199;backdrop-filter:blur(2px);opacity:0;transition:opacity .25s;pointer-events:none;}
.mobile-nav-overlay.open{opacity:1;pointer-events:auto;}
.mobile-nav{display:flex;position:fixed;top:0;right:0;width:min(300px,85vw);height:100dvh;background:#fff;z-index:200;padding:24px;box-shadow:-4px 0 32px rgba(0,0,0,0.12);flex-direction:column;gap:4px;transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;}
.mobile-nav.open{transform:translateX(0)!important;}
.mobile-nav-close{align-self:flex-end;background:none;border:none;font-size:22px;cursor:pointer;color:#6B7280;padding:4px 8px;border-radius:6px;margin-bottom:16px;line-height:1;}
.mobile-nav a{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-size:16px;font-weight:600;color:#374151;padding:12px 16px;border-radius:10px;text-decoration:none;transition:all .15s;}
.mobile-nav a:hover,.mobile-nav a.active{background:#E8F5EE;color:#1A6B3C;}
.mobile-nav-sep{height:1px;background:#F3F4F6;margin:12px 0;}
.mobile-nav .btn-commercant-mobile{display:block;margin-top:8px;text-align:center;font-size:14px;font-weight:700;padding:13px;border-radius:10px;background:#1A6B3C;color:#fff;text-decoration:none;transition:background .15s;}
.mobile-nav .btn-commercant-mobile:hover{background:#2A8A52;}
.mobile-nav .lang-mobile{display:flex;gap:6px;margin-top:16px;flex-wrap:wrap;}
.mobile-nav .lang-mobile button{font-size:12px;font-weight:700;padding:6px 12px;border-radius:8px;border:1.5px solid #E5E7EB;background:none;cursor:pointer;color:#6B7280;transition:all .15s;}
.mobile-nav .lang-mobile button.active{border-color:#1A6B3C;color:#1A6B3C;background:#E8F5EE;}

/* RESPONSIVE HEADER */


/* FOOTER */
footer{background:#0D2B18;color:rgba(255,255,255,0.6);padding:56px 0 32px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px;}
.footer-brand p{font-size:13px;margin-top:12px;line-height:1.7;max-width:260px;}
.footer-col h4{font-size:13px;font-weight:700;color:#fff;margin-bottom:14px;}
.footer-col a{display:block;font-size:13px;margin-bottom:8px;color:rgba(255,255,255,0.6);text-decoration:none;transition:color .15s;}
.footer-col a:hover{color:#fff;}
.footer-bottom{padding-top:24px;border-top:1px solid rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:space-between;font-size:12px;flex-wrap:wrap;gap:12px;}
.eco-badge{display:flex;align-items:center;gap:6px;background:rgba(26,107,60,0.3);color:#6EE7A0;font-size:11px;font-weight:600;padding:4px 12px;border-radius:100px;}
@media(max-width:768px){.footer-grid{grid-template-columns:1fr 1fr;gap:24px;}}
@media(max-width:480px){.footer-grid{grid-template-columns:1fr;}}

/* MOBILE — logo + hamburger uniquement */
@media(max-width:900px){
  .hamburger{display:flex;}
  .mobile-nav{display:flex;}
  .mobile-nav-overlay{display:block;}
  header nav{display:none!important;}
  .lang-switcher{display:none!important;}
  .btn-commercant{display:none!important;}
  header .header-actions .lang-switcher{display:none!important;}
  .header-inner{height:56px;gap:8px;}
  #btn-admin-link{display:none!important;}
}

/* ── Breadcrumb & Back button ── */
.breadcrumb{padding:12px 0;font-size:12px;font-family:'Plus Jakarta Sans',sans-serif;color:#6B7280;}
.breadcrumb a{color:#6B7280;font-size:12px;font-family:'Plus Jakarta Sans',sans-serif;text-decoration:none;}
.breadcrumb a:hover{color:#1A6B3C;}
.breadcrumb span{color:#374151;}
.btn-back{display:none!important;}
@media(max-width:900px){.btn-back{display:inline-flex!important;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#1A6B3C;background:#E8F5EE;border:none;border-radius:8px;padding:8px 14px;cursor:pointer;margin:4px 0 8px;text-decoration:none;}}