.notes-page{padding:80px 4vw 110px;min-height:70vh;background:linear-gradient(180deg,#121018 0%,#0b0b0d 42%,#0b0b0d 100%);border-bottom:1px solid var(--line)}
.notes-hero{max-width:920px;margin:0 auto 56px;text-align:center}
.notes-hero h1{font:800 clamp(42px,6vw,92px)/.92 var(--display);letter-spacing:-.06em;margin:22px 0 18px}
.notes-hero h1 span{color:var(--acid)}
.notes-lead{color:#a8a8b0;font-size:17px;line-height:1.7;max-width:640px;margin:0 auto}
.notes-hero .section-index a{color:inherit}
.notes-hero .section-index a:hover{color:var(--acid)}
.note-meta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center;margin-top:28px;font-size:11px;letter-spacing:.12em;color:var(--muted);text-transform:uppercase}
.note-meta em{font-style:normal;border:1px solid #3c3c45;padding:5px 9px;color:var(--acid)}
.notes-feed{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:1200px;margin:0 auto}
.note-card{display:flex;flex-direction:column;min-height:0;padding:0;border:1px solid #34343b;background:#121216;overflow:hidden;transition:transform .2s,border-color .2s,background .2s}
.note-card:hover{transform:translateY(-3px);border-color:#60606a;background:#17171c}
.note-card-cover{margin:0;aspect-ratio:16/10;background:#08080a;overflow:hidden}
.note-card-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.note-card:hover .note-card-cover img{transform:scale(1.04)}
.note-card-body{display:flex;flex-direction:column;flex:1;padding:22px 22px 26px}
.note-card-meta{display:flex;justify-content:space-between;align-items:center;gap:12px}
.note-card time{font-size:11px;color:var(--muted)}
.note-card .tag{font-size:9px;color:var(--acid);border:1px solid #59651f;padding:5px 8px;letter-spacing:.08em}
.note-card h2{font:600 clamp(18px,1.8vw,26px)/1.25 var(--display);letter-spacing:-.04em;margin:16px 0 12px}
.note-card.has-cover h2{margin-top:14px}
.note-card p{margin:0;color:#999aa3;font-size:13px;line-height:1.65;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.note-card b{margin-top:20px;font-size:10px;letter-spacing:.12em;color:var(--acid)}
.note-article{display:flex;flex-direction:column;align-items:center}
.note-article .notes-hero{width:100%;max-width:760px;margin-bottom:40px;border-bottom:1px solid var(--line);padding-bottom:36px}
.note-body{width:100%;max-width:760px;margin:0 auto;font-size:17px;line-height:1.85;color:#d6d6dc;text-align:left}
.note-body h1,.note-body h2,.note-body h3{font-family:var(--display);letter-spacing:-.04em;line-height:1.2;margin:1.4em 0 .55em;color:#fff}
.note-body h1{font-size:clamp(28px,3.5vw,42px)}
.note-body h2{font-size:clamp(24px,2.8vw,34px)}
.note-body h3{font-size:clamp(20px,2.2vw,26px)}
.note-body p{margin:0 0 1.15em}
.note-body a{color:var(--acid);border-bottom:1px solid #6a7a20}
.note-body ul,.note-body ol{margin:0 0 1.2em;padding-left:1.2em;color:#c9c9d0}
.note-body li{margin:.35em 0}
.note-body strong{color:#fff}
.note-body .note-figure,.note-body .note-audio{margin:1.4em 0 1.6em;padding:0;border:1px solid #34343b;background:#121216}
.note-body .note-figure img,.note-body .note-inline-img{display:block;width:100%;height:auto}
.note-body .note-inline-img{margin:1em 0;border:1px solid #34343b}
.note-body .note-figure figcaption,.note-body .note-audio figcaption{padding:12px 16px 0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.note-body .note-audio{padding:14px 16px 18px}
.note-body .note-audio audio{display:block;width:100%;margin-top:10px;height:40px}
.note-body .note-audio figcaption{padding:0}
.note-back{width:100%;max-width:760px;margin:56px auto 0;text-align:center}
.notes-teaser{padding:100px 4vw;border-top:1px solid var(--line);background:#101014;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:end}
.notes-teaser h2{font:700 clamp(35px,4.6vw,72px)/1.05 var(--display);letter-spacing:-.055em;margin:20px 0}
.notes-teaser h2 span{color:var(--acid)}
.notes-teaser p:not(.section-index){color:#aaa;line-height:1.7;max-width:520px}
.notes-teaser .btn{justify-self:end}
@media(max-width:1100px){
  .notes-feed{grid-template-columns:repeat(2,minmax(0,1fr));max-width:920px}
}
@media(max-width:850px){
  .notes-page{padding:70px 6vw 90px}
  .notes-feed{grid-template-columns:1fr;max-width:520px}
  .notes-teaser{grid-template-columns:1fr;padding:75px 6vw}
  .notes-teaser .btn{justify-self:start}
}