/* Classie homepage — round 4 styles: 3 C's, SecOps, founder letter. */

/* shared integration tile */
.io-tile{display:flex;align-items:center;gap:10px;background:var(--bg-base);border:1px solid var(--border-default);
  border-radius:10px;padding:9px 13px 9px 9px;white-space:nowrap;}
.io-mono{width:30px;height:30px;border-radius:7px;flex:none;display:flex;align-items:center;justify-content:center;
  font-family:var(--f-mono);font-weight:600;font-size:11px;color:var(--tint);letter-spacing:-.02em;
  background:var(--bg-raised);border:1px solid var(--border-default);}
.io-name{font-size:13.5px;color:var(--fg-secondary);font-weight:500;}
/* ─── 3 C's ─── */
.ccs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px;}
.ccs-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:16px;padding:28px;
  transition:border-color .2s var(--ease-out),transform .2s var(--ease-out);}
.ccs-card:hover{border-color:var(--brand-primary);transform:translateY(-3px);}
.ccs-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;}
.ccs-ico{width:44px;height:44px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  background:var(--brand-primary-10);border:1px solid var(--brand-primary-16);color:var(--brand-primary);}
.ccs-letter{font-family:var(--f-display);font-weight:800;font-size:42px;line-height:1;color:var(--bg-raised-2);letter-spacing:-.04em;}
.ccs-h{font-family:var(--f-display);font-weight:600;font-size:21px;color:var(--fg-primary);letter-spacing:-.01em;margin:0;}
.ccs-b{font-size:15px;line-height:1.55;color:var(--fg-tertiary);margin:11px 0 0;}
@media(max-width:760px){.ccs-grid{grid-template-columns:1fr;}}

/* ─── SecOps pipeline ─── */
.so{width:100%;max-width:860px;margin:0 auto;display:flex;flex-direction:column;align-items:center;}
.so-label{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-tertiary);margin-bottom:14px;}
.so-srcrow{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;}
.so-conns{display:grid;width:60%;height:30px;}
.so-conns.src{grid-template-columns:repeat(4,1fr);}
.so-conns.dest{grid-template-columns:repeat(3,1fr);}
.so-conns i{justify-self:center;width:1px;background:repeating-linear-gradient(var(--border-strong) 0 3px,transparent 3px 7px);}
.so-core{width:100%;background:linear-gradient(180deg,var(--brand-primary-16),rgba(0,173,255,.04));
  border:1px solid var(--brand-primary);border-radius:16px;padding:16px 20px;display:flex;align-items:center;gap:18px;
  flex-wrap:wrap;justify-content:space-between;box-shadow:0 12px 40px -14px rgba(0,173,255,.4);}
.so-core-brand{display:flex;align-items:center;gap:9px;}
.so-core-brand span{font-family:var(--f-display);font-weight:700;font-size:16px;color:var(--fg-primary);}
.so-core-mid{font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;color:var(--brand-primary-hover);text-transform:uppercase;}
.so-core-out{display:flex;gap:9px;flex-wrap:wrap;}
.so-pill{font-family:var(--f-mono);font-size:11px;color:var(--fg-secondary);background:var(--bg-base);
  border:1px solid var(--border-default);border-radius:7px;padding:6px 11px;display:flex;align-items:center;gap:6px;}
.so-pill.alert{color:var(--danger);border-color:rgba(244,63,94,.35);background:rgba(244,63,94,.08);}
.so-dests{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;width:100%;}
.so-group{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px;}
.so-cat{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-primary-hover);margin-bottom:2px;}
.so-group .io-tile{background:var(--bg-base);}
@media(max-width:680px){.so-dests{grid-template-columns:1fr;}.so-conns.dest{grid-template-columns:1fr;}.so-conns.dest i:nth-child(n+2){display:none;}}

/* ─── founder letter ─── */
.founder{position:relative;}
.founder-card{max-width:840px;margin:0 auto;background:var(--bg-surface);border:1px solid var(--border-default);
  border-radius:22px;padding:48px;position:relative;overflow:hidden;}
.founder-card::before{content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 80% at 100% 0%,rgba(0,173,255,.08),transparent 60%);}
.founder-letter{margin:20px 0 0;position:relative;}
.founder-letter p{font-family:var(--f-display);font-weight:500;font-size:clamp(20px,2.4vw,27px);line-height:1.42;
  letter-spacing:-.015em;color:var(--fg-primary);margin:0 0 18px;}
.founder-letter strong{color:var(--brand-primary);font-weight:600;}
.founder-sign{display:flex;align-items:center;gap:16px;margin-top:30px;position:relative;}
.founder-av{width:52px;height:52px;flex:none;font-size:17px;margin-bottom:0;}
.founder-name{font-family:var(--f-display);font-weight:600;font-size:18px;color:var(--fg-primary);}
.founder-role{font-family:var(--f-mono);font-size:11.5px;color:var(--fg-tertiary);margin-top:4px;}
@media(max-width:560px){.founder-card{padding:30px;}}