:root{--ink:#18323d;--paper:#fffdf8;--pale:#eef5f5;--accent:#2e5e9e}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Comic Sans MS","Trebuchet MS",sans-serif;line-height:1.65}
a{color:inherit}.wrap{width:min(1040px,calc(100% - 32px));margin:auto}.top{display:flex;align-items:center;justify-content:space-between;padding:20px 0;gap:18px}
.brand{font-size:clamp(1.15rem,3vw,1.45rem);font-weight:700;text-decoration:none}.home{font-weight:700;text-decoration:none;padding:8px 14px;border:2px solid var(--accent);border-radius:999px;color:var(--accent)}
.hero{padding:32px 0 20px}.hero h1{font-size:clamp(2rem,7vw,4.5rem);line-height:1.08;max-width:850px;margin:.25em 0}.hero p{font-size:1.15rem;max-width:720px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;padding:25px 0 70px}.card{display:block;background:#fff;border-radius:22px;overflow:hidden;text-decoration:none;box-shadow:0 8px 26px #18323d16;border:1px solid #18323d12;transition:.2s transform}
.card:hover{transform:translateY(-4px)}.card img{width:100%;aspect-ratio:4/5;object-fit:cover;background:white}.card div{padding:16px}.card small,.tag{color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:.04em}.card h2{font-size:1.2rem;line-height:1.3;margin:.4em 0 0}
.story{--accent:#2e5e9e;padding-bottom:60px}.story-head{padding:24px 0 16px}.story-head h1{font-size:clamp(2rem,6vw,4rem);line-height:1.1;margin:.22em 0}.tag{display:inline-block;background:var(--pale);padding:7px 13px;border-radius:999px;color:var(--accent)}
.content{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);gap:32px;align-items:start}.visual{position:sticky;top:18px}.visual img{display:block;width:100%;border-radius:24px;background:white;box-shadow:0 10px 35px #18323d1a}
.listen{background:var(--pale);border-radius:22px;padding:20px;margin-bottom:22px;border-left:7px solid var(--accent)}.listen strong{display:block;font-size:1.25rem;margin-bottom:10px}.listen audio{width:100%;height:48px}
.text{font-size:1.16rem;background:#fff;border-radius:22px;padding:24px;box-shadow:0 8px 28px #18323d10}.text p{margin:0 0 1.25em}.ending{color:var(--accent);font-weight:700;font-size:1.2rem}
.nav{display:flex;justify-content:space-between;gap:14px;margin-top:24px}.nav a{flex:1;text-align:center;text-decoration:none;font-weight:700;border:2px solid var(--accent);color:var(--accent);border-radius:16px;padding:12px}
footer{padding:22px 0 38px;color:#5b6d73;text-align:center}@media(max-width:760px){.content{grid-template-columns:1fr}.visual{position:static}.top{align-items:flex-start}.text{font-size:1.08rem;padding:19px}.nav{flex-direction:column}}