/* Consistent full-width surfaces and undistorted photographic grids. */
:root {
  --page-gutter: max(5%, calc((100% - 1280px) / 2));
  --paper: #101d24;
  --ink: #f5f1e8;
  --muted: #bdc8ce;
  --line: #3b4b54;
  --ocean-panel: #192b35;
  --ocean-deep: #101d24;
  --ocean-cream: #f4efe4;
  --ocean-text: #18252c;
  --ocean-warm: #d5b384;
}
html, body { background: var(--paper); overflow-x: clip; }
body > header, body > footer,
main > section, main > div > section {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-inline: var(--page-gutter);
}
body > header, body > footer { background: var(--paper); }
body > header { min-width: 0; }
header nav { align-items: center; }
header .logo { flex: 0 0 auto; }
main > section:not(.ocean-hero), main > div > section:not(.ocean-hero) {
  background: var(--paper);
}
.dark, .custom-look, .document-banner, .series-banner, .doc-hero { color: var(--ink); }
.dark p, .dark .disclosure, .custom-look > div > p:not(.eyebrow),
.look-meta, .look-desc, .small, .comparison figcaption, footer { color: var(--muted); }
.script-pad, .plans .featured, .upload, .locked-settings, .doc-preview, .notice {
  background: var(--ocean-panel);
  border-color: var(--line);
}
.canvas-wrap { background: var(--ocean-deep); }
.doc-preview #empty { color: var(--ink); }
.doc-preview #status { color: var(--ocean-warm); }
.doc-rules, .sheet-controls, .order { border-color: var(--line); }
.comparison { grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; }
.comparison figure, .comparison figure:first-child { min-width: 0; margin: 0; padding: 0; border: 0; }
.comparison button { width: 100%; padding: 0; }
.sample, .look-image { width: 100%; aspect-ratio: 1 / 1; height: auto; min-height: 0; flex: none; }
.sample { background-repeat: no-repeat; }
.series-banner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(24px, 4vw, 64px); }
.series-mini { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: start; }
.series-mini .sample, .series-mini .sample:first-child {
  grid-row: auto;
  grid-column: auto;
  aspect-ratio: 1 / 1;
  height: auto;
  min-height: 0;
  align-self: start;
}
.series-mini .small { grid-column: 1 / -1; margin: 0; }
.catalog-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: stretch; }
.look-card { display: flex; flex-direction: column; min-width: 0; align-items: stretch; }
.look-card .look-image, .look-card:hover .look-image { border-radius: 0; filter: none; }
.look-card strong { min-height: 2.6em; }
.look-meta { min-height: 2.8em; line-height: 1.4; letter-spacing: 0; font-size: 12px; }
.look-desc { line-height: 1.5; min-height: 3em; }
.look-link, .look-cta { display: block; margin-top: 8px; font-size: 13px; text-decoration: underline; text-underline-offset: 3px; }
.look-number { color: var(--ocean-text); }
.gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.look-detail { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); }
.look-detail .look-image { align-self: start; }
.result-card img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: contain; background: var(--ocean-deep); }
.doc-editor { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
.doc-editor > *, .size-fields > * { min-width: 0; }
@media (max-width: 950px) {
  .catalog-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .series-banner { grid-template-columns: minmax(0, 1fr); }
  .series-mini { max-width: 680px; }
}
@media (max-width: 760px) {
  .doc-editor { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 650px) {
  .catalog-grid, .comparison { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .look-card strong { font-size: 16px; }
  .look-meta { font-size: 11px; min-height: 2.8em; }
  .series-mini { gap: 8px; }
  .gallery-grid, .look-detail { grid-template-columns: minmax(0, 1fr); }
  .look-detail .look-image { width: min(100%, 300px); max-height: none; }
}