Feat/partner cards bucher talk join form

components/hackathon/hackathon-challenge-partners.tsx

@@ -1,5 +1,107 @@
+"use client";
+
+import { useState } from "react";
 import Image from "next/image";
-import { challengePartners } from "@/lib/hackathon-2026-data";
+import { ChevronDown, ChevronUp } from "lucide-react";
+import { challengePartners, type ChallengePartner } from "@/lib/hackathon-2026-data";
+
+function ChallengePartnerCard({ partner }: { partner: ChallengePartner }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const hasDetails = Boolean(partner.details || partner.contact);
+
+    const summary = (
+        <>
+            <div className="relative w-full h-16 mb-4">
+                <Image
+                    src={partner.logo || "/placeholder.svg"}
+                    alt={partner.name}
+                    fill
+                    className="object-contain object-left"
+                    sizes="240px"
+                />
+            </div>
+            <div className="flex items-start justify-between gap-4">
+                <div>
+                    <h3 className="font-bold text-pq-dark-purple mb-1">
+                        {partner.name}
+                    </h3>
+                    <p className="text-gray-600 text-sm">{partner.description}</p>
+                </div>
+                {hasDetails && (
+                    <span className="text-pq-dark-purple flex-shrink-0 mt-0.5">
+                        {isOpen ? (
+                            <ChevronUp className="w-5 h-5" />
+                        ) : (
+                            <ChevronDown className="w-5 h-5" />
+                        )}
+                    </span>
+                )}
+            </div>
+        </>
+    );
+
+    return (
+        <div className="flex flex-col rounded-xl border border-gray-200 overflow-hidden">
+            {hasDetails ? (
+                <button
+                    type="button"
+                    onClick={() => setIsOpen(!isOpen)}
+                    aria-expanded={isOpen}
+                    className="w-full p-6 bg-white hover:bg-gray-50 transition-colors text-left"
+                >
+                    {summary}
+                </button>
+            ) : (
+                <div className="p-6">{summary}</div>
+            )}
+
+            {isOpen && hasDetails && (
+                <div className="border-t border-gray-100 p-6 bg-white flex flex-col gap-6">
+                    {partner.details && (
+                        <div className="flex flex-col gap-3">
+                            {partner.details.map((paragraph) => (
+                                <p key={paragraph} className="text-gray-600 text-sm">
+                                    {paragraph}
+                                </p>
+                            ))}
+                            {partner.website && (
+                                <p className="text-gray-600 text-sm">
+                                    More information:{" "}
+                                    <a
+                                        href={partner.website}
+                                        target="_blank"
+                                        rel="noopener noreferrer"
+                                        className="font-semibold text-pq-dark-purple underline hover:text-pq-bright-pink transition-colors"
+                                    >
+                                        {partner.website.replace(/^https?:\/\//, "")}
+                                    </a>
+                                </p>
+                            )}
+                        </div>
+                    )}
+                    {partner.contact && (
+                        <div className="flex flex-col gap-3">
+                            <div className="relative w-24 h-24 rounded-full overflow-hidden">
+                                <Image
+                                    src={partner.contact.image}
+                                    alt={partner.contact.name}
+                                    fill
+                                    className="object-cover"
+                                    sizes="96px"
+                                />
+                            </div>
+                            {partner.contact.intro.map((paragraph) => (
+                                <p key={paragraph} className="text-gray-600 text-sm">
+                                    {paragraph}
+                                </p>
+                            ))}
+                        </div>
+                    )}
+                </div>
+            )}
+        </div>
+    );
+}
 
 export function HackathonChallengePartners() {
     return (
@@ -9,28 +111,9 @@ export function HackathonChallengePartners() {
                     Meet the challenge partners
                 </h2>
 
-                <div className="grid grid-cols-1 sm:grid-cols-2 gap-6">
+                <div className="grid grid-cols-1 sm:grid-cols-2 gap-6 items-start">
                     {challengePartners.map((partner) => (
-                        <div
-                            key={partner.name}
-                            className="flex flex-col rounded-xl border border-gray-200 p-6"
-                        >
-                            <div className="relative w-full h-16 mb-4">
-                                <Image
-                                    src={partner.logo || "/placeholder.svg"}
-                                    alt={partner.name}
-                                    fill
-                                    className="object-contain object-left"
-                                    sizes="240px"
-                                />
-                            </div>
-                            <h3 className="font-bold text-pq-dark-purple mb-1">
-                                {partner.name}
-                            </h3>
-                            <p className="text-gray-600 text-sm">
-                                {partner.description}
-                            </p>
-                        </div>
+                        <ChallengePartnerCard key={partner.name} partner={partner} />
                     ))}
                 </div>
             </div>

components/header.tsx

@@ -4,6 +4,7 @@
 import Link from "next/link";
 import Image from "next/image";
 import { Button } from "@/components/ui/button";
+import { MEMBERSHIP_FORM_URL } from "@/lib/site-links";
 import { Menu, X } from "lucide-react";
 import { useState } from "react";
 
@@ -53,7 +54,9 @@ export function Header() {
                     </div>
 
                     <div className="hidden lg:block">
-                        <Button className="rounded-full px-6 bg-pq-bright-pink">Join Us</Button>
+                        <Button asChild className="rounded-full px-6 bg-pq-bright-pink">
+                            <a href={MEMBERSHIP_FORM_URL} target="_blank" rel="noopener noreferrer">Join Us</a>
+                        </Button>
                     </div>
 
                     {/* Mobile Menu Button */}
@@ -81,7 +84,9 @@ export function Header() {
                                     {link.label}
                                 </Link>
                             ))}
-                            <Button className="rounded-full w-fit mt-2 bg-pq-bright-pink">Join Us</Button>
+                            <Button asChild className="rounded-full w-fit mt-2 bg-pq-bright-pink">
+                                <a href={MEMBERSHIP_FORM_URL} target="_blank" rel="noopener noreferrer">Join Us</a>
+                            </Button>
                         </div>
                     </div>
                 )}

components/hero-section.tsx

@@ -1,5 +1,6 @@
 import { Linkedin, Instagram } from "lucide-react";
 import Image from "next/image";
+import { MEMBERSHIP_FORM_URL } from "@/lib/site-links";
 
 export function HeroSection() {
     return (
@@ -21,9 +22,14 @@ export function HeroSection() {
 
                         {/* CTA BUTTONS */}
                         <div className="mt-8 flex items-center gap-4">
-                            <button className="rounded-full bg-pink-500 px-7 py-3 text-sm font-semibold text-white transition hover:bg-pink-400">
+                            <a
+                                href={MEMBERSHIP_FORM_URL}
+                                target="_blank"
+                                rel="noopener noreferrer"
+                                className="rounded-full bg-pink-500 px-7 py-3 text-sm font-semibold text-white transition hover:bg-pink-400"
+                            >
                                 Join Us
-                            </button>
+                            </a>
 
                             <button className="rounded-full border border-white/40 px-7 py-3 text-sm font-semibold text-white transition hover:bg-white/10">
                                 Learn More

lib/conference-2026-data.ts

@@ -42,8 +42,9 @@ export const conferenceTalks: ConferenceTalk[] = [
         speaker: "Prof. Dr. Dominik Bucher",
         affiliation: "TUM",
         kind: "Scientific Talk",
-        title: "TBA",
-        abstract: LOREM,
+        title: "Optically Addressable Spins: From Solid-State Materials to Biochemical Systems",
+        abstract:
+            "Optically addressable spins have emerged as one of the key platforms for quantum technologies. In my talk, I will provide an overview of the field, starting with established solid-state systems such as the nitrogen-vacancy center in diamond and the boron-vacancy center in hexagonal boron nitride. I will then move beyond conventional materials to discuss recent advances in optically addressable spins in biological systems, including proteins and DNA. The talk will also address possible applications of these systems.",
     },
     {
         time: "12:00 - 12:45",

lib/hackathon-2026-data.ts

@@ -25,6 +25,17 @@ export interface ChallengePartner {
     name: string;
     logo: string;
     description: string;
+    /** Paragraphs about the company, shown when the card is expanded. */
+    details?: string[];
+    /** Partner website, linked below the details. */
+    website?: string;
+    /** The partner's contact person, shown below the details. */
+    contact?: {
+        name: string;
+        image: string;
+        /** Paragraphs of the contact's self-introduction. */
+        intro: string[];
+    };
 }
 
 export const challengePartners: ChallengePartner[] = [
@@ -42,11 +53,34 @@ export const challengePartners: ChallengePartner[] = [
         name: "IQM Quantum Computers",
         logo: "/logos/partners/iqm/IQM_Quantum_Computers_Logo.jpg",
         description: "Superconducting quantum computer manufacturer for research and industry.",
+        details: [
+            "IQM is a global leader in building quantum computers. IQM provides on-premises quantum computers for supercomputing centres, enterprises, and research labs and offers full access to its hardware. IQM also has a quantum computing cloud offering “IQM Resonance.”",
+            "IQM’s commercial quantum computers include Finland’s ongoing commercial 50-qubit quantum computer co-development project with VTT, IQM-led consortium’s (Q-Exa) HPC quantum accelerator in Germany, and IQM processors will also be used in the first quantum accelerator in Spain.",
+            "IQM has over 300+ employees, with offices in Espoo, Madrid, Munich, Palo Alto, Paris, Singapore, and Warsaw.",
+        ],
+        website: "https://www.iqm.tech",
+        contact: {
+            name: "Niklas",
+            image: "/images/hackathon/challenge-partners/iqm-niklas.jpg",
+            intro: [
+                "Hi, I’m Niklas! I started working in quantum computing four years ago, when I was hired by Fraunhofer FOKUS in Berlin to work on the Quantum SDK Qrisp. Since then, I have developed multiple algorithms as well as core modules of Qrisp, co-authored papers, and presented research at conferences. If you developed with Qrisp before you might have already stumbled across some of my work!",
+                "Since then I moved on to a community focused role at IQM, where I support everybody that works with the tools in the IQM ecosystem.",
+                "Everything we do here is to support you, our community members get the most out of IQM ecosystem and to learn and develop together!",
+                "Join us on this journey!",
+            ],
+        },
     },
     {
         name: "Qoro",
         logo: "/logos/partners/qoro/Qoro-Quantum-Banner-600x400.png",
         description: "Distributed quantum computing software for scaling quantum applications.",
+        contact: {
+            name: "Dr. Stephen DiAdamo",
+            image: "/images/hackathon/challenge-partners/qoro-stephen.png",
+            intro: [
+                "Dr. Stephen DiAdamo is the CTO and Co-Founder of Qoro Quantum. With a deep focus on quantum software, computing infrastructure, and tech innovation, Stephen leads Qoro Quantum’s technical strategy to make quantum computing accessible and impactful. He is passionate about supporting emerging developers and fostering the next wave of deep-tech innovation.",
+            ],
+        },
     },
 ];
 

lib/site-links.ts

@@ -0,0 +1,2 @@
+// Google Form for the current PushQuantum membership registration period.
+export const MEMBERSHIP_FORM_URL = "https://forms.gle/UbqciT425s9egyR68";