/* A richer rhythm built around the work: architecture, tools, people. */
.brand-page .brand-home-hero {
  position: relative;
  isolation: isolate;
}
.brand-page .brand-home-grid {
  position: relative;
}
.brand-page .brand-home-hero::before {
  content: "L’IMMOBILIER";
  position: absolute;
  left: 5.5%;
  top: 11px;
  font-size: clamp(90px, 13vw, 200px);
  letter-spacing: -0.065em;
  line-height: 1;
  font-weight: 650;
  color: transparent;
  -webkit-text-stroke: 1px #f3f0e909;
  white-space: nowrap;
  z-index: -1;
  pointer-events: none;
}
.brand-page .brand-home-copy .eyebrow::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  background: #ff7845;
  margin: 0 12px 2px 0;
}
.brand-page .brand-art-frame {
  position: relative;
}
.brand-page .brand-art-frame::before,
.brand-page .brand-art-frame::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  pointer-events: none;
}
.brand-page .brand-art-frame::before {
  left: 10px;
  top: 40px;
  border-left: 1px solid #57656c;
  border-top: 1px solid #57656c;
}
.brand-page .brand-art-frame::after {
  right: 10px;
  bottom: 62px;
  border-right: 1px solid #57656c;
  border-bottom: 1px solid #57656c;
}
.brand-page .architecture-floor {
  transform-box: fill-box;
  transform-origin: center;
}
.brand-page .brand-home-copy h1 > span {
  opacity: 1;
  color: #a6b2b6;
}
.brand-page .brand-sectors .sector-grid {
  grid-template-columns: 1.12fr 0.88fr;
  gap: 6%;
  align-items: start;
}
.brand-page .brand-sectors .sector-card:nth-child(2) {
  margin-top: 110px;
}
.brand-page .brand-sectors .sector-card:nth-child(2) img {
  aspect-ratio: 1.2;
}
.brand-page .sector-card img {
  transition: filter 0.35s ease;
}
.brand-page .sector-card:hover img {
  filter: saturate(1);
}
.brand-page .brand-sectors .home-conversion {
  margin-top: 65px;
}
.brand-page .brand-services .section-heading {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  column-gap: 9%;
  max-width: none;
}
.brand-page .brand-services .section-heading .eyebrow {
  grid-column: 1/-1;
}
.brand-page .brand-services .section-heading > p {
  margin: 0;
  align-self: end;
  font-size: 16px;
}
.brand-page .brand-services .section-heading h2 {
  font-size: clamp(36px, 3.8vw, 54px);
}

/* An explainer, deliberately separate from the actual tools in the catalogue. */
.brand-page .service-explorer {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 7%;
  align-items: start;
}
.brand-page .service-explorer-stage {
  position: sticky;
  top: 110px;
  min-height: 462px;
  background: #20313a;
  border: 1px solid #43535b;
  display: flex;
  flex-direction: column;
  padding: 25px 32px 23px;
  overflow: clip;
}
.brand-page .service-explorer-label {
  font-size: 11px;
  color: #9fadb4;
}
.brand-page .service-explorer-caption {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: #b2bec3;
  padding-top: 19px;
  border-top: 1px solid #43535b;
}
.brand-page .service-explorer-caption > span:last-child {
  color: #ff966e;
  font-variant-numeric: tabular-nums;
}
.brand-page .service-explorer-visual {
  flex: 1;
  display: grid;
  place-items: center;
  min-height: 355px;
  padding-block: 27px;
}
.brand-page .service-explorer-visual[hidden] {
  display: none;
}
.brand-page .service-option {
  border-top: 1px solid var(--line);
}
.brand-page .service-option:last-child {
  border-bottom: 1px solid var(--line);
}
.brand-page .service-option summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: 25px 1fr 22px;
  align-items: center;
  gap: 19px;
  min-height: 94px;
  padding: 22px 0;
}
.brand-page .service-option summary::-webkit-details-marker {
  display: none;
}
.brand-page .service-option summary > span:first-child {
  font-size: 11px;
  color: #8e9da6;
}
.brand-page .service-option summary h3 {
  font-size: clamp(23px, 2.2vw, 31px);
  line-height: 1.13;
  font-weight: 500;
  text-wrap: initial;
  max-width: 20ch;
}
.brand-page .service-option summary > .icon {
  width: 19px;
  height: 19px;
  transition: transform 0.2s ease;
  color: #8e9da6;
}
.brand-page .service-option[open] summary > .icon {
  transform: rotate(45deg);
  color: #ff966e;
}
.brand-page .service-option[open] summary > span:first-child {
  color: #ff966e;
}
.brand-page .service-option-body {
  padding: 0 35px 29px 44px;
}
.brand-page .service-option-body > p {
  font-size: 16px;
  line-height: 1.7;
}
.brand-page .service-option-body > div {
  border-left: 2px solid #ff4d0a;
  padding-left: 18px;
  margin-top: 23px;
}
.brand-page .service-option-body > div > span {
  font-size: 10px;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  color: #ff966e;
}
.brand-page .service-option-body > div > p {
  font-size: 14px;
  color: #e0e5e3;
  margin-top: 8px;
}
.brand-page .service-sheet {
  width: 100%;
  background: #e6e8e1;
  color: #17232a;
  padding: 24px;
  transform: rotate(-3deg);
  box-shadow: 16px 19px 0 #17252d;
}
.brand-page .service-sheet-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 15px;
  padding-bottom: 18px;
  border-bottom: 1px solid #bbc5c5;
}
.brand-page .service-sheet-top .icon {
  color: #a73713;
}
.brand-page .service-sheet-row {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  padding-block: 16px;
  border-bottom: 1px solid #ccd2cc;
  font-size: 12px;
}
.brand-page .service-sheet-row > span {
  color: #5a696f;
}
.brand-page .service-sheet-row strong {
  font-weight: 500;
}
.brand-page .service-sheet-foot {
  color: #637278;
  margin-top: 19px;
  font-size: 10px;
}
.brand-page .service-network {
  width: 100%;
}
.brand-page .service-network-inputs {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.brand-page .service-node {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 11px;
  color: #e8ece7;
  font-size: 11px;
  border: 1px solid #5c6d75;
  background: #263b46;
  padding: 17px 13px;
  flex: 1;
}
.brand-page .service-node .icon {
  width: 25px;
  height: 25px;
}
.brand-page .service-network-rails {
  display: flex;
  justify-content: space-around;
  height: 43px;
  width: 73%;
  margin: auto;
  border-bottom: 1px solid #ff966e;
}
.brand-page .service-network-rails span {
  width: 1px;
  background: #ff966e;
}
.brand-page .service-network-rails span:first-child {
  margin-right: auto;
}
.brand-page .service-network-rails span:last-child {
  margin-left: auto;
}
.brand-page .service-core {
  margin: 23px auto 0;
  width: 90%;
  text-align: center;
  background: #ff4d0a;
  color: #17232a;
  padding: 14px 20px;
  font-weight: 600;
  font-size: 28px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
}
.brand-page .service-core span {
  font-size: 12px;
  font-weight: 500;
}
.brand-page .service-network-output {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding-top: 10px;
}
.brand-page .service-network-output > .icon {
  color: #ff966e;
}
.brand-page .service-network-output .service-node {
  flex-direction: row;
  padding: 12px 20px;
}
.brand-page .service-sequence {
  width: 100%;
  padding-inline: 10px;
}
.brand-page .service-sequence > div {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 4px 17px;
  padding: 19px 21px;
  border: 1px solid #5c6d75;
  background: #283e49;
}
.brand-page .service-sequence > div > .icon {
  grid-row: 1/3;
  align-self: center;
  width: 27px;
  height: 27px;
  color: #ff966e;
}
.brand-page .service-sequence > div > span {
  font-size: 16px;
  letter-spacing: -0.02em;
}
.brand-page .service-sequence small {
  font-size: 10px;
  color: #9fadb4;
}
.brand-page .service-sequence-line {
  display: block;
  height: 25px;
  width: 1px;
  background: #ff966e;
  margin: 0 0 0 42px;
}
.brand-page .service-workspace {
  width: 100%;
  background: #e6e8e1;
  color: #17232a;
  box-shadow: 14px 17px 0 #17252d;
  transform: rotate(-2deg);
}
.brand-page .service-workspace-head {
  display: flex;
  justify-content: space-between;
  padding: 19px;
  font-size: 12px;
  border-bottom: 1px solid #b9c4c4;
}
.brand-page .service-workspace-head .icon {
  color: #a73812;
  width: 18px;
  height: 18px;
}
.brand-page .service-workspace-body {
  display: flex;
  min-height: 245px;
}
.brand-page .service-workspace-nav {
  display: flex;
  flex-direction: column;
  width: 42px;
  padding: 18px 11px;
  gap: 15px;
  background: #ccd5d2;
}
.brand-page .service-workspace-nav span {
  height: 7px;
  width: 18px;
  background: #82979e;
}
.brand-page .service-workspace-nav span:first-child {
  background: #ba3c0f;
}
.brand-page .service-workspace-content {
  flex: 1;
  padding: 21px 18px;
}
.brand-page .service-workspace-content > strong {
  display: block;
  font-size: 22px;
  letter-spacing: -0.045em;
  font-weight: 500;
}
.brand-page .service-workspace-content > span {
  font-size: 11px;
  color: #50656e;
}
.brand-page .service-workspace-content > div:not(.service-workspace-tasks) {
  display: flex;
  gap: 8px;
  margin-top: 18px;
}
.brand-page .service-workspace-content i {
  height: 40px;
  flex: 1;
  background: #bcc9c9;
  border-top: 2px solid #809ba2;
}
.brand-page .service-workspace-content i:nth-child(2) {
  background: #efcbb9;
  border-top-color: #d86930;
}
.brand-page .service-workspace-content p {
  font-size: 11px;
  color: #50656e;
  margin: 20px 0 8px;
}
.brand-page .service-workspace-tasks {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}
.brand-page .service-workspace-tasks span {
  display: flex;
  gap: 4px;
  font-size: 9px;
}
.brand-page .service-workspace-tasks .icon {
  width: 12px;
  height: 12px;
  color: #a33d16;
}
.brand-page .service-writing {
  width: 100%;
}
.brand-page .service-writing-source {
  margin: 0 35px 0 0;
  padding: 19px 23px;
  border: 1px solid #5c6d75;
}
.brand-page .service-writing-source > span {
  font-size: 10px;
  color: #9fadb4;
}
.brand-page .service-writing-source p {
  font-size: 13px;
  line-height: 1.7;
  color: #e0e5e3;
  margin-top: 11px;
}
.brand-page .service-writing-link {
  display: block;
  margin: 12px 0 12px 50px;
  color: #ff966e;
}
.brand-page .service-writing-draft {
  margin-left: 35px;
  background: #e6e8e1;
  padding: 21px 24px;
  color: #17232a;
  border-left: 3px solid #ff4d0a;
}
.brand-page .service-writing-draft > span {
  font-size: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.brand-page .service-writing-draft .icon {
  width: 18px;
  height: 18px;
  color: #a33713;
}
.brand-page .service-writing-draft p {
  color: #17232a;
  font-size: 21px;
  line-height: 1.2;
  letter-spacing: -0.03em;
  margin: 19px 0 13px;
}
.brand-page .service-writing-draft small {
  font-size: 10px;
  color: #637278;
}

/* A large, quiet statement links the commercial work to the cinema of Vision. */
.brand-page .brand-signature {
  border-bottom: 1px solid #3a484f;
  padding-block: 115px 75px;
  overflow: clip;
}
.brand-page .signature-heading {
  position: relative;
}
.brand-page .signature-heading h2 {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 7%;
  font-size: clamp(43px, 5.7vw, 82px);
  font-weight: 500;
  letter-spacing: -0.06em;
  max-width: none;
}
.brand-page .signature-heading h2 > span:last-child {
  color: #a6b2b6;
}
.brand-page .signature-composition {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 7%;
  align-items: center;
  margin-top: 5px;
}
.brand-page .signature-art {
  max-width: 660px;
  margin: -30px 0 -65px -20px;
}
.brand-page .signature-art svg {
  width: 100%;
  height: auto;
}
.brand-page .signature-copy {
  padding-block: 50px;
  max-width: 440px;
}
.brand-page .signature-copy > p {
  font-size: 19px;
  line-height: 1.7;
}
.brand-page .signature-copy > p:nth-child(2) {
  color: #f2f0e9;
  font-size: 25px;
  line-height: 1.35;
  letter-spacing: -0.025em;
  margin-block: 28px;
}
.brand-page .signature-copy > .text-link {
  font-size: 16px;
  padding-bottom: 13px;
  border-bottom: 1px solid #6c7c84;
}
.brand-page .signature-method {
  display: flex;
  align-items: center;
  gap: 16px;
  color: #a6b2b6;
  font-size: 12px;
  margin-top: 25px;
}
.brand-page .signature-method .icon {
  width: 16px;
  height: 16px;
}
.brand-page .signature-method:hover {
  color: #ff966e;
}

/* Each tool gets an illustrative preview of its actual purpose. */
.brand-page .tool-card {
  position: relative;
  border: 0;
  padding: 0 0 26px;
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-direction: column;
}
.brand-page .tool-card:hover {
  transform: none;
  background: transparent;
  border-color: var(--muted);
}
.brand-page .tool-card-top {
  margin: 21px 0 17px;
}
.brand-page .tool-card-top .tool-symbol {
  width: 24px;
  height: 24px;
  padding: 0;
}
.brand-page .tool-card h3 {
  font-size: 29px;
  margin-bottom: 15px;
}
.brand-page .tool-card > p {
  font-size: 15px;
  line-height: 1.7;
}
.brand-page .tool-card-link {
  margin-top: auto;
  padding-top: 23px;
}
.brand-page .tool-card-example {
  display: none;
}
.brand-page .tool-preview {
  --preview-paper: #e1e7e3;
  --preview-copy: #17232a;
  --preview-line: #b4c2c3;
  --preview-accent: #b74821;
  --preview-soft: #c4d1cf;
  order: -1;
  color: var(--preview-copy);
  background: #c9d4d2;
  width: 100%;
  height: 240px;
  padding: 34px 30px 25px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}
.brand-page .tool-card:nth-child(even) .tool-preview,
.brand-page [data-category]:nth-child(even) .tool-preview {
  background: #d5d8cf;
}
.brand-page .tool-card .tool-preview > :not(.preview-note) {
  transition: transform 0.35s ease;
}
.brand-page .tool-card:hover .tool-preview > :not(.preview-note) {
  transform: translateY(-4px);
}
.brand-page .preview-note {
  font-size: 10px;
  margin-top: 20px;
  color: #496069;
}
.brand-page .preview-search {
  padding: 12px 16px;
  background: #eff0e9;
  border: 1px solid #aabdbc;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 12px;
  margin-bottom: 16px;
  box-shadow: 5px 5px 0 #a0b4b455;
}
.brand-page .preview-search .icon {
  width: 18px;
  height: 18px;
  color: var(--preview-accent);
}
.brand-page .preview-match {
  padding-inline: 13px;
}
.brand-page .preview-result {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-block: 10px;
  font-size: 11px;
  border-bottom: 1px solid var(--preview-line);
}
.brand-page .preview-result .icon {
  width: 14px;
  height: 14px;
  color: var(--preview-accent);
}
.brand-page .preview-result.muted {
  opacity: 0.55;
}
.brand-page .preview-days {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #8fa5a8;
  padding-bottom: 12px;
  font-size: 10px;
  color: #47636e;
}
.brand-page .preview-schedule {
  display: grid;
  grid-template-columns: 1fr 0.28fr 1fr 1.2fr;
  gap: 6px;
  align-items: center;
  height: 87px;
  background: repeating-linear-gradient(
    90deg,
    transparent 0,
    transparent calc(25% - 1px),
    #b5c5c5 calc(25% - 1px),
    #b5c5c5 25%
  );
}
.brand-page .preview-schedule span {
  font-size: 11px;
  background: #8da9b2;
  padding: 16px 12px;
  color: #172f3c;
}
.brand-page .preview-schedule span:nth-last-child(2) {
  background: #da9478;
  color: #492b1d;
}
.brand-page .preview-schedule span:last-child {
  align-self: end;
}
.brand-page .preview-schedule i {
  height: 1px;
  background: #6e8a93;
}
.brand-page .preview-board {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 13px;
}
.brand-page .preview-board > div {
  border-top: 2px solid #75929e;
  padding-top: 13px;
}
.brand-page .preview-board > div:nth-child(2) {
  border-color: #bf5226;
}
.brand-page .preview-board > div > span {
  font-size: 10px;
}
.brand-page .preview-board i {
  display: block;
  height: 34px;
  margin-top: 10px;
  background: #e8ece4;
  box-shadow: 3px 3px 0 #a1b2b455;
}
.brand-page .preview-board .preview-board-sheet {
  height: 54px;
  background:
    linear-gradient(#9bafad 0 0) 12px 15px / 55% 3px no-repeat,
    linear-gradient(#b4c0b9 0 0) 12px 25px / 35% 3px no-repeat,
    #f2f2e9;
}
.brand-page .preview-board .sheet-1 {
  border-left: 2px solid #cd5d30;
}
.brand-page .preview-arrival {
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr);
  gap: 21px;
  align-items: center;
}
.brand-page .preview-door .icon {
  width: 50px;
  height: 50px;
  color: #47636e;
}
.brand-page .preview-arrival > div > span {
  font-size: 16px;
  letter-spacing: -0.025em;
}
.brand-page .preview-result.pending {
  color: #91330f;
}
.brand-page .preview-bubble {
  font-size: 12px;
  background: #ecede5;
  padding: 15px 21px;
  align-self: start;
  border-radius: 1px 16px 16px 16px;
}
.brand-page .preview-bubble.reply {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 19px 21px;
  background: #304f60;
  color: #e8ece7;
  font-size: 15px;
  line-height: 1.4;
  margin: 17px 0 0 30px;
  align-self: end;
  border-radius: 16px 16px 1px 16px;
}
.brand-page .preview-bubble.reply .icon {
  color: #ffb290;
}
.brand-page .preview-stock {
  display: flex;
  flex-direction: column;
  gap: 17px;
}
.brand-page .preview-stock > div {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 15px;
  align-items: center;
  font-size: 11px;
}
.brand-page .stock-track {
  height: 19px;
  background: #b1c3c4;
  border-right: 1px dashed #557783;
}
.brand-page .stock-fill {
  display: block;
  height: 100%;
  width: 65%;
  background: #6f919e;
}
.brand-page .stock-1 {
  width: 32%;
  background: #cb764f;
}
.brand-page .stock-2 {
  width: 83%;
}
.brand-page .preview-load {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 13px;
  align-items: end;
}
.brand-page .preview-load > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: end;
  gap: 12px;
  height: 130px;
}
.brand-page .preview-load small {
  font-size: 10px;
  color: #47636e;
}
.brand-page .load-block {
  height: 63%;
  width: 100%;
  background: repeating-linear-gradient(
    0deg,
    #7995a0 0px,
    #7995a0 16px,
    #c9d4d2 16px,
    #c9d4d2 20px
  );
}
.brand-page .load-1 {
  height: 44%;
}
.brand-page .load-2 {
  height: 80%;
  background: repeating-linear-gradient(
    0deg,
    #bf785a 0px,
    #bf785a 16px,
    #c9d4d2 16px,
    #c9d4d2 20px
  );
}
.brand-page .load-3 {
  height: 50%;
}
.brand-page .load-4 {
  height: 35%;
}
.brand-page .catalog-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 55px 40px;
}
.brand-page .catalog-grid .tool-preview {
  height: 305px;
  padding-inline: 55px;
}
.brand-page .catalog-grid .tool-card {
  height: 100%;
}
.brand-page .catalog-grid .tool-card-top {
  margin-top: 28px;
}
.brand-page .catalog-grid .tool-card h3 {
  font-size: 35px;
}
.brand-page .catalog-grid .tool-card > p {
  max-width: 52ch;
}
.brand-page .catalog-intro {
  border-left: 2px solid #ff4d0a;
  padding-left: 22px;
}
.brand-page .filter-bar {
  margin-block: 35px 45px;
}
.brand-page .catalog-hero > .container {
  display: grid;
  grid-template-columns: 1fr 290px;
  align-items: center;
  gap: 100px;
}
.brand-page .catalog-hero h1 {
  font-size: clamp(45px, 5.5vw, 79px);
  max-width: 18ch;
}
.brand-page .catalog-seal {
  position: relative;
  display: grid;
  place-content: center;
  justify-items: center;
  min-height: 270px;
  border: 1px solid #54656d;
  border-radius: 50%;
}
.brand-page .catalog-seal::after {
  position: absolute;
  content: "";
  inset: 13px;
  border: 1px dashed #53666e;
  border-radius: 50%;
}
.brand-page .catalog-seal strong {
  font-size: 125px;
  line-height: 1;
  font-weight: 400;
  letter-spacing: -0.06em;
}
.brand-page .catalog-seal span {
  font-size: 11px;
  color: #ff966e;
  margin-top: 8px;
}

@media (max-width: 1000px) {
  .brand-page .brand-services .section-heading {
    grid-template-columns: 1fr;
    gap: 25px;
  }
  .brand-page .brand-services .section-heading > p {
    max-width: 60ch;
  }
  .brand-page .brand-services .section-heading .eyebrow {
    margin-bottom: 0;
  }
  .brand-page .service-explorer {
    gap: 5%;
  }
  .brand-page .service-explorer-stage {
    padding-inline: 23px;
  }
  .brand-page .service-option summary {
    gap: 12px;
  }
  .brand-page .service-option summary h3 {
    font-size: 24px;
  }
  .brand-page .service-option-body {
    padding-left: 37px;
    padding-right: 10px;
  }
  .brand-page .service-sheet {
    padding: 19px;
  }
  .brand-page .service-node {
    padding-inline: 10px;
    font-size: 10px;
  }
  .brand-page .service-workspace-content {
    padding-inline: 13px;
  }
  .brand-page .tool-preview {
    padding-inline: 23px;
  }
  .brand-page .preview-arrival {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .brand-page .preview-door {
    display: none;
  }
  .brand-page .catalog-hero > .container {
    grid-template-columns: 1fr 200px;
    gap: 50px;
  }
  .brand-page .catalog-seal {
    min-height: 200px;
  }
  .brand-page .catalog-seal strong {
    font-size: 100px;
  }
}
@media (max-width: 760px) {
  .brand-page .brand-home-hero::before {
    display: none;
  }
  .brand-page .brand-home-copy .eyebrow {
    font-size: 9px;
    letter-spacing: 0.065em;
  }
  .brand-page .brand-art-frame::before {
    top: 30px;
    left: 0;
  }
  .brand-page .brand-art-frame::after {
    right: 0;
  }
  .brand-page .brand-sectors .sector-grid {
    grid-template-columns: 1fr;
    gap: 45px;
  }
  .brand-page .brand-sectors .sector-card:nth-child(2) {
    margin-top: 0;
  }
  .brand-page .brand-sectors .sector-card:nth-child(2) img {
    aspect-ratio: 1.55;
  }
  .brand-page .brand-services .section-heading {
    gap: 22px;
  }
  .brand-page .brand-services .section-heading h2 {
    font-size: 35px;
  }
  .brand-page .service-explorer {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }
  .brand-page .service-explorer-stage {
    display: none;
  }
  .brand-page .service-explorer-options {
    width: 100%;
  }
  .brand-page .service-option summary {
    min-height: 86px;
    gap: 14px;
  }
  .brand-page .service-option summary h3 {
    font-size: 25px;
  }
  .brand-page .service-option-body {
    padding: 0 14px 28px 39px;
  }
  .brand-page .service-option-body > p {
    font-size: 15px;
  }
  .brand-page .brand-signature {
    padding-block: 70px 35px;
  }
  .brand-page .signature-heading h2 {
    grid-template-columns: 1fr;
    gap: 20px;
    font-size: clamp(42px, 11.5vw, 72px);
  }
  .brand-page .signature-composition {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .brand-page .signature-art {
    width: 100%;
    max-width: 460px;
    margin: -5px 0 -25px;
  }
  .brand-page .signature-copy {
    padding: 5px 0 35px;
    max-width: 100%;
  }
  .brand-page .signature-copy > p {
    font-size: 17px;
  }
  .brand-page .signature-copy > p:nth-child(2) {
    font-size: 25px;
  }
  .brand-page .tool-grid {
    gap: 37px;
  }
  .brand-page .tool-preview {
    height: 240px;
    padding: 30px 28px 24px;
  }
  .brand-page .tool-card h3 {
    font-size: 29px;
  }
  .brand-page .tool-card > p {
    font-size: 15px;
  }
  .brand-page .tool-card-top {
    margin-top: 22px;
  }
  .brand-page .tool-card-link {
    padding-top: 18px;
  }
  .brand-page .preview-arrival {
    grid-template-columns: 45px 1fr;
    gap: 17px;
  }
  .brand-page .preview-door {
    display: block;
  }
  .brand-page .preview-door .icon {
    width: 45px;
    height: 45px;
  }
  .brand-page .catalog-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .brand-page .catalog-grid .tool-preview {
    height: 260px;
    padding-inline: 30px;
  }
  .brand-page .catalog-grid .tool-card h3 {
    font-size: 31px;
  }
  .brand-page .catalog-hero > .container {
    grid-template-columns: 1fr;
    gap: 25px;
  }
  .brand-page .catalog-hero h1 {
    font-size: clamp(40px, 10vw, 56px);
  }
  .brand-page .catalog-seal {
    display: none;
  }
  .brand-page .catalog-intro {
    font-size: 14px;
    padding-left: 19px;
  }
  .brand-page .filter-bar {
    margin-block: 29px 35px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .brand-page .tool-card .tool-preview > :not(.preview-note),
  .brand-page .service-option summary > .icon {
    transition: none;
  }
}
.brand-page .brand-flow-hero-art svg {
  width: 116%;
  max-width: none;
  height: auto;
  margin-left: -8%;
}
.brand-page .brand-tools-workbench {
  position: relative;
  min-height: 510px;
  padding-top: 44px;
  perspective: 1000px;
}
.brand-page .brand-tools-workbench > span {
  display: block;
  margin-bottom: 30px;
  color: #a6b2b6;
  font-size: 11px;
}
.brand-page .brand-tools-workbench .tool-preview {
  width: 86%;
  height: 235px;
  transform: rotateY(-12deg) rotateZ(-5deg);
  box-shadow: 12px 18px 0 #101c2380;
  border: 1px solid #a9b9b7;
}
.brand-page .brand-tools-workbench .tool-preview + .tool-preview {
  position: relative;
  margin: -20px 0 0 12%;
  transform: rotateY(-12deg) rotateZ(4deg);
}
@media (max-width: 760px) {
  .brand-page .brand-flow-hero-art {
    max-width: 460px;
    margin: -25px auto -35px;
  }
  .brand-page .brand-flow-hero-art svg {
    width: 100%;
    margin-left: 0;
  }
  .brand-page .brand-tools-workbench {
    min-height: 430px;
    width: 100%;
    max-width: 470px;
    margin: 0 auto;
    padding-top: 20px;
  }
  .brand-page .brand-tools-workbench .tool-preview {
    height: 195px;
    padding: 23px;
  }
  .brand-page .brand-tools-workbench .preview-note {
    font-size: 9px;
  }
}

/* Without the controller, the native disclosures remain complete and the decorative state is omitted. */
.brand-page .service-explorer:not([data-service-enhanced]) {
  grid-template-columns: 1fr;
}
.brand-page
  .service-explorer:not([data-service-enhanced])
  .service-explorer-stage {
  display: none;
}