:root{ --color-black:#000000; --color-dark-gray:#121212; --color-white:#ffffff; --color-green:#1ed760; --color-pink:#ffc2db; --color-blue:#509bf5; --color-purple:#af2896; --color-yellow:#fff078; --font-main:'Montserrat', sans-serif; --radius-huge:32px; --radius-pill:9999px; --transition:0.3s cubic-bezier(0.25, 1, 0.5, 1); } *{ margin:0; padding:0; box-sizing:border-box; } html{ scroll-behavior:smooth; font-size:16px; } body{ font-family:var(--font-main); background-color:var(--color-black); color:var(--color-white); line-height:1.5; overflow-x:hidden; -webkit-font-smoothing:antialiased; } a{ text-decoration:none; color:inherit; } ul{ list-style:none; } .container{ max-width:1400px; margin:0 auto; padding:0 4%; } h1, h2, h3, h4{ font-weight:700; letter-spacing:-0.02em; } .massive-text{ font-size:clamp(1.8rem, 4.5vw, 3.0rem); line-height:1.1; letter-spacing:-0.03em; } .section-title{ font-size:clamp(2.0rem, 5.5vw, 3.0rem); line-height:1; margin-bottom:2rem; letter-spacing:-0.03em; } .section-label{ font-size:1rem; font-weight:700; margin-bottom:1.5rem; letter-spacing:0.05em; color:rgba(255, 255, 255, 0.6); } .section-label.color-black{ color:rgba(0, 0, 0, 0.6); } .large-body{ font-size:clamp(1.1rem, 2.5vw, 1.4rem); font-weight:400; margin-bottom:1.25rem; color:rgba(255, 255, 255, 0.8); } .color-black{ color:var(--color-black) !important; } .black-text{ color:var(--color-black); } .black-text p, .black-text .large-body{ color:rgba(0, 0, 0, 0.8); } .section-huge{ padding:120px 0; } .bg-black{ background-color:var(--color-black); color:var(--color-white); } .bg-dark-gray{ background-color:var(--color-dark-gray); color:var(--color-white); } .bg-green{ background-color:var(--color-green); } .bg-pink{ background-color:var(--color-pink); } .bg-blue{ background-color:var(--color-blue); color:var(--color-white); } .bg-purple{ background-color:var(--color-purple); color:var(--color-white); } .bg-yellow{ background-color:var(--color-yellow); } .btn{ display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:1rem; letter-spacing:0.02em; transition:var(--transition); border:none; cursor:pointer; } .btn-pill{ padding:14px 32px; border-radius:var(--radius-pill); } .btn-lg{ padding:18px 40px; font-size:1.2rem; } .btn-white{ background-color:var(--color-white); color:var(--color-black); } .btn-white:hover{ transform:scale(1.04); } .btn-black{ background-color:var(--color-black); color:var(--color-white); } .btn-black:hover{ transform:scale(1.04); } .navbar{ position:fixed; top:0; left:0; width:100%; padding:24px 0; z-index:1000; background-color:transparent; transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1); } .navbar.scrolled{ background-color:rgba(5, 5, 5, 0.95); backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px); padding:16px 0; border-bottom:1px solid rgba(255, 255, 255, 0.05); } .nav-container{ max-width:1600px; margin:0 auto; padding:0 4%; display:flex; justify-content:space-between; align-items:center; } .logo img{ height:100px; filter:brightness(0) invert(1); } .nav-links{ display:flex; align-items:center; gap:10px; flex:1; justify-content:center; } .nav-link{ font-family:var(--font-main); font-weight:400; font-size:13px; line-height:1.15; text-decoration:none; transition:all 0.2s ease; border-radius:100px; border:1px solid transparent; padding:10px 20px; background-color:rgba(41, 41, 41, .68); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); color:#fff; cursor:pointer; display:inline-block; } .nav-link:hover{ background-color:rgba(255, 255, 255, 0.1); border-color:rgba(255, 255, 255, 0.2); transform:scale(1.05); } .nav-right{ display:flex; align-items:center; gap:15px; } .btn-header-contact{ font-family:var(--font-main); font-size:14px; font-weight:700; line-height:1.4; padding:10px 20px; border-radius:100px; background-color:rgba(242, 242, 242, 0.92); color:rgb(25, 20, 20); border:none; transition:background-color 0.2s ease, transform 0.2s ease; display:inline-flex; align-items:center; justify-content:center; } .btn-header-contact:hover{ background-color:#ffffff; transform:scale(1.04); } .menu-toggle{ display:none; font-size:1.8rem; cursor:pointer; } .hero{ position:relative; padding-top:100px; height:100vh; min-height:800px; background-color:var(--color-black); display:flex; flex-direction:column; justify-content:center; overflow:hidden; } .coverflow-container{ position:relative; width:100%; height:600px; perspective:1500px; display:flex; justify-content:center; align-items:center; transform-style:preserve-3d; } .coverflow-card{ position:absolute; width:450px; height:600px; border-radius:var(--radius-huge); background:var(--color-dark-gray); transition:transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.6s ease, z-index 0s, box-shadow 0.6s ease; cursor:pointer; overflow:hidden; user-select:none; -webkit-user-drag:none; display:flex; flex-direction:column; border:1px solid rgba(255, 255, 255, 0.05); } @media (max-width:992px){ .coverflow-card{ width:350px; height:480px; } } @media (max-width:768px){ .coverflow-card{ width:280px; height:400px; } } .card-video{ position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; z-index:1; pointer-events:none; } .card-content-inner{ position:relative; z-index:2; padding:40px; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; } .coverflow-controls{ display:flex; justify-content:center; gap:20px; margin-top:40px; position:relative; z-index:100; } .nav-btn{ width:50px; height:50px; border-radius:50%; border:1px solid rgba(255, 255, 255, 0.2); background:transparent; color:white; font-size:1.2rem; cursor:pointer; transition:var(--transition); display:flex; align-items:center; justify-content:center; } .nav-btn:hover{ background:white; color:black; transform:scale(1.1); } #intro-center-logo{ position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:350px; z-index:5; opacity:1; transition:opacity 0.5s ease-in-out; pointer-events:none; } .intro-dark-overlay{ position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.5); z-index:4; opacity:1; transition:opacity 0.5s ease-in-out; pointer-events:none; } @media (max-width:768px){ #intro-center-logo{ width:250px; } } #hero-scroll-container{ height:100vh; width:100vw; background-color:var(--color-black); position:relative; z-index:10; } #hero-sticky-element{ position:relative; width:100vw; height:100vh; overflow:hidden; background-color:var(--color-black); } #coverflow-stage{ position:absolute; width:100vw; height:100vh; top:0; left:0; perspective:2000px; transform-style:preserve-3d; display:flex; align-items:center; justify-content:center; } .carousel-card{ position:absolute; top:50%; left:50%; width:450px; height:650px; border-radius:32px; transform-style:preserve-3d; background-color:transparent; will-change:width, height, transform, opacity; } .card-inner{ position:relative; width:100%; height:100%; transition:transform 0.8s cubic-bezier(0.4, 0, 0.2, 1); transform-style:preserve-3d; box-shadow:0 10px 40px rgba(0, 0, 0, 0.6); border-radius:32px; } .carousel-card.is-active .card-inner{ transform:rotateY(-180deg); } .card-front, .card-back{ position:absolute; width:100%; height:100%; top:0; left:0; -webkit-backface-visibility:hidden; backface-visibility:hidden; border-radius:32px; overflow:hidden; will-change:border-radius; } .card-front{ background-color:var(--color-black); } .card-back{ transform:rotateY(-180deg); padding:60px 40px; display:flex; flex-direction:column; } .bg-blue{ background-color:#9ac2f4; color:#000; } .bg-green{ background-color:#aae09f; color:#000; } .bg-yellow{ background-color:#f7e18d; color:#000; } .bg-purple{ background-color:#c9abf5; color:#000; } .bg-orange{ background-color:#f4b896; color:#000; } .bg-pink{ background-color:#f7a8cf; color:#000; } .card-back h3{ font-size:2.5rem; line-height:1.1; margin-bottom:20px; font-weight:700; } .card-desc{ font-size:1.15rem; font-weight:500; opacity:0.9; line-height:1.4; margin-bottom:30px; } .carousel-card.is-animating{ transition:transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), width 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), height 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), border-radius 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); } .card-bg-image{ width:100%; height:100%; object-fit:cover; display:block; } #coverflow-controls{ position:absolute; bottom:120px; left:50%; transform:translateX(-50%); display:flex; gap:15px; z-index:100; opacity:0; pointer-events:none; transition:opacity 0.5s ease; } @media (max-width:768px){ .carousel-card{ width:320px !important; height:480px !important; } .card-back{ padding:40px 30px; } .card-back h3{ font-size:1.8rem; } .card-desc{ font-size:1rem; } } .gallery-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(400px, 1fr)); gap:24px; } .gallery-card{ border-radius:var(--radius-huge); overflow:hidden; position:relative; aspect-ratio:4/3; } .gallery-caption{ position:absolute; bottom:30px; left:30px; z-index:2; font-size:2.5rem; font-weight:700; text-shadow:0 2px 10px rgba(0, 0, 0, 0.5); } .contact-split{ display:grid; grid-template-columns:1fr 1fr; gap:60px; } .social-links{ display:flex; gap:15px; } .social-btn{ width:60px; height:60px; border-radius:50%; background-color:var(--color-black); color:var(--color-white); display:flex; align-items:center; justify-content:center; font-size:1.5rem; transition:var(--transition); } .social-btn:hover{ transform:scale(1.1); background-color:var(--color-white); color:var(--color-black); } .solid-form{ display:flex; flex-direction:column; gap:20px; } .solid-form input, .solid-form textarea{ width:100%; padding:24px; border-radius:16px; border:none; background-color:rgba(255, 255, 255, 0.4); color:var(--color-black); font-family:var(--font-main); font-size:1.2rem; font-weight:700; transition:var(--transition); } .solid-form input::placeholder, .solid-form textarea::placeholder{ color:rgba(0, 0, 0, 0.6); } .solid-form input:focus, .solid-form textarea:focus{ outline:none; background-color:var(--color-white); } .footer{ padding:100px 0 40px; } .footer-top{ margin-bottom:60px; } .footer-links-wrapper{ display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:40px; margin-bottom:80px; } .footer-col h4{ font-size:1.2rem; margin-bottom:1.5rem; color:rgba(255, 255, 255, 0.5); } .footer-col ul li{ margin-bottom:1rem; } .footer-col ul li a{ font-size:1.2rem; font-weight:700; } .footer-col ul li a:hover{ color:var(--color-green); } .footer-bottom{ border-top:1px solid rgba(255, 255, 255, 0.1); padding-top:40px; color:rgba(255, 255, 255, 0.5); font-weight:700; } .section-who-we-are{ background-color:#050505; padding:120px 0; position:relative; z-index:20; } .who-container{ max-width:1600px; margin:0 auto; padding:0 4%; display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:start; } .who-visuals{ position:relative; height:100%; } .who-image-wrapper{ position:sticky; top:120px; width:100%; aspect-ratio:1 / 1; border-radius:32px; overflow:hidden; background:#2a2a2a; } .who-img{ position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.05); transition:opacity 0.6s ease, transform 0.6s ease; pointer-events:none; } .who-img.is-active{ opacity:1; transform:scale(1); z-index:2; } .who-content{ display:flex; flex-direction:column; gap:15px; height:100%; } .who-section-title{ display:none; } .who-accordion-item{ background-color:#002db3; border-radius:32px; overflow:hidden; color:#ffffff; transition:background-color 0.3s ease, flex 0.4s cubic-bezier(0.16, 1, 0.3, 1); display:flex; flex-direction:column; } .who-accordion-item:not(.is-expanded){ background-color:#001a66; flex:0 0 auto; } .who-accordion-item.is-expanded{ flex:1 1 auto; } .who-accordion-item.is-expanded .who-accordion-body{ flex:1; display:flex; flex-direction:column; max-height:1000px !important; } .who-accordion-header{ display:flex; align-items:flex-start; padding:30px 40px; cursor:pointer; transition:opacity 0.3s ease; flex:0 0 auto; } .who-accordion-header:hover{ opacity:0.8; } .who-number{ font-size:1rem; font-weight:700; margin-right:0; margin-left:auto; opacity:0.8; order:3; } .who-category-text{ font-size:0.8rem; text-transform:uppercase; letter-spacing:1px; font-weight:700; margin-bottom:20px; } .who-header-text{ display:flex; flex-direction:column; flex:1; } .who-chevron{ display:none; } .who-accordion-item.is-expanded .who-chevron{ transform:rotate(180deg); } .who-accordion-body{ max-height:0; overflow:hidden; transition:max-height 0.6s cubic-bezier(0.16, 1, 0.3, 1); } .who-accordion-inner{ padding-bottom:40px; padding-left:40px; padding-right:40px; color:#e0e0e0; font-size:1rem; line-height:1.6; margin-top:auto; } .who-accordion-inner p{ margin-bottom:1.5rem; } .who-accordion-inner p:last-child{ margin-bottom:0; } .who-highlight{ font-size:1.4rem; color:#ffffff; line-height:1.4; font-weight:500; } .who-highlight strong{ font-weight:800; color:#ffffff; } .who-locations{ font-size:0.95rem; opacity:0.8; } .section-marquee{ background-color:#050505; padding:120px 0; overflow:hidden; color:#ffffff; } .marquee-header{ max-width:1000px; margin:0 auto 80px auto; padding:0 4%; text-align:center; } .marquee-title{ font-size:4rem; font-weight:800; margin-bottom:30px; letter-spacing:-2px; line-height:1.1; } .marquee-subtitle{ font-size:1.5rem; color:#cccccc; line-height:1.5; } .features-header h2{ font-size:3rem; font-weight:700; } .feat-card h3{ font-size:1.5rem; font-weight:700; } .marquee-container{ width:100vw; overflow:hidden; position:relative; padding:20px 0; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw; } .marquee-track{ display:flex; white-space:nowrap; width:fit-content; gap:30px; align-items:center; padding:15px 0; } .marquee-track.track-1{ animation:marquee-scroll-left 45s linear infinite; } .marquee-track.track-2{ animation:marquee-scroll-right 50s linear infinite; transform:translateX(-50%); } .marquee-track.track-3{ animation:marquee-scroll-left 60s linear infinite; } .marquee-track:hover{ animation-play-state:paused; } .marquee-item{ flex-shrink:0; } .marquee-item.pill{ padding:20px 50px; border-radius:60px; background-color:#ffffff; font-size:3rem; font-weight:800; color:#121212; display:inline-flex; align-items:center; justify-content:center; letter-spacing:-1px; } .marquee-item.img{ height:120px; width:200px; object-fit:cover; border-radius:60px; } @keyframes marquee-scroll-left{ 0%{ transform:translate3d(0, 0, 0); } 100%{ transform:translate3d(-50%, 0, 0); } } @keyframes marquee-scroll-right{ 0%{ transform:translate3d(-50%, 0, 0); } 100%{ transform:translate3d(0, 0, 0); } } @media (max-width:768px){ .marquee-title{ font-size:2.5rem; } .marquee-subtitle{ font-size:1.1rem; } .marquee-item.pill{ font-size:1.5rem; padding:12px 30px; } .marquee-item.img{ height:70px; width:140px; } .marquee-track{ gap:15px; } } .section-featured-accordion{ background-color:#050505; padding:100px 4%; } .featured-accordion-title{ font-size:3.5rem; font-weight:800; color:#ffffff; text-align:center; margin-bottom:60px; letter-spacing:-1px; } .accordion-container{ display:flex; gap:15px; height:60vh; min-height:500px; max-height:700px; max-width:1600px; margin:0 auto; } .accordion-item{ flex:1; position:relative; border-radius:20px; overflow:hidden; cursor:pointer; transition:flex 0.6s cubic-bezier(0.25, 1, 0.5, 1); background-color:#ffffff; } .accordion-bg{ position:absolute; inset:0; background-size:cover; background-position:center; transition:opacity 0.6s ease; z-index:1; } .accordion-bg::after{ content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(0, 0, 0, 0.4) 0%, transparent 50%); } .accordion-container:not(:hover) .accordion-item:first-child{ flex:4; } .accordion-container:not(:hover) .accordion-item:first-child .accordion-bg{ opacity:0; } .accordion-container:not(:hover) .accordion-item:first-child .accordion-content{ opacity:1; transform:translateY(0); } .accordion-item:hover{ flex:4 !important; } .accordion-item:hover .accordion-bg{ opacity:0; } .accordion-item:hover .accordion-content{ opacity:1; transform:translateY(0); } .accordion-content{ position:relative; z-index:2; padding:40px; height:100%; display:flex; flex-direction:column; justify-content:flex-start; color:#121212; opacity:0; transform:translateY(20px); transition:opacity 0.4s ease 0.1s, transform 0.6s cubic-bezier(0.25, 1, 0.5, 1); box-sizing:border-box; } .accordion-category{ font-size:0.9rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:#666666; margin-bottom:20px; } .accordion-heading{ font-size:3rem; font-weight:800; line-height:1.1; margin:0; letter-spacing:-1px; max-width:80%; } .accordion-bottom{ margin-top:auto; } .accordion-btn{ display:inline-flex; align-items:center; gap:10px; background-color:#1a1a1a; color:#ffffff; padding:15px 30px; border-radius:40px; font-weight:700; text-decoration:none; transition:background-color 0.3s ease, transform 0.3s ease; } .accordion-btn:hover{ background-color:#333333; transform:scale(1.05); } .section-stories{ background-color:#050505; padding:100px 4%; color:#ffffff; display:flex; flex-direction:column; align-items:center; overflow:hidden; } .stories-title{ font-size:3rem; font-weight:700; margin-bottom:50px; letter-spacing:-1px; text-align:center; } .stories-wrapper{ width:100%; max-width:1600px; position:relative; display:flex; align-items:center; gap:20px; } .stories-arrow{ flex-shrink:0; width:56px; height:56px; border-radius:50%; background:rgba(255, 255, 255, 0.12); backdrop-filter:blur(8px); border:1px solid rgba(255, 255, 255, 0.2); color:#fff; font-size:1.3rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background 0.3s ease, transform 0.2s ease; z-index:5; } .stories-arrow:hover{ background:rgba(255, 255, 255, 0.25); transform:scale(1.1); } .stories-container{ flex:1; min-width:0; display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding:0 10px 20px 10px; -ms-overflow-style:none; scrollbar-width:none; } .stories-container::-webkit-scrollbar{ display:none; } .stories-track{ display:contents; } .story-item{ position:relative; width:300px; height:533px; border-radius:20px; overflow:hidden; scroll-snap-align:center; background-color:#1a1a1a; box-shadow:0 10px 30px rgba(0, 0, 0, 0.5); flex-shrink:0; transition:transform 0.3s ease; } .story-item:hover{ transform:scale(1.02); } .story-video{ width:100%; height:100%; object-fit:cover; pointer-events:auto; } .story-overlay{ position:absolute; inset:0; display:flex; justify-content:flex-end; align-items:flex-start; padding:20px; background:linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, transparent 20%, transparent 80%, rgba(0, 0, 0, 0.4) 100%); pointer-events:none; } .sound-toggle-btn{ background:rgba(0, 0, 0, 0.5); backdrop-filter:blur(5px); border:1px solid rgba(255, 255, 255, 0.2); color:#fff; width:45px; height:45px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:1.2rem; transition:background 0.3s ease, transform 0.2s ease; pointer-events:auto; z-index:10; } .sound-toggle-btn:hover{ background:rgba(255, 255, 255, 0.2); transform:scale(1.1); } .stories-footer{ margin-top:60px; } .instagram-btn{ background-color:transparent; color:#ffffff; border:2px solid #ffffff; padding:15px 40px; border-radius:40px; font-size:1.2rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; text-decoration:none; display:inline-flex; align-items:center; gap:12px; transition:all 0.3s ease; } .instagram-btn:hover{ background-color:#ffffff; color:#050505; transform:translateY(-3px); } .instagram-btn i{ font-size:1.5rem; } .section-contact{ background-color:#050505; padding:80px 4%; } .contact-split{ max-width:1500px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:0; border-radius:28px; overflow:hidden; box-shadow:0 30px 80px rgba(0, 0, 0, 0.6); } .contact-left{ background-color:#ffffff; color:#111111; padding:70px 60px; display:flex; flex-direction:column; justify-content:center; gap:28px; } .contact-title{ font-size:3rem; font-weight:800; line-height:1.1; letter-spacing:-1.5px; margin:0; color:#111111; } .contact-desc{ font-size:1rem; line-height:1.7; color:rgba(17, 17, 17, 0.65); margin:0; } .contact-whatsapp-block{ margin-top:10px; } .contact-whatsapp-label{ font-size:1rem; font-weight:700; margin:0 0 6px; color:#111111; } .contact-whatsapp-sub{ font-size:0.9rem; color:rgba(17, 17, 17, 0.6); margin:0 0 18px; line-height:1.6; } .whatsapp-btn{ display:inline-flex; align-items:center; gap:10px; color:#111111; font-size:1rem; font-weight:600; text-decoration:none; border-bottom:1px solid rgba(17, 17, 17, 0.3); padding-bottom:4px; width:fit-content; transition:opacity 0.3s ease; } .whatsapp-btn i{ font-size:1.4rem; color:#25d366; } .whatsapp-btn:hover{ opacity:0.6; } .contact-right{ background-color:#0022cc; padding:70px 60px; display:flex; flex-direction:column; justify-content:center; } .contact-form{ display:flex; flex-direction:column; gap:16px; } .form-group{ display:flex; flex-direction:column; gap:7px; } .form-label{ font-size:0.9rem; font-weight:600; color:rgba(255, 255, 255, 0.85); letter-spacing:0.3px; } .required{ color:#80cfff; } .form-input, .form-textarea{ width:100%; max-width:100%; background-color:rgba(255, 255, 255, 0.12); color:#ffffff; border:1px solid rgba(255, 255, 255, 0.25); border-radius:40px; padding:14px 22px; font-size:1rem; font-family:inherit; outline:none; transition:background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; box-sizing:border-box; } .form-input::placeholder, .form-textarea::placeholder{ color:rgba(255, 255, 255, 0.4); } .form-textarea{ border-radius:20px; resize:vertical; min-height:110px; } .form-input:focus, .form-textarea:focus{ background-color:rgba(255, 255, 255, 0.18); border-color:rgba(255, 255, 255, 0.6); box-shadow:0 0 0 3px rgba(255, 255, 255, 0.15); } .form-check{ flex-direction:row; align-items:flex-start; } .check-label{ display:flex; align-items:flex-start; gap:10px; font-size:0.85rem; color:rgba(255, 255, 255, 0.65); cursor:pointer; } .check-label input[type="checkbox"]{ width:16px; height:16px; flex-shrink:0; margin-top:2px; accent-color:#ffffff; cursor:pointer; } .privacy-link{ color:#ffffff; text-decoration:underline; } .btn-submit{ background-color:#ffffff; color:#0022cc; border:none; border-radius:40px; padding:16px 48px; font-size:1.05rem; font-weight:800; cursor:pointer; width:fit-content; margin-top:4px; transition:background-color 0.3s ease, transform 0.2s ease, color 0.3s ease; } .btn-submit:hover{ background-color:#e8e8e8; transform:translateY(-2px); } @media (max-width:992px){ .contact-split{ grid-template-columns:1fr; } .who-container{ grid-template-columns:1fr; gap:40px; } .who-visuals{ order:-1; height:auto; } .who-image-wrapper{ position:relative; top:0; aspect-ratio:16 / 9; } .who-title{ font-size:2.5rem; } } @media (max-width:768px){ .nav-links{ display:none; } .navbar{ padding:12px 0; } .logo img{ height:60px; } .menu-toggle{ display:block; } .section-huge{ padding:80px 0; } .services-bento, .gallery-grid{ grid-template-columns:1fr; } } .site-footer{ background-color:#050505; padding:0 4% 40px; } .footer-cards{ max-width:1500px; margin:0 auto; display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; padding-bottom:40px; } .footer-card{ background-color:#141414; border-radius:16px; padding:40px 36px; } .footer-card-title{ font-size:0.7rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:rgba(255, 255, 255, 0.5); margin:0 0 24px; } .footer-links{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:14px; } .footer-links li a{ color:rgba(255, 255, 255, 0.75); text-decoration:none; font-size:0.95rem; transition:color 0.2s ease; } .footer-links li a:hover{ color:#ffffff; } .footer-social li a{ display:flex; align-items:center; gap:10px; } .footer-social li a i{ font-size:1.1rem; width:20px; text-align:center; } .footer-bottom{ max-width:1500px; margin:0 auto; padding-top:20px; border-top:1px solid rgba(255, 255, 255, 0.07); color:rgba(255, 255, 255, 0.35); font-size:0.8rem; display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; } .footer-credit{ color:rgba(255, 255, 255, 0.35); text-decoration:none; font-size:0.8rem; transition:color 0.2s ease; } .footer-credit:hover{ color:rgba(255, 255, 255, 0.7); } .mobile-menu-overlay{ position:fixed; top:0; left:0; width:100vw; height:100vh; background-color:rgba(0, 0, 0, 0.4); backdrop-filter:blur(25px); -webkit-backdrop-filter:blur(25px); z-index:9999; display:flex; flex-direction:column; padding:24px 24px; box-sizing:border-box; opacity:0; pointer-events:none; transition:opacity 0.4s ease; } .mobile-menu-overlay.is-open{ opacity:1; pointer-events:auto; } .mobile-menu-header{ display:flex; justify-content:flex-end; margin-bottom:2rem; } .menu-close{ width:44px; height:44px; border-radius:50%; background-color:rgba(255, 255, 255, 0.1); display:flex; justify-content:center; align-items:center; cursor:pointer; color:white; font-size:1.2rem; transition:background-color 0.2s ease; } .menu-close:active{ background-color:rgba(255, 255, 255, 0.2); } .mobile-menu-content{ flex:1; display:flex; flex-direction:column; overflow-y:auto; } .mobile-nav-links{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:1.5rem; } .mobile-nav-link{ color:var(--color-white); font-size:2rem; font-weight:700; text-decoration:none; line-height:1.2; transform:translateY(20px); opacity:0; display:block; transition:transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease; } .mobile-menu-overlay.is-open .mobile-nav-link{ transform:translateY(0); opacity:1; } .mobile-menu-overlay.is-open .mobile-nav-links li:nth-child(1) .mobile-nav-link{ transition-delay:0.1s; } .mobile-menu-overlay.is-open .mobile-nav-links li:nth-child(2) .mobile-nav-link{ transition-delay:0.15s; } .mobile-menu-overlay.is-open .mobile-nav-links li:nth-child(3) .mobile-nav-link{ transition-delay:0.2s; } .mobile-menu-overlay.is-open .mobile-nav-links li:nth-child(4) .mobile-nav-link{ transition-delay:0.25s; } .mobile-menu-overlay.is-open .mobile-nav-links li:nth-child(5) .mobile-nav-link{ transition-delay:0.3s; } .mobile-menu-overlay.is-open .mobile-nav-links li:nth-child(6) .mobile-nav-link{ transition-delay:0.35s; } .mobile-menu-footer{ padding-top:2rem; padding-bottom:2rem; } .btn-spotify-green{ display:flex; justify-content:space-between; align-items:center; background-color:#0022cc; color:var(--color-white); text-decoration:none; font-weight:700; font-size:1.2rem; padding:18px 24px; border-radius:100px; width:100%; box-sizing:border-box; transition:transform 0.2s ease, background-color 0.2s ease; } .btn-spotify-green:active{ transform:scale(0.98); background-color:#001aaa; } .btn-icon{ background-color:var(--color-white); color:#0022cc; width:32px; height:32px; border-radius:50%; display:flex; justify-content:center; align-items:center; font-size:0.9rem; } body.js-anim .service-card{ opacity:0; transform:translateY(40px); transition:opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1), transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease; } body.js-anim .service-card.is-visible{ opacity:1; transform:translateY(0); } body.js-anim .hero-cards-grid .service-card:nth-child(2){ transition-delay:0.1s; } body.js-anim .hero-cards-grid .service-card:nth-child(3){ transition-delay:0.2s; } body.js-anim .services-grid .service-card:nth-child(2){ transition-delay:0.08s; } body.js-anim .services-grid .service-card:nth-child(3){ transition-delay:0.16s; } body.js-anim .services-grid .service-card:nth-child(4){ transition-delay:0.24s; } .feat-card{ position:relative; overflow:visible; } .feat-card::before, .feat-card::after{ content:''; position:absolute; pointer-events:none; opacity:1; animation:neonCornerPulse 3s ease-in-out infinite alternate; } .feat-card::before{ top:-2px; left:-2px; width:64px; height:64px; border-top:2px solid #0022cc; border-left:2px solid #0022cc; border-radius:20px 0 0 0; filter:drop-shadow(0 0 6px rgba(0, 34, 204, 0.9)); animation-direction:alternate; } .feat-card::after{ bottom:-2px; right:-2px; width:64px; height:64px; border-bottom:2px solid #0044ff; border-right:2px solid #0044ff; border-radius:0 0 20px 0; filter:drop-shadow(0 0 6px rgba(0, 68, 255, 0.8)); animation-direction:alternate-reverse; } @keyframes neonCornerPulse{ from{ filter:drop-shadow(0 0 3px rgba(0, 34, 204, 0.6)); opacity:0.65; } to{ filter:drop-shadow(0 0 10px rgba(30, 80, 255, 1)); opacity:1; } } .page-hero{ position:relative; width:100%; background:#050505; padding-bottom:0; min-height:700px; display:flex; align-items:center; overflow:hidden; } .page-hero-image{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 30%; display:block; filter:brightness(0.5); } .page-hero-overlay{ position:absolute; inset:0; background:linear-gradient(to bottom, rgb(5 5 5) 0%, rgb(5 5 5 / 65%) 25%, rgb(5 5 5 / 41%) 50%, #050505 100%); pointer-events:none; z-index:1; } .page-hero-text{ position:absolute; bottom:200px; left:50%; transform:translateX(-50%); text-align:center; width:100%; padding:0 4%; z-index:2; color:#fff; } .page-breadcrumb{ display:flex; align-items:center; justify-content:center; gap:8px; font-size:0.8rem; color:rgba(255, 255, 255, 0.5); margin-bottom:18px; text-transform:uppercase; letter-spacing:1px; } .page-breadcrumb a{ color:rgba(255, 255, 255, 0.5); text-decoration:none; transition:color 0.2s; } .page-breadcrumb a:hover{ color:#fff; } .page-hero-text h1{ font-size:clamp(2.2rem, 5.5vw, 3.0rem); font-weight:700; color:#ffffff; line-height:1.1; letter-spacing:-1px; margin:0 0 16px; } .page-hero-text p{ font-size:1.1rem; color:rgba(255, 255, 255, 0.75); line-height:1.6; margin:0 auto; max-width:520px; } .hero-cta-row{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-top:32px; } .btn-hero-primary{ background:#ffffff; color:#050505; padding:16px 40px; border-radius:40px; font-weight:700; font-size:1rem; text-decoration:none; transition:transform 0.2s, background 0.2s; } .btn-hero-primary:hover{ background:#e8e8e8; transform:translateY(-2px); } .btn-hero-secondary{ background:transparent; color:#ffffff; border:2px solid rgba(255, 255, 255, 0.4); padding:16px 40px; border-radius:40px; font-weight:700; font-size:1rem; text-decoration:none; transition:border-color 0.2s, background 0.2s; } .btn-hero-secondary:hover{ border-color:#fff; background:rgba(255, 255, 255, 0.08); } .hero-cards-strip{ background:#050505; padding:0 4% 80px; position:relative; z-index:5; } .hero-cards-grid{ max-width:1400px; margin:0 auto; display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; transform:translateY(-50px); position:relative; z-index:10; } .service-card{ background:#ffffff; border-radius:20px; overflow:hidden; display:flex; flex-direction:column; transition:transform 0.3s ease, box-shadow 0.3s ease; cursor:pointer; text-decoration:none; } .service-card:hover{ transform:translateY(-6px); box-shadow:0 20px 50px rgba(0, 0, 0, 0.5); } .service-card-top{ padding:24px 24px 32px 24px; } .service-card-badge{ display:inline-flex; align-items:center; gap:6px; background:#f0f0f0; border-radius:40px; padding:5px 13px; font-size:0.75rem; font-weight:700; color:#333; margin-bottom:12px; } .service-card-badge i{ font-size:0.7rem; color:#666; } .service-card h3{ font-size:1.4rem; font-weight:700; color:#111111; margin:0 0 6px; letter-spacing:-0.5px; } .service-card p{ font-size:0.85rem; color:#555; line-height:1.5; margin:0; } .service-card-img{ width:100%; height:200px; object-fit:cover; display:block; margin-top:auto; } .section-features{ background:#050505; padding:50px 4% 100px; } .features-header{ max-width:1400px; margin:0 auto 60px; } .features-header h2{ font-size:3rem; font-weight:700; color:#fff; letter-spacing:-2px; margin:0; } .features-bento{ max-width:1400px; margin:0 auto; display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; } .feat-card{ background:#111111; border-radius:24px; padding:60px 50px; color:#fff; transition:transform 0.3s ease, background-color 0.3s ease; } .feat-card:hover{ background:#161616; } .feat-card.wide{ grid-column:span 2; } .feat-icon{ font-size:2.5rem; margin-bottom:24px; color:rgba(255, 255, 255, 0.4); } .feat-card h3{ font-size:1.5rem; font-weight:700; margin:0 0 16px; letter-spacing:-1px; } .feat-card p{ font-size:1.05rem; color:rgba(255, 255, 255, 0.6); line-height:1.7; margin:0; } .section-coverage{ background:#0022cc; padding:80px 4%; } .coverage-inner{ max-width:1400px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:40px; } .coverage-inner h2{ font-size:2.5rem; font-weight:700; line-height:2.2rem; color:#fff; margin:0; letter-spacing:-1.5px; } .coverage-inner p{ color:rgba(255, 255, 255, 0.8); font-size:1.2rem; margin:0; max-width:600px; line-height:1.6; } .coverage-inner a{ background:#fff; color:#0022cc; padding:16px 40px; border-radius:50px; font-weight:600; text-decoration:none; flex-shrink:0; transition:background 0.2s, transform 0.2s; } .coverage-inner a:hover{ background:#f0f0f0; transform:scale(1.05); } .section-faq{ background:#050505; padding:120px 4%; } .faq-inner{ max-width:1000px; margin:0 auto; } .faq-inner h2{ font-size:3rem; font-weight:700; color:#fff; letter-spacing:-2px; margin:0 0 60px; } .section-services{ background:#050505; padding:80px 4% 120px; } .services-inner{ max-width:1400px; margin:0 auto; } .services-inner h2{ font-size:clamp(2.0rem, 5.5vw, 3.0rem); font-weight:700; color:#fff; letter-spacing:-1px; margin:0 0 40px; } .services-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; } .svc-card{ position:relative; background:#111111; border-radius:24px; padding:60px 50px; color:#fff; transition:transform 0.3s ease, background-color 0.3s ease; overflow:visible; } .svc-card:hover{ background:#161616; transform:translateY(-5px); } .svc-card::before, .svc-card::after{ content:''; position:absolute; pointer-events:none; opacity:1; animation:neonCornerPulse 3s ease-in-out infinite alternate; } .svc-card::before{ top:-2px; left:-2px; width:64px; height:64px; border-top:2px solid #0022cc; border-left:2px solid #0022cc; border-radius:20px 0 0 0; filter:drop-shadow(0 0 6px rgba(0, 34, 204, 0.9)); } .svc-card::after{ bottom:-2px; right:-2px; width:64px; height:64px; border-bottom:2px solid #0022cc; border-right:2px solid #0022cc; border-radius:0 0 20px 0; filter:drop-shadow(0 0 6px rgba(0, 34, 204, 0.9)); } .svc-icon{ font-size:2.5rem; margin-bottom:24px; color:rgba(255, 255, 255, 0.4); } .svc-card h3{ font-size:1.8rem; font-weight:700; margin:0 0 16px; letter-spacing:-1px; } .svc-card p{ font-size:1.05rem; color:rgba(255, 255, 255, 0.6); line-height:1.7; margin:0; } .faq-item{ border-bottom:1px solid rgba(255, 255, 255, 0.1); } .faq-question{ width:100%; background:none; border:none; color:#fff; font-size:1.3rem; font-weight:700; text-align:left; padding:40px 0; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:20px; font-family:inherit; } .faq-answer{ max-height:0; overflow:hidden; opacity:0; transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1); } .faq-item.is-open .faq-answer{ max-height:500px; opacity:1; padding-bottom:40px; } .faq-answer p{ color:rgba(255, 255, 255, 0.7); font-size:1.1rem; line-height:1.7; margin:0; } .section-page-contact{ background:#050505; padding:100px 4% 140px; text-align:center; } .page-contact-container{ max-width:1400px; margin:0 auto; background:#0022cc; border-radius:32px; padding:80px 60px; box-shadow:0 30px 80px rgba(0, 34, 204, 0.3); } .page-contact-container h2{ font-size:3rem; font-weight:700; color:#fff; margin:0 0 20px; letter-spacing:-1.5px; } .page-contact-container p{ color:rgba(255, 255, 255, 0.8); font-size:1.15rem; margin:0 auto 40px; max-width:550px; line-height:1.7; } .page-cta-row{ display:flex; justify-content:center; gap:20px; flex-wrap:wrap; } @media (max-width:900px){ .nav-links.center-links{ display:none; } .menu-toggle{ display:block; } .page-hero-text{ padding:0 20px; text-align:center; } .hero-cta-row{ flex-direction:column; align-items:center; } .faq-inner h2{ font-size:2rem; } .page-cta-row{ flex-direction:column; align-items:center; } .btn-hero-primary, .btn-hero-secondary{ width:100%; max-width:340px; text-align:center; } .footer-cards{ grid-template-columns:1fr; } .footer-bottom{ flex-direction:column; text-align:center; gap:8px; } .contact-split{ grid-template-columns:1fr; } .contact-left{ padding:50px 30px; } .contact-right{ padding:50px 30px; } .contact-title{ font-size:2.2rem; } .carousel-card{ width:320px !important; height:480px !important; } .card-back{ padding:40px 28px; } .card-back h3{ font-size:1.8rem; } .who-container{ grid-template-columns:1fr; } .who-image-wrapper{ aspect-ratio:16/9; } .accordion-container{ flex-direction:column; height:auto; min-height:unset; max-height:unset; } .accordion-item{ min-height:220px; } .accordion-heading{ font-size:2rem; } .services-bento{ grid-template-columns:1fr !important; } .bento-span-2{ grid-column:span 1 !important; } .hero-cards-grid{ grid-template-columns:1fr; transform:translateY(-20px); gap:20px; } .features-bento{ grid-template-columns:1fr; } .feat-card.wide{ grid-column:span 1; } .legal-table{ font-size:0.8rem; } .services-grid{ grid-template-columns:1fr; } .svc-card{ padding:30px 24px; } } @media (max-width:600px){ .logo img{ height:52px; } .page-hero{ min-height:400px; padding-top:100px; padding-bottom:40px; display:flex; align-items:center; justify-content:center; } .page-hero-text{ position:relative; bottom:auto; left:auto; transform:none; padding:0 15px; margin-top:0; } .page-hero-text h1{ font-size:clamp(2rem, 10vw, 3rem); letter-spacing:-1.5px; } .page-hero-text p{ font-size:0.95rem; } .hero-cards-grid{ transform:translateY(-20px); } .service-card-img{ height:160px; } .section-features{ padding:20px 4% 60px; } .features-header h2{ font-size:2rem; } .feat-card{ padding:32px 28px; } .feat-card h3{ font-size:1.2rem; } .coverage-inner h2{ font-size:1.5rem; line-height:1.3; } .coverage-inner{ flex-direction:column; align-items:center; text-align:center; gap:24px; } .coverage-inner p{ font-size:1.05rem; } .coverage-inner a{ width:100%; text-align:center; } .stories-title{ font-size:2rem; } .story-item{ width:220px; height:390px; } .stories-arrow{ width:40px; height:40px; font-size:1rem; } .section-faq{ padding:60px 4%; } .faq-inner h2{ font-size:1.7rem; } .faq-question{ font-size:0.95rem; padding:22px 0; } .section-page-contact>div{ padding:50px 28px !important; border-radius:20px !important; } .section-page-contact h2{ font-size:2rem !important; } .coverflow-card{ width:280px; height:400px; } #intro-center-logo{ width:200px; } .marquee-item.pill{ font-size:1.3rem; padding:10px 24px; } .marquee-title{ font-size:2rem; } .marquee-subtitle{ font-size:1rem; } .who-accordion-header{ padding:22px 28px; } .who-accordion-inner{ padding:0 28px 30px; } .footer-card{ padding:28px 22px; } .contact-left{ padding:40px 24px; } .contact-right{ padding:40px 24px; } .contact-title{ font-size:1.8rem; } .legal-hero h1{ font-size:2.2rem; letter-spacing:-1px; } .legal-inner{ font-size:0.93rem; } .legal-table th, .legal-table td{ padding:8px 10px; } .accordion-container{ height:auto; } .accordion-item{ min-height:180px; flex:none !important; } .accordion-item:first-child, .accordion-item:hover{ flex:none !important; } .accordion-content{ opacity:1; transform:none; } .accordion-heading{ font-size:1.5rem; max-width:100%; } } @media (max-width:900px){ .section-who-we-are{ padding:60px 0; } .section-marquee{ padding:60px 0; } .section-featured-accordion{ padding:60px 4%; } .section-stories{ padding:60px 4%; } .section-contact{ padding:40px 4% 60px; } .featured-accordion-title, .stories-title{ font-size:2.2rem; margin-bottom:36px; } .instagram-btn{ font-size:0.95rem; padding:13px 28px; letter-spacing:0; } .who-container{ padding:0 4%; gap:12px; } .who-accordion-item{ flex:0 0 auto !important; } .who-accordion-item.is-expanded{ flex:0 0 auto !important; } .who-accordion-body{ max-height:0; } .who-accordion-item.is-expanded .who-accordion-body{ max-height:1000px !important; } .accordion-bg::after{ background:linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.35) 50%, rgba(0, 0, 0, 0.2) 100%) !important; } .accordion-content{ color:#ffffff !important; text-shadow:0 1px 4px rgba(0, 0, 0, 0.6); } .accordion-category{ color:rgba(255, 255, 255, 0.75) !important; } .accordion-heading{ color:#ffffff !important; } .accordion-btn{ background-color:rgba(255, 255, 255, 0.2) !important; color:#ffffff !important; backdrop-filter:blur(6px); } } @media (max-width:600px){ .section-who-we-are{ padding:40px 0; } .section-marquee{ padding:40px 0; } .section-featured-accordion{ padding:48px 4%; } .section-stories{ padding:48px 4%; } .section-contact{ padding:30px 4% 50px; } .featured-accordion-title, .stories-title{ font-size:1.8rem; margin-bottom:28px; } .who-accordion-header{ padding:18px 24px; } .who-header-text h2{ font-size:1.1rem; } } @media (max-width:900px){ .accordion-container:not(:hover) .accordion-item:first-child .accordion-bg{ opacity:1 !important; } .accordion-bg{ opacity:1 !important; } .accordion-content{ opacity:1 !important; transform:none !important; } .accordion-btn{ display:none !important; } .accordion-item{ min-height:200px; flex:0 0 auto !important; } #hero-scroll-container{ height:auto; min-height:70vh; } .coverflow-container{ height:420px; margin-top:80px; } .section-marquee{ padding:48px 0; } } @media (max-width:600px){ .coverflow-container{ height:340px; margin-top:70px; } .coverflow-card{ width:260px; height:360px; } .carousel-card{ width:280px !important; height:420px !important; } } @media (max-width:900px){ #hero-scroll-container{ height:75vh; min-height:480px; } #hero-sticky-element{ height:80vh; min-height:480px; } #coverflow-stage{ height:80vh; min-height:480px; } #coverflow-controls{ bottom:15px; } } @media (max-width:600px){ #hero-scroll-container{ height:95vh; min-height:420px; } #hero-sticky-element{ height:95vh; min-height:420px; } #coverflow-stage{ height:95vh; min-height:420px; } #coverflow-controls{ bottom:15px; } } @media (max-width:900px){ .who-accordion-inner{ margin-top:20px; padding-left:20px; padding-right:20px; padding-bottom:20px; } } #cookie-banner{ display:none; position:fixed; bottom:0; left:0; right:0; z-index:99999; background:rgba(10, 10, 10, 0.97); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-top:1px solid rgba(255, 255, 255, 0.08); padding:16px 24px; animation:slideUpBanner 0.4s ease; } @keyframes slideUpBanner{ from{ transform:translateY(100%); opacity:0; } to{ transform:translateY(0); opacity:1; } } .cookie-banner__inner{ max-width:1200px; margin:0 auto; display:flex; align-items:center; gap:24px; flex-wrap:wrap; } .cookie-banner__text{ flex:1; min-width:260px; color:rgba(255, 255, 255, 0.75); font-size:0.85rem; line-height:1.6; margin:0; } .cookie-banner__text a{ color:#fff; text-decoration:underline; } .cookie-banner__actions{ display:flex; gap:10px; flex-shrink:0; flex-wrap:wrap; } .cookie-btn{ padding:10px 20px; border:none; border-radius:50px; font-family:'Montserrat', sans-serif; font-size:0.82rem; font-weight:600; cursor:pointer; transition:all 0.2s ease; white-space:nowrap; } .cookie-btn--reject{ background:transparent; color:rgba(255, 255, 255, 0.6); border:1px solid rgba(255, 255, 255, 0.2); } .cookie-btn--reject:hover{ border-color:rgba(255, 255, 255, 0.5); color:#fff; } .cookie-btn--accept{ background:#fff; color:#111; } .cookie-btn--accept:hover{ background:#1a7f3c; color:#fff; } @media (max-width:600px){ .cookie-banner__inner{ flex-direction:column; align-items:flex-start; gap:14px; } .cookie-banner__actions{ width:100%; justify-content:flex-end; } } .legal-hero{ background:#0a0a0a; padding:140px 4% 60px; text-align:center; border-bottom:1px solid rgba(255, 255, 255, 0.05); } .legal-hero h1{ font-size:3rem !important; font-weight:700 !important; color:#fff; margin-bottom:10px; } .legal-hero p{ color:rgba(255, 255, 255, 0.5); font-size:0.9rem; } .legal-body{ background:#050505; padding:80px 4%; color:rgba(255, 255, 255, 0.8); line-height:1.8; } .legal-inner{ max-width:900px; margin:0 auto; } .legal-inner h2{ font-size:1.5rem !important; font-weight:700 !important; color:#fff; margin:40px 0 20px; } .legal-inner p{ margin-bottom:20px; } .legal-divider{ border:0; border-top:1px solid rgba(255, 255, 255, 0.1); margin:40px 0; } .legal-table{ width:100%; border-collapse:collapse; margin:30px 0; font-size:0.9rem; background:rgba(255, 255, 255, 0.02); border-radius:12px; overflow:hidden; } .legal-table th, .legal-table td{ padding:16px 20px; text-align:left; border-bottom:1px solid rgba(255, 255, 255, 0.05); } .legal-table th{ background:rgba(255, 255, 255, 0.05); color:#fff; font-weight:700; } .legal-inner ul{ margin-bottom:20px; padding-left:20px; } .legal-inner ul li{ margin-bottom:10px; } .legal-inner a{ color:#ffffff; text-decoration:underline; opacity:0.8; } .legal-inner a:hover{ opacity:1; } @media (max-width:768px){ .legal-hero{ padding-top:100px; } .legal-hero h1{ font-size:2.2rem !important; } .legal-body{ padding:40px 4%; } .legal-table{ display:block; overflow-x:auto; } }