:root{--navy:#06131c;--ink:#07131d;--paper:#f4efe5;--gold:#d8a64a;--gold-hi:#f0bf68;--muted:#8b9aa1}
*{box-sizing:border-box}
body{margin:0;background:var(--ink);color:var(--paper);font-family:Inter,sans-serif}
button{font:inherit;cursor:pointer}

/* ---- Page-level offset for the shared fixed header ---- */
main{padding-top:92px}
@media(max-width:720px){main{padding-top:84px}}

/* ---- Hero ---- */
.hero{max-width:1100px;text-align:center;margin:auto;padding:70px 5% 60px}
.eyebrow{font-size:10px;letter-spacing:.23em;color:var(--gold-hi);font-weight:700}
.hero h1{font:500 clamp(48px,7.5vw,90px)/.9 "Cormorant Garamond",serif;margin:20px 0}
.hero em{color:var(--gold-hi);font-style:normal}
.hero p{color:var(--muted);line-height:1.8;max-width:560px;margin:0 auto}

/* ---- Shell / entry panel ---- */
.shell{max-width:1200px;margin:auto;padding:0 5% 90px}
.panel{border:1px solid rgba(216,166,74,.19);padding:48px;background:#0b1b28}
.panel>p{color:var(--muted);line-height:1.8}
.panel h2,.question h2{font:500 46px/1.05 "Cormorant Garamond",serif;margin:10px 0}
.entries{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:35px}
.entry{position:relative;text-align:left;padding:26px;background:#091722;color:var(--paper);border:1px solid rgba(255,255,255,.05);transition:border-color .2s}
.entry:hover,.entry.active{border-color:rgba(240,191,104,.6)}
.entry small,.entry span{display:block;color:#7c8a91}
.entry b{display:block;font:600 24px "Cormorant Garamond",serif;margin:14px 0 4px}
.entry i{position:absolute;right:20px;top:50%;color:var(--gold-hi);font-size:22px;font-style:normal}

/* ---- Workspace: questions + live canvas ---- */
.workspace{display:grid;grid-template-columns:1fr 330px;min-height:560px;border:1px solid rgba(216,166,74,.19)}
.questions{padding:42px 5%}
.progress{display:flex;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.07);padding-bottom:16px;color:#6b7a81;font-size:10px;letter-spacing:.08em}
.progress span:first-child{color:var(--gold-hi)}
.question{max-width:700px;margin:65px auto}
.question h2{font-size:56px}
.question p{color:#8f9ca2}
.question input{width:100%;padding:18px;background:#0d2231;border:1px solid rgba(216,166,74,.4);color:#fff;font-size:16px;border-radius:2px}
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chip{background:#0c1e2b;border:1px solid rgba(255,255,255,.09);color:#c3ccd0;padding:13px 17px;border-radius:2px;transition:border-color .2s,color .2s}
.chip.selected{border-color:var(--gold-hi);color:#fff}
.actions{display:flex;justify-content:space-between;margin-top:35px}
.actions button:first-child{background:none;border:0;color:#7c8a91}
.actions button:last-child,.why button,.pass button{background:var(--gold-hi);border:0;padding:15px 24px;color:#191208;font-weight:700;border-radius:2px}
.free{display:block;color:#63727a;margin-top:30px;font-size:13px}
.canvas{padding:30px;background:#05111a;border-left:1px solid rgba(255,255,255,.05)}
.canvas .eyebrow span{float:right;color:#748188}
.route{font:500 32px "Cormorant Garamond",serif;margin:60px 0 40px;display:flex;gap:10px;flex-wrap:wrap;transition:opacity .3s}
.route b{color:var(--gold-hi);font-style:normal}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.stats div{border-top:1px solid rgba(255,255,255,.07);padding-top:12px;font-size:8px;letter-spacing:.14em;color:#6b7a81}
.stats strong{display:block;color:var(--paper);font:500 18px "Cormorant Garamond",serif;margin-top:7px;transition:opacity .25s}
.canvas footer{margin-top:140px;color:#6b7a81;font-size:10px}

/* ---- Searching / intelligence sequence ---- */
.searching{max-width:900px;margin:0 auto 100px;padding:0 5%;text-align:center}
.searching h2{font:500 clamp(34px,5vw,52px)/1.1 "Cormorant Garamond",serif;margin:14px 0 40px;color:var(--paper)}
.intel-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.06)}
.intel-col{background:var(--ink);padding:32px 30px;text-align:left}
.intel-col h3{font-size:10px;letter-spacing:.2em;color:var(--gold-hi);margin:0 0 18px;font-weight:700}
.understanding-list,.discovering-list{list-style:none;margin:0;padding:0}
.understanding-list li{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:14px;color:#c3ccd0;opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.understanding-list li.show{opacity:1;transform:none}
.understanding-list li b{color:var(--gold-hi);font-style:normal;width:16px}
.discovering-list li{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:14px;color:#6b7a81;opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease,color .3s}
.discovering-list li.show{opacity:1;transform:none}
.discovering-list li.active{color:#c3ccd0}
.discovering-list li.done{color:#c3ccd0}
.discovering-list li b{width:16px;color:var(--muted);font-style:normal}
.discovering-list li.done b,.discovering-list li.active b{color:var(--gold-hi)}
.searching-foot{margin-top:26px;font-size:11px;letter-spacing:.05em;color:#6b7a81}

/* ---- Destination reveal (the emotional highlight) ---- */
.reveal{max-width:1200px;margin:0 auto 100px;padding:0 5%;display:grid;grid-template-columns:1.4fr .7fr}
.image{min-height:600px;background-size:cover;background-position:center;position:relative;overflow:hidden}
.image:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(2,9,14,.92),rgba(2,9,14,.08) 62%)}
.imageText{position:absolute;z-index:1;left:45px;bottom:50px;right:45px}
.imageText .eyebrow{opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease}
.imageText h2{font:500 clamp(64px,8vw,116px) "Cormorant Garamond",serif;margin:10px 0;opacity:0;transform:translateY(14px);transition:opacity .6s ease .12s,transform .6s ease .12s}
.imageText p{color:#d9dfe1;opacity:0;transform:translateY(10px);transition:opacity .5s ease .28s,transform .5s ease .28s}
.reveal.in .imageText .eyebrow,.reveal.in .imageText h2,.reveal.in .imageText p{opacity:1;transform:none}
.image>small{position:absolute;z-index:2;right:14px;bottom:12px;color:rgba(255,255,255,.55);font-size:10px}
.why{padding:55px 45px;background:#0d1f2c;display:flex;flex-direction:column}
.why .eyebrow{opacity:0;transition:opacity .5s ease .4s}
.reveal.in .why .eyebrow{opacity:1}
.why h3{font:500 34px/1.1 "Cormorant Garamond",serif;opacity:0;transform:translateY(8px);transition:opacity .5s ease .5s,transform .5s ease .5s}
.reveal.in .why h3{opacity:1;transform:none}
.why ul{list-style:none;padding:0;margin:14px 0 24px;line-height:1.9;color:#a7b2b6}
.why ul li{opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.why ul li.show{opacity:1;transform:none}
.why li:before{content:'✓';color:var(--gold-hi);margin-right:10px}
.why button{width:100%;margin-top:auto;opacity:0;transition:opacity .5s ease .9s}
.reveal.in .why button{opacity:1}

/* ---- Destination matches ---- */
.destinations{max-width:1200px;margin:0 auto 100px;padding:0 5%}
.heading{display:flex;justify-content:space-between;align-items:end}
.heading h2{font:500 50px "Cormorant Garamond",serif;margin:10px 0 30px}
.heading small{color:#6b7a81}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.card{background:#0c1c28;border:1px solid rgba(255,255,255,.05);display:flex;flex-direction:column}
.photo{height:300px;background-size:cover;background-position:center;position:relative}
.match-badge{position:absolute;top:14px;right:14px;background:rgba(4,12,18,.82);border:1px solid rgba(240,191,104,.5);color:var(--gold-hi);font-size:11px;font-weight:700;letter-spacing:.04em;padding:6px 11px;border-radius:2px}
.cardBody{padding:24px;display:flex;flex-direction:column;flex:1}
.rank{color:var(--gold-hi);font-size:9px;letter-spacing:.15em}
.card h3{font:500 38px "Cormorant Garamond",serif;margin:8px 0}
.card p{color:#7c8a91;font-size:12px;line-height:1.6;min-height:48px}
.card button{width:100%;padding:12px;background:transparent;border:1px solid rgba(216,166,74,.55);color:var(--gold-hi);border-radius:2px;margin-top:auto}

/* ---- Trip Pass ---- */
.pass{border-top:1px solid rgba(216,166,74,.2);border-bottom:1px solid rgba(216,166,74,.2);text-align:center;padding:90px 5%;background:linear-gradient(120deg,#0e1f2d,var(--ink))}
.pass .eyebrow{display:block;margin-bottom:6px}
.pass h2{font:500 56px/1 "Cormorant Garamond",serif}
.pass p{max-width:680px;margin:20px auto;color:#8f9ca2;line-height:1.8}
.features{margin:28px auto;color:#a7b2b6;font-size:11px;word-spacing:12px}
.price{display:flex;justify-content:center;align-items:center;gap:32px;margin:32px 0}
.price strong{font:500 34px "Cormorant Garamond",serif}
.price small{font-size:14px;color:#7c8a91}
.pass small.legal{display:block;color:#63727a;font-size:11px;margin-top:6px}

/* ---- AI Journey Agent ---- */
.agent{max-width:900px;margin:90px auto;padding:0 5%}
.agentBox{padding:52px;background:#0a1925;border:1px solid rgba(216,166,74,.2)}
.agentBox h2{font:500 50px "Cormorant Garamond",serif;margin:12px 0}
.agentBox p{color:#8f9ca2}
.agentStep{padding:15px 0;border-bottom:1px solid rgba(255,255,255,.05);color:#6b7a81;font-size:12px;display:flex;align-items:center;gap:12px}
.agentStep.done,.agentStep.active{color:#b8c1c5}
.agentStep b{color:var(--gold-hi);font-style:normal;width:16px}

.hidden{display:none!important}

@media(max-width:800px){
  .entries,.cards,.reveal,.workspace,.intel-grid{grid-template-columns:1fr}
  .canvas{border-left:0;border-top:1px solid rgba(255,255,255,.05);min-height:280px}
  .canvas footer{margin-top:70px}
  .entry{padding:22px}
  .question{margin-top:45px}
  .question h2{font-size:42px}
  .reveal{padding:0}
  .image{min-height:480px}
  .why{padding:38px 24px}
  .heading{display:block}
  .heading small{display:block;margin-bottom:18px}
  .pass h2{font-size:44px}
  .price{flex-direction:column}
}