:root{
  /* Primary accent (replaces --_color---orange1) */
  --_color---orange1: #ffbc95; /* soft peach */

  /* Secondary accent (replaces --_color---blue) */
  --_color---blue: #2e54fe;   /* original blue */

  /* Text + neutrals */
  --_color---grey: #96908c;   /* warm grey */
  --_color---bg-warm: #faf6ef; /* original warm background */
  --_color---bg-grey: #f4f4f4; /* original grey background */
}

/* Some Webflow styles hardcode colors; provide common overrides */
.body{background-color: var(--_color---bg-warm) !important;}
.body.work{background-color: var(--_color---bg-grey) !important;}
.top-glow{box-shadow: inset 0 2px 30px #ffb286c4, inset 0 2px 130px 8px #ff72437d !important;}

/* Force loader intro background — Webflow IX2 applies inline orange without this */
.orange-intro{background-color: var(--_color---grey) !important;}

/* Typhoon project images — 3 across in one row, then 2 larger ones side by side.
   Six columns let row 1 hold three items (2 cols each) and row 2 hold two (3 cols each). */
#typhoon .cont-project-imgs {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: auto auto;
}

#typhoon .img-project {
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

#w-node-typhoon-cover, #w-node-typhoon-cover-fr,
#w-node-typhoon-1, #w-node-typhoon-1-fr,
#w-node-typhoon-2, #w-node-typhoon-2-fr {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-typhoon-3, #w-node-typhoon-3-fr,
#w-node-typhoon-4, #w-node-typhoon-4-fr {
  grid-area: span 1 / span 3 / span 1 / span 3;
}