:root {
--ek-paper: #f5f8ee;
--ek-surface: #ffffff;
--ek-ink: #17250f;
--ek-muted: #56664a;
--ek-line: #dbe4cb;
--ek-link: #3f7400;
--ek-brand: #487f00;
--ek-sun: #f48c0f;
color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
:root {
--ek-paper: #0d1608;
--ek-surface: #152010;
--ek-ink: #e8f1db;
--ek-muted: #9bb08a;
--ek-line: #27371a;
--ek-link: #a4dc4f;
--ek-brand: #6fb11a;
--ek-sun: #ffa23d;
}
}
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { font-variant-numeric: proportional-nums; text-rendering: optimizeLegibility; }
:where(a):focus-visible, :where(button):focus-visible, :where(input, select, textarea):focus-visible {
outline: 3px solid var(--ek-sun);
outline-offset: 2px;
} .ek-ribbon { display: block; color: inherit; text-decoration: none; }
.ek-ribbon-bar { display: flex; width: 100%; }
.ek-ribbon-bar i { display: block; min-width: 1px; }
.ek-ribbon.is-thin .ek-ribbon-bar { height: 6px; }
.ek-ribbon.is-large .ek-ribbon-bar { height: clamp(28px, 5vw, 56px); border-radius: 4px; overflow: hidden; }
.ek-ribbon-meta { display: block; margin-top: .6rem; font-size: var(--wp--preset--font-size--small); color: var(--ek-muted); }
.ek-ribbon-legend { display: flex; flex-wrap: wrap; gap: .25rem 1.1rem; margin: .4rem 0 0; padding: 0; list-style: none; font-size: var(--wp--preset--font-size--small); }
.ek-ribbon-legend li { display: flex; align-items: center; gap: .4rem; }
.ek-ribbon-legend span { width: .7rem; height: .7rem; border-radius: 2px; }
.ek-ribbon-legend b { font-variant-numeric: tabular-nums; } .ek-header { border-bottom: 1px solid var(--ek-line); }
.ek-header-inner { padding-block: 1rem; }
.ek-brand, .ek-brand a { font-size: 1.55rem; text-decoration: none; color: var(--ek-brand); }
.ek-brand a::before { content: ""; display: inline-block; width: 1.7em; height: 1.7em; margin-right: .5rem; vertical-align: -.5em; background: url(//www.ekoolos.fr/wp-content/themes/ekoolos/assets/brand/flower.svg) center / contain no-repeat; }
.ek-header .wp-block-navigation { font-size: .95rem; font-weight: 500; }
.ek-header .wp-block-navigation a { text-decoration: none; color: var(--ek-ink); }
.ek-header .wp-block-navigation a:hover { color: var(--ek-link); text-decoration: underline; } .ek-stage {
position: relative;
margin-top: 0;
padding-block: clamp(2rem, 5vw, 3.5rem) clamp(1.5rem, 4vw, 2.5rem);
color: #f4f9ea;
background:
radial-gradient(55% 90% at 88% -10%, rgba(244, 140, 15, .34), transparent 62%),
radial-gradient(40% 60% at 0% 100%, rgba(120, 190, 30, .22), transparent 70%),
linear-gradient(135deg, #0f2108 0%, #22440a 55%, #35650a 100%);
overflow: hidden;
padding-inline: var(--wp--style--root--padding-right, 1.25rem);
}
.ek-stage h1 { max-width: 20ch; margin: 0 0 1rem; color: #fff; text-wrap: balance; }
.ek-stage .ek-lead { max-width: 54ch; margin: 0; font-size: var(--wp--preset--font-size--lead); color: rgba(244, 249, 234, .85); }
.ek-stage a { color: inherit; }
.ek-stage .ek-ribbon-meta, .ek-stage .ek-ribbon-legend { color: rgba(244, 249, 234, .8); }
.ek-hero-chart { position: relative; margin-top: clamp(1rem, 3vw, 2rem); } .ek-hero-stamp { margin: 0 0 .75rem; color: #fff; line-height: 1.15; }
.ek-hero-stamp .ek-stamp-k, .ek-hero-stamp .ek-stamp-date { display: block; font-size: .95rem; color: rgba(244, 249, 234, .82); }
.ek-hero-stamp .ek-stamp-time { display: block; font-family: var(--wp--preset--font-family--serif, Georgia, serif); font-size: clamp(2.2rem, 1.6rem + 2vw, 3.4rem); font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ek-hero-stamp .ek-stamp-k { color: #ffd68c; }
.ek-hero-stamp.is-late .ek-stamp-k { color: #ffb36b; }
.ek-hero-link { display: none; }
@media (min-width: 900px) {
.ek-hero-stamp { position: absolute; right: 52px; bottom: calc(100% + .75rem); margin: 0; text-align: right; } .ek-hero-link { display: block; position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 2; opacity: 0; transition: opacity .3s; }
.ek-hero-link.is-on { opacity: 1; }
.ek-hero-link .ek-link-line { fill: none; stroke: rgba(255, 214, 140, .9); stroke-width: 1.5; stroke-linecap: round; }
.ek-hero-link .ek-link-head { fill: #ffd68c; stroke: none; }
.ek-hero-link .ek-link-line { transition: stroke-dashoffset .6s cubic-bezier(.3, .7, .3, 1) .6s; }
}
@media (prefers-reduced-motion: reduce) { .ek-hero-link .ek-link-line { transition: none; } }
.ek-hero-canvas { width: 100%; height: clamp(300px, 46vw, 440px); }
.ek-hero-chart.is-error .ek-hero-canvas { display: none; }
.ek-ribbon.is-large .ek-ribbon-bar { animation: ek-reveal 1.2s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes ek-reveal { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@media (prefers-reduced-motion: reduce) { .ek-ribbon.is-large .ek-ribbon-bar { animation: none; } } .ek-live { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.ek-live li { margin: 0; }
.ek-live a {
display: block; height: 100%; padding: 1rem 1.1rem .4rem; color: inherit; text-decoration: none;
background: var(--ek-surface); border: 1px solid var(--ek-line); border-radius: 10px;
transition: border-color .2s, transform .2s;
}
.ek-live a:hover { border-color: var(--ek-brand); transform: translateY(-2px); }
.ek-live b { display: block; font-family: var(--wp--preset--font-family--serif); font-size: clamp(2rem, 1.5rem + 1.6vw, 2.8rem); line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.ek-live span { display: block; margin-top: .25rem; min-height: 2.6em; font-size: var(--wp--preset--font-size--small); color: var(--ek-muted); }
.ek-live .ek-spark { display: block; height: 64px; margin: .4rem -.3rem 0; }
.ek-live-wrap { position: relative; z-index: 2; margin-top: -2.25rem; }
@media (prefers-reduced-motion: reduce) { .ek-live a { transition: none; } .ek-live a:hover { transform: none; } }
.ek-index { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ek-line); }
.ek-index li { margin: 0; padding: 1.1rem 0; border-bottom: 1px solid var(--ek-line); }
.ek-index a { font-family: var(--wp--preset--font-family--serif); font-size: var(--wp--preset--font-size--title-m); font-weight: 700; text-decoration: none; color: var(--ek-ink); }
.ek-index a:hover { color: var(--ek-link); text-decoration: underline; }
.ek-index p { margin: .25rem 0 0; max-width: 60ch; color: var(--ek-muted); font-size: var(--wp--preset--font-size--small); }
.ek-section-title { margin-bottom: 1rem; } .ek-page-title { margin-top: clamp(2rem, 5vw, 3.5rem); text-wrap: balance; }
.ek-meta { color: var(--ek-muted); font-size: var(--wp--preset--font-size--small); }
.wp-block-post-content > * + h2 { margin-top: 3rem; }
.wp-block-post-content :where(ul, ol) { padding-left: 1.3rem; }
.wp-block-post-content :where(table) { width: 100%; border-collapse: collapse; font-size: var(--wp--preset--font-size--small); }
.wp-block-post-content :where(th, td) { padding: .55rem .6rem; text-align: left; border-bottom: 1px solid var(--ek-line); vertical-align: top; }
.ek-chart, .ek-solar { max-width: var(--wp--style--global--wide-size, 72rem); } .ek-chart, .ek-solar {
--ek-bg: var(--ek-surface);
--ek-fg: var(--ek-ink);
--ek-accent: var(--ek-link);
--ek-soft: var(--ek-paper);
--ek-on-accent: var(--ek-surface);
}
.ek-chart { border-radius: 6px; } .ek-footer { margin-top: 6rem; padding-block: 2.5rem; border-top: 1px solid var(--ek-line); font-size: var(--wp--preset--font-size--small); color: var(--ek-muted); }
.ek-footer a { color: var(--ek-muted); }
.ek-footer a:hover { color: var(--ek-link); }
.ek-footer p { max-width: 62ch; } .ek-posts .wp-block-post { padding: 1.2rem 0; border-bottom: 1px solid var(--ek-line); }
.ek-posts .wp-block-post-title { margin: 0; font-size: var(--wp--preset--font-size--title-m); }
.ek-posts .wp-block-post-title a { text-decoration: none; color: var(--ek-ink); }
.ek-posts .wp-block-post-title a:hover { color: var(--ek-link); text-decoration: underline; } .alignwide > .ek-section-title { margin-top: 3.5rem; }
.ek-footer > * { margin-left: 0 !important; margin-right: 0 !important; }
.ek-footer { max-width: var(--wp--style--global--wide-size, 72rem); margin-inline: auto; }
@media (max-width: 600px) {
.ek-live li { padding-right: .6rem; }
.ek-stage h1 { margin-top: 0; }
} .ek-header-inner, .ek-footer {
box-sizing: border-box;
max-width: var(--wp--style--global--wide-size, 72rem);
margin-inline: auto;
padding-inline: var(--wp--style--root--padding-right, 1.25rem);
}
.ek-footer { max-width: none; }
.ek-footer > * { max-width: calc(var(--wp--style--global--wide-size, 72rem) - 2.5rem); margin-inline: auto !important; } body.single-post main { --wp--style--global--content-size: 46rem; }
.ek-origin { padding: .85rem 1rem; font-size: .9375rem; color: var(--ek-muted); background: var(--ek-surface); border: 1px solid var(--ek-line); border-left: 4px solid var(--ek-brand); border-radius: 6px; }
.ek-actu-table table { font-size: .9375rem; font-variant-numeric: tabular-nums; border-collapse: collapse; }
.ek-actu-table th, .ek-actu-table td { padding: .5rem .65rem; border-bottom: 1px solid var(--ek-line); }
.ek-actu-table :is(th, td):not(:first-child) { text-align: right; white-space: nowrap; }
.ek-actu-table thead th { font-size: .8125rem; color: var(--ek-muted); font-weight: 600; }
.ek-actu-table figcaption { font-size: .8125rem; color: var(--ek-muted); }
body.single-post .ek-note { font-size: .8125rem; color: var(--ek-muted); }
@media (max-width: 600px) { .ek-actu-table { overflow-x: auto; } }
.ek-comments { margin-top: 2.5rem; }
.ek-comment { padding: .8rem 0; border-top: 1px solid var(--ek-line); font-size: .9375rem; }
.ek-comment .wp-block-comment-date { font-size: .8125rem; color: var(--ek-muted); }
.ek-archives-link { margin-top: 2rem; color: var(--ek-muted); }