body{margin:0;font-family:Arial,sans-serif;background:#f9f9f9;color:#333}header{background:#1a1a1a;color:#fff;padding:20px;text-align:center}header h1{margin:0;font-size:2rem}nav{background:#06c;padding:10px;text-align:center;flex-wrap:wrap}nav a{color:#fff;text-decoration:none;margin:8px 15px;font-weight:700;display:inline-block}nav a:hover{text-decoration:underline}.container{max-width:1100px;margin:auto;padding:30px 20px}.box-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-top:20px}.box{background:#fff;border-radius:12px;padding:20px;box-shadow:0 4px 10px #0000001a;transition:transform .2s;text-align:left}.box:hover{transform:translateY(-5px)}footer{background:#1a1a1a;color:#fff;text-align:center;padding:15px;margin-top:40px;font-size:.9rem}@media (max-width: 768px){header h1{font-size:1.6rem}nav a{display:block;margin:10px 0}.container{padding:20px 15px}.box{padding:15px}}@media (max-width: 480px){header h1{font-size:1.4rem}nav{padding:8px}nav a{font-size:.9rem}.box{padding:12px}}