/* TBG brand: Benison logos, colours and type over the Arqui9 layout */
/* Benison guideline tokens; Nimbus files are not in the kit, so the guideline fallbacks apply */
:root {
  --tbg-forest: #173B32;
  --tbg-limestone: #EFEBE1;
  --tbg-gold: #B9A47E;
  --tbg-paper: #F6F2EA;
  --tbg-serif: "Nimbus Roman", Georgia, "Times New Roman", serif;
  --tbg-sans: "Nimbus Sans", Arial, Helvetica, sans-serif;
}

/* Hero to introduction (tbg-intro.js) */
html.tbg-paper-page, html.tbg-paper-page body {background-color: var(--tbg-paper);}
.h_header_component {position: relative;}
.h_header_logo_wrap.tbg_hero_logo_under {position: absolute; z-index: 0; margin: 0; color: var(--tbg-forest); pointer-events: none;}
.tbg_hero_logo_under .h_header_logo_svg {opacity: 0.95;}
.h_header_heading, .h_header_button_wrap {transition: color 0.45s ease;}
.h_header_heading.is-tbg-paper, .h_header_button_wrap.is-tbg-paper {color: var(--tbg-forest);}
/* Hero details in Nimbus Sans: nav clock, menu button, tagline and Scroll down */
.nav_data_text, .nav_button_text, .h_header_heading, .h_header_button_wrap .btn_text_text {font-family: var(--tbg-sans); font-weight: 400;}
.nav_data_text {letter-spacing: 0.16em; font-variant-numeric: tabular-nums;}
/* Slightly larger; the negative margin keeps the tracked label flush with the right margin */
.nav_button_text {font-size: calc(var(--text-tiny--font-size) * 1.2); letter-spacing: 0.2em; margin-right: -0.2em;}
.h_header_heading {max-width: none; letter-spacing: 0.22em; line-height: 1.6;}
.h_header_button_wrap .btn_text_text {letter-spacing: 0.16em;}
.tbg_tagline_line {white-space: nowrap;}
@media (max-width: 767px) {
  .tbg_tagline_line {display: block;}
  /* Balances the tracking after each centred line's last letter */
  .h_header_heading {padding-left: 0.22em;}
}
/* Phones in landscape: the fixed gap above the wordmark pushed the tagline up under the nav */
@media (orientation: landscape) and (max-height: 520px) {
  .h_header_component.u-vflex-stretch-bottom {row-gap: 1.5rem;}
}
/* A longer sticky run gives the window and its photographs room to settle before "Who we are" */
.h_header_contain {min-height: 320svh;}
.h_header_height.u-sticky-height {height: 320svh;}
/* The settled film's caption, and the photographs that open alongside it */
.h_intro_item_text {font-family: var(--tbg-sans); color: var(--tbg-gold); letter-spacing: 0.22em; text-transform: uppercase;}
.tbg_intro_img {display: block; width: 100%; height: 100%; object-fit: cover;}

/* Who we are (tbg-about.js): editorial section on the hero's warm paper */
/* Starts under the last stretch of the hero's sticky run, below the pinned film card (which sits at
   the middle of the screen), so the heading rises while the film recedes instead of after it */
.tbg_about_section {position: relative; margin-top: -28svh; background-color: var(--tbg-paper); color: var(--tbg-forest); padding: clamp(3rem, 6vw, 5.5rem) 0 clamp(6rem, 10vw, 10rem);}
.tbg_about_head .g_subtitle_text {font-family: var(--tbg-sans); color: var(--tbg-gold); letter-spacing: 0.18em;}
.tbg_about_head .g_subtitle_dot {background-color: var(--tbg-gold);}
.tbg_about_heading {margin: clamp(1.75rem, 3vw, 2.75rem) 0 0; font-family: var(--tbg-serif); font-weight: 400; font-size: clamp(2.6rem, 5.6vw, 6.25rem); line-height: 1.04; letter-spacing: -0.02em;}
.tbg_about_heading_line {display: block;}
.tbg_about_heading_line.is-second {font-style: italic; color: rgba(23, 59, 50, 0.78);}
.tbg_about_body {display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1.25rem, 2.5vw, 2.5rem); margin-top: clamp(4rem, 8vw, 8rem);}
.tbg_about_text {grid-column: 1 / span 5; align-self: start; position: sticky; top: calc(var(--nav--height, 5rem) + 2.5rem);}
/* Times-style lining figures (Nimbus Roman, else Times New Roman); Georgia's old-style 4 drops below the line */
.tbg_about_stat {margin: 0;}
.tbg_about_figure {display: flex; align-items: flex-start; font-family: "Nimbus Roman", "Times New Roman", Times, serif; font-weight: 400; font-size: clamp(7rem, 13vw, 13.5rem); line-height: 0.82; letter-spacing: -0.04em; font-variant-numeric: lining-nums tabular-nums;}
.tbg_about_number {display: inline-block; min-width: 2ch; text-align: right;}
.tbg_about_plus {margin-left: 0.04em; font-size: 0.5em; line-height: 1; color: var(--tbg-gold);}
.tbg_about_rule {display: block; width: 100%; max-width: 22rem; height: 1px; margin: clamp(1.5rem, 2.5vw, 2.25rem) 0 1.1rem; background-color: var(--tbg-gold);}
.tbg_about_stat_label {display: block; max-width: 22rem; font-family: var(--tbg-sans); font-size: 0.875rem; line-height: 1.6; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(23, 59, 50, 0.72);}
.tbg_about_lead {margin: clamp(3rem, 5vw, 4.5rem) 0 0; max-width: 24ch; font-family: var(--tbg-serif); font-weight: 400; font-size: clamp(1.6rem, 2.2vw, 2.25rem); line-height: 1.2; letter-spacing: -0.01em;}
.tbg_about_copy {margin: 1.5rem 0 0; max-width: 34rem; font-family: var(--tbg-sans); font-size: clamp(1.1rem, 1.25vw, 1.3rem); line-height: 1.65; color: rgba(23, 59, 50, 0.82);}
.tbg_about_button {margin-top: clamp(2rem, 3.5vw, 3rem);}
.tbg_about_button .btn_text_wrap {color: var(--tbg-forest);}
.tbg_about_button .btn_text_text {font-family: var(--tbg-sans); letter-spacing: 0.06em;}
/* Staggered photographs; each sits in its own grid cell, so only the image inside its frame moves */
.tbg_about_gallery {grid-column: 7 / span 6; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1rem, 2vw, 2rem); row-gap: clamp(1rem, 2vw, 2rem); align-items: start;}
.tbg_about_photo {position: relative; margin: 0; overflow: hidden; background-color: var(--tbg-limestone);}
.tbg_about_photo.is-a {grid-column: 1; grid-row: 1; aspect-ratio: 4 / 5;}
.tbg_about_photo.is-b {grid-column: 2; grid-row: 1 / span 2; aspect-ratio: 3 / 4; margin-top: 42%;}
.tbg_about_photo.is-c {grid-column: 1; grid-row: 2; width: 82%; justify-self: end; aspect-ratio: 1 / 1;}
.tbg_about_frame {position: absolute; inset: 0; overflow: hidden;}
.tbg_about_frame .g_visual_wrap {position: absolute; top: 0; left: 0; width: 100%; height: 118%;}
.tbg_about_frame .g_visual_img {display: block; width: 100%; height: 100%; object-fit: cover;}
@media (max-width: 991px) {
  .tbg_about_body {display: block;}
  .tbg_about_text {position: static; max-width: 40rem;}
  .tbg_about_gallery {margin-top: clamp(3.5rem, 8vw, 5rem);}
}
@media (max-width: 767px) {
  .tbg_about_photo.is-b {grid-row: 1; margin-top: 38%;}
  .tbg_about_photo.is-c {grid-column: 1 / -1; grid-row: 2; width: 100%; aspect-ratio: 16 / 10;}
}

/* Nav over Benison paper (tbg-intro.js) */
.nav_component.is-tbg-paper {mix-blend-mode: normal; color: var(--tbg-forest);}

/* Our services (tbg-services.js) */
.tbg_services[data-theme] {background-color: var(--tbg-paper); color: var(--tbg-forest);}
.tbg_services .h_services_contain {padding-top: clamp(6rem, 12vw, 11rem); padding-bottom: clamp(5rem, 9vw, 8rem);}
.tbg_services .h_services_header_text {font-family: var(--tbg-sans); color: var(--tbg-forest);}
.tbg_services .h_services_header_wrap .g_subtitle_text {font-family: var(--tbg-sans); color: var(--tbg-gold); letter-spacing: 0.18em;}
.tbg_services_layout {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: clamp(2.5rem, 6vw, 7rem); align-items: start; margin-top: clamp(2rem, 5vw, 4.5rem);}
.tbg_services_media {position: sticky; top: max(calc(var(--nav--height, 5rem) + 2rem), calc(50vh - 15vw));}
.tbg_services_frame {position: relative; aspect-ratio: 4 / 3; overflow: hidden; background-color: var(--tbg-limestone);}
.tbg_services_visual {position: absolute; inset: 0;}
.tbg_services_img {display: block; width: 100%; height: 100%; object-fit: cover;}
.tbg_services_list {display: flex; flex-direction: column;}
.tbg_services_item .h_services_item {width: auto; min-height: max(32vh, 17rem); padding: 2.4rem 0 2.6rem;}
.tbg_services_index {margin-bottom: 1rem; font-family: var(--tbg-sans); font-size: 0.75rem; letter-spacing: 0.24em; color: var(--tbg-gold);}
.tbg_services .h_services_heading {font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.01em; color: var(--tbg-forest); font-size: clamp(2rem, 3.3vw, 3.4rem);}
.tbg_services .h_services_body_text {max-width: 30rem; font-family: var(--tbg-sans); font-size: 1.2rem; line-height: 1.5; color: rgba(23, 59, 50, 0.82);}
.tbg_services .h_services_line {background-color: rgba(185, 164, 126, 0.55);}
.tbg_services .h_services_button_wrap {max-width: none; padding-top: 3rem; text-align: right;}
.tbg_services .btn_text_wrap {color: var(--tbg-forest);}
.tbg_services .btn_text_text {font-family: var(--tbg-sans); letter-spacing: 0.06em;}
@media screen and (max-width: 767px) {
  .tbg_services_layout {grid-template-columns: minmax(0, 1fr); row-gap: 0.5rem;}
  .tbg_services_media {top: var(--nav--height, 4.5rem); z-index: 2; padding: 0.75rem 0 1rem; background-color: var(--tbg-paper);}
  .tbg_services_frame {aspect-ratio: 16 / 10;}
  .tbg_services_item .h_services_item {min-height: 38vh; padding: 1.8rem 0 2rem;}
  .tbg_services .h_services_body_text {font-size: 1.05rem;}
}

/* ===== Services journey ===== */
/* Shared label style on the Benison sections */
[data-tbg-tone] .g_subtitle_text {font-family: var(--tbg-sans); color: var(--tbg-gold); letter-spacing: 0.18em;}
[data-tbg-tone] .g_subtitle_dot {background-color: var(--tbg-gold);}

/* Overview: statement + three groups */
.tbg_overview_section {background-color: var(--tbg-paper); color: var(--tbg-forest); padding: clamp(7rem, 12vw, 11rem) 0 clamp(5rem, 9vw, 8rem);}
.tbg_overview_statement {max-width: 24ch; margin-top: 2.5rem; font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.01em; font-size: calc(var(--h3--font-size) * 0.85);}
.tbg_overview_groups {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 2.5vw, 2.5rem); margin-top: clamp(4rem, 8vw, 7rem);}
.tbg_group {display: block; padding-top: 1.25rem; border-top: 1px solid rgba(185, 164, 126, 0.6); color: inherit; text-decoration: none;}
.tbg_group_media {aspect-ratio: 4 / 3; overflow: hidden; margin-bottom: 1.5rem; background-color: var(--tbg-limestone);}
.tbg_group_img {display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);}
.tbg_group:hover .tbg_group_img {transform: scale(1.08);}
.tbg_group_index {font-family: var(--tbg-sans); font-size: 0.75rem; letter-spacing: 0.24em; color: var(--tbg-gold);}
.tbg_group_title {margin: 0.6rem 0 1rem; font-family: var(--tbg-serif); font-weight: 400; font-size: clamp(1.6rem, 2.2vw, 2.2rem); line-height: 1.1;}
.tbg_group_list {margin: 0; padding: 0; list-style: none; font-family: var(--tbg-sans); font-size: 1rem; line-height: 1.8; color: rgba(23, 59, 50, 0.78);}
@media screen and (max-width: 767px) {
  .tbg_overview_groups {grid-template-columns: minmax(0, 1fr); gap: 2.5rem;}
}

/* 01 Drive (impact section): limestone over the full-bleed images, forest once they settle into the card */
.impact_section[data-tbg-tone] {background-color: var(--tbg-paper); color: var(--tbg-forest);}
.impact_section .impact_main_body, .impact_section .impact_second_body {color: var(--tbg-limestone); transition: color 0.5s ease;}
.impact_section .impact_main_body.u-blend-exclusion, .impact_section .impact_second_body.u-blend-exclusion {mix-blend-mode: normal; color: var(--tbg-forest);}
.impact_heading {font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.015em; font-size: clamp(2.6rem, 4.6vw, 4.8rem); line-height: 1.02;}
.impact_second_text {font-family: var(--tbg-sans); line-height: 1.55;}

/* 02 Identity (who section) */
.who_section[data-tbg-tone] {background-color: var(--tbg-paper); color: var(--tbg-forest); padding-top: clamp(4rem, 8vw, 8rem); padding-bottom: clamp(5rem, 10vw, 10rem);}
.who_heading {font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.015em; font-size: calc(var(--h1--font-size) * 0.72); line-height: 1.08;}
.who_body_text {font-family: var(--tbg-sans); line-height: 1.55; color: rgba(23, 59, 50, 0.85);}
.tbg_tags {display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 2rem;}
.tbg_tags span {padding: 0.5rem 1.05rem; border: 1px solid rgba(185, 164, 126, 0.75); border-radius: 999px; font-family: var(--tbg-sans); font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tbg-forest);}
/* Brand materials above the body; the inner layer is taller so the parallax never shows an edge */
.tbg_identity_media {position: relative; aspect-ratio: 16 / 10; overflow: hidden; margin-bottom: clamp(2rem, 3.5vw, 3rem); background-color: var(--tbg-limestone);}
.tbg_identity_frame {overflow: hidden;}
.tbg_identity_frame .g_visual_wrap {height: 118%;}
.tbg_identity_frame .g_visual_img {width: 100%; height: 100%; object-fit: cover;}
/* Desktop: the headline starts level with the photograph instead of sinking to the column's foot */
@media (min-width: 992px) {
  .who_section[data-tbg-tone] .who_layout.u-grid-tablet {align-items: start; margin-top: clamp(3.5rem, 6vw, 6.5rem);}
}

/* 03–05 Digital (process sections): the forest accent of the page */
.process_intro_section[data-tbg-tone], .process_section[data-tbg-tone] {background-color: var(--tbg-forest); color: var(--tbg-limestone);}
.process_intro_heading {font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.01em;}
.process_contain.u-blend-exclusion {mix-blend-mode: normal;}
.process_section[data-tbg-tone] .process_component {background-color: var(--tbg-forest);}
/* One photograph per step, framed below the step text where the Lottie played (above the edge fade) */
.tbg_process_media {position: absolute; inset: 0; z-index: 1;}
.process_section[data-tbg-tone] .process_contain {z-index: 2;}
.tbg_process_frame {position: absolute; left: 0; right: 0; bottom: 7vh; margin: 0 auto; height: min(52vh, 30vw); width: calc(min(52vh, 30vw) * 1.6); overflow: hidden; background-color: #12302A;}
.tbg_process_visual {position: absolute; inset: 0;}
.tbg_process_img {display: block; width: 100%; height: 100%; object-fit: cover;}
/* Below desktop the step heading sits at the top and its text at the foot: the frame goes between */
@media screen and (max-width: 991px) {
  .tbg_process_frame {top: 27svh; bottom: auto; height: auto; width: min(calc(100% - 2 * var(--site--margin, 1rem)), calc(36svh * 4 / 3)); aspect-ratio: 4 / 3;}
}
.process_section[data-tbg-tone] .process_overlay.u-cover-absolute {background-image: linear-gradient(90deg, #173B32 5%, rgba(23, 59, 50, 0) 15% 85%, #173B32 95%), linear-gradient(#173B32 5%, rgba(23, 59, 50, 0) 15% 85%, #173B32 95%);}
.process_step_number {color: var(--tbg-gold);}
.process_step_heading {font-family: var(--tbg-serif); font-weight: 400; font-size: clamp(2rem, 3.2vw, 3.2rem); line-height: 1.05;}
.process_step_text {font-family: var(--tbg-sans); line-height: 1.55; color: rgba(239, 235, 225, 0.88);}

/* 06 Operations (sticky list) */
.tbg_ops_header {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: clamp(2.5rem, 6vw, 7rem); align-items: end;}
.tbg_ops_heading {margin-top: 1.5rem; font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.01em; color: var(--tbg-forest);}
.tbg_ops_text {max-width: 34rem; font-family: var(--tbg-sans); line-height: 1.55; color: rgba(23, 59, 50, 0.85);}
.tbg_ops .tbg_services_item .h_services_item {min-height: max(24vh, 12rem); padding: 2rem 0 2.2rem;}
.tbg_ops .h_services_heading {font-size: clamp(1.9rem, 3vw, 3rem);}
@media screen and (max-width: 767px) {
  .tbg_ops_header {grid-template-columns: minmax(0, 1fr); row-gap: 1.5rem;}
  .tbg_ops .tbg_services_item .h_services_item {min-height: 30vh;}
}

/* 07 Scale (results section): the city photograph inside a paper vignette (tbg-imagery.js moves it) */
.results_section[data-tbg-tone] {background-color: var(--tbg-paper); color: var(--tbg-forest);}
.results_section[data-tbg-tone] .results_component {background-color: var(--tbg-paper);}
.results_section .g_visual_video {z-index: 0; overflow: hidden;}
.tbg_scale_img {display: block; width: 100%; height: 100%; object-fit: cover;}
.results_section .results_overlay {z-index: 1;}
.results_section .results_container {position: relative; z-index: 3;}
/* The photograph dissolves into paper at its edges, most of all behind the copy on the left */
.results_section .results_overlay {background:
  linear-gradient(90deg, rgba(246, 242, 234, 0.92) 0%, rgba(246, 242, 234, 0.78) 30%, rgba(246, 242, 234, 0) 48%),
  linear-gradient(180deg, rgba(246, 242, 234, 0.95) 0%, rgba(246, 242, 234, 0) 34%, rgba(246, 242, 234, 0) 70%, rgba(246, 242, 234, 0.95) 100%),
  radial-gradient(ellipse 70% 60% at 55% 52%, rgba(246, 242, 234, 0) 35%, rgba(246, 242, 234, 0.9) 78%, #F6F2EA 100%);}
.results_heading {font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.01em; max-width: 20ch;}
.tbg_scale_text {max-width: 34rem; margin-top: 1.5rem; font-family: var(--tbg-sans); line-height: 1.55; color: rgba(23, 59, 50, 0.85);}
.tbg_pillars.results_stats_list {grid-template-columns: repeat(4, minmax(0, 1fr));}
.tbg_pillar {font-family: var(--tbg-serif); font-weight: 400;}
.results_stats_line {background-color: var(--tbg-gold);}
.results_stats_subtitle_icon {background-color: var(--tbg-gold);}
@media screen and (max-width: 767px) {
  .tbg_pillars.results_stats_list {grid-template-columns: repeat(2, minmax(0, 1fr));}
  /* The original hides this heading on mobile; the Scale statement needs to show */
  .results_section[data-tbg-tone] .results_heading {position: static; width: auto; height: auto; clip: auto; overflow: visible; margin-top: 1rem; font-size: calc(var(--h4--font-size) * 0.9);}
  .results_section[data-tbg-tone] .tbg_scale_text {margin-top: 1rem; font-size: 1rem;}
  .results_section .results_overlay {background:
    linear-gradient(180deg, #F6F2EA 0%, rgba(246, 242, 234, 0.92) 38%, rgba(246, 242, 234, 0) 52%, rgba(246, 242, 234, 0) 62%, rgba(246, 242, 234, 0.86) 78%, rgba(246, 242, 234, 0.95) 100%),
    radial-gradient(ellipse 80% 55% at 50% 60%, rgba(246, 242, 234, 0) 35%, rgba(246, 242, 234, 0.9) 80%, #F6F2EA 100%);}
}
.nav_component.is-tbg-forest {mix-blend-mode: normal; color: var(--tbg-limestone);}

/* ===== Menu ===== */
.nav_menu_fill {background-color: var(--tbg-forest);}
.nav_menu_wrapper {color: var(--tbg-limestone);}
/* Six entries plus the call to action fit the panel without wrapping */
.nav_menu_link_text {font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.01em; white-space: nowrap; font-size: clamp(2rem, 1.2rem + 1.9vw, 3.1rem);}
@media screen and (max-height: 760px) and (min-width: 768px) {
  .nav_menu_link_text {font-size: clamp(1.8rem, 5.2vh, 2.6rem);}
}
.tbg_menu_cta {display: inline-flex; align-items: center; gap: 0.9rem; padding: 1rem 1.6rem; border: 1px solid var(--tbg-gold); border-radius: 999px; background-color: var(--tbg-gold); color: var(--tbg-forest); font-family: var(--tbg-sans); font-size: 0.95rem; letter-spacing: 0.04em; text-decoration: none; transition: background-color 0.35s ease, color 0.35s ease;}
.tbg_menu_cta:hover, .tbg_menu_cta:focus-visible {background-color: transparent; color: var(--tbg-limestone);}
.tbg_menu_cta span {transition: transform 0.35s ease;}
.tbg_menu_cta:hover span {transform: translateX(4px);}

/* ===== Case studies (tbg-cases.js) ===== */
/* Limestone with forest text; data-tbg-tone="paper" turns the nav forest over it (tbg-nav.js) */
.cs_slider_section[data-tbg-tone] {background-color: var(--tbg-limestone); color: var(--tbg-forest);}
.cs_slider_section[data-tbg-tone] .g_subtitle_text {font-family: var(--tbg-sans); color: #8C7650; letter-spacing: 0.18em;}
.cs_slider_section[data-tbg-tone] .g_subtitle_dot {background-color: var(--tbg-gold);}
.cs_slider_section[data-tbg-tone] .swiper_cs_item_heading {font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.01em; color: var(--tbg-forest);}
.cs_slider_section[data-tbg-tone] .swiper_cs_item_subtitle {font-family: var(--tbg-sans); letter-spacing: 0.16em; text-transform: uppercase; color: rgba(23, 59, 50, 0.72);}
.cs_slider_section[data-tbg-tone] .btn_text_wrap {color: var(--tbg-forest);}
.cs_slider_section[data-tbg-tone] .btn_text_text {font-family: var(--tbg-sans); letter-spacing: 0.06em;}
.tbg_case_video {display: block; width: 100%; height: 100%; object-fit: cover; background-color: #0b0b0b;}
/* The title overlaps the foot of the frame (the slider's design); the recording fades into limestone there so the dark title stays legible */
.cs_slider_section[data-tbg-tone] .swiper_cs_visual_wrap:not(.tbg_case_placeholder)::after {content: ""; position: absolute; inset: 0; z-index: 1; background-image: linear-gradient(180deg, rgba(239, 235, 225, 0) 48%, rgba(239, 235, 225, 0.78) 80%, rgba(239, 235, 225, 0.97) 100%); pointer-events: none;}
/* Case Studies page (case-studies/index.html): the slider under a page title, clear of the nav */
.tbg_cs_page {min-height: 100svh;}
.tbg_cs_page .cs_slider_contain {padding-top: calc(var(--nav--height, 5rem) + clamp(2.5rem, 6vw, 5.5rem));}
.tbg_cs_page .cs_slider_header_wrap {align-items: flex-end; margin-bottom: clamp(1.5rem, 3vw, 2.5rem);}
.tbg_cs_page_heading {margin: 0; font-family: var(--tbg-serif); font-weight: 400; font-size: clamp(2.6rem, 5.6vw, 6.25rem); line-height: 1.04; letter-spacing: -0.02em; color: var(--tbg-forest);}
/* Smaller screens hide the header's button, so the title would otherwise sit at the far end */
@media (max-width: 991px) {
  .tbg_cs_page .cs_slider_header_wrap {justify-content: flex-start; align-items: flex-start;}
  .tbg_cs_page_heading {text-align: left;}
}
/* The slot for the next project */
.tbg_case_placeholder {background-color: var(--tbg-paper); outline: 1px solid rgba(185, 164, 126, 0.55); outline-offset: -1.25rem;}
.tbg_case_placeholder_inner {position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; text-align: center;}
.tbg_case_placeholder_number {font-family: "Nimbus Roman", "Times New Roman", Times, serif; font-size: clamp(4.5rem, 11vw, 11rem); line-height: 0.85; color: var(--tbg-gold); font-variant-numeric: lining-nums;}
.tbg_case_placeholder_rule {width: min(12rem, 40%); height: 1px; margin: clamp(1.25rem, 2.5vw, 2rem) 0; background-color: rgba(185, 164, 126, 0.6);}
.tbg_case_placeholder_label {font-family: var(--tbg-sans); font-size: 0.8rem; letter-spacing: 0.22em; text-transform: uppercase; color: rgba(23, 59, 50, 0.72);}

/* ===== Gold cursor (tbg-cursor.js; fine pointers without reduced motion only) ===== */
html.tbg-cursor-on, html.tbg-cursor-on * {cursor: none !important;}
html.tbg-cursor-on input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]), html.tbg-cursor-on textarea, html.tbg-cursor-on [contenteditable="true"] {cursor: text !important;}
.tbg_cursor_trail {position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 2147483000; pointer-events: none;}
.tbg_cursor {position: fixed; inset: 0; z-index: 2147483001; pointer-events: none; opacity: 0; transition: opacity 0.25s ease;}
.tbg-cursor-shown .tbg_cursor {opacity: 1;}
.tbg-cursor-text .tbg_cursor {opacity: 0;}
.tbg_cursor_dot, .tbg_cursor_ring {position: absolute; left: 0; top: 0; width: 0; height: 0;}
.tbg_cursor_dot {transform: translate3d(var(--x, -100px), var(--y, -100px), 0);}
.tbg_cursor_ring {transform: translate3d(var(--rx, -100px), var(--ry, -100px), 0);}
.tbg_cursor_dot i, .tbg_cursor_ring i {position: absolute; display: block; border-radius: 50%;}
/* Gold with a thin forest edge: the edge reads on paper, the gold on forest and film */
.tbg_cursor_dot i {left: -4px; top: -4px; width: 8px; height: 8px; background-color: #C2AA7C; box-shadow: 0 0 0 1px rgba(23, 59, 50, 0.5), 0 0 12px rgba(185, 164, 126, 0.45); transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);}
.tbg_cursor_ring i {left: -20px; top: -20px; width: 40px; height: 40px; border: 1px solid #C2AA7C; box-shadow: 0 0 0 1px rgba(23, 59, 50, 0.22), inset 0 0 0 1px rgba(23, 59, 50, 0.12); background-color: rgba(185, 164, 126, 0.1); opacity: 0; transform: scale(0.3); transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;}
.tbg-cursor-hover .tbg_cursor_ring i {opacity: 1; transform: scale(1);}
.tbg-cursor-hover .tbg_cursor_dot i {transform: scale(0.6);}
.tbg-cursor-press .tbg_cursor_ring i {transform: scale(0.82);}
.tbg-cursor-press .tbg_cursor_dot i {transform: scale(0.8);}
/* The site's labelled slider cursor ("visit", "next") in Benison gold */
.cursor_dot {background-color: var(--tbg-gold); color: var(--tbg-forest);}
.cursor_dot.cursor-inverted {filter: none;}

/* ===== Enquiry ===== */
.tbg_enquiry_section {background-color: var(--tbg-paper); color: var(--tbg-forest); padding: clamp(6rem, 11vw, 10rem) 0;}
.tbg_enquiry {display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: clamp(2.5rem, 6vw, 7rem); row-gap: 3rem; align-items: start;}
.tbg_enquiry_heading {margin-top: 1.5rem; font-family: var(--tbg-serif); font-weight: 400; letter-spacing: -0.015em; font-size: clamp(2.6rem, 5vw, 5rem); line-height: 1.02;}
.tbg_enquiry_text {max-width: 30rem; margin-top: 1.5rem; font-family: var(--tbg-sans); font-size: 1.15rem; line-height: 1.55; color: rgba(23, 59, 50, 0.85);}
.tbg_form {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem 2rem;}
.tbg_field {display: flex; flex-direction: column; gap: 0.55rem;}
.tbg_field_wide, .tbg_form_actions {grid-column: 1 / -1;}
.tbg_field label {font-family: var(--tbg-sans); font-size: 0.75rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tbg-gold);}
.tbg_field input, .tbg_field textarea {width: 100%; padding: 0.75rem 0; border: 0; border-bottom: 1px solid rgba(23, 59, 50, 0.35); border-radius: 0; background: transparent; color: var(--tbg-forest); font-family: var(--tbg-sans); font-size: 1.1rem; line-height: 1.5; outline: none; transition: border-color 0.3s ease;}
.tbg_field textarea {resize: vertical; min-height: 7.5rem;}
.tbg_field input:focus, .tbg_field textarea:focus {border-bottom-color: var(--tbg-forest);}
.tbg_form_actions {display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem 2rem; margin-top: 0.5rem;}
.tbg_button {display: inline-flex; align-items: center; gap: 0.9rem; padding: 1.05rem 1.8rem; border: 1px solid var(--tbg-forest); border-radius: 999px; background-color: var(--tbg-forest); color: var(--tbg-limestone); font-family: var(--tbg-sans); font-size: 1rem; letter-spacing: 0.04em; cursor: pointer; transition: background-color 0.35s ease, color 0.35s ease;}
.tbg_button:hover, .tbg_button:focus-visible {background-color: transparent; color: var(--tbg-forest);}
.tbg_button:disabled {opacity: 0.6; cursor: progress;}
.tbg_form_status {flex: 1 1 16rem; margin: 0; font-family: var(--tbg-sans); font-size: 0.95rem; line-height: 1.45; color: rgba(23, 59, 50, 0.85);}
.tbg_form_status[data-state="error"] {color: #8A3B2E;}
@media screen and (max-width: 767px) {
  .tbg_enquiry {grid-template-columns: minmax(0, 1fr);}
  .tbg_form {grid-template-columns: minmax(0, 1fr);}
  .tbg_field_wide, .tbg_form_actions {grid-column: auto;}
}

/* ===== Footer (tbg-footer-mark.js) ===== */
/* The footer opens straight onto the wordmark (no lead line or button above it) */
.tbg_footer {background-color: var(--tbg-forest); color: var(--tbg-limestone); padding-top: clamp(3rem, 6vw, 5rem); overflow: hidden;}
.tbg_footer_label {font-family: var(--tbg-sans); font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tbg-gold);}
/* Links: one horizontal row below the wordmark (each group's label leads its links; wraps when narrow) */
.tbg_footer_links {margin-top: clamp(1.5rem, 3vw, 2.5rem); padding-top: clamp(1.25rem, 2vw, 1.75rem); padding-bottom: clamp(1.25rem, 2vw, 1.75rem); border-top: 1px solid rgba(185, 164, 126, 0.35);}
.tbg_footer_nav {display: flex; flex-wrap: wrap; align-items: baseline; column-gap: clamp(2rem, 4vw, 4rem); row-gap: 1rem;}
.tbg_footer_col {display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 1.25rem; row-gap: 0.5rem;}
.tbg_footer_list {display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 1.5rem; row-gap: 0.4rem; margin: 0; padding: 0; list-style: none;}
.tbg_footer_list li {margin: 0;}
.tbg_footer_links .tbg_footer_link {display: inline-block; padding: 0.3rem 0; font-size: 0.95rem;}
.tbg_footer_link {color: rgba(239, 235, 225, 0.86); font-family: var(--tbg-sans); font-size: 1rem; text-decoration: none; background-image: linear-gradient(currentColor, currentColor); background-size: 0% 1px; background-position: 0 100%; background-repeat: no-repeat; transition: background-size 0.4s ease, color 0.3s ease;}
.tbg_footer_link:hover, .tbg_footer_link:focus-visible {color: var(--tbg-limestone); background-size: 100% 1px;}
/* The wordmark spans the full width, edge to edge within the site margin */
.tbg_footer_word_wrap {margin-top: 0;}
.tbg_footer_word svg {display: block; width: 100%; height: auto; overflow: hidden;}
.tbg_footer_bottom {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding-top: clamp(1.5rem, 2.5vw, 2.25rem); padding-bottom: clamp(1.5rem, 2.5vw, 2.25rem); border-top: 1px solid rgba(185, 164, 126, 0.35); font-family: var(--tbg-sans); font-size: 0.85rem; color: rgba(239, 235, 225, 0.7);}
@media screen and (max-width: 767px) {
  .tbg_footer_word_wrap {padding-left: 0.75rem; padding-right: 0.75rem;}
  /* Each group on its own line: label above, links wrapping beside each other with room to tap */
  .tbg_footer_nav {flex-direction: column; row-gap: 1.25rem;}
  .tbg_footer_col {flex-direction: column; align-items: flex-start; row-gap: 0.5rem;}
  .tbg_footer_list {column-gap: 1.25rem; row-gap: 0.1rem;}
  .tbg_footer_links .tbg_footer_link {padding: 0.6rem 0; font-size: 1rem;}
}