.PageComponentClass.ReferencesComponentClass{min-height:100vh;display:flex;flex-direction:column;background-image:url(/assets/references/ref_back.png);background-size:cover;background-position:50%;background-repeat:no-repeat;background-attachment:fixed;padding:60px 0}.PageComponentClass.ReferencesComponentClass .container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px;position:relative;z-index:1}.PageComponentClass.ReferencesComponentClass .section-title{font-size:2.5em;color:#333;margin-bottom:40px;text-align:center;text-shadow:1px 1px 2px rgba(255,255,255,.7)}.PageComponentClass.ReferencesComponentClass .references-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:30px;justify-items:center}.PageComponentClass.ReferencesComponentClass .reference-item{background-color:rgba(255,255,255,.8);border-radius:8px;padding:20px;display:flex;justify-content:center;align-items:center;box-shadow:0 4px 8px rgba(0,0,0,.1);transition:transform .3s ease,box-shadow .3s ease;cursor:pointer;width:100%;max-width:250px}.PageComponentClass.ReferencesComponentClass .reference-item img{width:100%;height:auto;object-fit:contain}.PageComponentClass.ReferencesComponentClass .reference-item:hover{transform:translateY(-5px);box-shadow:0 6px 12px rgba(0,0,0,.15)}.animate-on-scroll{opacity:0;transform:translateY(20px);transition:opacity .6s ease-out,transform .6s ease-out}.animate-on-scroll.visible{opacity:1;transform:translateY(0)}@media (max-width:1200px){.PageComponentClass.ReferencesComponentClass .references-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:25px}}@media (max-width:992px){.PageComponentClass.ReferencesComponentClass{padding:50px 0}.PageComponentClass.ReferencesComponentClass .section-title{font-size:2.2em;margin-bottom:35px}.PageComponentClass.ReferencesComponentClass .references-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:20px}.PageComponentClass.ReferencesComponentClass .reference-item{padding:18px;max-width:220px}}@media (max-width:768px){.PageComponentClass.ReferencesComponentClass{padding:40px 0}.PageComponentClass.ReferencesComponentClass .section-title{font-size:2em;margin-bottom:30px}.PageComponentClass.ReferencesComponentClass .references-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:15px}.PageComponentClass.ReferencesComponentClass .reference-item{padding:15px;max-width:180px}}@media (max-width:576px){.PageComponentClass.ReferencesComponentClass{padding:30px 0}.PageComponentClass.ReferencesComponentClass .section-title{font-size:1.8em;margin-bottom:25px}.PageComponentClass.ReferencesComponentClass .references-grid{grid-template-columns:repeat(2,1fr);gap:12px}.PageComponentClass.ReferencesComponentClass .reference-item{padding:12px;max-width:140px}}@media (max-width:360px){.PageComponentClass.ReferencesComponentClass .references-grid{grid-template-columns:1fr;gap:15px}.PageComponentClass.ReferencesComponentClass .reference-item{max-width:200px}}.reference-img-wrapper{position:relative;display:flex;align-items:center;justify-content:center;width:150px;height:150px;overflow:hidden;border-radius:12px;background:#f7f7f7;box-shadow:0 2px 8px rgba(0,0,0,.08);transition:box-shadow .3s}.reference-img-wrapper:hover{box-shadow:0 6px 18px rgba(0,0,0,.18)}.reference-overlay{position:absolute;inset:0;background:linear-gradient(120deg,rgba(30,30,30,.85) 60%,rgba(0,0,0,.5));opacity:0;display:flex;align-items:center;justify-content:center;transition:opacity .25s;border-radius:12px;pointer-events:none}.reference-img-wrapper:hover .reference-overlay{opacity:1;pointer-events:auto}.reference-hover-text{color:#fff;font-size:1.05rem;font-weight:600;text-align:center;padding:10px 18px;border-radius:8px;background:rgba(0,0,0,.25);box-shadow:0 2px 8px rgba(0,0,0,.1);letter-spacing:.5px;text-shadow:0 1px 4px rgba(0,0,0,.18)}