/* BBS About page. Every rule is scoped to .bbs-about so it cannot clash with the theme. */
.bbs-about{--bg:#F6F7FA;--ink:#14213D;--mute:#55586E;--card:#FFFFFF;--line:#D9DCE6;--sun:#E8A100;--blue:#2F6BD0;--tint:#EAF1FD;--deep:#2F6BD0;--deepink:#F6F7FA;
box-sizing:border-box;color:var(--ink);font:400 18px/1.65 "Source Serif 4",Georgia,serif;text-align:left;width:100%}
.bbs-about *,.bbs-about *::before,.bbs-about *::after{box-sizing:border-box}
.bbs-about h2,.bbs-about h3{font-family:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;color:inherit;text-transform:none;line-height:1.15;letter-spacing:-.01em;margin:0;padding:0}
.bbs-about p,.bbs-about ol,.bbs-about li{margin:0;padding:0}
.bbs-about ol,.bbs-about li{list-style:none}
.bbs-about article{margin:0;float:none;width:auto;max-width:none}
.bbs-about :focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.bbs-about .wrap{max-width:1080px;margin:0 auto;padding:0 24px}
.bbs-about section{padding:56px 0}
.bbs-about h2{font-size:clamp(28px,4vw,44px);margin-bottom:20px}
.bbs-about .vm{display:grid;grid-template-columns:5fr 7fr;gap:24px;align-items:stretch}
.bbs-about .vm article{padding:40px;display:flex;flex-direction:column}
.bbs-about .vm .ico{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;margin-bottom:24px}
.bbs-about .vm .ico svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bbs-about .vm h3{margin-bottom:12px;font-size:20px;font-weight:700}
.bbs-about .vm .v{background:var(--deep);color:#fff}
.bbs-about .vm .v .ico{background:var(--sun);color:#14213D}
.bbs-about .vm .v h3{color:#D5E2F8}
.bbs-about .vm .v p{font:700 clamp(28px,3.4vw,40px)/1.15 "Bricolage Grotesque",sans-serif;letter-spacing:-.01em;color:#fff}
.bbs-about .vm .m{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--blue)}
.bbs-about .vm .m .ico{background:var(--deep);color:#fff}
.bbs-about .vm .m h3{color:var(--blue)}
.bbs-about .vm .m p{font-size:20px;line-height:1.6;color:var(--ink)}
.bbs-about .vm .tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:28px}
.bbs-about .vm .tags span{background:var(--bg);border:1px solid var(--line);padding:6px 16px;font:600 15px "Bricolage Grotesque",sans-serif}
.bbs-about .tl{border-left:3px solid var(--sun)}
.bbs-about .tl li{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:0 0 32px 28px;position:relative}
.bbs-about .tl li::before{content:"";position:absolute;left:-10px;top:8px;width:17px;height:17px;border-radius:50%;background:var(--bg);border:3px solid var(--sun)}
.bbs-about .tl time{font:800 28px "Bricolage Grotesque",sans-serif;color:var(--ink)}
.bbs-about .tl p{max-width:62ch;color:var(--ink)}
.bbs-about .tl strong{font-family:"Bricolage Grotesque",sans-serif;font-weight:700}
.bbs-about .today{background:var(--deep);color:var(--deepink);border-radius:24px;padding:56px 40px;margin:24px 0}
.bbs-about .today .wrap{padding:0}
.bbs-about .today h2{color:#fff}
.bbs-about .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:#5C8BE0;border:1px solid #5C8BE0;margin-top:32px}
.bbs-about .stats div{background:var(--deep);padding:28px}
.bbs-about .stats b{display:block;font:800 52px/1 "Bricolage Grotesque",sans-serif;color:var(--sun);margin-bottom:8px}
.bbs-about .stats span{color:#E3ECFB;font-size:16px;line-height:1.4;display:block}
.bbs-about .chan{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;margin-top:8px}
.bbs-about .chan article{display:flex;flex-direction:column;min-height:200px;padding:28px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(160deg,var(--card) 35%,var(--tint));transition:transform .25s,box-shadow .25s,border-color .25s}
.bbs-about .chan article:hover{transform:translateY(-4px);border-color:var(--blue);box-shadow:0 0 0 1px var(--blue),0 14px 36px rgba(47,107,208,.28),0 0 28px rgba(47,107,208,.18)}
.bbs-about .chan h3{margin-bottom:8px;font-size:22px;color:var(--ink)}
.bbs-about .chan p{font-size:16.5px;color:var(--mute)}
@media (prefers-reduced-motion:reduce){.bbs-about .chan article{transition:none}.bbs-about .chan article:hover{transform:none}}
@media (max-width:760px){.bbs-about .vm{grid-template-columns:1fr}.bbs-about .vm article{padding:28px}.bbs-about .tl li{grid-template-columns:1fr;gap:4px}.bbs-about section{padding:40px 0}.bbs-about .today{padding:40px 20px}}
