 :root {
  --black: #0d0d0d;
  --charcoal: #171717;
  --warm-white: #f4f1ec;
  --white: #ffffff;
  --gold: #b08a55;
  --grey: #b8b5af;
  --text: #242424;
  --max: 1220px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
  background: var(--warm-white);
  line-height: 1.6;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
.site-header {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  right: 0;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 5vw;
  background: rgba(10,10,10,.86);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.brand img { width: 290px; max-height: 58px; object-fit: contain; object-position: left center; }
.main-nav { display: flex; gap: 28px; }
.main-nav a {
  color: white;
  text-decoration: none;
  font-size: .9rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.menu-button {
  display: none;
  background: none;
  border: 1px solid rgba(255,255,255,.4);
  color: white;
  padding: 9px 13px;
}
.hero {
  min-height: 100vh;
  position: relative;
  display: flex;
  align-items: center;
  background: url("../images/milano.jpg") center/cover no-repeat;
  color: white;
  padding: 140px 8vw 80px;
}
.hero-overlay, .network-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.85), rgba(0,0,0,.42) 60%, rgba(0,0,0,.18));
}
.hero-content {
  position: relative;
  z-index: 2;
  max-width: 760px;
}
.eyebrow {
  margin: 0 0 15px;
  text-transform: uppercase;
  letter-spacing: .22em;
  font-size: .78rem;
  color: #d8bc92;
  font-weight: 700;
}
.eyebrow.dark { color: #8a6537; }
h1, h2, h3 { margin-top: 0; line-height: 1.08; }
h1 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(3.2rem, 7vw, 6.8rem);
  max-width: 900px;
  margin-bottom: 25px;
}
h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(2.2rem, 4.2vw, 4.5rem);
  max-width: 900px;
}
.hero-copy { font-size: 1.2rem; max-width: 690px; color: rgba(255,255,255,.88); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.button {
  display: inline-block;
  text-decoration: none;
  padding: 14px 22px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .78rem;
  font-weight: 700;
  border: 1px solid transparent;
}
.button-primary { background: var(--gold); color: white; }
.button-secondary { border-color: rgba(255,255,255,.7); color: white; }
.button.full { display: block; text-align: center; margin-top: 18px; }
.hero-stamp {
  position: absolute;
  z-index: 2;
  right: 7vw;
  bottom: 8vh;
  width: 150px;
  height: 150px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 50%;
  display: grid;
  place-content: center;
  text-align: center;
}
.hero-stamp strong { font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; }
.hero-stamp span { display: block; font-family: Georgia, serif; font-size: 2.4rem; }
.section { padding: 110px 7vw; }
.section-light { background: var(--warm-white); }
.section-dark { background: var(--black); color: white; }
.section-heading { max-width: var(--max); margin: 0 auto 55px; }
.two-column {
  max-width: var(--max);
  margin: auto;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 8vw;
}
.lead { font-family: Georgia, serif; font-size: 2rem; line-height: 1.3; margin: 0; }
.body-copy p { margin-top: 0; margin-bottom: 20px; font-size: 1.05rem; }
.service-grid {
  max-width: var(--max);
  margin: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(255,255,255,.16);
}
.service-card { background: var(--charcoal); padding: 42px 34px; min-height: 280px; }
.service-card span { color: var(--gold); letter-spacing: .1em; }
.service-card h3 { font-family: Georgia, serif; font-size: 1.7rem; margin: 35px 0 16px; }
.service-card p { color: rgba(255,255,255,.72); }
.partner-copy {
  max-width: var(--max);
  margin: 38px auto 0;
  font-family: Georgia, serif;
  font-size: 1.55rem;
  color: rgba(255,255,255,.86);
}

.editorial-showcase { background: #0b0b0b; }
.editorial-hero { margin: 0; min-height: 82vh; position: relative; overflow: hidden; background: #dedede; }
.editorial-hero img { width: 100%; height: 82vh; object-fit: cover; object-position: center; }
.editorial-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.16), rgba(0,0,0,0) 55%); }
.editorial-hero figcaption { position: absolute; z-index: 2; left: 7vw; bottom: 7vh; max-width: 560px; color: white; }
.editorial-hero figcaption span { display: block; margin-bottom: 12px; text-transform: uppercase; letter-spacing: .18em; font-size: .76rem; }
.editorial-hero figcaption strong { display: block; font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-size: clamp(2rem, 4vw, 4.2rem); line-height: 1.08; }
.editorial-mosaic { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 310px; gap: 1px; background: rgba(255,255,255,.12); }
.tile { position: relative; margin: 0; overflow: hidden; background: #efefef; }
.tile-tall { grid-row: span 2; }
.tile-wide { grid-column: span 2; }
.tile-dark { background: #000; }
.tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.tile:hover img { transform: scale(1.025); }
.tile figcaption { position: absolute; left: 16px; bottom: 14px; background: rgba(0,0,0,.72); color: white; padding: 9px 12px; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; }
.category-list {
  max-width: var(--max);
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.category-list span {
  border: 1px solid #b8b0a5;
  padding: 15px 21px;
  background: white;
  font-size: .95rem;
}
.category-note { max-width: var(--max); margin: 28px auto 0; color: #666; }
.network-section {
  position: relative;
  background: url("../images/hong-kong-night.jpg") center/cover fixed;
  color: white;
}
.network-content { max-width: var(--max); margin: auto; position: relative; z-index: 2; }
.city-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 1px;
  margin: 42px 0 28px;
  background: rgba(255,255,255,.28);
}
.city-grid div { padding: 28px; background: rgba(12,12,12,.78); }
.city-grid strong { display: block; font-family: Georgia, serif; font-size: 1.7rem; }
.city-grid span { color: rgba(255,255,255,.6); text-transform: uppercase; font-size: .72rem; letter-spacing: .12em; }
.network-copy { max-width: 760px; color: rgba(255,255,255,.82); }
.contact-section {
  max-width: var(--max);
  margin: auto;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 8vw;
}
.contact-card {
  background: white;
  padding: 36px;
  box-shadow: 0 20px 70px rgba(0,0,0,.08);
}
.contact-card h3 { font-family: Georgia, serif; font-size: 1.8rem; margin-bottom: 4px; }
.contact-card p { color: #777; margin-top: 0; }
.contact-card a:not(.button) { display: block; margin: 10px 0; text-decoration: none; }
.site-footer {
  background: #070707;
  color: rgba(255,255,255,.65);
  text-align: center;
  padding: 55px 20px;
  font-size: .82rem;
}
.site-footer img {
  width: 260px;
  max-height: 90px;
  object-fit: contain;
  margin: 0 auto 22px;
  filter: grayscale(1) brightness(1.6);
}
@media (max-width: 900px) {
  .site-header { height: 74px; }
  .brand img { width: 220px; }
  .menu-button { display: block; }
  .main-nav {
    display: none;
    position: absolute;
    top: 74px;
    left: 0;
    right: 0;
    background: #111;
    padding: 20px 5vw 26px;
    flex-direction: column;
  }
  .main-nav.open { display: flex; }
  .hero-stamp { display: none; }
  .two-column, .contact-section { grid-template-columns: 1fr; }
  .service-grid { grid-template-columns: 1fr; }
  .editorial-mosaic { grid-template-columns: 1fr 1fr; grid-auto-rows: 330px; }
  .tile-wide { grid-column: span 2; }
  .city-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .hero { min-height: 88vh; padding-left: 6vw; padding-right: 6vw; }
  .section { padding: 82px 6vw; }
  .editorial-hero, .editorial-hero img { min-height: 68vh; height: 68vh; }
  .editorial-mosaic { display: block; }
  .tile { height: 330px; }
  .tile-tall, .tile-wide { height: 390px; }
  .city-grid { grid-template-columns: 1fr; }
  .lead { font-size: 1.6rem; }
}


/* Subtle scroll reveal effects */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .7s ease, transform .7s ease;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

.language-switcher{display:flex;gap:10px;margin-left:22px;align-items:center}.language-switcher a{color:rgba(255,255,255,.72);text-decoration:none;font-size:.72rem;letter-spacing:.08em}.language-switcher a.active,.language-switcher a:hover{color:#fff}.header-actions{display:flex;align-items:center}.reveal{opacity:0;transform:translateY(28px) scale(.995);transition:opacity .85s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1)}.reveal.visible{opacity:1;transform:none}.globe-section{background:#111;color:#fff}.globe-wrap{max-width:var(--max);margin:auto;display:grid;grid-template-columns:1.1fr .9fr;gap:7vw;align-items:center}.globe{width:min(520px,90vw);aspect-ratio:1;border-radius:50%;margin:auto;position:relative;overflow:hidden;background:radial-gradient(circle at 32% 30%,rgba(255,255,255,.13),transparent 32%),radial-gradient(circle at 65% 68%,rgba(176,138,85,.2),transparent 30%),repeating-linear-gradient(0deg,transparent 0 32px,rgba(255,255,255,.06) 33px 34px),repeating-linear-gradient(90deg,transparent 0 32px,rgba(255,255,255,.06) 33px 34px),#0a0a0a;box-shadow:inset 0 0 70px rgba(255,255,255,.05),0 30px 90px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.14)}.globe:before,.globe:after{content:"";position:absolute;inset:8%;border:1px solid rgba(255,255,255,.10);border-radius:50%}.globe:after{inset:23% 5%}.city-dot{position:absolute;transform:translate(-50%,-50%);width:18px;height:18px;border-radius:50%;background:var(--gold);border:3px solid rgba(255,255,255,.85);box-shadow:0 0 0 0 rgba(176,138,85,.55);animation:pulse 2.6s infinite;cursor:pointer}.city-dot:after{content:attr(data-city);position:absolute;left:50%;top:24px;transform:translateX(-50%);white-space:nowrap;color:#fff;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(176,138,85,.45)}70%{box-shadow:0 0 0 14px rgba(176,138,85,0)}100%{box-shadow:0 0 0 0 rgba(176,138,85,0)}}.globe-copy-card{background:#181818;border:1px solid rgba(255,255,255,.12);padding:36px}.globe-copy-card h3{font-family:Georgia,serif;font-size:2rem;margin-bottom:10px}.globe-copy-card p{color:rgba(255,255,255,.68)}.city-detail{margin-top:28px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);min-height:76px}.city-detail strong{color:#d8bc92;display:block;font-size:1.05rem}.city-detail span{color:rgba(255,255,255,.68)}.brands-page{padding-top:140px;min-height:100vh;background:var(--warm-white)}.brands-intro{max-width:900px;margin:0 auto 50px;font-size:1.12rem;color:#555}.brand-groups{max-width:var(--max);margin:auto;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:#c9c0b4}.brand-group{background:#fff;padding:42px;min-height:220px}.brand-group h3{font-family:Georgia,serif;font-size:1.65rem;margin-bottom:22px}.brand-group p{font-size:1.1rem;line-height:1.9;color:#555}.brand-note{max-width:var(--max);margin:28px auto 0;color:#777;font-size:.86rem}@media(max-width:900px){.header-actions{flex-direction:column;align-items:flex-end;gap:8px}.language-switcher{margin-left:0;order:-1}.globe-wrap,.brand-groups{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.city-dot{animation:none}}
