/* BUILD 1.7.0 — 2026-09-28 · Techno Bonyan Widgets for Elementor */
/* =====================================================================
   TECHNO BONYAN — widgets.css
   Prefix: tbn · RTL Arabic · Ayman-DS base layer + components.
   Colours are sampled from the official logo (see DESIGN-DIRECTION.md).
   ===================================================================== */

/* ---------------------------------------------------------------------
   0. TOKENS
   --------------------------------------------------------------------- */
:root {
	/* brand (logo) */
	--tbn-navy:          #1B2B38;
	--tbn-ink:           #0F1A23;
	--tbn-ink-2:         #142330;
	--tbn-copper:        #B78463;
	--tbn-copper-light:  #D8A382;
	--tbn-copper-deep:   #8A5A3B;
	--tbn-paper:         #F4F2EE;

	/* supporting tones (tokenised so no raw hex lives in components) */
	--tbn-white:            #FFFFFF;
	--tbn-cream:            #F4EFE8;
	--tbn-cream-2:          #F8F3EC;
	--tbn-ivory:            #F6F1EA;
	--tbn-on-dark:          #C9D1D8;
	--tbn-on-dark-bright:   #E3E8EC;
	--tbn-on-dark-soft:     #AEB9C2;
	--tbn-on-dark-dim:      #93A0AB;
	--tbn-slate:            #5A6771;
	--tbn-navy-soft:        #22384A;
	--tbn-card-dark:        #172735;
	--tbn-bead-light:       #C8936F;
	--tbn-bead-mid:         #A56D4A;
	--tbn-bead-dark:        #7E4F33;
	--tbn-whatsapp:         #25D366;
	--tbn-success:          #1E7A4A;
	--tbn-success-light:    #7FD3A5;
	--tbn-danger:           #D9534F;
	--tbn-danger-deep:      #B8423E;
	/* surfaces (light default — .tbn-dark re-points these) */
	--tbn-bg:          var(--tbn-paper);
	--tbn-bg-deep:     #ECE7E0;
	--tbn-fg:          #15222D;
	--tbn-card:        #FFFFFF;
	--tbn-card-fg:     #15222D;
	--tbn-muted:       #EAE5DD;
	--tbn-muted-fg:    #52606B;
	--tbn-border:      #DDD5CA;
	--tbn-eyebrow:     var(--tbn-copper-deep);

	/* brand roles */
	--tbn-primary:     var(--tbn-navy);
	--tbn-primary-fg:  #F6F1EA;
	--tbn-primary-glow:#2A4152;
	--tbn-accent:      var(--tbn-copper);
	--tbn-accent-fg:   #FFFFFF;

	/* type */
	--tbn-font:         "IBM Plex Sans Arabic", system-ui, "Segoe UI", Tahoma, sans-serif;
	--tbn-font-display: "Alexandria", "IBM Plex Sans Arabic", system-ui, sans-serif;
	--tbn-font-latin:   "Playfair Display", Georgia, "Times New Roman", serif;

	/* geometry */
	--tbn-radius:      0.875rem;
	--tbn-radius-lg:   1.5rem;
	--tbn-max:         80rem;
	--tbn-max-narrow:  64rem;
	--tbn-pad:         1rem;
	--tbn-pad-lg:      2rem;
	--tbn-header-h:    5.5rem;

	/* elevation */
	--tbn-shadow-sm:   0 1px 3px rgba(15,26,35,.08);
	--tbn-shadow-md:   0 6px 18px -8px rgba(15,26,35,.22);
	--tbn-shadow-card: 0 18px 40px -22px rgba(15,26,35,.35);
	--tbn-shadow-glow: 0 0 0 1px rgba(216,163,130,.25), 0 22px 50px -18px rgba(183,132,99,.45);

	/* gradients */
	--tbn-gradient-primary: linear-gradient(135deg, #A8714E 0%, #85563A 100%);
	--tbn-gradient-accent:  linear-gradient(135deg, #D8A382 0%, #B78463 45%, #8A5A3B 100%);
	--tbn-gradient-ink:     linear-gradient(160deg, #1B2B38 0%, #0F1A23 70%);
	--tbn-gradient-text:    linear-gradient(180deg, #E2B394 0%, #B78463 55%, #8A5A3B 100%);

	/* signature shapes */
	--tbn-arch: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 125' preserveAspectRatio='none'%3E%3Cpath d='M0 125V40C0 24 34 15 50 0C66 15 100 24 100 40V125Z'/%3E%3C/svg%3E");
	--tbn-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

	--tbn-transition:  all .3s cubic-bezier(.4, 0, .2, 1);
	--tbn-ease-out:    cubic-bezier(.2, .8, .2, 1);
}

/* Dark band — re-points the surface tokens for everything inside. */
.tbn-dark {
	--tbn-bg:        #0F1A23;
	--tbn-bg-deep:   #142330;
	--tbn-fg:        #F4EFE8;
	--tbn-card:      #172735;
	--tbn-card-fg:   #F4EFE8;
	--tbn-muted:     #1C2F3E;
	--tbn-muted-fg:  #A9B5BF;
	--tbn-border:    rgba(244,239,232,.13);
	--tbn-eyebrow:   #D8A382;
	--tbn-shadow-card: 0 22px 48px -24px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.05);
	color: var(--tbn-fg);
}

/* ---------------------------------------------------------------------
   1. HORIZONTAL-SCROLL DEFENSE
   --------------------------------------------------------------------- */
[class^="tbn-"], [class*=" tbn-"],
[class^="tbn-"] *, [class*=" tbn-"] *,
[class^="tbn-"] *::before, [class*=" tbn-"] *::before,
[class^="tbn-"] *::after,  [class*=" tbn-"] *::after { box-sizing: border-box; }

.tbn-section, .tbn-hero, .tbn-page-hero, .tbn-header, .tbn-footer,
.tbn-cta-banner, .tbn-contact, .tbn-marquee {
	max-width: 100%;
	overflow-x: hidden;
	overflow-x: clip;
}

/* Page-level guard: nothing (theme, Elementor, fixed FAB, animations) may
   widen the page on mobile. clip (not hidden) keeps position:sticky working. */
html { overflow-x: hidden; }
@supports (overflow-x: clip) { html, body { overflow-x: clip; } }
html, body { max-width: 100%; }

[class^="tbn-"][class*="-grid"] > *,
[class^="tbn-"][class*="-row"]  > *,
.tbn-form-row > *, .tbn-form-field { min-width: 0; max-width: 100%; }

[class^="tbn-"] img,    [class*=" tbn-"] img,
[class^="tbn-"] svg,    [class*=" tbn-"] svg,
[class^="tbn-"] video,  [class*=" tbn-"] video,
[class^="tbn-"] iframe, [class*=" tbn-"] iframe { max-width: 100%; }
[class^="tbn-"] img, [class^="tbn-"] iframe { height: auto; }

[class^="tbn-"] input, [class^="tbn-"] textarea,
[class^="tbn-"] select, [class^="tbn-"] button { max-width: 100%; }
[class^="tbn-"] input[type="text"],  [class^="tbn-"] input[type="email"],
[class^="tbn-"] input[type="tel"],   [class^="tbn-"] input[type="number"],
[class^="tbn-"] textarea, [class^="tbn-"] select { width: 100%; }

[class^="tbn-"] p, [class^="tbn-"] a, [class^="tbn-"] span,
[class^="tbn-"] li, [class^="tbn-"] dd { overflow-wrap: anywhere; word-break: break-word; }

.tbn-honeypot {
	position: absolute !important; left: -10000px !important;
	width: 1px !important; height: 1px !important; overflow: hidden !important;
}

/* ---------------------------------------------------------------------
   2. TYPOGRAPHY BASELINE
   --------------------------------------------------------------------- */
[class^="tbn-"], [class*=" tbn-"] { font-family: var(--tbn-font); }

[class^="tbn-"] h1, [class^="tbn-"] h2,
[class^="tbn-"] h3, [class^="tbn-"] h4,
[class^="tbn-"][class*="-title"],
[class^="tbn-"][class*="-headline"] {
	font-family: var(--tbn-font-display);
	font-weight: 700;
	line-height: 1.3;
	margin: 0;
}

/* The display face is reserved for h1/h2; smaller headings use the body
   family at 700 for legibility. */
[class^="tbn-"] h3, [class^="tbn-"] h4,
[class^="tbn-"] h3[class], [class^="tbn-"] h4[class],
h3[class^="tbn-"][class*="-title"], h4[class^="tbn-"][class*="-title"],
.tbn-feature-title.tbn-feature-title, .tbn-footer-heading.tbn-footer-heading {
	font-family: var(--tbn-font);
	line-height: 1.5;
}

[class^="tbn-"] p, [class^="tbn-"] li,
[class^="tbn-"][class*="-desc"] { line-height: 1.75; }

body.rtl      [class^="tbn-"] p, body.rtl      [class^="tbn-"] li,
html[lang^="ar"] [class^="tbn-"] p, html[lang^="ar"] [class^="tbn-"] li,
body.rtl      [class^="tbn-"][class*="-desc"],
html[lang^="ar"] [class^="tbn-"][class*="-desc"] { line-height: 1.9; }

/* Scoped to plugin markup only (a bare [dir] selector would also hit <html>). */
.tbn-ltr, [class*="tbn-"][dir="ltr"], [class*="tbn-"] [dir="ltr"] { direction: ltr; unicode-bidi: embed; }
.tbn-ltr { display: inline-block; }

/* ---------------------------------------------------------------------
   3. LAYOUT PRIMITIVES
   --------------------------------------------------------------------- */
.tbn-container {
	width: 100%;
	max-width: var(--tbn-max);
	margin-inline: auto;
	padding-inline: var(--tbn-pad);
}
.tbn-container-narrow { max-width: var(--tbn-max-narrow); }
@media (min-width: 768px) { .tbn-container { padding-inline: var(--tbn-pad-lg); } }

.tbn-section { position: relative; padding-block: 4rem; background: var(--tbn-bg); color: var(--tbn-fg); }
@media (min-width: 768px) { .tbn-section { padding-block: 6rem; } }
.tbn-section.tbn-deep { background: var(--tbn-bg-deep); }

.tbn-section, .tbn-header, .tbn-footer, .tbn-hero, .tbn-page-hero {
	direction: rtl;
	text-align: right;
}

.tbn-grid { display: grid; gap: 2rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) {
	.tbn-cols-2, .tbn-cols-3, .tbn-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
	.tbn-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.tbn-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---------------------------------------------------------------------
   4. SECTION-HEAD RHYTHM (single-sourced)
   --------------------------------------------------------------------- */
.tbn-section-head.tbn-section-head { margin-bottom: 3rem; }
.tbn-section-head.tbn-section-head .tbn-eyebrow {
	display: inline-flex; align-items: center; gap: 0.75rem;
	margin: 0 0 0.75rem;
	font-family: var(--tbn-font-latin);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--tbn-eyebrow);
	direction: ltr;
}
.tbn-section-head.tbn-section-head .tbn-eyebrow::before,
.tbn-section-head.tbn-section-head .tbn-eyebrow::after {
	content: ""; width: 1.5rem; height: 1px; background: currentColor; opacity: .7;
}
.tbn-section-head.tbn-section-head .tbn-section-title { margin: 0 0 1rem; font-size: 1.875rem; color: var(--tbn-fg); }
@media (min-width: 768px) { .tbn-section-head.tbn-section-head .tbn-section-title { font-size: 2.5rem; } }
.tbn-section-head.tbn-section-head .tbn-head-rule {
	display: block; width: 4.5rem; height: 3px;
	margin: 0 auto 1.25rem; border-radius: 999px;
	background: var(--tbn-gradient-accent);
	transform-origin: right center;
}
.tbn-section-head.tbn-section-head .tbn-section-desc {
	margin: 0 auto; max-width: 40rem; color: var(--tbn-muted-fg); font-size: 1.0625rem;
}
.tbn-align-center { text-align: center; }
.tbn-align-center h1, .tbn-align-center h2, .tbn-align-center h3,
.tbn-align-center p { text-align: center; }
.tbn-align-start { text-align: right; }
.tbn-align-start .tbn-head-rule { margin-inline: 0 !important; }
.tbn-align-start .tbn-section-desc { margin-inline: 0 !important; }

/* Editorial head: title block inline-start, description inline-end. */
.tbn-head-split { display: grid; gap: 1.5rem; align-items: end; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) { .tbn-head-split { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); } }
.tbn-head-split .tbn-section-title { margin-bottom: 1rem !important; }
.tbn-head-split .tbn-head-rule { margin: 0 !important; }
.tbn-head-split .tbn-head-side { display: flex; flex-direction: column; gap: 1.5rem; align-items: flex-start; }
.tbn-head-split .tbn-section-desc { margin: 0 !important; }

/* Signature keyframe: the copper rule draws in when the head reveals. */
@keyframes tbn-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.tbn-reveal .tbn-head-rule { transform: scaleX(0); }
.tbn-reveal.is-visible .tbn-head-rule { animation: tbn-draw .9s var(--tbn-ease-out) .25s both; }

/* ---------------------------------------------------------------------
   5. ICON CONTAINER — size and layout only (colour per component)
   --------------------------------------------------------------------- */
[class^="tbn-"][class*="-icon"],
[class*=" tbn-"][class*="-icon"] {
	display: inline-flex; align-items: center; justify-content: center;
	flex-shrink: 0; line-height: 1;
}
[class^="tbn-"][class*="-icon"] svg,
[class*=" tbn-"][class*="-icon"] svg {
	width: 1.5rem; height: 1.5rem; display: block;
	color: inherit; fill: none; stroke: currentColor;
	stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}

/* Copper bead — the 3D copper sphere used across the company profile. */
.tbn-bead, .tbn-gcard-zoom {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; line-height: 1;
}
.tbn-bead svg, .tbn-gcard-zoom svg {
	display: block; fill: none; stroke: currentColor;
	stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
.tbn-bead {
	width: 3.5rem; height: 3.5rem;
	border-radius: 50%;
	color: var(--tbn-white);
	background:
		radial-gradient(circle at 32% 28%, rgba(255,236,220,.85) 0%, rgba(255,236,220,0) 38%),
		radial-gradient(circle at 50% 50%, var(--tbn-bead-light) 0%, var(--tbn-bead-mid) 62%, var(--tbn-bead-dark) 100%);
	box-shadow: 0 10px 22px -8px rgba(126,79,51,.65), inset 0 -3px 6px rgba(70,40,22,.35);
	transition: var(--tbn-transition);
}
.tbn-bead svg { width: 1.35rem !important; height: 1.35rem !important; }
.tbn-bead-sm { width: 2.75rem; height: 2.75rem; }
.tbn-bead-sm svg { width: 1.1rem !important; height: 1.1rem !important; }
.tbn-bead-lg { width: 4.5rem; height: 4.5rem; }
.tbn-bead-lg svg { width: 1.75rem !important; height: 1.75rem !important; }

/* ---------------------------------------------------------------------
   6. BUTTON SYSTEM
   --------------------------------------------------------------------- */
.tbn-btn {
	position: relative; overflow: hidden;
	display: inline-flex; align-items: center; justify-content: center; gap: 0.75rem;
	font-family: var(--tbn-font); font-weight: 600; font-size: 1rem; line-height: 1.2;
	padding: 0.5rem 1.5rem 0.5rem 0.5rem;
	min-height: 3.25rem;
	border-radius: 9999px;
	border: 0; cursor: pointer; text-decoration: none; white-space: nowrap;
	transition: var(--tbn-transition);
}
.tbn-btn:not(:has(.tbn-btn-arrow)) { padding: 0.85rem 1.75rem; }
.tbn-btn-arrow {
	width: 2.25rem; height: 2.25rem; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.tbn-btn-arrow svg { width: 1.1rem; height: 1.1rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tbn-btn:hover .tbn-btn-arrow { transform: translateX(-4px); }
.tbn-btn-download:hover .tbn-btn-arrow { transform: translateY(2px); }

a.tbn-btn.tbn-btn-primary, a.tbn-btn.tbn-btn-primary:link,
a.tbn-btn.tbn-btn-primary:visited, button.tbn-btn.tbn-btn-primary,
.tbn-btn.tbn-btn-primary[class] {
	background: var(--tbn-gradient-primary) !important;
	color: var(--tbn-white) !important;
	text-decoration: none !important;
	box-shadow: 0 10px 24px -12px rgba(138,90,59,.8);
}
a.tbn-btn.tbn-btn-primary:hover, button.tbn-btn.tbn-btn-primary:hover,
.tbn-btn.tbn-btn-primary[class]:hover {
	color: var(--tbn-white) !important;
	transform: translateY(-2px);
	box-shadow: var(--tbn-shadow-glow);
}
.tbn-btn.tbn-btn-primary * { color: var(--tbn-white) !important; }
.tbn-btn.tbn-btn-primary .tbn-btn-arrow { background: rgba(255,255,255,.18); }

a.tbn-btn.tbn-btn-outline, button.tbn-btn.tbn-btn-outline,
.tbn-btn.tbn-btn-outline[class] {
	background: transparent !important;
	color: var(--tbn-fg) !important;
	border: 1px solid var(--tbn-border) !important;
}
.tbn-btn.tbn-btn-outline .tbn-btn-arrow { background: var(--tbn-muted); color: var(--tbn-eyebrow); }
a.tbn-btn.tbn-btn-outline:hover, .tbn-btn.tbn-btn-outline[class]:hover {
	border-color: var(--tbn-copper) !important;
	color: var(--tbn-eyebrow) !important;
}
a.tbn-btn.tbn-btn-light, .tbn-btn.tbn-btn-light[class] {
	background: var(--tbn-ivory) !important; color: var(--tbn-navy) !important;
}
.tbn-btn.tbn-btn-light .tbn-btn-arrow { background: var(--tbn-navy); color: var(--tbn-ivory); }
a.tbn-btn.tbn-btn-light:hover, .tbn-btn.tbn-btn-light[class]:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -14px rgba(0,0,0,.6); }
.tbn-btn-block { width: 100%; }

/* Text link with arrow */
.tbn-link {
	display: inline-flex; align-items: center; gap: .5rem;
	font-weight: 600; font-size: .9375rem; color: var(--tbn-eyebrow);
	transition: var(--tbn-transition);
}
.tbn-link svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s; }
.tbn-link:hover svg { transform: translateX(-4px); }

/* ---------------------------------------------------------------------
   7. CARD
   --------------------------------------------------------------------- */
.tbn-card {
	position: relative;
	display: flex; flex-direction: column; gap: 1rem;
	padding: 1.75rem;
	border-radius: var(--tbn-radius-lg);
	border: 1px solid var(--tbn-border);
	background: var(--tbn-card);
	color: var(--tbn-card-fg);
	box-shadow: var(--tbn-shadow-card);
	transition: var(--tbn-transition);
	height: 100%;
}
.tbn-card:hover { transform: translateY(-6px); box-shadow: var(--tbn-shadow-glow); }
.tbn-card-title { font-size: 1.25rem; font-weight: 700; margin: 0; color: var(--tbn-card-fg); }
.tbn-card-desc  { color: var(--tbn-muted-fg); margin: 0; }

/* Signature 1 — SOCKET NOTCH.
   A concave bite in one corner; the bead sits in the socket as a sibling
   (never a child of the masked surface). RTL site: "start" = right. */
.tbn-notch {
	--tbn-nr: 2.35rem;          /* socket radius */
	--tbn-nx: 2rem;             /* centre offset from the side */
	--tbn-ny: 2rem;             /* centre offset from top/bottom */
	-webkit-mask: radial-gradient(circle var(--tbn-nr) at var(--tbn-npx) var(--tbn-npy), #0000 calc(100% - .5px), #000 100%);
	        mask: radial-gradient(circle var(--tbn-nr) at var(--tbn-npx) var(--tbn-npy), #0000 calc(100% - .5px), #000 100%);
}
.tbn-notch--ts { --tbn-npx: calc(100% - var(--tbn-nx)); --tbn-npy: var(--tbn-ny); }        /* top-start */
.tbn-notch--te { --tbn-npx: var(--tbn-nx);              --tbn-npy: var(--tbn-ny); }        /* top-end */
.tbn-notch--bs { --tbn-npx: calc(100% - var(--tbn-nx)); --tbn-npy: calc(100% - var(--tbn-ny)); }
.tbn-notch--be { --tbn-npx: var(--tbn-nx);              --tbn-npy: calc(100% - var(--tbn-ny)); }
.tbn-socket { position: absolute; z-index: 2; }
.tbn-socket--ts { top: calc(2rem - 1.75rem); right: calc(2rem - 1.75rem); }
.tbn-socket--te { top: calc(2rem - 1.75rem); left: calc(2rem - 1.75rem); }
/* top-centre socket (values): bead sunk into the middle of the top edge */
.tbn-notch--tc { --tbn-npx: 50%; --tbn-npy: var(--tbn-ny); }
.tbn-socket--tc { top: calc(var(--tbn-sy, 1.5rem) - 2.25rem); left: 50%; margin-left: -2.25rem; }

/* Signature 2 — ARCH FRAME (the logo's pointed-arch silhouette). */
.tbn-arch {
	position: relative;
	aspect-ratio: 4 / 5;
	isolation: isolate;
}
.tbn-arch-img {
	position: absolute; inset: 0;
	-webkit-mask: var(--tbn-arch) center / 100% 100% no-repeat;
	        mask: var(--tbn-arch) center / 100% 100% no-repeat;
	overflow: hidden;
	background: var(--tbn-muted);
}
.tbn-arch-img img { width: 100%; height: 100% !important; object-fit: cover; display: block; transition: transform 1.2s var(--tbn-ease-out); }
.tbn-arch:hover .tbn-arch-img img { transform: scale(1.04); }
.tbn-arch-line {
	position: absolute; z-index: -1;
	inset: -1rem 1rem 1rem -1rem;
	width: 100%; height: 100%;
	pointer-events: none;
	color: var(--tbn-copper);
}
.tbn-arch-line path { fill: none; stroke: currentColor; stroke-width: 1.25; vector-effect: non-scaling-stroke; }

/* ---------------------------------------------------------------------
   8. FORM
   --------------------------------------------------------------------- */
.tbn-form-row { display: grid; gap: 0 1.25rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .tbn-form-row { grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
.tbn-form-field { margin-bottom: 1.25rem; }
.tbn-form-field label {
	display: block; margin-bottom: 0.5rem;
	font-size: 0.875rem; font-weight: 600;
	color: var(--tbn-fg);
}
.tbn-req { color: var(--tbn-copper); }
.tbn-form-field input, .tbn-form-field textarea, .tbn-form-field select {
	width: 100%; max-width: 100%;
	padding: 0.85rem 1.1rem;
	border: 1px solid var(--tbn-border);
	border-radius: var(--tbn-radius);
	background: var(--tbn-card);
	color: var(--tbn-fg);
	font: inherit; font-size: 0.9375rem;
	text-align: right;
	transition: border-color .3s, box-shadow .3s;
}
.tbn-form-field input::placeholder, .tbn-form-field textarea::placeholder { color: var(--tbn-muted-fg); opacity: .8; }
.tbn-form-field textarea { min-height: 8.5rem; resize: vertical; }
.tbn-form-field :is(input, textarea, select):focus {
	outline: 0; border-color: var(--tbn-copper); box-shadow: 0 0 0 3px rgba(183,132,99,.2);
}
.tbn-form-field input[type="tel"] { direction: ltr; text-align: right; }
.tbn-form-field select {
	-webkit-appearance: none; appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B78463' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: left 1rem center; background-size: 1.1rem;
	padding-left: 2.75rem;
}
.tbn-dark .tbn-form-field select { color-scheme: dark; background-color: var(--tbn-card-dark); }
/* Searchable dropdown (long lists): looks like the other fields, list scrolls inside. */
.tbn-combo { position: relative; }
.tbn-combo-native { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; opacity: 0; pointer-events: none; }
.tbn-form-field .tbn-combo-btn {
	display: block; width: 100%; max-width: 100%;
	padding: 0.85rem 1.1rem; padding-left: 2.75rem;
	border: 1px solid var(--tbn-border); border-radius: var(--tbn-radius);
	background: var(--tbn-card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B78463' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat left 1rem center / 1.1rem;
	color: var(--tbn-fg); font: inherit; font-size: 0.9375rem; line-height: 1.5; text-align: right;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer;
	transition: border-color .3s, box-shadow .3s;
}
.tbn-dark .tbn-form-field .tbn-combo-btn { background-color: var(--tbn-card-dark); }
.tbn-form-field .tbn-combo-btn.is-placeholder { color: var(--tbn-muted-fg); }
.tbn-form-field .tbn-combo-btn:focus-visible, .tbn-combo.is-open .tbn-combo-btn { outline: 0; border-color: var(--tbn-copper); box-shadow: 0 0 0 3px rgba(183,132,99,.2); }
.tbn-form-field.is-invalid .tbn-combo-btn { border-color: var(--tbn-danger); }
.tbn-combo-panel {
	display: none; position: absolute; z-index: 30; inset-inline: 0; top: calc(100% + .4rem);
	padding: .5rem; border: 1px solid var(--tbn-border); border-radius: var(--tbn-radius);
	background: var(--tbn-card); box-shadow: 0 18px 40px -18px rgba(15,26,35,.45);
}
.tbn-dark .tbn-combo-panel { background: var(--tbn-card-dark); }
.tbn-combo.is-open .tbn-combo-panel { display: block; }
.tbn-form-field .tbn-combo-search { padding: .6rem .85rem; margin-bottom: .4rem; font-size: .875rem; }
.tbn-combo-list { list-style: none; margin: 0; padding: 0; max-height: 15rem; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--tbn-copper) transparent; }
.tbn-combo-group {
	position: sticky; top: 0; z-index: 1;
	padding: .45rem .6rem .3rem; font-size: .75rem; font-weight: 700; color: var(--tbn-copper);
	background: var(--tbn-card);
}
.tbn-dark .tbn-combo-group { background: var(--tbn-card-dark); }
.tbn-combo-opt { padding: .5rem .85rem; border-radius: .6rem; font-size: .9rem; color: var(--tbn-fg); cursor: pointer; }
.tbn-combo-opt:hover, .tbn-combo-opt:focus { outline: 0; background: rgba(183,132,99,.14); }
.tbn-combo-opt.is-selected { background: rgba(183,132,99,.22); font-weight: 600; }
.tbn-combo-opt[hidden], .tbn-combo-group[hidden] { display: none; }
body.tbn-dir-ltr .tbn-form-field .tbn-combo-btn { text-align: left; padding-left: 1.1rem; padding-right: 2.75rem; background-position: right 1rem center; }
.tbn-form-field.is-invalid :is(input, textarea, select) { border-color: var(--tbn-danger); }
.tbn-field-error { display: none; margin-top: .4rem; font-size: .8125rem; color: var(--tbn-danger); }
.tbn-form-field.is-invalid .tbn-field-error { display: block; }
.tbn-form-notice { display: none; margin-top: 1rem; padding: 0.9rem 1.1rem; border-radius: var(--tbn-radius); font-size: 0.9375rem; }
.tbn-form-notice.is-ok   { display: block; background: rgba(34,139,84,.12); color: var(--tbn-success); }
.tbn-form-notice.is-err  { display: block; background: rgba(217,83,79,.12); color: var(--tbn-danger-deep); }
.tbn-dark .tbn-form-notice.is-ok { color: var(--tbn-success-light); }
.tbn-contact, .tbn-contact * { min-width: 0; }
.tbn-contact { overflow-x: clip; }

/* ---------------------------------------------------------------------
   9. MOTION
   --------------------------------------------------------------------- */
@keyframes tbn-fade-up   { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes tbn-fade-in   { from { opacity: 0; } to { opacity: 1; } }
@keyframes tbn-slide-l   { from { opacity: 0; transform: translateX(-60px); } to { opacity: 1; transform: none; } }
@keyframes tbn-slide-r   { from { opacity: 0; transform: translateX(60px); }  to { opacity: 1; transform: none; } }
@keyframes tbn-float     { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes tbn-marquee   { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.tbn-anim-fade  { animation: tbn-fade-up .8s var(--tbn-ease-out) both; animation-delay: calc(var(--i, 0) * 90ms); }
.tbn-anim-left  { animation: tbn-slide-l .9s var(--tbn-ease-out) both; animation-delay: calc(var(--i, 0) * 90ms); }
.tbn-anim-right { animation: tbn-slide-r .9s var(--tbn-ease-out) both; animation-delay: calc(var(--i, 0) * 90ms); }
.tbn-anim-float { animation: tbn-float 5s ease-in-out infinite; }

.tbn-reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s var(--tbn-ease-out); transition-delay: calc(var(--i, 0) * 80ms); }
.tbn-reveal.is-visible { opacity: 1; transform: none; }
html:not(.tbn-js) .tbn-reveal { opacity: 1; transform: none; }
html:not(.tbn-js) .tbn-reveal .tbn-head-rule { transform: none; }

.elementor-editor-active [class*="tbn-anim-"],
.elementor-editor-active .tbn-reveal,
.elementor-editor-active .tbn-head-rule,
body.elementor-editor-preview [class*="tbn-anim-"],
body.elementor-editor-preview .tbn-reveal,
body.elementor-editor-preview .tbn-head-rule {
	opacity: 1 !important; transform: none !important; animation: none !important;
}
@media (prefers-reduced-motion: reduce) {
	[class*="tbn-anim-"], .tbn-reveal, .tbn-head-rule, .tbn-marquee-track {
		opacity: 1 !important; transform: none !important; animation: none !important; transition: none !important;
	}
}

/* ---------------------------------------------------------------------
   10. MOBILE PERFORMANCE BUDGET
   --------------------------------------------------------------------- */
@media (max-width: 767px) {
	[class^="tbn-"] { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
	.tbn-anim-float { animation: none !important; }
	.tbn-card { box-shadow: 0 4px 12px -6px rgba(0,0,0,.25) !important; }
}

/* ---------------------------------------------------------------------
   11. WORDPRESS/ELEMENTOR NEUTRALISATION
   --------------------------------------------------------------------- */
.elementor-widget-container > [class^="tbn-"] { width: 100%; }
[class^="tbn-"] a { text-decoration: none; color: inherit; }
[class^="tbn-"] ul, [class^="tbn-"] ol { list-style: none; margin: 0; padding: 0; }
[class^="tbn-"] p { margin: 0; }
[class^="tbn-"] figure { margin: 0; }

/* ---------------------------------------------------------------------
   12. IMAGE SLOTS
   --------------------------------------------------------------------- */
.tbn-media { position: relative; overflow: hidden; border-radius: var(--tbn-radius-lg); background: var(--tbn-muted); }
.tbn-media img { width: 100%; height: 100% !important; object-fit: cover; display: block; transition: transform .9s var(--tbn-ease-out); }
.tbn-media:hover img { transform: scale(1.05); }

/* =====================================================================
   COMPONENTS
   ===================================================================== */

/* ---------------------------------------------------------------------
   13. GLOBAL CANVAS + ATMOSPHERE
   --------------------------------------------------------------------- */
html { scroll-behavior: smooth; scroll-padding-top: 6rem; }
html, body { background-color: var(--tbn-paper); color: var(--tbn-fg); margin: 0; }
body { font-family: var(--tbn-font); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body.tbn-menu-open { overflow: hidden; }

/* Blueprint grid on dark bands — the engineering atmosphere. */
.tbn-blueprint::before {
	content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
	background-image:
		linear-gradient(rgba(216,163,130,.06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(216,163,130,.06) 1px, transparent 1px);
	background-size: 64px 64px;
	-webkit-mask-image: radial-gradient(ellipse at 50% 30%, #000 0%, transparent 75%);
	        mask-image: radial-gradient(ellipse at 50% 30%, #000 0%, transparent 75%);
}
.tbn-glow { overflow: hidden; overflow: clip; }
.tbn-glow::after {
	content: ""; position: absolute; pointer-events: none; z-index: 0;
	width: 42rem; height: 42rem; border-radius: 50%;
	inset-inline-end: -14rem; top: -12rem;
	background: radial-gradient(circle, rgba(183,132,99,.22) 0%, rgba(183,132,99,0) 65%);
}
.tbn-blueprint > .tbn-container, .tbn-glow > .tbn-container { position: relative; z-index: 1; }
.tbn-grain { position: relative; }
.tbn-grain > .tbn-grain-layer {
	position: absolute; inset: 0; pointer-events: none; z-index: 0;
	opacity: .05; mix-blend-mode: overlay; background-image: var(--tbn-grain);
}

/* Skip link */
.tbn-skip {
	position: absolute; top: -100px; right: 1rem; z-index: 200;
	background: var(--tbn-copper); color: var(--tbn-white); padding: .6rem 1rem; border-radius: .5rem;
}
.tbn-skip:focus { top: 1rem; }
[class^="tbn-"] a:focus-visible, [class^="tbn-"] button:focus-visible {
	outline: 2px solid var(--tbn-copper-light); outline-offset: 3px;
}

/* ---------------------------------------------------------------------
   14. HEADER — two pills + hanging logo tab (from the Figma header)
   --------------------------------------------------------------------- */
.tbn-header {
	position: fixed; inset: 0 0 auto 0; z-index: 100;
	padding-top: 1rem;
	color: var(--tbn-cream);
	transition: background-color .35s ease, box-shadow .35s ease, padding .35s ease;
	overflow: visible;
}
.tbn-header.is-scrolled {
	padding-top: 0;
	background: rgba(15,26,35,.94);
	box-shadow: 0 10px 30px -18px rgba(0,0,0,.8);
}
.tbn-header-inner {
	display: grid; align-items: start;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 1rem;
}
.tbn-header-pill {
	display: none;
	align-items: center;
	min-height: 3.5rem;
	margin-top: .5rem;
	padding-inline: 1.5rem;
	border: 1px solid rgba(216,163,130,.28);
	border-radius: 999px;
	background: rgba(20,35,48,.55);
}
.tbn-header.is-scrolled .tbn-header-pill { background: transparent; border-color: transparent; }

.tbn-logo {
	display: inline-flex; align-items: center; gap: .75rem;
	color: var(--tbn-cream);
	padding: .5rem 0;
}
.tbn-logo img { width: 3rem; height: auto; display: block; }
.tbn-logo-text { display: flex; flex-direction: column; line-height: 1.15; }
.tbn-logo-ar { font-family: var(--tbn-font-display); font-weight: 700; font-size: 1.3rem; }
.tbn-logo-en { font-family: var(--tbn-font-latin); font-size: .6875rem; letter-spacing: .18em; text-transform: uppercase; color: var(--tbn-copper-light); direction: ltr; }

.tbn-nav { gap: .25rem; justify-content: space-between; }
.tbn-nav-link {
	position: relative;
	white-space: nowrap;
	padding: .5rem .75rem;
	font-size: .9375rem; font-weight: 500;
	color: rgba(244,239,232,.82);
	transition: color .3s;
}
.tbn-nav-link::after {
	content: ""; position: absolute; right: .75rem; left: .75rem; bottom: .15rem; height: 2px;
	border-radius: 2px; background: var(--tbn-copper);
	transform: scaleX(0); transform-origin: right; transition: transform .35s var(--tbn-ease-out);
}
.tbn-nav-link:hover, .tbn-nav-link.is-active { color: var(--tbn-white); }
.tbn-nav-link:hover::after, .tbn-nav-link.is-active::after { transform: scaleX(1); }

.tbn-header-tools { justify-content: space-between; gap: 1rem; padding-inline: 1.25rem .4rem; }
.tbn-header-phone { display: inline-flex; align-items: center; gap: .6rem; font-weight: 600; font-size: .9375rem; color: var(--tbn-cream); }
.tbn-header-phone-icon { width: 2.25rem; height: 2.25rem; border-radius: 50%; border: 1px solid rgba(216,163,130,.4); color: var(--tbn-copper-light); }
.tbn-header-phone-icon svg { width: 1rem !important; height: 1rem !important; }
.tbn-header-cta.tbn-btn { min-height: 2.75rem; padding-block: .35rem; font-size: .9375rem; }
.tbn-header-cta .tbn-btn-arrow { width: 2rem; height: 2rem; }

.tbn-burger {
	display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
	width: 3rem; height: 3rem; margin-top: .25rem;
	border-radius: 50%; border: 1px solid rgba(216,163,130,.4);
	background: rgba(20,35,48,.6); cursor: pointer; padding: 0 .85rem;
}
.tbn-burger span { display: block; height: 2px; border-radius: 2px; background: var(--tbn-cream); transition: transform .3s, opacity .3s; }
.tbn-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.tbn-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.tbn-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (min-width: 1280px) {
	/* Wider header container (header only — sections keep --tbn-max). */
	.tbn-header .tbn-container { max-width: 90rem; }
	/* The hanging logo tab keeps its name on one line. */
	.tbn-header .tbn-logo, .tbn-header .tbn-logo-ar, .tbn-header .tbn-logo-en { white-space: nowrap; }
	/* Side columns never shrink below their content, so no label wraps. */
	/* Pills sized to their content and centred as one group around the logo
	   tab — no stretched pills with empty space inside. */
	.tbn-header-inner { grid-template-columns: max-content auto max-content; justify-content: center; gap: 1.25rem; }
	.tbn-nav { gap: .35rem; justify-content: flex-start; }
	.tbn-header-pill { display: flex; }
	.tbn-burger { display: none; }
	.tbn-header .tbn-logo {
		order: 0;
		flex-direction: column; gap: .35rem;
		padding: .75rem 1.5rem 1rem;
		border-radius: 0 0 1.75rem 1.75rem;
		background: var(--tbn-ink);
		border: 1px solid rgba(216,163,130,.28); border-top: 0;
		margin-top: -1rem;
		box-shadow: 0 16px 30px -18px rgba(0,0,0,.7);
	}
	.tbn-header.is-scrolled .tbn-logo { margin-top: 0; padding: .45rem 1.25rem .55rem; gap: .2rem; box-shadow: none; border-color: transparent; background: transparent; }
	.tbn-header.is-scrolled .tbn-logo img { width: 2.1rem; }
	.tbn-header.is-scrolled .tbn-logo-en { display: none; }
	.tbn-header.is-scrolled .tbn-header-pill { margin-top: .35rem; }
	.tbn-header .tbn-logo img { width: 2.75rem; }
	.tbn-header .tbn-logo-text { align-items: center; }
	.tbn-header .tbn-logo-ar { font-size: 1.05rem; }
	.tbn-header .tbn-logo-en { font-size: .5625rem; }
	.tbn-header-inner > .tbn-nav { order: -1; }
}

/* Mobile menu */
.tbn-mobile-menu {
	position: fixed; inset: 0; z-index: 99;
	padding: 6.5rem 1.5rem 2rem;
	background: var(--tbn-ink);
	background-image: radial-gradient(circle at 100% 0%, rgba(183,132,99,.25), transparent 55%);
	color: var(--tbn-cream);
	display: flex; flex-direction: column; gap: 2rem;
	overflow-y: auto;
	direction: rtl; text-align: right;
	opacity: 0; visibility: hidden; transform: translateY(-12px);
	transition: opacity .35s ease, transform .35s var(--tbn-ease-out), visibility 0s linear .35s;
}
.tbn-mobile-menu.is-open { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.tbn-mobile-nav { display: flex; flex-direction: column; }
.tbn-mobile-link {
	display: flex; align-items: center; justify-content: space-between;
	padding: 1rem 0; border-bottom: 1px solid rgba(244,239,232,.1);
	font-family: var(--tbn-font); font-size: 1.375rem; font-weight: 700; color: var(--tbn-cream);
}
.tbn-mobile-link span.tbn-mobile-num { font-family: var(--tbn-font-latin); font-size: .875rem; color: var(--tbn-copper-light); }
.tbn-mobile-link.is-active { color: var(--tbn-copper-light); }
.tbn-mobile-contact { display: grid; gap: .75rem; margin-top: auto; }
.tbn-mobile-contact a { display: flex; align-items: center; gap: .75rem; color: var(--tbn-cream); font-weight: 500; }
.tbn-mobile-contact .tbn-mc-icon { width: 2.5rem; height: 2.5rem; border-radius: 50%; border: 1px solid rgba(216,163,130,.35); color: var(--tbn-copper-light); }
.tbn-mobile-contact .tbn-mc-icon svg { width: 1.1rem !important; height: 1.1rem !important; }
@media (min-width: 1280px) { .tbn-mobile-menu { display: none; } }
/* WPML language switcher inside the header menu: one line, flag aligned. */
.tbn-nav-link .wpml-ls-flag, .tbn-mobile-link .wpml-ls-flag,
.tbn-dropdown .wpml-ls-flag { width: 18px !important; height: auto !important; vertical-align: middle; margin-inline-end: .35rem; display: inline-block; }
.tbn-nav-link > span, .tbn-dropdown a > span { display: inline; white-space: nowrap; }
.tbn-nav-link .wpml-ls-display { opacity: .75; }
.tbn-mobile-label { white-space: nowrap; }
.tbn-mobile-label .wpml-ls-display { opacity: .75; }
/* WPML flags — compact group after the menu links, divider on the inline-start. */
.tbn-nav-langs {
	display: inline-flex; align-items: center; gap: .25rem;
	margin-inline-start: .4rem; padding-inline-start: .7rem;
	border-inline-start: 1px solid rgba(216,163,130,.28);
}
.tbn-lang {
	display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
	min-width: 2rem; height: 2rem; padding: 0 .35rem; border-radius: 999px;
	font-size: .8125rem; font-weight: 500; color: rgba(244,239,232,.82); white-space: nowrap;
	opacity: .6; transition: opacity .25s ease, background-color .25s ease, box-shadow .25s ease;
}
.tbn-lang:hover, .tbn-lang:focus-visible { opacity: 1; background: rgba(216,163,130,.12); }
.tbn-lang.is-current { opacity: 1; box-shadow: inset 0 0 0 1px rgba(216,163,130,.55); }
.tbn-lang img, .tbn-lang .wpml-ls-flag {
	width: 20px !important; height: 14px !important; max-width: none; object-fit: cover;
	margin: 0 !important; display: block; border-radius: 3px;
	box-shadow: 0 0 0 1px rgba(255,255,255,.18);
}
.tbn-lang::after { display: none !important; }
.tbn-mobile-langs { display: flex; gap: .5rem; padding-top: 1.25rem; }
.tbn-mobile-langs .tbn-lang { min-width: 2.75rem; height: 2.5rem; }
.tbn-mobile-langs .tbn-lang img, .tbn-mobile-langs .tbn-lang .wpml-ls-flag { width: 24px !important; height: 17px !important; }
.tbn-dropdown a { white-space: nowrap; }
/* 1280–1439px: slightly tighter links so both pills fit on one line. */
@media (min-width: 1280px) and (max-width: 1439px) {
	.tbn-header .tbn-container { padding-inline: 1.25rem; }
	.tbn-header-inner { gap: .75rem; }
	.tbn-header-pill { padding-inline: 1rem; }
	.tbn-nav { gap: 0; }
	.tbn-nav-link { padding-inline: .55rem; font-size: .875rem; }
	.tbn-nav-link::after { right: .55rem; left: .55rem; }
	.tbn-header-tools { gap: .75rem; padding-inline: 1rem .4rem; }
	.tbn-header-phone { font-size: .875rem; }
	.tbn-header-cta.tbn-btn { font-size: .875rem; }
}

/* ---------------------------------------------------------------------
   15. HERO (home) — split, arch-framed villa
   --------------------------------------------------------------------- */
.tbn-hero {
	position: relative;
	background: var(--tbn-gradient-ink);
	color: var(--tbn-cream);
	padding-block: 8.5rem 4rem;
	min-height: 100svh;
	display: flex; align-items: center;
}
@media (min-width: 768px) { .tbn-hero { padding-block: 10rem 6rem; } }
.tbn-hero-grid {
	display: grid; gap: 3.5rem; align-items: center;
	grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 1024px) { .tbn-hero-grid { grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: 4rem; } }
.tbn-hero-body { display: flex; flex-direction: column; align-items: flex-start; }
.tbn-hero-badge {
	display: inline-flex; align-items: center; gap: .6rem;
	padding: .4rem 1rem .4rem .4rem;
	border: 1px solid rgba(216,163,130,.3);
	border-radius: 999px;
	background: rgba(27,43,56,.6);
	font-size: .875rem; color: var(--tbn-cream);
	margin-bottom: 1.5rem;
}
/* Company name — "written" in on load (right-to-left wipe with a copper pen
   line), then erased gradually on scroll (JS sets --p 0→1). Arabic stays one
   connected run of text: only the visible area is clipped, never split. */
.tbn-hero-brand {
	--p: 0;
	position: relative; display: inline-flex; flex-direction: column; align-items: flex-start; gap: .7rem;
	margin-bottom: 2rem;
	opacity: calc(1 - var(--p) * .55);
}
.tbn-hero-brand-name {
	position: relative; margin: 0 !important;
	font-family: var(--tbn-font-display); font-weight: 800;
	font-size: 1.75rem; line-height: 1.4 !important; color: var(--tbn-cream-2);
	/* scroll erase: the end of the line (left in RTL) disappears first */
	clip-path: inset(-.4em 0 -.4em calc(var(--p) * 100%));
}
@media (min-width: 768px) { .tbn-hero-brand-name { font-size: 2rem; } }
@media (min-width: 1280px) { .tbn-hero-brand-name { font-size: 2.2rem; white-space: nowrap; } }
.tbn-hero-brand-ink {
	display: inline-block;
	clip-path: inset(-.4em 0 -.4em 100%);
	animation: tbn-brand-write 1.7s cubic-bezier(.65,.05,.25,1) .35s forwards;
}
.tbn-hero-brand-accent {
	background: linear-gradient(100deg, #8A5A3B 0%, #B78463 30%, #F3D2B8 46%, #B78463 62%, #D8A382 100%);
	background-size: 250% 100%; background-position: 100% 0;
	-webkit-background-clip: text; background-clip: text; color: transparent;
	padding-bottom: .08em;
	animation: tbn-brand-shine 2.2s ease-in-out 2.1s 1 forwards;
}
.tbn-hero-brand-pen {
	position: absolute; top: .12em; bottom: .12em; right: 0; width: 2px; border-radius: 2px;
	background: #F3D2B8; box-shadow: 0 0 12px 2px rgba(216,163,130,.75);
	opacity: 0; pointer-events: none;
	animation: tbn-brand-pen 1.7s cubic-bezier(.65,.05,.25,1) .35s forwards;
}
.tbn-hero-brand-rule {
	display: block; height: 2px; width: 7rem; border-radius: 2px;
	background: var(--tbn-gradient-accent); transform-origin: right center;
	transform: scaleX(calc(1 - var(--p)));
	clip-path: inset(0 0 0 100%);
	animation: tbn-brand-rule .9s var(--tbn-ease-out) 1.9s forwards;
}
@keyframes tbn-brand-write { to { clip-path: inset(-.4em 0 -.4em 0); } }
@keyframes tbn-brand-pen { 0% { right: 0; opacity: 0; } 8% { opacity: 1; } 88% { opacity: 1; } 100% { right: 100%; opacity: 0; } }
@keyframes tbn-brand-rule { to { clip-path: inset(0 0 0 0); } }
@keyframes tbn-brand-shine { from { background-position: 100% 0; } to { background-position: 0 0; } }
body.tbn-dir-ltr .tbn-hero-brand-name { clip-path: inset(-.4em calc(var(--p) * 100%) -.4em 0); }
body.tbn-dir-ltr .tbn-hero-brand-ink { clip-path: inset(-.4em 100% -.4em 0); }
body.tbn-dir-ltr .tbn-hero-brand-pen { right: auto; left: 0; animation-name: tbn-brand-pen-ltr; }
body.tbn-dir-ltr .tbn-hero-brand-rule { transform-origin: left center; clip-path: inset(0 100% 0 0); }
@keyframes tbn-brand-pen-ltr { 0% { left: 0; opacity: 0; } 8% { opacity: 1; } 88% { opacity: 1; } 100% { left: 100%; opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
	.tbn-hero-brand-ink, .tbn-hero-brand-rule { animation: none !important; clip-path: none !important; }
	.tbn-hero-brand-pen { display: none; }
	.tbn-hero-brand-accent { animation: none; }
}
.elementor-editor-active .tbn-hero-brand, .elementor-editor-preview .tbn-hero-brand { --p: 0 !important; }
.elementor-editor-active .tbn-hero-brand-ink, .elementor-editor-preview .tbn-hero-brand-ink,
.elementor-editor-active .tbn-hero-brand-rule, .elementor-editor-preview .tbn-hero-brand-rule { animation: none !important; clip-path: none !important; }
.elementor-editor-active .tbn-hero-brand-pen, .elementor-editor-preview .tbn-hero-brand-pen { display: none; }
.tbn-hero-badge-icon { width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--tbn-gradient-primary); color: var(--tbn-white); }
.tbn-hero-badge-icon svg { width: .95rem !important; height: .95rem !important; stroke-width: 2.2 !important; }
.tbn-hero-title {
	font-size: 2.5rem;
	line-height: 1.25 !important;
	color: var(--tbn-cream-2);
	margin-bottom: 1.5rem !important;
}
@media (min-width: 768px) { .tbn-hero-title { font-size: 3.5rem; } }
@media (min-width: 1280px) { .tbn-hero-title { font-size: 4rem; } }
.tbn-hero-title .tbn-hl {
	background: var(--tbn-gradient-text);
	-webkit-background-clip: text; background-clip: text;
	color: transparent;
	padding-bottom: .1em;
}
.tbn-hero-sub { font-size: 1.125rem; color: var(--tbn-on-dark); max-width: 34rem; margin-bottom: 2rem !important; }
.tbn-hero-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 3rem; }
.tbn-dark .tbn-btn.tbn-btn-outline[class] { border-color: rgba(244,239,232,.25) !important; }
.tbn-dark .tbn-btn-outline .tbn-btn-arrow { background: rgba(244,239,232,.1); color: var(--tbn-copper-light); }
.tbn-hero-stats {
	display: flex; flex-wrap: wrap; gap: 1.5rem 2.5rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(244,239,232,.12);
	width: 100%;
}
.tbn-hero-stat { display: flex; align-items: center; gap: 1rem; }
.tbn-ring {
	--p: 70;
	width: 4.5rem; height: 4.5rem; border-radius: 50%;
	display: grid; place-items: center;
	background: conic-gradient(var(--tbn-copper) calc(var(--p) * 1%), rgba(244,239,232,.12) 0);
	position: relative; flex-shrink: 0;
}
.tbn-ring::before { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: var(--tbn-ink-2); }
.tbn-ring-num { position: relative; font-family: var(--tbn-font-latin); font-size: 1.35rem; font-weight: 600; color: var(--tbn-cream-2); direction: ltr; }
.tbn-hero-stat-label { font-size: .9375rem; color: var(--tbn-on-dark); line-height: 1.6; max-width: 12rem; }
.tbn-hero-stat-label strong { display: block; color: var(--tbn-cream-2); font-weight: 600; }

.tbn-hero-visual { position: relative; width: 100%; max-width: 30rem; margin-inline: auto; padding: 1rem 1rem 0 0; }
@media (min-width: 1024px) { .tbn-hero-visual { margin-inline: auto 0; } }
.tbn-hero-visual .tbn-arch-img::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(15,26,35,0) 55%, rgba(15,26,35,.55) 100%);
}
.tbn-hero-float {
	position: absolute; z-index: 3;
	bottom: 2rem; right: -1rem;
	display: flex; align-items: center; gap: .85rem;
	padding: .85rem 1.1rem .85rem 1.4rem;
	border-radius: 1.25rem;
	background: rgba(248,243,236,.97);
	color: var(--tbn-navy);
	box-shadow: 0 24px 50px -20px rgba(0,0,0,.7);
	max-width: 17rem;
}
.tbn-hero-float p { font-size: .875rem; line-height: 1.55 !important; font-weight: 600; }
.tbn-hero-float small { display: block; font-weight: 400; color: var(--tbn-slate); font-size: .75rem; }
@media (min-width: 1024px) { .tbn-hero-float { right: -3rem; } }
.tbn-hero-coords {
	position: absolute; z-index: 3; top: 30%; left: -.5rem;
	writing-mode: vertical-rl; transform: rotate(180deg);
	font-family: var(--tbn-font-latin); font-size: .6875rem; letter-spacing: .3em; text-transform: uppercase;
	color: rgba(216,163,130,.75);
}
@media (max-width: 639px) { .tbn-hero-coords { display: none; } .tbn-hero-float { right: 0; bottom: 1rem; } }

/* ---------------------------------------------------------------------
   16. FEATURE CARDS (home) — notched, one highlighted
   --------------------------------------------------------------------- */
.tbn-features { padding-block: 0 4rem; }
@media (min-width: 768px) { .tbn-features { padding-block: 0 6rem; } }
.tbn-features-grid { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); margin-top: -2rem; position: relative; z-index: 2; }
@media (min-width: 768px) { .tbn-features-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tbn-feature { position: relative; }
.tbn-feature-surface {
	height: 100%;
	padding: 2rem 1.75rem 1.75rem;
	padding-top: 5rem;
	border-radius: var(--tbn-radius-lg);
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	transition: var(--tbn-transition);
}
.tbn-feature:hover .tbn-feature-surface { border-color: rgba(216,163,130,.5); transform: translateY(-4px); }
.tbn-feature:hover .tbn-socket { transform: translateY(-4px) rotate(-8deg); }
.tbn-feature.is-featured .tbn-feature-surface {
	background: linear-gradient(160deg, var(--tbn-navy-soft) 0%, var(--tbn-card-dark) 100%);
	border-color: rgba(216,163,130,.55);
	box-shadow: var(--tbn-shadow-glow);
}
.tbn-feature-title { font-size: 1.25rem; margin-bottom: .6rem !important; color: var(--tbn-fg); }
.tbn-feature-desc { color: var(--tbn-muted-fg); font-size: .9375rem; }
.tbn-feature-num {
	position: absolute; top: 1.35rem; left: 1.5rem;
	font-family: var(--tbn-font-latin); font-size: 2.75rem; line-height: 1; font-weight: 600;
	color: transparent; -webkit-text-stroke: 1px rgba(216,163,130,.35);
	direction: ltr;
}

/* ---------------------------------------------------------------------
   17. MARQUEE — the 26 services as a moving strip
   --------------------------------------------------------------------- */
.tbn-marquee {
	position: relative;
	padding-block: 1.35rem;
	background: var(--tbn-gradient-primary);
	color: var(--tbn-white);
	direction: ltr;
	overflow: hidden;
}
.tbn-marquee-track { display: flex; width: max-content; animation: tbn-marquee 70s linear infinite; }
.tbn-marquee:hover .tbn-marquee-track { animation-play-state: paused; }
.tbn-marquee-group { display: flex; flex-shrink: 0; direction: rtl; }
.tbn-marquee-item {
	flex: 0 0 auto;
	display: inline-flex; align-items: center; gap: 1.5rem;
	margin-inline: 1rem;
	font-family: var(--tbn-font); font-size: 1.0625rem; font-weight: 600; white-space: nowrap;
}
.tbn-marquee-item::after {
	content: ""; width: .55rem; height: .55rem; transform: rotate(45deg);
	background: rgba(255,255,255,.75); flex-shrink: 0;
}

/* ---------------------------------------------------------------------
   18. ABOUT SPLIT (home + about)
   --------------------------------------------------------------------- */
.tbn-about-grid { display: grid; gap: 3.5rem; align-items: center; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) { .tbn-about-grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 5rem; } }
.tbn-about-visual { position: relative; max-width: 28rem; width: 100%; margin-inline: auto; padding: 1rem 0 0 1rem; }
.tbn-about-visual .tbn-arch-line { inset: 0 -1rem -1rem 1rem; }
.tbn-about-badge {
	position: absolute; z-index: 3; left: -.5rem; bottom: 2.5rem;
	width: 9.5rem; padding: 1.25rem 1rem;
	border-radius: 1.25rem;
	background: var(--tbn-gradient-primary);
	color: var(--tbn-white); text-align: center;
	box-shadow: 0 24px 40px -18px rgba(138,90,59,.8);
}
.tbn-about-badge-num { display: block; font-family: var(--tbn-font-latin); font-size: 3rem; line-height: 1; font-weight: 600; direction: ltr; }
.tbn-about-badge-label { display: block; margin-top: .5rem; font-size: .875rem; line-height: 1.5; }
@media (min-width: 1024px) { .tbn-about-badge { left: -2.5rem; } }
.tbn-about-lead { font-size: 1.0625rem; color: var(--tbn-muted-fg); margin-bottom: 2rem !important; }
.tbn-about-box {
	display: flex; align-items: center; gap: 1rem;
	padding: 1rem 1.25rem;
	border-radius: 1.25rem;
	border: 1px solid rgba(183,132,99,.45);
	background: var(--tbn-card);
	margin-bottom: 2rem;
}
.tbn-about-box-title { font-size: 1.125rem; color: var(--tbn-fg); margin-bottom: .2rem !important; }
.tbn-about-box p { font-size: .9375rem; color: var(--tbn-muted-fg); line-height: 1.7 !important; }
.tbn-checks { display: grid; gap: .9rem 1.5rem; grid-template-columns: minmax(0, 1fr); margin-bottom: 2.5rem !important; }
@media (min-width: 640px) { .tbn-checks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tbn-checks li { display: flex; align-items: flex-start; gap: .75rem; font-size: .9375rem; color: var(--tbn-fg); line-height: 1.7 !important; }
.tbn-check-icon { width: 1.5rem; height: 1.5rem; margin-top: .2rem; border-radius: 50%; background: rgba(183,132,99,.16); color: var(--tbn-eyebrow); }
.tbn-check-icon svg { width: .85rem !important; height: .85rem !important; stroke-width: 2.6 !important; }

/* ---------------------------------------------------------------------
   19. SERVICE CARDS — image with socket notch + body panel
   --------------------------------------------------------------------- */
.tbn-svc-grid { display: grid; gap: 1.75rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .tbn-svc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .tbn-svc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tbn-svc-card { position: relative; display: flex; flex-direction: column; height: 100%; }
.tbn-svc-media {
	--tbn-nr: 2.4rem; --tbn-nx: 2.1rem; --tbn-ny: 0rem;
	position: relative; aspect-ratio: 16 / 11; overflow: hidden;
	border-radius: var(--tbn-radius-lg) var(--tbn-radius-lg) 0 0;
	background: var(--tbn-muted);
}
.tbn-svc-media img { width: 100%; height: 100% !important; object-fit: cover; display: block; transition: transform .9s var(--tbn-ease-out); }
.tbn-svc-card:hover .tbn-svc-media img { transform: scale(1.06); }
.tbn-svc-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,26,35,0) 50%, rgba(15,26,35,.45) 100%); }
.tbn-svc-body {
	--tbn-nr: 2.4rem; --tbn-nx: 2.1rem; --tbn-ny: 0rem;
	flex: 1;
	display: flex; flex-direction: column; gap: .75rem;
	padding: 2.25rem 1.75rem 1.75rem;
	border-radius: 0 0 var(--tbn-radius-lg) var(--tbn-radius-lg);
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border); border-top: 0;
	transition: var(--tbn-transition);
}
.tbn-svc-socket-anchor { position: relative; height: 0; }
.tbn-svc-socket-anchor .tbn-bead { position: absolute; top: -1.75rem; left: calc(2.1rem - 1.75rem); z-index: 2; transition: transform .45s var(--tbn-ease-out); }
.tbn-svc-card:hover .tbn-svc-socket-anchor .tbn-bead { transform: rotate(-10deg) scale(1.06); }
.tbn-svc-num { font-family: var(--tbn-font-latin); font-size: .875rem; letter-spacing: .2em; color: var(--tbn-eyebrow); direction: ltr; }
.tbn-svc-title { font-size: 1.3rem; color: var(--tbn-card-fg); }
.tbn-svc-desc { font-size: .9375rem; color: var(--tbn-muted-fg); flex: 1; }
.tbn-svc-card:hover .tbn-svc-body { border-color: rgba(183,132,99,.5); }
.tbn-svc-cta {
	position: relative; overflow: hidden;
	display: flex; flex-direction: column; justify-content: space-between; gap: 2rem;
	min-height: 100%;
	padding: 2rem;
	border-radius: var(--tbn-radius-lg);
	background: var(--tbn-gradient-primary);
	color: var(--tbn-white);
	transition: var(--tbn-transition);
}
.tbn-svc-cta:hover { transform: translateY(-6px); box-shadow: var(--tbn-shadow-glow); }
.tbn-svc-cta-title { font-size: 1.75rem; color: var(--tbn-white); line-height: 1.4 !important; }
.tbn-svc-cta p { color: rgba(255,255,255,.88); }
.tbn-svc-cta-arrow { width: 3.5rem; height: 3.5rem; border-radius: 50%; background: rgba(255,255,255,.18); color: var(--tbn-white); }
.tbn-svc-cta-mark { position: absolute; left: -2rem; bottom: -2rem; width: 11rem; opacity: .12; pointer-events: none; }

/* ---------------------------------------------------------------------
   20. STATS BAND — image band + stat panel
   --------------------------------------------------------------------- */
.tbn-stats-band { position: relative; padding-block: 4rem 0; background: var(--tbn-bg); }
@media (min-width: 768px) { .tbn-stats-band { padding-block: 6rem 0; } }
.tbn-stats-media {
	position: relative; overflow: hidden;
	border-radius: 2rem;
	min-height: 22rem;
	background: var(--tbn-ink);
}
.tbn-stats-media img { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; }
.tbn-stats-media::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(90deg, rgba(15,26,35,.2) 0%, rgba(15,26,35,.88) 70%);
}
.tbn-stats-quote {
	position: relative; z-index: 1;
	padding: 3rem 1.75rem 9rem;
	max-width: 36rem;
	color: var(--tbn-cream-2);
}
@media (min-width: 768px) { .tbn-stats-quote { padding: 4.5rem 3.5rem 10rem; } }
.tbn-stats-quote-mark { font-family: var(--tbn-font-latin); font-size: 5rem; line-height: .6; color: var(--tbn-copper-light); display: block; margin-bottom: 1rem; }
.tbn-stats-quote-title { font-size: 1.75rem; line-height: 1.5 !important; color: var(--tbn-cream-2); }
@media (min-width: 768px) { .tbn-stats-quote-title { font-size: 2.25rem; } }
.tbn-stats-quote p { margin-top: 1rem !important; color: var(--tbn-on-dark); }
.tbn-stats-panel {
	position: relative; z-index: 2;
	margin: -6rem 1rem 0;
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
	border-radius: 1.5rem;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	box-shadow: var(--tbn-shadow-card);
	overflow: hidden;
}
@media (min-width: 768px) { .tbn-stats-panel { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: -5rem 2.5rem 0; } }
.tbn-stat { padding: 1.75rem 1.25rem; text-align: center; border-inline-start: 1px solid var(--tbn-border); border-top: 1px solid var(--tbn-border); }
.tbn-stat:nth-child(-n+2) { border-top: 0; }
.tbn-stat:nth-child(odd) { border-inline-start: 0; }
@media (min-width: 768px) {
	.tbn-stat { border-top: 0; border-inline-start: 1px solid var(--tbn-border); }
	.tbn-stat:first-child { border-inline-start: 0; }
	.tbn-stat:nth-child(odd):not(:first-child) { border-inline-start: 1px solid var(--tbn-border); }
}
.tbn-stat-num {
	display: block;
	font-family: var(--tbn-font-latin); font-weight: 600; font-size: 2.5rem; line-height: 1.1;
	background: var(--tbn-gradient-text); -webkit-background-clip: text; background-clip: text; color: transparent;
	direction: ltr;
}
@media (min-width: 1024px) { .tbn-stat-num { font-size: 3.25rem; } }
.tbn-stat-label { display: block; margin-top: .5rem; font-size: .9375rem; color: var(--tbn-muted-fg); line-height: 1.6; }

/* ---------------------------------------------------------------------
   21. PROJECT TIMELINE (home) — from the Figma "latest projects" block
   --------------------------------------------------------------------- */
.tbn-tl { position: relative; display: grid; gap: 3rem; }
.tbn-tl::before {
	content: ""; position: absolute; top: .5rem; bottom: .5rem; right: .7rem; width: 2px;
	background: linear-gradient(180deg, var(--tbn-copper) 0%, rgba(183,132,99,.15) 100%);
}
.tbn-tl-item { position: relative; display: grid; gap: 1.5rem; padding-right: 2.75rem; grid-template-columns: minmax(0, 1fr); align-items: center; }
.tbn-tl-dot {
	position: absolute; right: 0; top: .35rem;
	width: 1.5rem; height: 1.5rem; transform: rotate(45deg);
	border-radius: .3rem;
	background: var(--tbn-ink);
	border: 2px solid var(--tbn-copper);
	box-shadow: 0 0 0 6px rgba(183,132,99,.14);
}
.tbn-tl-tag {
	display: inline-flex; padding: .3rem .9rem; border-radius: 999px;
	background: rgba(183,132,99,.16); color: var(--tbn-eyebrow);
	font-size: .8125rem; font-weight: 600; margin-bottom: 1rem;
}
.tbn-tl-title { font-size: 1.5rem; color: var(--tbn-fg); margin-bottom: .75rem !important; }
.tbn-tl-desc { color: var(--tbn-muted-fg); margin-bottom: 1.25rem !important; }
.tbn-tl-media { aspect-ratio: 16 / 10; border-radius: 1.5rem; }
@media (min-width: 1024px) {
	.tbn-tl { gap: 4.5rem; }
	.tbn-tl::before { right: 50%; transform: translateX(50%); }
	.tbn-tl-item { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6rem; padding-right: 0; }
	.tbn-tl-dot { right: 50%; top: 50%; margin: -.75rem -.75rem 0 0; }
	.tbn-tl-item:nth-child(even) .tbn-tl-text { order: 2; }
}

/* ---------------------------------------------------------------------
   22. PROCESS — five beads on a connector (profile p.15)
   --------------------------------------------------------------------- */
.tbn-process { position: relative; display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); }
.tbn-process::before {
	content: ""; position: absolute; right: 2.25rem; top: 2rem; bottom: 2rem; width: 1px;
	background: linear-gradient(180deg, rgba(183,132,99,.8), rgba(183,132,99,.15));
}
.tbn-step { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.tbn-step-bead { position: relative; z-index: 1; }
.tbn-step-card {
	padding: 1.35rem 1.5rem;
	border-radius: 1.25rem;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	transition: var(--tbn-transition);
}
.tbn-step:hover .tbn-step-card { border-color: rgba(183,132,99,.5); transform: translateY(-4px); }
.tbn-step-num { font-family: var(--tbn-font-latin); font-size: 1.125rem; font-weight: 600; color: var(--tbn-eyebrow); direction: ltr; display: block; margin-bottom: .25rem; }
.tbn-step-title { font-size: 1.2rem; color: var(--tbn-card-fg); margin-bottom: .4rem !important; }
.tbn-step-desc { font-size: .9375rem; color: var(--tbn-muted-fg); }
@media (min-width: 1024px) {
	.tbn-process { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.25rem; }
	.tbn-process::before { right: 10%; left: 10%; top: 2.25rem; bottom: auto; width: auto; height: 1px; background: linear-gradient(270deg, rgba(183,132,99,.8), rgba(183,132,99,.25)); }
	.tbn-step { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; gap: 1.5rem; }
	.tbn-step-card { width: 100%; height: 100%; text-align: center; }
	.tbn-step-card p, .tbn-step-card h3 { text-align: center; }
}

/* ---------------------------------------------------------------------
   23. WHY US + FAQ (home)
   --------------------------------------------------------------------- */
.tbn-why-grid { display: grid; gap: 3rem; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 1024px) { .tbn-why-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 4.5rem; } }
.tbn-faq { display: grid; gap: .85rem; }
.tbn-faq-item {
	border-radius: 1.1rem;
	border: 1px solid var(--tbn-border);
	background: var(--tbn-card);
	transition: border-color .3s, background-color .3s;
}
.tbn-faq-item.is-open { border-color: rgba(216,163,130,.55); }
.tbn-faq-q {
	width: 100%;
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	padding: 1.15rem 1.35rem;
	background: none; border: 0; cursor: pointer;
	font-family: var(--tbn-font); font-size: 1.0625rem; font-weight: 600; color: var(--tbn-card-fg);
	text-align: right;
}
.tbn-faq-q-num { font-family: var(--tbn-font-latin); color: var(--tbn-eyebrow); margin-left: .5rem; direction: ltr; display: inline-block; }
.tbn-faq-icon {
	width: 2.25rem; height: 2.25rem; border-radius: 50%;
	border: 1px solid var(--tbn-border);
	color: var(--tbn-copper-light);
	transition: transform .35s var(--tbn-ease-out), background-color .3s;
}
.tbn-faq-icon svg { width: 1rem !important; height: 1rem !important; }
.tbn-faq-item.is-open .tbn-faq-icon { transform: rotate(180deg); background: var(--tbn-copper); color: var(--tbn-white); border-color: transparent; }
.tbn-faq-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--tbn-ease-out); }
.tbn-faq-item.is-open .tbn-faq-a { grid-template-rows: 1fr; }
.tbn-faq-a > div { overflow: hidden; }
.tbn-faq-a p { padding: 0 1.35rem 1.25rem; color: var(--tbn-muted-fg); font-size: .9375rem; }
html:not(.tbn-js) .tbn-faq-a { grid-template-rows: 1fr; }

.tbn-why-visual { position: relative; }
.tbn-why-img { aspect-ratio: 4 / 5; border-radius: 2rem; }
@media (min-width: 1024px) { .tbn-why-visual { position: sticky; top: 7rem; } }
.tbn-why-tags {
	position: absolute; z-index: 2; left: 1rem; right: 1rem; bottom: 1rem;
	display: grid; gap: .6rem;
	padding: 1.25rem;
	border-radius: 1.25rem;
	background: rgba(15,26,35,.9);
	color: var(--tbn-cream);
}
.tbn-why-tags-title { font-size: 1.3rem; color: var(--tbn-copper-light); margin-bottom: .35rem !important; }
.tbn-why-tag { display: flex; gap: .75rem; align-items: flex-start; font-size: .875rem; line-height: 1.7 !important; color: var(--tbn-on-dark-bright); }
.tbn-why-tag b { flex-shrink: 0; padding: .1rem .7rem; border-radius: .4rem; background: var(--tbn-gradient-primary); color: var(--tbn-white); font-weight: 600; font-size: .8125rem; }

/* ---------------------------------------------------------------------
   24. CONTACT BLOCK (home + contact) — form card + info stack
   --------------------------------------------------------------------- */
.tbn-contact-grid { display: grid; gap: 2rem; grid-template-columns: minmax(0, 1fr); align-items: stretch; }
/* The "جاهزون لبدء مشروعك" panel keeps its own height — it no longer stretches to the form. */
.tbn-contact-grid > .tbn-info-panel { align-self: start; }
@media (min-width: 1024px) { .tbn-contact-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 2.5rem; } }
.tbn-form-card {
	padding: 1.75rem;
	border-radius: 1.75rem;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	box-shadow: var(--tbn-shadow-card);
}
@media (min-width: 768px) { .tbn-form-card { padding: 2.5rem; } }
.tbn-form-title { font-size: 1.5rem; color: var(--tbn-card-fg); margin-bottom: .5rem !important; }
.tbn-form-intro { color: var(--tbn-muted-fg); margin-bottom: 1.75rem !important; font-size: .9375rem; }
.tbn-form-actions { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.tbn-form-hint { font-size: .8125rem; color: var(--tbn-muted-fg); }

.tbn-info-panel {
	position: relative; overflow: hidden;
	display: flex; flex-direction: column; gap: 1rem;
	padding: 1.75rem;
	border-radius: 1.75rem;
	background: var(--tbn-gradient-primary);
	color: var(--tbn-white);
}
@media (min-width: 768px) { .tbn-info-panel { padding: 2.25rem; } }
.tbn-info-panel-title { font-size: 1.5rem; color: var(--tbn-white); line-height: 1.45 !important; }
.tbn-info-panel > p { color: rgba(255,255,255,.88); font-size: .9375rem; }
.tbn-info-panel-mark { position: absolute; left: -3rem; bottom: -3rem; width: 14rem; opacity: .1; pointer-events: none; }
.tbn-info-item {
	position: relative; z-index: 1;
	display: flex; align-items: center; gap: 1rem;
	padding: .9rem 1rem;
	border-radius: 1.1rem;
	background: rgba(15,26,35,.22);
	border: 1px solid rgba(255,255,255,.14);
	color: var(--tbn-white);
	transition: background-color .3s, transform .3s;
}
a.tbn-info-item:hover { background: rgba(15,26,35,.4); transform: translateX(-4px); }
.tbn-info-icon { width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--tbn-ivory); color: var(--tbn-copper-deep); }
.tbn-info-icon svg { width: 1.15rem !important; height: 1.15rem !important; }
.tbn-info-label { display: block; font-size: .8125rem; color: rgba(255,255,255,.78); }
.tbn-info-value { display: block; font-weight: 600; font-size: 1rem; line-height: 1.6; }

/* ---------------------------------------------------------------------
   25. CTA BANNER
   --------------------------------------------------------------------- */
.tbn-cta-banner { position: relative; background: var(--tbn-bg); }
.tbn-cta-box {
	position: relative; overflow: hidden;
	display: grid; gap: 2rem; align-items: center;
	grid-template-columns: minmax(0, 1fr);
	padding: 2.5rem 1.75rem;
	border-radius: 2rem;
	background: var(--tbn-gradient-ink);
	color: var(--tbn-cream);
}
@media (min-width: 768px) { .tbn-cta-box { padding: 3.5rem; grid-template-columns: minmax(0, 1.4fr) auto; } }
.tbn-cta-box::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background-image: linear-gradient(rgba(216,163,130,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(216,163,130,.07) 1px, transparent 1px);
	background-size: 48px 48px;
	-webkit-mask-image: linear-gradient(90deg, #000, transparent 70%); mask-image: linear-gradient(90deg, #000, transparent 70%);
}
.tbn-cta-box > * { position: relative; }
.tbn-cta-title { font-size: 1.875rem; color: var(--tbn-cream-2); margin-bottom: .75rem !important; }
@media (min-width: 768px) { .tbn-cta-title { font-size: 2.5rem; } }
.tbn-cta-box p { color: var(--tbn-on-dark); font-size: 1.0625rem; }
.tbn-cta-actions { display: flex; flex-wrap: wrap; gap: 1rem; }

/* ---------------------------------------------------------------------
   26. FOOTER
   --------------------------------------------------------------------- */
.tbn-footer {
	position: relative;
	background: var(--tbn-ink);
	color: var(--tbn-on-dark);
	padding-top: 4rem;
}
.tbn-footer::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background-image: linear-gradient(rgba(216,163,130,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(216,163,130,.05) 1px, transparent 1px);
	background-size: 64px 64px;
	-webkit-mask-image: linear-gradient(180deg, #000, transparent 80%); mask-image: linear-gradient(180deg, #000, transparent 80%);
}
.tbn-footer > .tbn-container { position: relative; }
.tbn-footer-grid { display: grid; gap: 2.5rem; grid-template-columns: minmax(0, 1fr); padding-bottom: 3rem; }
@media (min-width: 768px) { .tbn-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .tbn-footer-grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, .75fr) minmax(0, .95fr) minmax(0, 1.1fr); gap: 3rem; } }
.tbn-footer-brand {
	padding: 1.75rem;
	border-radius: 1.5rem;
	background: linear-gradient(160deg, var(--tbn-navy), var(--tbn-ink-2));
	border: 1px solid rgba(216,163,130,.2);
}
.tbn-footer-logo { display: block; width: 11.5rem; margin-bottom: 1.25rem; }
.tbn-footer-logo img { width: 100%; display: block; }
.tbn-footer-brand p { font-size: .9375rem; color: var(--tbn-on-dark-soft); margin-bottom: 1.25rem !important; }
.tbn-footer-social { display: flex; gap: .6rem; }
.tbn-footer-social a { width: 2.6rem; height: 2.6rem; border-radius: 50%; border: 1px solid rgba(216,163,130,.35); color: var(--tbn-copper-light); transition: var(--tbn-transition); }
.tbn-footer-social a:hover { background: var(--tbn-copper); color: var(--tbn-white); border-color: transparent; transform: translateY(-3px); }
.tbn-footer-social a svg { width: 1.1rem !important; height: 1.1rem !important; }
.tbn-footer-heading { font-size: 1.125rem; color: var(--tbn-cream-2); margin-bottom: 1.25rem !important; position: relative; padding-bottom: .75rem; }
.tbn-footer-heading::after { content: ""; position: absolute; right: 0; bottom: 0; width: 2rem; height: 2px; border-radius: 2px; background: var(--tbn-copper); }
.tbn-footer-links { display: grid; gap: .7rem; }
.tbn-footer-links a { display: inline-flex; align-items: center; gap: .5rem; font-size: .9375rem; color: var(--tbn-on-dark); transition: color .3s, transform .3s; }
.tbn-footer-links a::before { content: ""; width: .35rem; height: .35rem; transform: rotate(45deg); background: var(--tbn-copper); opacity: .7; }
.tbn-footer-links a:hover { color: var(--tbn-copper-light); transform: translateX(-3px); }
.tbn-footer-contact { display: grid; gap: 1rem; }
.tbn-footer-contact li { display: flex; gap: .75rem; align-items: flex-start; font-size: .9375rem; line-height: 1.7 !important; }
.tbn-footer-contact a { color: var(--tbn-on-dark-bright); }
.tbn-footer-contact a:hover { color: var(--tbn-copper-light); }
.tbn-fc-icon { width: 2.2rem; height: 2.2rem; border-radius: 50%; background: rgba(183,132,99,.14); color: var(--tbn-copper-light); margin-top: .1rem; }
.tbn-fc-icon svg { width: 1rem !important; height: 1rem !important; }
.tbn-footer-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.tbn-footer-gallery a { aspect-ratio: 1; border-radius: .75rem; overflow: hidden; display: block; }
.tbn-footer-gallery img { width: 100%; height: 100% !important; object-fit: cover; transition: transform .6s var(--tbn-ease-out), opacity .3s; opacity: .85; }
.tbn-footer-gallery a:hover img { transform: scale(1.08); opacity: 1; }
.tbn-footer-bottom {
	display: flex; flex-wrap: wrap; gap: .75rem 2rem; justify-content: space-between; align-items: center;
	padding-block: 1.5rem;
	border-top: 1px solid rgba(244,239,232,.1);
	font-size: .875rem; color: var(--tbn-on-dark-dim);
}
.tbn-footer-credit a { color: var(--tbn-copper-light); }

/* ---------------------------------------------------------------------
   27. PAGE HERO (inner pages)
   --------------------------------------------------------------------- */
.tbn-page-hero {
	position: relative; overflow: hidden;
	padding-block: 10rem 5rem;
	background: var(--tbn-ink);
	color: var(--tbn-cream);
}
@media (min-width: 768px) { .tbn-page-hero { padding-block: 12rem 6.5rem; } }
.tbn-page-hero-media { position: absolute; inset: 0; }
.tbn-page-hero-media img { width: 100%; height: 100% !important; object-fit: cover; display: block; }
.tbn-page-hero-media::after {
	content: ""; position: absolute; inset: 0;
	background:
		linear-gradient(90deg, rgba(15,26,35,.55) 0%, rgba(15,26,35,.92) 65%),
		linear-gradient(0deg, rgba(15,26,35,.85) 0%, rgba(15,26,35,0) 50%);
}
.tbn-page-hero .tbn-container { position: relative; z-index: 1; }
.tbn-crumbs {
	display: inline-flex; align-items: center; gap: .6rem;
	padding: .45rem 1.1rem;
	border-radius: 999px;
	border: 1px solid rgba(216,163,130,.3);
	background: rgba(15,26,35,.5);
	font-size: .875rem; color: var(--tbn-on-dark);
	margin-bottom: 1.25rem;
}
.tbn-crumbs a { color: var(--tbn-copper-light); }
.tbn-crumbs-sep { width: .4rem; height: .4rem; transform: rotate(45deg); background: var(--tbn-copper); display: inline-block; }
.tbn-page-title { font-size: 2.5rem; color: var(--tbn-cream-2); margin-bottom: 1rem !important; }
@media (min-width: 768px) { .tbn-page-title { font-size: 3.75rem; } }
.tbn-page-sub { font-size: 1.125rem; color: var(--tbn-on-dark); max-width: 38rem; }
.tbn-page-hero-mark { position: absolute; left: 4%; bottom: -3rem; width: 16rem; opacity: .08; z-index: 1; pointer-events: none; }
@media (max-width: 767px) { .tbn-page-hero-mark { width: 10rem; } }

/* ---------------------------------------------------------------------
   28. ABOUT PAGE — journey, vision/mission, values
   --------------------------------------------------------------------- */
.tbn-points { display: grid; gap: 0; }
.tbn-point { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.25rem; align-items: start; padding-block: 1.35rem; border-bottom: 1px solid var(--tbn-border); }
.tbn-point:first-child { padding-top: 0; }
.tbn-point-title { font-size: 1.2rem; color: var(--tbn-fg); margin-bottom: .35rem !important; }
.tbn-point p { color: var(--tbn-muted-fg); font-size: .9375rem; }
.tbn-chips { display: flex; flex-wrap: wrap; gap: .75rem; margin-bottom: 2rem; }
.tbn-chip {
	display: inline-flex; align-items: center; gap: .6rem;
	padding: .55rem 1rem .55rem .55rem;
	border-radius: 999px;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	font-weight: 600; font-size: .9375rem; color: var(--tbn-fg);
}

@media (max-width: 767px) {
	.tbn-about .tbn-chips { display: grid; grid-template-columns: minmax(0, 1fr); }
	.tbn-about .tbn-chip { display: flex; width: 100%; }
}

.tbn-journey-grid { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) { .tbn-journey-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 2rem; } }
.tbn-journey-big {
	--tbn-nr: 2.4rem; --tbn-nx: 2rem; --tbn-ny: 2rem;
	position: relative;
	display: flex; flex-direction: column; justify-content: flex-end; align-items: center; text-align: center;
	min-height: 22rem;
	padding: 2.5rem 2rem;
	border-radius: 1.75rem;
	background: var(--tbn-gradient-primary);
	color: var(--tbn-white);
}
.tbn-journey-big-num { font-family: var(--tbn-font-latin); font-size: 7rem; line-height: .9; font-weight: 600; direction: ltr; }
.tbn-journey-big-title { font-size: 1.75rem; color: var(--tbn-white); margin-block: .75rem .5rem !important; }
.tbn-journey-big p { color: rgba(255,255,255,.9); text-align: center; }
.tbn-journey-list { display: grid; gap: 1.25rem; }
.tbn-journey-item {
	display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.25rem; align-items: center;
	padding: 1.5rem;
	border-radius: 1.5rem;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	transition: var(--tbn-transition);
}
.tbn-journey-item:hover { transform: translateX(-6px); border-color: rgba(183,132,99,.5); }
.tbn-journey-item h3 { font-size: 1.2rem; color: var(--tbn-card-fg); margin-bottom: .35rem !important; }
.tbn-journey-item h3 .tbn-ltr { color: var(--tbn-eyebrow); font-family: var(--tbn-font-latin); }
.tbn-journey-item p { font-size: .9375rem; color: var(--tbn-muted-fg); }

.tbn-vm-grid { display: grid; gap: 1.75rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .tbn-vm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tbn-vm-card { position: relative; }
.tbn-vm-surface {
	height: 100%;
	padding: 5.5rem 2rem 2.25rem;
	border-radius: 1.75rem;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	box-shadow: var(--tbn-shadow-card);
}
.tbn-vm-latin { display: block; font-family: var(--tbn-font-latin); font-size: .75rem; letter-spacing: .3em; color: var(--tbn-eyebrow); direction: ltr; text-align: right; margin-bottom: .35rem; }
.tbn-vm-title { font-size: 1.875rem; color: var(--tbn-card-fg); margin-bottom: 1rem !important; }
.tbn-vm-text { font-size: 1.1875rem; color: var(--tbn-card-fg); line-height: 2 !important; }
.tbn-vm-rule { display: block; width: 3.25rem; height: 3px; border-radius: 3px; background: var(--tbn-gradient-accent); margin-top: 1.75rem; }

.tbn-values-grid { display: grid; column-gap: 1.25rem; row-gap: 1.75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: .5rem; }
@media (min-width: 768px) { .tbn-values-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .tbn-values-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.tbn-value { position: relative; height: 100%; transition: var(--tbn-transition); --tbn-sy: 2.55rem; }
.tbn-value-surface {
	--tbn-nr: 2.85rem; --tbn-ny: var(--tbn-sy);   /* bead 4.5rem + .6rem ring of air */
	display: flex; flex-direction: column; align-items: center; text-align: center; gap: .9rem;
	height: 100%;
	padding: 6.25rem 1.25rem 2rem;
	border-radius: 1.5rem;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	transition: var(--tbn-transition);
}
.tbn-value:hover { transform: translateY(-6px); }
.tbn-value:hover .tbn-value-surface { border-color: rgba(183,132,99,.5); }
.tbn-value .tbn-socket { transition: transform .45s var(--tbn-ease-out); }
.tbn-value:hover .tbn-socket { transform: translateY(-3px); }
.tbn-value-num { font-family: var(--tbn-font-latin); font-size: 1.75rem; font-weight: 600; color: var(--tbn-eyebrow); direction: ltr; line-height: 1; }
.tbn-value-title { font-size: 1.35rem; color: var(--tbn-card-fg); }
.tbn-value-latin { font-family: var(--tbn-font-latin); font-size: .6875rem; letter-spacing: .25em; color: var(--tbn-muted-fg); direction: ltr; }
.tbn-value.is-featured .tbn-value-surface { background: var(--tbn-gradient-primary); border-color: transparent; color: var(--tbn-white); }
.tbn-value.is-featured .tbn-value-num, .tbn-value.is-featured .tbn-value-title, .tbn-value.is-featured .tbn-value-latin { color: var(--tbn-white); }
@media (min-width: 1100px) { .tbn-value.is-featured { transform: translateY(-1rem); } .tbn-value.is-featured:hover { transform: translateY(-1.4rem); } }
@media (max-width: 767px) {
	.tbn-values-grid { grid-template-columns: minmax(0, 1fr); justify-items: center; }
	.tbn-values-grid > .tbn-value { width: 100%; max-width: 22rem; margin-inline: auto; }
}

.tbn-why-page-grid { display: grid; gap: 3rem; grid-template-columns: minmax(0, 1fr); align-items: center; }
@media (min-width: 1024px) { .tbn-why-page-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 5rem; } }
.tbn-why-slogan {
	font-size: 1.5rem; color: var(--tbn-copper-light);
	padding-inline-start: 1.25rem; border-inline-start: 3px solid var(--tbn-copper);
	margin-bottom: 2rem !important;
}
@media (min-width: 768px) { .tbn-why-slogan { font-size: 1.875rem; } }
.tbn-why-list { display: grid; gap: 1rem; margin-bottom: 2.5rem !important; }
.tbn-why-list li { display: flex; gap: 1rem; align-items: flex-start; color: var(--tbn-muted-fg); }
.tbn-why-list b { flex-shrink: 0; padding: .2rem .85rem; border-radius: .5rem; background: var(--tbn-gradient-primary); color: var(--tbn-white); font-weight: 600; font-size: .875rem; line-height: 1.7; }
.tbn-mini-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; padding-top: 2rem; border-top: 1px solid var(--tbn-border); }
.tbn-mini-stat-num { display: block; font-family: var(--tbn-font-latin); font-size: 2.25rem; font-weight: 600; line-height: 1.1; background: var(--tbn-gradient-text); -webkit-background-clip: text; background-clip: text; color: transparent; direction: ltr; text-align: right; }
.tbn-mini-stat-label { display: block; font-size: .875rem; color: var(--tbn-muted-fg); margin-top: .35rem; }
.tbn-why-page-img { aspect-ratio: 4 / 5; border-radius: 2rem; }

/* ---------------------------------------------------------------------
   29. SERVICES PAGE — detail splits + catalog
   --------------------------------------------------------------------- */
.tbn-sd { display: grid; gap: 2.5rem; grid-template-columns: minmax(0, 1fr); align-items: center; }
.tbn-sd + .tbn-sd { margin-top: 5rem; padding-top: 5rem; border-top: 1px solid var(--tbn-border); }
@media (min-width: 1024px) {
	.tbn-sd { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 5rem; }
	.tbn-sd:nth-child(even) .tbn-sd-media-wrap { order: -1; }
}
.tbn-sd-head { display: flex; align-items: center; gap: 1.25rem; margin-bottom: 1.25rem; }
.tbn-sd-num {
	font-family: var(--tbn-font-latin); font-size: 4.5rem; line-height: .9; font-weight: 600;
	background: var(--tbn-gradient-text); -webkit-background-clip: text; background-clip: text; color: transparent;
	direction: ltr; flex-shrink: 0;
}
.tbn-sd-latin { display: block; font-family: var(--tbn-font-latin); font-size: .75rem; letter-spacing: .28em; color: var(--tbn-eyebrow); direction: ltr; text-align: right; margin-bottom: .35rem; }
.tbn-sd-title { font-size: 1.875rem; color: var(--tbn-fg); }
@media (min-width: 768px) { .tbn-sd-title { font-size: 2.25rem; } }
.tbn-sd-desc { font-size: 1.0625rem; color: var(--tbn-muted-fg); margin-bottom: 1.75rem !important; }
.tbn-sd-list { display: grid; gap: .75rem; margin-bottom: 2rem !important; }
.tbn-sd-list li {
	display: flex; align-items: center; gap: .85rem;
	padding: .75rem 1rem .75rem .75rem;
	border-radius: 1rem;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	font-weight: 600; color: var(--tbn-fg);
}
.tbn-sd-media-wrap { position: relative; }
.tbn-sd-media {
	--tbn-nr: 2.4rem; --tbn-nx: 2.4rem; --tbn-ny: 2.4rem;
	aspect-ratio: 5 / 4; border-radius: 1.75rem;
}
.tbn-sd-media-wrap .tbn-socket { top: calc(2.4rem - 1.75rem); right: calc(2.4rem - 1.75rem); }

.tbn-catalog { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .tbn-catalog { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .tbn-catalog { grid-template-columns: repeat(6, minmax(0, 1fr)); } .tbn-cat { grid-column: span 2; } .tbn-cat:nth-child(1), .tbn-cat:nth-child(2) { grid-column: span 3; } }
.tbn-cat {
	padding: 1.75rem;
	border-radius: 1.5rem;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	transition: var(--tbn-transition);
}
.tbn-cat:hover { border-color: rgba(216,163,130,.5); transform: translateY(-4px); }
.tbn-cat-head { display: flex; align-items: center; gap: .85rem; padding-bottom: 1rem; margin-bottom: .5rem; border-bottom: 1px solid rgba(183,132,99,.55); }
.tbn-cat-num { font-family: var(--tbn-font-latin); font-size: 1.25rem; color: var(--tbn-copper-light); direction: ltr; }
.tbn-cat-title { font-size: 1.2rem; color: var(--tbn-card-fg); flex: 1; }
.tbn-cat-count { font-size: .8125rem; padding: .2rem .65rem; border-radius: 999px; background: rgba(183,132,99,.16); color: var(--tbn-copper-light); white-space: nowrap; }
.tbn-cat-list li { display: flex; align-items: center; gap: .75rem; padding-block: .6rem; border-bottom: 1px dashed var(--tbn-border); color: var(--tbn-card-fg); font-size: .9375rem; }
.tbn-cat-list li:last-child { border-bottom: 0; }
.tbn-cat-list li::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: var(--tbn-copper); flex-shrink: 0; }

/* ---------------------------------------------------------------------
   30. PROJECTS PAGE — filter + gallery + lightbox
   --------------------------------------------------------------------- */
.tbn-filter { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 2.5rem; }
.tbn-filter-btn {
	padding: .65rem 1.25rem;
	border-radius: 999px;
	border: 1px solid var(--tbn-border);
	background: var(--tbn-card);
	color: var(--tbn-fg);
	font: inherit; font-weight: 600; font-size: .9375rem;
	cursor: pointer;
	transition: var(--tbn-transition);
}
.tbn-filter-btn:hover { border-color: var(--tbn-copper); color: var(--tbn-eyebrow); }
.tbn-filter-btn.is-active { background: var(--tbn-navy); border-color: var(--tbn-navy); color: var(--tbn-ivory); }
.tbn-filter-count { font-family: var(--tbn-font-latin); font-size: .8125rem; opacity: .7; margin-inline-start: .35rem; }
.tbn-gallery { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); grid-auto-flow: row dense; }
@media (min-width: 640px) { .tbn-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .tbn-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tbn-gcard {
	position: relative; display: block; width: 100%;
	padding: 0; border: 0; cursor: zoom-in;
	border-radius: 1.5rem; overflow: hidden;
	background: var(--tbn-card);
	box-shadow: var(--tbn-shadow-card);
	text-align: right;
	display: flex; flex-direction: column;
	font: inherit; color: inherit;
	animation: tbn-fade-in .5s ease both;
}
.tbn-gcard[hidden] { display: none; }
.tbn-gcard-media { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--tbn-muted); }
.tbn-gcard-media img { width: 100%; height: 100% !important; object-fit: cover; display: block; transition: transform .9s var(--tbn-ease-out); }
.tbn-gcard:hover .tbn-gcard-media img { transform: scale(1.06); }
.tbn-gcard-body { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.35rem; }
.tbn-gcard-tag { display: block; font-size: .8125rem; font-weight: 600; color: var(--tbn-eyebrow); margin-bottom: .2rem; }
.tbn-gcard-title { display: block; font-family: var(--tbn-font); font-size: 1.0625rem; font-weight: 700; color: var(--tbn-card-fg); line-height: 1.5; }
.tbn-gcard-zoom { width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--tbn-muted); color: var(--tbn-eyebrow); transition: var(--tbn-transition); }
.tbn-gcard-zoom svg { width: 1.05rem !important; height: 1.05rem !important; }
.tbn-gcard:hover .tbn-gcard-zoom { background: var(--tbn-copper); color: var(--tbn-white); }
@media (min-width: 1024px) { .tbn-gcard.is-wide { grid-column: span 2; } .tbn-gcard.is-wide .tbn-gcard-media { flex: 1; aspect-ratio: auto; min-height: 16rem; } .tbn-gcard.is-wide .tbn-gcard-media img { position: absolute; inset: 0; } }
.tbn-note { display: flex; gap: .85rem; align-items: flex-start; margin-top: 2.5rem; padding: 1.1rem 1.35rem; border-radius: 1rem; background: var(--tbn-muted); color: var(--tbn-muted-fg); font-size: .9375rem; }

.tbn-lightbox {
	position: fixed; inset: 0; z-index: 300;
	display: grid; place-items: center;
	padding: 4.5rem 1rem 1.5rem;
	background: rgba(9,16,22,.94);
	direction: rtl;
	opacity: 0; visibility: hidden;
	transition: opacity .3s ease, visibility 0s linear .3s;
}
.tbn-lightbox.is-open { opacity: 1; visibility: visible; transition-delay: 0s; }
.tbn-lightbox-figure { margin: 0; max-width: min(72rem, 100%); display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.tbn-lightbox-img { max-height: 76svh; width: auto; max-width: 100%; border-radius: 1rem; box-shadow: 0 30px 60px -20px rgba(0,0,0,.8); }
.tbn-lightbox-cap { color: var(--tbn-cream); font-size: 1rem; text-align: center; }
/* 1.8.0 — video in works timeline, gallery cards and lightbox */
.tbn-media.has-video, .tbn-gcard-media { background: #0b1117; }
.tbn-media .tbn-video, .tbn-gcard-media .tbn-video { position: absolute; inset: 0; width: 100%; height: 100% !important; border: 0; display: block; object-fit: contain; background: #0b1117; }
.tbn-media .tbn-video.is-auto, .tbn-gcard-media .tbn-video { object-fit: cover; }
.tbn-gcard-media .tbn-video { pointer-events: none; }
.tbn-gcard.is-video { cursor: pointer; }
.tbn-gcard-play { position: absolute; top: 50%; left: 50%; width: 4rem; height: 4rem; margin: -2rem 0 0 -2rem; border-radius: 50%; display: grid; place-items: center; background: rgba(9,16,22,.55); color: var(--tbn-white, #fff); border: 1.5px solid rgba(255,255,255,.7); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); transition: var(--tbn-transition); z-index: 1; pointer-events: none; }
.tbn-gcard-play svg { width: 1.45rem !important; height: 1.45rem !important; margin-inline-start: .2rem; stroke: none; }
.tbn-gcard:hover .tbn-gcard-play { background: var(--tbn-copper); border-color: var(--tbn-copper); transform: scale(1.08); }
.tbn-gcard-zoom svg path[fill] { stroke: none; }
.tbn-lightbox-img[hidden], .tbn-lightbox-video[hidden] { display: none !important; }
.tbn-lightbox-video { width: min(72rem, calc(100vw - 2rem)); max-height: 76svh; aspect-ratio: 16 / 9; border-radius: 1rem; overflow: hidden; background: #000; box-shadow: 0 30px 60px -20px rgba(0,0,0,.8); }
.tbn-lightbox-video.is-tall { width: auto; height: 76svh; aspect-ratio: 9 / 16; max-width: calc(100vw - 2rem); }
.tbn-lightbox-video.is-file { width: auto; max-width: min(72rem, calc(100vw - 2rem)); aspect-ratio: auto; background: transparent; }
.tbn-lightbox-video iframe { width: 100%; height: 100%; border: 0; display: block; }
.tbn-lightbox-video video { display: block; max-width: 100%; max-height: 76svh; width: auto; height: auto; margin: 0 auto; background: #000; border-radius: 1rem; }
.tbn-lightbox-cap b { color: var(--tbn-copper-light); font-weight: 600; margin-inline-end: .5rem; }
.tbn-lightbox-btn {
	position: absolute; width: 3rem; height: 3rem; border-radius: 50%;
	border: 1px solid rgba(216,163,130,.4); background: rgba(27,43,56,.8); color: var(--tbn-cream); cursor: pointer;
	display: inline-flex; align-items: center; justify-content: center;
}
.tbn-lightbox-btn svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tbn-lightbox-btn:hover { background: var(--tbn-copper); }
.tbn-lightbox-close { top: 1rem; left: 1rem; }
.tbn-lightbox-prev { right: 1rem; top: 50%; margin-top: -1.5rem; }
.tbn-lightbox-next { left: 1rem; top: 50%; margin-top: -1.5rem; }
@media (max-width: 639px) { .tbn-lightbox-prev, .tbn-lightbox-next { top: auto; bottom: 1rem; margin-top: 0; } }

/* ---------------------------------------------------------------------
   31. CONTACT PAGE — info cards + map
   --------------------------------------------------------------------- */
.tbn-cinfo-grid { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); margin-bottom: 3rem; }
@media (min-width: 640px) { .tbn-cinfo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .tbn-cinfo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.tbn-cinfo {
	display: flex; flex-direction: column; align-items: flex-start; gap: 1rem;
	padding: 1.5rem;
	border-radius: 1.5rem;
	background: var(--tbn-card);
	border: 1px solid var(--tbn-border);
	box-shadow: var(--tbn-shadow-card);
	transition: var(--tbn-transition);
	height: 100%;
}
.tbn-cinfo:hover { transform: translateY(-4px); border-color: rgba(183,132,99,.5); }
.tbn-cinfo-label { display: block; font-size: .875rem; color: var(--tbn-muted-fg); margin-bottom: .35rem; }
.tbn-cinfo-value { display: block; font-weight: 600; color: var(--tbn-card-fg); line-height: 1.7; }
.tbn-cinfo-value a:hover { color: var(--tbn-eyebrow); }
.tbn-map-wrap { position: relative; min-height: 24rem; border-radius: 1.75rem; overflow: hidden; background: var(--tbn-navy); }
.tbn-map-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100% !important; border: 0; filter: grayscale(.35) contrast(1.05); }
.tbn-map-card {
	position: absolute; z-index: 1; right: 1rem; bottom: 1rem; left: 1rem;
	display: flex; gap: .85rem; align-items: center;
	padding: 1rem 1.15rem;
	border-radius: 1.1rem;
	background: rgba(15,26,35,.94); color: var(--tbn-cream);
	font-size: .875rem; line-height: 1.7;
}
@media (min-width: 768px) { .tbn-map-card { left: auto; max-width: 22rem; } }
.tbn-map-card a { color: var(--tbn-copper-light); font-weight: 600; }

.tbn-wa-band {
	display: grid; gap: 1.5rem; align-items: center; grid-template-columns: minmax(0, 1fr);
	padding: 2rem 1.75rem;
	border-radius: 1.75rem;
	background: var(--tbn-gradient-primary);
	color: var(--tbn-white);
}
@media (min-width: 768px) { .tbn-wa-band { grid-template-columns: auto minmax(0, 1fr) auto; padding: 2rem 2.5rem; } }
.tbn-wa-band h2 { font-size: 1.5rem; color: var(--tbn-white); margin-bottom: .25rem !important; }
.tbn-wa-band p { color: rgba(255,255,255,.88); }
.tbn-wa-band-icon { width: 4rem; height: 4rem; border-radius: 50%; background: rgba(255,255,255,.18); color: var(--tbn-white); }
.tbn-wa-band-icon svg { width: 1.9rem !important; height: 1.9rem !important; }

@media (max-width: 420px) {
	.tbn-hero-actions .tbn-btn { max-width: 100%; white-space: normal; text-align: center; }
}

/* ---------------------------------------------------------------------
   32. FLOATING ACTIONS — WhatsApp + back to top
   --------------------------------------------------------------------- */
.tbn-fab {
	position: fixed; z-index: 90; left: 1.25rem; bottom: 1.25rem;
	display: flex; flex-direction: column; gap: .75rem; align-items: center;
}
.tbn-fab-wa {
	width: 3.5rem; height: 3.5rem; border-radius: 50%;
	background: var(--tbn-fab-bg, var(--tbn-whatsapp)); color: var(--tbn-fab-fg, var(--tbn-white));
	box-shadow: 0 12px 28px -10px rgba(0,0,0,.45);
	transition: transform .3s;
	position: relative;
}
.tbn-fab-wa::before {
	content: ""; position: absolute; inset: 0; border-radius: 50%;
	border: 2px solid var(--tbn-fab-bg, var(--tbn-whatsapp)); animation: tbn-ping 2.4s ease-out infinite;
}
@keyframes tbn-ping { 0% { transform: scale(1); opacity: .7; } 80%, 100% { transform: scale(1.6); opacity: 0; } }
@keyframes tbn-ping-sm { 0% { transform: scale(1); opacity: .7; } 80%, 100% { transform: scale(1.4); opacity: 0; } }
.tbn-fab-wa:hover { transform: scale(1.08); }
.tbn-fab-wa svg { width: 1.75rem !important; height: 1.75rem !important; fill: currentColor !important; stroke: none !important; }
.tbn-fab-top {
	width: 2.75rem; height: 2.75rem; border-radius: 50%;
	background: var(--tbn-navy); color: var(--tbn-copper-light);
	border: 1px solid rgba(216,163,130,.35);
	cursor: pointer;
	opacity: 0; visibility: hidden; transform: translateY(10px);
	transition: opacity .3s, transform .3s, visibility 0s linear .3s;
}
.tbn-fab-top.is-visible { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.tbn-fab-top svg { width: 1.1rem !important; height: 1.1rem !important; }
@media (prefers-reduced-motion: reduce) { .tbn-fab-wa::before { animation: none; } }
.tbn-fab.no-pulse .tbn-fab-wa::before { display: none; }
.tbn-fab a.tbn-fab-wa, .tbn-fab a.tbn-fab-wa:hover, .tbn-fab a.tbn-fab-wa:focus { color: var(--tbn-fab-fg, var(--tbn-white)) !important; background: var(--tbn-fab-bg, var(--tbn-whatsapp)) !important; }
.tbn-fab.is-right { left: auto; right: 1.25rem; }

/* ---------------------------------------------------------------------
   33. PAGE HELPERS
   --------------------------------------------------------------------- */
.tbn-chip-link { transition: var(--tbn-transition); padding: .5rem 1rem .5rem .6rem; }
.tbn-chip-link:hover { border-color: var(--tbn-copper); color: var(--tbn-eyebrow); transform: translateY(-2px); }
.tbn-chip-num {
	display: inline-flex; align-items: center; justify-content: center;
	width: 1.9rem; height: 1.9rem; border-radius: 50%;
	background: rgba(183,132,99,.16); color: var(--tbn-eyebrow);
	font-family: var(--tbn-font-latin); font-size: .8125rem; font-weight: 600; direction: ltr;
}
.tbn-head-side .tbn-chips { margin-bottom: 0; }
.tbn-sd { scroll-margin-top: 7rem; }
.tbn-cinfo-value a, .tbn-info-value.tbn-ltr, .tbn-footer-contact a.tbn-ltr { overflow-wrap: normal; word-break: normal; }
@media (max-width: 767px) {
	.tbn-fab { left: 1rem; bottom: .85rem; max-width: calc(100vw - 2rem); }
	.tbn-fab.is-right { left: auto; right: 1rem; }
	.tbn-fab-wa { width: 3rem; height: 3rem; }
	.tbn-fab-wa::before { animation-name: tbn-ping-sm; }
	.tbn-fab-wa svg { width: 1.5rem !important; height: 1.5rem !important; }
	.tbn-fab-top { display: none; }
}

/* =====================================================================
   34. WORDPRESS / ELEMENTOR INTEGRATION
   ===================================================================== */
/* Canvas: paper by default; Elementor wrappers never paint white behind sections. */
body { background: var(--tbn-paper) !important; }
.elementor .e-con, .elementor .e-con-inner,
.elementor .elementor-section, .elementor .elementor-container { background-color: transparent; }
.elementor-widget-container > .tbn-section,
.elementor-widget-container > .tbn-hero,
.elementor-widget-container > .tbn-page-hero,
.elementor-widget-container > .tbn-footer,
.elementor-widget-container > .tbn-marquee { width: 100%; }

/* Admin bar offset for the fixed header. */
.admin-bar .tbn-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .tbn-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .tbn-header { top: 0; } .admin-bar .tbn-header.is-scrolled { top: 0; } }

/* Editor canvas: header sits in flow so it can be edited; animations at final state. */
.elementor-editor-active .tbn-header { position: relative; }
.elementor-editor-active .tbn-mobile-menu:not(.is-open) { display: none; }
.elementor-editor-active .tbn-hero { min-height: 0; }
.elementor-editor-active [class*="tbn-anim-"] { animation: none !important; opacity: 1 !important; transform: none !important; }

/* Theme link colours never override widget text. */
[class^="tbn-"] a:hover, [class^="tbn-"] a:focus { text-decoration: none; }
.tbn-footer a, .tbn-header a { box-shadow: none; }

/* Form notices rendered by the server after submit. */
.tbn-form-alert { display: flex; align-items: flex-start; gap: .6rem; margin-bottom: 1.25rem; padding: .9rem 1.1rem; border-radius: var(--tbn-radius); font-size: .9375rem; }
.tbn-form-alert-icon svg { width: 1.15rem !important; height: 1.15rem !important; }
.tbn-form-alert-success { background: rgba(34,139,84,.12); color: var(--tbn-success); }
.tbn-form-alert-error   { background: rgba(217,83,79,.12);  color: var(--tbn-danger-deep); }
.tbn-dark .tbn-form-alert-success { color: var(--tbn-success-light); }
.tbn-form-wa { display: inline-flex; align-items: center; gap: .45rem; font-size: .875rem; font-weight: 600; color: var(--tbn-eyebrow); }
.tbn-form-wa svg { width: 1.05rem; height: 1.05rem; }

/* Global floating actions render once via wp_footer. */
.tbn-fab { direction: rtl; }
.tbn-fab-wa, .tbn-fab-top { display: inline-flex; align-items: center; justify-content: center; }
/* Header dropdowns (WP menus with child items) + mobile sub-links. */
.tbn-has-dropdown { position: relative; display: inline-flex; }
.tbn-nav-link svg { width: .875rem; height: .875rem; vertical-align: middle; fill: none; stroke: currentColor; }
.tbn-dropdown {
	position: absolute; top: 100%; right: 0; z-index: 5;
	display: grid; min-width: 14rem; padding: .5rem;
	border: 1px solid rgba(216,163,130,.28); border-radius: 1rem;
	background: var(--tbn-ink);
	opacity: 0; visibility: hidden; transform: translateY(6px);
	transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
}
.tbn-has-dropdown:hover .tbn-dropdown, .tbn-has-dropdown:focus-within .tbn-dropdown { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.tbn-dropdown a { padding: .55rem .85rem; border-radius: .6rem; font-size: .9rem; color: var(--tbn-cream) !important; }
.tbn-dropdown a:hover { background: rgba(216,163,130,.14); color: var(--tbn-copper-light) !important; }
.tbn-mobile-link.tbn-mobile-sub { font-size: 1.05rem; font-weight: 500; padding-inline-start: 1.25rem; opacity: .85; }
/* Theme reset neutralisation (Hello Elementor styles every <button>: pink #c36
   hover background, nowrap, centred text, 3px radius, padding). */
button.tbn-faq-q, button.tbn-gcard, button.tbn-filter-btn, button.tbn-burger,
button.tbn-lightbox-btn, button.tbn-fab-top {
	white-space: normal; text-transform: none; letter-spacing: normal; font-weight: inherit; line-height: inherit;
}
button.tbn-faq-q, button.tbn-gcard { text-align: right; }
button.tbn-faq-q { font-weight: 600; border-radius: 0; }
button.tbn-lightbox-btn, button.tbn-fab-top { padding: 0; }
button.tbn-faq-q:hover, button.tbn-faq-q:focus { background: transparent; color: var(--tbn-card-fg); }
button.tbn-gcard:hover, button.tbn-gcard:focus { background: var(--tbn-card); color: inherit; }
button.tbn-filter-btn:hover, button.tbn-filter-btn:focus { background: var(--tbn-card); }
button.tbn-filter-btn.is-active, button.tbn-filter-btn.is-active:hover, button.tbn-filter-btn.is-active:focus { background: var(--tbn-navy); color: var(--tbn-ivory); }
button.tbn-burger:hover, button.tbn-burger:focus { background: rgba(20,35,48,.8); color: var(--tbn-cream); }
button.tbn-fab-top:hover, button.tbn-fab-top:focus { background: var(--tbn-navy); color: var(--tbn-copper-light); }
button.tbn-btn.tbn-btn-primary { border-radius: 9999px; }
/* Mobile: WhatsApp only (back-to-top hidden). Declared last so it wins over the FAB display rule above. */
@media (max-width: 767px) { .tbn-fab .tbn-fab-top { display: none; } }

/* =====================================================================
   34. LTR LAYER — translated (left-to-right) languages under WPML
   The base sheet is authored RTL. Every rule below is keyed to the
   plugin-owned body class (tbn-dir-ltr, set from is_rtl()), never to
   the html dir attribute — WordPress never prints an LTR value there.
   ===================================================================== */
body.tbn-dir-ltr .tbn-section, body.tbn-dir-ltr .tbn-header, body.tbn-dir-ltr .tbn-footer, body.tbn-dir-ltr .tbn-hero, body.tbn-dir-ltr .tbn-page-hero,
body.tbn-dir-ltr .tbn-mobile-menu { direction: ltr; text-align: left; }
body.tbn-dir-ltr .tbn-lightbox, body.tbn-dir-ltr .tbn-fab, body.tbn-dir-ltr .tbn-marquee-group { direction: ltr; }

/* Directional glyphs (arrows, chevrons) point the other way. */
body.tbn-dir-ltr .tbn-i-dir { transform: scaleX(-1); }
body.tbn-dir-ltr .tbn-btn:hover .tbn-btn-arrow { transform: translateX(4px); }
body.tbn-dir-ltr .tbn-link:hover svg.tbn-i-dir { transform: scaleX(-1) translateX(-4px); }
body.tbn-dir-ltr a.tbn-info-item:hover { transform: translateX(4px); }
body.tbn-dir-ltr .tbn-footer-links a:hover { transform: translateX(3px); }
body.tbn-dir-ltr .tbn-journey-item:hover { transform: translateX(6px); }

/* Section heads + text alignment. */
body.tbn-dir-ltr .tbn-section-head.tbn-section-head .tbn-head-rule { transform-origin: left center; }
body.tbn-dir-ltr .tbn-align-start { text-align: left; }
body.tbn-dir-ltr .tbn-vm-latin, body.tbn-dir-ltr .tbn-sd-latin, body.tbn-dir-ltr .tbn-mini-stat-num { text-align: left; }
body.tbn-dir-ltr button.tbn-faq-q, body.tbn-dir-ltr button.tbn-gcard, body.tbn-dir-ltr .tbn-faq-q, body.tbn-dir-ltr .tbn-gcard { text-align: left; }
body.tbn-dir-ltr .tbn-faq-q-num { margin-left: 0; margin-right: .5rem; }

/* Buttons, chips, badges — the round end sits on the inline-end side. */
body.tbn-dir-ltr .tbn-btn { padding: 0.5rem 0.5rem 0.5rem 1.5rem; }
body.tbn-dir-ltr .tbn-btn:not(:has(.tbn-btn-arrow)) { padding: 0.85rem 1.75rem; }
body.tbn-dir-ltr .tbn-hero-badge { padding: .4rem .4rem .4rem 1rem; }
body.tbn-dir-ltr .tbn-chip { padding: .55rem .55rem .55rem 1rem; }
body.tbn-dir-ltr .tbn-chip-link { padding: .5rem .6rem .5rem 1rem; }
body.tbn-dir-ltr .tbn-sd-list li { padding: .75rem .75rem .75rem 1rem; }

/* Forms. */
body.tbn-dir-ltr .tbn-form-field input, body.tbn-dir-ltr .tbn-form-field textarea, body.tbn-dir-ltr .tbn-form-field select,
body.tbn-dir-ltr .tbn-form-field input[type="tel"] { text-align: left; }
body.tbn-dir-ltr .tbn-form-field select { background-position: right 1rem center; padding-left: 1.1rem; padding-right: 2.75rem; }

/* Skip link, header underline, dropdown, mobile menu. */
body.tbn-dir-ltr .tbn-skip { right: auto; left: 1rem; }
body.tbn-dir-ltr .tbn-nav-link::after { transform-origin: left; }
body.tbn-dir-ltr .tbn-dropdown { right: auto; left: 0; }
body.tbn-dir-ltr .tbn-mobile-menu { background-image: radial-gradient(circle at 0% 0%, rgba(183,132,99,.25), transparent 55%); }

/* Socket notch + bead: "start" corner moves from right to left. */
body.tbn-dir-ltr .tbn-notch--ts { --tbn-npx: var(--tbn-nx); }
body.tbn-dir-ltr .tbn-notch--te { --tbn-npx: calc(100% - var(--tbn-nx)); }
body.tbn-dir-ltr .tbn-notch--bs { --tbn-npx: var(--tbn-nx); }
body.tbn-dir-ltr .tbn-notch--be { --tbn-npx: calc(100% - var(--tbn-nx)); }
body.tbn-dir-ltr .tbn-socket--ts { right: auto; left: calc(2rem - 1.75rem); }
body.tbn-dir-ltr .tbn-socket--te { left: auto; right: calc(2rem - 1.75rem); }
body.tbn-dir-ltr .tbn-sd-media-wrap .tbn-socket { right: auto; left: calc(2.4rem - 1.75rem); }
body.tbn-dir-ltr .tbn-svc-socket-anchor .tbn-bead { left: auto; right: calc(2.1rem - 1.75rem); }

/* Arch frame + hero visual. */
body.tbn-dir-ltr .tbn-arch-line { inset: -1rem -1rem 1rem 1rem; }
body.tbn-dir-ltr .tbn-hero-visual { padding: 1rem 0 0 1rem; }
body.tbn-dir-ltr .tbn-anim-left { animation-name: tbn-slide-r; }
body.tbn-dir-ltr .tbn-anim-right { animation-name: tbn-slide-l; }
body.tbn-dir-ltr .tbn-hero-float { right: auto; left: -1rem; padding: .85rem 1.4rem .85rem 1.1rem; }
@media (min-width: 1024px) { body.tbn-dir-ltr .tbn-hero-float { left: -3rem; } }
body.tbn-dir-ltr .tbn-hero-coords { left: auto; right: -.5rem; }
@media (max-width: 639px) { body.tbn-dir-ltr .tbn-hero-float { left: 0; } }

/* Features, about, services. */
body.tbn-dir-ltr .tbn-feature-num { left: auto; right: 1.5rem; }
body.tbn-dir-ltr .tbn-about-visual { padding: 1rem 1rem 0 0; }
body.tbn-dir-ltr .tbn-about-visual .tbn-arch-line { inset: 0 1rem -1rem -1rem; }
body.tbn-dir-ltr .tbn-about-badge { left: auto; right: -.5rem; }
@media (min-width: 1024px) { body.tbn-dir-ltr .tbn-about-badge { right: -2.5rem; } }
body.tbn-dir-ltr .tbn-svc-cta-mark { left: auto; right: -2rem; }
body.tbn-dir-ltr .tbn-info-panel-mark { left: auto; right: -3rem; }
body.tbn-dir-ltr .tbn-page-hero-mark { left: auto; right: 4%; }

/* Image scrims: the dark side follows the text column. */
body.tbn-dir-ltr .tbn-stats-media::after { background: linear-gradient(270deg, rgba(15,26,35,.2) 0%, rgba(15,26,35,.88) 70%); }
body.tbn-dir-ltr .tbn-cta-box::before { -webkit-mask-image: linear-gradient(270deg, #000, transparent 70%); mask-image: linear-gradient(270deg, #000, transparent 70%); }
body.tbn-dir-ltr .tbn-page-hero-media::after {
	background:
		linear-gradient(270deg, rgba(15,26,35,.55) 0%, rgba(15,26,35,.92) 65%),
		linear-gradient(0deg, rgba(15,26,35,.85) 0%, rgba(15,26,35,0) 50%);
}

/* Timeline + process connector. */
body.tbn-dir-ltr .tbn-tl::before { right: auto; left: .7rem; }
body.tbn-dir-ltr .tbn-tl-item { padding-right: 0; padding-left: 2.75rem; }
body.tbn-dir-ltr .tbn-tl-dot { right: auto; left: 0; }
body.tbn-dir-ltr .tbn-process::before { right: auto; left: 2.25rem; }
@media (min-width: 1024px) {
	body.tbn-dir-ltr .tbn-tl::before { left: 50%; transform: translateX(-50%); }
	body.tbn-dir-ltr .tbn-tl-item { padding-left: 0; }
	body.tbn-dir-ltr .tbn-tl-dot { left: 50%; margin: -.75rem 0 0 -.75rem; }
	body.tbn-dir-ltr .tbn-process::before { left: 10%; right: 10%; background: linear-gradient(90deg, rgba(183,132,99,.8), rgba(183,132,99,.25)); }
}

/* Footer. */
body.tbn-dir-ltr .tbn-footer-heading::after { right: auto; left: 0; }

/* Projects lightbox: previous on the left, next on the right. */
body.tbn-dir-ltr .tbn-lightbox-close { left: auto; right: 1rem; }
body.tbn-dir-ltr .tbn-lightbox-prev { right: auto; left: 1rem; }
body.tbn-dir-ltr .tbn-lightbox-next { left: auto; right: 1rem; }

/* Contact page map card. */
@media (min-width: 768px) { body.tbn-dir-ltr .tbn-map-card { left: 1rem; right: auto; } }