.tf-logo-mark{width:36px;height:36px;border-radius:2px;background:#C8402B;position:relative;display:grid;place-items:center;flex:none;transform-origin:50% 50%}
.tf-logo-mark i{position:absolute;width:12px;height:12px;border:1.5px solid #E8A33D;border-radius:1px;transform-origin:50% 50%;will-change:transform;display:block}
.tf-logo-mark i:first-child{transform:translate(-3px,-3px)}
.tf-logo-mark i:last-child{transform:translate(3px,3px);border-color:#EDE7DE;opacity:.85}
.tf-logo-mark .tf-mark-fallback{display:none}

.tf-lang{display:flex;align-items:center;flex:none;gap:0}
.tf-lang .elementor-widget{width:auto!important;margin:0!important}
.tf-lang .elementor-button{border:0!important;background:transparent!important;color:#EDE7DE!important;opacity:.55;cursor:pointer;font-family:'IBM Plex Mono',monospace!important;font-size:.7rem!important;letter-spacing:.08em!important;padding:6px 9px!important;border-radius:0!important;transition:color .18s ease,opacity .18s ease}
.tf-lang .elementor-widget+.elementor-widget .elementor-button{border-left:1px solid #3A322B!important}
.tf-lang .elementor-button:hover{opacity:1}
.tf-lang .elementor-button[aria-pressed="true"]{color:#E8A33D!important;opacity:1}

/* ---- Hero frame: tabs, browser chrome, caption ---- */
.tf-tab .elementor-button{white-space:nowrap}
.tf-tab .tf-tab-ratio{color:#A9A096;margin-right:7px}
.tf-tab .tf-tab-label{font-family:'Instrument Sans',sans-serif;font-weight:600;font-size:13px;letter-spacing:0}
.tf-tab .elementor-button[aria-pressed="true"]{background:#EDE7DE!important;border-color:#EDE7DE!important;color:#16120F!important}
.tf-tab .elementor-button[aria-pressed="true"] .tf-tab-ratio{color:#C8402B}
.tf-tab .elementor-button[aria-pressed="true"] .tf-tab-label{color:#16120F}
.tf-frame{overflow:hidden;width:100%!important;transition:max-width .5s cubic-bezier(.65,0,.35,1)}
.tf-frame .elementor-widget-image,.tf-frame figure,.tf-frame .elementor-image{margin:0;line-height:0;height:100%}
.tf-halftone-src{width:100%!important;margin:0!important;display:block}
.tf-halftone-src img{width:100%!important;height:100%!important;object-fit:cover;display:block}
.tf-halftone-src canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.tf-cap{width:100%}
.tf-chrome{flex-direction:row!important;align-items:center!important}
.tf-chrome-url .elementor-heading-title{margin:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tf-cap-title .elementor-heading-title,.tf-cap-sub .elementor-heading-title,.tf-cap-ratio .elementor-heading-title{margin:0!important}
.tf-halftone-src{width:100%!important;margin:0!important}
.tf-halftone-src img{width:100%!important;display:block}

/* ---- Contact page ---- */
.tf-info-row{align-items:flex-start}
.tf-info-lab .elementor-heading-title{margin:0!important}
.tf-info-val .elementor-heading-title{margin:0!important}
.tf-info-icon{margin:0!important}
.tf-form-note p{margin:0!important}
.tf-map{overflow:hidden}
.tf-map iframe{display:block;width:100%}

/* WPForms: two-up row for email and phone, plus palette styling that
   the plugin's own stylesheet does not cover. */
.wpforms-container .wpforms-field{padding:0 0 14px 0!important}
.wpforms-container .wpforms-field-container{display:flex;flex-wrap:wrap;gap:0 16px}
.wpforms-container .wpforms-field{width:100%}
.wpforms-container .wpforms-one-half{width:calc(50% - 8px)!important;float:none!important;margin-left:0!important}
@media (max-width:640px){.wpforms-container .wpforms-one-half{width:100%!important}}
.wpforms-container .wpforms-field-label{margin:0 0 8px 0!important}
.wpforms-container select{
  appearance:auto;-webkit-appearance:auto;height:auto!important;min-height:52px;
  background:#0B0806!important;color:#EDE7DE!important;border:1.5px solid #3A322B!important;border-radius:3px!important;
  font-family:'Instrument Sans',sans-serif!important;padding:14px 16px!important;
}
.wpforms-container textarea{min-height:132px!important;resize:vertical}
.wpforms-container .wpforms-required-label{color:#E7644A!important}
.wpforms-container .wpforms-submit-container{padding-top:6px!important}

/* ---- ScrollExpand: featured project ---- */
.tf-se-track{position:relative;overflow:visible}
.tf-se-stage{position:-webkit-sticky;position:sticky;top:0;overflow:hidden;width:100%}
.tf-se-frame{position:absolute!important;inset:0!important;width:100%!important;max-width:none!important;margin:0!important;overflow:hidden;will-change:clip-path;z-index:1}
.tf-se-frame .elementor-widget-container,.tf-se-frame figure,.tf-se-frame .elementor-image{height:100%;margin:0}
.tf-se-frame img{width:100%!important;height:100%!important;object-fit:cover;display:block;will-change:transform}
.tf-se-scrim{position:absolute;inset:0;background:#0B0806;opacity:0;pointer-events:none}
.tf-se-titlewrap{position:relative;z-index:3;will-change:transform,opacity;pointer-events:none;width:100%}
.tf-se-titlewrap .elementor-heading-title{font-size:var(--se-title,62px)!important;text-shadow:0 10px 46px rgba(0,0,0,.55)}
/* Caption is hidden until the frame is nearly open; without opacity 0
   here it sits over the photo from the start. The band has to size to
   its own content, otherwise the copy column overflows upward and the
   text ends up sitting above the dark strip. */
.tf-se-caption{position:absolute!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;
  z-index:4;opacity:0;width:auto!important;max-width:none!important;
  height:auto!important;min-height:0!important;
  display:flex!important;flex-direction:row!important;align-items:flex-end!important;
  justify-content:space-between!important;gap:clamp(16px,3vw,40px)!important;
  padding:clamp(24px,4vw,56px)!important;
  background:linear-gradient(to top, rgba(11,8,6,.94) 0%, rgba(11,8,6,.88) 55%, rgba(11,8,6,0) 100%);
  will-change:transform,opacity}
.tf-se-caption > *{align-self:flex-end;margin:0!important}
.tf-se-caption .elementor-widget{margin:0!important}
.tf-se-caption .elementor-heading-title{margin:0!important}
.tf-se-capbody p{margin:0!important;max-width:46ch}
@media (max-width:767px){
  .tf-se-caption{flex-direction:column!important;align-items:flex-start!important}
  .tf-se-caption > *{align-self:flex-start}
}
/* The caption's inner row, when Elementor wraps it in one. Both the
   element itself and its inner wrapper are covered, since which one
   carries the class depends on how the container was built. */
.tf-se-caption > .e-con-inner{
  max-width:1280px;margin-inline:auto;width:100%;
  display:flex;flex-direction:row;align-items:flex-end;justify-content:space-between;
  gap:clamp(16px,3vw,40px);padding:0!important;
}
.tf-se-caption .elementor-widget-button{width:auto!important;flex:0 0 auto!important;align-self:flex-end;margin:0!important}
.tf-se-caption .elementor-widget-button .elementor-button-wrapper{text-align:right}
.tf-se-caption .elementor-button{white-space:nowrap}
@media (max-width:767px){
  .tf-se-caption > .e-con-inner{flex-direction:column;align-items:flex-start;gap:16px}
  .tf-se-caption .elementor-widget-button .elementor-button-wrapper{text-align:left}
}
@media (prefers-reduced-motion:reduce){
  .tf-se-stage{position:static;height:auto!important}
  .tf-se-track{height:auto!important}
  .tf-se-frame{position:relative!important;inset:auto!important;clip-path:none!important}
  .tf-se-caption{position:static!important;opacity:1!important;background:transparent}
}

/* ---- Service detail blocks ---- */
.tf-svc-lede p,.tf-svc-item p{margin:0!important}
.tf-pills p{margin:0!important;display:flex;flex-wrap:wrap;gap:8px}
.tf-pill{
  display:inline-block;background:rgba(200,64,43,0.16);color:#E7644A;
  border-radius:3px;padding:7px 13px;
  font-family:Merriweather,Georgia,serif;font-size:15px;line-height:1.3;
}

/* ---- Timeline steps: amber dot on the rule, hairline between ---- */
.tf-flowline{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.tf-step-when .elementor-heading-title{margin:0!important}
.tf-step-body p{margin:0!important}
@media (max-width:767px){
  .tf-step-dot{margin-top:0!important}
}

/* ---- Footer ---- */
.tf-flink{margin:0!important}
.tf-flink p{margin:0!important}
/* The global text-editor link rule was painting every footer link red. */
.tf-flink a{color:#A9A096!important;text-decoration:none!important;border-bottom:0!important;transition:color .15s ease}
.tf-flink a:hover{color:#E8A33D!important}
.tf-fhead .elementor-heading-title{margin:0!important}
.tf-fbase p{margin:0!important}
.tf-fbase-right p{text-align:right}
@media (max-width:767px){.tf-fbase-right p{text-align:left}}

/* ---- Service rows: ratio frame, copy, price ---- */
.tf-ratio{width:100%!important}
.tf-ratio.tf-r-169{aspect-ratio:16/9;max-width:112px}
.tf-ratio.tf-r-916{aspect-ratio:9/16;max-width:64px;margin-inline:auto}
.tf-ratio.tf-r-32{aspect-ratio:3/2;max-width:112px}
.tf-ratio .elementor-widget-heading{margin:0!important}
.tf-ratio .elementor-heading-title{margin:0!important}
.tf-ratio-col{flex:none!important}
.tf-svc-desc p{margin:0!important;max-width:52ch}
.tf-price .elementor-heading-title{margin:0!important;white-space:nowrap}
.tf-price-sub .elementor-heading-title{margin:0!important;white-space:nowrap}
.tf-price-col{flex:none!important}
@media (max-width:760px){
  .tf-ratio.tf-r-169,.tf-ratio.tf-r-32{max-width:96px}
  .tf-ratio.tf-r-916{max-width:56px;margin-inline:0}
  .tf-price-col{align-items:flex-start!important}
  .tf-price .elementor-heading-title,.tf-price-sub .elementor-heading-title{text-align:left!important}
}

/* ---- Trust strip: 52px, serif label that wraps, spaced categories ---- */
.tf-trust-label{margin:0!important}
.tf-trust-label .elementor-heading-title{max-width:22ch;margin:0!important;font-family:Merriweather,Georgia,serif!important;font-size:14px!important;line-height:1.5!important;color:#A9A096!important}
.tf-trust-item{margin:0!important;width:auto!important}
.tf-trust-item .elementor-heading-title{margin:0!important;white-space:nowrap;font-family:Merriweather,Georgia,serif!important;font-size:15px!important;line-height:1.2!important;color:#8A8279!important}
@media (max-width:760px){
  .tf-trust-label .elementor-heading-title{max-width:none}
  .tf-trust-item .elementor-heading-title{font-size:14px!important}
}

/* CTA was breaking onto three lines in the narrow header column. */
.tf-cta-nowrap .elementor-button{white-space:nowrap!important}
.tf-cta-nowrap{width:auto!important;flex:none!important}

/* ---- Topbar: 38px utility strip, muted, not link-red ---- */
.tf-top{margin:0!important}
.tf-top p{margin:0!important;font-family:Merriweather,Georgia,serif!important;font-size:14px!important;line-height:1.2!important;color:#A9A096!important}
.tf-top a{color:#A9A096!important;border-bottom:0!important;text-decoration:none!important;font-family:Merriweather,Georgia,serif!important;font-size:14px!important}
.tf-top a:hover{color:#E8A33D!important}
.tf-topbar-con{padding-top:0!important;padding-bottom:0!important;min-height:38px!important}
.tf-topbar-con>.e-con-inner,.tf-topbar-inner{padding-top:0!important;padding-bottom:0!important;min-height:38px!important;align-items:center!important}

/* ---- Brand lockup: tight, no widget margins ---- */
.tf-brand-name .elementor-heading-title{margin:0!important;font-size:17px!important;line-height:1.15!important}
.tf-brand-sub .elementor-heading-title{margin:0!important;font-size:10px!important;line-height:1.2!important;letter-spacing:3.2px!important;color:#A9A096!important}
.tf-brand-name,.tf-brand-sub{margin:0!important}
.tf-logo-inner{margin:0!important}

/* ---- Nav bar: 78px, links sized to match the hand-coded build ---- */
.tf-navbar-con{padding-top:0!important;padding-bottom:0!important}
.tf-navbar-con>.e-con-inner,.tf-navbar-inner{padding-top:0!important;padding-bottom:0!important;min-height:78px!important;align-items:center!important}
.tf-nav{margin:0!important}
/* The 26px link padding was stacking on top of the 78px min-height and
   doubling the bar. Height now comes from the container alone. */
.tf-nav a{padding:0!important;line-height:1.2!important}
.tf-nav a::after{bottom:-9px!important}
.tf-nav ul,.tf-nav .xpro-menu{align-items:center!important}
/* Brand lockup sits tight: the wordmark and STUDIO are one unit. */
.tf-brand-name .elementor-heading-title,.tf-brand-sub .elementor-heading-title{margin:0!important}
.tf-brand-name+.tf-brand-sub{margin-top:1px!important}
@media (max-width:900px){
  .tf-navbar-con>.e-con-inner,.tf-navbar-inner{min-height:66px!important}
  .tf-topbar-con{display:none!important}
}

/* Header nav: horizontal, palette, no theme chrome. */
.tf-nav ul,.tf-nav .xpro-menu,.tf-nav .xpro-horizontal-menu{display:flex!important;flex-wrap:wrap;align-items:center;gap:clamp(10px,1.6vw,26px);list-style:none;margin:0;padding:0;justify-content:center}
.tf-nav li{list-style:none}
.tf-nav a{position:relative;display:block;text-decoration:none!important;color:#EDE7DE!important;opacity:.7;font-family:'Instrument Sans',sans-serif!important;font-size:15px!important;font-weight:500!important;padding:26px 0!important;background:transparent!important;transition:opacity .15s ease,color .15s ease}
.tf-nav a::after{content:"";position:absolute;left:0;right:0;bottom:20px;height:2px;background:#E8A33D;transform:scaleX(0);transform-origin:left center;transition:transform .22s cubic-bezier(.22,1,.36,1)}
.tf-nav a:hover{opacity:1}
.tf-nav a:hover::after{transform:scaleX(1);opacity:.45}
.tf-nav li.current-menu-item>a,.tf-nav li.current_page_item>a{opacity:1;color:#EDE7DE!important}
.tf-nav li.current-menu-item>a::after,.tf-nav li.current_page_item>a::after{transform:scaleX(1);opacity:1}
@media (max-width:900px){.tf-nav a{padding:12px 0!important}}

.tf-kicker .elementor-heading-title{display:inline-flex;align-items:center;gap:12px}
.tf-kicker .elementor-heading-title::before{content:"";width:26px;height:1px;background:currentColor;opacity:.55;flex:none}
.dt-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;user-select:none;-webkit-user-select:none}
.dt-off{opacity:.42}
.dt-on{opacity:1}

.text-loop{position:relative;display:inline-grid;justify-items:start;vertical-align:baseline;overflow:hidden;padding-block:.16em;margin-block:-.16em;perspective:640px;transition:width .55s cubic-bezier(.22,1,.36,1)}
.text-loop>span{grid-area:1/1;display:block;white-space:nowrap;transform-origin:50% 50%;backface-visibility:hidden;opacity:0}
.text-loop>span.is-live{opacity:1}
.tf-em{color:#E8A33D;position:relative;font-style:normal}
.tf-em::after{content:"";position:absolute;left:0;right:0;bottom:.04em;height:.1em;background:#C8402B;z-index:-1;border-radius:2px}

.tf-star .elementor-button{position:relative;overflow:hidden;isolation:isolate}
.tf-star .elementor-button .tf-edge{position:absolute;width:300%;height:50%;opacity:.55;border-radius:50%;z-index:0;pointer-events:none;display:block}
.tf-star .elementor-button .tf-edge-b{bottom:-11px;right:-250%;animation:tf-star-b linear infinite alternate}
.tf-star .elementor-button .tf-edge-t{top:-11px;left:-250%;animation:tf-star-t linear infinite alternate}
@keyframes tf-star-b{0%{transform:translate(0,0);opacity:1}100%{transform:translate(-100%,0);opacity:0}}
@keyframes tf-star-t{0%{transform:translate(0,0);opacity:1}100%{transform:translate(100%,0);opacity:0}}

.tf-halftone{position:relative;cursor:crosshair;touch-action:none;overflow:hidden}
.tf-halftone canvas{position:absolute;inset:0;width:100%;height:100%;display:block;transition:opacity .24s ease}
.tf-halftone .elementor-widget-image{opacity:0}
.tf-halftone.tf-no-gl .elementor-widget-image{opacity:1}
.tf-hint{display:block;margin-top:12px;font-family:Merriweather,Georgia,serif;font-size:.82rem;color:#A9A096}
.tf-hint b{color:#E7644A;font-weight:400}

.click-spark{position:fixed;inset:0;z-index:9999;pointer-events:none;display:block}
/* Page-length ribbon: above section backgrounds, below their content.
   Hidden under 1360px, where the 1280 content column leaves no gutter
   for it to run through without crossing the copy. */
.tf-ribbon{position:absolute;left:0;width:100%;z-index:3;pointer-events:none;overflow:visible;opacity:.92}
.tf-ribbon path{stroke:#C8402B;fill:none;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:1379px){.tf-ribbon{display:none}}

/* Hero stroke: sits behind the copy and the frame, bleeding off the
   right edge the way the hand-coded build does. */
.tf-stroke{position:absolute;top:-8%;right:-14%;width:min(1040px,112%);height:auto;z-index:0;pointer-events:none;overflow:visible;opacity:.9}
.tf-stroke path{stroke:#C8402B;stroke-width:9;fill:none;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:900px){.tf-stroke{display:none}}
.tf-stroke{position:absolute;top:-6%;right:-14%;width:min(1040px,112%);height:auto;z-index:0;pointer-events:none;overflow:visible;opacity:.85}
@media (max-width:900px){.tf-stroke{display:none}}

@media (prefers-reduced-motion:reduce){
.text-loop{width:auto!important;transition:none}
.text-loop>span{display:none}
.text-loop>span.is-live{display:block;opacity:1}
.tf-star .elementor-button .tf-edge{display:none}
}