/* Learning journeys · Madame Carole Paoli Pompougnac · © 2026 · CC BY-NC-ND */
:root{--bg:#fbf5ea;--ink:#2b2118;--muted:#6b5a4c;--line:#ead9bf;--gold:#d19a2a;--paper:#fffdf8}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 "Source Sans 3",system-ui,sans-serif;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}a{color:var(--acc2)}
.wrap{max-width:1060px;margin:0 auto;padding:0 16px}
.topbar{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:space-between;align-items:center;background:var(--acc2);color:#fff;padding:7px 14px;font-size:.88rem}
.topbar a{color:#fff}.topbar .back{font-weight:700;text-decoration:none}.plink{overflow-wrap:anywhere;opacity:.95}
.band{height:7px;background:repeating-linear-gradient(90deg,var(--acc) 0 22px,var(--gold) 22px 30px,var(--acc2) 30px 52px,#f3e2c3 52px 60px)}
.banner{position:relative;color:#fff;padding:30px 0 34px;background:radial-gradient(circle at 85% 15%,rgba(255,255,255,.14),transparent 45%),linear-gradient(135deg,var(--acc2),var(--acc));overflow:hidden}
.banner::before{content:"";position:absolute;inset:0;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23fff' stroke-width='1.4'%3E%3Cpath d='M28 6c7 7 7 15 0 22c-7-7-7-15 0-22zM6 28c7-7 15-7 22 0c-7 7-15 7-22 0zM50 28c-7-7-15-7-22 0c7 7 15 7 22 0zM28 50c7-7 7-15 0-22c-7 7-7 15 0 22z'/%3E%3Ccircle cx='28' cy='28' r='3'/%3E%3C/g%3E%3C/svg%3E")}
.bn{position:relative;display:grid;gap:22px;align-items:center}
@media(min-width:820px){.bn{grid-template-columns:1.1fr .9fr}}
.kick{margin:0;color:#ffe2a8;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.8rem}
.banner h1{font-family:Fraunces,Georgia,serif;font-size:clamp(2rem,6.5vw,3.2rem);line-height:1.05;margin:.25em 0 .2em}
.banner h1 span{display:block;font-size:.55em;font-style:italic;font-weight:500;color:#ffe2a8;margin-top:.25em}
.hook{font-family:Fraunces,Georgia,serif;font-style:italic;font-size:1.25rem;margin:.4em 0 .6em;padding-left:14px;border-left:4px solid var(--gold)}
.by{font-size:.9rem;opacity:.9;margin:.8em 0 0}
.bn-img{margin:0;background:#fff;padding:10px 10px 8px;border-radius:6px;box-shadow:0 14px 30px rgba(0,0,0,.28);transform:rotate(.8deg);color:var(--ink)}
.bn-img img{width:100%;max-height:360px;object-fit:cover;border-radius:3px}
.bn-img figcaption,.fig figcaption{font-size:.86rem;line-height:1.4;margin-top:6px;color:var(--muted)}
.cr{display:block;font-size:.76rem;margin-top:3px;opacity:.9;overflow-wrap:anywhere}.cr a{color:inherit}
.chips{display:inline-flex;flex-wrap:wrap;gap:6px;vertical-align:middle}
.nt{display:inline-block;background:#fff;color:var(--n);border:2px solid var(--n);border-radius:999px;padding:1px 11px;font-weight:700;font-size:.8rem;letter-spacing:.02em}
.banner .nt{background:rgba(255,255,255,.92)}
h2{font-family:Fraunces,Georgia,serif;color:var(--acc2);line-height:1.2}
h2 small{display:block;font-family:"Source Sans 3",sans-serif;font-size:.95rem;font-weight:400;color:var(--muted);margin-top:4px}
h3{margin:.2em 0 .35em;font-size:1.02rem;color:var(--acc2)}
.orn{display:flex;justify-content:center;color:var(--gold);margin:26px 0;max-width:100%;overflow:hidden}.orn svg{max-width:100%}
.problem{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:20px 18px;margin-top:26px;box-shadow:0 6px 18px rgba(80,50,20,.06);position:relative}
.problem::after{content:"❦";position:absolute;right:16px;top:8px;font-size:2rem;color:var(--gold);opacity:.6}
.lab{margin:0;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.78rem;color:var(--acc)}
.problem h2{font-size:clamp(1.3rem,4vw,1.75rem);margin:.25em 0 .6em;padding-right:24px}
.why{background:var(--soft);border-radius:12px;padding:12px 14px}.why p{margin:.2em 0}
.glance{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:14px}
.glance div{border:1px dashed var(--gold);border-radius:12px;padding:8px 12px;font-size:.93rem}.glance b{display:block;color:var(--acc);font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}
.bridges .br2{display:grid;gap:14px}@media(min-width:760px){.bridges .br2{grid-template-columns:1fr 1fr}}
.brc{background:#fff;border:1px solid var(--line);border-top:5px solid var(--acc);border-radius:14px;padding:12px 14px}
.brc ul{list-style:none;margin:0;padding:0}.brc li{padding:8px 0;border-bottom:1px dotted var(--line)}.brc li:last-child{border:0}
.brc a{display:block;text-decoration:none}.brc a b{color:var(--acc2)}.brc a small{display:inline-block;margin-left:6px;font-size:.75rem;background:var(--soft);border-radius:999px;padding:0 8px;color:var(--muted)}
.brc span{display:block;font-size:.92rem;color:var(--muted)}.thread{font-size:.92rem;color:var(--muted)}
.snav{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0;padding:8px 0}
@media(min-width:900px){.snav{position:sticky;top:0;z-index:5;background:linear-gradient(var(--bg) 85%,transparent)}}
.snav a{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px 12px 4px 4px;text-decoration:none;font-weight:600;font-size:.88rem;color:var(--acc2)}
.snav a span{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--acc);color:#fff;font-size:.8rem}
.snav a:hover{background:var(--soft)}
.session{background:var(--paper);border:1px solid var(--line);border-radius:18px;margin:18px 0;overflow:hidden;box-shadow:0 4px 14px rgba(80,50,20,.05);scroll-margin-top:70px}
.sh{display:flex;gap:12px;align-items:center;padding:14px 16px;background:linear-gradient(90deg,var(--soft),#fff);border-bottom:2px solid var(--gold)}
.num{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--acc);color:#fff;font:700 1.3rem Fraunces,Georgia,serif;box-shadow:0 0 0 4px #fff,0 0 0 6px var(--gold)}
.sh h2{margin:0;font-size:1.3rem}.aim{margin:.1em 0 0;color:var(--muted);font-size:.95rem}
.sbody{padding:14px 16px;display:grid;gap:12px}
.figs{display:grid;gap:12px}@media(min-width:700px){.figs{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}}
.fig{margin:0;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px}.fig img{width:100%;max-height:340px;object-fit:cover;border-radius:6px}
.facts{background:#fff;border-left:5px solid var(--gold);border-radius:0 12px 12px 0;padding:10px 14px}.facts ul{margin:.2em 0;padding-left:1.1em}.facts li{margin:.25em 0}
.src{font-size:.88rem;margin:.5em 0 0;overflow-wrap:anywhere}
.do ol{margin:.2em 0;padding-left:1.3em}.do li{margin:.25em 0}
.starters{background:var(--soft);border:2px dashed var(--acc);border-radius:14px;padding:10px 14px}
.starters ul{margin:.2em 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.starters li{background:#fff;border-radius:999px;padding:3px 12px;font-style:italic;border:1px solid var(--line)}
.oral{background:#fff7e6;border-radius:12px;padding:10px 14px}.oral p{margin:.1em 0}
.lhl{background:#f4eefa;border-radius:12px;padding:10px 14px;border:1px solid #e1d3ef}.lhl h3{color:#5a3d8a}.lhl p{margin:.1em 0}
.game,.final,.badges,.fiche,.credits{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:16px 18px;margin:18px 0}
.game{border:2px solid var(--gold);background:linear-gradient(135deg,#fffaf0,#fff)}
.final{background:linear-gradient(135deg,var(--soft),#fff);border-left:6px solid var(--acc)}
.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.bdg{background:#fff;border:2px solid var(--gold);border-radius:14px;padding:10px;text-align:center}
.bdg b{display:block;font-family:Fraunces,Georgia,serif;color:var(--acc2)}.bdg b::before{content:none}.bdg span{font-size:.88rem;color:var(--muted)}
h2.sec{margin-top:10px}
.fq{display:flex;flex-wrap:wrap;gap:14px;align-items:center}.fq img{border:1px solid var(--line);border-radius:8px;background:#fff}
.fq>div{flex:1 1 240px}
.btn{display:inline-block;background:var(--acc);color:#fff;text-decoration:none;font-weight:700;border-radius:10px;padding:8px 14px;margin:4px 6px 4px 0}.btn.alt{background:var(--acc2)}
.credits{font-size:.85rem;color:var(--muted)}.credits h2{font-size:1.05rem}.credits ul{padding-left:1.1em}.credits li{overflow-wrap:anywhere;margin:.2em 0}
details.prof{background:#fff;border:1px dashed var(--muted);border-radius:14px;padding:10px 16px;margin:18px 0}details.prof summary{cursor:pointer;font-weight:700;color:var(--acc2)}
footer{margin-top:30px;background:var(--acc2);color:#f6ead8;padding:22px 16px;text-align:center;font-size:.92rem}
footer a{color:#fff}.remind{font-size:1rem;overflow-wrap:anywhere}.sm{font-size:.8rem;opacity:.85}
@media print{.topbar,.snav,footer .remind{display:none}.session{break-inside:avoid}}