@tailwind base;@tailwind components;@tailwind utilities;.vertical-text{writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg)}.grain-overlay{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:50;opacity:.15;background-image:url(https://lh3.googleusercontent.com/aida-public/AB6AXuCezbAE4ZDFFVW0SNJV8f3-05A3qZbok27X3ByE3d9fptsUIwgZ_Gf9-hrXF8OaaSlouccrUtRBDdoBSzoDrix7m3ieIa-Pzx7IQEoFreLxFMtfkApv_tCN1Jr0EvCiwIovNBiqDxvSDrZO74eCxfjVxZRi-spFRo19Z0t2VR6NvfimXCEwfG0B1zapYaI2c9DP-axPTyg4-YP9qoZk0jiHkk2KwI_YoCK5k2qhsLXRaJcLvbPLKOjtX93HM8dCfZc4NLmO3Sbv0f4)}.panels-container{display:flex;width:100vw;height:100vh;overflow:hidden}.panel-wrapper{position:relative;flex:1;transition:flex .8s cubic-bezier(.25,1,.5,1);overflow:hidden;border-right:1px solid rgba(255,255,255,.1)}.panel-wrapper:last-child{border-right:none}.panels-container:not(:has(.panel-trigger:checked)) .panel-wrapper:hover{flex:3}.panels-container:not(:has(.panel-trigger:checked)) .panel-wrapper:not(:hover){flex:.8}.panels-container:has(.panel-trigger:checked) .panel-wrapper{flex:0 0 60px}.panels-container:has(.panel-trigger:checked) .panel-wrapper:has(.panel-trigger:checked){flex:1 1 auto}.panel-visual{width:100%;height:100%;position:relative;cursor:pointer;filter:grayscale(100%) brightness(.8) sepia(20%);transition:filter .8s ease,transform 1s ease}.panels-container:not(:has(.panel-trigger:checked)) .panel-wrapper:hover .panel-visual{filter:grayscale(0%) brightness(100%) sepia(0%)}.panel-wrapper:has(.panel-trigger:checked) .panel-visual{filter:grayscale(0%) brightness(100%) sepia(0%);cursor:default}.panel-wrapper:has(.panel-trigger:checked) .panel-vertical-title{opacity:0;pointer-events:none;transition:opacity .5s ease}.panels-container:not(:has(.panel-trigger:checked)) .panel-wrapper:hover .panel-vertical-title{opacity:1}.panels-container:not(:has(.panel-trigger:checked)) .panel-wrapper:hover .click-hint{opacity:1;transform:translateY(0)}.panel-content-detail{opacity:0;pointer-events:none;transform:translateY(20px);transition:all .6s ease .2s}.panel-wrapper:has(.panel-trigger:checked) .panel-content-detail{opacity:1;pointer-events:auto;transform:translateY(0)}.experience-video{object-fit:cover;background-color:transparent}.panels-container:not(:has(.panel-trigger:checked)) .panel-wrapper:hover .experience-video,.panel-wrapper:has(.panel-trigger:checked) .experience-video{object-fit:contain;background-color:#121212}.dynamic-title{transition:opacity .3s ease}.panel-trigger{position:absolute;opacity:0;pointer-events:none}.panel-entrance-1{animation-delay:.1s;opacity:0}.panel-entrance-2{animation-delay:.2s;opacity:0}.panel-entrance-3{animation-delay:.3s;opacity:0}.panel-entrance-4{animation-delay:.4s;opacity:0}.panel-entrance-5{animation-delay:.5s;opacity:0}.custom-scrollbar::-webkit-scrollbar{width:6px}.custom-scrollbar::-webkit-scrollbar-track{background:#ffffff0d;border-radius:4px}.custom-scrollbar::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:#fff6}.image-blend-mask{-webkit-mask-image:radial-gradient(ellipse at center,black 40%,transparent 95%);mask-image:radial-gradient(ellipse at center,black 40%,transparent 95%);transition:all .5s ease}.group:hover .image-blend-mask{-webkit-mask-image:radial-gradient(ellipse at center,black 60%,transparent 100%);mask-image:radial-gradient(ellipse at center,black 60%,transparent 100%)}@media(max-width:768px){.panels-container{flex-direction:column}.panel-wrapper{border-right:none;border-bottom:1px solid rgba(255,255,255,.1)}.panel-wrapper:last-child{border-bottom:none}.panels-container:has(.panel-trigger:checked) .panel-wrapper{flex:0 0 60px}.vertical-text{writing-mode:horizontal-tb;transform:rotate(0)}}
