body.space-page { background: #050705; color: #f5f8f2; }
.space-hero { padding: 165px 0 65px; background: radial-gradient(ellipse at 85% 35%, #8cff001a, transparent 50%); }
.space-hero-layout { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center; }
.space-kicker { display: block; color: #8cff00; font: 800 11px/1.6 Arial, sans-serif; letter-spacing: 2px; margin-bottom: 16px; }
.space-hero h1 { color: #f5f8f2; font-size: clamp(44px, 5.6vw, 78px); line-height: 1.04; letter-spacing: -2.5px; margin-bottom: 24px; }
.space-hero h1 span { color: #8cff00; }
.space-hero p { color: #c5cfbf; font-size: 18px; line-height: 1.8; max-width: 580px; }
.space-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 30px; }
.space-button { display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; background: #8cff00; color: #101609; border: 1px solid #8cff00; border-radius: 8px; min-height: 54px; padding: 16px 22px; font-size: 14px; font-weight: 800; line-height: 1.5; }
.space-button:hover { background: #b2ff55; color: #101609; }
.space-text-link { color: #e5eddf; font-size: 14px; font-weight: 700; padding-block: 12px; }
.space-text-link i { margin-left: 8px; color: #8cff00; }
.space-text-link:hover { color: #8cff00; }
.space-hero-image { position: relative; padding: 12px; background: #0f130f; border: 1px solid #8cff0040; border-radius: 20px; }
.space-hero-image img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 12px; }
.space-hero-image > span { display: block; padding: 16px 4px 6px; color: #bdcbb3; font: 700 10px/1.5 Arial, sans-serif; letter-spacing: 2px; }
.space-section { padding: 48px 0 64px; scroll-margin-top: 110px; }
.space-section-heading { max-width: 760px; margin-bottom: 32px; }
.space-section-heading h2, .space-visit h2 { color: #f5f8f2; font-size: clamp(29px, 3.5vw, 44px); line-height: 1.15; letter-spacing: -1px; margin-bottom: 16px; }
.space-section-heading p, .space-visit p { color: #b9c6b0; font-size: 17px; line-height: 1.75; margin: 0; }
.space-room-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.space-room-card { background: #0f130f; border: 1px solid #ffffff20; border-radius: 16px; overflow: hidden; }
.space-room-card > img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.space-room-copy { padding: 25px; }
.space-room-copy .space-kicker { font-size: 9px; letter-spacing: 1.4px; margin-bottom: 12px; }
.space-room-copy h3 { color: #f5f8f2; font-size: 24px; line-height: 1.2; margin-bottom: 14px; }
.space-room-copy p { color: #b9c6b0; font-size: 15px; line-height: 1.75; margin: 0; }
.space-photos-section { background: #0a0e08; border-block: 1px solid #ffffff15; padding-top: 56px; }
/* Natural image proportions keep portrait and landscape uploads fully visible. */
.space-photo-grid { columns: 3; column-gap: 18px; }
.space-photo { position: relative; display: block; break-inside: avoid; margin-bottom: 18px; border: 1px solid #ffffff24; border-radius: 12px; overflow: hidden; background: #151d10; }
.space-photo img { display: block; width: 100%; height: auto; }
.space-photo-expand { position: absolute; right: 12px; bottom: 12px; display: grid; place-items: center; width: 40px; height: 40px; background: #080d06df; border: 1px solid #8cff0070; color: #c9ff99; border-radius: 8px; transition: background .18s; }
.space-photo:hover .space-photo-expand, .space-photo:focus-visible .space-photo-expand { background: #8cff00; color: #101609; }
.space-visit-section { padding: 60px 0 80px; }
.space-visit { display: flex; align-items: center; justify-content: space-between; gap: 32px; background: linear-gradient(120deg, #172210, #0b1009); border: 1px solid #8cff0040; border-radius: 18px; padding: 36px; }
.space-visit .space-button { flex-shrink: 0; }
.space-main a:focus-visible { outline: 3px solid #8cff00; outline-offset: 4px; }
.space-empty { color: #b9c6b0; padding: 24px; border: 1px solid #8cff003d; border-radius: 12px; }
@media (max-width: 991px) {
  .space-hero { padding: 125px 0 40px; }
  .space-hero-layout { grid-template-columns: 1fr; gap: 30px; }
  .space-hero-image { max-width: 650px; }
  .space-room-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .space-photo-grid { columns: 2; }
  .space-visit { flex-wrap: wrap; }
}
@media (max-width: 575px) {
  .space-hero { padding-top: 110px; }
  .space-hero h1 { letter-spacing: -1.5px; }
  .space-hero p { font-size: 16px; }
  .space-room-grid { grid-template-columns: 1fr; }
  .space-photo-grid { columns: 1; }
  .space-section { padding-block: 36px; }
  .space-visit-section { padding: 36px 0; }
  .space-visit { padding: 24px; }
}
