/* Standalone layout overrides for the preserved Squarespace portfolio. */
html { color-scheme: dark; }
body.preserved-site { margin: 0; background: #000; color: #ddd; overflow-x: hidden; }
body.preserved-site #site {
  display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 64px;
  width: min(1440px, calc(100% - 96px)); margin: 100px auto 64px;
}
body.preserved-site #site #header {
  position: relative; inset: auto; width: auto; height: auto; margin: 0;
  padding: 0; min-height: 0; opacity: 1; border: 0;
}
body.preserved-site #header .header-wrapper { width: auto; }
body.preserved-site #header .header-content { padding: 20px 0; }
body.preserved-site #header h1.logo { margin: 0; line-height: .95; text-align: left; }
body.preserved-site #header h1.logo a { font-family: Arial, sans-serif; font-size: 36px; font-weight: 800; }
body.preserved-site #header nav.main-nav ul { display: block; padding: 18px 0 0; }
body.preserved-site #header nav.main-nav li { display: block; font-family: Georgia, serif; font-size: 18px; }
body.preserved-site #header nav.main-nav a { display: inline-block; padding: 3px 0; }
body.preserved-site #header #nav { display: block; }
body.preserved-site #site #header nav.main-nav { display: block !important; }
body.preserved-site #sqs-sidebar-social { text-align: left; }
body.preserved-site #site #sectionWrapper {
  position: relative; inset: auto; width: auto; max-width: none; margin: 0;
  opacity: 1; transform: none; min-width: 0; border-top: 1px dotted #666;
}
body.preserved-site #sectionWrapper section { position: static; padding: 20px 0 0; opacity: 1; }
body.preserved-site #site .articles {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  position: static; width: auto; margin: 0; opacity: 1; transform: none;
}
body.preserved-site #site .articles .project-cover {
  position: relative; width: auto; height: auto; margin: 0; padding: 0;
  float: none; opacity: 1; transform: none;
}
body.preserved-site .project-cover a { display: block; }
body.preserved-site .project-cover img {
  position: static; display: block; width: 100%; height: auto; aspect-ratio: 16/9;
  object-fit: cover; opacity: 1; visibility: visible;
}
body.preserved-site .project-cover h1.title {
  position: static; display: block; opacity: 1; margin: 0; padding: 10px 12px 22px;
  height: auto; font: 14px/1.4 Arial, sans-serif; color: #ddd; background: #000;
}
body.preserved-site .extended-content,
body.preserved-site .slideshow-wrapper,
body.preserved-site .slideshow,
body.preserved-site .slide {
  position: static !important; inset: auto !important; width: 100% !important;
  height: auto !important; margin: 0; padding: 0; opacity: 1 !important;
  visibility: visible; transform: none !important; overflow: visible; cursor: auto;
}
body.preserved-site .slide { margin-bottom: 24px; }
body.preserved-site .slide[hidden] { display: none !important; }
body.preserved-site .slide img {
  display: block; position: static; width: 100%; height: auto; max-height: 78vh;
  object-fit: contain; opacity: 1; visibility: visible;
}
body.preserved-site .project-description { padding: 28px 0; max-width: 850px; }
body.preserved-site .project-description h1 { margin-top: 0; }
body.preserved-site .project-description p { font-size: 17px; line-height: 1.65; }
.preserved-video-button {
  display: block; position: relative; width: 100%; padding: 0; border: 0;
  background: #111; color: #fff; cursor: pointer;
}
.preserved-play {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  padding: 14px 22px; border-radius: 4px; background: rgba(0,0,0,.8);
  font: 600 16px/1.4 Arial, sans-serif; white-space: nowrap;
}
.preserved-video iframe { display: block; width: 100%; height: auto; aspect-ratio: 16/9; border: 0; }
.preserved-watch { margin: 12px 0; font: 14px/1.5 Arial, sans-serif; }
.preserved-gallery-controls { display: flex; align-items: center; justify-content: center; gap: 22px; margin: 20px 0; }
.preserved-gallery-controls button { padding: 10px 16px; border: 1px solid #666; color: #eee; background: #111; cursor: pointer; }
.preserved-gallery-controls button:disabled { opacity: .35; cursor: default; }
.preserved-home { margin-top: 22px; font: 14px/1.5 Arial, sans-serif; }
.preserved-skip { position: absolute; left: 12px; top: -100px; padding: 14px; background: #fff; color: #000; z-index: 20; }
.preserved-skip:focus { top: 12px; }
body.preserved-site :focus-visible { outline: 2px solid #53bde6; outline-offset: 4px; }
body.preserved-site .sqs-image-shape-container-element { padding-bottom: 0 !important; overflow: visible !important; }
body.preserved-site .sqs-image-shape-container-element img { position: static !important; width: 100% !important; height: auto !important; }
body.preserved-site .sqs-svg-icon--list { display: flex; flex-wrap: wrap; gap: 12px; }
body.preserved-site .sqs-svg-icon--social { width: 32px; height: 32px; }
@media (max-width: 1000px) {
  body.preserved-site #site { grid-template-columns: 180px minmax(0, 1fr); gap: 32px; width: calc(100% - 48px); margin-top: 48px; }
  body.preserved-site #site .articles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  body.preserved-site #site { display: block; width: calc(100% - 32px); margin: 24px auto; }
  body.preserved-site #site #header { margin: 0 0 28px; }
  body.preserved-site #header h1.logo a { font-size: 30px; }
  body.preserved-site #header nav.main-nav ul { display: flex; flex-wrap: wrap; gap: 4px 20px; }
  body.preserved-site #header nav.main-nav li { font-size: 16px; }
  body.preserved-site #sqs-sidebar-social { padding-top: 10px; }
  body.preserved-site .project-description { padding: 20px 0; }
  body.preserved-site .project-description p { font-size: 16px; }
  body.preserved-site .project-cover h1.title { font-size: 12px; padding: 8px 6px 18px; }
  .preserved-play { padding: 12px 16px; font-size: 14px; }
}
