/* __DESIGN_SITE__ */
/* Habillage unique — sextreffen-rheinland-pfalz.de (Astro).
   Direction « vignoble » : vert vigne + crème + or, feuille très discrète.
   Trois zones : sidebar (desktop), bandeau + onglets (mobile), pied de page.
   Rien d'autre touché (grille, fiches, formulaires, age gate, prelinker). */

html:not(#_){
  --vin-creme:      #f7f1df;   /* fond clair : sidebar + bandeau mobile */
  --vin-creme-2:    #efe4c3;   /* fond soutenu : survol, séparations */
  --vin-vert-fonce: #1f331c;   /* vert vigne très sombre : pied de page */
  --vin-vert:       #2c4726;   /* texte principal sur crème */
  --vin-vert-clair: #4f7a45;   /* texte secondaire sur crème */
  --vin-or:         #c9a227;   /* accents, actives */
  --vin-or-clair:   #e2c468;   /* or clair, sur fond sombre */
  /* Feuille en data: SVG (~350 o/pièce) : trait vert pâle sur crème, or pâle sur vert. */
  --vin-feuille-claire: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath d='M32 6c14 8 20 22 12 40-3-10-9-16-18-18 6 4 9 10 9 18C21 40 14 26 32 6z' fill='%232c4726' fill-opacity='.05'/%3E%3Cpath d='M32 10c4 14 4 26-2 34' stroke='%232c4726' stroke-opacity='.06' stroke-width='1.1' fill='none'/%3E%3C/svg%3E");
  --vin-feuille-sombre: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath d='M32 6c14 8 20 22 12 40-3-10-9-16-18-18 6 4 9 10 9 18C21 40 14 26 32 6z' fill='%23c9a227' fill-opacity='.05'/%3E%3Cpath d='M32 10c4 14 4 26-2 34' stroke='%23c9a227' stroke-opacity='.06' stroke-width='1.1' fill='none'/%3E%3C/svg%3E");
}

/* === 1. Sidebar desktop === */
/* `.sidebar-inner` est le calque blanc PAR-DESSUS `.sidebar` : c'est lui qui doit
   porter le fond, sinon la couleur de `.sidebar` reste invisible derrière. */
html:not(#_) .sidebar-inner{
  background-color: var(--vin-creme);
  background-image: var(--vin-feuille-claire);
  background-repeat: repeat; background-size: 220px 220px;
  border-right: 1px solid var(--vin-creme-2);
}
html:not(#_) .sidebar{ border-right: 1px solid rgba(201,162,39,.35); }

/* Logo : nom en petites capitales espacées, pastille dorée façon sceau derrière l'icône. */
html:not(#_) .sb-logo{ display: flex; align-items: center; gap: 10px; padding: 4px 0 2px; }
html:not(#_) .sb-logo-dot{
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 999px;
  background: radial-gradient(circle at 35% 30%, var(--vin-or-clair), var(--vin-or) 70%);
  color: var(--vin-vert-fonce);
  box-shadow: 0 0 0 3px rgba(201,162,39,.18);
  animation: vin-sceau 3.4s ease-in-out infinite;
}
html:not(#_) .sb-logo-text{
  color: var(--vin-vert-fonce); font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; font-size: .92rem;
  font-family: Georgia, "Times New Roman", ui-serif, serif;
}

/* Nav : liens verts sur crème, indicateur or pour le lien actif. */
html:not(#_) .sb-nav{ margin-top: 6px; }
html:not(#_) .sb-link{
  color: var(--vin-vert); border-radius: 8px;
  transition: transform .2s ease, background-color .2s ease, color .2s ease;
}
html:not(#_) .sb-link:hover{ background-color: var(--vin-creme-2); color: var(--vin-vert-fonce); transform: translateX(3px); }
html:not(#_) .sb-link.active{
  color: var(--vin-vert-fonce); font-weight: 700;
  background-color: rgba(201,162,39,.14);
  box-shadow: inset 4px 0 0 var(--vin-or);   /* section active soulignée or */
}
/* L'inscription devient un bouton doré : c'est le clic qui rapporte, il se détache du reste. */
html:not(#_) .sb-nav a.sb-link[href="/register"]{
  margin-top: 8px; font-weight: 700;
  background: linear-gradient(135deg, var(--vin-or-clair), var(--vin-or));
  color: var(--vin-vert-fonce);
  box-shadow: 0 2px 8px rgba(201,162,39,.35);
}
html:not(#_) .sb-nav a.sb-link[href="/register"]:hover{ transform: translateY(-1px); box-shadow: 0 4px 12px rgba(201,162,39,.45); }

html:not(#_) .sb-map-quick-link{
  color: var(--vin-vert); border: 1px solid rgba(201,162,39,.5); border-radius: 999px;
  transition: background-color .2s ease, color .2s ease;
}
html:not(#_) .sb-map-quick-link:hover{ background-color: var(--vin-or); color: var(--vin-vert-fonce); }

html:not(#_) .sb-section-title{
  color: var(--vin-vert-clair); letter-spacing: .08em; text-transform: uppercase;
  font-size: .72rem; border-bottom: 1px solid rgba(44,71,38,.15); padding-bottom: 6px;
}
html:not(#_) .sb-silo-region{ color: var(--vin-vert-fonce); font-weight: 600; border-bottom: 1px solid transparent; transition: border-color .2s ease; }
html:not(#_) .sb-silo-group.open .sb-silo-region{ border-bottom-color: var(--vin-or); }  /* canton ouvert souligné or */
html:not(#_) .sb-chevron{ color: var(--vin-vert-clair); transition: transform .25s ease; }
html:not(#_) .sb-silo-ville{ color: var(--vin-vert-clair); transition: color .2s ease, transform .2s ease; }
html:not(#_) .sb-silo-ville:hover{ color: var(--vin-or); transform: translateX(3px); }

/* === 2. Barre mobile (bandeau + onglets) === */
/* Le gabarit compte sur un fond sombre (--primary/--secondary) pour que ses textes
   blancs semi-transparents restent lisibles. Sur fond crème ils seraient invisibles :
   ils sont recolorés en vert foncé (le fond n'utilise plus ces variables). */
html:not(#_) .mobile-guest-top{
  background-color: var(--vin-creme);
  background-image: var(--vin-feuille-claire);
  background-repeat: repeat; background-size: 180px 180px;
  border-bottom: 1px solid rgba(201,162,39,.4);
}
html:not(#_) .mobile-guest-head{ border-bottom: 1px solid var(--vin-creme-2); }
html:not(#_) .mobile-guest-brand{
  color: var(--vin-vert-fonce) !important; font-weight: 700; letter-spacing: .04em;
  font-family: Georgia, "Times New Roman", ui-serif, serif;
}
html:not(#_) .mobile-guest-login{ color: var(--vin-vert) !important; border: 1px solid rgba(44,71,38,.35); border-radius: 999px; }
html:not(#_) .mobile-guest-cta{ background-color: var(--vin-creme-2); }
html:not(#_) .mobile-guest-cta-offer{ color: var(--vin-vert-clair) !important; }
html:not(#_) .mobile-guest-cta-kw{ color: var(--vin-vert-fonce) !important; font-weight: 700; }
html:not(#_) .mobile-guest-timer-label{ color: var(--vin-vert-clair) !important; }
html:not(#_) .mobile-guest-timer{ color: var(--vin-vert-fonce) !important; font-weight: 700; }
/* Bouton d'inscription : reste plein, ≥44px de haut, texte/lien/geste inchangés. */
html:not(#_) .mobile-guest-cta-btn{
  background: linear-gradient(135deg, var(--vin-or-clair), var(--vin-or)) !important;
  color: var(--vin-vert-fonce) !important; font-weight: 700; min-height: 44px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(201,162,39,.35);
  transition: transform .2s ease, box-shadow .2s ease;
}
html:not(#_) .mobile-guest-cta-btn:active{ transform: translateY(1px); }

html:not(#_) .bottom-bar{ background-color: var(--vin-creme); border-top: 1px solid rgba(201,162,39,.4); }
html:not(#_) .btab{ color: var(--vin-vert); transition: color .2s ease, transform .2s ease; }
html:not(#_) .btab:hover{ color: var(--vin-vert-fonce); }
html:not(#_) .btab.active{ color: var(--vin-vert-fonce); }
html:not(#_) .btab.active .btab-ico{ color: var(--vin-or); transform: translateY(-2px); }
html:not(#_) .btab-lbl{ font-weight: 600; }

/* === 3. Pied de page === */
/* Vert vigne foncé, feuille dorée très discrète qui dérive lentement. Deux bandes :
   « liens » (marque + inscription + navigation + légal + villes + contact, réunis
   dans une même bande qui s'enroule selon l'écran) puis « mentions » (copyright). */
html:not(#_) .footer-v3{
  background-color: var(--vin-vert-fonce);
  background-image: var(--vin-feuille-sombre);
  background-repeat: repeat; background-size: 200px 200px;
  animation: vin-derive 44s linear infinite;
}
html:not(#_) .footer-inner{ max-width: 1180px; margin: 0 auto; }

html:not(#_) .footer-top{
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 16px; padding-bottom: 18px; border-bottom: 1px solid rgba(201,162,39,.28);
}
html:not(#_) .footer-brand h3{ color: var(--vin-or-clair); letter-spacing: .05em; font-family: Georgia, "Times New Roman", ui-serif, serif; }
html:not(#_) .footer-brand p{ color: rgba(247,241,223,.65); }
html:not(#_) .footer-newsletter{ display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
html:not(#_) .footer-newsletter p{ color: rgba(247,241,223,.75); margin: 0; }
html:not(#_) .footer-newsletter .btn-primary{
  background: linear-gradient(135deg, var(--vin-or-clair), var(--vin-or));
  color: var(--vin-vert-fonce); border-radius: 999px; font-weight: 700; min-height: 44px;
  display: inline-flex; align-items: center;
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
  transition: transform .2s ease, box-shadow .2s ease;
}
html:not(#_) .footer-newsletter .btn-primary:hover{ transform: translateY(-2px); box-shadow: 0 4px 14px rgba(0,0,0,.32); }

html:not(#_) .footer-grid{ display: flex; flex-wrap: wrap; gap: 22px 44px; padding: 18px 0; border-bottom: 1px solid rgba(201,162,39,.16); }
html:not(#_) .footer-col{ min-width: 150px; flex: 0 1 auto; }
html:not(#_) .footer-col h4{ color: var(--vin-or); font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; margin-bottom: 8px; }
html:not(#_) .footer-col ul{ display: flex; flex-wrap: wrap; gap: 5px 16px; list-style: none; margin: 0; padding: 0; }
html:not(#_) .footer-col a{ color: rgba(247,241,223,.82); transition: color .2s ease; }
html:not(#_) .footer-col a:hover{ color: var(--vin-or-clair); }
html:not(#_) .contact-email a{ color: rgba(247,241,223,.82); }

html:not(#_) .footer-bottom{ text-align: center; padding: 14px 0 20px; }
html:not(#_) .footer-bottom p{ color: rgba(247,241,223,.55); font-size: .8rem; letter-spacing: .02em; }

/* === Animations & accessibilité === */
@keyframes vin-sceau{
  0%, 100% { box-shadow: 0 0 0 3px rgba(201,162,39,.18); }
  50%      { box-shadow: 0 0 0 6px rgba(201,162,39,.06); }
}
@keyframes vin-derive{ to { background-position: 200px 200px; } }

@media (prefers-reduced-motion: reduce){
  html:not(#_) .sb-logo-dot, html:not(#_) .footer-v3, html:not(#_) .sb-link, html:not(#_) .sb-map-quick-link, html:not(#_) .sb-silo-ville, html:not(#_) .btab, html:not(#_) .btab-ico, html:not(#_) .mobile-guest-cta-btn, html:not(#_) .footer-newsletter .btn-primary, html:not(#_) .footer-col a{
    animation: none !important; transition: none !important;
  }
}

@media (prefers-reduced-motion: reduce){html:not(#_) .sidebar-inner{animation:none !important;transition:none !important;}}
html:not(#_) .sidebar-inner{scrollbar-width:thin;scrollbar-color:rgba(128,128,128,.45) transparent;}
/* __END_DESIGN_SITE__ */