:root {
  --ink: #11161a;
  --muted: #626e77;
  --paper: #f2f5f7;
  --paper-bright: #f8fafb;
  --paper-2: #e6edf2;
  --blue: #65bdf0;
  --night: #13212b;
  --night-2: #0d1419;
  --line: rgba(18,22,25,.14);
  --max: 1440px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { display: block; max-width: 100%; }

.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 30;
  height: 104px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(24px, 5vw, 76px);
  border-bottom: 1px solid rgba(255,255,255,.12);
  color: #fff;
  transition: background .35s ease, height .35s ease, backdrop-filter .35s ease;
}
.site-header.scrolled {
  height: 82px;
  background: rgba(12,18,23,.87);
  backdrop-filter: blur(18px);
}
.brand { width: clamp(210px, 20vw, 330px); }
.brand img { width: 100%; height: auto; filter: drop-shadow(0 4px 18px rgba(0,0,0,.28)); }
.nav { display: flex; gap: clamp(22px, 2.5vw, 42px); font-size: 14px; }
.nav a { position: relative; padding: 9px 0; }
.nav a::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: 4px; height: 1px;
  background: var(--blue); transition: right .25s ease;
}
.nav a:hover::after { right: 0; }
.nav .nav-book {
  padding: 11px 18px;
  margin-left: 2px;
  background: var(--blue);
  color: #08131a;
  border-radius: 2px;
  font-weight: 600;
  transition: transform .25s ease, background .25s ease;
}
.nav .nav-book::after { display:none; }
.nav .nav-book:hover { transform:translateY(-2px); background:#88cef6; }
.menu-button { display:none; background:none; border:0; padding:10px; color:#fff; }
.menu-button span { display:block; width:26px; height:1px; margin:7px 0; background:currentColor; }

.hero {
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: white;
  background: #101419;
}
.hero-image {
  position: absolute;
  inset: -2.5%;
  background: url("assets/images/hero.webp") center 50% / cover no-repeat;
  filter: blur(4.2px) saturate(.84) contrast(.94) brightness(.92);
  animation: heroZoom 14s ease-out both;
  will-change: transform;
}
.hero-shade {
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 50% 48%, rgba(7,12,16,.06) 0%, rgba(7,12,16,.17) 34%, rgba(7,12,16,.34) 74%),
    linear-gradient(180deg, rgba(7,12,16,.48) 0%, rgba(7,12,16,.18) 37%, rgba(7,12,16,.42) 100%);
}
.hero-content { position:relative; z-index:2; text-align:center; padding: 148px 24px 90px; }
.eyebrow { text-transform: uppercase; letter-spacing: .19em; font-size: 11px; line-height: 1.5; }
.hero-eyebrow { font-size: 12px; letter-spacing:.28em; font-weight:600; text-shadow:0 2px 18px rgba(0,0,0,.5); }
.hero h1 {
  margin: 20px 0 14px;
  font-size: clamp(52px, 6.7vw, 96px);
  line-height: .95;
  font-weight: 300;
  letter-spacing: .13em;
  text-transform: uppercase;
  text-shadow: 0 5px 32px rgba(0,0,0,.5);
}
.hero-line { width: 58px; height:2px; background:var(--blue); margin: 28px auto 24px; box-shadow:0 0 20px rgba(101,189,240,.38); }
.hero-location { font-size: clamp(15px, 1.4vw, 20px); margin: 0 0 38px; text-shadow: 0 2px 14px rgba(0,0,0,.5); }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 28px; font-size:13px; transition: all .25s ease; }
.button-ghost { border: 1px solid rgba(255,255,255,.78); color:#fff; background:rgba(0,0,0,.08); backdrop-filter:blur(2px); }
.button-ghost:hover { background:#fff; color:#111; }
.button-solid { background:var(--blue); color:#08131a; }
.button-solid:hover { transform: translateY(-2px); background:#88cef6; }
.hero-actions { display:flex; flex-direction:column; align-items:center; gap:12px; }
.hero-actions .button { min-width:178px; }
.hero-book { box-shadow:0 10px 30px rgba(26,114,164,.22); }
.scroll-cue { position:absolute; z-index:3; left:clamp(24px,5vw,76px); bottom:34px; display:flex; align-items:center; gap:12px; font-size:11px; text-transform:uppercase; letter-spacing:.18em; }
.scroll-cue i { display:block; width:52px; height:1px; background:#fff; opacity:.7; }

.section { padding: clamp(68px, 6.6vw, 98px) clamp(24px, 5vw, 76px); }
.section-head { max-width: var(--max); margin:0 auto 48px; }
.split-head { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:clamp(40px,7vw,110px); align-items:end; }
.section-head h2, .about h2, .contact h2, .visual-copy h2 {
  margin: 14px 0 18px;
  font-size: clamp(42px, 5vw, 76px);
  line-height: .98;
  font-weight: 300;
  letter-spacing: -.045em;
}
.section-head .intro { max-width:560px; margin:0 0 9px; color:var(--muted); font-size:16px; line-height:1.65; }

.portfolio { background:linear-gradient(180deg, #f4f7f9 0%, #eef3f6 100%); }
.project-grid {
  max-width: var(--max);
  margin: 0 auto;
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: clamp(34px, 4vw, 58px) clamp(18px, 2.2vw, 34px);
}
.project-card { cursor:pointer; }
.project-image-wrap { position:relative; overflow:hidden; aspect-ratio: 3 / 2; background:#dfe5e8; }
.project-image-wrap img { width:100%; height:100%; object-fit:cover; transition: transform .75s cubic-bezier(.2,.7,.2,1), filter .4s ease; }
.project-card:hover img { transform:scale(1.035); }
.project-overlay {
  position:absolute; inset:0; display:flex; align-items:flex-end; justify-content:flex-end; padding:18px;
  background:linear-gradient(180deg, transparent 55%, rgba(0,0,0,.25)); opacity:0; transition:opacity .35s ease;
}
.project-card:hover .project-overlay { opacity:1; }
.project-overlay span { width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.94); display:grid; place-items:center; font-size:18px; }
.project-meta { display:flex; justify-content:space-between; gap:18px; padding-top:15px; border-top:1px solid var(--line); margin-top:14px; }
.project-meta h3 { margin:0; font-size:21px; font-weight:400; }
.project-meta p { margin:4px 0 0; color:var(--muted); font-size:13px; }
.project-count { color:var(--muted); font-size:12px; padding-top:4px; }

.marquee-section { overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#dfe8ee; padding:22px 0; }
.marquee { display:flex; width:max-content; animation:marquee 29s linear infinite; }
.marquee span { flex:0 0 auto; font-size:clamp(16px,1.8vw,25px); letter-spacing:.12em; white-space:nowrap; color:#536775; padding-right:10px; }

.services { background:var(--paper-bright); }
.property-grid { max-width:var(--max); margin:0 auto 64px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.property-type { position:relative; min-height:330px; padding:34px 32px 30px; border:1px solid var(--line); background:linear-gradient(145deg, rgba(255,255,255,.88), rgba(235,243,248,.72)); overflow:hidden; transition:transform .32s ease, background .32s ease, box-shadow .32s ease; }
.property-type::after { content:""; position:absolute; inset:auto -20% -58% 15%; height:230px; background:radial-gradient(circle, rgba(101,189,240,.16), transparent 68%); pointer-events:none; }
.property-type:hover { transform:translateY(-5px); background:#fff; box-shadow:0 18px 44px rgba(33,55,70,.08); }
.property-icon { width:82px; height:82px; margin-bottom:50px; }
.property-icon svg { width:100%; height:100%; fill:none; stroke:#3d8dbd; stroke-width:1.45; stroke-linecap:round; stroke-linejoin:round; }
.property-type.visible .property-icon path, .property-type.visible .property-icon circle { stroke-dasharray:180; stroke-dashoffset:180; animation:iconDraw 1.35s cubic-bezier(.2,.7,.2,1) .14s forwards; }
.property-number { font-size:10px; letter-spacing:.18em; color:#6b8798; margin-bottom:12px; }
.property-type h3 { margin:0 0 13px; font-size:clamp(24px,2vw,31px); font-weight:300; letter-spacing:-.025em; }
.property-type p { margin:0; max-width:360px; color:var(--muted); font-size:14px; line-height:1.65; }

.offerings { max-width:var(--max); margin:0 auto; padding:52px 0 10px; border-top:1px solid var(--line); display:grid; grid-template-columns:.52fr 1.48fr; gap:clamp(34px,5vw,72px); }
.offerings-head h3 { font-size:clamp(34px,3.6vw,54px); font-weight:300; letter-spacing:-.035em; margin:12px 0 18px; line-height:1; }
.offerings-head > p:last-child { max-width:410px; color:var(--muted); line-height:1.65; }
.offering-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.offering-card { position:relative; min-height:260px; padding:25px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.32); overflow:hidden; transition:background .3s ease, transform .3s ease; }
.offering-card:not(.coming-soon-card):hover { background:#fff; transform:translateY(-3px); }
.offering-card-content { height:100%; }
.service-icon { width:48px; height:48px; margin-bottom:34px; }
.service-icon svg { width:100%; height:100%; fill:none; stroke:#336d90; stroke-width:1.35; stroke-linecap:round; stroke-linejoin:round; }
.offering-card > span { font-size:10px; letter-spacing:.16em; color:#5c8ca8; }
.offering-card h4 { margin:11px 0 12px; font-size:22px; font-weight:400; }
.offering-card p { margin:0; color:var(--muted); line-height:1.55; font-size:13px; }
.coming-soon-card { background:linear-gradient(145deg, rgba(221,231,237,.58), rgba(245,248,250,.8)); }
.coming-soon-card .offering-card-content { filter:blur(.8px); opacity:.42; transform:scale(.995); }
.coming-badge { position:absolute; z-index:2; top:22px; right:20px; padding:7px 10px; border:1px solid rgba(61,141,189,.5); background:rgba(247,251,253,.88); color:#2f739b; font-size:9px; line-height:1; letter-spacing:.15em; text-transform:uppercase; backdrop-filter:blur(8px); }


.visual-showcase { background:var(--night); color:#fff; overflow:hidden; }
.visual-inner { max-width:var(--max); margin:0 auto; padding:clamp(84px,9vw,132px) clamp(24px,5vw,76px); display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(44px,7vw,110px); align-items:center; }
.visual-copy .eyebrow { color:#8bd2fb; }
.visual-copy h2 { font-size:clamp(42px,4.8vw,72px); margin-top:18px; }
.visual-copy > p:not(.eyebrow) { max-width:520px; color:#c5d0d7; line-height:1.7; font-size:16px; }
.visual-tags { display:flex; flex-wrap:wrap; gap:9px; margin-top:30px; }
.visual-tags span { border:1px solid rgba(255,255,255,.2); border-radius:100px; padding:9px 14px; font-size:11px; letter-spacing:.06em; color:#dce5ea; }
.image-composition { position:relative; min-height:620px; }
.image-card { position:absolute; margin:0; overflow:hidden; box-shadow:0 24px 70px rgba(0,0,0,.28); }
.image-card img { width:100%; height:100%; object-fit:cover; }
.image-card { transition:transform .65s cubic-bezier(.2,.7,.2,1), box-shadow .65s ease; }
.image-card img { transition:transform 1s cubic-bezier(.2,.7,.2,1); }
.image-composition:hover .image-card-main { transform:translateY(-4px); }
.image-composition:hover .image-card-top { transform:translate(-3px,-2px); }
.image-composition:hover .image-card-bottom { transform:translate(4px,3px); }
.image-composition:hover .image-card img { transform:scale(1.015); }
.image-card-main { width:72%; aspect-ratio:4/5; right:4%; top:3%; }
.image-card-top { width:43%; aspect-ratio:3/2; left:0; top:10%; border:8px solid var(--night); }
.image-card-bottom { width:48%; aspect-ratio:3/2; left:8%; bottom:4%; border:8px solid var(--night); }
.composition-line { position:absolute; left:2%; bottom:23%; width:56%; height:1px; background:linear-gradient(90deg,var(--blue),transparent); z-index:5; }

.about { background:#f7f9fa; border-top:1px solid rgba(18,22,25,.08); }
.about-grid { max-width:var(--max); margin:0 auto; display:grid; grid-template-columns: .55fr 1.45fr; gap:clamp(40px,7vw,100px); }
.about h2 { margin-top:0; }
.about-grid > div:last-child p { max-width:810px; font-size:17px; line-height:1.7; color:#404a51; }
.about-aside { align-self:start; }
.about-rule { width:80px; height:1px; background:#7cbcdf; margin:26px 0; }
.about-location { color:var(--muted); font-size:13px; line-height:1.5; }

.contact { background:var(--night); color:white; padding: clamp(78px,9vw,132px) clamp(24px,5vw,76px); border-top:1px solid rgba(255,255,255,.08); }
.contact-inner { max-width:var(--max); margin:0 auto; }
.contact .eyebrow { color:#8bd2fb; }
.contact h2 { max-width:980px; }
.contact-inner > p:not(.eyebrow) { font-size:17px; color:#d6dee3; }
.contact-actions { display:flex; align-items:center; gap:clamp(20px,3vw,42px); flex-wrap:wrap; margin-top:38px; }
.contact-actions > a:not(.button) { font-size:15px; border-bottom:1px solid transparent; }
.contact-actions > a:not(.button):hover { border-color:currentColor; }

.footer { background:#0e1418; color:#e7edf1; padding:38px clamp(24px,5vw,76px) 30px; display:grid; grid-template-columns: 260px 1fr auto; gap:32px; align-items:center; }
.footer > img { width:250px; }
.footer p { margin:4px 0; font-size:12px; }
.footer-links { display:flex; gap:32px; font-size:13px; }
.footer small { grid-column:1/-1; color:#8f999f; font-size:11px; }

.reveal { opacity:0; transform: translateY(24px); transition: opacity .8s ease var(--delay,0s), transform .8s cubic-bezier(.2,.7,.2,1) var(--delay,0s); }
.reveal.visible { opacity:1; transform:none; }
.hero .reveal:nth-child(2) { --delay:.08s; }
.hero .reveal:nth-child(3) { --delay:.16s; }
.hero .reveal:nth-child(4) { --delay:.24s; }
.hero .reveal:nth-child(5) { --delay:.32s; }

.gallery { position:fixed; inset:0; z-index:100; display:none; color:white; }
.gallery.open { display:block; }
.gallery-backdrop { position:absolute; inset:0; background:rgba(5,10,13,.94); backdrop-filter:blur(14px); }
.gallery-panel { position:relative; z-index:2; height:100%; display:flex; flex-direction:column; padding:24px clamp(18px,3vw,44px) 18px; }
.gallery-topbar { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.gallery-topbar h3 { margin:5px 0 0; font-size:24px; font-weight:400; }
.gallery-topbar .eyebrow { color:#96a8b4; margin:0; }
.gallery-close { position:relative; width:46px; height:46px; padding:0; background:transparent; border:1px solid rgba(255,255,255,.3); color:transparent; border-radius:50%; font-size:0; line-height:0; cursor:pointer; }
.gallery-close::before, .gallery-close::after { content:""; position:absolute; left:50%; top:50%; width:18px; height:1.5px; background:#fff; border-radius:2px; transform-origin:center; }
.gallery-close::before { transform:translate(-50%,-50%) rotate(45deg); }
.gallery-close::after { transform:translate(-50%,-50%) rotate(-45deg); }
.gallery-stage { flex:1; min-height:0; display:grid; grid-template-columns:56px 1fr 56px; align-items:center; gap:16px; }
.gallery-stage figure { height:100%; min-height:0; margin:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.gallery-stage img { max-width:100%; max-height:calc(100vh - 230px); width:auto; height:auto; object-fit:contain; opacity:1; transform:scale(1); transition:opacity .22s ease, transform .22s ease; box-shadow:0 22px 60px rgba(0,0,0,.28); }
.gallery-stage img.switching { opacity:.1; transform:scale(.985); }
.gallery-stage figcaption { width:100%; max-width:1100px; text-align:right; padding-top:10px; color:#aab5bc; font-size:12px; }
.gallery-arrow { width:50px; height:50px; border-radius:50%; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.04); color:#fff; cursor:pointer; font-size:20px; }
.gallery-arrow:hover { background:rgba(255,255,255,.12); }
.gallery-thumbs { display:flex; gap:8px; justify-content:center; overflow:auto; padding-top:12px; }
.gallery-thumbs button { border:0; padding:0; width:72px; aspect-ratio:3/2; background:#222; opacity:.45; cursor:pointer; overflow:hidden; flex:0 0 auto; }
.gallery-thumbs button.active { opacity:1; outline:1px solid var(--blue); outline-offset:2px; }
.gallery-thumbs img { width:100%; height:100%; object-fit:cover; }
body.gallery-open { overflow:hidden; }

@keyframes heroZoom { from { transform:scale(1.055); } to { transform:scale(1); } }
@keyframes marquee { to { transform:translateX(-25%); } }
@keyframes iconDraw { to { stroke-dashoffset:0; } }

@media (max-width: 1050px) {
  .offerings { grid-template-columns:1fr; }
  .visual-inner { grid-template-columns:1fr; }
  .image-composition { min-height:700px; max-width:820px; width:100%; margin:0 auto; }
}

@media (max-width: 900px) {
  .site-header { height:86px; padding:0 22px; }
  .brand { width:220px; }
  .nav { position:absolute; top:100%; left:0; right:0; display:none; flex-direction:column; padding:24px; background:rgba(12,18,23,.96); border-top:1px solid rgba(255,255,255,.1); }
  .nav.open { display:flex; }
  .nav .nav-book { margin-left:0; align-self:flex-start; padding:12px 20px; }
  .menu-button { display:block; }
  .hero h1 { letter-spacing:.09em; }
  .split-head { grid-template-columns:1fr; gap:10px; }
  .section-head .intro { max-width:700px; }
  .project-grid { grid-template-columns:1fr; }
  .property-grid { grid-template-columns:1fr; }
  .property-card { min-height:360px; }
  .offering-grid { grid-template-columns:1fr 1fr; }
  .about-grid { grid-template-columns:1fr; }
  .footer { grid-template-columns:1fr; }
  .footer-links { flex-direction:column; gap:10px; }
  .gallery-stage { grid-template-columns:42px 1fr 42px; gap:5px; }
  .gallery-arrow { width:40px; height:40px; }
}

@media (max-width: 620px) {
  .brand { width:188px; }
  .hero-content { padding-top:132px; }
  .hero h1 { font-size:48px; letter-spacing:.06em; }
  .hero-image { background-position:44% 50%; filter:blur(3.2px) saturate(.84) contrast(.94) brightness(.92); }
  .section { padding-left:20px; padding-right:20px; }
  .property-card { min-height:310px; }
  .offerings { padding-top:42px; }
  .offering-grid { grid-template-columns:1fr; }
  .offering-card { min-height:240px; }
  .image-composition { min-height:470px; }
  .image-card-main { width:76%; right:0; }
  .image-card-top { width:48%; left:0; }
  .image-card-bottom { width:52%; left:2%; }
  .visual-inner { padding-left:20px; padding-right:20px; }
  .contact { padding-left:20px; padding-right:20px; }
  .contact-actions { align-items:flex-start; flex-direction:column; }
  .footer { padding-left:20px; padding-right:20px; }
  .gallery-panel { padding-left:10px; padding-right:10px; }
  .gallery-topbar { padding:0 8px; }
  .gallery-stage { grid-template-columns:38px 1fr 38px; }
  .gallery-arrow { width:36px; height:36px; font-size:17px; }
  .gallery-stage img { max-height:calc(100vh - 260px); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation:none !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .reveal { opacity:1; transform:none; }
}

/* Privacy Policy */
.legal-page { background:#f5f8fa; color:var(--ink); }
.legal-page .site-header { background:rgba(14,20,24,.98); }
.legal-main { padding-top:86px; }
.legal-hero { background:var(--night); color:#fff; padding:clamp(72px,9vw,126px) clamp(24px,5vw,76px) clamp(58px,7vw,92px); border-top:1px solid rgba(255,255,255,.06); }
.legal-wrap { max-width:var(--max); margin:0 auto; }
.legal-hero .eyebrow { color:#8bd2fb; margin-bottom:22px; }
.legal-hero h1 { margin:0; font-size:clamp(48px,7vw,92px); font-weight:400; letter-spacing:-.045em; line-height:.98; }
.legal-updated { margin:26px 0 0; color:#aeb9c0; font-size:13px; }
.legal-content { padding:clamp(60px,7vw,100px) clamp(24px,5vw,76px) clamp(90px,10vw,150px); }
.legal-grid { display:grid; grid-template-columns:minmax(210px,.55fr) minmax(0,1.45fr); gap:clamp(48px,8vw,128px); align-items:start; }
.legal-aside { position:sticky; top:126px; color:#66717a; font-size:14px; line-height:1.7; }
.legal-aside p { margin:0 0 24px; max-width:270px; }
.legal-aside a { display:inline-block; color:var(--ink); border-bottom:1px solid #9db3c0; padding-bottom:3px; }
.legal-copy { max-width:820px; }
.legal-copy section { padding:0 0 36px; margin:0 0 36px; border-bottom:1px solid rgba(18,22,25,.1); }
.legal-copy section:last-child { margin-bottom:0; }
.legal-copy h2 { margin:0 0 14px; font-size:clamp(24px,2.4vw,34px); font-weight:400; letter-spacing:-.025em; }
.legal-copy p { margin:0 0 14px; color:#46515a; font-size:16px; line-height:1.75; }
.legal-copy p:last-child { margin-bottom:0; }
.legal-copy a { color:#147fbd; border-bottom:1px solid rgba(20,127,189,.35); }
.legal-footer { border-top:1px solid rgba(255,255,255,.08); }

@media (max-width:900px) {
  .legal-main { padding-top:86px; }
  .legal-grid { grid-template-columns:1fr; gap:42px; }
  .legal-aside { position:static; }
}

@media (max-width:620px) {
  .legal-content, .legal-hero { padding-left:20px; padding-right:20px; }
  .legal-hero h1 { font-size:50px; }
  .legal-copy p { font-size:15px; }
}
