:root{
  --navy:#0E1B2C; --orange:#D2491B; --cream:#F0E6CE; --gold:#E0A93B; --teal:#1F6F6B;
  --ink:#0E1B2C; --muted:#5b6b7d; --paper:#F0E6CE;
  --navy-soft:#9DB0C4; --pt:#8b9bad; --pt-dim:#6f7f91; --badge:#ffffff;
  --maxw:1000px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'Space Grotesk',system-ui,sans-serif; line-height:1.5;
  background-image:radial-gradient(rgba(14,27,44,0.035) 1px, transparent 1px);
  background-size:4px 4px;
  -webkit-font-smoothing:antialiased;
}
main{max-width:var(--maxw); margin:0 auto; padding:0 22px;}
a{color:var(--orange); text-decoration:none;}
a:hover{text-decoration:underline;}
.pixel{font-family:'Press Start 2P',monospace; font-size:.6rem; letter-spacing:1px;}

.section-h{
  font-family:'Oswald',sans-serif; font-weight:700; text-transform:uppercase;
  letter-spacing:1px; font-size:1.15rem; color:var(--navy);
  margin:0; display:flex; align-items:center; gap:10px;
}
.section-h .pixel{color:var(--orange); font-size:.7rem;}

/* ===== HERO (horizontal band) ===== */
.hero{
  display:flex; gap:44px; align-items:center; justify-content:center;
  padding:56px 0 48px;
}

/* ===== CARD ===== */
.card{
  width:330px; flex:none; cursor:pointer;
  perspective:1400px; outline:none;
  --tiltX:0deg; --tiltY:0deg;
}
.card:focus-visible{box-shadow:0 0 0 3px var(--gold); border-radius:16px;}
.card__inner{
  position:relative; width:100%; aspect-ratio:5/7;
  transform-style:preserve-3d;
  transform:rotateX(var(--tiltX)) rotateY(var(--tiltY));
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}
.card.is-flipped .card__inner{transform:rotateY(180deg);}
.card__face{
  position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden;
  border-radius:14px; overflow:hidden;
  background:var(--cream);
  box-shadow:0 0 0 3px var(--navy), 0 0 0 7px var(--gold), 0 18px 44px rgba(0,0,0,.35);
}

/* front */
.card__front{display:flex; flex-direction:column;}
.card__id{
  display:flex; gap:14px; align-items:center;
  padding:16px 16px 13px; border-bottom:3px solid var(--navy);
}
.card__idtext{flex:1; min-width:0;}
.card__photo{
  width:74px; height:90px; flex:none; display:block;
  object-fit:cover; object-position:50% 16%;
  border:2px solid var(--navy); background:#cdbf9f;
}
.card__name{
  font-family:'Anton',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:1.9rem; line-height:1.0; letter-spacing:.6px; margin:0; color:var(--navy);
}
.card__loc{
  font-family:'Oswald',sans-serif; font-weight:700; font-size:.66rem; letter-spacing:1px;
  text-transform:uppercase; color:var(--orange); margin:7px 0 0;
}
.card__diamond{color:var(--gold);}
.card__body{padding:13px 16px 10px; flex:1; display:flex; flex-direction:column; gap:11px;}
.card__label{
  font-family:'Oswald',sans-serif; font-weight:700; font-size:.58rem; letter-spacing:1.5px;
  text-transform:uppercase; color:var(--teal); margin:0 0 3px;
}
.card__row{font-family:'Space Grotesk',sans-serif; font-size:.74rem; color:#2c3a48; line-height:1.3; margin:0;}
.card__row strong{font-weight:600; color:var(--navy);}
.card__sub{color:var(--muted);}
.card__footer{
  margin-top:auto; background:var(--navy); color:var(--navy-soft);
  padding:8px 13px; text-align:center;
}
.card__footer .pixel{color:var(--navy-soft);}

/* back */
.card__back{
  transform:rotateY(180deg);
  display:flex; flex-direction:column;
  padding:16px 17px; background:var(--navy); color:var(--cream);
  box-shadow:0 0 0 3px var(--cream), 0 0 0 7px var(--gold), 0 18px 44px rgba(0,0,0,.35);
}
.card__bh{
  font-family:'Oswald',sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:2px;
  font-size:.82rem; color:var(--gold); margin:0 0 6px; display:flex; align-items:center; gap:8px;
}
.card__bh .pixel{color:var(--orange);}
.ladder{display:flex; flex-direction:column; flex:1; justify-content:center;}
.job{
  display:grid; grid-template-columns:42px 1fr; gap:10px;
  padding:6px 0; border-bottom:1px dotted rgba(240,230,206,.24);
}
.job:last-child{border-bottom:none;}
.job__yr{font-family:'Oswald',sans-serif; font-weight:700; font-size:.66rem; color:var(--gold); letter-spacing:.3px; padding-top:1px;}
.job__role{font-family:'Oswald',sans-serif; font-weight:600; font-size:.76rem; text-transform:uppercase; letter-spacing:.3px; color:var(--cream); line-height:1.12;}
.job__org{display:block; font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:.6rem; color:var(--navy-soft); text-transform:none; letter-spacing:0; margin-top:2px;}
.job--pt .job__yr{font-size:.56rem; color:var(--pt-dim);}
.job--pt .job__role{font-size:.62rem; color:var(--pt); letter-spacing:.2px;}
.job--pt .job__org{font-size:.54rem; color:var(--pt-dim);}

@media (prefers-reduced-motion:reduce){
  .card__inner{transition:none;}
}

/* ===== CONTENT (right column) ===== */
.content{flex:1 1 auto; max-width:520px; min-width:0; display:flex; flex-direction:column; gap:14px;}

.venture{
  display:flex; align-items:center; gap:14px;
  background:var(--navy); color:var(--cream); border-radius:11px; padding:13px 15px;
  transition:transform .18s ease, box-shadow .18s ease;
}
.venture:hover{transform:translateY(-3px); box-shadow:0 12px 26px rgba(0,0,0,.25); text-decoration:none;}
.venture__badge{
  width:50px; height:50px; flex:none; border-radius:11px; background:var(--badge);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
  box-shadow:0 1px 4px rgba(0,0,0,.25);
}
.venture__badge img{width:100%; height:100%; object-fit:cover; display:block;}
.venture__badge img.venture__logo2mb{width:78%; height:auto; object-fit:contain;}
.venture__text{display:flex; flex-direction:column; gap:2px; min-width:0;}
.venture__name{font-family:'Anton',sans-serif; text-transform:uppercase; font-size:1.25rem; line-height:1; letter-spacing:.3px;}
.venture__desc{font-size:.84rem; color:#C9D4E0;}

.content__sub{
  font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:1.5px;
  font-size:.72rem; color:var(--muted); margin:4px 0 -4px;
}
.hobby{display:grid; grid-template-columns:1fr 1fr; gap:11px;}
.hobby__item{
  display:flex; flex-direction:column; gap:3px;
  background:rgba(14,27,44,0.05); border:1px solid rgba(14,27,44,0.16); border-radius:9px;
  padding:11px 13px; color:var(--navy);
}
.hobby__item:hover{border-color:var(--teal); text-decoration:none;}
.hobby__name{font-family:'Oswald',sans-serif; font-weight:700; font-size:.95rem; color:var(--teal);}
.hobby__desc{font-size:.78rem; color:var(--muted); line-height:1.3;}

.content__links{display:flex; gap:10px; flex-wrap:wrap; margin-top:4px;}
.content__links a{
  font-family:'Oswald',sans-serif; font-weight:600; font-size:.74rem; letter-spacing:1px; text-transform:uppercase;
  color:var(--navy); border:1px solid var(--gold); border-radius:20px; padding:8px 16px;
}
.content__links a:hover{background:var(--gold); color:var(--navy); text-decoration:none;}

/* ===== FOOTER ===== */
.footer{
  max-width:var(--maxw); margin:20px auto 0; padding:30px 22px 50px;
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  border-top:2px solid rgba(14,27,44,0.12);
}
.footer__mark{
  font-family:'Press Start 2P',monospace; font-size:.85rem;
  color:var(--cream); background:var(--navy); padding:8px 10px; border-radius:6px;
  box-shadow:3px 3px 0 var(--orange);
}
.footer__links{display:flex; gap:16px; flex-wrap:wrap;}
.footer__links a{font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:1px; font-size:.78rem; color:var(--navy);}
.footer__links a:hover{color:var(--orange);}
.footer__loc{margin-left:auto; font-size:.8rem; color:var(--muted);}

/* ===== RESPONSIVE ===== */
@media (max-width:760px){
  .hero{flex-direction:column; gap:30px; padding:36px 0 28px;}
  .card{width:320px; max-width:88vw;}
  .content{max-width:none; width:100%;}
}
@media (max-width:430px){
  .hobby{grid-template-columns:1fr;}
  .footer__loc{margin-left:0; width:100%;}
}