/* ── TIMELINE ── */
#story { background: var(--dark); padding: 100px 60px; }
.story-intro { max-width: 680px; margin-bottom: 90px; }
.story-intro p { font-size: 17.5px; font-weight: 300; color: var(--white); line-height: 1.9; margin-top: 28px; }

.timeline { position: relative; padding-left: 2px; }
.timeline::before { content:''; position:absolute; left:0; top:0; bottom:0; width:1px; background:linear-gradient(to bottom,var(--red),rgba(204,0,0,0.1)); }
.tl-item { display:grid; grid-template-columns:120px 1fr; gap:50px; margin-bottom:70px; position:relative; }
.tl-item:last-child { margin-bottom:0; }
.tl-year { font-family:var(--font-display); font-size:52px; color:rgba(204,0,0,0.65); line-height:1; padding-top:4px; text-align:right; padding-right:30px; position:relative; }
.tl-year::after { content:''; position:absolute; right:-1px; top:18px; width:10px; height:10px; background:var(--red); border-radius:50%; transform:translateX(50%); }
.tl-content {}
.tl-title { font-family:var(--font-cond); font-size:26px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--white); margin-bottom:12px; }
.tl-title span { color:var(--red); }
.tl-text { font-size:16.5px; font-weight:300; color:var(--white); line-height:1.85; }

/* ── VALUES ── */
#values { background:var(--black); padding:100px 60px; }
.values-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:rgba(255,255,255,0.03); margin-top:60px; }
.value-card { background:var(--black); padding:44px 32px; position:relative; overflow:hidden; transition:background 0.4s; cursor:none; }
.value-card::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:linear-gradient(to right,var(--red),transparent); transform:scaleX(0); transform-origin:left; transition:transform 0.4s; }
.value-card:hover { background:rgba(204,0,0,0.04); }
.value-card:hover::after { transform:scaleX(1); }
.value-icon { width:52px; height:52px; border:1px solid rgba(204,0,0,0.25); display:flex; align-items:center; justify-content:center; margin-bottom:24px; clip-path:polygon(6px 0%,100% 0%,calc(100% - 6px) 100%,0% 100%); }
.value-icon svg { width:22px; height:22px; stroke:var(--red); fill:none; stroke-width:1.5; }
.value-title { font-family:var(--font-cond); font-size:22px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--white); margin-bottom:12px; }
.value-text { font-size:15.5px; font-weight:300; color:var(--white); line-height:1.8; }

/* ── NUMBERS ── */
#numbers { background:var(--red); padding:80px 60px; display:grid; grid-template-columns:repeat(4,1fr); gap:2px; position:relative; overflow:hidden; }
#numbers::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(-55deg,transparent,transparent 30px,rgba(0,0,0,0.04) 30px,rgba(0,0,0,0.04) 32px); }
.number-item { text-align:center; position:relative; z-index:1; padding:20px; }
.number-val { font-family:var(--font-display); font-size:72px; color:var(--white); line-height:1; }
.number-label { font-family:var(--font-cond); font-size:12px; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,0.7); margin-top:6px; }

/* ── TEAM / CTA ── */
#founder { background:var(--dark); padding:100px 60px; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.founder-content .section-title { margin-bottom:24px; }
.founder-content p { font-size:16.5px; font-weight:300; color:var(--white); line-height:1.9; margin-bottom:18px; }
.founder-quote { margin-top:36px; padding-left:24px; border-left:3px solid var(--red); }
.founder-quote blockquote { font-size:17px; font-style:italic; font-weight:300; color:var(--white); line-height:1.75; }
.founder-quote cite { display:block; margin-top:12px; font-family:var(--font-cond); font-size:12px; letter-spacing:3px; text-transform:uppercase; color:var(--red); font-style:normal; }

.founder-visual { position:relative; height:420px; border:1px solid rgba(204,0,0,0.15); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.founder-visual-bg { position:absolute; inset:0; background:repeating-linear-gradient(-45deg,transparent,transparent 20px,rgba(204,0,0,0.02) 20px,rgba(204,0,0,0.02) 21px); }
.founder-initials { font-family:var(--font-display); font-size:160px; color:rgba(204,0,0,0.18); line-height:1; position:relative; z-index:1; letter-spacing:-4px; }
.founder-name-badge { position:absolute; bottom:24px; left:24px; right:24px; background:rgba(8,8,8,0.9); border:1px solid rgba(204,0,0,0.2); padding:16px 20px; }
.founder-name { font-family:var(--font-display); font-size:24px; color:var(--white); letter-spacing:2px; }
.founder-role { font-family:var(--font-cond); font-size:11px; letter-spacing:3px; color:var(--red); text-transform:uppercase; margin-top:4px; }

/* ── RESPONSIVE ── */
@media (max-width: 900px) {
  #story { padding: 60px 24px; }
  .story-intro p { max-width: 560px; }
  .tl-item { grid-template-columns: 80px 1fr; gap: 24px; }
  .tl-year { font-size: 36px; }
  .tl-text { line-height: 1.75; }
  #values { padding: 60px 24px; }
  .values-grid { grid-template-columns: 1fr; }
  .value-icon { width: 48px; height: 48px; }
  .value-icon svg { width: 28px; height: 28px; }
  #numbers { grid-template-columns: 1fr 1fr; padding: 60px 24px; gap: 30px; }
  #founder { grid-template-columns: 1fr; padding: 60px 24px; gap: 50px; }
  .founder-visual { height: 280px; }
  .founder-initials { font-size: 100px; }
}