/* Journal de bord. La page la plus sobre du site, a dessein : elle doit
   pouvoir accueillir une entree en deux minutes sans reflexion de mise en
   page. Echelle typographique : celle de kelveen.css, rien d'autre. */

.log-hero{position:relative;overflow:hidden;min-height:56vh;display:flex;align-items:flex-end;padding:150px 0 64px;background:var(--evergreen);color:var(--eggshell)}
.log-hero .shell{position:relative;z-index:4}
.log-hero h1{max-width:820px;margin:0;font-size:clamp(2.5rem,5.5vw,5.4rem);font-weight:750;line-height:.95;letter-spacing:-.06em}
.log-lede{max-width:620px;margin:24px 0 0;color:rgba(245,242,225,.72);font-size:clamp(1.02rem,1.5vw,1.22rem);line-height:1.55}

.log{padding:96px 0 110px}
.log-list{display:grid;gap:0}
.log-entry{display:grid;grid-template-columns:190px minmax(0,1fr);gap:40px;align-items:start;padding:42px 0;border-top:1px solid var(--line)}
.log-entry:last-child{border-bottom:1px solid var(--line)}
.log-date{color:var(--tangerine-ink);font-size:.78rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.log-theme{margin:0 0 8px;color:rgba(12,29,21,.5);font-size:.68rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.log-entry h2{margin:0 0 10px;font-size:clamp(1.5rem,2.4vw,2.35rem);line-height:1;letter-spacing:-.045em}
.log-body{max-width:660px;margin:0;color:rgba(12,29,21,.7);font-size:1rem;line-height:1.6}

/* Meme signature que la section contact de l'accueil : fond sapin et
   cercle pollen qui deborde du cadre. C'est la cloture visuelle du site. */
.log-cta{position:relative;overflow:hidden;padding:110px 0;background:var(--evergreen);color:var(--eggshell)}
.log-cta::after{content:"";position:absolute;right:-11vw;top:-18vw;width:45vw;aspect-ratio:1;border-radius:50%;background:var(--pollen);opacity:.96}
.log-cta-grid{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:44px}
.log-cta h2{max-width:720px;margin:0;font-size:clamp(2.4rem,5vw,5rem);line-height:.98;letter-spacing:-.06em}
.cta-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px}

@media(max-width:760px){
  .log-hero{min-height:auto;padding:130px 0 54px}
  .log{padding:66px 0 80px}
  .log-entry{grid-template-columns:1fr;gap:10px;padding:32px 0}
  .log-cta{padding:80px 0}
  .log-cta-grid{flex-direction:column;align-items:stretch}
  .cta-actions{flex-direction:column;align-items:stretch}
}