/* IBS IDENTITY — appearance-only layer, loaded after the layout styles.
 * Artwork: assets/identity-spc-approved-geometry.svg, recovered from the approved
 * SPC catalogue (page 51). Exact native paths; provenance accompanies the asset.
 * Maintain colours/crops here. Text, photographs and named WordPress blocks live
 * in the page editor; this stylesheet never replaces their saved content.
 */
.ibsh-page {
  --ibsh-paper:#f7f1e7; /* Original approved catalogue background. */
  --ibsh-stone:#e8e0d2;
  --ibsh-sand:#efe6d8;
  --ibsh-accent:#785a39;
  --ibsh-line:#cfc3b1;
  --ibsh-muted:#635d56;
  --ibsh-identity-art:url("assets/identity-spc-approved-geometry.svg");
  background-color:var(--ibsh-paper);
}

/* Navigation stays quiet; the original transparent logo needs no new artwork. */
.ibsh-header {
  background:rgba(247,241,231,.98);
  border-bottom-color:var(--ibsh-line);
}
.ibsh-link:hover,
.ibsh-pdf-link:hover,
.ibsh-nav a:hover { color:var(--ibsh-accent); }

/* The native portrait master is cropped, never stretched or tiled. Large forms
 * sit at the edge of each section, with an uncluttered centre for reading.
 * A negative layer inside an isolated section keeps all decoration behind the
 * content without changing the stacking/focus behaviour of its children.
 */
.ibsh-story-section,
.ibsh-page-hero,
.ibsh-story-journey,
.ibsh-contact-section,
.ibsh-custom-page {
  position:relative;
  isolation:isolate;
  background-color:var(--ibsh-paper);
}
.ibsh-story-section::before,
.ibsh-page-hero::before,
.ibsh-story-journey::before,
.ibsh-contact-section::before,
.ibsh-custom-page::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:var(--ibsh-identity-art);
  background-repeat:no-repeat;
  background-size:max(880px,100%) auto;
  background-position:center 36%;
}
.ibsh-story-section::before { background-position:center 28%; }
.ibsh-page-hero::before { background-position:center 22%; }
.ibsh-story-journey::before { background-position:center 56%; opacity:.7; }
.ibsh-contact-section::before { background-position:center 82%; }
.ibsh-custom-page::before { background-position:center top; }

/* Tonal changes give the long pages a rhythm. Dense product information and
 * enquiry fields use calm, solid surfaces rather than decorative overlays.
 */
.ibsh-home #materials,
.ibsh-people,
.ibsh-people-section { background-color:var(--ibsh-stone); }
.ibsh-paper-section,
.ibsh-story-foundation,
.ibsh-collections-section,
.ibsh-contact-forms { background-color:var(--ibsh-sand); }
.ibsh-story-record { background-color:var(--ibsh-paper); }
.ibsh-contact-information { background-color:var(--ibsh-paper); }
.ibsh-footer {
  background:var(--ibsh-sand);
  border-top-color:var(--ibsh-line);
}

/* Preserve contrast on the existing dark company opening and project section. */
.ibsh-opening,
.ibsh-project-section {
  --ibsh-muted:#bcb4a8;
  --ibsh-accent:#b9956b;
  --ibsh-orange:var(--ibsh-accent);
}
.ibsh-project-section .ibsh-link:hover { color:#e0c6a2; }

/* Fully opaque cream fields and a stronger boundary against the sand surface. */
.ibsh-contact-forms { --ibsh-form-bg:#faf6ef; }
.ibsh-field input,
.ibsh-field textarea,
.ibsh-field select { border-color:#897c6b; }
.ibsh-field select option { background:#faf6ef; }
.ibsh-field input::placeholder,
.ibsh-field textarea::placeholder { color:var(--ibsh-muted); opacity:1; }
.ibsh-contact-details dt,
.ibsh-field label span { opacity:1; color:var(--ibsh-muted); }

/* Arabic uses the same unaltered artwork with its quiet edge on the other side. */
.ibsh-page[dir=rtl] .ibsh-story-section::before,
.ibsh-page[dir=rtl] .ibsh-page-hero::before,
.ibsh-page[dir=rtl] .ibsh-story-journey::before,
.ibsh-page[dir=rtl] .ibsh-contact-section::before,
.ibsh-page[dir=rtl] .ibsh-custom-page::before { transform:scaleX(-1); }

/* A restrained crop at phone widths leaves headings and form controls clear.
 * No background motion, fixed attachment or large grain texture is downloaded.
 */
@media (max-width:700px) {
  .ibsh-story-section::before,
  .ibsh-page-hero::before,
  .ibsh-story-journey::before,
  .ibsh-contact-section::before,
  .ibsh-custom-page::before {
    background-size:100% auto;
    background-position:center bottom;
    opacity:.65;
  }
}
@media print {
  .ibsh-story-section::before,
  .ibsh-page-hero::before,
  .ibsh-story-journey::before,
  .ibsh-contact-section::before,
  .ibsh-custom-page::before { display:none; }
}