/* Purpose Built Designs. Page styles on top of scrollcraft.css (the engine's
   own stylesheet, which is never edited). Tokens first, then components. */

:root {
  --sc-canvas:     #EDE7DD;   /* paper, sampled from the brand mark's ground */
  --sc-surface:    #F6F2EA;
  --sc-ink:        #2A2420;   /* espresso, never pure black */
  --sc-ink-soft:   #655850;   /* taupe, tinted from the ink */
  --sc-accent:     #5C4A3E;   /* the monogram's umber */
  --sc-accent-ink: #F6F2EA;
  --sc-font-display: "Bodoni Moda", "Bodoni 72", Didot, Georgia, serif;
  --sc-font-text:    "Outfit", system-ui, sans-serif;
  --sc-shadow-color: 24 22% 14%;
  --pb-dark: #231E1A;
  --pb-r: 2px;                /* one radius, held everywhere */
}

/* ------------------------------------------------------------------ type -- */
.pb-h1, .pb-h2 {
  font-family: var(--sc-font-display);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.015em;
  text-wrap: balance;
  margin: 0;
}
.pb-h1 { font-size: clamp(2.7rem, 1.5rem + 4.9vw, 5.6rem); }
.pb-h2 { font-size: clamp(2.1rem, 1.5rem + 2.6vw, 3.6rem); line-height: 1.04; }
.pb-h1 em, .pb-h2 em { font-style: italic; }
.pb-label {
  font-size: 0.7rem;
  font-weight: 400;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sc-ink-soft);
  margin: 0;
}
.pb-lede {
  font-size: clamp(1.05rem, 0.98rem + 0.35vw, 1.3rem);
  font-weight: 300;
  line-height: 1.5;
  color: var(--sc-ink-soft);
  max-width: 44ch;
  text-wrap: pretty;
  margin: 0;
}

/* --------------------------------------------------------------- chrome -- */
.pb-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sc-5);
  height: 5rem;
  flex: none;
}
.pb-mark { display: inline-flex; flex-direction: column; gap: 0.2rem; text-decoration: none; line-height: 1; }
.pb-mark__name { font-family: var(--sc-font-display); font-size: 1.45rem; letter-spacing: -0.01em; }
.pb-mark__sub { font-size: 0.56rem; letter-spacing: 0.42em; text-transform: uppercase; color: var(--sc-ink-soft); padding-left: 0.1em; }

.pb-nav { display: flex; align-items: center; gap: clamp(1rem, 2.4vw, 2.25rem); }
.pb-nav a:not(.pb-btn) {
  font-size: 0.74rem; letter-spacing: 0.16em; text-transform: uppercase;
  text-decoration: none; color: var(--sc-ink-soft);
  padding-block: 0.9rem;
  transition: color 160ms var(--sc-ease-out);
}
.pb-nav a:not(.pb-btn):hover, .pb-nav a[aria-current="page"] { color: var(--sc-ink); }

.pb-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 2.75rem; padding: 0 1.35rem;
  font-size: 0.72rem; font-weight: 400; letter-spacing: 0.16em; text-transform: uppercase;
  white-space: nowrap; text-decoration: none;
  color: var(--sc-accent-ink); background: var(--sc-ink);
  border: 1px solid var(--sc-ink); border-radius: var(--pb-r);
  transition: background-color 160ms var(--sc-ease-out), border-color 160ms var(--sc-ease-out), transform 120ms var(--sc-ease-out);
}
.pb-btn:hover { background: var(--sc-accent); border-color: var(--sc-accent); }
.pb-btn:active { transform: scale(0.97); }

/* ----------------------------------------------------------------- hero --
   One pinned stage. Paper ground, the headline on it, and a photographic plate
   that is a window (clip-path) onto full-stage images. site.js writes the
   custom properties below from scroll; the defaults are the no-script state:
   the three stages side by side. */
.pb-hero__stage {
  --it: clamp(17rem, 40svh, 26rem);          /* window inset, top    */
  --ib: 7svh;                                 /* window inset, bottom */
  --ix: var(--sc-gutter);                     /* window inset, sides  */
  --ot: 0px;                                  /* where the opened plate's top sits */
  --shut: 1;                                  /* 1 = framed, 0 = opened */
  --ax: 66vw;                                 /* where the finished room begins, plane-local px */
  --bc: 51vw; --bw: 30vw;                     /* the construction strip: centre and width, plane-local px */
  --sa: 66vw; --sd: 36vw;                     /* seams, stage px       */
  --k-old: 1; --k-new: 1;
  --o-during: 1; --o-after: 1;
  --plaque: 0; --dim: 1;
  background: var(--sc-canvas);
}
.pb-hero__top {
  position: absolute; inset: 0 0 auto 0; height: var(--it);
  padding-inline: var(--ix);
  display: flex; flex-direction: column;
  z-index: 1;
}
.pb-hero__copy { margin-top: auto; padding-bottom: 3.25rem; }
.pb-hero__copy .pb-lede { margin-top: 0.9rem; max-width: 60ch; }

.pb-plate {
  position: absolute; inset: var(--ot) 0 0 0; z-index: 2;
  clip-path: inset(calc((var(--it) - var(--ot)) * var(--shut)) calc(var(--ix) * var(--shut)) calc(var(--ib) * var(--shut)) calc(var(--ix) * var(--shut)));
  background: var(--sc-surface);
}
.pb-plane {
  position: absolute; inset: 0;
  /* The shift centres the photograph in the framed window, then eases out as
     the window opens, so the room appears to rise into place. */
  transform: translate3d(0, calc((var(--it) - var(--ot) - var(--ib)) / 2 * var(--shut)), 0) scale(var(--k));
  will-change: transform;
}
.pb-plane--old { --k: var(--k-old); }
.pb-plane--new { --k: var(--k-new); }
.pb-plane img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; max-width: none;
  object-fit: cover;
}
/* The middle stage is a portrait photograph of the work in progress. It is
   shown whole at stage height, carried along with the seam, and clipped to the
   strip between the two rooms, so the strip always shows the middle of it. */
.pb-plane img.pb-during {
  inset: 0 auto 0 0;
  width: max(calc((100svh - var(--ot)) * 0.75), 36vw);
  transform: translate3d(calc(var(--bc) - 50%), 0, 0);
  clip-path: inset(0 calc(50% - var(--bw) / 2));
  opacity: var(--o-during);
  will-change: transform, clip-path;
}
.pb-after  { clip-path: inset(0 0 0 var(--ax)); opacity: var(--o-after); }
.pb-seam {
  position: absolute; top: 0; bottom: 0; left: 0; width: 1px;
  background: var(--sc-surface);
  opacity: var(--dim);
}
.pb-seam--d { transform: translate3d(var(--sd), 0, 0); background: var(--sc-accent); }
.pb-seam--a { transform: translate3d(var(--sa), 0, 0); }

.pb-plaque {
  position: absolute; left: 0; bottom: 0;
  transform: translate3d(calc(var(--ix) * var(--shut) + var(--sc-5)), calc(-1 * (var(--ib) * var(--shut) + var(--sc-5))), 0);
  max-width: min(24rem, calc(100vw - 2 * var(--sc-5)));
  padding: var(--sc-5) var(--sc-5) calc(var(--sc-5) - 0.15rem);
  background: var(--sc-canvas);
  border-radius: var(--pb-r);
  box-shadow: var(--sc-e2);
  opacity: var(--plaque);
}
.pb-plaque p:last-child {
  margin: 0.6rem 0 0;
  font-family: var(--sc-font-display); font-size: clamp(1.3rem, 1.1rem + 0.9vw, 1.75rem);
  line-height: 1.12; letter-spacing: -0.01em; text-wrap: balance;
}

/* The dimension string: the hero's only chrome. A measured line above the
   plate with one span per stage, the way a plan is dimensioned. */
.pb-dim {
  position: absolute; z-index: 3;
  left: var(--ix); right: var(--ix);
  top: calc(var(--it) - 2.25rem); height: 2.25rem;
  opacity: var(--dim);
  pointer-events: none;
}
.pb-dim__line { position: absolute; left: 0; right: 0; bottom: 0.55rem; height: 1px; background: var(--sc-hairline-strong); }
.pb-dim__tick { position: absolute; left: 0; bottom: 0; width: 1px; height: 0.95rem; background: var(--sc-ink-soft); }
.pb-dim__tick--end { left: auto; right: 0; }
.pb-dim__tick--d { transform: translate3d(var(--rd, 36vw), 0, 0); }
.pb-dim__tick--a { transform: translate3d(var(--ra, 66vw), 0, 0); }
.pb-dim__label {
  position: absolute; left: 0; top: 0;
  font-size: 0.66rem; letter-spacing: 0.2em; text-transform: uppercase; line-height: 1;
  color: var(--sc-ink-soft); white-space: nowrap;
  transform: translate3d(var(--x, 0px), 0, 0) translateX(-50%);
  opacity: var(--o, 1);
}

/* Entrance. Opacity and a short rise, staggered, on wrappers the scroll code
   never touches. */
@media (prefers-reduced-motion: no-preference) {
  .pb-hero .pb-head, .pb-hero .pb-h1, .pb-hero .pb-lede, .pb-hero .pb-dim__line {
    animation: pb-rise 900ms var(--sc-ease-out) both;
  }
  .pb-hero .pb-h1 { animation-delay: 90ms; }
  .pb-hero .pb-lede { animation-delay: 170ms; }
  .pb-hero .pb-dim__line { animation-delay: 240ms; }
}
@keyframes pb-rise { from { opacity: 0; transform: translate3d(0, 14px, 0); } }

/* --------------------------------------------------------------- ledger -- */
.pb-ledger { padding-block: clamp(3.5rem, 7vw, 7rem) var(--sc-section); }
.pb-ledger__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.pb-index { list-style: none; margin: var(--sc-7) 0 0; padding: 0; border-top: 1px solid var(--sc-hairline-strong); }
.pb-index li { border-bottom: 1px solid var(--sc-hairline-strong); }
.pb-index a {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center;
  column-gap: var(--sc-5); row-gap: 0.35rem;
  padding-block: clamp(1.4rem, 2.6vw, 2.2rem);
  text-decoration: none;
}
.pb-index__name {
  font-family: var(--sc-font-display); font-size: clamp(1.9rem, 1.4rem + 2.2vw, 3.1rem);
  line-height: 1.02; letter-spacing: -0.012em;
  transition: transform 180ms var(--sc-ease-out);
}
.pb-index__line { grid-column: 1; color: var(--sc-ink-soft); font-weight: 300; max-width: 46ch; }
.pb-index__go { grid-row: 1 / span 2; grid-column: 2; width: 2.75rem; height: 2.75rem; display: grid; place-items: center; color: var(--sc-accent); transition: transform 180ms var(--sc-ease-out); }
@media (hover: hover) and (pointer: fine) {
  .pb-index a:hover .pb-index__name { transform: translate3d(0.5rem, 0, 0); }
  .pb-index a:hover .pb-index__go { transform: translate3d(0.35rem, 0, 0); }
}
.pb-detail { margin: 0; position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--pb-r); background: var(--sc-surface); }
.pb-detail img { position: absolute; left: 0; top: -40px; width: 100%; height: calc(100% + 80px); max-width: none; object-fit: cover; }

/* -------------------------------------------------------------- gallery -- */
.pb-rooms-shown { padding-bottom: var(--sc-section); }
.pb-gallery { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 4vw, 4rem); margin-top: var(--sc-7); align-items: start; }
.pb-gallery figure { margin: 0; }
.pb-gallery img { width: 100%; height: auto; border-radius: var(--pb-r); background: var(--sc-surface); }
.pb-gallery figcaption { margin-top: 0.75rem; }
.pb-gallery__a, .pb-gallery__b { display: grid; gap: clamp(2rem, 4vw, 4rem); }
.pb-gallery__a { margin-top: clamp(3rem, 9vw, 9rem); }

/* ---------------------------------------------------------------- close --
   Dark ground. color is restated with the tokens, because it is inherited as a
   computed value and would otherwise keep the page's ink. */
.pb-close {
  --sc-canvas: var(--pb-dark); --sc-surface: #2E2823;
  --sc-ink: #F1EBE1; --sc-ink-soft: #B9AC9F;
  --sc-accent: #D8CBBB; --sc-accent-ink: #231E1A;
  --sc-hairline-strong: color-mix(in oklab, var(--sc-ink) 22%, transparent);
  background: var(--pb-dark); color: var(--sc-ink);
  padding-top: var(--sc-section);
}
.pb-close .pb-btn { color: var(--sc-accent-ink); background: var(--sc-ink); border-color: var(--sc-ink); }
.pb-close .pb-btn:hover { background: var(--sc-accent); border-color: var(--sc-accent); }
.pb-close__head { display: grid; gap: 0.9rem; margin-bottom: clamp(1.75rem, 4vw, 3rem); }

.pb-compare { --pos: 50; margin: 0; }
.pb-compare__frame {
  position: relative; container-type: inline-size;
  aspect-ratio: 3 / 2; overflow: hidden; border-radius: var(--pb-r);
  background: var(--sc-surface);
}
.pb-compare__pair { position: absolute; inset: 0; }
.pb-compare__pair[hidden] { display: none; }
.pb-compare__frame img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.pb-compare__after { clip-path: inset(0 0 0 calc(var(--pos) * 1%)); }
.pb-compare__handle {
  position: absolute; top: 0; bottom: 0; left: 0; width: 1px; background: #F6F2EA;
  transform: translate3d(calc(var(--pos) * 1cqw), 0, 0);
  pointer-events: none;
}
.pb-compare__handle::after {
  content: ""; position: absolute; top: 50%; left: 50%;
  width: 3rem; height: 3rem; margin: -1.5rem 0 0 -1.5rem;
  border-radius: 50%;
  background: #F6F2EA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232A2420' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 7l-5 5 5 5M15 7l5 5-5 5'/%3E%3C/svg%3E") center / 1.35rem no-repeat;
  box-shadow: 0 2px 6px hsl(24 22% 8% / 0.35), 0 10px 24px -6px hsl(24 22% 8% / 0.45);
  transition: transform 160ms var(--sc-ease-out);
}
.pb-compare__frame input {
  position: absolute; inset: 0; width: 100%; height: 100%; margin: 0;
  opacity: 0; cursor: ew-resize; touch-action: pan-y;
}
.pb-compare__frame:has(input:focus-visible) { outline: 2px solid var(--sc-accent); outline-offset: 4px; }
.pb-compare__frame:has(input:active) .pb-compare__handle::after { transform: scale(0.94); }
.pb-rooms { display: flex; flex-wrap: wrap; gap: var(--sc-2) var(--sc-5); margin-bottom: var(--sc-4); }
.pb-rooms button {
  appearance: none; background: none; border: 0; border-bottom: 1px solid transparent; border-radius: 0;
  min-height: 2.75rem; padding: 0;
  font-size: 0.74rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--sc-ink-soft); cursor: pointer;
  transition: color 160ms var(--sc-ease-out), border-color 160ms var(--sc-ease-out);
}
.pb-rooms button:hover, .pb-rooms a:hover { color: var(--sc-ink); }
.pb-rooms button[aria-pressed="true"], .pb-rooms a[aria-current="page"] { color: var(--sc-ink); border-bottom-color: currentColor; }
/* The same tabs as links: one per house on the previous-work pages. */
.pb-rooms a {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  border-bottom: 1px solid transparent; text-decoration: none;
  font-size: 0.74rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--sc-ink-soft);
  transition: color 160ms var(--sc-ease-out), border-color 160ms var(--sc-ease-out);
}
.pb-projects { align-items: center; margin-bottom: var(--sc-2); }
.pb-projects .pb-label { padding-right: var(--sc-5); margin-right: var(--sc-2); border-right: 1px solid var(--sc-hairline-strong); line-height: 1.6; }
.pb-compare figcaption { display: flex; justify-content: space-between; margin-top: 0.9rem; }

.pb-ask {
  display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between;
  gap: var(--sc-6);
  padding-block: clamp(3.5rem, 8vw, 7rem);
}
.pb-ask .pb-h2 { max-width: 18ch; }

.pb-foot {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: var(--sc-4) var(--sc-6);
  padding-block: var(--sc-6);
  border-top: 1px solid var(--sc-hairline-strong);
  font-size: 0.74rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--sc-ink-soft);
}
.pb-foot nav { display: flex; flex-wrap: wrap; gap: var(--sc-2) var(--sc-5); }
.pb-foot a { text-decoration: none; padding-block: 0.75rem; transition: color 160ms var(--sc-ease-out); }
.pb-foot a:hover { color: var(--sc-ink); }
.pb-foot p { margin: 0; }

/* ---------------------------------------------------------- inner pages -- */
.pb-page__head { padding-block: clamp(2.5rem, 7vw, 6rem) clamp(2rem, 5vw, 4rem); display: grid; gap: 1.1rem; }
.pb-page__plate { margin: 0 0 var(--sc-section); }
.pb-page__plate > img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--pb-r); }
.pb-page__plate .pb-compare figcaption { color: var(--sc-ink-soft); }
.pb-page .pb-close { padding-top: 0; margin-top: auto; }
/* The footer sits at the bottom of the screen even when a page is short. */
body.pb-page { min-height: 100svh; display: flex; flex-direction: column; }
.pb-page main { flex: 1; display: flex; flex-direction: column; }

.pb-pair { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(1rem, 3vw, 3rem); align-items: end; }
.pb-pair figure { margin: 0; }
.pb-pair img { width: 100%; height: auto; border-radius: var(--pb-r); }
.pb-pair figcaption { margin-top: 0.75rem; }
.pb-pair--even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }

/* The project page. */
.pb-block { margin-bottom: var(--sc-section); }
.pb-block__head { display: grid; gap: 0.9rem; }
.pb-block > .pb-h2 + *, .pb-block__head + * { margin-top: var(--sc-7); }
.pb-stage + .pb-stage { margin-top: var(--sc-8); }
.pb-stage > h3 { padding-bottom: 0.75rem; border-bottom: 1px solid var(--sc-hairline-strong); }
.pb-stage .pb-stages__row { margin-top: var(--sc-5); }
.pb-renders { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(1rem, 3vw, 3rem); }
.pb-renders figure { margin: 0; }
.pb-renders figure:nth-child(2) { grid-row: span 2; }
.pb-renders img { width: 100%; height: auto; border-radius: var(--pb-r); outline: 1px solid var(--sc-hairline-strong); outline-offset: -1px; }
.pb-renders figcaption, .pb-columns figcaption { margin-top: 0.75rem; }
.pb-columns { columns: 2; column-gap: clamp(1.5rem, 4vw, 4rem); margin-top: var(--sc-7); }
.pb-columns figure { margin: 0 0 clamp(2rem, 4vw, 4rem); break-inside: avoid; }
.pb-columns img { width: 100%; height: auto; border-radius: var(--pb-r); background: var(--sc-surface); }
.pb-headrow { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--sc-3) var(--sc-6); }
.pb-more { font-size: 0.74rem; letter-spacing: 0.16em; text-transform: uppercase; text-underline-offset: 0.4em; padding-block: 0.75rem; }
.pb-stages__more { margin: var(--sc-6) 0 0; }
.pb-lede a { color: var(--sc-ink); }

/* One room at three stages. */
.pb-stages { margin-bottom: var(--sc-section); }
.pb-stages__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 2.5rem); margin-top: var(--sc-6); }
.pb-stages__row figure { margin: 0; }
.pb-stages__row img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: var(--op, 50%) 50%; border-radius: var(--pb-r); }
.pb-stages__row figcaption { margin-top: 0.75rem; }

/* The header sheds links as it narrows: services first, then previous work,
   so it never wraps. Everything stays reachable from the page and the footer. */
@media (max-width: 1000px) { .pb-nav a:not(.pb-btn):not(.pb-nav__work) { display: none; } }
@media (max-width: 600px) { .pb-nav a:not(.pb-btn) { display: none; } }

/* --------------------------------------------------------------- mobile -- */
@media (max-width: 760px) {
  .pb-head { height: 4.25rem; }
  .pb-mark__name { font-size: 1.25rem; }
  /* On a phone the plate is a tall frame under the headline, not a window onto
     a full-screen photograph: a landscape photo blown up to fill a portrait
     screen is three times its own resolution. It opens edge to edge and down to
     the bottom of the screen, and the headline stays. */
  .pb-hero__stage { --it: 18.75rem; --ib: 5svh; --ot: var(--it); }
  .pb-hero__copy { padding-bottom: 3rem; }
  /* Portrait crops: each photograph keeps its own subject in frame. */
  .pb-plane--old img { object-position: 44% 50%; }
  .pb-plane--new .pb-after { object-position: 100% 50%; }
  .pb-dim__label { font-size: 0.6rem; letter-spacing: 0.16em; }
  .pb-ledger__grid { grid-template-columns: minmax(0, 1fr); }
  .pb-detail { aspect-ratio: 4 / 3; order: -1; }
  .pb-compare__frame { aspect-ratio: 4 / 3; }
  .pb-compare__frame img { object-position: var(--op, 50%) 50%; }
  .pb-gallery { grid-template-columns: minmax(0, 1fr); }
  /* Stacked, the two columns would drift into each other. */
  .pb-gallery [data-sc-parallax] { transform: none !important; }
  .pb-gallery__a { margin-top: 0; }
  /* Before, during, after becomes a row to swipe through. */
  .pb-stages__row {
    display: flex; gap: 0.75rem; overflow-x: auto;
    scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none;
    margin-inline: calc(-1 * var(--sc-gutter)); padding-inline: var(--sc-gutter); scroll-padding-inline: var(--sc-gutter);
  }
  .pb-stages__row::-webkit-scrollbar, .pb-rooms::-webkit-scrollbar { display: none; }
  .pb-stages__row figure { flex: 0 0 80%; scroll-snap-align: start; }
  /* Room tabs stay on one line and scroll sideways. */
  .pb-rooms { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(-1 * var(--sc-gutter)); padding-inline: var(--sc-gutter); }
  .pb-rooms > * { flex: none; }
  .pb-renders { grid-template-columns: minmax(0, 1fr); }
  .pb-renders figure:nth-child(2) { grid-row: auto; }
  .pb-columns { columns: 1; }
  .pb-pair { grid-template-columns: minmax(0, 1fr); }
  .pb-ask { align-items: start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .pb-plane { transform: translate3d(0, calc((var(--it) - var(--ot) - var(--ib)) / 2), 0); }
  .pb-after { clip-path: none; }
  .pb-plane img.pb-during { inset: 0; width: 100%; transform: none; clip-path: none; }
  .pb-seam { display: none; }
}

/* -------------------------------------------------------------- contact -- */
.pb-contact { flex: 1; align-content: center; }
.pb-contact p:last-of-type { margin: var(--sc-4) 0 0; }
.pb-page__plate > img[src*="during"] { outline: 1px solid var(--sc-hairline-strong); outline-offset: -1px; }