/* Preview-only visual direction for /design-preview. Does not affect /index.html. */
body.design-preview{
  background:#f2eee6;
  color:#182131;
}
.design-preview .top{
  background:rgba(17,24,39,.72);
  border-bottom:1px solid rgba(255,255,255,.16);
  color:#fff;
}
.design-preview .top a,.design-preview .top .brand{color:#fff}
.design-preview .brand small{color:rgba(255,255,255,.72)}
.design-preview .brand .mark{background:linear-gradient(135deg,#d6bd7a,#8f6c32);color:#172033}
.design-preview .top .pill{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);color:#fff}
.design-preview #launchNote{background:#111827;color:#f7ead4;border-bottom:0}
.design-preview #launchNote button{color:#f7ead4}
.design-preview .hero{
  position:relative;
  min-height:520px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  overflow:hidden;
  padding:82px 18px 118px;
  background:
    radial-gradient(circle at 20% 20%,rgba(214,189,122,.22),transparent 34%),
    linear-gradient(180deg,rgba(13,23,38,.18),rgba(13,23,38,.84)),
    url("https://static.cupid.travel/hotels/134454624.jpg") center/cover no-repeat;
}
.design-preview .hero:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:126px;
  background:linear-gradient(180deg,rgba(244,241,234,0),#f4f1ea);
}
.design-preview .preview-ribbon{
  position:relative;
  z-index:1;
  margin-bottom:18px;
  border:1px solid rgba(255,255,255,.36);
  background:rgba(255,255,255,.16);
  color:#fff;
  border-radius:999px;
  padding:7px 13px;
  font-size:12px;
  font-weight:800;
  backdrop-filter:blur(8px);
}
.design-preview .hero-h1{
  position:relative;
  z-index:1;
  max-width:900px;
  font-size:64px;
  line-height:1.02;
  text-shadow:0 8px 32px rgba(0,0,0,.34);
  letter-spacing:0;
}
.design-preview .hero-sub{
  position:relative;
  z-index:1;
  max-width:720px;
  font-size:19px;
  color:#fff7ea;
}
.design-preview .hero-progs{position:relative;z-index:1;margin-top:4px}
.design-preview .hero-chip{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.28);
  color:#fff;
  box-shadow:0 8px 28px rgba(0,0,0,.18);
  backdrop-filter:blur(8px);
}
.design-preview .searchbar{margin-top:-76px;position:relative;z-index:3}
.design-preview .searchbar .box{
  border:0;
  box-shadow:0 28px 80px rgba(27,36,54,.22);
  padding:20px;
  border-radius:20px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(14px);
}
.design-preview #tagline{
  color:#fff;
  margin-bottom:13px;
  text-shadow:0 2px 10px rgba(0,0,0,.32);
  font-size:18px;
}
.design-preview .progrow{
  background:#fffdf9;
  border:1px solid rgba(27,36,54,.08);
  border-radius:18px;
  padding:14px 16px;
  box-shadow:0 12px 36px rgba(27,36,54,.07);
}
.design-preview .wrap{
  max-width:1380px;
  margin-top:32px;
  grid-template-columns:300px 1fr;
  gap:28px;
}
.design-preview .panel,.design-preview .card{
  border-color:rgba(27,36,54,.08);
  box-shadow:0 10px 34px rgba(27,36,54,.08);
}
.design-preview aside .panel{
  background:#172033;
  color:#fff;
  border-radius:18px;
  padding:18px;
  border-color:rgba(255,255,255,.12);
  box-shadow:0 24px 70px rgba(27,36,54,.18);
}
.design-preview aside .fgrp{border-bottom-color:rgba(255,255,255,.12)}
.design-preview aside .fgrp h4,
.design-preview aside .fgrp div,
.design-preview aside .chk,
.design-preview aside .modetxt b{color:#fff}
.design-preview aside .modetxt small,
.design-preview aside .dr-labels,
.design-preview aside .fgrp [style*="color:var(--mist)"]{color:rgba(255,255,255,.62)!important}
.design-preview aside .niche{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.14);
}
.design-preview main{
  background:rgba(255,255,255,.44);
  border:1px solid rgba(27,36,54,.08);
  border-radius:24px;
  padding:18px;
  box-shadow:0 18px 60px rgba(27,36,54,.08);
}
.design-preview .reshead{
  background:#fffdf9;
  border:1px solid rgba(27,36,54,.08);
  border-radius:18px;
  padding:13px 14px;
}
.design-preview .reshead h2{font-size:27px}
.design-preview .cards{
  gap:18px;
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.design-preview .card{
  border-radius:18px;
  background:#fffdf9;
  overflow:hidden;
  transition:transform .16s ease,box-shadow .16s ease;
}
.design-preview .card:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 70px rgba(27,36,54,.16);
}
.design-preview .card .photo{height:210px}
.design-preview .card .photo:after{
  background:linear-gradient(180deg,rgba(10,22,51,0) 32%,rgba(10,22,51,.68));
}
.design-preview .card .body{padding:16px 17px 18px}
.design-preview .card h3{font-size:19px}
.design-preview .card .brandline{font-size:12px}
.design-preview .cmp{display:table;width:100%;margin-top:12px}
.design-preview .pbadge{
  background:#f7f0df;
  border-color:#ead9b5;
}
.design-preview .kchip,.design-preview .paybig{
  border-radius:10px;
}
.design-preview .priceline{
  border-top:1px solid rgba(176,138,70,.22);
  background:linear-gradient(180deg,rgba(244,236,221,.35),rgba(255,255,255,0));
  margin:8px -17px 0;
  padding:13px 17px 0;
}
.design-preview .priceline .big{font-size:29px}
.design-preview .paybig{font-size:16px}
.design-preview .btn{border-radius:12px}
.design-preview .viewtog,.design-preview .sortsel,.design-preview .ptog{border-radius:12px}
.design-preview footer{
  background:#151d2b;
  color:#cfd5df;
  max-width:none;
  padding-left:max(20px,calc((100vw - 1240px)/2 + 20px));
  padding-right:max(20px,calc((100vw - 1240px)/2 + 20px));
}
.design-preview footer a{color:#e8d6a7}
@media(max-width:1180px){
  .design-preview .cards{grid-template-columns:1fr 1fr}
}
@media(max-width:980px){
  .design-preview .wrap{grid-template-columns:1fr}
  .design-preview aside .panel{position:static}
}
@media(max-width:760px){
  .design-preview .hero{min-height:410px;padding:54px 14px 96px}
  .design-preview .hero-h1{font-size:34px}
  .design-preview .hero-sub{font-size:15.5px}
  .design-preview .searchbar{margin-top:-44px}
  .design-preview main{padding:12px;border-radius:18px}
  .design-preview .cards{grid-template-columns:1fr}
}

/* V2: cohesive luxury direction. Preview-only; live homepage is untouched. */
body.design-preview{
  --preview-ink:#16202f;
  --preview-ink-2:#243247;
  --preview-paper:#fbfaf6;
  --preview-cream:#f3efe7;
  --preview-line:#ded6c9;
  --preview-gold:#b68a42;
  --preview-gold-soft:#f4ead4;
  --preview-sage:#5f7568;
  --preview-blue:#2d526f;
  background:
    linear-gradient(180deg,#f6f2ea 0,#fbfaf6 420px,#f2efe8 100%);
}
.design-preview .top{
  background:rgba(22,32,47,.86);
  backdrop-filter:blur(14px);
  box-shadow:0 12px 38px rgba(15,23,42,.18);
}
.design-preview .hero{
  min-height:560px;
  padding:96px 18px 126px;
  background:
    linear-gradient(180deg,rgba(9,17,30,.12),rgba(9,17,30,.72)),
    linear-gradient(90deg,rgba(18,27,43,.44),rgba(18,27,43,.08) 55%,rgba(18,27,43,.56)),
    url("https://static.cupid.travel/hotels/121614744.jpg") center/cover no-repeat;
}
.design-preview .hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.22),transparent 42%,rgba(0,0,0,.18));
}
.design-preview .hero:after{background:linear-gradient(180deg,rgba(246,242,234,0),#f6f2ea)}
.design-preview .preview-ribbon,
.design-preview .hero-h1,
.design-preview .hero-sub,
.design-preview .hero-progs{position:relative;z-index:1}
.design-preview .preview-ribbon{
  background:rgba(246,242,234,.14);
  border-color:rgba(246,242,234,.38);
  letter-spacing:.04em;
  text-transform:uppercase;
}
.design-preview .hero-h1{
  max-width:980px;
  font-size:68px;
  font-weight:600;
}
.design-preview .hero-sub{font-size:20px;color:#fff3dc}
.design-preview .hero-progs{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:860px;margin:20px auto 0}
.design-preview .hero-chip{
  background:rgba(12,19,33,.58);
  border:1px solid rgba(255,255,255,.5);
  color:#fff;
  border-radius:999px;
  padding:8px 15px;
  font-size:13px;
  font-weight:600;
  letter-spacing:.01em;
  white-space:nowrap;
  box-shadow:0 6px 20px rgba(0,0,0,.3);
  backdrop-filter:blur(3px);
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.design-preview .hero-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:#d8b46a;flex:none}
.design-preview .searchbar{max-width:1180px;margin-top:-84px}
.design-preview .searchbar .box{
  border:1px solid rgba(182,138,66,.22);
  border-radius:24px;
  background:rgba(251,250,246,.97);
  box-shadow:0 34px 90px rgba(22,32,47,.24);
}
.design-preview #tagline{
  color:#fff5e5;
  font-size:18px;
  text-align:left;
}
.design-preview .fld{
  border-radius:16px;
  background:#fff;
  border:1px solid rgba(22,32,47,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.design-preview .fld label{color:#6f6250}
.design-preview .fld input,
.design-preview .fld select{background:#fff;color:var(--preview-ink)}
.design-preview .btn{
  background:linear-gradient(135deg,var(--preview-ink),var(--preview-blue));
  border:0;
  color:#fff;
  box-shadow:0 12px 26px rgba(22,32,47,.18);
}
.design-preview .btn.gold{
  background:linear-gradient(135deg,#d8bd78,#a67832);
  color:#1a2332;
}
.design-preview .progrow{
  max-width:1180px;
  margin-top:18px;
  background:rgba(251,250,246,.92);
  border-color:rgba(182,138,66,.2);
  border-radius:18px;
}
.design-preview .ptog{
  background:#fff;
  border:1px solid rgba(22,32,47,.1);
  color:var(--preview-ink-2);
}
.design-preview .ptog.on{
  background:var(--preview-ink);
  color:#fff;
  border-color:var(--preview-ink);
}
.design-preview .wrap{
  max-width:1360px;
  margin-top:36px;
}
.design-preview aside .panel{
  background:linear-gradient(180deg,#182235,#111a2a);
  border-radius:22px;
}
.design-preview main{
  background:rgba(251,250,246,.72);
  border-color:rgba(22,32,47,.08);
}
.design-preview .reshead{
  background:#fff;
  border-color:rgba(182,138,66,.18);
}
.design-preview .reshead h2{font-family:var(--font-display);font-weight:600}
.design-preview .sortsel,
.design-preview .viewtog{
  background:#fff;
  border-color:rgba(22,32,47,.12);
}
.design-preview .card{
  border-radius:20px;
  border-color:rgba(22,32,47,.08);
  background:#fff;
}
.design-preview .card .photo{height:224px}
.design-preview .city{
  border-radius:999px;
  background:rgba(22,32,47,.82);
  backdrop-filter:blur(8px);
}
.design-preview .offer{
  background:var(--preview-gold-soft);
  color:#7c5620;
}
.design-preview .pbadge,
.design-preview .perk{
  border-radius:999px;
}
.design-preview .priceline .big{
  color:var(--preview-ink);
}
.design-preview .paybig{
  background:#f7f3ea;
  border:1px solid rgba(182,138,66,.22);
  color:#182235;
}
.design-preview .cheap{
  border-radius:14px;
  background:#f7f3ea;
}
.design-preview .modal{
  border-radius:24px;
  background:var(--preview-paper);
}
.design-preview .modal .mhead{
  background:#fff;
}
.design-preview .seg button{
  border-radius:999px;
}
.design-preview .seg button.on{
  background:var(--preview-ink);
  color:#fff;
  border-color:var(--preview-ink);
}
.design-preview .calgrid{gap:6px}
.design-preview .cell{
  border-radius:12px;
  background:#f6f0e6;
  color:#223047;
}
.design-preview .cell.out{
  background:repeating-linear-gradient(45deg,#f4e7e5,#f4e7e5 5px,#fff9f6 5px,#fff9f6 10px);
}
.design-preview .range-pop{
  border-radius:20px;
  border-color:rgba(182,138,66,.2);
  box-shadow:0 24px 70px rgba(22,32,47,.24);
}
.design-preview .range-day{
  border-radius:12px;
}
.design-preview .range-day.start,
.design-preview .range-day.end{
  background:var(--preview-ink);
}
.design-preview .range-day.between,
.design-preview .range-day.candidate:hover{
  background:var(--preview-gold-soft);
  color:#7c5620;
}
@media(max-width:980px){
  .design-preview .searchbar{margin-left:14px;margin-right:14px}
  .design-preview .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .design-preview .hero{min-height:450px;padding-top:66px}
  .design-preview .hero-h1{font-size:38px}
  .design-preview .hero-chip{font-size:12px;padding:6px 10px}
  .design-preview .cards{grid-template-columns:1fr}
}

