const {Button,SectionLabel,Card,Input,Badge,DestinationCard,SeasonalCard,TierCard,StepItem,PullQuote}=window.VedutaDesignSystem_f6874f;
function Hero({onNavigate}){
  return <div style={{minHeight:'88vh',background:'var(--navy-deep)',display:'flex',flexDirection:'column',alignItems:'center',justifyContent:'center',textAlign:'center',padding:'80px 24px 120px',position:'relative',overflow:'hidden'}}>
    <img src="assets/hero-rome-sant-ivo.jpg" alt="Rome rooftops at dusk" style={{position:'absolute',inset:0,width:'100%',height:'100%',objectFit:'cover',animation:'vedKen 45s ease-in-out infinite alternate'}}/>
    <div style={{position:'absolute',inset:0,background:'linear-gradient(180deg,rgba(19,31,56,.78) 0%,rgba(27,42,74,.52) 48%,rgba(19,31,56,.86) 100%)'}}></div>
    <div style={{position:'absolute',bottom:0,left:'-10%',right:'-10%',height:'55%',background:'radial-gradient(ellipse 60% 70% at 50% 100%,rgba(201,169,110,.2),transparent 65%)',animation:'vedGlow 16s ease-in-out infinite',pointerEvents:'none'}}></div>
    <div style={{position:'relative',display:'flex',flexDirection:'column',alignItems:'center'}}>
    <SectionLabel style={{marginBottom:'26px'}}>Veduta Travel Club</SectionLabel>
    <h1 style={{margin:0,fontFamily:'var(--font-serif)',fontWeight:300,fontSize:'var(--text-hero)',lineHeight:'var(--leading-display)',color:'var(--text-on-dark)',maxWidth:'820px'}}>Curated Travel That's Always Beautiful, Never Boring.</h1>
    <p style={{margin:'26px 0 40px',maxWidth:'560px',fontFamily:'var(--font-sans)',fontWeight:300,fontSize:'18px',lineHeight:'var(--leading-body)',color:'rgba(245,241,232,.62)'}}>Fifteen destinations. Hundreds of personally vetted properties, restaurants, and experiences. We did the work. You just show up.</p>
    <div style={{display:'flex',gap:'16px',flexWrap:'wrap',justifyContent:'center'}}>
      <Button onClick={()=>onNavigate&&onNavigate('Membership')}>Explore Membership</Button>
      <Button variant="outlineLight" onClick={()=>{const el=document.getElementById('experience');if(el)el.scrollIntoView({behavior:'smooth'});}}>See What It Feels Like</Button>
    </div>
    </div>
    <div style={{position:'absolute',bottom:'26px',left:'50%',transform:'translateX(-50%)',width:'1px',height:'44px',background:'linear-gradient(180deg,var(--gold),transparent)'}}></div>
    <VCredit id="home"/>
  </div>;
}
function Ticker(){
  const cities=['Chicago','Miami','Mexico City','Prague','Rome','New York','London','Paris','Barcelona','Boston','Lake Geneva*','Saint Martin*','Santa Fe*','San Diego*','New Hampshire*'];
  return <div style={{background:'var(--charcoal)',padding:'18px 48px',display:'flex',alignItems:'center',gap:'28px',overflow:'hidden'}}>
    <span style={{fontSize:'11px',letterSpacing:'0.28em',textTransform:'uppercase',color:'var(--gold)',fontWeight:500,whiteSpace:'nowrap'}}>15 Destinations</span>
    <div style={{display:'flex',gap:'10px',whiteSpace:'nowrap',overflow:'hidden',fontFamily:'var(--font-sans)',fontWeight:300,fontSize:'13px',color:'rgba(245,241,232,.72)'}}>
      {cities.map((c,i)=><span key={c}>{c.endsWith('*')?<span>{c.slice(0,-1)} <span style={{color:'var(--gold)',fontSize:'10px',letterSpacing:'0.1em'}}>SEASONAL</span></span>:c}{i<cities.length-1&&<span style={{color:'var(--gold)',margin:'0 0 0 10px'}}>·</span>}</span>)}
    </div>
  </div>;
}
function Experience({onNavigate}){
  return <VSection id="experience" label="The Experience" headline="What it feels like">
    <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(280px,1fr))',gap:'56px',alignItems:'start'}}>
      <div style={{fontFamily:'var(--font-sans)',fontWeight:300,fontSize:'16.5px',lineHeight:'var(--leading-body)',color:'var(--text-body)',display:'flex',flexDirection:'column',gap:'20px'}}>
        <p style={{margin:0}}>You arrive at a beautiful apartment in the heart of the city. Check in was easy and you already have a curated list of the places that matter: where to eat tonight, where to get coffee tomorrow, where you can get groceries, and what's worth exploring in the area. Someone has looked into the options and vetted them before you so all you need to do is make your choice and enjoy your time!</p>
        <p style={{margin:0}}>We've done the curating, not the planning. High-end properties in amazing cities at prices you wouldn't expect for luxury travel, because we found the gems. If you love planning trips, the whole portfolio is yours to build from.</p>
        <p style={{margin:0}}>If you'd rather not, just ask. An easy preferences checklist becomes a full itinerary. We can even arrive before you do to make sure everything is perfect. And for accredited investors, there are properties you can own a piece of and travel to as part of the club.</p>
        <p style={{margin:0,fontFamily:'var(--font-serif)',fontStyle:'italic',fontSize:'22px',color:'var(--navy)'}}>Go big or go small, but no matter what, go travel!</p>
      </div>
      <div style={{display:'flex',flexDirection:'column',gap:'18px'}}>
        <Card kicker="In Your Portal" title="The City Guide" goldBorder>8–10 restaurants ranked by vibe, the coffee shop that opens at 6:30am, and the experience menu with one-tap booking.</Card>
        <Card kicker="Out the Door" title="The Neighborhood" goldBorder>Walkable to everything. Feels like you live here.</Card>
        <div onClick={()=>onNavigate&&onNavigate('Membership:concie-agent')} style={{cursor:'pointer'}} role="link" aria-label="See The Concie-agent on the Membership page">
          <Card kicker="On Your Phone" title="The Concierge" goldBorder>Only if you want the trip planned for you — start with an easy preferences checklist and we handle the rest, informed by first-hand knowledge of the local market.
            <span style={{display:'block',marginTop:'14px',fontFamily:'var(--font-sans)',fontSize:'11px',letterSpacing:'0.2em',textTransform:'uppercase',fontWeight:500,color:'var(--gold)'}}>See The Concie-agent →</span>
          </Card>
        </div>
      </div>
    </div>
  </VSection>;
}
function Difference(){
  const own=[['🕰️','Six hours reading reviews that contradict each other'],['🤞','Hoping the photos are real'],['🗂️','Fourteen browser tabs, three booking sites, one spreadsheet'],['📍','A neighborhood you picked from a map'],['🍽️','Dinner at the place closest to the hotel'],['📞','A hotline that opens a ticket'],['🔁','Starting from zero next trip']];
  const ved=['Pick a mood, book in 90 seconds','Every property personally scouted','One guide, already in your member portal','A neighborhood chosen before the property was','Dinner at the place we\u2019d send a friend','Details planned by someone who knows the market','A portfolio that already knows you'];
  const cell={fontFamily:'var(--font-sans)',fontWeight:300,fontSize:'15px',lineHeight:1.55,display:'flex',gap:'12px',alignItems:'baseline'};
  return <VSection bg="var(--cream-warm)" label="The Difference" headline="Your next trip, two ways">
    <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(320px,1fr))',gap:'26px'}}>
      <div style={{background:'rgba(45,45,45,.05)',border:'1px solid var(--border-subtle)',borderRadius:'var(--radius-lg)',padding:'36px'}}>
        <div style={{fontFamily:'var(--font-serif)',fontSize:'26px',color:'var(--charcoal)',marginBottom:'24px'}}>On your own</div>
        <div style={{display:'flex',flexDirection:'column',gap:'16px'}}>{own.map(([e,t])=><div key={t} style={{...cell,color:'var(--text-muted)'}}><span>{e}</span>{t}</div>)}</div>
      </div>
      <div style={{background:'var(--navy)',border:'1px solid var(--border-on-dark)',borderRadius:'var(--radius-lg)',padding:'36px'}}>
        <div style={{fontFamily:'var(--font-serif)',fontSize:'26px',color:'var(--gold)',marginBottom:'24px'}}>With Veduta</div>
        <div style={{display:'flex',flexDirection:'column',gap:'16px'}}>{ved.map(t=><div key={t} style={{...cell,color:'var(--text-on-dark)'}}><span style={{color:'var(--gold)'}}>·</span>{t}</div>)}</div>
      </div>
    </div>
  </VSection>;
}
function ExperienceLayer({onNavigate}){
  const items=[['Cook','var(--terracotta)','Private cooking classes in local homes. Pasta in a Roman grandmother\u2019s kitchen. Mezcal and mole in Roma Norte. Czech dumplings in Prague.'],['Explore','var(--olive)','Private tours, skip-the-line, after-hours visits. Early-morning Vatican. Architecture boat tour through Chicago. Gaudí walk from Sagrada Família to Park Güell.'],['Taste','var(--adriatic)','Wine tastings, market tours, impossible reservations. Natural wine in Le Marais. Czech brewery tour. La Boqueria market in Barcelona.']];
  return <VSection label="Beyond the Stay" headline="The experience layer">
    <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(260px,1fr))',gap:'22px'}}>
      {items.map(([t,c,body])=><div key={t} style={{background:'var(--surface-card)',border:'1px solid var(--border-subtle)',borderTop:'3px solid '+c,borderRadius:'var(--radius-md)',padding:'34px 30px'}}>
        <div style={{fontFamily:'var(--font-sans)',fontSize:'12px',letterSpacing:'0.28em',textTransform:'uppercase',fontWeight:500,color:c,marginBottom:'14px'}}>{t}</div>
        <p style={{margin:0,fontFamily:'var(--font-sans)',fontWeight:300,fontSize:'15px',lineHeight:'var(--leading-body)',color:'var(--text-body)'}}>{body}</p>
      </div>)}
    </div>
    <VUpsell tier="02" name="The Concie-agent" line="Every experience here, booked for you at partnership discounts — tell us where and when." onNavigate={onNavigate} style={{marginTop:'26px'}}/>
  </VSection>;
}
function Destinations({onOpenCity}){
  return <VSection bg="var(--cream-warm)" label="15 Destinations" headline="Your portfolio" intro="Every city personally scouted. Two domestic anchors, three European classics, five world-class concierge cities, and five seasonal escapes — one for every time of year.">
    <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(210px,1fr))',gap:'20px'}}>
      {window.VEDUTA_CITIES.map(([city,slug,tags])=><div key={city} onClick={()=>onOpenCity&&onOpenCity(city)} style={{cursor:'pointer'}}><DestinationCard city={city} gradient={slug} img={'assets/cities/'+slug+'/hero.jpg'} tags={tags}/></div>)}
    </div>
    <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(170px,1fr))',gap:'18px',marginTop:'26px'}}>
      {window.VEDUTA_SEASONALS.map(([e,c,s,se,slug])=><div key={c} onClick={()=>onOpenCity&&onOpenCity(c)} style={{cursor:'pointer'}}><VSeasonalCard emoji={e} city={c} subtitle={s} season={se} img={'assets/cities/'+slug+'/hero.jpg'}/></div>)}
    </div>
  </VSection>;
}
function Professional(){
  const feats=[['Work-Ready Stays','Every Professional property is vetted for fast wifi, a real desk, and quiet enough for calls.'],['Client Dinners','Restaurants in every guide flagged for business: quiet enough to talk, good enough to remember.'],['Team Travel','Two- and three-bedroom apartments that put a small team under one roof, with a kitchen for the debrief.'],['Stay the Weekend','Work ends Friday. Keep the same keys, and Saturday is already in your guide.']];
  return <VSection label="For Work, Too" headline="Your work trip just got better">
    <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(280px,1fr))',gap:'56px',alignItems:'center'}}>
      <div style={{display:'flex',flexDirection:'column',gap:'28px'}}>
        <p style={{margin:0,fontFamily:'var(--font-sans)',fontWeight:300,fontSize:'16.5px',lineHeight:'var(--leading-body)',color:'var(--text-body)'}}>Cities tagged <Badge mood="Professional" style={{margin:'0 4px'}}/> are built for the trip you have to take. Every property there is vetted for fast wifi, a real desk, and morning light, and every guide knows where to put a client dinner. When Friday comes, keep the keys: the same apartment, the same guide, and a weekend you didn't have to plan.</p>
        <Card kicker="Professional Accounts" title="Five for the price of four" goldBorder style={{padding:'22px 24px'}}>Professional Accounts can buy memberships for the whole team at a bulk discount: every fifth account is on us. One invoice, one guide per city, and everyone lands in the same neighborhood.</Card>
      </div>
      <div style={{display:'grid',gridTemplateColumns:'1fr 1fr',gap:'16px'}}>
        {feats.map(([t,d])=><Card key={t} title={t} style={{padding:'22px 24px'}}>{d}</Card>)}
      </div>
    </div>
  </VSection>;
}
function Tiers({onNavigate}){
  return <VSection bg="var(--navy)" dark label="Membership" headline="Your trip. Your terms.">
    <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(240px,1fr))',gap:'20px',paddingTop:'14px'}}>
      {window.VEDUTA_TIERS.map((t,i)=><TierCard key={t.number} {...t} onCta={()=>onNavigate&&onNavigate(i===3?'Ownership':'Apply:'+['database','concie-agent','scout'][i])}/>)}
    </div>
  </VSection>;
}
function HowItWorks({onNavigate}){
  const steps=[
    ['Set up your profile','Tell us how you travel: pace, budget, who you travel with, and the dates you already know you\u2019ll be away. Everything after this is built on it.'],
    ['Pick a mood','Browse the portfolio by feeling. Electric, Culture, Coast, Retreat, Professional. Every property, restaurant, and excursion already vetted.'],
    ['Book and show up','Choose your dates, book direct, and walk into a space that\u2019s exactly as promised, with the city guide already in your portal.'],
    ['Hand it to the Concie-agent','Tell us where and when. We book the flights, the stay, and the tables at partnership discounts, then build the full itinerary with you.','02','The Concie-agent','concie-agent'],
    ['Send The Scout ahead','For the trip that has to be perfect, we go first. Every step of your exact plan is checked in person before you land.','03','The Scout','scout'],
    ['Own a piece of it','For accredited investors: a one-tenth interest in one of the portfolio\u2019s best properties, with 21 days a year and rental income intended to offset costs. Each opportunity comes with its own legal agreement and documents.','04','The Owner','ownership']
  ];
  const kicker={display:'block',fontFamily:'var(--font-sans)',fontSize:'11px',letterSpacing:'0.22em',textTransform:'uppercase',fontWeight:500,color:'var(--gold)',marginBottom:'8px'};
  return <VSection label="Getting Started" headline="From first click to first trip" intro="Three steps every member takes, then three ways to go further.">
    <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(280px,1fr))',gap:'40px 48px'}}>
      {steps.map(([t,d,tier,name,slug],i)=><div key={t} onClick={slug?()=>onNavigate&&onNavigate(slug==='ownership'?'Ownership':'Membership:'+slug):undefined} style={slug?{cursor:'pointer'}:undefined}>
        <StepItem number={i+1} title={t}>
          {tier&&<span style={kicker}>Tier {tier} · {name}</span>}
          {d}
        </StepItem>
      </div>)}
    </div>
  </VSection>;
}
function Founder(){
  const body={margin:0,fontFamily:'var(--font-sans)',fontWeight:300,fontSize:'16.5px',lineHeight:'var(--leading-body)',color:'var(--text-body)'};
  return <VSection bg="var(--cream-warm)" label="The Founder" headline="Built by someone bit hard by the travel bug">
    <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(280px,1fr))',gap:'48px 64px',alignItems:'center'}}>
      <div style={{position:'relative',borderRadius:'var(--radius-lg)',overflow:'hidden',boxShadow:'var(--shadow-hover)',aspectRatio:'4/5',maxWidth:'460px',background:'var(--navy)'}} onError={e=>{e.currentTarget.style.display='none';}}>
        <img src="assets/founder/kevin.jpg" alt="Kevin Mackey, founder of Veduta Travel Club" style={{position:'absolute',inset:0,width:'100%',height:'100%',objectFit:'cover'}} onError={e=>{e.currentTarget.parentNode.style.display='none';}}/>
        <div style={{position:'absolute',left:0,right:0,bottom:0,padding:'18px 22px',background:'linear-gradient(180deg,transparent,rgba(19,31,56,.75))',fontFamily:'var(--font-sans)',fontSize:'11px',letterSpacing:'0.22em',textTransform:'uppercase',fontWeight:500,color:'var(--gold)'}}>Kevin Mackey · Founder &amp; CEO</div>
      </div>
      <div style={{display:'flex',flexDirection:'column',gap:'20px'}}>
        <p style={body}>Kevin Mackey got the travel bug when studying abroad in Rome during college in 2006. Since then, travel has been a staple of life! Kevin loves planning trips but leaving plenty of time for exploration. He also knows how tedious and time consuming planning the perfect trip can be, and how often you can settle for a snap decision because space was filling up or time was running out. Veduta Travel Club exists for the avid travelers who know what they want - beauty, luxury, adventure, low stress, and maximum fun.</p>
        <p style={body}>So let's build this club together. Join our fun group in whichever way makes the most sense for you. But most important, be cool, have fun, and be open to great experiences!</p>
        <div style={{marginTop:'14px'}}>
          <PullQuote attribution="Kevin Mackey" role="Founder & CEO, Veduta Travel Club" style={{maxWidth:'none'}}>If I wouldn't send a friend there, it's not in the portfolio.</PullQuote>
        </div>
      </div>
    </div>
  </VSection>;
}
function FinalCTA(){
  return <VSection bg="var(--grad-hero)" dark center headline="Launching Spring 2027" intro="Join the waitlist for founding member access and locked-in pricing.">
    <VWaitlist/>
  </VSection>;
}
function HomePage({onNavigate,onOpenCity}){
  return <div>
    <Hero onNavigate={onNavigate}/><Ticker/><Experience onNavigate={onNavigate}/><Difference/><ExperienceLayer onNavigate={onNavigate}/><Destinations onOpenCity={onOpenCity}/><Professional/><Tiers onNavigate={onNavigate}/><HowItWorks onNavigate={onNavigate}/><Founder/><FinalCTA/>
  </div>;
}
window.HomePage=HomePage;