
:root{
  --brun:#3A2A20; --cacao:#6F5A49; --ivoire:#F5EEE1; --beige:#E4D8C4;
  --serif:'Playfair Display',Georgia,serif; --sans:'Jost',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mx:min(1120px,92vw);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:84px}
body{background:var(--beige);color:var(--brun);font-family:var(--sans);font-weight:400;font-size:18px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
.icon{width:46px;height:auto;display:block}
.wmk{display:block;width:100%;height:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.wrap{width:var(--mx);margin:0 auto}

/* nav */
.nav{position:sticky;top:0;z-index:40;background:rgba(228,216,196,.94);backdrop-filter:blur(10px);border-bottom:1px solid rgba(58,42,32,.1)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;padding:16px 0}
.nav a{text-decoration:none}
.brand{display:flex;align-items:center;gap:12px;color:var(--brun)}
.brand .icon{width:30px}
.brand .wmk{width:117px}
.navlinks{display:flex;gap:30px;font-size:15px;letter-spacing:.09em;text-transform:uppercase}
.navlinks a{opacity:.72;transition:opacity .2s}
.navlinks a:hover{opacity:1}
@media(max-width:620px){.navlinks{gap:18px;font-size:13px}.brand .wmk{width:99px}}

/* hero */
.hero{background:var(--brun);color:var(--beige);text-align:center;padding:104px 0 96px}
.hero .icon{width:92px;margin:0 auto 38px}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(40px,7vw,78px);line-height:1.08;letter-spacing:.015em}
.hero h1.brandword .wmk{width:clamp(260px,49.4vw,532px);margin:0 auto}
.hero .tag{font-family:var(--serif);font-style:italic;font-size:clamp(21px,3vw,27px);opacity:.88;margin-top:26px}
.rule{width:62px;height:2px;background:currentColor;opacity:.45;margin:40px auto}
.hero p{max-width:620px;margin:0 auto;opacity:.84;font-size:17px}
.hero .meta{margin-top:40px;font-size:13px;letter-spacing:.26em;text-transform:uppercase;opacity:.6}

/* sections */
section{padding:92px 0}
.eyebrow{font-size:13px;letter-spacing:.26em;text-transform:uppercase;opacity:.6;margin-bottom:20px}
h2{font-family:var(--serif);font-weight:500;font-size:clamp(30px,4.6vw,48px);line-height:1.14;letter-spacing:.01em}
h3{font-family:var(--serif);font-weight:500;font-size:25px;line-height:1.25;margin-bottom:10px}
.lead{font-size:20px;max-width:680px;margin-top:22px;opacity:.9}
.dark{background:var(--brun);color:var(--beige)}
.cacao{background:var(--cacao);color:var(--ivoire)}
.cacao .card{border-top-color:var(--ivoire)}
.cacao .btn:hover{background:var(--ivoire);color:var(--cacao)}
.honest{margin-top:56px;border-left:2px solid var(--brun);padding:4px 0 4px 28px;max-width:720px}
.honest h3{font-size:21px;margin-bottom:8px}
.honest p{font-size:17px;opacity:.86}
.beigebg{background:var(--cacao);color:var(--ivoire)}

.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:46px;margin-top:56px}
.cols .n{font-family:var(--serif);font-style:italic;font-size:34px;opacity:.5;margin-bottom:12px}
.cols p{font-size:17px;opacity:.86}
@media(max-width:800px){.cols{grid-template-columns:1fr;gap:38px}}

/* produits */
.cures{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:52px}
.cure{border:1px solid rgba(228,216,196,.28);padding:38px 34px}
.cure .tagpill{display:inline-block;font-size:11px;letter-spacing:.2em;text-transform:uppercase;border:1px solid currentColor;padding:5px 11px;opacity:.65;margin-bottom:20px}
.cure p{font-size:16px;opacity:.84;margin-top:10px}
.cure .ing{font-size:14px;opacity:.6;margin-top:18px;line-height:1.5}
@media(max-width:800px){.cures{grid-template-columns:1fr}}

/* fondatrice */
.founder{display:grid;grid-template-columns:0.82fr 1.18fr;gap:62px;align-items:start}
.founder img{width:100%;height:auto;display:block}
.founder .body p{margin-top:17px;opacity:.9}
.founder .body p:first-of-type{margin-top:24px}
.sig{font-family:var(--serif);font-style:italic;font-size:24px;margin-top:30px}
@media(max-width:860px){.founder{grid-template-columns:1fr;gap:34px}}

/* lab */
.labbox{margin-top:52px;display:grid;grid-template-columns:1.1fr 0.9fr;gap:56px;align-items:start}
.labbox ul{list-style:none}
.labbox li{padding:13px 0;border-bottom:1px solid rgba(228,216,196,.2);font-size:17px;opacity:.88}
form{display:flex;flex-direction:column;gap:14px;margin-top:8px}
input[type=email],input[type=text]{background:transparent;border:1px solid rgba(228,216,196,.42);color:var(--beige);padding:16px 18px;font-family:var(--sans);font-size:16px}
input::placeholder{color:rgba(228,216,196,.52)}
button{background:var(--beige);color:var(--brun);border:none;padding:17px 22px;font-family:var(--sans);font-size:15px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:opacity .2s}
button:hover{opacity:.85}
.fineprint{font-size:13px;opacity:.6;line-height:1.5}
@media(max-width:860px){.labbox{grid-template-columns:1fr;gap:34px}}

/* journal cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:52px}
.card{display:block;text-decoration:none;border-top:2px solid var(--brun);padding-top:22px;transition:opacity .2s}
.card:hover{opacity:.66}
.card .pil{font-size:12px;letter-spacing:.2em;text-transform:uppercase;opacity:.55}
.card h3{margin-top:12px;font-size:22px}
.card p{font-size:15px;opacity:.76;margin-top:10px;line-height:1.55}
@media(max-width:860px){.cards{grid-template-columns:1fr}}

.btn{display:inline-block;margin-top:44px;border:2px solid currentColor;padding:16px 34px;text-decoration:none;font-size:14px;letter-spacing:.12em;text-transform:uppercase;transition:all .2s}
.btn:hover{background:var(--brun);color:var(--beige)}
.dark .btn:hover{background:var(--beige);color:var(--brun)}

/* article */
.arthead{background:var(--brun);color:var(--beige);padding:84px 0 72px}
.artwrap{width:min(740px,92vw);margin:0 auto}
.arthead .pil{font-size:12px;letter-spacing:.24em;text-transform:uppercase;opacity:.62}
.arthead h1{font-family:var(--serif);font-weight:500;font-size:clamp(31px,4.8vw,50px);line-height:1.14;margin-top:20px}
.arthead .sub{margin-top:24px;opacity:.82;font-size:18px}
.article{padding:68px 0 86px}
.article h2{font-size:clamp(25px,3.4vw,34px);margin:52px 0 16px}
.article h3{font-size:22px;margin:36px 0 10px;font-family:var(--serif)}
.article p{margin-bottom:19px}
.article ul,.article ol{margin:0 0 22px 22px}
.article li{margin-bottom:9px}
.article strong{font-weight:600}
.article blockquote{border-left:2px solid var(--cacao);padding:4px 0 4px 24px;margin:26px 0;font-style:normal;opacity:.92}
.article blockquote p{margin-bottom:8px}
.article hr{border:none;border-top:1px solid rgba(58,42,32,.18);margin:44px 0}
.article em{font-style:italic}
.article a{color:var(--cacao)}
.artfoot{border-top:1px solid rgba(58,42,32,.18);margin-top:52px;padding-top:28px;font-size:16px;opacity:.78;font-style:italic}

footer{background:var(--brun);color:var(--beige);padding:62px 0 46px;text-align:center}
footer .icon{width:52px;margin:0 auto 22px}
footer .wm{margin-bottom:22px}
footer .wm .wmk{width:161px;margin:8px auto 0}
footer nav{display:flex;gap:26px;justify-content:center;flex-wrap:wrap;font-size:14px;letter-spacing:.08em;opacity:.75;margin-bottom:26px}
footer nav a{text-decoration:none}
footer .legal{font-size:13px;opacity:.5;line-height:1.7}
