:root{
  --bg:#fff7ed;           /* soft sandstone */
  --card:#ffffff;         /* clean white */
  --text:#3b2f1e;         /* deep brown-slate */
  --muted:#6b5a3c;        /* muted earthy */
  --accent:#f59e0b;       /* sacred saffron (primary CTA) */
  --accent2:#fde68a;      /* light saffron highlight */
  --forest:#166534;       /* forest green support */
  --pine:#0f766e;         /* teal/pine fallback */
  --border:#f1e0c5;       /* warm border */
  --shadow: 0 12px 32px rgba(59,47,30,.12);
  --radius: 18px;
  --max: 1180px;
  --pad: clamp(16px, 3vw, 28px);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color: var(--text);
  background: linear-gradient(180deg, #fffdf7, var(--bg) 45%, #ffffff);
  line-height: 1.5;
}

a{color:inherit;text-decoration:none}
.container{max-width:var(--max); margin:0 auto; padding: 0 var(--pad)}

/* NAV */
.nav{
  position: sticky; top: 0; z-index: 50;
  backdrop-filter: blur(10px);
  background: rgba(255,255,255,.95);
  border-bottom: 1px solid rgba(31,41,55,.10);
}
.nav-inner{display:flex; align-items:center; justify-content:space-between; gap: 12px; padding: 12px 0}
.brand{display:flex; align-items:center; gap: 10px; font-weight: 900; letter-spacing: .3px}
.logo{
  width: 40px; height: 40px; border-radius: 14px;
  background: linear-gradient(135deg, var(--accent), var(--pine));
  display:grid; place-items:center;
  color:#06101a;
  box-shadow: 0 12px 35px rgba(255,122,0,.18);
  font-weight: 1000;
}
.brand small{display:block; color: var(--muted); font-weight: 700; margin-top: 2px}
.menu{display:flex; gap: 18px; color: var(--muted); font-weight: 750; font-size: 14px}
.menu a:hover{color: var(--text)}
.cta{display:flex; gap: 10px; align-items:center}

.btn{
  border: 1px solid var(--border);
  background: #ffffff;
  color: var(--text);
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 14px;
  display:inline-flex;
  align-items:center;
  gap: 8px;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
  white-space: nowrap;
}
.btn:hover{transform: translateY(-1px); border-color: rgba(43,108,176,.35)}
.btn.primary{
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  color:#3b2f1e;
  border-color: rgba(245,158,11,.45);
}
.btn.green{
  background: linear-gradient(135deg, var(--forest), #22c55e);
  color:#ffffff;
  border-color: rgba(22,101,52,.35);
}

/* HERO */
.hero{padding: clamp(22px, 4.5vw, 58px) 0 18px}
.hero-grid{display:grid; grid-template-columns: 1.05fr .95fr; gap: clamp(14px, 3vw, 30px); align-items:start}

.kicker{
  display:inline-flex; align-items:center; gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(31,41,55,.10);
  background: #fffbeb;
  color: var(--muted);
  font-weight: 850;
  font-size: 13px;
}

h1{
  margin: 14px 0 10px;
  font-size: clamp(30px, 4.4vw, 54px);
  letter-spacing: -0.8px;
  line-height: 1.06;
}

.sub{color: var(--muted); font-size: clamp(15px, 1.65vw, 18px); max-width: 64ch}

.hero-ctas{display:flex; gap: 12px; flex-wrap:wrap; margin-top: 16px}

.trustbar{display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-top: 16px}
.trust{
  border:1px solid rgba(31,41,55,.10);
  background: #ffffff;
  border-radius: 14px;
  padding: 12px 12px;
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
  display:flex; align-items:center; gap: 10px;
}
.dot{width: 10px; height: 10px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 0 6px rgba(245,158,11,.18)}

.hero-media{
  position: relative;
  border-radius: var(--radius);
  overflow:hidden;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  background: #ffffff;
  min-height: 430px;
}
.hero-media img{width:100%; height:100%; object-fit: cover; display:block; filter: saturate(1.05) contrast(1.05)}
.hero-media::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(17,24,39,.28) 70%);
  pointer-events:none;
}
.hero-badge{
  position:absolute; left: 14px; bottom: 14px; right: 14px;
  display:flex; align-items:center; justify-content:space-between; gap: 12px;
  border: 1px solid rgba(238,246,255,.18);
  background: rgba(255,255,255,.95);
  border-radius: 16px;
  padding: 12px 12px;
  backdrop-filter: blur(8px);
}
.hero-badge strong{font-weight: 950}
.hero-badge span{color: var(--muted); font-weight: 750; font-size: 13px}

/* SECTION */
.section{padding: 38px 0}
.section h2{margin:0 0 10px; font-size: clamp(22px, 2.6vw, 34px); letter-spacing: -.35px}
.lead{margin:0; color: var(--muted); font-weight: 650; max-width: 80ch}

/* CARDS */
.grid2{display:grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px}
.card{
  border:1px solid rgba(31,41,55,.10);
  background: #ffffff;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.card .inner{padding: 18px}

.pkg{
  display:grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 14px;
  align-items:stretch;
}
.pkg-media{border-radius: 16px; overflow:hidden; border:1px solid rgba(238,246,255,.14); min-height: 240px}
.pkg-media img{width:100%; height:100%; object-fit: cover; display:block}
.tag{
  display:inline-flex; align-items:center; gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  border:1px solid rgba(238,246,255,.16);
  background: #fffbeb;
  color: var(--muted);
  font-weight: 850;
  font-size: 12px;
}
.pkg h3{margin:10px 0 6px; font-size: 20px}
.pkg p{margin:0; color: var(--muted); font-weight: 650}
.pkg ul{margin:12px 0 0; padding-left: 18px; color: var(--muted); font-weight: 650}

/* PRICING */
.pricing-wrap{margin-top: 16px}
.table{
  width:100%; border-collapse: collapse;
  border:1px solid rgba(31,41,55,.10);
  overflow:hidden; border-radius: 16px;
  background: #ffffff;
}
.table th,.table td{padding: 12px 12px; border-bottom: 1px solid rgba(238,246,255,.10); text-align:left; vertical-align:top}
.table th{color: var(--text); font-weight: 900; font-size: 13px; background: rgba(245,158,11,.14)}
.table td{color: var(--muted); font-weight: 700; font-size: 14px}
.note{margin-top: 10px; color: var(--muted); font-weight: 650; font-size: 13px}

/* ITINERARY */
details{
  border:1px solid rgba(31,41,55,.10);
  background: #ffffff;
  border-radius: var(--radius);
  padding: 14px 16px;
}
summary{cursor:pointer; font-weight: 900}
details p, details li{color: var(--muted); font-weight: 650}

.it-grid{display:grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px}

/* GALLERY */
.gallery{display:grid; grid-template-columns: repeat(12, 1fr); gap: 10px; margin-top: 16px}
.g{
  border-radius: 16px; overflow:hidden; border:1px solid rgba(238,246,255,.14);
  background:#ffffff; box-shadow: var(--shadow);
  min-height: 180px;
}
.g img{width:100%; height:100%; object-fit: cover; display:block}
.g1{grid-column: span 7; min-height: 280px}
.g2{grid-column: span 5; min-height: 280px}
.g3,.g4,.g5,.g6{grid-column: span 3}

/* FORM */
form{display:grid; gap: 10px; margin-top: 10px}
.fields{display:grid; grid-template-columns: 1fr 1fr; gap: 10px}
label{font-weight: 850; font-size: 13px; color: var(--muted)}
input, select, textarea{
  width:100%;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(31,41,55,.14);
  background: #fffbeb;
  color: var(--text);
  outline: none;
  font-weight: 700;
}
input::placeholder, textarea::placeholder{color: rgba(168,183,199,.8)}
textarea{min-height: 92px; resize: vertical}

.form-actions{display:flex; gap: 10px; flex-wrap: wrap; margin-top: 2px}

/* FOOTER */
.footer{border-top: 1px solid var(--border); padding: 26px 0 36px; color: var(--muted); font-weight: 650}
.footgrid{display:grid; grid-template-columns: 1.2fr .8fr; gap: 18px; align-items:start}
.links{display:flex; gap: 10px; flex-wrap:wrap}

/* RESPONSIVE */
@media (max-width: 980px){
  .menu{display:none}
  .hero-grid{grid-template-columns: 1fr}
  .trustbar{grid-template-columns: 1fr 1fr}
  .grid2{grid-template-columns: 1fr}
  .pkg{grid-template-columns: 1fr}
  .it-grid{grid-template-columns: 1fr}
  .g1{grid-column: span 12}
  .g2{grid-column: span 12}
  .g3,.g4,.g5,.g6{grid-column: span 6}
}
@media (max-width: 560px){
  .trustbar{grid-template-columns: 1fr}
  .cta{width:100%}
  .nav-inner{flex-wrap:wrap}
  .fields{grid-template-columns: 1fr}
  .g3,.g4,.g5,.g6{grid-column: span 12}
}

.float-wa{
  position: fixed;
  /* Default offsets; can be overridden via inline CSS variables */
  --kmy-fx:16px;
  --kmy-fy:16px;
  z-index: 999;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 900;
  border: 1px solid rgba(47,133,90,.35);
  background: linear-gradient(135deg, rgba(47,133,90,.95), rgba(74,163,223,.85));
  color: #ffffff;
  box-shadow: var(--shadow);
}
.float-wa:hover{filter: brightness(1.05)}

/* Position presets */
.float-wa--pos-br{right:var(--kmy-fx);bottom:var(--kmy-fy);}
.float-wa--pos-bl{left:var(--kmy-fx);bottom:var(--kmy-fy);}
.float-wa--pos-bc{left:50%;bottom:var(--kmy-fy);transform:translateX(-50%);}

.float-wa--pos-mr{right:var(--kmy-fx);top:50%;transform:translateY(-50%);}
.float-wa--pos-ml{left:var(--kmy-fx);top:50%;transform:translateY(-50%);}

.float-wa--pos-tr{right:var(--kmy-fx);top:var(--kmy-fy);}
.float-wa--pos-tl{left:var(--kmy-fx);top:var(--kmy-fy);}
.float-wa--pos-tc{left:50%;top:var(--kmy-fy);transform:translateX(-50%);}

/* Language toggle (hamburger) */
.kmy-hidden{display:none !important}

.kmy-lang-menu{position:relative;display:inline-flex;align-items:center}
.kmy-lang-menu__btn{padding:10px 12px;line-height:1}
.kmy-burger{display:inline-grid;gap:3px}
.kmy-burger span{display:block;width:18px;height:2px;background:currentColor;border-radius:2px}

.kmy-lang-menu__panel{position:absolute;right:0;top:calc(100% + 8px);min-width:120px;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);padding:6px;display:none;z-index:50}
.kmy-lang-menu__item{width:100%;text-align:left;border:0;background:transparent;padding:10px 10px;border-radius:12px;font-weight:900;color:var(--text);cursor:pointer}
.kmy-lang-menu__item:hover{background:rgba(15,23,42,.06)}
.kmy-lang-menu.is-open .kmy-lang-menu__panel{display:block}

/* Language toggle helpers */
html[data-kmy-lang="hi"] .kmy-lang-en{display:none !important;}
html[data-kmy-lang="en"] .kmy-lang-hi{display:none !important;}
.kmy-lang-toggle{display:flex; gap:8px; align-items:center; justify-content:flex-end}
.kmy-lang-toggle button{cursor:pointer}

/* --- Separate per-section media (admin-uploaded) --- */
.kmy-section.kmy-has-media{position:relative}

/* Important: keep sizing consistent with the attached HTML (inside .container, not full width) */
.kmy-sec-media{width:100%;margin:0 0 18px 0}
.kmy-sec-figure{margin:0}
.kmy-sec-frame{
  border-radius: var(--radius);
  overflow:hidden;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  background: #ffffff;
}
.kmy-sec-img{width:100%;height:100%;display:block;object-fit:cover}

/* Aspect ratio helpers (v1.3) */
.kmy-ratio-banner_16_7 .kmy-sec-img{aspect-ratio:16/7}
.kmy-ratio-wide_16_9 .kmy-sec-img{aspect-ratio:16/9}
.kmy-ratio-card_3_2 .kmy-sec-img{aspect-ratio:3/2}
.kmy-ratio-vertical_4_5 .kmy-sec-img{aspect-ratio:4/5}
.kmy-ratio-horizontal_21_9 .kmy-sec-img{aspect-ratio:21/9}
.kmy-ratio-square_1_1 .kmy-sec-img{aspect-ratio:1/1}

/* Background blocks should also keep the chosen ratio feel */
.kmy-sec-bg.kmy-ratio-banner_16_7{height:clamp(280px, 38vw, 430px)}
.kmy-sec-bg.kmy-ratio-wide_16_9{height:clamp(240px, 34vw, 380px)}
.kmy-sec-bg.kmy-ratio-card_3_2{height:clamp(220px, 30vw, 320px)}
.kmy-sec-bg.kmy-ratio-vertical_4_5{height:clamp(320px, 52vw, 520px)}
.kmy-sec-bg.kmy-ratio-horizontal_21_9{height:clamp(200px, 26vw, 280px)}
.kmy-sec-bg.kmy-ratio-square_1_1{height:clamp(260px, 44vw, 460px)}

/* Background mode is still constrained inside container */
.kmy-sec-bg{
  width:100%;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}


/* Above placement alignment */
.kmy-media-above.kmy-align-left{display:block}
.kmy-media-above.kmy-align-center{display:flex;justify-content:center}
.kmy-media-above.kmy-align-right{display:flex;justify-content:flex-end}
.kmy-media-above .kmy-sec-figure{max-width:100%}

/* Split layout (Hero-style) */
.kmy-split{display:grid;gap:16px;align-items:stretch}
.kmy-split .kmy-split-content{min-width:0}
.kmy-split .kmy-split-media{min-width:0}

/* Split ratios */
.kmy-split-55-45{grid-template-columns:55% 45%}
.kmy-split-50-50{grid-template-columns:50% 50%}
.kmy-split-60-40{grid-template-columns:60% 40%}
.kmy-split-45-55{grid-template-columns:45% 55%}

@media (max-width: 1024px){
  .kmy-split-55-45,.kmy-split-50-50,.kmy-split-60-40,.kmy-split-45-55{grid-template-columns:1fr}
}

/* Floating WhatsApp button (global/profile via Floating Buttons settings) */
.kmy-wa-float{
  position:fixed;
  z-index:99999;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:999px;
  background:#25D366;
  color:#fff;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 10px 25px rgba(0,0,0,.18);
  transform:translateZ(0);
}
.kmy-wa-float:hover{opacity:.95}

/* Floating Chat button (opens AI Aavya bot) */
.kmy-chat-float{
  position:fixed;
  z-index:99999;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:999px;
  background:#111;
  color:#fff;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 10px 25px rgba(0,0,0,.18);
  transform:translateZ(0);
}
.kmy-chat-float:hover{opacity:.95}

/* Position helpers + offsets */
.kmy-wa-float{ --kmy-fx:16px; --kmy-fy:16px; }
.kmy-float--pos-br{ right:var(--kmy-fx); bottom:var(--kmy-fy); }
.kmy-float--pos-bl{ left:var(--kmy-fx); bottom:var(--kmy-fy); }
.kmy-float--pos-bc{ left:50%; transform:translateX(-50%); bottom:var(--kmy-fy); }
.kmy-float--pos-tr{ right:var(--kmy-fx); top:var(--kmy-fy); }
.kmy-float--pos-tl{ left:var(--kmy-fx); top:var(--kmy-fy); }
.kmy-float--pos-tc{ left:50%; transform:translateX(-50%); top:var(--kmy-fy); }
.kmy-float--pos-mr{ right:var(--kmy-fx); top:50%; transform:translateY(-50%); }
.kmy-float--pos-ml{ left:var(--kmy-fx); top:50%; transform:translateY(-50%); }
