Summit brochure design - v0 by Vercel

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Sujith Kutty — Official Summit Brochure</title> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400&family=DM+Sans:wght@300;400;500;600&family=DM+Mono:wght@400;500&display=swap" rel="stylesheet" /> <style> *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } :root { --gold: #C9A84C; --gold-light: #E8C97A; --gold-dim: #7A6230; --ink: #0E0E0E; --ink-soft: #1C1A17; --paper: #F5F0E8; --paper-warm: #EDE6D6; --rule: #C9A84C44; --accent-red: #8B2020; --text-body: #2A2520; --text-muted: #6B6055; } html { scroll-behavior: smooth; } body { background: var(--paper); color: var(--text-body); font-family: 'DM Sans', sans-serif; font-weight: 400; line-height: 1.6; min-height: 100vh; } /* COVER */ .cover { background: var(--ink); color: var(--paper); min-height: 100vh; display: grid; grid-template-rows: auto 1fr auto; position: relative; overflow: hidden; } .cover::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent, transparent 79px, #C9A84C18 80px), repeating-linear-gradient(0deg, transparent, transparent 79px, #C9A84C18 80px); pointer-events: none; } .cover::after { content: ''; position: absolute; bottom: -120px; right: -120px; width: 500px; height: 500px; border-radius: 50%; background: radial-gradient(circle, #C9A84C22 0%, transparent 70%); pointer-events: none; } .cover-header { border-bottom: 1px solid #C9A84C44; padding: 20px 48px; display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 2; animation: fadeDown 0.8s ease both; } .org-badge { font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: 0.2em; color: var(--gold); text-transform: uppercase; } .edition-badge { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--text-muted); letter-spacing: 0.1em; } .cover-body { display: flex; flex-direction: column; justify-content: center; padding: 64px 48px; position: relative; z-index: 2; } .event-type { font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: 0.35em; color: var(--gold); text-transform: uppercase; margin-bottom: 24px; animation: fadeUp 0.8s 0.2s ease both; } .event-type::before { content: '▶ '; color: var(--gold-dim); } .cover-title { font-family: 'Playfair Display', serif; font-size: clamp(52px, 8vw, 96px); font-weight: 900; line-height: 0.95; letter-spacing: -0.02em; color: var(--paper); margin-bottom: 8px; animation: fadeUp 0.8s 0.35s ease both; } .cover-title span { color: var(--gold); font-style: italic; } .cover-subtitle { font-family: 'Playfair Display', serif; font-size: clamp(22px, 3.5vw, 38px); font-weight: 400; font-style: italic; color: #C9A84Caa; margin-bottom: 48px; animation: fadeUp 0.8s 0.5s ease both; } .cover-meta { display: flex; gap: 40px; flex-wrap: wrap; animation: fadeUp 0.8s 0.65s ease both; } .meta-item { display: flex; flex-direction: column; gap: 4px; } .meta-label { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.2em; color: var(--gold-dim); text-transform: uppercase; } .meta-value { font-size: 14px; color: var(--paper); font-weight: 500; } .cover-footer { border-top: 1px solid #C9A84C44; padding: 20px 48px; display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 2; animation: fadeUp 0.8s 0.8s ease both; } .cover-contacts { display: flex; gap: 32px; } .cover-contact { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--text-muted); } .cover-contact a { color: var(--gold); text-decoration: none; } .scroll-hint { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--gold-dim); letter-spacing: 0.1em; animation: pulse 2s ease-in-out infinite; } /* SECTIONS */ .section { max-width: 960px; margin: 0 auto; padding: 80px 48px; opacity: 0; transform: translateY(30px); transition: opacity 0.7s ease, transform 0.7s ease; } .section.visible { opacity: 1; transform: translateY(0); } .section-divider { border: none; border-top: 1px solid var(--rule); margin: 0 48px; } .section-label { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.35em; color: var(--gold); text-transform: uppercase; margin-bottom: 32px; display: flex; align-items: center; gap: 12px; } .section-label::after { content: ''; flex: 1; height: 1px; background: var(--rule); } /* SUMMARY */ .summary-text { font-family: 'Playfair Display', serif; font-size: clamp(20px, 3vw, 28px); font-weight: 400; font-style: italic; line-height: 1.55; color: var(--ink); max-width: 720px; border-left: 3px solid var(--gold); padding-left: 28px; } /* SPEAKER PROFILE */ .profile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--rule); border: 1px solid var(--rule); } .profile-cell { background: var(--paper); padding: 24px; } .profile-cell-label { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.2em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 8px; } .profile-cell-value { font-size: 15px; font-weight: 500; color: var(--ink); } /* AGENDA / SESSIONS */ .session-list { display: flex; flex-direction: column; gap: 0; } .session { display: grid; grid-template-columns: 120px 1fr; gap: 0; border-bottom: 1px solid var(--rule); padding: 28px 0; position: relative; } .session:first-child { padding-top: 0; } .session-period { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--gold); letter-spacing: 0.05em; padding-top: 4px; } .session-period .year { display: block; font-size: 18px; font-weight: 500; color: var(--ink); letter-spacing: 0; margin-bottom: 2px; font-family: 'Playfair Display', serif; } .session-content {} .session-title { font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 700; color: var(--ink); margin-bottom: 2px; } .session-org { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--gold-dim); letter-spacing: 0.1em; margin-bottom: 14px; } .session-points { list-style: none; display: flex; flex-direction: column; gap: 8px; } .session-points li { font-size: 14px; color: var(--text-muted); line-height: 1.5; display: flex; gap: 10px; align-items: flex-start; } .session-points li::before { content: '—'; color: var(--gold-dim); flex-shrink: 0; margin-top: 0; } /* SKILLS / AGENDA TOPICS */ .skills-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 2px; background: var(--rule); border: 1px solid var(--rule); } .skill-card { background: var(--paper); padding: 20px 22px; display: flex; flex-direction: column; gap: 8px; transition: background 0.2s; } .skill-card:hover { background: var(--ink); } .skill-card:hover .skill-name { color: var(--paper); } .skill-card:hover .skill-cat { color: var(--gold); } .skill-cat { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 0.25em; color: var(--gold-dim); text-transform: uppercase; transition: color 0.2s; } .skill-name { font-size: 15px; font-weight: 600; color: var(--ink); transition: color 0.2s; } /* CERTIFICATIONS */ .cert-list { display: flex; flex-direction: column; gap: 0; } .cert-row { display: grid; grid-template-columns: 1fr auto; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--rule); gap: 20px; } .cert-name { font-size: 15px; font-weight: 500; color: var(--ink); } .cert-year { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--gold); white-space: nowrap; } /* ACHIEVEMENTS */ .achievement-list { display: flex; flex-direction: column; gap: 20px; } .achievement { padding: 22px 24px; background: var(--paper-warm); border-left: 3px solid var(--gold); font-size: 14px; color: var(--text-body); line-height: 1.6; } /* REGISTER / CONTACT */ .register-block { background: var(--ink); color: var(--paper); padding: 64px 48px; text-align: center; position: relative; overflow: hidden; } .register-block::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent, transparent 79px, #C9A84C10 80px), repeating-linear-gradient(0deg, transparent, transparent 79px, #C9A84C10 80px); pointer-events: none; } .register-eyebrow { font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: 0.3em; color: var(--gold); text-transform: uppercase; margin-bottom: 20px; position: relative; } .register-title { font-family: 'Playfair Display', serif; font-size: clamp(28px, 5vw, 48px); font-weight: 700; color: var(--paper); margin-bottom: 12px; position: relative; } .register-sub { font-size: 15px; color: #8a8070; margin-bottom: 40px; position: relative; } .contact-chips { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; position: relative; } .chip { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--gold-dim); padding: 12px 24px; font-family: 'DM Mono', monospace; font-size: 12px; color: var(--gold); letter-spacing: 0.1em; text-decoration: none; transition: all 0.2s; } .chip:hover { background: var(--gold); color: var(--ink); border-color: var(--gold); } /* FOOTER */ .brochure-footer { background: var(--ink-soft); padding: 24px 48px; display: flex; justify-content: space-between; align-items: center; } .footer-brand { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--gold-dim); letter-spacing: 0.1em; } .footer-langs { font-family: 'DM Mono', monospace; font-size: 11px; color: #4a4540; letter-spacing: 0.1em; } /* ANIMATIONS */ @keyframes fadeDown { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } } @keyframes pulse { 0%, 100% { opacity: 0.4; } 50% { opacity: 1; } } /* RESPONSIVE */ @media (max-width: 640px) { .cover-header, .cover-body, .cover-footer { padding: 20px 24px; } .section { padding: 60px 24px; } .section-divider { margin: 0 24px; } .profile-grid { grid-template-columns: 1fr; } .session { grid-template-columns: 1fr; gap: 8px; } .brochure-footer { padding: 20px 24px; flex-direction: column; gap: 8px; text-align: center; } .register-block { padding: 48px 24px; } .cover-contacts { flex-direction: column; gap: 8px; } .cover-meta { gap: 24px; } } </style> </head> <body>  <section class="cover"> <div class="cover-header"> <span class="org-badge">Official Career Brochure</span> <span class="edition-badge">2026 Edition</span> </div> <div class="cover-body"> <p class="event-type">Revenue Growth & Sponsorship Sales</p> <h1 class="cover-title">Sujith<br><span>Kutty</span></h1> <p class="cover-subtitle">Business Manager, B2B Events & Partnership Sales</p> <div class="cover-meta"> <div class="meta-item"> <span class="meta-label">Current Role</span> <span class="meta-value">Business Manager — Inventicon</span> </div> <div class="meta-item"> <span class="meta-label">Location</span> <span class="meta-value">Pune, India</span> </div> <div class="meta-item"> <span class="meta-label">Specialisation</span> <span class="meta-value">Sponsorship Sales · Partnership Strategy</span> </div> </div> </div> <div class="cover-footer"> <div class="cover-contacts"> <span class="cover-contact">✉ <a href="mailto:sujithnk666@gmail.com">sujithnk666@gmail.com</a></span> <span class="cover-contact">☏ <a href="tel:7387588518">+91 73875 88518</a></span> </div> <span class="scroll-hint">↓ SCROLL TO EXPLORE</span> </div> </section>  <hr class="section-divider" /> <section class="section"> <p class="section-label">Executive Summary</p> <p class="summary-text"> A commercially driven sales professional with a track record of building high-value corporate partnerships across B2B events, healthtech, and ed-tech. Combines data-led market research with a consultative relationship approach — turning cold outreach into long-term client value. </p> </section>  <hr class="section-divider" /> <section class="section"> <p class="section-label">Speaker Profile</p> <div class="profile-grid"> <div class="profile-cell"> <div class="profile-cell-label">Domain Focus</div> <div class="profile-cell-value">B2B Event Sponsorship & Partnership Sales</div> </div> <div class="profile-cell"> <div class="profile-cell-label">Industry Verticals</div> <div class="profile-cell-value">Finance, Treasury, GRC, Procurement, HealthTech, EdTech</div> </div> <div class="profile-cell"> <div class="profile-cell-label">Career Span</div> <div class="profile-cell-value">2016 – Present · 8+ Years</div> </div> <div class="profile-cell"> <div class="profile-cell-label">Education</div> <div class="profile-cell-value">B.E. Electronics & Telecommunication — VIIT, Pune</div> </div> </div> </section>  <hr class="section-divider" /> <section class="section"> <p class="section-label">Career Journey</p> <div class="session-list"> <div class="session"> <div class="session-period"> <span class="year">2024</span> Nov – Present </div> <div class="session-content"> <div class="session-title">Business Manager — Sponsorship Sales</div> <div class="session-org">INVENTICON BUSINESS INTELLIGENCE PVT. LTD.</div> <ul class="session-points"> <li>Developed and executed strategic sponsorship sales plans resulting in a 30% increase in annual revenue.</li> <li>Cultivated corporate partnerships and sponsor relationships, improving client retention by 25%.</li> <li>Conducted market research to identify emerging sponsorship opportunities across finance, treasury, and procurement verticals.</li> <li>Negotiated and closed high-value partnership deals consistently within tight event timelines.</li> <li>Analyzed sponsorship performance metrics and delivered actionable insights to clients post-event.</li> <li>Represented the organisation at industry conferences, expanding the company's sponsor network.</li> </ul> </div> </div> <div class="session"> <div class="session-period"> <span class="year">2022</span> Apr – Jun 2023 </div> <div class="session-content"> <div class="session-title">Account Manager — Doctor Relations</div> <div class="session-org">BLACKTAIL MINDHOUSE PVT. LTD. (SHYFT)</div> <ul class="session-points"> <li>Managed a team of 3 account managers ensuring SLA adherence and client satisfaction.</li> <li>Executed a public relations campaign that significantly raised brand visibility in the health & wellness space.</li> <li>Developed a proactive account management strategy driving increased renewals and partner engagement.</li> </ul> </div> </div> <div class="session"> <div class="session-period"> <span class="year">2019</span> Sep – Dec 2020 </div> <div class="session-content"> <div class="session-title">Senior Business Development Associate</div> <div class="session-org">BYJU'S</div> <ul class="session-points"> <li>Built and maintained relationships with ******** needs and providing tailored learning solutions.</li> <li>Conducted market research to identify new business opportunities and stay ahead of EdTech trends.</li> <li>Collaborated cross-functionally to ensure smooth execution and exceptional customer experience.</li> </ul> </div> </div> <div class="session"> <div class="session-period"> <span class="year">2018</span> Aug – Mar 2019 </div> <div class="session-content"> <div class="session-title">Quality Analyst</div> <div class="session-org">CAPITA</div> <ul class="session-points"> <li>Developed and executed test plans to verify service quality, reliability, and performance.</li> <li>Identified and remedied defects in call agent processes; investigated customer complaints.</li> <li>Developed quality metrics dashboards enabling informed, fast decision-making by management.</li> </ul> </div> </div> <div class="session"> <div class="session-period"> <span class="year">2016</span> Nov – 2018 </div> <div class="session-content"> <div class="session-title">Technical Support Executive</div> <div class="session-org">CONCENTRIX</div> <ul class="session-points"> <li>Provided technical support to Virgin Media UK customers, managing complex queries over voice channels.</li> <li>Contributed to training materials and network monitoring processes.</li> <li>Part of the team that successfully transitioned a UK-based onshore process to offshore India — 2018.</li> </ul> </div> </div> </div> </section>  <hr class="section-divider" /> <section class="section"> <p class="section-label">Areas of Expertise</p> <div class="skills-grid"> <div class="skill-card"><span class="skill-cat">Core</span><span class="skill-name">Sponsorship Sales</span></div> <div class="skill-card"><span class="skill-cat">Core</span><span class="skill-name">Partnership Strategy</span></div> <div class="skill-card"><span class="skill-cat">Core</span><span class="skill-name">Revenue Growth</span></div> <div class="skill-card"><span class="skill-cat">Core</span><span class="skill-name">Client Retention</span></div> <div class="skill-card"><span class="skill-cat">Research</span><span class="skill-name">Market Research</span></div> <div class="skill-card"><span class="skill-cat">Research</span><span class="skill-name">Data Analytics</span></div> <div class="skill-card"><span class="skill-cat">Digital</span><span class="skill-name">Digital Marketing</span></div> <div class="skill-card"><span class="skill-cat">Digital</span><span class="skill-name">A/B Testing</span></div> <div class="skill-card"><span class="skill-cat">Leadership</span><span class="skill-name">Team Management</span></div> <div class="skill-card"><span class="skill-cat">Core</span><span class="skill-name">Communication</span></div> <div class="skill-card"><span class="skill-cat">Analytics</span><span class="skill-name">Google Analytics</span></div> <div class="skill-card"><span class="skill-cat">Digital</span><span class="skill-name">HubSpot · CRM</span></div> </div> </section>  <hr class="section-divider" /> <section class="section"> <p class="section-label">Notable Achievements</p> <div class="achievement-list"> <div class="achievement"> Selected as a key member of the team responsible for transitioning a UK-based onshore process to offshore India operations — one of the organisation's most complex operational migrations. <em>(Capita, 2018)</em> </div> <div class="achievement"> Presented research paper <strong>"Low Cost Voice Controlled Home Automation"</strong> at the IEEE International Conference during Vishwacon 2018 — VIIT, Pune. </div> <div class="achievement"> Completed a 4-week <strong>Advanced Telecom Training</strong> programme with BSNL, building a strong technical foundation that informs a data-driven approach to commercial roles. <em>(2016)</em> </div> </div> </section>  <hr class="section-divider" /> <section class="section"> <p class="section-label">Certifications & Credentials</p> <div class="cert-list"> <div class="cert-row"> <span class="cert-name">Digital Marketing: Lead Generation & Sales Conversion</span> <span class="cert-year">2020</span> </div> <div class="cert-row"> <span class="cert-name">Technology Entrepreneurship: Lab to Market</span> <span class="cert-year">2020</span> </div> <div class="cert-row"> <span class="cert-name">Google Analytics Certification</span> <span class="cert-year">—</span> </div> <div class="cert-row"> <span class="cert-name">HubSpot Content Marketing Certification</span> <span class="cert-year">—</span> </div> </div> </section>  <section class="register-block"> <p class="register-eyebrow">Open to Opportunities</p> <h2 class="register-title">Let's Build Something Together</h2> <p class="register-sub">Sponsorship sales · B2B partnerships · Revenue strategy · Pune, India</p> <div class="contact-chips"> <a class="chip" href="mailto:sujithnk666@gmail.com">✉ sujithnk666@gmail.com</a> <a class="chip" href="tel:7387588518">☏ +91 73875 88518</a> <a class="chip" href="https://www.linkedin.com/in/sujith-kutty-1a630715a" target="_blank">in LinkedIn</a> </div> </section> <footer class="brochure-footer"> <span class="footer-brand">SUJITH KUTTY · OFFICIAL CAREER BROCHURE · 2026</span> <span class="footer-langs">English · Hindi · Malayalam</span> </footer> <script> // Intersection Observer for scroll reveals const sections = document.querySelectorAll('.section'); const observer = new IntersectionObserver((entries) => { entries.forEach(entry => { if (entry.isIntersecting) { entry.target.classList.add('visible'); } }); }, { threshold: 0.1 }); sections.forEach(s => observer.observe(s)); </script> </body> </html>

Show full message

9d ago