feat: update ticket link

Author: Lettly

src/Components/Footer.tsx

@@ -170,7 +170,7 @@ const Footer = () => {
               initial={{ opacity: 0, y: 20 }}
               animate={{ opacity: 1, y: 0 }}
               transition={{ duration: 0.6, delay: 0.4 }}
-              className="text-center lg:text-right"
+              className="text-center lg:text-right md:col-span-2 lg:col-span-1"
             >
               <h4 className="text-lg font-bold mb-4 text-purple-200">Website built with ❤️ by</h4>
               <div className="space-y-2">

src/Components/Home.tsx

@@ -127,7 +127,7 @@ const Home = () => {
               animate={{ opacity: 1, y: 0 }}
               transition={{ duration: 0.4, delay: 0.5 }}
             >
-              {IS_COMING_SOON ? null : <EnhancedCTAButtons /> }
+              {IS_COMING_SOON ? null : <EnhancedCTAButtons />}
             </motion.div>
 
             {/* Additional Info */}
@@ -245,25 +245,24 @@ const EnhancedCTAButtons = () => {
   const IS_SPONSOR_OPEN = true; // Set to true to enable Sponsor button
 
   return (
-    <div className="flex flex-col sm:flex-row items-center justify-center gap-4 sm:gap-6 w-full">
-
+    <div className="flex flex-col sm:flex-row flex-wrap items-stretch justify-center gap-3 sm:gap-4 w-full">
       {/* 1. Main CTA - Get Ticket */}
       <motion.div
         whileHover={IS_TICKET_SALE_OPEN ? { scale: 1.05 } : {}}
         whileTap={IS_TICKET_SALE_OPEN ? { scale: 0.95 } : {}}
-        className={`w-full sm:w-auto ${!IS_TICKET_SALE_OPEN ? 'cursor-not-allowed opacity-80' : ''}`}
+        className={`flex-1 min-w-0 sm:min-w-[10rem] sm:max-w-[14rem] ${!IS_TICKET_SALE_OPEN ? 'cursor-not-allowed opacity-80' : ''}`}
       >
         {IS_TICKET_SALE_OPEN ? (
           <a
-            href="https://www.eventi.overnet.education/ServerlessDaysMilano2026#/tickets"
+            href="https://www.eventi.overnet.education/ServerlessDaysMilano2026#/buyTickets/selectTickets"
             target="_blank"
             className="group block w-full"
           >
             <TicketButtonContent isOpen={true} />
           </a>
         ) : (
           <div className="block w-full pointer-events-none">
-             <TicketButtonContent isOpen={false} />
+            <TicketButtonContent isOpen={false} />
           </div>
         )}
       </motion.div>
@@ -272,15 +271,15 @@ const EnhancedCTAButtons = () => {
       <motion.div
         whileHover={IS_CFP_OPEN ? { scale: 1.05 } : {}}
         whileTap={IS_CFP_OPEN ? { scale: 0.95 } : {}}
-        className={`w-full sm:w-auto ${!IS_CFP_OPEN ? 'cursor-not-allowed opacity-80' : ''}`}
+        className={`flex-1 min-w-0 sm:min-w-[10rem] sm:max-w-[14rem] ${!IS_CFP_OPEN ? 'cursor-not-allowed opacity-80' : ''}`}
       >
         {IS_CFP_OPEN ? (
           <a
             href="https://forms.zohopublic.eu/overnet/form/CFPServerlessDays1310/formperma/PxdFEPzD1aumi1bdUp2dJrzqOhd3uxRpGpM_0A-XX-g"
             target="_blank"
             className="group block w-full"
           >
-             <SpeakerButtonContent isOpen={true} />
+            <SpeakerButtonContent isOpen={true} />
           </a>
         ) : (
           <div className="block w-full pointer-events-none">
@@ -293,7 +292,7 @@ const EnhancedCTAButtons = () => {
       <motion.div
         whileHover={IS_SPONSOR_OPEN ? { scale: 1.05 } : {}}
         whileTap={IS_SPONSOR_OPEN ? { scale: 0.95 } : {}}
-        className={`w-full sm:w-auto ${!IS_SPONSOR_OPEN ? 'cursor-not-allowed opacity-80' : ''}`}
+        className={`flex-1 min-w-0 sm:min-w-[10rem] sm:max-w-[14rem] ${!IS_SPONSOR_OPEN ? 'cursor-not-allowed opacity-80' : ''}`}
       >
         {IS_SPONSOR_OPEN ? (
           <a
@@ -309,7 +308,6 @@ const EnhancedCTAButtons = () => {
           </div>
         )}
       </motion.div>
-
     </div>
   );
 };
@@ -321,22 +319,33 @@ const EnhancedCTAButtons = () => {
 const TicketButtonContent = ({ isOpen }: { isOpen: boolean }) => {
   if (isOpen) {
     return (
-      <button className="relative overflow-hidden w-full sm:w-auto px-8 sm:px-10 py-4 sm:py-5 bg-gradient-to-r from-white via-pink-50 to-white text-purple-900 font-black text-lg sm:text-xl rounded-2xl border-4 border-purple-200 shadow-2xl hover:shadow-purple-500/50 transition-all duration-300 ease-in-out group-hover:border-purple-300 cursor-pointer">
+      <button className="relative overflow-hidden w-full px-6 sm:px-8 lg:px-10 py-3 sm:py-4 lg:py-5 bg-gradient-to-r from-white via-pink-50 to-white text-purple-900 font-black text-base sm:text-lg lg:text-xl rounded-2xl border-4 border-purple-200 shadow-2xl hover:shadow-purple-500/50 transition-all duration-300 ease-in-out group-hover:border-purple-300 cursor-pointer">
         <span className="absolute inset-0 bg-gradient-to-r from-purple-100 via-pink-100 to-purple-100 opacity-0 group-hover:opacity-100 transition-opacity duration-300"></span>
         <span className="relative flex items-center justify-center gap-3">
-          <motion.span animate={{ rotate: [0, 10, -10, 0] }} transition={{ duration: 2, repeat: Infinity, ease: 'easeInOut' }}>
+          <motion.span
+            animate={{ rotate: [0, 10, -10, 0] }}
+            transition={{ duration: 2, repeat: Infinity, ease: 'easeInOut' }}
+          >
             🎫
           </motion.span>
           <span>Get Your Ticket!</span>
-          <motion.span animate={{ scale: [1, 1.2, 1] }} transition={{ duration: 2, repeat: Infinity, ease: 'easeInOut', delay: 0.5 }}>
+          <motion.span
+            animate={{ scale: [1, 1.2, 1] }}
+            transition={{
+              duration: 2,
+              repeat: Infinity,
+              ease: 'easeInOut',
+              delay: 0.5,
+            }}
+          >
             ✨
           </motion.span>
         </span>
       </button>
     );
   }
   return (
-    <button className="relative overflow-hidden w-full sm:w-auto px-8 sm:px-10 py-4 sm:py-5 bg-slate-100 text-slate-400 font-bold text-lg sm:text-xl rounded-2xl border-4 border-slate-200 shadow-none cursor-not-allowed grayscale">
+    <button className="relative overflow-hidden w-full px-6 sm:px-8 lg:px-10 py-3 sm:py-4 lg:py-5 bg-slate-100 text-slate-400 font-bold text-base sm:text-lg lg:text-xl rounded-2xl border-4 border-slate-200 shadow-none cursor-not-allowed grayscale">
       <span className="relative flex items-center justify-center gap-3">
         <span>🎫</span>
         <span>Tickets coming Soon</span>
@@ -350,14 +359,25 @@ const SpeakerButtonContent = ({ isOpen }: { isOpen: boolean }) => {
   if (isOpen) {
     // Active: Vibrant Orchid (Pink/Purple)
     return (
-      <button className="relative overflow-hidden w-full sm:w-auto px-8 sm:px-10 py-4 sm:py-5 bg-gradient-to-r from-purple-500 via-pink-500 to-purple-500 text-white font-bold text-lg sm:text-xl rounded-2xl shadow-xl hover:shadow-pink-500/50 transition-all duration-300 ease-in-out border-2 border-purple-300 group-hover:border-pink-300 cursor-pointer">
+      <button className="relative overflow-hidden w-full px-6 sm:px-8 lg:px-10 py-3 sm:py-4 lg:py-5 bg-gradient-to-r from-purple-500 via-pink-500 to-purple-500 text-white font-bold text-base sm:text-lg lg:text-xl rounded-2xl shadow-xl hover:shadow-pink-500/50 transition-all duration-300 ease-in-out border-2 border-purple-300 group-hover:border-pink-300 cursor-pointer">
         <span className="absolute inset-0 bg-gradient-to-r from-pink-500 via-purple-500 to-pink-500 opacity-0 group-hover:opacity-100 transition-opacity duration-300"></span>
         <span className="relative flex items-center justify-center gap-3">
-          <motion.span animate={{ rotate: [0, 10, -10, 0] }} transition={{ duration: 2, repeat: Infinity, ease: 'easeInOut' }}>
+          <motion.span
+            animate={{ rotate: [0, 10, -10, 0] }}
+            transition={{ duration: 2, repeat: Infinity, ease: 'easeInOut' }}
+          >
             📢
           </motion.span>
           <span>Become a Speaker</span>
-          <motion.span animate={{ y: [0, -3, 0] }} transition={{ duration: 2, repeat: Infinity, ease: 'easeInOut', delay: 1 }}>
+          <motion.span
+            animate={{ y: [0, -3, 0] }}
+            transition={{
+              duration: 2,
+              repeat: Infinity,
+              ease: 'easeInOut',
+              delay: 1,
+            }}
+          >
             🗣️
           </motion.span>
         </span>
@@ -366,7 +386,7 @@ const SpeakerButtonContent = ({ isOpen }: { isOpen: boolean }) => {
   }
   // Disabled
   return (
-    <button className="relative overflow-hidden w-full sm:w-auto px-8 sm:px-10 py-4 sm:py-5 bg-slate-100 text-slate-400 font-bold text-lg sm:text-xl rounded-2xl border-2 border-slate-200 shadow-none cursor-not-allowed grayscale">
+    <button className="relative overflow-hidden w-full px-6 sm:px-8 lg:px-10 py-3 sm:py-4 lg:py-5 bg-slate-100 text-slate-400 font-bold text-base sm:text-lg lg:text-xl rounded-2xl border-2 border-slate-200 shadow-none cursor-not-allowed grayscale">
       <span className="relative flex items-center justify-center gap-3">
         <span>📢</span>
         <span>CFP Coming Soon</span>
@@ -380,14 +400,25 @@ const SponsorButtonContent = ({ isOpen }: { isOpen: boolean }) => {
   if (isOpen) {
     // Active: Purple/Blue
     return (
-      <button className="relative overflow-hidden w-full sm:w-auto px-8 sm:px-10 py-4 sm:py-5 bg-gradient-to-r from-purple-600 via-blue-600 to-purple-600 text-white font-bold text-lg sm:text-xl rounded-2xl shadow-xl hover:shadow-blue-500/50 transition-all duration-300 ease-in-out border-2 border-purple-400 group-hover:border-blue-400 cursor-pointer">
+      <button className="relative overflow-hidden w-full px-6 sm:px-8 lg:px-10 py-3 sm:py-4 lg:py-5 bg-gradient-to-r from-purple-600 via-blue-600 to-purple-600 text-white font-bold text-base sm:text-lg lg:text-xl rounded-2xl shadow-xl hover:shadow-blue-500/50 transition-all duration-300 ease-in-out border-2 border-purple-400 group-hover:border-blue-400 cursor-pointer">
         <span className="absolute inset-0 bg-gradient-to-r from-blue-600 via-purple-600 to-blue-600 opacity-0 group-hover:opacity-100 transition-opacity duration-300"></span>
         <span className="relative flex items-center justify-center gap-3">
-          <motion.span animate={{ rotate: [0, 360] }} transition={{ duration: 3, repeat: Infinity, ease: 'linear' }}>
+          <motion.span
+            animate={{ rotate: [0, 360] }}
+            transition={{ duration: 3, repeat: Infinity, ease: 'linear' }}
+          >
             🤝
           </motion.span>
           <span>Become a Sponsor</span>
-          <motion.span animate={{ y: [0, -3, 0] }} transition={{ duration: 2, repeat: Infinity, ease: 'easeInOut', delay: 1 }}>
+          <motion.span
+            animate={{ y: [0, -3, 0] }}
+            transition={{
+              duration: 2,
+              repeat: Infinity,
+              ease: 'easeInOut',
+              delay: 1,
+            }}
+          >
             🚀
           </motion.span>
         </span>
@@ -396,7 +427,7 @@ const SponsorButtonContent = ({ isOpen }: { isOpen: boolean }) => {
   }
   // Disabled
   return (
-    <button className="relative overflow-hidden w-full sm:w-auto px-8 sm:px-10 py-4 sm:py-5 bg-slate-100 text-slate-400 font-bold text-lg sm:text-xl rounded-2xl border-2 border-slate-200 shadow-none cursor-not-allowed grayscale">
+    <button className="relative overflow-hidden w-full px-6 sm:px-8 lg:px-10 py-3 sm:py-4 lg:py-5 bg-slate-100 text-slate-400 font-bold text-base sm:text-lg lg:text-xl rounded-2xl border-2 border-slate-200 shadow-none cursor-not-allowed grayscale">
       <span className="relative flex items-center justify-center gap-3">
         <span>🤝</span>
         <span>Become Sponsor Soon</span>

src/Components/Navbar.tsx

@@ -21,15 +21,21 @@ const Navbar = () => {
   const [salesOpened] = useState(false);
 
   return (
-    <nav className={`sticky top-0 z-50 transition-all duration-300 ${
-      scrolled
-        ? 'bg-white/95 backdrop-blur-md shadow-lg border-b border-purple-200'
-        : 'bg-white/80 backdrop-blur-sm'
-    } rounded-2xl mx-2 mt-2 sm:mx-4 sm:mt-4`}>
+    <nav
+      className={`sticky top-0 z-50 transition-all duration-300 ${
+        scrolled
+          ? 'bg-white/95 backdrop-blur-md shadow-lg border-b border-purple-200'
+          : 'bg-white/80 backdrop-blur-sm'
+      } rounded-2xl mx-2 mt-2 sm:mx-4 sm:mt-4`}
+    >
       <div className="flex items-center justify-between p-3 sm:p-5">
         {/* Logo */}
         <div className="block h-8 p-0 sm:h-10 md:hidden">
-          <img src={Logo2025} alt="logo" className="w-full h-full drop-shadow-md" />
+          <img
+            src={Logo2025}
+            alt="logo"
+            className="w-full h-full drop-shadow-md"
+          />
         </div>
         <div className="hidden w-36 p-0 sm:w-48 md:block">
           <img src={Logo2025} alt="logo" className="drop-shadow-md" />
@@ -38,7 +44,10 @@ const Navbar = () => {
         {/* Desktop Navigation */}
         <div className="hidden md:flex items-center space-x-6 lg:space-x-9">
           <div className="group">
-            <Link to="/" className="relative font-semibold text-gray-700 hover:text-purple-600 transition-colors duration-300">
+            <Link
+              to="/"
+              className="relative font-semibold text-gray-700 hover:text-purple-600 transition-colors duration-300"
+            >
               🏠 Home
               <span className="absolute -bottom-1 left-0 w-0 h-0.5 bg-gradient-to-r from-purple-500 to-pink-500 group-hover:w-full transition-all duration-300"></span>
             </Link>
@@ -51,7 +60,10 @@ const Navbar = () => {
           </div> */}
 
           <div className="relative group">
-            <a href="#aboutUs" className="pointer-events-none text-gray-400 font-semibold">
+            <a
+              href="#aboutUs"
+              className="pointer-events-none text-gray-400 font-semibold"
+            >
               👥 About us
             </a>
             <div className="absolute -rotate-[8deg] w-28 top-5 -left-2 text-xs font-bold text-fuchsia-600 handwriting-1 animate-pulse">
@@ -62,18 +74,23 @@ const Navbar = () => {
 
           <div className="relative">
             <a
-              href={salesOpened ? undefined : "https://www.eventi.overnet.education/ServerlessDaysMilano2026#/tickets"}
+              href={
+                salesOpened
+                  ? undefined
+                  : 'https://www.eventi.overnet.education/ServerlessDaysMilano2026#/buyTickets/selectTickets'
+              }
               target="_blank"
-              className={salesOpened ? "cursor-not-allowed" : ""}
+              className={salesOpened ? 'cursor-not-allowed' : ''}
               onClick={(e) => salesOpened && e.preventDefault()} // Extra safety: prevents click if true
             >
               <Button
                 variant={'default'}
                 disabled={salesOpened}
                 className={`relative overflow-hidden font-bold text-white bg-gradient-to-r from-purple-600 to-pink-600 border-0 rounded-2xl text-sm px-6 py-3 shadow-xl transition-all duration-300 ease-in-out group
-                  ${salesOpened
-                    ? 'opacity-50 grayscale pointer-events-none' // Disables interaction & dims colors
-                    : 'hover:shadow-purple-500/50 hover:scale-105'
+                  ${
+                    salesOpened
+                      ? 'opacity-50 grayscale pointer-events-none' // Disables interaction & dims colors
+                      : 'hover:shadow-purple-500/50 hover:scale-105'
                   }`}
               >
                 <span className="absolute inset-0 bg-gradient-to-r from-pink-600 to-purple-600 opacity-0 group-hover:opacity-100 transition-opacity duration-300"></span>
@@ -140,13 +157,15 @@ const Navbar = () => {
               <div className="flex items-center space-x-3 py-3 px-4 rounded-xl bg-gray-100 text-gray-400 font-semibold relative">
                 <span>👥</span>
                 <span>About us</span>
-                <span className="absolute right-3 text-xs text-fuchsia-500 font-bold animate-pulse">Coming soon!</span>
+                <span className="absolute right-3 text-xs text-fuchsia-500 font-bold animate-pulse">
+                  Coming soon!
+                </span>
               </div>
             </div>
 
             <div className="block pt-2">
               <a
-                href="https://www.eventi.overnet.education/ServerlessDaysMilano2026#/tickets"
+                href="https://www.eventi.overnet.education/ServerlessDaysMilano2026#/buyTickets/selectTickets"
                 target="_blank"
                 onClick={() => setIsMobileMenuOpen(false)}
               >