// WireC — Full portfolio component // Sections: Nav · Hero · Work Index (peek + drawer carousel) // · Ads (scattered polaroids, modal) · About · Experience/Resume · Toolbox · Contact footer const PROJECTS = [ { id:"matrika", name:"Matrika", kind:"End-to-end brand", year:"2025", role:"Founder", blurb:"Matrika is an antenatal nutrition supplement in dissolvable powder form that blends into everyday Indian meals like dal, curry, and chapati. Unlike tablets, gummies, or liquids, it delivers key micronutrients through food itself, turning any meal into a clinically complete one for mother and baby.", tags:["Startup","Product Ideation","Women's Health","Pitch Deck","Nutraceuticals"], hero:"assets/Projects/Matrika/hero.png", slidesImgs:[ "assets/Projects/Matrika/slide-01.png", "assets/Projects/Matrika/slide-02.png", "assets/Projects/Matrika/slide-03.png", ], }, { id:"inkcraft", name:"InkCraft Communications", kind:"PR & Influencer Marketing Internship", year:"2024", role:"Influencer Marketing & PR Intern", blurb:"InkCraft Communications is a Goa-based 360-degree PR and brand solutions agency with clients spanning healthcare, F&B, hospitality, and lifestyle. Over two months, I handled influencer outreach and campaign execution for clients like Cafe Lilliput, and secured media coverage for Dr. Aisshwarya in publications including Moneycontrol and Spiceroute Magazine. I also built the agency's credentials deck during my final weeks.", tags:["PR","Influencer Marketing","Media Outreach","Agency","Internship"], hero:"assets/Projects/Inkcraft/hero.png", slidesImgs:[ "assets/Projects/Inkcraft/slide-01.png", "assets/Projects/Inkcraft/slide-02.png", "assets/Projects/Inkcraft/slide-03.png", ], }, { id:"flipkart", name:"Flipkart Reimagined", kind:"Independent Campaign Strategy", year:"2024", role:"Brand Strategist & Marketer", blurb:"A self-initiated campaign strategy that reimagines Flipkart's marketing around a single big idea: \"Har Mood Mein Flipkart.\" The concept positions Flipkart as an emotion-first brand rooted in everyday Indian life, spanning print, OOH, digital, video, and social formats. Every creative execution was conceptualized and designed independently.", tags:["Campaign Strategy","Brand Strategy","Integrated Marketing","Creative Direction","FMCG/E-Commerce"], hero:"assets/Projects/Flipkart/hero.png", slidesImgs:[ "assets/Projects/Flipkart/slide-01.png", "assets/Projects/Flipkart/slide-02.png", "assets/Projects/Flipkart/slide-03.png", "assets/Projects/Flipkart/slide-04.png", ], }, { id:"memotag", name:"MemoTag", kind:"Founder's Office Internship", year:"2024", role:"Founder's Office Intern · Social Media", blurb:"Memotag is a dementia-care startup where I worked directly with the founders across brand communication, social media, and sales. I managed content for LinkedIn, Instagram, and WhatsApp, built carousels and static posts around dementia awareness, and contributed to sales collaterals and stakeholder meetings with partnered medical professionals.", tags:["Social Media","Content Strategy","Healthcare","Founder's Office","Brand Communication"], hero:"assets/Projects/Memotag/hero.png", slidesImgs:[ "assets/Projects/Memotag/slide-01.png", "assets/Projects/Memotag/slide-02.png", ], }, { id:"agentr", name:"AgentR (Vibencode)", kind:"Social Media & PR Marketing Internship", year:"2026", role:"Social Media & PR Marketing Intern", blurb:"AgentR (by Vibencode) is an AI hiring intelligence platform that reasons over every resume using career trajectory analysis instead of ATS keyword matching — trusted by teams at Google, Morgan Stanley, and PitchBook. I lead content end-to-end: LinkedIn carousels and static posts, long-form explainers that educate hiring teams on what AgentR actually does, and pitch decks and marketing collateral that sharpen the brand's positioning for partners and clients.", tags:["Content Strategy","Social Media","Brand Collateral","Customer Education","B2B SaaS","Internship"], hero:"assets/Projects/AgentR/hero.png", slidesImgs:[ "assets/Projects/AgentR/slide-01.png", "assets/Projects/AgentR/slide-02.png", ], }, ]; // Polaroid layout: w/h are the photo area; the polaroid frame adds bottom caption space. const ADS = [ { id:"cello", label:"Cello Butterflow · Mr. Lamba Naam", img:"assets/Ads/Cello butterflow.jpg", take:"The ad perfectly captures the satisfying smoothness of a gel pen on paper, something every student relates to, and combines it with humor so naturally that it makes the whole concept instantly memorable." }, { id:"fevicol", label:"Fevicol · 1959 A Love Story", img:"assets/Ads/Fevicol.webp", take:"I loved how we can see generations unfold and the society's evolution when it comes to marriage through the pov of a furniture piece — and the music is just cherry on cake." }, { id:"glucon", label:"Glucon D", img:"assets/Ads/Glucon D.jpg", take:"This ad is absolutely timeless, turns the exhausting Indian summer into such a funny yet painfully relatable visual, which is exactly why people still remember, share, and connect with it even today." }, { id:"airtel", label:"Airtel · Har Ek Friend", img:"assets/Ads/Har ek friend.webp", take:"This ad became bigger than just a commercial by creating a relatable and flexible friendship template that people turned into endless memes and personal versions, making the tagline and jingle truly timeless." }, { id:"mptourism", label:"Madhya Pradesh Tourism · Hindustan Ka Dil Dekha", img:"assets/Ads/Madhya Pradesh Tourism.png", take:"The ad took a minimal yet visually striking approach instead of a typical tourism showcase, using seamless expressions, transitions, and editing so beautifully that it still feels memorable and emotionally special even years later." }, { id:"coke", label:"Coke · Umeedon Wali Dhoop", img:"assets/Ads/Umeedo wali dhoop.jpg", take:"What I love is that this ad goes beyond selling a product and instead delivers such a timeless message of hope and resilience that it stayed relevant enough to be recreated during the pandemic, proving how deeply Coca Cola understands human emotion." }, ]; const EXPERIENCE = [ { year:"2026 — Now", role:"Social Media & PR Marketing Intern", org:"Vibencode", notes:"Driving LinkedIn growth and earned media coverage for an AI-powered hiring platform." }, { year:"2026", role:"PR & Influencer Marketing Intern", org:"Inkcraft Communications", notes:"Running media outreach and influencer campaigns across lifestyle, beauty, and F&B brands." }, { year:"2024 — 2025", role:"Founder's Office Intern", org:"Memotag", notes:"Owning social media and cross-functional ops for a Shark Tank–featured dementia care voice AI." }, ]; const LEADERSHIP = [ { year:"2021 — 2024", role:"Vice President, Operations", org:"AIESEC in Ludhiana", notes:"Led GTM campaigns that drove a 40% lift in qualified leads and scaled bilateral partnerships across 10+ countries." }, ]; const HIGHLIGHTS = [ { text:"500K+ influencer reach across 30+ collaborations", org:"Inkcraft, 2026" }, { text:"Weekly content + cross-functional ops for a Shark Tank–featured dementia care voice AI", org:"Memotag, 2024–25" }, ]; const EDUCATION = [ { year:"2015 — 2019", role:"B.Des, Communication Design", org:"Srishti Institute · Bangalore" }, ]; function Nav() { const [active, setActive] = React.useState("work"); React.useEffect(() => { const ids = ["work","ads","about","resume","contact"]; const obs = new IntersectionObserver((entries) => { entries.forEach(e => { if (e.isIntersecting) setActive(e.target.id); }); }, { rootMargin: "-40% 0px -55% 0px" }); ids.forEach(id => { const el = document.getElementById(id); if (el) obs.observe(el); }); return () => obs.disconnect(); }, []); const link = (id, label) => (
  • document.getElementById(id)?.scrollIntoView({ behavior:"smooth", block:"start" })} className={active===id?"active":""} style={{ cursor:"pointer" }}>{label}
    • ); return ( ); } function Hero({ tweaks }) { const t = tweaks || {}; return (
    SNEHAL ✱ PR & MARKETING ✱ BANGALORE

    Brand stories,
    told with intent.

    Press pitches, LinkedIn carousels, pitch decks that put brands into the rooms they want to be in.

    See the work ↓ Get in touch →
    Snehal Ralhan
    ); } function WorkIndex({ onOpen }) { const [hov, setHov] = React.useState(0); const swatches = ["#efede8","#e7e4dc","#dedbd1","#d6d2c8","#cecabf","#c6c1b5"]; return (

    Index of Work

    hover → peek  ·  click → case study
    {PROJECTS.map((p, i) => (
    setHov(i)} onClick={() => onOpen(i)} style={{ display:"grid", gridTemplateColumns:"50px 1fr auto", alignItems:"center", gap: 20, padding: "22px 4px", borderBottom: "1px solid var(--line)", cursor:"pointer", color: hov===i? "var(--ink)":"var(--ink-mute)", transition:"color .2s, padding-left .25s", paddingLeft: hov===i? 12 : 4, }}> 0{i+1} {p.name} {p.kind.toUpperCase()} — {p.year} →
    ))}
    {/* peek panel */}
    {PROJECTS[hov].hero ? ( {PROJECTS[hov].name} ) : (
    COMING SOON
    )}
    {PROJECTS[hov].kind.toUpperCase()} · {PROJECTS[hov].year} peek →
    ); } function Drawer({ index, onClose, onPrev, onNext }) { const [slide, setSlide] = React.useState(0); const p = index !== null ? PROJECTS[index] : null; React.useEffect(() => { setSlide(0); }, [index]); const slideCount = p ? Math.max(1, (p.slidesImgs?.length || 0)) : 0; React.useEffect(() => { if (index === null) return; const k = (e) => { if (e.key === "Escape") onClose(); if (e.key === "ArrowLeft") setSlide(s => Math.max(0, s-1)); if (e.key === "ArrowRight") setSlide(s => Math.min(slideCount-1, s+1)); }; document.addEventListener("keydown", k); return () => document.removeEventListener("keydown", k); }, [index, p, slideCount]); if (index === null) return null; const swatches = ["#efede8","#e7e4dc","#dedbd1","#d6d2c8","#cecabf","#c6c1b5"]; const accent = swatches[index % swatches.length]; return (
    e.stopPropagation()} style={{ position:"relative", width:"min(900px, 100%)" }}> {/* close pill (outside the stamp so it's not clipped by the mask) */}
    {/* the stamp */}
    {/* hero image area */}
    {(p.slidesImgs && p.slidesImgs.length > 0) ? ( {`${p.name} ) : p.hero ? ( {p.name} ) : (
    COMING SOON
    )} {p.slidesImgs && p.slidesImgs.length > 0 && (
    {String(slide+1).padStart(2,'0')}/{String(p.slidesImgs.length).padStart(2,'0')}
    )}
    {p.slidesImgs && p.slidesImgs.length > 1 && (
    {p.slidesImgs.map((src,i)=>(
    setSlide(i)} style={{ aspectRatio:"4/3", cursor:"pointer", opacity: slide===i?1:.55, borderRadius: 3, transition:"opacity .15s", overflow:"hidden", background:"var(--paper)", border: slide===i ? "1.5px solid var(--ink)" : "1px solid var(--line-soft)", }}>
    ))}
    )}
    {p.kind.toUpperCase()} ✱ {p.year}

    {p.name}

    {p.role}

    {p.blurb}

    {p.tags.map(t =>
    {t}
    )}
    ROLE
    {p.role}
    YEAR
    {p.year}
    SCOPE
    {p.tags.slice(0,3).join(", ")}
    ); } function Polaroids({ title, caption, items, onPick }) { const photoColors = ["#efede8","#e7e4dc","#dedbd1","#d6d2c8","#cecabf","#c6c1b5"]; return (

    {title}

    {caption}
    {items.map((o, i) => (
    onPick(i)} className="polaroid lift" style={{ cursor:"pointer" }}>
    {o.img && ( {o.label} )}
    {o.label}
    ))}
    ); } function Modal({ item, onClose, label="Detail" }) { if (!item) return null; return (
    e.stopPropagation()} className="polaroid" style={{ width:"min(560px, 92vw)", padding: "18px 18px 0", position:"relative", }}>
    {item.img ? ( {item.label} ) : (
    {item.label}
    )}
    {label.toUpperCase()}{item.kind?` · ${item.kind.toUpperCase()}`:""}

    {item.label}

    {item.blurb || item.take}

    ); } function About() { return (

    About

    Snehal Ralhan
    says hi ✱

    I'm Snehal — PR and marketing, two years deep. I work the gap between brands and the people writing about them, mostly for consumer and healthtech companies. Recently wrapped my MBA, and right now I'm running social and PR for Vibencode, an AI hiring platform.

    Before this, Inkcraft Communications and Memotag. One taught me how the press cycle actually moves; the other taught me what a founder's calendar looks like at 11 PM.

    {["Bangalore, IN","~2 yrs experience","Open to full-time"].map(t =>
    {t}
    )}
    ); } function Resume() { const renderRow = (e, i, isFirst) => (
    {e.year}
    {e.role}
    {e.org.toUpperCase()}
    {e.notes}
    ); return (

    Résumé

    experience · leadership · highlights
    EXPERIENCE
    {EXPERIENCE.map((e, i) => renderRow(e, i, i===0))}
    LEADERSHIP
    {LEADERSHIP.map((e, i) => renderRow(e, i, i===0))}
    HIGHLIGHTS
      {HIGHLIGHTS.map((h, i) => (
    • {h.text}
      {h.org.toUpperCase()}
      • ))}
    ); } function Toolbox() { const tools = [ { name:"Jira", slug:"jira" }, { name:"Asana", slug:"asana" }, { name:"Trello", slug:"trello" }, { name:"G-Suite", src:"assets/tools/google-slides.svg" }, { name:"Filmora", src:"assets/tools/filmora.svg" }, { name:"Microsoft Excel", src:"assets/tools/excel.png" }, { name:"Miro", slug:"miro" }, { name:"Framer", slug:"framer" }, { name:"Notion", slug:"notion" }, { name:"Figma", slug:"figma" }, ]; return (

    Toolbox

    tools I reach for, in order
    {tools.map(t => (
    {`${t.name}{ e.currentTarget.style.display='none'; }} />
    {t.name}
    ))}
    {["Influencer Marketing","PR & Media Outreach","LinkedIn Strategy","Content Strategy","Brand Collateral","Stakeholder Management"].map(t =>
    {t}
    )}
    ); } const IconLinkedIn = () => ( ); const IconEmail = () => ( ); const IconPhone = () => ( ); const IconResume = () => ( ); function Footer() { const links = [ { label:"LinkedIn", value:"snehal-ralhan", href:"https://www.linkedin.com/in/snehal-ralhan/", Icon: IconLinkedIn }, { label:"Email", value:"snehal.ralh@gmail.com", href:"mailto:snehal.ralh@gmail.com", Icon: IconEmail }, { label:"Phone", value:"+91 98765 43210", href:"tel:+919876543210", Icon: IconPhone }, { label:"Résumé", value:"View on Google Docs", href:"https://docs.google.com/document/d/13Sx0SelEiL9HbeBrWddufwynTccRgcts/edit?usp=sharing&ouid=110028352139456504685&rtpof=true&sd=true", Icon: IconResume }, ]; return ( ); } const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{ "accent": "#6c6e54", "paper": "#ffffff", "highlight": "#f5e16c", "headlineSize": 72, "showHeroObjects": true, "showStickyOnDrawer": true, "showAvailability": true, "heroLine1": "Makes", "heroEm": "brands", "heroLine2": "that feel like", "heroHighlight": "things", "heroLine3": "you keep." }/*EDITMODE-END*/; function WireC() { const [drawer, setDrawer] = React.useState(null); const [adSel, setAdSel] = React.useState(null); const [t, setTweak] = useTweaks(TWEAK_DEFAULTS); // Apply tweaks live by overriding CSS vars + a few inline pieces React.useEffect(() => { const r = document.documentElement.style; r.setProperty('--sage', t.accent); r.setProperty('--sage-deep', t.accent); r.setProperty('--bg', t.paper); r.setProperty('--mustard', t.highlight); document.documentElement.dataset.heroSize = t.headlineSize; document.documentElement.dataset.showHero = t.showHeroObjects ? '1' : '0'; document.documentElement.dataset.showSticky = t.showStickyOnDrawer ? '1' : '0'; document.documentElement.dataset.showAvail = t.showAvailability ? '1' : '0'; }, [t]); return (
    ); } window.WireC = WireC;