/* Alexander Sosnovski — "Le Bulletin de Quartier" retro mimeograph/neighborhood-flyer concept */
*{box-sizing:border-box;}
html{background:var(--paper); min-height:100%;}
body{
  margin:0; min-height:100%; background:var(--paper); color:var(--ink);
  font-family:'Courier Prime', monospace; font-size:1rem; line-height:1.65;
}
:root{
  --paper:#E7E3D8; --paper2:#DEDACC; --ink:#232323; --mimeo:#25348C;
  --mimeo-light:#4356B8; --line:#B9B4A2; --red:#A6362C; --white:#F4F1E8;
  --grey:#5C594E;
}
.wrap{max-width:1000px; margin:0 auto; padding:0 24px;}
.mono{font-family:'Courier Prime', monospace;}
h1,h2,h3{font-family:'Special Elite', cursive; font-weight:400; margin:0; letter-spacing:.01em;}
.kicker{font-family:'Courier Prime', monospace; font-weight:700; text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; color:var(--mimeo); margin:0 0 10px;}
.display{font-size:clamp(1.7rem,4vw,2.6rem); line-height:1.15;}
.lede{font-size:1.08rem; color:var(--grey); max-width:640px;}
.lede.center{margin:0 auto;}
a{color:var(--mimeo);}
.btn{display:inline-block; padding:11px 24px; border:2px solid var(--ink); font-family:'Courier Prime',monospace; font-weight:700; font-size:.82rem; text-transform:uppercase; letter-spacing:.06em; text-decoration:none; color:var(--ink); background:transparent; transition:background .2s,color .2s;}
.btn:hover{background:var(--ink); color:var(--paper);}
.btn-solid{background:var(--mimeo); color:var(--white); border-color:var(--mimeo);}
.btn-solid:hover{background:var(--ink); border-color:var(--ink);}
.btn-ghost{border-color:var(--mimeo); color:var(--mimeo);}
.btn-ghost:hover{background:var(--mimeo); color:var(--white);}

/* toggles (lang + density) */
.tool-toggle{background:var(--white); border:2px solid var(--ink); color:var(--ink); font-family:'Courier Prime',monospace; font-weight:700; font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; padding:6px 10px; cursor:pointer;}
.tool-toggle:hover{background:var(--ink); color:var(--paper);}

/* nav */
.topnav{position:sticky; top:0; z-index:50; background:var(--paper); border-bottom:3px double var(--ink);}
.nav-inner{display:flex; align-items:center; justify-content:space-between; padding:12px 24px; gap:12px; flex-wrap:wrap;}
.nav-logo{font-family:'Special Elite',cursive; font-size:1.15rem; color:var(--ink); text-decoration:none;}
.nav-logo span{color:var(--mimeo);}
.nav-tools{display:flex; gap:8px; align-items:center;}
.nav-links{display:flex; gap:18px; align-items:center;}
.nav-links a{font-family:'Courier Prime',monospace; font-weight:700; font-size:.74rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink); text-decoration:none; border-bottom:2px solid transparent; padding-bottom:4px;}
.nav-links a:hover, .nav-links a.active{border-color:var(--mimeo); color:var(--mimeo);}
.nav-toggle{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px;}
.nav-toggle span{width:24px; height:2px; background:var(--ink);}
@media (max-width:860px){
  .nav-toggle{display:flex;}
  .nav-links{position:absolute; top:100%; left:0; right:0; background:var(--paper); border-bottom:3px double var(--ink); flex-direction:column; align-items:flex-start; padding:0 24px; max-height:0; overflow:hidden; gap:0; transition:max-height .25s ease;}
  .nav-links.open{max-height:320px; padding:12px 24px 20px;}
  .nav-links a{padding:10px 0; width:100%; border-bottom:1px solid var(--line);}
}

/* masthead / hero bulletin */
.hero{padding:32px 0 40px; border-bottom:4px double var(--ink);}
.bulletin{border:3px solid var(--ink); background:var(--white); padding:28px 24px; position:relative;}
.bulletin-top{display:flex; justify-content:space-between; align-items:flex-start; border-bottom:2px solid var(--ink); padding-bottom:14px; margin-bottom:18px; flex-wrap:wrap; gap:12px;}
.dateline{font-family:'Courier Prime',monospace; font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; color:var(--grey);}
.stamp{border:2px solid var(--red); color:var(--red); font-family:'Courier Prime',monospace; font-weight:700; font-size:.65rem; text-transform:uppercase; letter-spacing:.05em; padding:6px 10px; transform:rotate(-4deg); white-space:nowrap;}
.masthead{font-family:'Special Elite',cursive; font-size:clamp(2.1rem,6vw,3.6rem); text-align:center; color:var(--ink); line-height:1.05; margin:10px 0 4px; text-transform:uppercase;}
.masthead-sub{text-align:center; font-family:'Courier Prime',monospace; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--mimeo); margin-bottom:20px;}
.hero-name-line{text-align:center; font-family:'Courier Prime',monospace; font-weight:700; font-size:1rem; color:var(--ink); margin-bottom:18px; text-transform:uppercase; letter-spacing:.03em;}
.columns{column-count:2; column-gap:28px; column-rule:1px solid var(--line);}
.columns p{margin:0 0 12px; font-size:.95rem;}
@media (max-width:640px){ .columns{column-count:1;} }

.stat-strip{display:flex; gap:0; margin-top:24px; border:2px solid var(--ink);}
.stat-cell{flex:1; text-align:center; padding:14px 8px; border-right:1px solid var(--ink);}
.stat-cell:last-child{border-right:none;}
.stat-cell b{display:block; font-size:1.5rem; color:var(--mimeo); font-family:'Courier Prime',monospace;}
.stat-cell span{font-size:.66rem; text-transform:uppercase; letter-spacing:.04em; color:var(--grey);}
@media (max-width:700px){ .stat-strip{flex-wrap:wrap;} .stat-cell{flex:1 1 33%; border-right:1px solid var(--ink);} }

section{padding:44px 0; border-bottom:1px solid var(--line);}
.section-head{margin-bottom:28px;}
.page-num{font-family:'Courier Prime',monospace; font-size:.68rem; color:var(--grey); text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px;}

/* unfold reveal (scroll) */
.unfold{opacity:0; transform:scaleY(.9); transform-origin:top; transition:opacity .5s ease, transform .5s ease;}
.unfold.in-view{opacity:1; transform:scaleY(1);}
@media (prefers-reduced-motion:reduce){ .unfold{opacity:1; transform:none; transition:none;} }

/* brief cards (coverage) */
.filing-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:2px solid var(--ink); border-bottom:none;}
.filing-card{background:var(--white); border-bottom:2px solid var(--ink); border-right:1px solid var(--ink); padding:20px;}
.filing-card:last-child{border-right:none;}
.filing-card .tag{font-family:'Courier Prime',monospace; font-weight:700; font-size:.64rem; text-transform:uppercase; letter-spacing:.08em; color:var(--mimeo); display:block; margin-bottom:8px;}
.filing-card h3{font-size:1.05rem; color:var(--ink); margin-bottom:8px; font-family:'Special Elite',cursive;}
.filing-card p{font-size:.9rem; margin:0; color:var(--grey);}
@media (max-width:760px){ .filing-grid{grid-template-columns:1fr;} .filing-card{border-right:none;} }

.diff-note{background:var(--paper2); border:2px dashed var(--ink); padding:18px 22px; margin-top:24px; font-size:.9rem; color:var(--grey);}
.diff-note b{color:var(--ink);}

/* root signature -> classifieds */
.classifieds{border:2px solid var(--ink); background:var(--white);}
.classified-row{display:grid; grid-template-columns:200px 1fr; gap:16px; padding:16px 18px; border-bottom:1px solid var(--line);}
.classified-row:last-child{border-bottom:none;}
.cf-url{font-family:'Courier Prime',monospace; font-weight:700; font-size:.85rem; color:var(--mimeo);}
.cf-desc{font-size:.9rem; color:var(--grey);}
@media (max-width:640px){ .classified-row{grid-template-columns:1fr;} }

/* editor box (contact CTA) */
.editor-box{border:3px solid var(--ink); background:var(--paper2); padding:24px; text-align:center; margin-top:24px;}
.editor-box h3{font-size:1.2rem; margin-bottom:10px;}

/* coupon (career CTA) */
.coupon{border:2px dashed var(--ink); background:var(--white); padding:22px; display:flex; align-items:center; gap:16px; text-decoration:none; color:var(--ink); margin-top:24px; transition:background .2s;}
.coupon:hover{background:var(--paper2);}
.coupon svg{width:34px; height:34px; flex-shrink:0; color:var(--red);}
.coupon-text b{display:block; font-family:'Special Elite',cursive; font-size:1.05rem;}
.coupon-text span{font-family:'Courier Prime',monospace; font-size:.78rem; color:var(--grey);}

/* career timeline */
.exec-timeline{border-top:2px solid var(--ink);}
.exec-row{display:grid; grid-template-columns:170px 1fr; gap:20px; padding:16px 0; border-bottom:1px solid var(--line);}
.exec-when{font-family:'Courier Prime',monospace; font-weight:700; font-size:.78rem; color:var(--mimeo); margin:0;}
.exec-role{font-weight:700; color:var(--ink); margin-bottom:2px; font-family:'Special Elite',cursive; font-size:1rem;}
.exec-org{font-size:.9rem; color:var(--grey);}
@media (max-width:700px){ .exec-row{grid-template-columns:1fr; gap:6px;} }

/* density toggle: quick-read hides detail-only content */
body.quick-read .detail-only{display:none;}

/* footer / cta */
.cta-strip{background:var(--paper2); color:var(--ink); text-align:center; padding:48px 24px; border-top:2px solid var(--ink);}
.cta-strip h2{margin-bottom:14px;}
footer{padding:28px 24px; text-align:center; font-family:'Courier Prime',monospace; font-size:.72rem; color:var(--grey); border-top:3px double var(--ink);}
footer .links{margin-bottom:10px;}
footer .links a{color:var(--mimeo); margin:0 10px; text-decoration:none;}

/* contact form */
.contact-form{max-width:560px; display:flex; flex-direction:column; gap:14px;}
.form-row{display:flex; flex-direction:column; gap:6px;}
.form-row label{font-family:'Courier Prime',monospace; font-weight:700; font-size:.74rem; text-transform:uppercase; letter-spacing:.05em; color:var(--mimeo);}
.form-row input, .form-row textarea{font-family:'Courier Prime',monospace; font-size:1rem; padding:10px 12px; border:2px solid var(--ink); background:var(--white); color:var(--ink);}
.form-row input:focus, .form-row textarea:focus{outline:2px solid var(--mimeo);}
.form-note{font-size:.82rem; color:var(--grey);}
.contact-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-top:20px;}
.contact-card{background:var(--white); border:2px solid var(--ink); padding:18px;}
.contact-card p{color:var(--grey);}

.page-hero{padding:36px 0 28px; border-bottom:4px double var(--ink); text-align:center;}
