/*
 * 623 Summit Avenue — landing page styles
 * Single-file stylesheet. Design tokens live at the top of `.lux { ... }`.
 * See docs/design-system.md for the token map and paint-color rationale.
 */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500&family=Inter:wght@300;400;500&display=swap');
.lux { font-family: 'Inter', system-ui, -apple-system, sans-serif; color: #1F1D19; background: #FDFBF7; border-radius: 12px; overflow: hidden; position: relative; --gold:#A88452; --gold-h:#8A6A3E; --cream:#F5EFE4; --ivory:#FDFBF7; --line:#E8E0D3; --muted:#6B6559; --ink:#1F1D19; --house-blue:#4A6480; --house-blue-dark:#2C4358; --house-oxblood:#6E2434; -webkit-font-smoothing: antialiased; line-height:1.5; }
.lux *, .lux *::before, .lux *::after { box-sizing: border-box; }
.lux .serif { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; letter-spacing: -0.01em; }
.lux .nav { display:flex; align-items:center; justify-content:space-between; padding:18px 32px; border-bottom:1px solid var(--line); background:rgba(253,251,247,0.94); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); position:sticky; top:0; z-index:20; }
.lux .brand { font-family:'Cormorant Garamond', serif; font-size:22px; letter-spacing:0.04em; line-height:1; }
.lux .brand small { display:block; font-family:'Inter',sans-serif; font-size:9px; letter-spacing:0.28em; color:var(--muted); text-transform:uppercase; margin-top:4px; font-weight:500; }
.lux .nav-links { display:flex; gap:32px; font-size:12px; letter-spacing:0.14em; text-transform:uppercase; font-weight:500; }
.lux .nav-links a { color:var(--ink); text-decoration:none; opacity:0.75; transition:opacity .2s, color .2s; padding:8px 0; }
.lux .nav-links a:hover { opacity:1; color:var(--gold); }
.lux .btn { display:inline-flex; align-items:center; gap:8px; padding:14px 26px; font-size:11px; letter-spacing:0.18em; text-transform:uppercase; font-weight:500; cursor:pointer; transition: all .25s ease; border:none; font-family:inherit; border-radius:2px; text-decoration:none; }
.lux .btn-primary { background:var(--ink); color:var(--ivory); }
.lux .btn-primary:hover { background:var(--gold); transform: translateY(-1px); }
.lux .btn-outline { background:transparent; color:var(--ink); border:1px solid var(--ink); }
.lux .btn-outline:hover { background:var(--ink); color:var(--ivory); }
.lux .btn-gold { background:var(--gold); color:var(--ivory); }
.lux .btn-gold:hover { background:var(--gold-h); transform: translateY(-1px); }
.lux .btn-ivory { background:transparent; color:var(--ivory); border:1px solid rgba(253,251,247,0.7); }
.lux .btn-ivory:hover { background:var(--ivory); color:var(--ink); border-color:var(--ivory); }
.lux .nav-menu { display:none; background:none; border:none; cursor:pointer; padding:8px; color:var(--ink); font-size:22px; }
.lux .hero { position:relative; padding:160px 32px 180px; text-align:center; overflow:hidden; background:#141311; color:var(--ivory); min-height:640px; display:flex; align-items:center; justify-content:center; }
.lux .hero-bg { position:absolute; inset:0; z-index:0; overflow:hidden; }
.lux .hero-bg .layer { position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; will-change:transform, opacity; image-rendering:auto; -webkit-backface-visibility:hidden; backface-visibility:hidden; transform:translateZ(0); }
.lux .hero-bg .layer.ext { background-image: url("../img/hero-exterior.jpg"); animation: heroFade 16s infinite ease-in-out 0s; }
.lux .hero-bg .layer.int { background-image: url("../img/hero-interior.jpg"); animation: heroFade 16s infinite ease-in-out -8s; }
.lux .hero-scrim { position:absolute; inset:0; z-index:1; background: linear-gradient(180deg, rgba(20,19,17,0.55) 0%, rgba(20,19,17,0.50) 40%, rgba(20,19,17,0.78) 100%); }
.lux .hero-scrim::after { content:''; position:absolute; left:50%; top:50%; width:min(680px, 92%); height:min(360px, 62%); transform:translate(-50%,-50%); background:radial-gradient(ellipse at center, rgba(20,19,17,0.30) 0%, rgba(20,19,17,0) 70%); pointer-events:none; }
.lux .hero-progress { position:absolute; left:50%; transform:translateX(-50%); bottom:32px; z-index:3; display:flex; gap:10px; }
.lux .hero-progress span { width:32px; height:1px; background:rgba(253,251,247,0.35); overflow:hidden; position:relative; }
.lux .hero-progress span::after { content:''; position:absolute; inset:0; background:var(--ivory); transform:translateX(-100%); }
.lux .hero-progress span.ext::after { animation: progressFill 16s infinite linear 0s; }
.lux .hero-progress span.int::after { animation: progressFill 16s infinite linear -8s; }
.lux .hero-inner { position:relative; z-index:2; max-width:820px; margin:0 auto; opacity:0; animation: fadeUp 1.1s ease forwards 0.15s; text-shadow: 0 1px 3px rgba(20,19,17,0.55), 0 2px 24px rgba(20,19,17,0.45); }
.lux .eyebrow { display:inline-block; font-size:11px; letter-spacing:0.32em; text-transform:uppercase; color:#EBCC93; margin-bottom:24px; font-weight:500; padding:6px 14px; background:rgba(20,19,17,0.35); border:1px solid rgba(235,204,147,0.35); border-radius:2px; }
.lux .eyebrow::before, .lux .eyebrow::after { content:''; display:inline-block; width:20px; height:1px; background:#EBCC93; vertical-align:middle; margin:0 10px; }
.lux .hero h1 { font-family:'Cormorant Garamond', serif; font-size:clamp(48px, 8vw, 96px); font-weight:300; line-height:1.02; letter-spacing:-0.02em; margin:0 0 10px; color:var(--ivory); }
.lux .hero-loc { font-size:12px; letter-spacing:0.28em; text-transform:uppercase; color:rgba(253,251,247,0.92); margin:0 0 28px; font-weight:500; }
.lux .hero-sub { font-size:16px; color:rgba(253,251,247,0.94); max-width:560px; margin:0 auto 40px; line-height:1.75; font-weight:300; }
.lux .hero-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.lux .stats { display:grid; grid-template-columns:repeat(4, 1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--ivory); }
.lux .stat { padding:36px 12px; text-align:center; border-right:1px solid var(--line); }
.lux .stat:last-child { border-right:none; }
.lux .stat-n { font-family:'Cormorant Garamond', serif; font-size:38px; font-weight:400; display:block; line-height:1; color:var(--ink); }
.lux .stat-l { font-size:10px; letter-spacing:0.24em; text-transform:uppercase; color:var(--muted); margin-top:10px; display:block; font-weight:500; }
.lux section { padding:96px 32px; }
.lux .section-eyebrow { text-align:center; font-size:11px; letter-spacing:0.32em; text-transform:uppercase; color:var(--gold); margin-bottom:16px; font-weight:500; }
.lux h2.section-title { text-align:center; font-family:'Cormorant Garamond', serif; font-size:clamp(34px, 5vw, 52px); font-weight:300; letter-spacing:-0.015em; margin:0 0 20px; line-height:1.1; }
.lux .section-lead { text-align:center; color:var(--muted); font-size:16px; max-width:640px; margin:0 auto 64px; line-height:1.8; font-weight:300; }
.lux .about-grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; max-width:1080px; margin:0 auto; }
.lux .about-copy p { color:var(--muted); font-size:15px; line-height:1.9; margin:0 0 18px; font-weight:300; }
.lux .about-copy p:last-child { margin-bottom:0; }
.lux .about-visual { aspect-ratio: 4/5; background:var(--cream); border-radius:4px; position:relative; overflow:hidden; }
.lux .about-visual svg { position:absolute; inset:0; width:100%; height:100%; }
.lux .amenities-section { background:var(--cream); }
.lux .amenities { display:grid; grid-template-columns:repeat(4, 1fr); gap:1px; background:var(--line); border:1px solid var(--line); max-width:1080px; margin:0 auto; }
.lux .amenity { background:var(--ivory); padding:36px 24px; text-align:center; transition: background .3s; }
.lux .amenity:hover { background:#fff; }
.lux .amenity i { font-size:28px; color:var(--gold); }
.lux .amenity h4 { font-family:'Cormorant Garamond', serif; font-size:20px; font-weight:400; margin:14px 0 6px; letter-spacing:-0.005em; }
.lux .amenity p { font-size:13px; color:var(--muted); margin:0; line-height:1.6; font-weight:300; }
.lux .gallery { display:grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 220px 220px; gap:8px; max-width:1080px; margin:0 auto; }
.lux .gallery > div { border-radius:4px; overflow:hidden; position:relative; background:var(--cream); transition: transform .4s ease; }
.lux .gallery > div:hover { transform: translateY(-2px); }
.lux .gallery > div:first-child { grid-row: 1 / 3; }
.lux .tile { width:100%; height:100%; display:flex; align-items:flex-end; padding:16px; color:var(--ink); font-family:'Cormorant Garamond', serif; font-size:20px; font-weight:400; position:relative; }
.lux .tile svg { position:absolute; inset:0; width:100%; height:100%; opacity:0.85; }
.lux .tile span { position:relative; z-index:2; background:rgba(253,251,247,0.85); padding:6px 14px; border-radius:2px; font-size:14px; letter-spacing:0.02em; }
.lux .location { background:var(--house-blue-dark); color:var(--ivory); }
.lux .location .section-eyebrow, .lux .location h2.section-title { color:var(--ivory); }
.lux .location h2.section-title { color:#F5EFE4; }
.lux .location .section-lead { color:rgba(253,251,247,0.7); }
.lux .loc-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:32px; max-width:1000px; margin:0 auto; }
.lux .loc-item { text-align:center; padding:24px; border:1px solid rgba(74,100,128,0.55); border-radius:4px; background:rgba(255,255,255,0.02); }
.lux .loc-item i { font-size:26px; color:var(--gold); }
.lux .loc-item h4 { font-family:'Cormorant Garamond', serif; font-size:22px; font-weight:400; margin:12px 0 6px; color:var(--ivory); }
.lux .loc-item p { font-size:14px; color:rgba(253,251,247,0.65); margin:0; line-height:1.6; font-weight:300; }
.lux .availability-cta { text-align:center; }
.lux .availability-inner { max-width:640px; margin:0 auto; position:relative; padding-bottom:12px; }
.lux .availability-inner::after { content:''; display:block; width:36px; height:2px; background:var(--house-oxblood); margin:36px auto 0; }
.lux .availability-inner .section-lead { margin-bottom:36px; }
.lux .availability-inner .btn { padding:16px 34px; }
.lux .testimonials { background:var(--cream); }
.lux .quote-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:32px; max-width:1000px; margin:0 auto; }
.lux .quote { background:var(--ivory); padding:40px 36px; border-radius:4px; border:1px solid var(--line); }
.lux .quote-stars { color:var(--gold); font-size:14px; letter-spacing:2px; margin-bottom:16px; }
.lux .quote p { font-family:'Cormorant Garamond', serif; font-size:22px; font-weight:400; line-height:1.5; color:var(--ink); margin:0 0 20px; font-style:italic; letter-spacing:-0.005em; }
.lux .quote-name { font-size:13px; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.lux .contact-section { background:var(--house-blue-dark); color:var(--ivory); text-align:center; }
.lux .contact-section .section-eyebrow { color:var(--gold); }
.lux .contact-section h2 { color:var(--ivory); }
.lux .contact-section .section-lead { color:rgba(253,251,247,0.7); }
.lux .contact-actions { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:8px; }
.lux .contact-details { display:flex; gap:48px; justify-content:center; margin-top:56px; padding-top:40px; border-top:1px solid rgba(74,100,128,0.7); flex-wrap:wrap; }
.lux .contact-item { text-align:center; }
.lux .contact-item i { color:var(--gold); font-size:20px; }
.lux .contact-item div { font-size:14px; color:var(--ivory); margin-top:8px; }
.lux .contact-item small { font-size:11px; letter-spacing:0.2em; text-transform:uppercase; color:rgba(253,251,247,0.5); display:block; margin-top:4px; }
.lux footer { padding:40px 32px; background:#141311; color:rgba(253,251,247,0.55); display:flex; justify-content:space-between; align-items:center; font-size:12px; flex-wrap:wrap; gap:16px; }
.lux footer .brand { color:var(--ivory); }
.lux footer .brand small { color:rgba(253,251,247,0.5); }
.lux .modal-backdrop { position:fixed; inset:0; background:rgba(20,19,17,0.72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); display:none; align-items:center; justify-content:center; z-index:1000; padding:20px; animation: fadeIn .25s ease; }
.lux .modal-backdrop.open { display:flex; }
.lux .modal { background:var(--ivory); border-radius:6px; max-width:520px; width:100%; max-height:92vh; overflow-y:auto; position:relative; animation: modalIn .35s cubic-bezier(0.16,1,0.3,1); }
.lux .modal-close { position:absolute; top:16px; right:16px; background:none; border:none; cursor:pointer; padding:8px; color:var(--muted); font-size:18px; border-radius:4px; transition: background .2s; }
.lux .modal-close:hover { background:var(--cream); color:var(--ink); }
.lux .modal-head { padding:40px 40px 24px; text-align:center; border-bottom:1px solid var(--line); }
.lux .modal-head .section-eyebrow { margin-bottom:12px; }
.lux .modal-head h3 { font-family:'Cormorant Garamond', serif; font-size:32px; font-weight:300; margin:0 0 8px; letter-spacing:-0.01em; }
.lux .modal-head p { color:var(--muted); font-size:14px; margin:0; line-height:1.6; }
.lux .modal-body { padding:32px 40px 40px; }
.lux .field { margin-bottom:18px; }
.lux .field label { display:block; font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink); margin-bottom:8px; font-weight:500; }
.lux .field label .opt { font-weight:400; letter-spacing:0.04em; text-transform:none; color:var(--muted); margin-left:6px; font-size:11px; }
.lux .field input, .lux .field select, .lux .field textarea { width:100%; padding:14px 14px; border:1px solid var(--line); background:#fff; border-radius:3px; font-family:inherit; font-size:14px; color:var(--ink); transition: border .2s, box-shadow .2s; min-height:48px; }
.lux .field textarea { min-height:110px; resize:vertical; line-height:1.6; }
.lux .field input:focus, .lux .field select:focus, .lux .field textarea:focus { outline:none; border-color:var(--gold); box-shadow: 0 0 0 3px rgba(168,132,82,0.12); }
.lux .field-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.lux .field-error { color:#B03A2E; font-size:12px; margin-top:6px; display:none; }
.lux .field.invalid input, .lux .field.invalid select, .lux .field.invalid textarea { border-color:#B03A2E; }
.lux .field.invalid .field-error { display:block; }
.lux .modal .btn { width:100%; justify-content:center; padding:16px; margin-top:8px; }
.lux .modal-fine { text-align:center; font-size:11px; color:var(--muted); margin-top:14px; line-height:1.6; }
.lux .success-state { text-align:center; padding:20px 0 8px; }
.lux .success-state .check { width:56px; height:56px; margin:0 auto 20px; border-radius:50%; background:rgba(168,132,82,0.14); color:var(--gold); display:flex; align-items:center; justify-content:center; font-size:26px; }
.lux .success-state h4 { font-family:'Cormorant Garamond', serif; font-size:26px; font-weight:400; margin:0 0 8px; }
.lux .success-state p { color:var(--muted); font-size:14px; margin:0 0 24px; line-height:1.6; }
.lux .price-summary { background:var(--cream); border-radius:4px; padding:16px 18px; margin:16px 0 20px; display:flex; justify-content:space-between; align-items:center; }
.lux .price-summary .lbl { font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted); font-weight:500; }
.lux .price-summary .val { font-family:'Cormorant Garamond', serif; font-size:24px; font-weight:400; color:var(--ink); }
@keyframes fadeUp { from { opacity:0; transform: translateY(20px); } to { opacity:1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes modalIn { from { opacity:0; transform: translateY(24px) scale(0.98); } to { opacity:1; transform: translateY(0) scale(1); } }
@keyframes heroFade {
  0%   { opacity: 1; transform: scale(1.000); }
  43%  { opacity: 1; transform: scale(1.030); }
  50%  { opacity: 0; transform: scale(1.035); }
  93%  { opacity: 0; transform: scale(1.000); }
  100% { opacity: 1; transform: scale(1.000); }
}
@keyframes progressFill {
  0%   { transform: translateX(-100%); }
  50%  { transform: translateX(0%); }
  50.01%,100% { transform: translateX(0%); }
}
.lux .reveal { opacity:0; transform: translateY(16px); transition: opacity .8s ease, transform .8s ease; }
.lux .mobile-cta { position:fixed; left:0; right:0; bottom:0; z-index:100; background:rgba(253,251,247,0.96); -webkit-backdrop-filter:saturate(140%) blur(12px); backdrop-filter:saturate(140%) blur(12px); border-top:1px solid var(--line); padding:12px 14px calc(12px + env(safe-area-inset-bottom)) 14px; display:none; gap:8px; transform:translateY(100%); opacity:0; pointer-events:none; transition:transform .32s cubic-bezier(0.32,0.72,0,1), opacity .28s ease; box-shadow:0 -8px 24px -20px rgba(20,19,17,0.35); }
.lux .mobile-cta.show { transform:translateY(0); opacity:1; pointer-events:auto; }
.lux .mobile-cta .btn { flex:1; padding:14px 10px; margin:0; font-size:11px; letter-spacing:0.14em; justify-content:center; min-height:48px; }
.lux .mobile-cta .btn i { font-size:15px; }
.lux.modal-open .mobile-cta { display:none !important; }
.lux .reveal.in { opacity:1; transform: translateY(0); }
@media (max-width: 820px) {
  .lux .nav { padding:14px 20px; }
  .lux .nav-links, .lux .nav .btn { display:none; }
  .lux .nav-menu { display:block; }
  .lux .brand { font-size:19px; }
  .lux .brand small { font-size:8px; }
  .lux section { padding:64px 20px; }
  .lux .hero { padding:120px 20px 140px; min-height:560px; }
  .lux .hero h1 { font-size:clamp(40px, 12vw, 60px); }
  .lux .hero-sub { font-size:15px; }
  .lux .eyebrow::before, .lux .eyebrow::after { width:16px; margin:0 8px; }
  .lux .stats { grid-template-columns: repeat(2, 1fr); }
  .lux .stat { border-right:1px solid var(--line); border-bottom:1px solid var(--line); padding:24px 8px; }
  .lux .stat:nth-child(2n) { border-right:none; }
  .lux .stat:nth-child(n+3) { border-bottom:none; }
  .lux .stat-n { font-size:32px; }
  .lux .about-grid { grid-template-columns: 1fr; gap:36px; }
  .lux .about-visual { aspect-ratio: 4/3; order:-1; }
  .lux .amenities { grid-template-columns: repeat(2, 1fr); }
  .lux .amenity { padding:28px 16px; }
  .lux .gallery { grid-template-columns: 1fr; grid-template-rows: repeat(5, 180px); }
  .lux .gallery > div:first-child { grid-row: auto; grid-template-rows:220px; }
  .lux .loc-grid { grid-template-columns: 1fr; gap:16px; }
  .lux .availability-inner .btn { width:100%; }
  .lux .quote-grid { grid-template-columns: 1fr; gap:16px; }
  .lux .quote { padding:32px 24px; }
  .lux .quote p { font-size:19px; }
  .lux .contact-details { gap:28px; }
  .lux .modal { max-width:100%; border-radius:8px; }
  .lux .modal-head { padding:32px 24px 20px; }
  .lux .modal-head h3 { font-size:26px; }
  .lux .modal-body { padding:24px 24px 32px; }
  .lux .field-row { grid-template-columns: 1fr; gap:0; }
  .lux .field input, .lux .field select, .lux .field textarea { font-size:16px; }
  .lux footer { flex-direction:column; text-align:center; padding:32px 20px calc(32px + env(safe-area-inset-bottom)); }
  .lux .mobile-cta { display:flex; }
}
@media (min-width: 821px) and (max-width: 1080px) {
  .lux .amenities { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .lux .hero-bg .layer, .lux .hero-progress span::after { animation: none !important; }
  .lux .hero-bg .layer.ext { opacity: 1; }
  .lux .reveal { opacity:1; transform:none; }
  .lux .mobile-cta { transition:opacity .12s ease; transform:none !important; }
}

.lux .gallery-more { display:flex; justify-content:center; margin-top:32px; }

.lux .modal-backdrop.lightbox { padding:0; background:rgba(20,19,17,0.92); }
.lux .modal-backdrop.lightbox.open { display:flex; }
.lux .lightbox-figure { margin:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:64px 88px; box-sizing:border-box; }
.lux .lightbox-image { max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; border-radius:3px; box-shadow:0 20px 60px rgba(0,0,0,0.5); animation: fadeIn .25s ease; }
.lux .lightbox-close { position:absolute; top:20px; right:24px; color:rgba(253,251,247,0.85); font-size:22px; padding:10px; z-index:2; }
.lux .lightbox-close:hover { background:rgba(253,251,247,0.12); color:var(--ivory); }
.lux .lightbox-nav { position:absolute; top:50%; transform:translateY(-50%); background:rgba(253,251,247,0.08); border:1px solid rgba(253,251,247,0.18); color:var(--ivory); width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:22px; transition:background .2s, border-color .2s; z-index:2; }
.lux .lightbox-nav:hover { background:rgba(253,251,247,0.18); border-color:rgba(253,251,247,0.4); }
.lux .lightbox-nav.prev { left:24px; }
.lux .lightbox-nav.next { right:24px; }
.lux .lightbox-counter { position:absolute; bottom:24px; left:50%; transform:translateX(-50%); color:rgba(253,251,247,0.7); font-size:12px; letter-spacing:0.18em; text-transform:uppercase; font-weight:500; z-index:2; }

@media (max-width: 720px) {
  .lux .lightbox-figure { padding:64px 16px; }
  .lux .lightbox-nav { width:44px; height:44px; font-size:18px; }
  .lux .lightbox-nav.prev { left:8px; }
  .lux .lightbox-nav.next { right:8px; }
  .lux .lightbox-close { top:12px; right:12px; }
}
