/* Tagazou - couche d'apparence : titres Quicksand fins, texte Lato, icones sombres,
   boutons transparents, diaporama bord a bord. Chargee APRES site.css : ces regles priment.
   Les polices viennent des reglages (Apparence).
   Retirer ce fichier = revenir au style precedent. */

/* ---- typographie ---- */
h1,h2,h3{font-weight:400}
.diapo-int h2,.bandeau.avec-image h2{font-weight:300}
.citation,.devise,.tuile span{font-family:inherit}

/* ---- bandeau d'information (haut de page) ---- */
.bandeau-info{background:var(--rouge);color:#f6dada;text-align:center;padding:1rem 3rem;position:relative;
  font-family:Georgia,'Times New Roman',serif;font-size:1rem;line-height:1.7}
.bandeau-info a{color:#f6dada;text-decoration:underline}
.bandeau-info .fermer{position:absolute;right:.9rem;top:50%;transform:translateY(-50%);background:none;border:0;
  color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;padding:.2rem .5rem}
.bandeau-info[hidden]{display:none}

/* ---- entete : gros logo, pas de trait, menu hamburger "Menu" sur mobile ---- */
.entete{border-bottom:0;padding:1.55rem 1.5rem}
.logo img{width:357px;max-width:100%;max-height:none}
.hamburger{display:none;cursor:pointer;color:var(--encre);user-select:none;flex-direction:column;align-items:center;line-height:1}
.hamburger::after{content:"Menu";font-size:1rem;margin-top:.15rem;letter-spacing:0;text-transform:none;font-weight:400}
#menu-bascule{position:absolute;left:-9999px}
@media(max-width:760px){
  .entete{position:relative;flex-direction:column;justify-content:center;text-align:center;gap:.8rem;padding:1.8rem 1rem 1.4rem}
  .logo{order:1;margin:0 auto}
  /* le logo laisse la place du bouton Menu, pose a droite : sur 320 px il ne le touche plus */
  .logo img{width:min(260px,calc(100vw - 150px))}
  .hamburger{display:flex;position:absolute;right:1.2rem;top:2.4rem;font-size:1.9rem}
  .menu{order:2;display:none;flex-direction:column;width:100%;gap:0;text-align:center;margin-top:.6rem}
  #menu-bascule:checked ~ .menu{display:flex}
  .menu a{padding:.7rem 0;border-top:1px solid var(--bord)}
}

/* ---- diaporama : bord a bord, colle sous l'entete, bouton transparent a bord blanc ---- */
.contenu > .bloc.largeur-pleine:first-child{margin-top:-2rem}
.bloc-diaporama.largeur-pleine{padding:0}
.bloc-diaporama .diaporama,.bloc-diaporama.largeur-pleine .diaporama{border-radius:0}
.diaporama .bouton{background:transparent;border:2px solid #fff;color:#fff;border-radius:0;
  text-transform:uppercase;letter-spacing:.06em;font-weight:400;font-size:1.1rem;padding:1rem 2.6rem}
.diaporama .bouton:hover{background:#fff;color:var(--encre)}
.diapo-int h2{font-weight:300}
.diapo-int p{font-weight:300;font-size:1.35rem}
.diapo-puces{justify-content:flex-end;padding-right:1.6rem}
.diapo-nav{background:transparent;font-size:2.4rem;width:auto;height:auto}
.diapo-nav:hover{background:transparent;color:var(--rouge)}
@media(max-width:760px){.diaporama.h-haut{height:var(--hauteur,min(62vh,520px))}}

/* ---- bandeaux avec image ("TAGAZOU ?") : titre majuscules fin, bouton transparent, image moins assombrie ---- */
.bandeau.avec-image{min-height:460px}
.bandeau.avec-image::before{background:rgba(0,0,0,.28)}
.bandeau.avec-image h2{text-transform:uppercase;font-weight:300;font-size:3.4rem;letter-spacing:.05em;margin-bottom:2.2rem}
.bandeau.avec-image .bouton{background:transparent;border:2px solid #fff;color:#fff;border-radius:0;
  text-transform:uppercase;letter-spacing:.06em;font-weight:400;font-size:1.05rem;padding:1rem 2.4rem}
.bandeau.avec-image .bouton:hover{background:#fff;color:var(--encre)}
@media(max-width:760px){.bandeau.avec-image h2{font-size:2.4rem}}

/* ---- titres de section ("Duc in Altum!") : fin, sombre, centre, trait entre titre et sous-titre ---- */
.bandeau:not(.avec-image){background:transparent;padding:4rem 1.5rem 2.5rem}
.bandeau:not(.avec-image) h2{font-family:Quicksand,var(--police-titres),sans-serif;color:var(--encre);font-weight:400;font-size:2.5rem;margin:0}
.bandeau .bandeau-trait{width:100px;height:1px;background:var(--encre);margin:1.7rem auto 1.9rem}
.bandeau.al-gauche .bandeau-trait{margin-left:0}.bandeau.al-droite .bandeau-trait{margin-right:0}
.bandeau:not(.avec-image) p{font-family:var(--police-titres),sans-serif;color:#666;font-weight:300;font-size:1.35rem;line-height:1.5;max-width:1000px;margin:0 auto;opacity:1}
.bloc.fond-gris .bandeau:not(.avec-image){background:transparent}
@media(max-width:760px){.bandeau:not(.avec-image) h2{font-size:2.3rem}.bandeau:not(.avec-image) p{font-size:1.3rem}}

/* ---- atouts : icones sombres sans pastille, titres fins, beaucoup d'air ---- */
.bloc-atouts{padding:2rem 0 2.5rem}
.bloc-atouts .bloc-int{max-width:1000px}
.atout-ic{background:none;width:auto;height:auto;margin:0 auto 1.4rem;color:var(--encre)}
.atout-ic svg{width:60px;height:60px}
.bloc.fond-principal .atout-ic{background:none;color:#fff}
.atout{padding:1rem .8rem}
.atout h3{font-weight:400;font-size:1.4rem;margin:0 0 1rem;color:#444}
.atout p{font-size:.9rem;color:#666;line-height:1.8}
.atouts{gap:3.2rem 2rem}
@media(max-width:760px){.atouts{gap:3.4rem 1rem}.atout-ic svg{width:64px;height:64px}}

/* ---- menu : petites majuscules grises, deroulant blanc ---- */
.menu{font-size:.8rem;letter-spacing:.08em;font-weight:400;gap:1.8rem}
.menu > a,.menu-parent{color:var(--gris)}
.menu > a:hover,.menu-parent:hover{color:var(--encre)}
.menu .sous-menu{border-color:#e8e8e8;box-shadow:0 6px 18px rgba(0,0,0,.08);min-width:190px}
.menu .sous-menu a{text-transform:none;letter-spacing:.03em;font-size:.85rem;color:#777;padding:.7rem 1.2rem}
.panier-lien{color:#666}.panier-lien:hover{color:var(--encre)}
.panier-lien .pastille{background:var(--rouge)}
/* rubriques et cartes d'articles, sobres */
.rubriques a{font-weight:400}
.article-carte{border-color:#eee}
.article-corps h2{font-weight:400;font-size:1.3rem}
.article-tete h1{font-weight:300;font-size:2.4rem}

/* ---- bandeaux colores (violet, rouge, bleu) : titre 25 px blanc, comme l'ancien site ---- */
.bandeau.avec-couleur{background:transparent;padding:0}
.bandeau.avec-couleur h2{font-size:25px;font-weight:400;letter-spacing:.01em;margin:0}
.bandeau.avec-couleur p{font-size:22px;font-weight:300;color:#fff;margin:1.6rem 0 0}
.bloc-bandeau.fond-couleur{padding:65px 0}
/* bandeaux simples : 36 px seuls, 29 px + sous-titre 16 px quand ils en ont un (mesures de l'ancien site) */
.bandeau:not(.avec-image):not(.avec-couleur) h2{font-size:36px}
.bandeau:not(.avec-image):not(.avec-couleur).avec-sous h2{font-size:29px;color:#404040}
.bandeau:not(.avec-image):not(.avec-couleur).avec-sous p{font-size:16px;color:#595959;font-family:inherit}
.bandeau:not(.avec-image){padding:2.6rem 1.5rem 1.6rem}
/* titres internes des blocs image + texte */
.it-titre{font-size:25px;font-weight:400}
.bloc.fond-couleur .it-titre,.bloc.fond-couleur .it-sous{color:#fff}
/* bouton des heros ("L'UNIVERS TAGAZOU") aux mesures de l'ancien site */
.diaporama .bouton{font-size:20.88px;padding:20.88px 41.76px}
/* ---- pied de page de l'ancien site : bande grise a gauche avec les reseaux, puis la ligne de copyright ---- */
.pied{background:#fff;border-top:0;margin-top:3rem;padding:0;text-align:left;color:#595959}
.pied-sociaux{background:#fafafa;padding:26px 30px}
.pied .social{display:inline-flex;align-items:center;justify-content:center;width:43px;height:45px;margin-right:6px;
border-radius:3.6px;color:#fff}
.pied .social svg{width:19px;height:19px}
.pied .social:hover{opacity:.85}
.social-fb{background:#3b5998}.social-in{background:#007bb6}.social-ig{background:#517fa4}
.pied-copie{margin:0;padding:17px 1rem;text-align:center;font-size:12.96px;color:#595959}
/* commentaires, discrets comme sur l'ancien site */
.commentaires h3{color:#292929}

/* ---- finitions mesurees sur l'ancien site ---- */
.bandeau.avec-image{min-height:500px}
.bandeau.avec-image .bouton{font-size:20.88px;padding:20.88px 41.76px}
.bandeau:not(.avec-image):not(.avec-couleur) p{font-size:22px}
.bandeau:not(.avec-image):not(.avec-couleur).avec-sous p{font-size:16px;margin-top:.9rem}
.menu a:hover,.menu-parent:hover{text-decoration:none}