*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#eef4ed;color:#333;line-height:1.5;transition:background .3s ease,color .3s ease}body.dark{background-color:#0b2545;color:#eee}body.dark header{background-color:#222}body.dark nav{background-color:#333;color:#eee}body.dark #timeline article{background:#1e1e1e;color:#eee;box-shadow:0 4px 8px #ffffff14}body.dark #timeline h3{color:#4db8ff}header{display:flex;align-items:center;justify-content:space-between;background-color:#134074;color:#fff;padding:1rem 2rem}header img{height:50px;margin-right:10px}header .app-title{font-size:1.5rem;font-weight:700;color:#fff;flex:1}header button{background:#0b2545;color:#fff;border:none;padding:.6rem 1rem;border-radius:6px;cursor:pointer;font-weight:700;transition:background .3s ease}header button:hover,header button:focus-visible{background:#13315c;outline:2px solid #FFD60A;outline-offset:3px}nav{background-color:#8da9c4;padding:1rem;text-align:center;font-weight:700;color:#333}#timeline{display:grid;gap:2rem;padding:2rem}#timeline article{background:#fff;padding:1rem;border-radius:10px;box-shadow:0 4px 8px #00000014;display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:transform .2s ease,background .3s ease,color .3s ease}#timeline article:hover,#timeline article:focus-visible{transform:translateY(-4px);outline:3px solid #FFD60A;outline-offset:3px}#timeline figure{margin:0;width:100%;height:200px;overflow:hidden;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#f4f4f4}#timeline figure img{width:100%;height:100%;object-fit:cover}#timeline h3{margin:1rem 0 .5rem;font-size:1.25rem;color:#134074}#timeline p{text-align:center;color:#555}[aria-current=true]{border:2px solid #FFD60A;border-radius:8px;box-shadow:0 0 0 3px #ffd60a80}.modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;padding:1rem;z-index:1000}.modal-content{background:#fff;padding:2rem;border-radius:10px;max-width:600px;width:100%;color:#333;position:relative;text-align:center;animation:fadeIn .3s ease-in-out}body.dark .modal-content{background:#1e1e1e;color:#eee}.modal-close{position:absolute;top:10px;right:14px;font-size:1.5rem;font-weight:700;color:#111;cursor:pointer}.modal-close:hover,.modal-close:focus-visible{color:#333;outline:2px solid #FFD60A;outline-offset:3px}.modal-content img{max-width:100%;height:auto;border-radius:8px;margin-bottom:1rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 767px){header{flex-direction:column;align-items:flex-start}header .app-title{margin:.5rem 0}#timeline{grid-template-columns:1fr}}@media (min-width: 768px) and (max-width: 1023px){#timeline{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){#timeline{grid-template-columns:repeat(3,1fr)}}