/* RAJ — Rahgozar Tourism Agency — Editorial System */
:root{
  --container:1280px;
  --container-narrow:1040px;
  --color-primary:#111814;
  --color-primary-soft:#1C2621;
  --color-accent:#FF5A1F;
  --color-accent-2:#1A6B54;
  --color-accent-3:#E9C46A;
  --color-bg:#FBF8F3;
  --color-surface:#FFFFFF;
  --color-surface-2:#EFE9DD;
  --color-surface-3:#F6F1E8;
  --color-text:#171C19;
  --color-muted:#8B867F;
  --color-border:#E8E0D0;
  --color-border-strong:#D8D0C2;
  --color-success:#1A6B54;
  --shadow-sm:0 2px 12px rgba(17,24,20,0.06);
  --shadow-md:0 8px 32px rgba(17,24,20,0.10);
  --shadow-lg:0 20px 60px rgba(17,24,20,0.14);
  --radius-sm:10px;
  --radius-md:18px;
  --radius-lg:28px;
  --radius-pill:100px;
  --ease-standard:cubic-bezier(.4,0,.2,1);
  --ease-emphasis:cubic-bezier(.2,0,0,1);
  --font-body:"Vazirmatin", system-ui, -apple-system, sans-serif;
  --font-display:"Fraunces", "Vazirmatin", serif;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-7:32px; --space-8:40px; --space-9:56px; --space-10:80px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; background:var(--color-bg)}
body{
  margin:0; font-family:var(--font-body); background:var(--color-bg); color:var(--color-text);
  -webkit-font-smoothing:antialiased; line-height:1.7; overflow-x:hidden;
}
img{display:block; max-width:100%}
a{color:inherit; text-decoration:none}
button{font-family:inherit; cursor:pointer; border:0; background:none}
input, select, textarea{font-family:inherit}
.container{width:min(calc(100% - 32px), var(--container)); margin-inline:auto}
.serif{font-family:var(--font-display); font-weight:500; font-style:italic; letter-spacing:-0.02em}
.muted{color:var(--color-muted)}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; letter-spacing:0.12em; text-transform:uppercase; font-weight:700;
  color:var(--color-muted); border:1px solid var(--color-border); padding:6px 12px; border-radius:var(--radius-pill);
  background:var(--color-surface);
}
.eyebrow .dot{width:6px; height:6px; border-radius:50%; background:var(--color-accent); display:inline-block; box-shadow:0 0 0 4px rgba(255,90,31,0.15)}

/* Grain */
.grain{
  position:fixed; inset:0; pointer-events:none; z-index:9999; opacity:0.04; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius:var(--radius-pill); font-weight:700; transition:all .25s var(--ease-standard);
  white-space:nowrap; line-height:1;
}
.btn--primary{background:var(--color-primary); color:#fff; padding:14px 22px; box-shadow:var(--shadow-sm)}
.btn--primary:hover{background:var(--color-primary-soft); transform:translateY(-1px); box-shadow:var(--shadow-md)}
.btn--ghost{background:var(--color-surface); border:1px solid var(--color-border); color:var(--color-text); padding:14px 22px}
.btn--ghost:hover{border-color:var(--color-border-strong); transform:translateY(-1px)}
.btn--lg{padding:16px 26px; font-size:15px}
.btn--full{width:100%}
.icon-btn{
  width:40px; height:40px; border-radius:50%; display:grid; place-items:center;
  background:var(--color-surface); border:1px solid var(--color-border); position:relative; transition:.2s;
}
.icon-btn:hover{border-color:var(--color-border-strong); transform:translateY(-1px)}
.badge{
  position:absolute; top:-4px; right:-4px; background:var(--color-accent); color:#fff; font-size:10px;
  min-width:18px; height:18px; border-radius:20px; display:grid; place-items:center; padding:0 4px; font-weight:800;
}

/* NAV */
.nav{
  position:sticky; top:0; z-index:50; backdrop-filter:blur(16px);
  background:rgba(251,248,243,0.8); border-bottom:1px solid var(--color-border);
}
.nav__inner{width:min(calc(100% - 32px), var(--container)); margin:auto; height:72px; display:flex; align-items:center; justify-content:space-between; gap:16px}
.nav__logo{display:flex; align-items:center; gap:12px}
.logo-mark{
  width:36px; height:36px; border-radius:50%; background:var(--color-primary); color:#fff;
  display:grid; place-items:center; font-weight:900; font-size:18px;
}
.logo-type{display:flex; flex-direction:column; line-height:1}
.logo-type b{font-size:16px; font-weight:900; letter-spacing:-0.02em}
.logo-type i{font-style:normal; font-size:9px; letter-spacing:0.15em; color:var(--color-muted); font-weight:700}
.nav__links{display:flex; gap:28px; font-size:14px; font-weight:500}
.nav__links a{opacity:0.8; transition:.2s}
.nav__links a:hover{opacity:1}
.nav__actions{display:flex; align-items:center; gap:8px}
.nav__burger{display:none; width:40px; height:40px; border-radius:50%; border:1px solid var(--color-border); background:var(--color-surface); flex-direction:column; justify-content:center; align-items:center; gap:5px}
.nav__burger span{width:16px; height:1.5px; background:var(--color-text); display:block; transition:.2s}

/* Mobile menu */
.mobile-menu{
  position:fixed; inset:0; z-index:100; background:var(--color-bg); padding:24px;
  transform:translateX(100%); transition:transform .4s var(--ease-emphasis); display:flex; flex-direction:column;
}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu__head{display:flex; justify-content:space-between; align-items:center; margin-bottom:32px}
.mobile-menu a{font-size:32px; font-weight:800; padding:16px 0; border-bottom:1px solid var(--color-border)}
.mobile-menu__foot{margin-top:auto}
.mobile-menu__foot p{font-size:18px; line-height:1.5; margin-bottom:20px}

/* HERO */
.hero{position:relative; overflow:hidden; padding:32px 0 48px}
.hero__bg{position:absolute; inset:0; pointer-events:none}
.hero__topo{position:absolute; top:10%; left:0; width:100%; height:60%}
.hero__grid{display:grid; grid-template-columns:1.15fr 0.85fr; gap:40px; align-items:center; position:relative}
.hero__content{padding-top:24px}
.hero__title{font-size:clamp(44px, 7vw, 92px); line-height:0.95; font-weight:900; letter-spacing:-0.04em; margin:18px 0 18px}
.hero__title .line{display:block}
.hero__title em{font-family:var(--font-display); font-weight:400; font-style:italic; color:var(--color-accent); position:relative}
.hero__title em::after{content:''; position:absolute; left:0; right:0; bottom:0.12em; height:0.28em; background:rgba(255,90,31,0.18); z-index:-1; transform:rotate(-1deg)}
.hero__desc{font-size:clamp(16px,1.4vw,18px); color:#3A3E3B; max-width:48ch; line-height:1.9}
.hero__actions{display:flex; gap:12px; flex-wrap:wrap; margin-top:28px}
.hero__meta{display:flex; gap:28px; margin-top:36px; border-top:1px solid var(--color-border); padding-top:20px; max-width:420px}
.meta-item{display:flex; flex-direction:column; gap:2px}
.meta-item b{font-size:20px; font-weight:900; line-height:1}
.meta-item span{font-size:11px; color:var(--color-muted); letter-spacing:0.06em}

.hero__visual{position:relative; height:560px}
.visual-stack{position:relative; width:100%; height:100%}
.v-card{position:absolute; border-radius:var(--radius-md); overflow:hidden; background:var(--color-surface); box-shadow:var(--shadow-lg); border:1px solid rgba(0,0,0,0.06)}
.v-card img{width:100%; height:100%; object-fit:cover}
.v-card--1{width:68%; height:62%; top:4%; left:8%; transform:rotate(-2deg)}
.v-card--2{width:48%; height:42%; bottom:8%; left:0; transform:rotate(3deg); z-index:2}
.v-card--3{width:54%; height:38%; top:22%; right:2%; transform:rotate(4deg); z-index:1}
.v-card__label{position:absolute; bottom:10px; left:10px; right:10px; background:rgba(255,255,255,0.92); backdrop-filter:blur(8px); border-radius:12px; padding:8px 12px; display:flex; flex-direction:column; gap:1px}
.v-card__label span{font-size:10px; letter-spacing:0.1em; color:var(--color-muted); font-weight:700}
.v-card__label b{font-size:13px; font-weight:800}
.v-card__pin{position:absolute; bottom:10px; left:10px; background:var(--color-primary); color:#fff; font-size:11px; padding:6px 10px; border-radius:20px; font-weight:600}
.hero__stamp{
  position:absolute; bottom:0; right:12%; width:92px; height:92px; border-radius:50%; background:var(--color-surface);
  border:1px dashed var(--color-border-strong); display:grid; place-items:center; box-shadow:var(--shadow-sm)
}
.hero__stamp span{position:absolute; font-size:10px; font-weight:900; text-align:center; line-height:1.1}

/* Marquee */
.marquee{border-block:1px solid var(--color-border); background:var(--color-primary); color:var(--color-surface-3); overflow:hidden; white-space:nowrap; padding:10px 0}
.marquee__track{display:inline-flex; animation:marquee 40s linear infinite; gap:0}
.marquee__track span{font-size:13px; letter-spacing:0.18em; font-weight:700; padding-inline:18px; opacity:0.9}
@keyframes marquee{from{transform:translateX(0)} to{transform:translateX(-50%)}}

/* Promise */
.promise{padding:80px 0; border-bottom:1px solid var(--color-border)}
.promise__grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:40px}
.section-title{font-size:clamp(32px,4vw,54px); line-height:0.95; font-weight:900; letter-spacing:-0.03em; margin:0}
.promise__right p{font-size:18px; line-height:1.9; color:#2F3330; margin:0 0 24px}
.promise__points{display:grid; gap:14px; border-top:1px solid var(--color-border); padding-top:20px}
.promise__points div{display:flex; gap:14px; align-items:baseline}
.promise__points b{font-family:var(--font-display); font-size:20px; color:var(--color-accent)}
.promise__points span{font-size:14px; font-weight:500}

/* Moods */
.moods{padding:80px 0; background:var(--color-surface-3); border-bottom:1px solid var(--color-border)}
.section-head{display:flex; justify-content:space-between; gap:24px; align-items:end; margin-bottom:32px; flex-wrap:wrap}
.section-head h2{font-size:clamp(28px,3.5vw,44px); line-height:1; font-weight:900; letter-spacing:-0.03em; margin:12px 0 0}
.section-head p{max-width:36ch; color:var(--color-muted); font-size:14px; line-height:1.7}
.moods__grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.mood-card{
  position:relative; border-radius:var(--radius-lg); overflow:hidden; min-height:420px; background:var(--color-surface);
  border:1px solid var(--color-border); cursor:pointer; transition:all .4s var(--ease-emphasis);
  display:flex; flex-direction:column; justify-content:end; padding:18px; isolation:isolate;
}
.mood-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-1; transition:transform .6s var(--ease-emphasis)}
.mood-card::after{content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(17,24,20,0.85) 10%, rgba(17,24,20,0.1) 70%); z-index:-1}
.mood-card:hover img{transform:scale(1.06)}
.mood-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg)}
.mood-card.active{outline:2px solid var(--color-accent); outline-offset:2px}
.mood-card__top{position:absolute; top:16px; left:16px; right:16px; display:flex; justify-content:space-between; align-items:center}
.mood-card__tag{background:rgba(255,255,255,0.9); backdrop-filter:blur(6px); padding:6px 10px; border-radius:20px; font-size:11px; font-weight:700; letter-spacing:0.06em}
.mood-card__count{color:#fff; font-size:11px; opacity:0.8}
.mood-card h3{color:#fff; font-size:22px; font-weight:900; margin:0 0 6px; line-height:1.1}
.mood-card p{color:rgba(255,255,255,0.8); font-size:13px; line-height:1.6; margin:0 0 14px}
.mood-card__cta{display:inline-flex; align-items:center; gap:6px; color:#fff; font-size:13px; font-weight:700; border:1px solid rgba(255,255,255,0.3); padding:8px 12px; border-radius:20px; background:rgba(255,255,255,0.12); backdrop-filter:blur(4px)}

/* Builder */
.builder{padding:80px 0; background:var(--color-bg)}
.builder__grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:48px; align-items:start}
.builder__controls h3{font-size:28px; font-weight:900; letter-spacing:-0.02em; margin:12px 0 28px; line-height:1.1}
.control-group{margin-bottom:28px}
.control-group label{display:block; font-size:12px; font-weight:700; letter-spacing:0.08em; color:var(--color-muted); margin-bottom:10px; text-transform:uppercase}
.pills{display:flex; flex-wrap:wrap; gap:8px}
.pill{
  padding:10px 16px; border-radius:var(--radius-pill); border:1px solid var(--color-border); background:var(--color-surface);
  font-size:13px; font-weight:600; transition:.2s;
}
.pill.active{background:var(--color-primary); color:#fff; border-color:var(--color-primary)}
.builder__hint{display:flex; gap:8px; align-items:start; background:var(--color-surface-3); border:1px solid var(--color-border); padding:12px 14px; border-radius:12px; font-size:12px; line-height:1.6; color:var(--color-muted)}
.builder__preview{position:sticky; top:96px}
.preview-card{
  background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md)
}
.preview-card__img{position:relative; height:280px; overflow:hidden}
.preview-card__img img{width:100%; height:100%; object-fit:cover}
.preview-card__img::after{content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,0.4), transparent 50%)}
.preview-card__badge{position:absolute; top:16px; right:16px; background:var(--color-accent); color:#fff; padding:6px 12px; border-radius:20px; font-size:11px; font-weight:800; z-index:1}
.preview-card__body{padding:20px}
.preview-card__meta{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px}
.preview-card__meta span{font-size:11px; padding:5px 10px; border-radius:20px; background:var(--color-surface-3); border:1px solid var(--color-border); font-weight:600}
.preview-card h4{font-size:22px; font-weight:900; line-height:1.15; margin:0 0 8px}
.preview-card p{font-size:14px; color:var(--color-muted); line-height:1.7; margin:0 0 16px}
.preview-card__route{display:flex; align-items:center; gap:8px; background:var(--color-surface-3); border-radius:12px; padding:10px 12px; margin-bottom:16px; overflow-x:auto}
.preview-card__route span{white-space:nowrap; font-size:12px; font-weight:700}
.preview-card__route i{width:20px; height:1px; background:var(--color-border-strong); display:inline-block; position:relative}
.preview-card__route i::after{content:''; position:absolute; right:-3px; top:-2px; width:5px; height:5px; border-right:1px solid var(--color-border-strong); border-top:1px solid var(--color-border-strong); transform:rotate(45deg)}
.preview-card__foot{display:flex; justify-content:space-between; align-items:center; gap:12px}
.preview-card__price b{font-size:20px; font-weight:900}
.preview-card__price span{font-size:12px; color:var(--color-muted)}

/* Journeys */
.journeys{padding:80px 0; background:var(--color-surface); border-block:1px solid var(--color-border)}
.journeys__head{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; align-items:end; margin-bottom:20px}
.journeys__head h2{font-size:clamp(26px,3vw,38px); font-weight:900; line-height:1.05; letter-spacing:-0.02em; margin:10px 0 0}
.journeys__tools{display:flex; gap:10px; align-items:center}
.search-box{position:relative; display:flex; align-items:center}
.search-box input{
  width:280px; height:44px; border-radius:var(--radius-pill); border:1px solid var(--color-border); background:var(--color-bg);
  padding:0 40px 0 16px; font-size:13px; outline:none; transition:.2s;
}
.search-box input:focus{border-color:var(--color-primary); background:#fff}
.search-box svg{position:absolute; left:14px; opacity:0.5}
.select{height:44px; border-radius:var(--radius-pill); border:1px solid var(--color-border); background:var(--color-bg); padding:0 14px; font-size:13px; font-weight:600}
.filter-bar{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin:20px 0 28px; padding:14px; background:var(--color-bg); border:1px solid var(--color-border); border-radius:var(--radius-md)}
.filter-chips{display:flex; gap:8px; flex-wrap:wrap}
.chip{padding:8px 14px; border-radius:var(--radius-pill); border:1px solid var(--color-border); background:var(--color-surface); font-size:13px; font-weight:600; transition:.2s}
.chip.active{background:var(--color-primary); color:#fff; border-color:var(--color-primary)}
.filter-meta{font-size:12px; color:var(--color-muted); font-weight:600}
.journeys__grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.j-card-trip{
  background:var(--color-bg); border:1px solid var(--color-border); border-radius:var(--radius-lg); overflow:hidden; transition:.3s var(--ease-standard); display:flex; flex-direction:column;
}
.j-card-trip:hover{transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--color-border-strong)}
.j-card-trip__img{position:relative; height:240px; overflow:hidden}
.j-card-trip__img img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease-emphasis)}
.j-card-trip:hover .j-card-trip__img img{transform:scale(1.05)}
.j-card-trip__top{position:absolute; top:12px; left:12px; right:12px; display:flex; justify-content:space-between; z-index:1}
.j-card-trip__tag{background:rgba(255,255,255,0.92); backdrop-filter:blur(8px); padding:6px 10px; border-radius:20px; font-size:11px; font-weight:800; letter-spacing:0.04em}
.j-card-trip__fav{width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,0.9); display:grid; place-items:center; border:0; transition:.2s}
.j-card-trip__fav.active{color:var(--color-accent)}
.j-card-trip__body{padding:16px; display:flex; flex-direction:column; flex:1}
.j-card-trip__meta{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px}
.j-card-trip__meta span{font-size:11px; padding:4px 8px; border-radius:20px; background:var(--color-surface); border:1px solid var(--color-border); font-weight:600; color:var(--color-muted)}
.j-card-trip__body h3{font-size:18px; font-weight:900; line-height:1.25; margin:0 0 6px}
.j-card-trip__body p{font-size:13px; color:var(--color-muted); line-height:1.6; margin:0 0 14px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:40px}
.j-card-trip__foot{margin-top:auto; display:flex; justify-content:space-between; align-items:center; border-top:1px dashed var(--color-border); padding-top:12px}
.j-card-trip__price b{font-size:16px; font-weight:900}
.j-card-trip__price s{font-size:11px; color:var(--color-muted); margin-right:6px}
.j-card-trip__actions{display:flex; gap:6px}

/* Spotlight */
.spotlight{padding:80px 0; background:var(--color-surface-3)}
.spotlight__grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:48px; align-items:center}
.spotlight__map{position:relative}
.map-paper{
  background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:16px; box-shadow:var(--shadow-md);
  position:relative; aspect-ratio:4/5.2; overflow:hidden;
}
.route-svg{width:100%; height:100%; position:absolute; inset:0}
.map-labels span{position:absolute; background:var(--color-primary); color:#fff; font-size:11px; font-weight:700; padding:4px 8px; border-radius:20px}
.map-grain{position:absolute; inset:0; opacity:0.06; background-image:radial-gradient(#000 1px, transparent 1px); background-size:14px 14px; pointer-events:none}
.spotlight__content h2{font-size:clamp(28px,3.5vw,48px); font-weight:900; line-height:0.95; letter-spacing:-0.03em; margin:12px 0 16px}
.spotlight__desc{font-size:16px; line-height:1.8; color:#2F3330; margin:0 0 24px; max-width:48ch}
.accordion{display:grid; gap:8px}
.acc-item{background:var(--color-surface); border:1px solid var(--color-border); border-radius:14px; overflow:hidden; transition:.2s}
.acc-item.active{border-color:var(--color-primary); box-shadow:var(--shadow-sm)}
.acc-head{width:100%; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 16px; text-align:right}
.acc-head b{font-size:14px; font-weight:800}
.acc-head span{font-size:11px; color:var(--color-muted); margin-right:auto}
.acc-head i{font-style:normal; font-size:18px; width:28px; height:28px; border-radius:50%; background:var(--color-bg); display:grid; place-items:center; border:1px solid var(--color-border)}
.acc-body{display:none; padding:0 16px 16px; font-size:13px; line-height:1.7; color:var(--color-muted)}
.acc-item.active .acc-body{display:block}
.acc-tags{display:flex; gap:6px; margin-top:10px; flex-wrap:wrap}
.acc-tags span{font-size:11px; padding:4px 8px; border-radius:20px; background:var(--color-surface-3); border:1px solid var(--color-border)}
.spotlight__cta{display:flex; gap:16px; align-items:center; flex-wrap:wrap; margin-top:24px}
.price-note{font-size:12px; color:var(--color-muted)}
.price-note b{color:var(--color-text); font-size:14px}

/* Journal */
.journal{padding:80px 0; background:var(--color-surface); border-top:1px solid var(--color-border)}
.link{font-size:13px; font-weight:700; border:1px solid var(--color-border); padding:8px 14px; border-radius:20px; background:var(--color-bg); transition:.2s}
.link:hover{border-color:var(--color-text)}
.journal__grid{display:grid; grid-template-columns:1.4fr 0.9fr; gap:20px}
.j-card{border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--color-border); background:var(--color-bg); transition:.3s}
.j-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-sm)}
.j-card--large{display:grid; grid-template-columns:1.1fr 0.9fr; min-height:380px}
.j-card--large img{height:100%; object-fit:cover}
.j-card__body{padding:20px; display:flex; flex-direction:column}
.j-meta{display:flex; gap:6px; font-size:11px; color:var(--color-muted); font-weight:700; letter-spacing:0.06em; margin-bottom:10px}
.j-card h3{font-size:20px; font-weight:900; line-height:1.2; margin:0 0 8px}
.j-card p{font-size:13px; color:var(--color-muted); line-height:1.7; margin:0 0 16px}
.j-author{display:flex; align-items:center; gap:8px; margin-top:auto; font-size:12px; color:var(--color-muted)}
.j-author img{width:28px; height:28px; border-radius:50%}
.j-side{display:grid; gap:16px}
.j-card--small{display:grid; grid-template-columns:120px 1fr; min-height:120px}
.j-card--small img{height:100%; object-fit:cover}
.j-card--small h3{font-size:14px}
.j-card--quote{padding:20px; background:var(--color-primary); color:#fff; display:flex; flex-direction:column; justify-content:center}
.j-card--quote blockquote{font-size:16px; font-weight:700; line-height:1.5; margin:0 0 10px; font-family:var(--font-display)}
.j-card--quote span{font-size:11px; opacity:0.7}

/* How */
.how{padding:80px 0; background:var(--color-bg); border-top:1px solid var(--color-border)}
.how__grid{display:grid; grid-template-columns:0.8fr 1.2fr; gap:48px}
.how__sticky{position:sticky; top:96px}
.how__sticky h2{font-size:clamp(28px,3vw,44px); font-weight:900; line-height:0.95; letter-spacing:-0.03em; margin:12px 0 12px}
.how__sticky p{color:var(--color-muted); font-size:14px; line-height:1.7; margin:0 0 20px; max-width:34ch}
.how__steps{display:grid; gap:48px; border-right:1px dashed var(--color-border); padding-right:32px; position:relative}
.step{display:grid; grid-template-columns:80px 1fr; gap:16px}
.step__num{font-family:var(--font-display); font-size:48px; font-weight:900; line-height:0.9; color:var(--color-border-strong)}
.step__content h3{font-size:18px; font-weight:900; margin:0 0 8px}
.step__content p{font-size:14px; line-height:1.8; color:#2F3330; margin:0 0 12px}
.step__content ul{margin:0; padding:0; list-style:none; display:grid; gap:6px}
.step__content li{font-size:13px; color:var(--color-muted); display:flex; gap:8px; align-items:center}
.step__content li::before{content:'—'; color:var(--color-accent)}

/* Reviews */
.reviews{padding:60px 0; background:var(--color-primary); color:#fff; overflow:hidden}
.reviews__head{display:flex; justify-content:space-between; align-items:center; margin-bottom:24px}
.reviews__head h2{font-size:28px; font-weight:900; margin:0}
.reviews__nav{display:flex; gap:8px}
.reviews__nav .icon-btn{background:rgba(255,255,255,0.1); border-color:rgba(255,255,255,0.2); color:#fff}
.reviews__track{display:flex; gap:16px; overflow-x:auto; scrollbar-width:none; scroll-behavior:smooth; padding-bottom:10px}
.reviews__track::-webkit-scrollbar{display:none}
.rev-card{min-width:340px; max-width:340px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.12); border-radius:var(--radius-lg); padding:20px; backdrop-filter:blur(8px)}
.rev-card__head{display:flex; gap:12px; align-items:center; margin-bottom:14px}
.rev-card__head img{width:40px; height:40px; border-radius:50%}
.rev-card__head b{font-size:14px; display:block}
.rev-card__head span{font-size:11px; opacity:0.7}
.rev-card p{font-size:14px; line-height:1.7; opacity:0.9; margin:0 0 12px}
.rev-card__meta{display:flex; gap:6px}
.rev-card__meta span{font-size:11px; padding:4px 8px; border-radius:20px; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.12)}

/* FAQ */
.faq{padding:80px 0; background:var(--color-surface-3); border-top:1px solid var(--color-border)}
.faq__grid{display:grid; grid-template-columns:0.8fr 1.2fr; gap:48px}
.faq__grid h2{font-size:clamp(28px,3vw,44px); font-weight:900; line-height:0.95; margin:12px 0}
.faq__list{display:grid; gap:10px}
.faq-item{background:var(--color-surface); border:1px solid var(--color-border); border-radius:14px; overflow:hidden}
.faq-item button{width:100%; text-align:right; padding:16px 18px; display:flex; justify-content:space-between; align-items:center; gap:12px; font-weight:700; font-size:14px}
.faq-item .faq-body{display:none; padding:0 18px 16px; font-size:13px; line-height:1.8; color:var(--color-muted)}
.faq-item.active .faq-body{display:block}
.faq-item.active{border-color:var(--color-primary)}

/* Final CTA */
.final-cta{padding:80px 0; background:var(--color-bg); border-top:1px solid var(--color-border)}
.final-cta__inner{display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:center; background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:36px; box-shadow:var(--shadow-md); position:relative; overflow:hidden}
.final-cta__inner::before{content:''; position:absolute; top:-40%; right:-20%; width:60%; height:140%; background:radial-gradient(circle at center, rgba(255,90,31,0.12), transparent 70%); pointer-events:none}
.final-cta__content h2{font-size:clamp(32px,4vw,52px); font-weight:900; line-height:0.9; letter-spacing:-0.03em; margin:0 0 12px}
.final-cta__content p{font-size:15px; line-height:1.8; color:var(--color-muted); max-width:44ch; margin:0 0 24px}
.final-cta__actions{display:flex; gap:16px; align-items:center; flex-wrap:wrap}
.cta-note{font-size:11px; color:var(--color-muted); font-weight:600}
.cta-paper{background:var(--color-surface-3); border:1px solid var(--color-border); border-radius:16px; padding:18px; transform:rotate(1deg); box-shadow:var(--shadow-sm)}
.cta-paper__top{display:flex; justify-content:space-between; font-size:10px; letter-spacing:0.1em; font-weight:700; color:var(--color-muted); border-bottom:1px dashed var(--color-border); padding-bottom:10px; margin-bottom:14px}
.cta-paper__lines{display:grid; gap:10px}
.cta-paper__lines div{display:flex; justify-content:space-between; gap:12px; font-size:13px; border-bottom:1px solid rgba(0,0,0,0.04); padding-bottom:8px}
.cta-paper__lines span{color:var(--color-muted)}
.cta-paper__stamp{margin-top:16px; border:1.5px solid var(--color-accent); color:var(--color-accent); display:inline-block; padding:6px 12px; border-radius:4px; font-size:11px; font-weight:900; letter-spacing:0.12em; transform:rotate(-6deg)}

/* Footer */
.footer{padding:60px 0 0; background:var(--color-primary); color:rgba(255,255,255,0.8); border-top:1px solid rgba(255,255,255,0.1)}
.footer__grid{display:grid; grid-template-columns:1.4fr 0.7fr 0.7fr 1fr; gap:32px; padding-bottom:40px}
.footer__logo{display:flex; align-items:center; gap:10px; margin-bottom:12px}
.footer__logo .logo-mark{background:#fff; color:var(--color-primary)}
.footer__logo b{color:#fff; font-size:18px}
.footer__brand p{font-size:13px; line-height:1.8; opacity:0.7; margin:0 0 16px}
.footer__socials{display:flex; gap:10px}
.footer__socials a{font-size:12px; padding:6px 10px; border-radius:20px; border:1px solid rgba(255,255,255,0.2); transition:.2s}
.footer__socials a:hover{background:#fff; color:var(--color-primary)}
.footer__col h4{color:#fff; font-size:13px; font-weight:800; margin:0 0 14px; letter-spacing:0.06em}
.footer__col a{display:block; font-size:13px; opacity:0.7; margin-bottom:8px; transition:.2s}
.footer__col a:hover{opacity:1}
.footer__col p{font-size:13px; line-height:1.8; opacity:0.7; margin:0}
.footer__bottom{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; border-top:1px solid rgba(255,255,255,0.1); padding:18px 0 24px; font-size:11px; opacity:0.6}

/* Modals & Drawers */
.modal{position:fixed; inset:0; z-index:200; display:none}
.modal.open{display:block}
.modal__backdrop{position:absolute; inset:0; background:rgba(17,24,20,0.5); backdrop-filter:blur(8px)}
.modal__panel{position:relative; background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); margin:40px auto; width:min(calc(100% - 24px), 720px); max-height:calc(100vh - 80px); overflow:auto; animation:panelIn .35s var(--ease-emphasis)}
@keyframes panelIn{from{transform:translateY(16px) scale(0.98); opacity:0} to{transform:translateY(0) scale(1); opacity:1}}

.search-panel{padding:0; overflow:hidden}
.search-panel__head{display:flex; gap:8px; padding:16px; border-bottom:1px solid var(--color-border)}
.search-panel__head input{flex:1; height:48px; border-radius:12px; border:1px solid var(--color-border); background:var(--color-bg); padding:0 16px; font-size:15px; outline:none}
.search-panel__head input:focus{border-color:var(--color-primary); background:#fff}
.search-panel__results{padding:12px; display:grid; gap:8px; max-height:420px; overflow:auto}
.search-result{display:flex; gap:12px; align-items:center; padding:10px; border-radius:12px; border:1px solid transparent; transition:.2s}
.search-result:hover{background:var(--color-surface-3); border-color:var(--color-border)}
.search-result img{width:56px; height:56px; border-radius:10px; object-fit:cover}
.search-result b{font-size:13px; display:block}
.search-result span{font-size:11px; color:var(--color-muted)}

.trip-panel{width:min(calc(100% - 24px), 980px); padding:0; overflow:hidden; display:grid; grid-template-columns:1.2fr 0.8fr; max-height:calc(100vh - 40px)}
.trip-panel__img{position:relative; background:var(--color-surface-3)}
.trip-panel__img img{width:100%; height:100%; object-fit:cover; min-height:100%}
.trip-panel__body{padding:24px; overflow:auto}
.trip-panel__close{position:absolute; top:12px; left:12px; z-index:2}
.trip-panel__meta{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px}
.trip-panel__meta span{font-size:11px; padding:5px 10px; border-radius:20px; background:var(--color-surface-3); border:1px solid var(--color-border); font-weight:600}
.trip-panel__body h2{font-size:26px; font-weight:900; line-height:1.1; margin:0 0 10px}
.trip-panel__body p{font-size:14px; line-height:1.8; color:#2F3330; margin:0 0 16px}
.trip-itinerary{display:grid; gap:10px; margin:16px 0}
.trip-itinerary div{display:flex; gap:10px; font-size:13px; line-height:1.6}
.trip-itinerary b{font-family:var(--font-display); color:var(--color-accent); min-width:56px}
.trip-panel__actions{display:flex; gap:10px; margin-top:20px; flex-wrap:wrap}

.drawer{position:fixed; inset:0; z-index:210; display:none}
.drawer.open{display:block}
.drawer__backdrop{position:absolute; inset:0; background:rgba(17,24,20,0.4); backdrop-filter:blur(6px)}
.drawer__panel{
  position:absolute; top:0; bottom:0; left:0; width:min(420px, 100%); background:var(--color-surface);
  border-right:1px solid var(--color-border); box-shadow:var(--shadow-lg); display:flex; flex-direction:column;
  animation:drawerIn .35s var(--ease-emphasis)
}
@keyframes drawerIn{from{transform:translateX(-16px); opacity:0} to{transform:translateX(0); opacity:1}}
.drawer__head{display:flex; justify-content:space-between; align-items:center; padding:18px 20px; border-bottom:1px solid var(--color-border)}
.drawer__head h3{margin:0; font-size:16px; font-weight:900}
.drawer__body{flex:1; overflow:auto; padding:16px; display:grid; gap:12px; align-content:start}
.drawer__foot{padding:16px 20px; border-top:1px solid var(--color-border); background:var(--color-surface-3)}
.drawer__total{display:flex; justify-content:space-between; align-items:center; margin-bottom:12px}
.drawer__total b{font-size:18px; font-weight:900}
.drawer__note{font-size:11px; color:var(--color-muted); display:block; margin-top:10px; text-align:center}
.cart-item{display:flex; gap:12px; padding:12px; border:1px solid var(--color-border); border-radius:14px; background:var(--color-bg)}
.cart-item img{width:64px; height:64px; border-radius:10px; object-fit:cover}
.cart-item b{font-size:13px; display:block; line-height:1.3}
.cart-item span{font-size:11px; color:var(--color-muted)}
.cart-item__actions{margin-left:auto; display:flex; flex-direction:column; gap:6px; align-items:end}
.qty{display:flex; align-items:center; gap:6px; border:1px solid var(--color-border); border-radius:20px; padding:2px 6px; background:var(--color-surface)}
.qty button{width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-weight:800}

/* Toast */
.toast-stack{position:fixed; bottom:20px; left:50%; transform:translateX(-50%); z-index:300; display:grid; gap:10px; width:min(380px, calc(100% - 24px))}
.toast{background:var(--color-primary); color:#fff; padding:12px 16px; border-radius:12px; font-size:13px; font-weight:600; box-shadow:var(--shadow-lg); display:flex; gap:10px; align-items:center; animation:toastIn .3s var(--ease-emphasis)}
.toast--accent{background:var(--color-accent)}
@keyframes toastIn{from{transform:translateY(10px); opacity:0} to{transform:translateY(0); opacity:1}}

/* Consult */
.consult-panel{width:min(calc(100% - 24px), 960px); padding:0; overflow:hidden}
.consult-grid{display:grid; grid-template-columns:1.2fr 0.8fr}
.consult-grid > div{padding:28px}
.consult-side{background:var(--color-surface-3); border-right:1px solid var(--color-border)}
.consult-side__card{background:var(--color-surface); border:1px solid var(--color-border); border-radius:16px; padding:18px}
.consult-side__card h4{margin:0 0 12px; font-size:15px; font-weight:900}
.consult-side__card ol{margin:0; padding-right:18px; display:grid; gap:8px; font-size:13px; line-height:1.6; color:var(--color-muted)}
.consult-side__trust{display:flex; gap:16px; margin-top:16px; padding-top:16px; border-top:1px dashed var(--color-border)}
.consult-side__trust div{display:flex; flex-direction:column}
.consult-side__trust b{font-size:18px; font-weight:900}
.consult-side__trust span{font-size:11px; color:var(--color-muted)}
.form{display:grid; gap:14px; margin-top:18px}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.field{display:grid; gap:6px}
.field label{font-size:11px; font-weight:700; letter-spacing:0.06em; color:var(--color-muted); text-transform:uppercase}
.field input, .field textarea{
  border:1px solid var(--color-border); background:var(--color-bg); border-radius:12px; padding:12px 14px; font-size:14px; outline:none; transition:.2s; width:100%;
}
.field input:focus, .field textarea:focus{border-color:var(--color-primary); background:#fff}
.form-note{font-size:11px; color:var(--color-muted); text-align:center}
.consult-close{position:absolute; top:12px; left:12px; z-index:2}

/* Reveal */
.reveal{opacity:0; transform:translateY(18px); transition:all .6s var(--ease-emphasis); transition-delay:var(--d,0s)}
.reveal.in{opacity:1; transform:translateY(0)}

/* Responsive */
@media (max-width: 1100px){
  .hero__grid, .promise__grid, .builder__grid, .spotlight__grid, .how__grid, .faq__grid, .final-cta__inner, .journal__grid{grid-template-columns:1fr}
  .moods__grid{grid-template-columns:1fr 1fr}
  .journeys__grid{grid-template-columns:1fr 1fr}
  .footer__grid{grid-template-columns:1fr 1fr}
  .trip-panel{grid-template-columns:1fr}
  .trip-panel__img{min-height:280px}
  .consult-grid{grid-template-columns:1fr}
  .hero__visual{height:420px}
  .builder__preview{position:relative; top:auto}
  .how__sticky{position:relative; top:auto}
}
@media (max-width: 640px){
  .nav__links, .nav__cta-mobile-hide{display:none}
  .nav__burger{display:flex}
  .hero{padding:16px 0 24px}
  .hero__meta{gap:18px}
  .moods__grid, .journeys__grid{grid-template-columns:1fr}
  .journeys__tools{width:100%}
  .search-box input{width:100%}
  .journeys__tools{flex-direction:column; align-items:stretch}
  .filter-bar{flex-direction:column; align-items:stretch}
  .j-card--large{grid-template-columns:1fr}
  .j-card--small{grid-template-columns:100px 1fr}
  .form-row{grid-template-columns:1fr}
  .final-cta__inner{padding:20px}
  .footer__grid{grid-template-columns:1fr}
  .visual-stack{scale:0.9; transform-origin:top right}
  .hero__visual{height:380px}
}
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{animation:none !important; transition:none !important}
  .reveal{opacity:1; transform:none}
}
