/*
Theme Name: Tagant Razala
Theme URI: https://tagant-razala.com
Description: Theme enfant sobre pour Tagant Razala. Palette et typographie issues de la direction artistique : sable, terre, bleu nuit, vert feuille, turquoise sourd, ambre en accent rare. Cormorant Garamond pour les titres, Lato pour les textes.
Author: Tagant Razala
Template: twentytwentyone
Version: 1.0
Text Domain: tagant-razala
*/

:root{
  --tr-sable:#F7F3EE;
  --tr-terre:#B5674A;
  --tr-terre-fonce:#96513A;
  --tr-encre:#14202E;
  --tr-vert:#4A6B4F;
  --tr-eau:#2E7D8A;
  --tr-ambre:#C08A3E;
  --tr-os:#FFFFFF;
  --tr-gris:#6B6B66;
  --tr-unite:8px;
}

html{font-size:17px}
body{
  background-color:var(--tr-sable);
  color:var(--tr-encre);
  font-family:'Lato',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  font-weight:300;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5,h6,.site-title{
  font-family:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  font-weight:600;
  line-height:1.2;
  letter-spacing:.005em;
  color:var(--tr-encre);
}
h1{font-size:clamp(2.1rem,5vw,3.4rem)}
h2{font-size:clamp(1.6rem,3.4vw,2.3rem);margin-top:calc(var(--tr-unite)*6)}
h3{font-size:clamp(1.25rem,2.4vw,1.6rem);margin-top:calc(var(--tr-unite)*4)}
h2+*,h3+*{margin-top:calc(var(--tr-unite)*2)}

p,li{max-width:44em}
p{margin-bottom:calc(var(--tr-unite)*3)}

a{color:var(--tr-terre);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--tr-terre-fonce);text-decoration-thickness:2px}

/* Titre du site en capitales espacees, comme le mot-symbole du logo */
.site-title a,.site-title{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(1.5rem,3vw,2.1rem);
  letter-spacing:.22em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--tr-encre);
}
.site-description{font-family:'Lato',sans-serif;font-weight:300;font-size:.9rem;letter-spacing:.04em;color:var(--tr-gris)}

/* Navigation : petites capitales espacees, sobre */
.main-navigation a{
  font-family:'Lato',sans-serif;
  font-weight:400;
  font-size:.82rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--tr-encre);
}
.main-navigation a:hover,.main-navigation .current-menu-item>a{color:var(--tr-terre)}

/* Citations : registre du recit */
blockquote{
  border-left:2px solid var(--tr-terre);
  padding-left:calc(var(--tr-unite)*3);
  margin:calc(var(--tr-unite)*5) 0;
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.25rem;
  font-style:italic;
  color:var(--tr-encre);
}

/* Pied de page sur fond bleu nuit, comme les planches de reference */
.site-footer{
  background-color:var(--tr-encre);
  color:var(--tr-sable);
  margin-top:calc(var(--tr-unite)*10);
  padding:calc(var(--tr-unite)*8) 0;
}
.site-footer a{color:var(--tr-sable);text-decoration-color:var(--tr-ambre)}
.site-footer h2,.site-footer h3{color:var(--tr-sable)}
.site-footer .site-info{font-size:.85rem;color:#A9B2BD;letter-spacing:.03em}

/* Boutons : sobres, sans ombre ni degrade */
input[type=submit],button,.wp-block-button__link{
  font-family:'Lato',sans-serif;font-weight:400;letter-spacing:.1em;text-transform:uppercase;
  font-size:.78rem;background-color:var(--tr-terre);color:var(--tr-os);
  border:0;border-radius:0;padding:calc(var(--tr-unite)*1.6) calc(var(--tr-unite)*3.5);
}
input[type=submit]:hover,button:hover,.wp-block-button__link:hover{background-color:var(--tr-terre-fonce);color:var(--tr-os)}

/* Repères de complétion : visibles mais discrets */
p:has(> em:only-child){color:var(--tr-gris)}
mark,[data-a-completer]{background:transparent;color:var(--tr-terre)}

/* Lignes et séparateurs */
hr{border:0;border-top:1px solid rgba(20,32,46,.12);margin:calc(var(--tr-unite)*6) 0}

/* Images : jamais de zoom ni d'ombre */
img{box-shadow:none}
.wp-block-image{margin:calc(var(--tr-unite)*5) 0}

/* Rythme vertical auto-similaire : multiples de l'unite de base */
.entry-content>*+*{margin-top:calc(var(--tr-unite)*3)}
.entry-content h2,.entry-content h3{margin-top:calc(var(--tr-unite)*6)}

.wp-block-post-title,.page-title{font-family:'Cormorant Garamond',serif}
.screen-reader-text{position:absolute;left:-9999px}
@media (max-width:600px){html{font-size:16px}p,li{max-width:100%}}