*{margin:0;padding:0;box-sizing:border-box}body{font-family:Helvetica Neue,Arial,sans-serif;background-color:#fff;color:#111;display:flex;flex-direction:column}header{background-color:#ff0;display:flex;align-items:center;justify-content:space-between;padding:1.2rem 3rem;border-bottom:1px solid #e5e5e5}header>img{height:62px}nav{display:flex;gap:2rem}nav button{background:none;border:none;font-family:Georgia,Times New Roman,serif;font-size:1.35rem;letter-spacing:1px;text-transform:uppercase;cursor:pointer;color:#111;position:relative;padding-bottom:4px}nav button:after{content:"";position:absolute;left:0;bottom:0;width:0;height:3px;background-color:#000;transition:width .3s ease}nav button:hover:after,nav button.active:after{width:100%;background-color:#fc0}header div{display:flex;align-items:center;gap:.6rem}header div img{width:36px;height:36px;border-radius:50%}header div p{font-size:.9rem;font-weight:500}main{flex:1;padding:3rem;background-color:#fafafa;display:flex;flex-direction:column;position:relative}main:before{content:"";position:absolute;left:0;top:0;height:100%;width:6px;background-color:#fc0}.category-buttons{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}.category-buttons button{padding:.5rem 1rem;background-color:#111;color:#fff;border:none;border-radius:4px;cursor:pointer;font-weight:700;transition:background-color .3s ease}.category-buttons button.active,.category-buttons button:hover{background-color:#fc0;color:#111}.cards-container{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center}.card{background-color:#fff;border:1px solid #e5e5e5;border-radius:8px;overflow:hidden;box-shadow:0 4px 12px #00000014;width:300px;display:flex;flex-direction:column;transition:transform .3s ease,box-shadow .3s ease;cursor:pointer}.card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #0000001f}.card img{width:100%;height:180px;object-fit:cover}.card h3{font-family:Georgia,serif;font-size:1.4rem;font-weight:700;margin:1rem;color:#111}.card p{font-size:.95rem;margin:0 1rem 1rem;color:#333;line-height:1.4}.card button{margin:0 1rem 1rem;padding:.6rem 1rem;background-color:#fc0;border:none;border-radius:4px;font-weight:700;font-family:Helvetica Neue,Arial,sans-serif;cursor:pointer;transition:background-color .3s ease}.card button:hover{background-color:#e6b800}footer{background-color:#111;color:#fff;padding:1.5rem 3rem;text-align:center;font-size:.85rem;letter-spacing:.5px;text-transform:uppercase}footer:before{content:"";display:block;width:60px;height:4px;background-color:#fc0;margin:0 auto .75rem}.hero-title{font-family:Georgia,serif;font-size:3rem;font-weight:700;line-height:1.1}.hero-accent{border-left:6px solid #ffcc00;padding-left:1rem}@media(max-width:768px){header{flex-direction:column;gap:1rem}nav{justify-content:center;gap:1rem}main{padding:2rem}.card{width:100%;max-width:350px}}