@import url('https://fonts.googleapis.com/css2?family=Amiri:ital,wght@0,400;0,700;1,400;1,700&family=Jost:wght@300;400;500;600;700&display=swap');

.aq-site{
  /* ------------------------------------------------------------------
     THE PALETTE IS KHOREZM MAJOLICA — and nothing else.
     Khiva tilework is not the warm terracotta of a travel brochure. It is
     cobalt, turquoise and white, drawn round with a BLACK OUTLINE. That
     black line is what makes it look modern: it is already graphic design,
     six hundred years early. Gold appears only where your logo does.
     ------------------------------------------------------------------ */
  --ganch:#F4F3EE;      /* limewashed plaster — the page */
  --paper:#FFFFFF;
  --ink:#15120D;        /* the outline in the majolica. This is the text. */
  --cobalt:#1A4A93;
  --turq:#109C94;
  --turq-lit:#16BDB3;
  --gold:#C4972B;       /* your logo */
  --brick:#C98A4B;      /* sunlit mud wall */
  --anor:#C0273A;       /* pomegranate. The hotel's own name. */
  --muted:#6B665C;
  --line:rgba(21,18,13,.14);

  --display:'Amiri','Times New Roman',serif;
  --body:'Jost',system-ui,-apple-system,sans-serif;

  --wrap:1220px;
  --gap:clamp(66px,9vw,140px);
  --spine:54px;

  background:var(--ganch);
  color:var(--ink);
  font-family:var(--body);
  font-weight:400;
  line-height:1.65;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
}
.aq-site *,.aq-site *::before,.aq-site *::after{box-sizing:border-box;}
.aq-site img{max-width:100%;display:block;}
.aq-site a{color:inherit;}
.aq-site h1,.aq-site h2,.aq-site h3{
  font-family:var(--display);font-weight:400;line-height:1.08;
  letter-spacing:-.008em;margin:0;color:var(--ink);
}
.aq-site p{margin:0 0 1em;}
.aq-wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px;}
.aq-inset{padding-left:calc(var(--spine) + 24px);}
@media (max-width:980px){.aq-inset{padding-left:24px;}}

.aq-eyebrow{
  font-size:11px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;
  color:var(--turq);margin:0 0 20px;
}
.aq-h2{font-size:clamp(32px,4.2vw,54px);margin-bottom:22px;max-width:18ch;}
.aq-h3{font-size:clamp(23px,2.3vw,29px);margin-bottom:10px;}
.aq-lede{font-size:18px;max-width:58ch;color:var(--muted);font-weight:300;}

/* ---------- the spine: the Kalta Minor's skin ---------- */
.aq-minor{position:absolute;left:0;top:0;bottom:0;width:var(--spine);}
@media (max-width:980px){.aq-minor{display:none;}}
.aq-bandrule{width:100%;height:46px;display:block;}

/* ---------- top bar ---------- */
.aq-topbar{background:var(--ink);color:#B9B2A4;font-size:13px;}
.aq-topbar-in{
  max-width:var(--wrap);margin:0 auto;padding:9px 24px;
  display:flex;gap:20px;align-items:center;justify-content:flex-end;flex-wrap:wrap;
}
.aq-topbar a{color:#E8E2D5;text-decoration:none;font-weight:500;}
.aq-topbar a:hover{color:var(--turq-lit);}
.aq-topbar .sep{opacity:.3;}
@media (max-width:640px){.aq-topbar-in{justify-content:center;gap:12px;font-size:12px;}}

/* ---------- nav: deep cobalt, so the gold logo has ground to stand on ---------- */
.aq-nav{
  position:sticky;top:0;z-index:60;
  background:rgba(26,74,147,.97);
  backdrop-filter:saturate(150%) blur(10px);
  border-bottom:2px solid var(--gold);
}
.aq-nav-in{max-width:var(--wrap);margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:32px;}
.aq-brand{display:flex;align-items:center;margin-right:auto;text-decoration:none;}
/* the only line to change if the logo sits wrong */
.aq-brand img{height:54px;width:auto;}
@media (max-width:880px){.aq-brand img{height:42px;}}

.aq-links{display:flex;gap:30px;list-style:none;margin:0;padding:0;}
.aq-links a{
  color:#fff;text-decoration:none;font-size:14px;font-weight:500;letter-spacing:.03em;
  padding:6px 0;border-bottom:1px solid transparent;transition:border-color .2s;
}
.aq-links a:hover,.aq-links a[aria-current="page"]{border-bottom-color:var(--gold);}

.aq-login{
  display:inline-flex;align-items:center;gap:8px;padding:9px 16px;
  border:1px solid rgba(255,255,255,.45);color:#fff;text-decoration:none;
  font-size:12px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  transition:background .2s,border-color .2s,color .2s;white-space:nowrap;
}
.aq-login:hover{background:var(--gold);border-color:var(--gold);color:var(--ink);}
.aq-login svg{width:14px;height:14px;}

.aq-burger{display:none;background:none;border:0;color:#fff;padding:8px;cursor:pointer;}
.aq-burger svg{width:22px;height:22px;}
@media (max-width:880px){
  .aq-burger{display:block;order:3;}
  .aq-login{order:2;padding:8px 11px;font-size:10px;}
  .aq-links{order:4;flex-basis:100%;flex-direction:column;gap:0;display:none;padding-top:8px;}
  .aq-nav-in.open .aq-links{display:flex;}
  .aq-links a{padding:13px 0;border-bottom:1px solid rgba(255,255,255,.14);}
  .aq-nav-in{flex-wrap:wrap;gap:14px;}
}

/* ---------- buttons ---------- */
.aq-btn{
  display:inline-block;padding:15px 30px;font-family:var(--body);
  font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:transform .18s cubic-bezier(.2,.7,.2,1),background .2s,color .2s;
}
.aq-btn:hover{transform:translateY(-2px);}
.aq-btn-solid{background:var(--anor);color:#fff;}
.aq-btn-solid:hover{background:#A11F30;}
.aq-btn-line{border-color:var(--ink);color:var(--ink);}
.aq-btn-line:hover{background:var(--ink);color:var(--ganch);}
.aq-btn-onDark{border-color:rgba(255,255,255,.5);color:#fff;}
.aq-btn-onDark:hover{background:rgba(255,255,255,.12);}

/* ---------- hero ---------- */
.aq-hero{position:relative;overflow:hidden;background:var(--ganch);}
.aq-hero-grid{display:grid;grid-template-columns:1.05fr 1fr;align-items:stretch;min-height:min(78vh,690px);}
.aq-hero-text{
  padding:clamp(50px,6vw,88px) clamp(28px,4vw,64px)
          clamp(50px,6vw,88px) calc(var(--spine) + clamp(28px,4vw,64px));
  display:flex;flex-direction:column;justify-content:center;
}
.aq-hero h1{font-size:clamp(37px,4.9vw,64px);margin:0 0 24px;max-width:15ch;}
.aq-hero h1 em{font-style:italic;color:var(--cobalt);}
.aq-hero-sub{font-size:18px;color:var(--muted);max-width:43ch;margin-bottom:34px;font-weight:300;}
.aq-hero-actions{display:flex;gap:12px;flex-wrap:wrap;}
.aq-hero-media{position:relative;}
.aq-hero-media img{width:100%;height:100%;object-fit:cover;}
.aq-hero-caption{
  position:absolute;right:16px;bottom:16px;background:var(--ink);color:#fff;
  padding:7px 13px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;
}
@media (max-width:980px){
  .aq-hero-grid{grid-template-columns:1fr;min-height:0;}
  .aq-hero-media{min-height:300px;order:-1;}
  .aq-hero-text{padding:44px 24px 54px;}
}

/* ---------- sections ---------- */
.aq-sec{padding:var(--gap) 0;position:relative;}
.aq-sec-white{background:var(--paper);}
.aq-sec-cobalt{background:var(--cobalt);color:#D3DDEC;}
.aq-sec-cobalt h2,.aq-sec-cobalt h3{color:#fff;}
.aq-sec-cobalt .aq-eyebrow{color:var(--turq-lit);}
.aq-sec-cobalt .aq-lede{color:#C0CDE0;}

/* ---------- the street ---------- */
.aq-hood{border-top:1px solid var(--line);margin-top:50px;}
.aq-hood-row{
  display:grid;grid-template-columns:1.05fr 1.6fr auto;gap:24px;align-items:baseline;
  padding:21px 0;border-bottom:1px solid var(--line);transition:background .25s;
}
.aq-hood-row:hover{background:rgba(16,156,148,.07);}
.aq-hood-row .name{font-family:var(--display);font-size:clamp(21px,2.1vw,28px);}
.aq-hood-row .kind{
  display:block;font-family:var(--body);font-size:10px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--turq);margin-top:2px;
}
.aq-hood-row .note{font-size:16px;color:var(--muted);font-weight:300;}
.aq-hood-row .mins{font-family:var(--display);font-size:clamp(21px,2.1vw,28px);color:var(--anor);white-space:nowrap;}
.aq-hood-row .mins span{font-family:var(--body);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-left:6px;}
@media (max-width:760px){
  .aq-hood-row{grid-template-columns:1fr auto;}
  .aq-hood-row .note{grid-column:1 / -1;order:3;}
}

/* =====================================================================
   THE TIMELINE — the reason a history traveller stays here rather than
   somewhere else. Real dates, real stories. This content IS sequential,
   which is the only thing that earns a timeline.
   ===================================================================== */
.aq-time{margin-top:56px;border-left:2px solid var(--line);}
.aq-time-row{
  display:grid;grid-template-columns:150px 1fr;gap:28px;
  padding:26px 0 26px 32px;position:relative;
}
.aq-time-row::before{
  content:"";position:absolute;left:-7px;top:37px;
  width:12px;height:12px;background:var(--turq);
  border:2px solid var(--ganch);border-radius:50%;
}
.aq-sec-white .aq-time-row::before{border-color:var(--paper);}
.aq-time-row.big::before{background:var(--anor);width:16px;height:16px;left:-9px;}
.aq-date{
  font-family:var(--display);font-size:clamp(22px,2.2vw,28px);
  color:var(--cobalt);line-height:1.2;
}
.aq-date small{display:block;font-family:var(--body);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:4px;font-weight:600;}
.aq-time-row h3{font-size:clamp(21px,2.1vw,27px);margin-bottom:8px;}
.aq-time-row p{margin:0;font-size:16px;color:var(--muted);font-weight:300;max-width:56ch;}
.aq-time-row q{font-style:italic;color:var(--ink);}
@media (max-width:760px){
  .aq-time-row{grid-template-columns:1fr;gap:8px;padding-left:26px;}
  .aq-time-row::before{top:30px;}
}

/* =====================================================================
   THE CRAFT — the page's own ornament, explained.
   Every pattern in the spine is a real Khorezm motif with a real meaning.
   Showing the meaning turns decoration into content.
   ===================================================================== */
.aq-motifs{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:52px;}
@media (max-width:900px){.aq-motifs{grid-template-columns:1fr;}}
.aq-motif{border:1px solid var(--line);background:var(--paper);}
.aq-sec-white .aq-motif{background:var(--ganch);}
.aq-motif .swatch{height:120px;width:100%;display:block;}
.aq-motif .body{padding:26px;}
.aq-motif h3{margin-bottom:8px;}
.aq-motif .term{
  font-family:var(--body);font-size:10px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--turq);display:block;margin-bottom:12px;
}
.aq-motif p{margin:0;font-size:15px;color:var(--muted);font-weight:300;}

/* the dyes: four colours, four plants. All true. */
.aq-dyes{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);margin-top:48px;}
.aq-dye{background:var(--paper);padding:0;}
.aq-sec-white .aq-dye{background:var(--ganch);}
.aq-dye .chip{height:76px;}
.aq-dye .txt{padding:18px 20px;}
.aq-dye b{display:block;font-family:var(--display);font-size:20px;font-weight:400;}
.aq-dye span{font-size:13px;color:var(--muted);font-weight:300;}
@media (max-width:700px){.aq-dyes{grid-template-columns:repeat(2,1fr);}}

/* ---------- split ---------- */
.aq-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,80px);align-items:center;}
@media (max-width:900px){.aq-split{grid-template-columns:1fr;}}
.aq-split img{width:100%;aspect-ratio:5/6;object-fit:cover;}

/* ---------- cards ---------- */
.aq-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:50px;}
@media (max-width:900px){.aq-grid3{grid-template-columns:1fr;}}
.aq-card{background:var(--paper);border:1px solid var(--line);padding:30px 26px;}
.aq-sec-cobalt .aq-card{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2);}
.aq-card .ic{width:32px;height:32px;color:var(--turq);margin-bottom:16px;}
.aq-sec-cobalt .aq-card .ic{color:var(--turq-lit);}
.aq-card p{font-size:15px;color:var(--muted);margin:0;font-weight:300;}
.aq-sec-cobalt .aq-card p{color:#C0CDE0;}

/* seeds */
.aq-seeds{list-style:none;margin:24px 0 0;padding:0;}
.aq-seeds li{position:relative;padding-left:26px;margin-bottom:12px;font-size:16px;color:var(--muted);font-weight:300;}
.aq-seeds li b{font-weight:600;color:var(--ink);}
.aq-seeds li::before{
  content:"";position:absolute;left:0;top:.62em;width:9px;height:11px;
  background:var(--anor);border-radius:60% 60% 50% 50% / 70% 70% 40% 40%;transform:rotate(-12deg);
}

/* table */
.aq-table{width:100%;border-collapse:collapse;margin-top:26px;font-size:16px;}
.aq-table th,.aq-table td{text-align:left;padding:14px 12px 14px 0;border-bottom:1px solid var(--line);}
.aq-table th{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:600;}
.aq-table td:first-child{font-family:var(--display);font-size:20px;}
.aq-table td{color:var(--muted);font-weight:300;}

/* photo band */
.aq-photoband{position:relative;}
.aq-photoband img{width:100%;height:clamp(280px,40vw,520px);object-fit:cover;}
.aq-photoband-cap{position:absolute;left:0;right:0;bottom:0;padding:clamp(34px,6vw,64px) 24px clamp(24px,4vw,40px);background:linear-gradient(180deg,rgba(21,18,13,0),rgba(21,18,13,.9));}
.aq-photoband-cap h2{color:#fff;font-size:clamp(26px,3.2vw,42px);max-width:22ch;}
.aq-photoband-cap .aq-eyebrow{color:var(--turq-lit);}

/* FAQ */
.aq-faq{max-width:840px;margin-top:44px;}
.aq-faq details{border-bottom:1px solid var(--line);padding:20px 0;}
.aq-faq summary{
  font-family:var(--display);font-size:clamp(20px,2vw,25px);cursor:pointer;
  list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;
}
.aq-faq summary::-webkit-details-marker{display:none;}
.aq-faq summary::after{content:"+";font-family:var(--body);font-weight:300;color:var(--turq);font-size:26px;line-height:1;}
.aq-faq details[open] summary::after{content:"–";}
.aq-faq details p{margin:14px 0 0;color:var(--muted);font-size:16px;max-width:66ch;font-weight:300;}

/* contact strip */
.aq-contact{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.18);}
.aq-contact-item{background:var(--ink);padding:30px 24px;}
.aq-contact-item h3{font-family:var(--body);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--turq-lit);margin-bottom:12px;font-weight:600;}
.aq-contact-item a,.aq-contact-item span{display:block;font-family:var(--display);font-size:19px;line-height:1.4;color:#fff;text-decoration:none;}
.aq-contact-item a:hover{color:var(--turq-lit);}
.aq-contact-item small{display:block;margin-top:8px;font-family:var(--body);font-size:13px;color:#9A9284;font-weight:300;}
@media (max-width:900px){.aq-contact{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.aq-contact{grid-template-columns:1fr;}}

/* cta */
.aq-cta{text-align:center;padding:var(--gap) 24px;background:var(--paper);}
.aq-cta h2{font-size:clamp(32px,4.2vw,54px);margin:0 auto 20px;max-width:20ch;}
.aq-cta p{color:var(--muted);max-width:48ch;margin:0 auto 34px;font-weight:300;}

/* footer */
.aq-foot{background:var(--ink);color:#948C7E;padding:62px 24px 32px;}
.aq-foot-in{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:40px;}
.aq-foot h4{font-family:var(--body);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#fff;margin:0 0 18px;font-weight:600;}
.aq-foot p{font-size:15px;font-weight:300;}
.aq-foot a{color:#948C7E;text-decoration:none;display:block;margin-bottom:9px;font-size:15px;font-weight:300;}
.aq-foot a:hover{color:var(--turq-lit);}
.aq-foot-logo{height:48px;width:auto;margin-bottom:18px;}
.aq-foot-bottom{
  max-width:var(--wrap);margin:44px auto 0;padding-top:22px;
  border-top:1px solid rgba(148,140,126,.24);font-size:13px;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-weight:300;
}
@media (max-width:900px){.aq-foot-in{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.aq-foot-in{grid-template-columns:1fr;gap:32px;}}

/* motion */
.aq-rv{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1);}
.aq-rv.in{opacity:1;transform:none;}
.aq-minor rect{opacity:0;transition:opacity 1s ease;}
.aq-minor.lit rect{opacity:1;}
@media (prefers-reduced-motion:reduce){
  .aq-rv,.aq-minor rect{opacity:1;transform:none;transition:none;}
  .aq-btn:hover{transform:none;}
}

/* =====================================================================
   THE SIGN-IN MODAL
   Staff should not be marched off to a separate login page to reach a
   dashboard. The box opens here, authenticates here, and drops them
   straight into the CRM.
   ===================================================================== */
.aq-modal{
  position:fixed;inset:0;z-index:9999;
  display:none;align-items:center;justify-content:center;
  padding:20px;
  background:rgba(21,18,13,.62);
  backdrop-filter:blur(6px);
}
.aq-modal.open{display:flex;}
.aq-modal-panel{
  position:relative;width:100%;max-width:420px;
  background:var(--paper);
  box-shadow:0 30px 80px rgba(21,18,13,.4);
  animation:aqRise .32s cubic-bezier(.2,.7,.2,1);
}
@keyframes aqRise{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.aq-modal-panel{animation:none;}}

.aq-modal-band{display:block;width:100%;height:12px;}

.aq-modal-body{padding:34px 34px 32px;}

.aq-modal h2{font-size:30px;text-align:center;margin-bottom:6px;}
.aq-modal .aq-modal-sub{
  text-align:center;font-size:14px;color:var(--muted);font-weight:300;margin-bottom:24px;
}

.aq-field{margin-bottom:16px;}
.aq-field label{
  display:block;font-size:10px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted);margin-bottom:7px;
}
.aq-site .aq-field input[type="text"],
.aq-site .aq-field input[type="password"]{
  width:100%;padding:13px 14px;
  border:1px solid var(--line);background:var(--ganch);
  color:var(--ink);font-family:var(--body);font-size:16px;
  transition:border-color .2s,background .2s;
}
.aq-site .aq-field input:focus{
  outline:none;border-color:var(--turq);background:var(--paper);
}

.aq-remember{
  display:flex;align-items:center;gap:9px;
  font-size:14px;color:var(--muted);font-weight:300;margin-bottom:20px;
}
.aq-remember input{width:16px;height:16px;accent-color:var(--cobalt);}

.aq-modal .aq-btn{width:100%;text-align:center;}

.aq-modal-error{
  display:none;margin-bottom:16px;padding:11px 14px;
  background:#FBEAEC;border-left:3px solid var(--anor);
  color:#8E1C2B;font-size:14px;
}
.aq-modal-error.show{display:block;}

.aq-modal-foot{
  margin-top:20px;padding-top:18px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:12px;
  font-size:13px;color:var(--muted);font-weight:300;flex-wrap:wrap;
}
.aq-modal-foot a{color:var(--cobalt);text-decoration:none;font-weight:500;}
.aq-modal-foot a:hover{color:var(--anor);}

.aq-modal-x{
  position:absolute;top:20px;right:18px;
  background:none;border:0;cursor:pointer;padding:6px;
  color:var(--muted);line-height:0;
}
.aq-modal-x:hover{color:var(--anor);}
.aq-modal-x svg{width:18px;height:18px;}

.aq-btn[disabled]{opacity:.6;cursor:wait;transform:none;}

.aq-site a:focus-visible,.aq-site button:focus-visible,.aq-site summary:focus-visible,.aq-site input:focus-visible{outline:2px solid var(--anor);outline-offset:3px;}