/* bebeauquotidien.com : la toise murale (pêche, sauge, bleu nuit, corail) */
:root{--peche:#ffe8d6;--peche-c:#fff5ec;--sauge:#a8c3a0;--sauge-f:#5f7f58;--nuit:#2d3a4a;--corail:#e07a5f;--corail-f:#b8553c;--gris:#66707b;--blanc:#ffffff;--trait:#f0d5bf}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--peche-c);color:var(--nuit);font:400 1.05rem/1.75 Lato,system-ui,sans-serif}
a{color:var(--corail-f)}
img{max-width:100%;height:auto;display:block}
.saut{position:absolute;left:-999px}.saut:focus{left:1rem;top:1rem;background:var(--blanc);padding:.5rem 1rem;z-index:9}
h1,h2,h3,h4{font-family:Fredoka,system-ui,sans-serif;font-weight:600;line-height:1.2;color:var(--nuit)}

/* frise + graduation */
.frise{background:var(--peche)}
.frise__in{max-width:1180px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem 2rem;padding:1.1rem clamp(1rem,4vw,2rem) .9rem}
.frise__nom{display:flex;align-items:center;gap:.7rem;color:var(--nuit);text-decoration:none;font:600 1.5rem/1 Fredoka,sans-serif}
.frise__hochet{position:relative;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle,var(--peche) 0 30%,var(--corail) 31%)}
.frise__hochet::after{content:"";position:absolute;left:12px;top:26px;width:6px;height:14px;border-radius:3px;background:var(--nuit)}
.frise__nav{display:flex;flex-wrap:wrap;gap:.3rem .4rem}
.frise__nav a{padding:.35rem .8rem;border-radius:999px;color:var(--nuit);text-decoration:none;font:500 .93rem/1.2 Fredoka,sans-serif}
.frise__nav a:hover,.frise__nav a[aria-current]{background:var(--nuit);color:var(--peche)}
.graduation{height:16px;background:
  repeating-linear-gradient(90deg,var(--nuit) 0 2px,transparent 2px 50px) top/100% 16px no-repeat,
  repeating-linear-gradient(90deg,var(--nuit) 0 1px,transparent 1px 10px) top/100% 8px no-repeat,
  var(--sauge)}

main{max-width:1180px;margin:0 auto;padding:0 clamp(1rem,4vw,2rem) 3rem}

/* éveil (haut de l'accueil) */
.eveil{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:2.5rem;align-items:center;margin:3rem 0 2.5rem}
.eveil>*{min-width:0}
.eveil h1{margin:0;font-size:clamp(2.1rem,4.8vw,3.2rem)}
.eveil__txt p{color:var(--gris);font-size:1.1rem}

/* toise : les rubriques comme repères */
.toise{position:relative;margin:1rem 0;padding:1.6rem 0 1.6rem 70px;background:var(--blanc);border-radius:22px;border:2px solid var(--trait)}
.toise::before{content:"";position:absolute;left:22px;top:18px;bottom:18px;width:28px;border-radius:14px;background:
  repeating-linear-gradient(180deg,var(--nuit) 0 2px,transparent 2px 24px) left/14px 100% no-repeat,var(--sauge)}
.toise__reperes{list-style:none;margin:0;padding:0 1.4rem 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:.4rem 1.2rem}
.toise__reperes a{position:relative;display:block;padding:.65rem .9rem .65rem 1.2rem;border-radius:12px;text-decoration:none;color:var(--nuit)}
.toise__reperes a::before{content:"";position:absolute;left:0;top:50%;width:.7rem;height:3px;margin-top:-1.5px;background:var(--corail)}
.toise__reperes b{display:block;font:600 1.1rem/1.25 Fredoka,sans-serif}
.toise__reperes small{display:block;color:var(--gris);font-size:.88rem}
.toise__reperes a:hover{background:var(--peche)}

/* corde à linge : cartes avec pince */
.corde__t{margin:3rem 0 1.4rem;font-size:1.7rem}
.pinces{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:2rem 1.5rem}
.pinces>li{min-width:0}
.pince{position:relative;display:flex;flex-direction:column;gap:.35rem;height:100%;padding:.8rem .8rem 1.1rem;background:var(--blanc);border-radius:18px;text-decoration:none;color:var(--nuit);box-shadow:0 6px 0 var(--trait)}
.pince::before{content:"";position:absolute;top:-12px;left:50%;width:16px;height:28px;margin-left:-8px;border-radius:4px;background:var(--sauge);border:2px solid var(--sauge-f)}
.pince__img img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:12px}
.pince__r{margin-top:.4rem;font:500 .78rem/1.2 Fredoka,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--sauge-f)}
.pince__t{font:600 1.14rem/1.3 Fredoka,sans-serif;overflow-wrap:anywhere}
.pince__m{font-size:.84rem;color:var(--gris)}
.pince:hover{box-shadow:0 6px 0 var(--corail)}
.pince--une .pince__t{font-size:1.45rem}

/* titre de rubrique */
.repere-titre{position:relative;margin:3rem 0 1.4rem;padding:0 0 1rem 1.4rem;border-left:6px solid var(--corail)}
.repere-titre h1{margin:0;font-size:clamp(2rem,4.6vw,2.9rem)}
.repere-titre p{margin:.4rem 0 0;color:var(--gris)}

/* fiche article */
.fiche{max-width:840px;margin:2.6rem auto 0}
.etiquette{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1rem;font:500 .86rem/1.2 Fredoka,sans-serif}
.etiquette>*{padding:.3rem .7rem;border-radius:999px;background:var(--peche);color:var(--nuit);text-decoration:none}
.etiquette>a:first-child{background:var(--nuit);color:var(--peche)}
.etiquette a{color:inherit}
.fiche__tete h1{margin:0 0 1.5rem;font-size:clamp(1.9rem,4.3vw,2.6rem)}
.fiche__img{margin:0 0 2rem}
.fiche__img img{width:100%;border-radius:22px}
.fiche__texte{overflow-wrap:anywhere}
.fiche__texte h2{font-size:1.5rem;margin:2.4rem 0 .8rem}
.fiche__texte h2::after{content:"";display:block;width:70px;height:8px;margin-top:.45rem;background:repeating-linear-gradient(90deg,var(--corail) 0 2px,transparent 2px 10px)}
.fiche__texte h3{font-size:1.18rem;margin:1.8rem 0 .6rem;color:var(--sauge-f)}
.fiche__texte p{margin:0 0 1.1rem}
.fiche__texte ul,.fiche__texte ol{padding-left:1.4rem;margin:0 0 1.2rem}
.fiche__texte li{margin:.35rem 0}
.fiche__texte li::marker{color:var(--corail)}
.fiche__texte blockquote{margin:1.5rem 0;padding:1rem 1.3rem;background:var(--blanc);border-radius:16px;border:2px dashed var(--sauge)}
.fiche__texte table{width:100%;border-collapse:collapse;margin:1.4rem 0;font-size:.95rem;display:block;overflow-x:auto}
.fiche__texte th,.fiche__texte td{border:1px solid var(--trait);padding:.55rem .7rem;text-align:left;vertical-align:top}
.fiche__texte th{background:var(--sauge);color:var(--nuit)}
.fiche__texte figure{margin:1.5rem 0}
.fiche__texte details{margin:0 0 1.4rem;padding:.8rem 1rem;background:var(--blanc);border-radius:14px}
.fiche__texte summary{cursor:pointer;font-weight:700}
.fiche__texte input,.fiche__texte select,.fiche__texte button{font:inherit;max-width:100%}

/* plinthe : le pied, bas de la toise */
.plinthe{margin-top:3.5rem;background:var(--nuit);color:#e6e9ee;border-top:16px solid var(--sauge)}
.plinthe__in{max-width:1180px;margin:0 auto;padding:2.4rem clamp(1rem,4vw,2rem)}
.plinthe__nom{margin:0;font:600 1.5rem/1 Fredoka,sans-serif;color:var(--peche)}
.plinthe__d{margin:.6rem 0 1.6rem;max-width:620px}
.plinthe__cols{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:1.5rem 3rem}
.plinthe ul{list-style:none;margin:0;padding:0}
.plinthe__rub{columns:2;column-gap:2rem}
.plinthe li{margin:.25rem 0;break-inside:avoid}
.plinthe a{color:#fff}
.plinthe__an{margin:1.8rem 0 0;font:500 .85rem/1 Fredoka,sans-serif;color:var(--sauge)}

@media (max-width:820px){
  .eveil,.plinthe__cols{grid-template-columns:minmax(0,1fr)}
  .toise{padding-left:58px}
  .toise::before{left:16px}
  .plinthe__rub{columns:1}
}
