:root{--primary-color:#007bff;--secondary-color:#ffffff;--shadow-color:rgba(0, 0, 0, 0.1);--hover-scale:1.05;--transition-speed:0.3s;--grid-gap:20px;--panel-border-radius:15px}.metro-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--grid-gap);padding:var(--grid-gap);box-sizing:border-box;background-color:#f9f9f9}.panel{background-color:var(--secondary-color);border-radius:var(--panel-border-radius);box-shadow:0 4px 6px var(--shadow-color);overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:#333;transition:transform var(--transition-speed) ease,box-shadow var(--transition-speed) ease}.panel:hover{transform:scale(var(--hover-scale));box-shadow:0 8px 16px var(--shadow-color)}.panel-content{padding:20px;flex-grow:1}.panel h3{margin-top:0;margin-bottom:10px;font-size:1.5em;color:var(--primary-color)}.panel p{margin:0;font-size:1em;line-height:1.5}.large-panel{grid-column:span 2}.medium-panel{grid-column:span 1}.small-panel{grid-column:span 1}.panel.video-panel{position:relative;padding:0}.event-video{width:100%;height:auto;display:block}@media (max-width:1200px){.large-panel{grid-column:span 1}}@media (max-width:768px){.metro-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px;padding:15px}.panel-content{padding:15px}.panel h3{font-size:1.3em}.panel p{font-size:.95em}}#sdg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--grid-gap);padding:var(--grid-gap);box-sizing:border-box;background-color:#fff}.sdg-cell,.wide-cell{aspect-ratio:1;background-size:contain;background-position:center;background-repeat:no-repeat;cursor:pointer;transition:transform var(--transition-speed) ease,box-shadow var(--transition-speed) ease,opacity var(--transition-speed) ease;opacity:0;transform:scale(.5);animation:fadeInScale 0.5s ease forwards;position:relative;overflow:hidden;border-radius:var(--panel-border-radius)}.sdg-cell::before,.wide-cell::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(255,255,255,.1);opacity:0;transition:opacity var(--transition-speed) ease}.sdg-cell:hover,.wide-cell:hover{transform:scale(1.05);box-shadow:0 5px 15px var(--shadow-color);z-index:1}.sdg-cell:hover::before,.wide-cell:hover::before{opacity:1}.wide-cell{grid-column:span 3;aspect-ratio:3 / 1}.wide-cell img{max-width:100%;height:auto}@keyframes fadeInScale{to{opacity:1;transform:scale(1)}}#sdg-nav{position:fixed;bottom:0;left:0;width:100%;height:100px;display:flex;justify-content:flex-start;align-items:center;background-color:rgba(255,255,255,.95);padding:0 20px;box-sizing:border-box;z-index:1000;overflow-x:auto;overflow-y:hidden;white-space:nowrap;-webkit-overflow-scrolling:touch;box-shadow:0 -2px 5px rgba(0,0,0,.1)}.sdg-nav-item{flex:0 0 auto;width:80px;height:80px;background-size:contain;background-position:center;background-repeat:no-repeat;cursor:pointer;margin:0 10px;transition:transform var(--transition-speed) ease,box-shadow var(--transition-speed) ease}.sdg-nav-item.selected{transform:scale(1.2);box-shadow:0 0 15px rgba(0,0,0,.3)}#sdg-nav::-webkit-scrollbar{display:none}#sdg-nav{-ms-overflow-style:none;scrollbar-width:none}@media (max-width:768px){#sdg-nav{height:70px;padding:0 15px}.sdg-nav-item{width:60px;height:60px;margin:0 7px}}body{padding-bottom:120px;font-family:Arial,sans-serif;background-color:#f0f2f5}@media (max-width:768px){body{padding-bottom:90px}}@media (hover:none) and (pointer:coarse){.sdg-cell,.sdg-nav-item,.wide-cell{min-width:44px;min-height:44px}}.sdg-cell:focus,.sdg-nav-item:focus,.wide-cell:focus,.panel:focus{outline:2px solid var(--primary-color);outline-offset:2px}#sdg-grid,#sdg-nav{background-color:#fff}.panel,.sdg-cell,.sdg-nav-item,.wide-cell{transition:transform var(--transition-speed) ease,box-shadow var(--transition-speed) ease,opacity var(--transition-speed) ease}.sdg-nav-item.selected{z-index:1}.animate-line-container{padding-top:100vh;padding-bottom:100vh;display:flex;justify-content:center}.animate-line{width:90px;height:1px;background-color:#a9a145;transform:scaleX(0);transform-origin:left;opacity:0;transition:transform 0.5s ease,opacity 0.5s ease}.inview{transform:scaleX(1);opacity:1}.socialshare{position:relative;z-index:9999}.share-container{position:relative;display:inline-block}.share-button{background-color:#fff;color:#333;border:1px solid #ddd;border-radius:25px;padding:8px 16px;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 6px rgba(0,0,0,.2);z-index:9999;transition:transform 0.2s ease}.share-button img{width:16px;height:16px;margin-right:8px}.share-menu{display:none;position:absolute;top:110%;left:0;background-color:#fff;box-shadow:0 4px 6px rgba(0,0,0,.1);border-radius:8px;padding:8px;width:250px;z-index:10000;opacity:0;transform:scale(.9);transition:opacity 0.3s ease,transform 0.3s ease}.share-menu.active{display:block;opacity:1;transform:scale(1)}.share-menu-item{display:flex;align-items:center;padding:6px 8px;border-radius:5px;cursor:pointer;transition:background-color 0.2s;line-height:1.2}.share-menu-item:hover{background-color:#f2f2f2}.share-menu-item img{width:20px;height:20px;margin-right:10px}.share-menu-item span{font-size:14px;color:#333;line-height:1.2}@media (max-width:768px){.socialshare .share-button{position:fixed;bottom:16px;right:16px;z-index:10001;border-radius:50%;padding:0;width:56px;height:56px;justify-content:center;box-shadow:0 4px 8px rgba(0,0,0,.2)}.socialshare .share-button img{margin:0;width:24px;height:24px}.socialshare .share-button span{display:none}.socialshare .share-menu{bottom:80px;top:auto;right:16px;left:auto;z-index:10002}}