research.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Research | Abrol Lab</title>
    <meta name="description" content="Explore our current research projects and areas of focus">
    <link rel="stylesheet" href="css/styles.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
</head>

<body>
    <!-- Navigation -->
    <nav class="navbar">
        <div class="nav-container">
            <a href="index.html" class="nav-logo">Abrol Lab</a>
            <ul class="nav-menu">
                <li class="nav-item"><a href="index.html" class="nav-link">Home</a></li>
                <li class="nav-item"><a href="about.html" class="nav-link">About</a></li>
                <li class="nav-item"><a href="research.html" class="nav-link active">Research</a></li>
                <li class="nav-item"><a href="team.html" class="nav-link">Team</a></li>
                <li class="nav-item"><a href="publications.html" class="nav-link">Publications</a></li>
                <li class="nav-item"><a href="news.html" class="nav-link">Lab News</a></li>
                <li class="nav-item"><a href="contact.html" class="nav-link">Contact</a></li>
            </ul>
            <div class="hamburger">
                <span class="bar"></span>
                <span class="bar"></span>
                <span class="bar"></span>
            </div>
        </div>
    </nav>

    <!-- Page Header -->
    <section class="page-header">
        <div class="container">
            <h1 class="page-title fade-in">Our Research</h1>
            <p class="page-subtitle fade-in">Computational biophysics and structural bioinformatics of GPCR signaling</p>
        </div>
    </section>

    <!-- Research Overview -->
    <section class="section">
        <div class="container">
            <div class="research-intro fade-in-up" style="max-width: 900px; text-align: left;">
                <p style="font-size: 1.125rem; line-height: 1.8; margin-bottom: 1.5rem;">Dr. Abrol's research lab is focused on developing and using computational methods to probe how protein structure and biochemical interactions of G protein-coupled receptors (GPCRs) determine cellular signaling and physiology, as well as how this knowledge can be used for the rational design of drugs targeting GPCR signaling pathways.</p>
                
                <p style="font-size: 1.125rem; line-height: 1.8; margin-bottom: 1.5rem;">GPCRs are integral membrane proteins that form the largest superfamily in the human genome. The activation of these receptors regulates key physiological processes (e.g., neurotransmission, cellular metabolism, immunity, differentiation), through a balance of G protein-coupled and beta-arrestin-coupled signaling pathways. This has made them targets for ~50% of drugs in the clinic.</p>
                
                <p style="font-size: 1.125rem; line-height: 1.8; margin-bottom: 1.5rem;">Research in the Abrol Lab lies at the interface of Chemistry and Biology, using computational biophysics and structural bioinformatics to gain mechanistic insights into GPCR signaling. The research follows four major themes to connect the sequence, structure, and signaling of GPCRs:</p>
            </div>
        </div>
    </section>

    <!-- Research Areas -->
    <section class="section bg-light">
        <div class="container">
            <div class="section-header fade-in-up">
                <h2 class="section-title">Research Themes</h2>
                <p class="section-subtitle">Connecting sequence, structure, and signaling of GPCRs</p>
            </div>
            <div class="research-areas">
                <div class="research-area-card fade-in-up">
                    <h3>Theme 1: From Structure to Signaling</h3>
                    <p style="margin-bottom: 0.75rem;"><strong>How do GPCRs behave as allosteric machines and exhibit biased signaling?</strong></p>
                    <p>Developing next-generation computational methods to map the conformational space of GPCRs and predict their effects on intracellular signaling pathways.</p>
                </div>
                <div class="research-area-card fade-in-up">
                    <h3>Theme 2: From Sequence to Structure</h3>
                    <p style="margin-bottom: 0.75rem;"><strong>How do GPCRs fold in the membrane?</strong></p>
                    <p>Investigating the thermodynamics of GPCR insertion and folding in lipid bilayers to understand disease-associated mutations and develop therapeutic interventions using pharmacological chaperones.</p>
                </div>
                <div class="research-area-card fade-in-up">
                    <h3>Theme 3: From Sequence to Signaling</h3>
                    <p style="margin-bottom: 0.75rem;"><strong>How do GPCR sequence variations lead to observed signaling and disease?</strong></p>
                    <p>Building structural bioinformatics tools that combine evolutionary analysis with structural data to understand the role of specific residues in GPCR functional divergence.</p>
                </div>
                <div class="research-area-card fade-in-up">
                    <h3>Theme 4: Structure Based Drug Design</h3>
                    <p style="margin-bottom: 0.75rem;"><strong>How to rationally design treatments targeting specific pathways?</strong></p>
                    <p>Applying structure-based approaches to discover therapeutics for diabetes, melanoma, breast cancer, and neurodegenerative diseases (Parkinson's, Alzheimer's, multiple sclerosis) with high efficacy and reduced side-effects.</p>
                </div>
            </div>
        </div>
    </section>

    <!-- Current Projects -->
    <section class="section">
        <div class="container">
            <div class="section-header fade-in-up">
                <h2 class="section-title">Current Projects</h2>
                <p class="section-subtitle">Active research initiatives</p>
            </div>
            <div class="projects-grid">
                <div class="project-card fade-in-up">
                    <div class="project-image">
                        <div class="image-placeholder">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
                                <circle cx="8.5" cy="8.5" r="1.5" />
                                <polyline points="21 15 16 10 5 21" />
                            </svg>
                        </div>
                    </div>
                    <div class="project-content">
                        <span class="project-tag">Active</span>
                        <h3>Project Alpha</h3>
                        <p>Investigating advanced techniques for [specific challenge]. This project aims to develop a
                            comprehensive framework that can be applied across multiple domains.</p>
                        <div class="project-meta">
                            <span>Duration: 2024-2025</span>
                            <span>Funding: NSF Grant</span>
                        </div>
                    </div>
                </div>
                <div class="project-card fade-in-up">
                    <div class="project-image">
                        <div class="image-placeholder">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
                                <circle cx="8.5" cy="8.5" r="1.5" />
                                <polyline points="21 15 16 10 5 21" />
                            </svg>
                        </div>
                    </div>
                    <div class="project-content">
                        <span class="project-tag">Active</span>
                        <h3>Project Beta</h3>
                        <p>Developing innovative solutions for [real-world application]. Our interdisciplinary team is
                            working to create practical tools that can make a tangible impact.</p>
                        <div class="project-meta">
                            <span>Duration: 2023-2025</span>
                            <span>Collaboration: Industry Partner</span>
                        </div>
                    </div>
                </div>
                <div class="project-card fade-in-up">
                    <div class="project-image">
                        <div class="image-placeholder">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
                                <circle cx="8.5" cy="8.5" r="1.5" />
                                <polyline points="21 15 16 10 5 21" />
                            </svg>
                        </div>
                    </div>
                    <div class="project-content">
                        <span class="project-tag">Active</span>
                        <h3>Project Gamma</h3>
                        <p>Exploring the potential of [emerging technology] in addressing [specific problem]. This
                            cutting-edge research pushes the boundaries of current knowledge.</p>
                        <div class="project-meta">
                            <span>Duration: 2025-2026</span>
                            <span>Funding: University Grant</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Collaborations -->
    <section class="section">
        <div class="container">
            <div class="section-header fade-in-up">
                <h2 class="section-title">Collaborations</h2>
                <p class="section-subtitle">Partnering with leading institutions worldwide</p>
            </div>
            <div class="collaboration-grid fade-in-up">
                <div class="collaboration-card">
                    <div class="collaboration-logo">
                        <img src="images/Research/collaborations-icons/csun-logo.png" alt="CSUN Logo">
                    </div>
                    <h4>California State University, Northridge</h4>
                    <p>CSUN</p>
                </div>
                <div class="collaboration-card">
                    <div class="collaboration-logo">
                        <img src="images/Research/collaborations-icons/cedars-sinai-logo.png" alt="Cedars-Sinai Logo">
                    </div>
                    <h4>Cedars-Sinai</h4>
                    <p>Medical Center</p>
                </div>
                <div class="collaboration-card">
                    <div class="collaboration-logo">
                        <img src="images/Research/collaborations-icons/Tohoku-logo.png" alt="Tohoku University Logo">
                    </div>
                    <h4>Tohoku University</h4>
                    <p>Japan</p>
                </div>
                <div class="collaboration-card">
                    <div class="collaboration-logo">
                        <img src="images/Research/collaborations-icons/harvard-logo.png"
                            alt="Harvard Medical School Logo">
                    </div>
                    <h4>Harvard Medical School</h4>
                    <p>Massachusetts</p>
                </div>
                <div class="collaboration-card">
                    <div class="collaboration-logo">
                        <img src="images/Research/collaborations-icons/UToronto-logo.png"
                            alt="University of Toronto Logo">
                    </div>
                    <h4>University of Toronto</h4>
                    <p>Canada</p>
                </div>
                <div class="collaboration-card">
                    <div class="collaboration-logo">
                        <img src="images/Research/collaborations-icons/NCBI-logo.png" alt="NCBI Logo">
                    </div>
                    <h4>NCBI, National Institutes of Health</h4>
                    <p>NIH</p>
                </div>
                <div class="collaboration-card">
                    <div class="collaboration-logo">
                        <img src="images/Research/collaborations-icons/NCI-logo.png" alt="NCI Logo">
                    </div>
                    <h4>National Cancer Institute</h4>
                    <p>NIH</p>
                </div>
            </div>
        </div>
    </section>

    <!-- Funding Section -->
    <section class="section">
        <div class="container">
            <div class="section-header fade-in-up">
                <h2 class="section-title">Funding & Support</h2>
                <p class="section-subtitle">Grateful for the support of our funding partners</p>
            </div>
            <div class="funding-grid">
                <div class="funding-card fade-in-up">
                    <div class="funding-icon">
                        <img src="images/Research/funding-icons/nsf-logo.png" alt="National Science Foundation">
                    </div>
                    <h3>National Science Foundation</h3>
                </div>
                <div class="funding-card fade-in-up">
                    <div class="funding-icon">
                        <img src="images/Research/funding-icons/nih-logo.png" alt="National Institutes of Health">
                    </div>
                    <h3>National Institutes of Health</h3>
                </div>
                <div class="funding-card fade-in-up">
                    <div class="funding-icon">
                        <img src="images/Research/funding-icons/dod-logo.png" alt="Department of Defense">
                    </div>
                    <h3>Department of Defense</h3>
                </div>
            </div>
        </div>
    </section>

    <!-- Footer -->
    <footer class="footer">
        <div class="container">
            <div class="footer-content">
                <div class="footer-section">
                    <h3>Abrol Lab</h3>
                    <p>Advancing research and education in [Your Field]</p>
                </div>
                <div class="footer-section">
                    <h4>Quick Links</h4>
                    <ul>
                        <li><a href="about.html">About Us</a></li>
                        <li><a href="research.html">Research</a></li>
                        <li><a href="team.html">Team</a></li>
                        <li><a href="publications.html">Publications</a></li>
                        <li><a href="news.html">Lab News</a></li>
                    </ul>
                </div>
                <div class="footer-section">
                    <h4>Contact</h4>
                    <p>University Name<br>Department Building, Room XXX<br>City, State ZIP</p>
                </div>
            </div>
            <div class="footer-bottom">
                <p>&copy; 2025 Abrol Lab. All rights reserved.</p>
            </div>
        </div>
    </footer>

    <script src="js/script.js"></script>
</body>

</html>