#logofolio-container{--bg-color:transparent;--card-bg:#161616;--text-main:#e5e5e5;--text-muted:#666;--border-color:#ffffff0d;--accent-color:#d51d66;background-color:var(--bg-color);color:var(--text-main);min-height:100vh;font-family:Inter,Helvetica,Arial,sans-serif}#logofolio-container .font-russo{font-family:var(--font-russo-one), sans-serif}#logofolio-container .font-sono{font-family:var(--font-sono), monospace}#logofolio-container .logo-card{background:var(--card-bg);border:1px solid var(--border-color);aspect-ratio:1;cursor:default;flex-direction:column;justify-content:center;align-items:center;transition:all .4s cubic-bezier(.165,.84,.44,1);display:flex;position:relative;overflow:hidden}#logofolio-container .logo-card:hover{border-color:var(--accent-color);background:#fff;transform:translateY(-4px);box-shadow:0 20px 40px #00000080}#logofolio-container .logo-img{object-fit:contain;filter:grayscale()brightness(1.5)opacity(.7);z-index:5;max-width:50%;max-height:50%;transition:all .4s cubic-bezier(.25,.46,.45,.94)}#logofolio-container .logo-card:hover .logo-img{filter:grayscale(0%)brightness()opacity();transform:translateY(-25px)}#logofolio-container .motion-card{background:var(--card-bg);border:1px solid var(--border-color);aspect-ratio:1;transition:all .4s;position:relative;overflow:hidden}#logofolio-container .motion-card:hover{border-color:var(--accent-color);z-index:10;background:#000;transform:scale(1.02)}#logofolio-container .motion-video{object-fit:cover;opacity:.6;filter:grayscale();width:100%;height:100%;transition:opacity .4s}#logofolio-container .motion-card:hover .motion-video{opacity:1;filter:grayscale(0%)}#logofolio-container .logo-info{text-align:center;opacity:0;z-index:20;pointer-events:none;width:100%;padding:1.5rem;transition:all .4s;position:absolute;bottom:0;left:0;transform:translateY(20px)}#logofolio-container .logo-card:hover .logo-info{opacity:1;background:linear-gradient(#0000,#fff 40%);padding-bottom:2rem;transform:translateY(0)}#logofolio-container .logo-card:hover .logo-info h4{color:#000;transform:translateY(0)}#logofolio-container .logo-card:hover .logo-info p{color:var(--accent-color);font-weight:700}#logofolio-container .motion-card .logo-info{background:linear-gradient(#0000,#000000e6)}#logofolio-container .motion-card:hover .logo-info{opacity:1;transform:translateY(0)}#logofolio-container .folio-header{border-bottom:1px solid var(--border-color);margin-bottom:4rem;padding-bottom:2rem}#logofolio-container .footer-cta-text{font-family:var(--font-russo-one), sans-serif;color:var(--text-main);transition:color .3s}#logofolio-container .footer-cta-text:hover{color:var(--accent-color)}
