/* MacauLimo v2 : editorial dark-lounge register.
   Near-black ground, asymmetric editorial layout, offset type, one oversized
   display headline, duotone-treated photography, generous negative space,
   minimal chrome. No cards, no cream. Shared by EN, ZH-HANT, ZH-CN, PT. */
:root{
  --bg:#070605;
  --bg-2:#0b0908;
  --ink:#efe9dd;          /* primary text on near-black */
  --body:#d8d2c4;         /* body copy, high contrast on --bg */
  --faint:#a79e8d;        /* captions and secondary lines only */
  --gold:#c8a45e;
  --gold-2:#e6cd93;
  --hair:rgba(200,164,94,.30);
  --hair-soft:rgba(239,233,221,.13);
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Inter","Helvetica Neue",Arial,sans-serif;
}
html[lang="zh-Hant"]{ --serif:"Noto Serif TC","Songti TC",serif; --sans:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif; }
html[lang="zh-CN"]{ --serif:"Noto Serif SC","Songti SC","SimSun",serif; --sans:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif; }
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--body);
  font-family:var(--sans); font-weight:400;
  font-size:18.5px; line-height:1.78;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
::selection{background:var(--gold); color:#141005}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--serif);font-weight:500;color:var(--ink)}
p{max-width:34em}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform .9s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}
[hidden]{display:none!important}

/* ---------- chrome: a whisper of a masthead ---------- */
header{
  position:absolute; top:0; left:0; right:0; z-index:40;
  display:flex; align-items:flex-start; justify-content:space-between;
  padding:30px clamp(20px,4.5vw,64px) 0;
}
.wordmark{font-family:var(--serif); font-size:1.3rem; font-weight:600; letter-spacing:.30em; color:var(--ink); white-space:nowrap}
.wordmark b{font-weight:600; color:var(--gold)}
.side-rail{display:flex; flex-direction:column; align-items:flex-end; gap:14px}
.langs{display:flex; gap:2px; font-size:.78rem; letter-spacing:.12em}
.langs a{padding:5px 9px; color:var(--faint); border-bottom:1px solid transparent; white-space:nowrap}
.langs a:hover{color:var(--gold-2)}
.langs a.on{color:var(--gold-2); border-bottom-color:var(--gold)}
nav.index{display:flex; gap:26px; font-size:.72rem; letter-spacing:.30em; text-transform:uppercase}
nav.index a{color:var(--ink); opacity:.78}
nav.index a:hover{opacity:1; color:var(--gold-2)}
html[lang^="zh"] nav.index a{letter-spacing:.24em}
@media(max-width:900px){ nav.index{display:none} }

/* ---------- shared bits ---------- */
.kicker{font-size:.74rem; letter-spacing:.46em; text-transform:uppercase; color:var(--gold); font-weight:500}
html[lang^="zh"] .kicker{letter-spacing:.34em}
.folio{font-family:var(--serif); font-style:italic; font-size:1rem; color:var(--faint); letter-spacing:.08em}
.btn{
  display:inline-block; padding:17px 34px; font-size:.78rem; letter-spacing:.30em; text-transform:uppercase;
  border:1px solid var(--gold); color:var(--gold-2); background:transparent; cursor:pointer;
  transition:background .3s ease,color .3s ease; font-family:var(--sans); font-weight:500;
}
html[lang^="zh"] .btn{letter-spacing:.26em}
.btn:hover{background:var(--gold); color:#171106}
.btn.fill{background:var(--gold); color:#171106}
.btn.fill:hover{background:var(--gold-2); border-color:var(--gold-2)}
figure{margin:0}
figcaption{font-family:var(--serif); font-style:italic; font-size:.98rem; color:var(--faint); letter-spacing:.05em; margin-top:12px}
.duo{filter:saturate(.55) contrast(1.07) brightness(.94)}

/* ---------- HERO : two columns, no overlap (v4) ----------
   Copy sits in its own left column, the photograph whole in its own right
   column at its native 16/9 ratio. No text over the photo at any width,
   no crop, no gradient: the layout cannot push the tower out of frame
   or run the headline across it. */
.hero{
  position:relative; display:grid; align-items:center;
  grid-template-columns:minmax(330px,5fr) 7fr;
  gap:clamp(28px,3.5vw,60px);
  padding:clamp(118px,16vh,164px) clamp(20px,4.5vw,64px) clamp(54px,8vh,84px);
}
.hero-photo{
  grid-column:2; grid-row:1; position:relative; width:100%;
  aspect-ratio:16/9; overflow:hidden;
}
.hero-photo img{width:100%; height:100%; object-fit:cover; object-position:center}
.hero-copy{grid-column:1; grid-row:1; position:relative; max-width:560px}
.hero h1{
  font-size:clamp(3.6rem,6vw,6.4rem); line-height:.98; letter-spacing:-.015em;
  margin:24px 0 0; font-weight:500;
}
html[lang^="zh"] .hero h1{font-size:clamp(3rem,5.4vw,5.6rem); letter-spacing:.02em; line-height:1.08}
.hero h1 .l2{display:block; margin-left:clamp(0px,2vw,30px); font-style:italic; color:var(--gold-2)}
.hero-sub{
  margin:clamp(26px,4vh,42px) 0 0 clamp(0px,2vw,30px);
  max-width:31em; font-size:1.1rem; line-height:1.75; color:var(--ink);
}
.hero-links{
  margin:34px 0 0 clamp(0px,2vw,30px); display:flex; gap:38px; flex-wrap:wrap; align-items:center;
  font-size:.78rem; letter-spacing:.30em; text-transform:uppercase;
}
html[lang^="zh"] .hero-links{letter-spacing:.24em}
.hero-links a{color:var(--gold-2); border-bottom:1px solid var(--hair); padding-bottom:6px}
.hero-links a:hover{border-bottom-color:var(--gold-2)}
.hero-links a.plain{color:var(--faint); border-bottom-color:transparent}
.hero-links a.plain:hover{color:var(--ink)}
.hero-foot{
  grid-column:1 / -1; grid-row:2; position:relative; margin-top:clamp(10px,2vh,24px);
  display:flex; justify-content:space-between; align-items:baseline; gap:24px; flex-wrap:wrap;
}
.hero-cap{font-family:var(--serif); font-style:italic; color:var(--faint); font-size:1.02rem; letter-spacing:.04em}

/* ---------- statement : a single editorial paragraph, offset ---------- */
.statement{padding:clamp(120px,18vh,200px) clamp(20px,4.5vw,64px)}
.statement .in{margin-left:clamp(0px,16vw,300px); max-width:880px}
.statement p.lede-line{
  font-family:var(--serif); font-size:clamp(1.75rem,3.4vw,2.7rem); line-height:1.42; color:var(--ink); max-width:24em;
}
.statement p.lede-line em{font-style:italic; color:var(--gold-2)}
.statement .folio{margin-bottom:30px; display:block}

/* ---------- duotone strip ---------- */
.strip{
  display:grid; grid-template-columns:7fr 5fr; gap:clamp(14px,2.4vw,34px);
  padding:0 clamp(20px,4.5vw,64px); align-items:start;
}
.strip .tall{margin-top:clamp(40px,9vh,110px)}
.strip img{width:100%; height:100%; object-fit:cover}
.strip .wide{aspect-ratio:16/10}
.strip .tall img{aspect-ratio:3/4}

/* ---------- services : an index, not cards ---------- */
.services{padding:clamp(120px,17vh,190px) clamp(20px,4.5vw,64px) clamp(90px,12vh,140px)}
.sec-head{display:flex; align-items:baseline; gap:34px; flex-wrap:wrap; margin-bottom:clamp(48px,7vh,84px)}
.sec-head h2{font-size:clamp(2.6rem,5.6vw,4.6rem); line-height:1.02}
.sec-head .folio{margin-left:auto}
.svc{
  display:grid; grid-template-columns:clamp(64px,9vw,150px) minmax(220px,430px) 1fr;
  gap:clamp(18px,3.4vw,54px); align-items:baseline;
  padding:40px 0; border-top:1px solid var(--hair-soft);
}
.svc:last-child{border-bottom:1px solid var(--hair-soft)}
.svc .no{font-family:var(--serif); font-style:italic; font-size:clamp(1.7rem,3vw,2.5rem); color:var(--gold); line-height:1}
.svc h3{font-size:clamp(1.55rem,2.4vw,2.05rem); line-height:1.2}
.svc p{color:var(--body); max-width:36em; justify-self:end}
@media(max-width:860px){
  .svc{grid-template-columns:52px 1fr}
  .svc p{grid-column:2; justify-self:start}
}

/* ---------- night interlude ---------- */
.interlude{position:relative; margin:clamp(30px,6vh,70px) 0}
.interlude img{width:100%; height:clamp(340px,62vh,620px); object-fit:cover}
.interlude::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(7,6,5,.55), rgba(7,6,5,0) 45%), linear-gradient(180deg, rgba(7,6,5,.45), rgba(7,6,5,0) 40%)}
.interlude figcaption{position:absolute; z-index:2; left:clamp(20px,4.5vw,64px); bottom:26px; color:var(--ink); margin:0}

/* ---------- vehicles : type-led, one photograph ---------- */
.vehicles{padding:clamp(110px,15vh,170px) clamp(20px,4.5vw,64px)}
.veh-grid{display:grid; grid-template-columns:5fr 6fr; gap:clamp(30px,5vw,90px); align-items:start}
.veh-photo{position:sticky; top:40px}
.veh-photo img{aspect-ratio:4/5; width:100%; object-fit:cover}
.veh{padding:34px 0 40px; border-top:1px solid var(--hair-soft)}
.veh:first-child{padding-top:6px}
.veh h3{font-size:clamp(1.9rem,3.2vw,2.7rem); line-height:1.1}
.veh .cls{font-family:var(--serif); font-style:italic; color:var(--gold-2); font-size:1.18rem; margin:10px 0 16px}
.veh p{color:var(--body)}
.veh ul{list-style:none; margin-top:20px}
.veh ul li{padding:9px 0 9px 26px; position:relative; color:var(--ink); font-size:1.02rem; border-top:1px solid var(--hair-soft)}
.veh ul li::before{content:""; position:absolute; left:0; top:1.35em; width:12px; height:1px; background:var(--gold)}
@media(max-width:860px){ .veh-grid{grid-template-columns:1fr} .veh-photo{position:static} .veh-photo img{aspect-ratio:16/10} }

/* ---------- the standard : text columns, bridge photograph ---------- */
.standard{padding:clamp(100px,14vh,160px) clamp(20px,4.5vw,64px); background:var(--bg-2); border-top:1px solid var(--hair-soft); border-bottom:1px solid var(--hair-soft)}
.std-grid{display:grid; grid-template-columns:6fr 5fr; gap:clamp(30px,5vw,90px); align-items:start}
.std-photo img{width:100%; aspect-ratio:16/11; object-fit:cover}
.principles{margin-top:16px}
.principle{padding:26px 0; border-top:1px solid var(--hair-soft)}
.principle:last-child{border-bottom:1px solid var(--hair-soft)}
.principle h3{font-size:1.5rem; margin-bottom:8px}
.principle p{color:var(--body)}
@media(max-width:860px){ .std-grid{grid-template-columns:1fr} }

/* ---------- journeys : an itinerary list ---------- */
.journeys{padding:clamp(110px,15vh,170px) clamp(20px,4.5vw,64px)}
.journey-photo{margin:0 0 clamp(50px,8vh,90px) auto; width:min(680px,100%)}
.journey-photo img{width:100%; aspect-ratio:16/10; object-fit:cover}
.stop{
  display:grid; grid-template-columns:clamp(150px,20vw,300px) 1fr; gap:clamp(18px,3.4vw,54px);
  padding:30px 0; border-top:1px solid var(--hair-soft); align-items:baseline;
}
.stop:last-child{border-bottom:1px solid var(--hair-soft)}
.stop h3{font-size:clamp(1.45rem,2.2vw,1.9rem)}
.stop p{color:var(--body); max-width:38em; justify-self:end}
@media(max-width:760px){ .stop{grid-template-columns:1fr} .stop p{justify-self:start} }

/* ---------- enquire ---------- */
.enquire{padding:clamp(110px,16vh,180px) clamp(20px,4.5vw,64px) clamp(90px,12vh,140px); border-top:1px solid var(--hair-soft)}
.enq-grid{display:grid; grid-template-columns:5fr 6fr; gap:clamp(34px,6vw,110px); align-items:start}
.enquire h2{font-size:clamp(2.7rem,5.6vw,4.6rem); line-height:1.02; margin:22px 0 26px}
.enquire p{color:var(--body)}
.enquire .conf{margin-top:28px; padding-top:24px; border-top:1px solid var(--hair-soft); font-family:var(--serif); font-style:italic; font-size:1.12rem; color:var(--faint); max-width:26em}
form{display:grid; gap:26px}
form label{display:block; font-size:.74rem; letter-spacing:.32em; text-transform:uppercase; color:var(--faint); margin-bottom:10px}
html[lang^="zh"] form label{letter-spacing:.22em}
form input, form textarea{
  width:100%; background:transparent; border:0; border-bottom:1px solid var(--hair);
  color:var(--ink); font-family:var(--sans); font-size:1.06rem; padding:8px 2px 12px; border-radius:0;
}
form textarea{min-height:120px; resize:vertical}
form input:focus, form textarea:focus{outline:none; border-bottom-color:var(--gold-2)}
.form-note{font-size:.94rem; color:var(--faint); line-height:1.6}
@media(max-width:860px){ .enq-grid{grid-template-columns:1fr} }

/* ---------- footer ---------- */
footer{padding:56px clamp(20px,4.5vw,64px) 64px; border-top:1px solid var(--hair-soft)}
.foot-top{display:flex; justify-content:space-between; align-items:baseline; gap:26px; flex-wrap:wrap}
.foot-nav{display:flex; gap:26px; font-size:.74rem; letter-spacing:.28em; text-transform:uppercase}
html[lang^="zh"] .foot-nav{letter-spacing:.2em}
.foot-nav a{color:var(--faint)}
.foot-nav a:hover{color:var(--gold-2)}
.acquisition{margin-top:44px; font-family:var(--serif); font-size:1.16rem; color:var(--ink); max-width:44em}
.copyright{margin-top:14px; font-size:.9rem; color:var(--faint)}

/* ---------- consent : slim bottom bar (estate standard) ---------- */
.consent{
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  display:flex; align-items:center; gap:10px 22px; flex-wrap:wrap;
  background:rgba(10,8,7,.97); border-top:1px solid var(--gold);
  padding:13px clamp(16px,4.5vw,64px); box-shadow:0 -12px 36px rgba(0,0,0,.5);
}
.consent h2{font-size:1rem; white-space:nowrap}
.consent p{color:var(--faint); font-size:.92rem; line-height:1.55; flex:1 1 340px; max-width:none}
.consent .row{display:flex; gap:10px; margin-left:auto}
.consent .btn{padding:9px 22px; font-size:.72rem}
.consent .btn.fill{background:var(--gold); color:#171106}
@media(max-width:640px){
  .consent{gap:8px 14px}
  .consent p{flex-basis:100%; order:3}
  .consent .row{margin-left:0}
}

/* ---------- small screens ---------- */
@media(max-width:900px){
  .hero{grid-template-columns:1fr; gap:30px; padding-top:118px}
  .hero-photo{grid-column:1; grid-row:1; width:100%}
  .hero-copy{grid-column:1; grid-row:2; max-width:640px}
  .hero-foot{grid-column:1; grid-row:3}
}
@media(max-width:760px){
  body{font-size:18px}
  header{flex-wrap:wrap; gap:10px}
  .side-rail{align-items:flex-start}
  header{padding-top:22px}
  .hero h1{font-size:clamp(3.4rem,17vw,5.2rem)}
  html[lang^="zh"] .hero h1{font-size:clamp(3rem,15.5vw,4.6rem)}
  .hero h1 .l2, .hero-sub, .hero-links, .hero-acq, .hero-btns{margin-left:0}
  .statement .in{margin-left:0}
  .strip{grid-template-columns:1fr}
  .strip .tall{margin-top:0}
  .strip .tall img{aspect-ratio:16/10}
  header{padding-top:22px}
}

/* ---------- v6 additions: hero acquisition line + buttons, section intro,
   standard closing line, footer tag line, form heading ---------- */
.hero-acq{margin:24px 0 0 clamp(0px,2vw,30px); font-family:var(--serif); font-style:italic; font-size:1.12rem; color:var(--gold-2); letter-spacing:.04em; max-width:31em}
.hero-btns{margin:32px 0 0 clamp(0px,2vw,30px); display:flex; gap:16px; flex-wrap:wrap; align-items:center}
.sec-intro{margin:0 0 clamp(40px,6vh,64px); max-width:42em; color:var(--body)}
.std-close{display:block; margin-top:clamp(36px,5vh,56px)}
.foot-tag{margin-top:44px; font-family:var(--serif); font-style:italic; font-size:1.05rem; color:var(--faint); max-width:44em}
.form-head{font-size:1.55rem; margin-bottom:2px}

/* ---------- bot/SEO additions: footer utility links (license, sitemap, accessibility) ---------- */
.a11y-links{display:flex; gap:22px; flex-wrap:wrap; margin-top:22px; font-size:.82rem; letter-spacing:.06em}
.a11y-links a{color:var(--faint); text-decoration:none; border-bottom:1px solid var(--hair-soft)}
.a11y-links a:hover{color:var(--gold)}
